/* Wallpapers di Gippittino: raccolta originale desktop e smartphone. */
.wallpaper-hero { position: relative; min-height: 33rem; display: grid; align-items: end; padding: clamp(5rem, 10vw, 8rem) max(1.25rem, calc((100vw - 1152px) / 2)); overflow: hidden; background: linear-gradient(90deg, rgba(3, 13, 33, .95) 0%, rgba(4, 18, 43, .72) 43%, rgba(4, 18, 43, .24) 72%), url('../img/wallpapers/gippittino-cantiere-desktop.png') center/cover; }
.wallpaper-hero > div { max-width: 42rem; }
.wallpaper-hero h1 { margin: .55rem 0 1rem; color: #fff; font: 800 clamp(2.5rem, 6vw, 5rem)/.98 "Sora", sans-serif; letter-spacing: -.06em; }
.wallpaper-hero .lead { color: #d5e5f4; }
.wallpaper-hero__badges { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: 1.6rem; }
.wallpaper-hero__badges span { padding: .48rem .65rem; color: #ccfbff; background: rgba(6, 149, 222, .18); border: 1px solid rgba(92, 233, 255, .42); border-radius: 999px; font: 700 .64rem/1 "Sora", sans-serif; letter-spacing: .1em; }
.wallpapers-collection { max-width: 1200px; }
.wallpaper-note { color: #99b6d3; font-size: .85rem; }
.wallpapers-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.3rem; }
.wallpaper-card:first-child, .wallpaper-card:nth-child(3) { grid-column: span 2; }
.wallpaper-card { position: relative; overflow: hidden; min-height: 27rem; border: 1px solid rgba(84, 218, 255, .28); border-radius: 1.25rem; background: #07172e; box-shadow: 0 1.5rem 4rem rgba(0, 0, 0, .22); }
.wallpaper-card img { width: 100%; height: 100%; min-height: 27rem; object-fit: cover; transition: transform .5s ease; }
.wallpaper-card:nth-child(2) img { object-position: center top; }
.wallpaper-card:hover img { transform: scale(1.035); }
.wallpaper-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(2, 8, 23, .96), rgba(2, 8, 23, .08) 65%); pointer-events: none; }
.wallpaper-card__body { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; padding: 1.55rem; }
.wallpaper-card__body p { margin: 0 0 .4rem; color: #62edff; font: 700 .68rem "Sora", sans-serif; letter-spacing: .1em; }
.wallpaper-card__body h2 { margin: 0; color: #fff; font: 700 clamp(1.35rem, 3vw, 2.05rem) "Sora", sans-serif; }
.wallpaper-card__body > span { display: block; max-width: 33rem; margin-top: .55rem; color: #c1d6e8; }
.wallpaper-card__body .button { margin-top: 1rem; }
.wallpaper-card__body .button b { font-size: 1.1rem; }
.wallpaper-rules { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem; align-items: center; padding: clamp(2.5rem, 6vw, 5.5rem) max(1.25rem, calc((100vw - 1152px) / 2)); background: linear-gradient(112deg, #102351, #07142e); }
.wallpaper-rules h2 { margin: .55rem 0 .8rem; color: #fff; font: 800 clamp(1.7rem, 4vw, 3rem)/1.08 "Sora", sans-serif; letter-spacing: -.045em; }
.wallpaper-rules p { max-width: 48rem; margin: 0; color: #b4c8df; line-height: 1.65; }
.wallpaper-rules > span { color: #65eaff; font-size: clamp(3rem, 8vw, 7rem); text-shadow: 0 0 2rem rgba(52, 224, 255, .5); }
.wallpapers-collection--future { background: transparent; }
.wallpaper-teaser { position: relative; display: grid; min-height: 26rem; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: stretch; max-width: none; padding: 0; overflow: hidden; background: #07162d; }
.wallpaper-teaser__art { min-height: 26rem; background: linear-gradient(90deg, transparent 44%, #07162d 100%), url('../img/wallpapers/gippittino-cantiere-desktop.png') center/cover; }
.wallpaper-teaser__copy { display: grid; align-content: center; justify-items: start; padding: clamp(2rem, 5vw, 5rem); background: radial-gradient(circle at 85% 35%, rgba(36, 206, 255, .12), transparent 17rem), #07162d; }
.wallpaper-teaser h2 { max-width: 12ch; margin: .4rem 0 .9rem; color: #fff; font: 800 clamp(2rem, 4vw, 3.65rem)/1 "Sora", sans-serif; letter-spacing: -.055em; }
.wallpaper-teaser p:not(.eyebrow) { max-width: 34rem; color: #b9cfe2; line-height: 1.65; }
@media (max-width: 780px) { .wallpaper-hero { min-height: 30rem; background-position: 62% center; } .wallpapers-grid, .wallpaper-teaser { grid-template-columns: 1fr; } .wallpaper-card:first-child, .wallpaper-card:nth-child(3) { grid-column: auto; } .wallpaper-card, .wallpaper-card img { min-height: 23rem; } .wallpaper-card:nth-child(2) { min-height: 31rem; } .wallpaper-card:nth-child(2) img { min-height: 31rem; } .wallpaper-rules { grid-template-columns: 1fr; } .wallpaper-rules > span { display: none; } .wallpaper-teaser__art { min-height: 19rem; background: url('../img/wallpapers/gippittino-cantiere-desktop.png') center/cover; } }
