:root{--red:#E24444;--red-deep:#B8312F;--ink:#202020;--ink-2:#161616;--paper:#F4F2EE}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:'IBM Plex Sans',system-ui,sans-serif;color:var(--ink);background:#fff;line-height:1.65;font-size:1.0625rem}
.font-display{font-family:'Archivo',system-ui,sans-serif;font-variation-settings:"wdth" 112;font-stretch:112%}
.font-mono{font-family:'IBM Plex Mono',ui-monospace,monospace}
.h-hero{font-size:clamp(2.5rem,6.4vw,5.9rem);line-height:.98;letter-spacing:-.035em;font-weight:800}
.h-page{font-size:clamp(2.3rem,5.4vw,4.6rem);line-height:1;letter-spacing:-.03em;font-weight:800}
.h-sec{font-size:clamp(1.9rem,3.8vw,3.25rem);line-height:1.05;letter-spacing:-.025em;font-weight:800}
.h-card{font-size:clamp(1.25rem,2vw,1.6rem);line-height:1.15;letter-spacing:-.015em;font-weight:700}
.lead{font-size:clamp(1.08rem,1.4vw,1.28rem);line-height:1.7}
.kicker{font-family:'IBM Plex Mono',monospace;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase}
.skew-bar{transform:skewX(-18deg)}
.grecaptcha-badge{visibility:hidden}
/* header */
#site-header{transition:box-shadow .3s ease,background-color .3s ease}
#site-header.scrolled{box-shadow:0 8px 30px -12px rgba(0,0,0,.25)}
.nav-link{position:relative}
.nav-link::after{content:"";position:absolute;left:0;right:100%;bottom:-6px;height:2px;background:var(--red);transition:right .3s ease}
.nav-link:hover::after,.nav-link[aria-current="page"]::after{right:0}
/* reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal-d1{transition-delay:.1s}.reveal-d2{transition-delay:.2s}.reveal-d3{transition-delay:.3s}
/* media */
.zoom{overflow:hidden}
.zoom img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.zoom:hover img,.zoom:focus-visible img{transform:scale(1.06)}
.lift{transition:transform .35s ease,box-shadow .35s ease}
.lift:hover{transform:translateY(-4px);box-shadow:0 24px 50px -24px rgba(0,0,0,.35)}
.btn-arrow svg{transition:transform .3s ease}
.btn-arrow:hover svg{transform:translateX(4px)}
.grain{background-image:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1px);background-size:22px 22px}
.blueprint{background-image:linear-gradient(rgba(32,32,32,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(32,32,32,.06) 1px,transparent 1px);background-size:44px 44px}
/* lightbox */
#lightbox{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;background:rgba(14,14,14,.94);padding:4rem 1rem}
#lightbox.open{display:flex}
#lightbox img{max-width:min(92vw,1400px);max-height:78vh;object-fit:contain;box-shadow:0 30px 80px rgba(0,0,0,.6)}
/* marquee */
.marquee{display:flex;gap:4rem;width:max-content;animation:marquee 40s linear infinite}
.marquee-wrap:hover .marquee{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
details summary::-webkit-details-marker{display:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none;transition:none}
  .zoom img,.lift,.btn-arrow svg{transition:none}
  .marquee{animation:none;flex-wrap:wrap;width:auto;justify-content:center}
}
@media (max-width:1023px){.marquee{gap:1.25rem}}