.hero picture{position:absolute;inset:0}
.hero-mobile-copy{display:none}
.scroll-cue{position:absolute;z-index:4;left:50%;bottom:24px;display:flex;flex-direction:column;align-items:center;gap:9px;color:#fff;text-decoration:none;text-transform:uppercase;font-size:8px;font-weight:700;letter-spacing:.22em;opacity:.72}
.scroll-cue i{width:1px;height:25px;background:#fff;transform-origin:top;animation:scrollLine 1.8s ease-in-out infinite}
.button{transition:background .25s cubic-bezier(.2,.7,.2,1),color .25s cubic-bezier(.2,.7,.2,1),transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s}
.button:active{transform:translateY(0) scale(.96)}
.button:hover,.button:focus-visible{background-image:radial-gradient(140px circle at var(--x,50%) var(--y,50%),rgba(255,255,255,.32),transparent 62%)}
.button:focus-visible,.main-nav a:focus-visible,.text-link:focus-visible,.category-card:focus-visible,.menu-toggle:focus-visible{outline:2px solid #fff;outline-offset:4px}
.category-card,.product-image{-webkit-tap-highlight-color:transparent}
.category-card:active img{transform:scale(1.05)}
.product-card:active img{transform:scale(1.05)}
.product-card{position:relative}
.product-card:after{content:"";position:absolute;left:0;right:100%;bottom:-13px;height:2px;background:var(--red);transition:right .45s cubic-bezier(.2,.7,.2,1)}
.product-card:hover:after,.product-card:active:after{right:0}
.category-card:focus-visible img{transform:scale(1.03)}
.main-nav a{position:relative}
.main-nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:1px;background:currentColor;transition:right .3s cubic-bezier(.2,.7,.2,1)}
.main-nav a:hover:after{right:0}
.whatsapp-float{animation:waPulse 3.2s ease-in-out infinite}
.whatsapp-float:hover,.whatsapp-float:focus-visible{animation:none}
footer p{line-height:1.8}
footer p strong{color:#fff;font-size:13px}
@media(max-width:900px){.site-header{padding-top:env(safe-area-inset-top);height:calc(68px + env(safe-area-inset-top))}.main-nav{padding-bottom:env(safe-area-inset-bottom)}.main-nav a{-webkit-tap-highlight-color:transparent;opacity:0;transform:translateX(-18px);transition:opacity .3s ease,transform .3s ease}.menu-open .main-nav a{opacity:1;transform:none}.menu-open .main-nav a:nth-child(1){transition-delay:.08s}.menu-open .main-nav a:nth-child(2){transition-delay:.13s}.menu-open .main-nav a:nth-child(3){transition-delay:.18s}.menu-open .main-nav a:nth-child(4){transition-delay:.23s}.menu-open .main-nav a:nth-child(5){transition-delay:.28s}.menu-open .main-nav a:nth-child(6){transition-delay:.33s}.menu-open .main-nav a:nth-child(7){transition-delay:.38s}.main-nav a:active{opacity:.55}}
@media(max-width:620px){
  .hero{padding-top:68px!important;aspect-ratio:auto!important;min-height:100svh!important;display:block!important;background:#080808}
  .hero picture{position:absolute;inset:68px 0 0}
  .hero-image{position:static!important;width:100%;height:100%!important;object-fit:cover!important;object-position:center top}
  .hero-mobile-copy{position:absolute;z-index:3;left:20px;right:20px;bottom:calc(42px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:flex-start;color:#fff}
  .hero-mobile-copy:before{content:"";position:fixed;pointer-events:none;inset:45% 0 0;background:linear-gradient(0deg,#050505 12%,transparent)}
  .hero-mobile-copy>*{position:relative}
  .hero-mobile-copy p{margin:0 0 13px;text-transform:uppercase;font-size:9px;font-weight:800;letter-spacing:.2em;animation:heroInV2 .65s ease .12s both}
  .hero-mobile-copy h1{margin:0;font-size:clamp(48px,15vw,68px);line-height:.88;letter-spacing:-.065em;animation:heroInV2 .7s ease .24s both}
  .hero-mobile-copy h1 strong{color:var(--red)}
  .hero-mobile-copy>span{font-size:13px;color:#ddd;margin:20px 0 22px;animation:heroInV2 .7s ease .38s both}
  .hero-mobile-copy .button{animation:heroInV2 .7s ease .52s both}
  .hero-mobile-cta,.scroll-cue{display:none!important}
  .whatsapp-float{right:calc(12px + env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom))}
}
@keyframes heroInV2{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes scrollLine{0%,100%{transform:scaleY(.25);opacity:.35}50%{transform:scaleY(1);opacity:1}}
@keyframes waPulse{0%,100%{box-shadow:0 8px 25px #0004,0 0 0 0 rgba(31,168,85,.55)}50%{box-shadow:0 8px 25px #0004,0 0 0 10px rgba(31,168,85,0)}}
@media(max-width:620px){.hero-mobile-copy:before{position:absolute;inset:-90px -20px -42px}}
@media(prefers-reduced-motion:reduce){.scroll-cue i{animation:none}.hero-mobile-copy>*{animation:none!important}.whatsapp-float{animation:none}}
