/* ===== Gen Z layer (loaded last): chunky neo-brutalist edges, hard offset shadows, stickers, marquee, punchy type ===== */
:root{--gz-ink:#1a0508;--gz-hard:4px 4px 0 var(--gz-ink)}
[data-theme=dark]{--gz-ink:#f0c15a}
/* type: big, heavy, tight */
.section h2{font-weight:900!important;letter-spacing:-.02em;line-height:1.05;font-size:clamp(2rem,5.2vw,3.4rem)!important;position:relative;display:inline-block;isolation:isolate}
.section h2::after{width:100%!important;height:8px!important;margin-top:6px!important;position:static;transform:none;opacity:1;border-radius:4px!important}
[dir=rtl] .section h2{letter-spacing:0;line-height:1.25}
.hero h1{font-weight:900;letter-spacing:-.03em}
/* chunky buttons: hard outline + offset shadow, they physically press down */
.btn,.card-quote,.card-share,.pf-tab,.gal-tab,.bt-btn,.qw-submit,.cb-send{border:2px solid var(--gz-ink)!important;box-shadow:var(--gz-hard)!important;transition:transform .15s,box-shadow .15s,background .2s!important;font-weight:800!important}
.btn:hover,.card-quote:hover,.card-share:hover,.pf-tab:hover,.gal-tab:hover{transform:translate(-2px,-2px)!important;box-shadow:6px 6px 0 var(--gz-ink)!important}
.btn:active,.card-quote:active,.card-share:active,.pf-tab:active,.gal-tab:active,.bt-btn:active{transform:translate(3px,3px)!important;box-shadow:0 0 0 var(--gz-ink)!important}
.btn.ghost{background:transparent}
/* cards & tiles: thick outline + hard gold shadow, tilt on hover */
.card.product,.bt,.aloc,.faq details,.stat{border:2px solid var(--gz-ink)!important;border-radius:18px!important;box-shadow:6px 6px 0 #c9962e!important;transition:transform .2s,box-shadow .2s!important}
.card.product{border-top-width:2px!important;border-image:none!important}
.card.product:hover,.bt:hover{transform:translate(-3px,-3px)!important;box-shadow:10px 10px 0 #c9962e!important}
.p-badge,.p-tag{border:2px solid var(--gz-ink);font-weight:800}
/* tags / chips wiggle and fill on hover */
.tags li{border:2px solid var(--gz-ink)!important;box-shadow:3px 3px 0 var(--gz-ink);font-weight:700;transition:transform .15s,background .15s}
.tags li:hover{transform:scale(1.06);background:#f0c15a!important;color:#1a0508!important}
/* sticker */
.sticker{position:absolute;z-index:3;top:16px;inset-inline-end:16px;padding:8px 14px;border-radius:999px;background:#f0c15a;color:#1a0508;border:2px solid #1a0508;box-shadow:3px 3px 0 #1a0508;font-weight:900;font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;transform:rotate(8deg);animation:stickerWobble 3.2s ease-in-out infinite}
@keyframes stickerWobble{0%,100%{transform:rotate(8deg)}50%{transform:rotate(-4deg) scale(1.06)}}
/* mobile: keep shadows smaller so layout doesn't feel heavy */
@media(max-width:520px){:root{--gz-hard:3px 3px 0 var(--gz-ink)}.card.product,.bt{box-shadow:4px 4px 0 #c9962e!important}}
@media(prefers-reduced-motion:reduce){.sticker{animation:none}}
/* fixes found in browser testing */
/* dark theme: every section gets a dark background (the old rule only darkened even-numbered ones, so adding sections made text unreadable) */
[data-theme=dark] .section:not(.cta-band){background:linear-gradient(180deg,#0b1224,#0e1830)!important}
/* bento: taller rows so product photos are visible; caption sits on a solid strip for legibility */
.bento{grid-template-rows:230px 230px 230px 170px;grid-auto-rows:auto}
.bt-cat{padding:0}
.bt-cat::before{display:none}
.bt-cat img{inset:0 0 58px 0;height:calc(100% - 58px);padding:12px}
.bt-cat .bt-txt{margin-top:auto;padding:10px 18px;min-height:58px;justify-content:center;background:linear-gradient(135deg,#5a0c14,#1c1040);border-top:2px solid var(--gz-ink)}
.bt-cat .bt-txt b{font-size:1rem}
.bt-lead::before{background:linear-gradient(180deg,transparent 10%,#0b1224f2 85%)}
@media(max-width:899px){.bento{grid-template-rows:none;grid-auto-rows:minmax(210px,auto)}}
@media(max-width:520px){.bento{grid-auto-rows:minmax(190px,auto)}.bt-cat{min-height:230px}}
