:root{
  --bg:#ffffff;
  --surface:#fafafa;
  --ink:#111111;
  --muted:#6e6e6e;
  --accent:#383838;
  --accent-ink:#ffffff;
  --line:rgba(17,17,17,.14);
  --font-display:"Archivo Black", system-ui, sans-serif;
  --font-body:"Inter", system-ui, sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  --radius:20px;
  --pad:clamp(1.25rem,4vw,4rem);
  --maxw:1180px;
}
:root{--radius:6px;--maxw:1320px;}:root{--font-display:"Archivo Black", system-ui, sans-serif;--font-body:"Inter", system-ui, sans-serif;}
/* AQSITE base - reset, tokens, type, buttons, hero, grain. Content stays visible without JS. */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{background:var(--bg);color:var(--ink);font-family:var(--font-body);font-size:clamp(16px,1.1vw,18px);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--accent);color:var(--accent-ink)}
a{color:inherit;text-decoration:none}
.container{width:min(var(--maxw),100% - var(--pad)*2);margin-inline:auto}
section{position:relative}
.section{padding:clamp(4.5rem,10vw,8rem) 0}
.kicker{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);font-weight:600}
h1,h2,h3{font-family:var(--font-display);font-weight:500;line-height:1.06;letter-spacing:-.01em}
h2{font-size:clamp(2.3rem,5.4vw,4.3rem)}
h3{font-size:1.3rem}
.lead{color:var(--muted);max-width:56ch;font-size:clamp(1rem,1.4vw,1.2rem)}
.section-head{display:grid;gap:1rem;margin-bottom:clamp(2.5rem,6vw,4.5rem)}

.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.95rem 1.9rem;border-radius:999px;font-weight:600;font-size:.95rem;border:1px solid transparent;cursor:pointer;will-change:transform;transition:background .45s var(--ease),color .45s var(--ease),border-color .45s var(--ease)}
.btn--primary{background:var(--accent);color:var(--accent-ink)}
.btn--primary:hover{background:var(--ink);color:var(--bg)}
.btn--ghost{border-color:var(--line)}
.btn--ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn:not([data-magnetic]):hover{transform:scale(1.04)}

/* film grain - per-vibe intensity (set by the shader engine as --grain) */
body::after{content:"";position:fixed;inset:-50%;z-index:999;pointer-events:none;opacity:var(--grain,.05);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='240' height='240' filter='url(%23n)' opacity='.6'/%3E%3C/svg%3E");animation:grain 9s steps(6) infinite}
@keyframes grain{0%,100%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-2%)}80%{transform:translate(3%,2%)}}

/* awwards tier: preloader + custom cursor */
.aq-pre{position:fixed;inset:0;z-index:200;background:var(--bg);display:grid;place-items:center;clip-path:inset(0 0 0 0);animation:aq-pre-failsafe 0s 8s forwards}
@keyframes aq-pre-failsafe{to{visibility:hidden}}
.aq-pre__inner{display:grid;gap:.6rem;justify-items:center}
.aq-pre__num{font-family:var(--font-display);font-weight:600;font-size:clamp(3rem,9vw,6rem);line-height:1;color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.aq-pre__brand{font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--muted);opacity:0;transition:opacity .8s ease}
@media (prefers-reduced-motion:reduce){.aq-pre{display:none}}

.aq-cursor-dot,.aq-cursor-ring{position:fixed;left:0;top:0;z-index:190;pointer-events:none;border-radius:50%}
.aq-cursor-dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--accent)}
.aq-cursor-ring{width:34px;height:34px;margin:-17px 0 0 -17px;border:1px solid var(--accent);opacity:.65;transition:width .25s,height .25s,margin .25s,opacity .25s,border-color .25s}
.aq-cursor-ring.aq-hot{width:52px;height:52px;margin:-26px 0 0 -26px;opacity:.95;border-color:var(--ink)}
/* Contextual cursor label - the Awwwards winner signature */
.aq-cursor-label{position:fixed;left:0;top:0;z-index:191;pointer-events:none;font-family:ui-monospace,monospace;font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin:22px 0 0 14px;opacity:0;transition:opacity .25s}
.aq-cursor-label.is-on{opacity:1}
@media (pointer:coarse){.aq-cursor-dot,.aq-cursor-ring,.aq-cursor-label{display:none}}

/* hero */
.hero{min-height:100svh;display:grid;align-content:center;padding:clamp(6rem,12vh,9rem) 0 clamp(4rem,8vh,6rem);overflow:hidden}
.hero--center .container{justify-items:center;text-align:center}


.hero .container{position:relative;z-index:2;display:grid;gap:1.5rem;justify-items:start}
.hero__kicker{margin-bottom:.3rem}
.hero__title{font-size:clamp(3.2rem,10vw,8.2rem);max-width:16ch;letter-spacing:-.03em}
.hero__word{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.hero__word-inner{display:inline-block}
.hero__title--grad{background:linear-gradient(94deg,var(--ink) 0%,var(--accent) 42%,var(--ink) 80%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.hero__sub{color:var(--muted);max-width:52ch;font-size:clamp(1rem,1.5vw,1.22rem)}
.hero__actions{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:.6rem}
.hero__cue{margin-top:clamp(2rem,6vh,4rem);display:flex;align-items:center;gap:.8rem;font-size:.72rem;letter-spacing:.25em;text-transform:uppercase;color:var(--muted)}
.hero__cue-line{display:block;width:1px;height:44px;background:linear-gradient(var(--accent),transparent);animation:cue 2.2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* aurora blobs */
.aurora{position:absolute;z-index:1;filter:blur(70px);opacity:.5;pointer-events:none}
.aurora--1{width:52vw;height:52vw;top:-18%;right:-14%;background:radial-gradient(circle at 30% 30%,var(--accent),transparent 65%);animation:drift 16s ease-in-out infinite alternate}
.aurora--2{width:40vw;height:40vw;bottom:-16%;left:-10%;background:radial-gradient(circle at 60% 40%,var(--accent),transparent 62%);opacity:.35;animation:drift 20s ease-in-out infinite alternate-reverse}
/* The mesh atmosphere (Session 5 pattern mine): four color cells that drift,
   scale and blend behind the statement - Stripe-tier paint, pure CSS. */
.hero__mesh{position:absolute;inset:0;z-index:2;overflow:hidden;pointer-events:none}
.hero__mesh i{position:absolute;border-radius:50%;filter:blur(46px);opacity:.5;mix-blend-mode:screen;animation:aqmesh 22s ease-in-out infinite alternate}
body.vibe-calm .hero__mesh i,body.vibe-corporate .hero__mesh i,body.vibe-fresh .hero__mesh i,body.vibe-elegance .hero__mesh i,body.vibe-editorial .hero__mesh i{mix-blend-mode:multiply;opacity:.34}
.hero__mesh i:nth-child(1){width:44vw;height:44vw;top:-12%;left:-8%;background:radial-gradient(circle at 35% 35%,var(--accent),transparent 68%)}
.hero__mesh i:nth-child(2){width:36vw;height:36vw;top:6%;right:-12%;background:radial-gradient(circle at 60% 40%,var(--accent),transparent 64%);animation-delay:-6s}
.hero__mesh i:nth-child(3){width:40vw;height:40vw;bottom:-18%;left:22%;background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--accent) 42%,var(--ink)),transparent 66%);animation-delay:-11s}
.hero__mesh i:nth-child(4){width:28vw;height:28vw;bottom:4%;right:16%;background:radial-gradient(circle at 45% 55%,color-mix(in srgb,var(--accent) 62%,#ffffff),transparent 62%);animation-delay:-16s}
@keyframes aqmesh{0%{transform:translate(0,0) scale(1) rotate(0deg)}50%{transform:translate(4vw,-3vh) scale(1.12) rotate(8deg)}100%{transform:translate(-3vw,4vh) scale(.94) rotate(-6deg)}}
.hero--mesh .hero__gl,.hero--mesh .aurora{opacity:.35}
@keyframes drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(4vw,-3vw,0) scale(1.15)}}

/* shimmer sweep on primary buttons - original AQ effect */
.btn--primary{position:relative;overflow:hidden}
.btn--primary::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.32) 50%,transparent 68%);transform:translateX(-130%);animation:shimmer 3.4s var(--ease) infinite}
@keyframes shimmer{0%,55%{transform:translateX(-130%)}90%,100%{transform:translateX(130%)}}

/* 2026 motion tier: scroll progress + WebGL hero canvas */
.aq-progress{position:fixed;top:0;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;z-index:210;pointer-events:none}
.hero__gl{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.6;pointer-events:none}
.hero__gl + .hero .container, .hero .container{z-index:2}

/* Session 3 - the Porsche layer: engineered HUD, indices, micro-interactions */
.aq-hud{position:fixed;left:1.2rem;bottom:1.2rem;z-index:180;display:flex;gap:.85rem;font-family:ui-monospace,monospace;font-size:.62rem;letter-spacing:.18em;color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:.34rem .9rem;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);pointer-events:none}
.aq-hud span+span{border-left:1px solid var(--line);padding-left:.85rem}
.aq-hud span:last-child{color:var(--ink);font-weight:700}
@media (max-width:900px){.aq-hud{display:none}}
::selection{background:var(--accent);color:var(--accent-ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
html{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--accent) 45%,transparent) transparent}
::-webkit-scrollbar{width:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--accent) 40%,#232636);border-radius:999px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:var(--accent)}

/* Session 2 - the Igloo layer: atmosphere discipline + depth cards */
body.gl-on .aurora--1{opacity:.22}
body.gl-on .aurora--2{opacity:.14}
.card,.gallery__card,.shop__item{transition:box-shadow .5s var(--ease),border-color .5s var(--ease)}
.card:hover,.gallery__card:hover,.shop__item:hover{box-shadow:0 18px 50px rgba(0,0,0,.35);box-shadow:0 18px 50px rgba(0,0,0,.35),0 0 44px color-mix(in srgb,var(--accent) 16%,transparent)}

/* Session 1 - the Apple layer: hero film cluster, nav craft, type discipline */
.hero__cluster{position:absolute;inset:0;z-index:1;pointer-events:none}
.hero__shot{position:absolute;overflow:hidden;border-radius:18px;display:block;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.hero__shot img{width:100%;height:100%;object-fit:cover;display:block}
.hero__shot--1{width:min(34vw,420px);aspect-ratio:4/5;right:6vw;top:16vh}
.hero__shot--2{width:min(20vw,250px);aspect-ratio:3/4;right:calc(6vw + min(34vw,420px) + 2vw);top:34vh;opacity:.9}
.hero__shot--3{width:min(16vw,200px);aspect-ratio:1;right:10vw;bottom:12vh;opacity:.8}
@media (max-width:900px){.hero__cluster{opacity:.45}}
.nav{transition:transform .55s var(--ease),background .4s,border-color .4s}
.nav--hidden{transform:translateY(-110%)}
.nav--glass{background:rgba(11,12,18,.66);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
h1,h2,h3{text-wrap:balance}
.stat__num,.pgdash__stat b{font-variant-numeric:tabular-nums}
.section-head::after{content:"";display:block;width:46px;height:1px;background:var(--accent);margin-top:1.5rem}

/* AQSITE sections - story, statement, features, quotes, cta, footer */
.story__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2rem,6vw,5rem);align-items:start}
.story__media{position:sticky;top:12vh;aspect-ratio:4/5;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);display:grid;place-items:center;overflow:hidden}
.story__orb{width:58%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 200deg,var(--accent),transparent 40%,var(--accent) 70%,transparent);filter:blur(14px);animation:spin 18s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.story__counter{position:absolute;bottom:1.1rem;left:1.3rem;font-size:.75rem;letter-spacing:.3em;color:var(--muted)}
.story__steps{display:grid;gap:clamp(2.5rem,6vh,4.5rem)}
.story__step{position:relative;padding-left:clamp(1.6rem,3vw,2.6rem);border-left:1px solid var(--line);opacity:.35;transition:opacity .6s var(--ease)}
.story__step.is-active{opacity:1}
.story__step h3{margin:.9rem 0 .8rem}
.story__step p{color:var(--muted);max-width:44ch}
.story__num{font-size:.75rem;letter-spacing:.3em;color:var(--accent);font-weight:600}
@media(max-width:860px){.story__grid{grid-template-columns:1fr}.story__media{position:relative;top:0;aspect-ratio:16/10}}

.statement{border-block:1px solid var(--line);padding:clamp(4rem,9vw,7rem) 0;overflow:hidden}
.statement .container{display:grid;justify-items:center;text-align:center}
.statement p{font-family:var(--font-display);font-size:clamp(2rem,6.4vw,4.6rem);line-height:1.12;max-width:22ch}

.features__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.6rem,3vw,2.4rem);display:grid;gap:.7rem;align-content:start;transform-style:preserve-3d;transition:border-color .5s var(--ease)}
.card:hover{border-color:var(--accent)}
.card__tag{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);font-weight:600}
.card p{color:var(--muted);font-size:.95rem}

.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.quote{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:2rem;display:grid;gap:1.2rem}
.quote blockquote{font-family:var(--font-display);font-size:1.15rem;line-height:1.45}
.quote figcaption{font-size:.85rem;color:var(--muted)}
.quote strong{color:var(--ink)}

.cta{overflow:hidden}
.cta .container{display:grid;justify-items:center;text-align:center;gap:1.4rem;position:relative;z-index:2}
.cta h2{font-size:clamp(2.4rem,6vw,4.6rem);max-width:18ch}
.cta p{color:var(--muted);max-width:46ch}

.footer{border-top:1px solid var(--line);padding:2.4rem 0 3rem}
.footer .container{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;font-size:.85rem;color:var(--muted)}
.footer__brand{font-family:var(--font-display);color:var(--ink);font-size:1rem}

/* Session 3 - Porsche precision: engineered section indices + underline-draw links */
body{counter-reset:aqsec}
.section-head{position:relative}
.section-head::before{counter-increment:aqsec;content:"[" counter(aqsec,decimal-leading-zero) "]";position:absolute;right:0;top:.35rem;font-family:ui-monospace,monospace;font-size:.66rem;letter-spacing:.22em;color:var(--muted);opacity:.75}
.nav__link{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-size .45s var(--ease),color .3s}
.nav__link:hover{background-size:100% 1px}

/* brand marquee - original AQ component */
.marquee{border-block:1px solid var(--line);padding:2.1rem 0;overflow:hidden;white-space:nowrap}
.marquee__track{display:inline-flex;will-change:transform;animation:marquee 26s linear infinite}
.marquee__track span{display:inline-flex;align-items:center;gap:3.2rem;padding-right:3.2rem;font-family:var(--font-display);font-size:clamp(1.6rem,4vw,3rem);color:var(--muted)}
.marquee__track em{font-style:normal;color:var(--accent)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* showcase gallery (Swiper) */
.gallery .container{margin-bottom:clamp(2rem,5vw,3.5rem)}
.gallery__swiper{padding:0 var(--pad) 3rem;overflow:visible}
.gallery__slide{width:min(560px,84vw)}
.gallery__card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:clamp(1.8rem,4vw,3rem);min-height:300px;display:grid;align-content:end;gap:.8rem;transition:border-color .5s var(--ease)}
.gallery__card:hover{border-color:var(--accent)}
.gallery__num{font-family:var(--font-display);font-size:clamp(3.4rem,7vw,5.4rem);line-height:1;color:var(--accent)}
.gallery__card h3{font-size:clamp(1.5rem,2.6vw,2.1rem)}
.gallery__card p{color:var(--muted)}
.swiper-pagination-bullet{background:var(--muted);opacity:.4}
.swiper-pagination-bullet-active{background:var(--accent);opacity:1;width:22px;border-radius:999px}

/* lucide icons in feature cards */
.card__icon{width:22px;height:22px;color:var(--accent);margin-bottom:.4rem}
.card__icon svg{width:22px;height:22px}

/* hero particle field (tech/bold vibes) */
.hero__particles{position:absolute;inset:0;z-index:1;pointer-events:none}

/* stats (AQVERA) */
.stats__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:1rem}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.6rem;display:grid;gap:.3rem}
.stat__num{font-family:var(--font-display);font-size:clamp(2.2rem,4.5vw,3.4rem);line-height:1;color:var(--accent)}
.stat__label{font-size:.85rem;color:var(--muted)}
.stats__chart{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem;height:240px}
.stats__note{margin-top:1rem;font-size:.75rem;color:var(--muted)}

/* pricing tiers */
.tiers{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1rem;align-items:stretch}
.tier{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:2rem;display:grid;gap:1rem;align-content:start;position:relative;transform-style:preserve-3d}
.tier--featured{border-color:var(--accent)}
.tier__badge{position:absolute;top:1rem;right:1rem;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);font-weight:700}
.tier h3{font-size:1.4rem}
.tier__desc{color:var(--muted);font-size:.92rem}
.tier ul{list-style:none;display:grid;gap:.55rem;font-size:.92rem}
.tier li{padding-left:1.2rem;position:relative}
.tier li::before{content:"\2713";position:absolute;left:0;color:var(--accent)}

/* faq - pure CSS accordion */
.faq{display:grid;gap:.8rem;max-width:760px}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.2rem 1.4rem}
.faq summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";color:var(--accent);font-size:1.3rem;transition:transform .4s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin-top:.9rem;color:var(--muted);max-width:62ch}

/* contact (AQALMA) */
.contact{overflow:hidden}
.contact .container{display:grid;gap:1.4rem;max-width:720px;justify-items:center;text-align:center}
.contact h2{font-size:clamp(2.2rem,5.5vw,4rem);max-width:18ch}
.contact form{display:grid;gap:.8rem;width:100%;text-align:left}
.contact input,.contact textarea{width:100%;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.95rem 1.1rem;color:var(--ink);font:inherit;font-size:.95rem}
.contact input:focus,.contact textarea:focus{outline:none;border-color:var(--accent)}
.contact textarea{min-height:120px;resize:vertical}
.contact .btn{justify-self:start}
.form__note{font-size:.9rem;color:var(--accent);opacity:0;transition:opacity .5s var(--ease)}
.form__note.is-visible{opacity:1}

/* shop grid - editorial ecommerce (Zara-style) */
.shop__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.6rem 1.1rem}
.shop__media{position:relative;overflow:hidden;background:var(--surface);aspect-ratio:3/4}
.shop__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--ease)}
.shop__item:hover .shop__media img{transform:scale(1.045)}
.shop__tag{position:absolute;top:.6rem;left:.6rem;font-size:.58rem;letter-spacing:.2em;padding:.3rem .55rem;background:var(--ink);color:var(--bg)}
.shop__name{font-size:.84rem;letter-spacing:.08em;text-transform:uppercase;margin-top:.75rem;font-weight:500}
.shop__price{font-size:.78rem;color:var(--muted);margin-top:.1rem}

/* editorial vibe: stark uppercase minimalism */
.vibe-editorial .hero__title,.vibe-editorial .section-head h2,.vibe-editorial .statement__text{text-transform:uppercase;letter-spacing:.05em;font-weight:500}
.vibe-editorial .btn{border-radius:0}
.vibe-editorial .kicker{letter-spacing:.32em}
.vibe-editorial .marquee__track span{text-transform:uppercase;letter-spacing:.2em}

/* sticky glass nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:160;border-bottom:1px solid transparent;transition:border-color .5s var(--ease),background .5s var(--ease)}
.nav.is-scrolled{border-color:var(--line);backdrop-filter:blur(18px) saturate(1.6);-webkit-backdrop-filter:blur(18px) saturate(1.6);background:color-mix(in srgb,var(--bg) 74%,transparent)}
.nav__inner{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 0}
.nav__brand{font-family:var(--font-display);font-weight:600;font-size:1.1rem}
.nav__links{display:flex;gap:1.6rem;font-size:.9rem}
.nav__link{position:relative;padding-bottom:.15rem;color:var(--muted)}
.nav__link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.nav__link:hover{color:var(--ink)}
.nav__link:hover::after{transform:scaleX(1)}
.nav .btn{padding:.6rem 1.25rem;font-size:.85rem}
@media(max-width:760px){.nav__links{display:none}}

/* arrow buttons */
.btn__arrow{display:inline-block;transition:transform .45s var(--ease)}
.btn--arrow:hover .btn__arrow{transform:translateX(5px)}

/* cursor glow */
.aq-glow{position:fixed;top:-160px;left:-160px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,var(--accent),transparent 60%);opacity:.06;pointer-events:none;z-index:99}

/* spotlight cards - accent glow follows the cursor */
.card,.tier,.quote,.gallery__card,.member{position:relative}
.card::before,.tier::before,.quote::before,.gallery__card::before,.member::before{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--accent) 14%,transparent),transparent 65%);opacity:0;transition:opacity .4s var(--ease);pointer-events:none}
.card:hover::before,.tier:hover::before,.quote:hover::before,.gallery__card:hover::before,.member:hover::before{opacity:1}

/* team */
.team__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.member{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1.8rem;display:grid;gap:.5rem;align-content:start;transform-style:preserve-3d}
.member__avatar{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 18%,transparent);color:var(--accent);font-weight:700;font-size:1rem;margin-bottom:.6rem}
.member h3{font-size:1.1rem}
.member__role{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:600}
.member__bio{color:var(--muted);font-size:.92rem}

/* process timeline */
.timeline{position:relative;display:grid;gap:2.4rem;padding-left:1.6rem;max-width:720px}
.timeline::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:var(--line)}
.tl__step{position:relative}
.tl__dot{position:absolute;left:-1.6rem;top:.35rem;width:11px;height:11px;border-radius:50%;background:var(--accent)}
.tl__step h3{margin-bottom:.45rem}
.tl__step p{color:var(--muted);max-width:56ch}

@media (prefers-reduced-motion:reduce){
  .aurora,.hero__mesh i,.story__orb,.hero__cue-line,.marquee__track,body::after,.btn--primary::after{animation:none}
  .aq-glow{display:none}
}

/* awwards tier: burger + fullscreen menu overlay */
.nav__burger{display:none;background:none;border:1px solid var(--line);border-radius:8px;padding:10px 9px;cursor:pointer;flex-direction:column;align-items:center;gap:5px}
.nav__burger i{display:block;width:20px;height:2px;background:var(--ink);transition:transform .35s var(--ease),opacity .35s}
.nav__burger[aria-expanded="true"] i:first-child{transform:translateY(3.5px) rotate(45deg)}
.nav__burger[aria-expanded="true"] i:last-child{transform:translateY(-3.5px) rotate(-45deg)}
@media (max-width:820px){.nav__links,.nav__cta{display:none}.nav__burger{display:flex}}

.menu{position:fixed;inset:0;z-index:150;background:color-mix(in srgb,var(--bg) 92%,var(--accent));backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);display:grid;place-items:center;clip-path:inset(0 0 100% 0);visibility:hidden;transition:clip-path .7s cubic-bezier(.76,0,.24,1)}
.menu.is-open{clip-path:inset(0 0 0% 0);visibility:visible}
.menu__inner{display:grid;gap:1.2rem;justify-items:start;padding:0 8vw;max-width:720px}
.menu__kicker{font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--accent)}
.menu__links{display:grid;gap:.35rem}
.menu__links a{display:flex;align-items:baseline;gap:1.1rem;text-decoration:none;color:var(--ink);opacity:0;transform:translateY(26px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.menu.is-open .menu__links a{opacity:1;transform:none}
.menu.is-open .menu__links a:nth-child(1){transition-delay:.15s}
.menu.is-open .menu__links a:nth-child(2){transition-delay:.22s}
.menu.is-open .menu__links a:nth-child(3){transition-delay:.29s}
.menu.is-open .menu__links a:nth-child(4){transition-delay:.36s}
.menu.is-open .menu__links a:nth-child(5){transition-delay:.43s}
.menu__num{font-family:var(--font-display);font-size:.85rem;color:var(--accent);font-variant-numeric:tabular-nums}
.menu__word{font-family:var(--font-display);font-weight:500;font-size:clamp(2rem,6vw,3.4rem);line-height:1.1;transition:color .3s var(--ease),letter-spacing .4s var(--ease)}
.menu__links a:hover .menu__word{color:var(--accent);letter-spacing:.02em}
.menu.is-open ~ .nav, .menu.is-open{overflow:hidden}
@media (prefers-reduced-motion:reduce){.menu{transition:none}.menu__links a{opacity:1;transform:none}}

/* product spotlight - the premium product experience */
.product__wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.5rem,4vw,4rem);align-items:center}
.product__stage{position:relative;overflow:hidden;border-radius:var(--radius,20px);aspect-ratio:3/4;background:var(--surface)}
.product__stage img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease)}
.product__stage:hover img{transform:scale(1.05)}
.product__badge{position:absolute;top:1rem;left:1rem;background:var(--accent);color:var(--accent-ink);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;padding:.45rem .8rem}
.product__panel{display:grid;gap:1rem;justify-items:start}
.product__name{font-family:var(--font-display);font-weight:500;font-size:clamp(1.8rem,3.6vw,2.8rem);line-height:1.1;text-transform:uppercase;letter-spacing:.02em}
.product__story{color:var(--muted);max-width:46ch;line-height:1.65}
.product__price{font-family:var(--font-display);font-size:1.5rem;color:var(--ink)}
.product__sizes{display:flex;gap:.5rem;flex-wrap:wrap}
.product__size{background:none;border:1px solid var(--line);border-radius:2px;padding:.6rem .95rem;cursor:pointer;font:500 .82rem/1 var(--font-body);color:var(--ink);transition:border-color .3s,background .3s,color .3s}
.product__size:hover{border-color:var(--ink)}
.product__size.is-active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.product__actions{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:.4rem}
.product__ship{font-size:.78rem;color:var(--muted)}
.product__details{list-style:none;display:grid;gap:.45rem;margin-top:1rem;border-top:1px solid var(--line);padding-top:1.1rem}
.product__details li{font-size:.85rem;color:var(--muted);position:relative;padding-left:1.1rem}
.product__details li::before{content:"✦";position:absolute;left:0;color:var(--accent);font-size:.7rem;top:.22rem}
@media (max-width:820px){.product__wrap{grid-template-columns:1fr}}

/* quick view - bag-ready product modal */
.shop__quick{position:absolute;left:0;right:0;bottom:0;background:var(--ink);color:var(--bg);font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;text-align:center;padding:.75rem;transform:translateY(102%);transition:transform .4s var(--ease)}
.shop__item{cursor:pointer}
.shop__item:hover .shop__quick{transform:none}
.qv{position:fixed;inset:0;z-index:170;display:grid;place-items:center;padding:1.2rem;visibility:hidden;opacity:0;transition:opacity .4s ease,visibility .4s}
.qv.is-open{visibility:visible;opacity:1}
.qv__veil{position:absolute;inset:0;background:rgba(0,0,0,.62);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.qv__card{position:relative;display:grid;grid-template-columns:280px 1fr;gap:0;max-width:720px;width:100%;max-height:82vh;overflow:auto;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius,20px);transform:translateY(24px) scale(.97);transition:transform .5s var(--ease);box-shadow:0 40px 120px rgba(0,0,0,.5)}
.qv.is-open .qv__card{transform:none}
.qv__img{aspect-ratio:3/4;width:100%;object-fit:cover;display:block}
.qv__body{padding:1.8rem;display:grid;gap:.9rem;justify-items:start;align-content:start}
.qv__name{font-family:var(--font-display);font-size:1.5rem;font-weight:500;text-transform:uppercase;letter-spacing:.02em}
.qv__price{font-size:1.15rem;color:var(--accent)}
.qv__desc{font-size:.9rem;color:var(--muted);line-height:1.6;max-width:40ch}
.qv__sizes{display:flex;gap:.4rem;flex-wrap:wrap}
.qv__size{background:none;border:1px solid var(--line);border-radius:2px;padding:.5rem .8rem;cursor:pointer;font:500 .78rem/1 var(--font-body);color:var(--ink)}
.qv__size.is-active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.qv__close{position:absolute;top:.8rem;right:.8rem;background:var(--surface);border:1px solid var(--line);border-radius:999px;width:34px;height:34px;cursor:pointer;color:var(--ink);font-size:.85rem}
.qv__added{color:var(--accent);font-size:.8rem}
@media (max-width:640px){.qv__card{grid-template-columns:1fr}.qv__img{max-height:220px}}



/* ---- Definition pass: real people, defined products ---- */
.member__avatar{position:relative;overflow:hidden}
.member__avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shop__body{display:grid;gap:.15rem;justify-items:start;padding:0 .2rem}
.shop__cat{font-family:ui-monospace,monospace;font-size:.56rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent)}
.shop__blurb{font-size:.78rem;line-height:1.5;color:var(--muted)}

/* AQSITE archetypes - the layout DNA layer (original AQ work).
   A vibe paints the site; an archetype shapes it.
   Every block restyles the shared components into a different design system.
   Load AFTER sections.css - the arch-* classes override the base skeleton. */

/* ============ POSTER - Swiss typographic system ============ */
.arch-poster .aurora{display:none}
.arch-poster h1,.arch-poster h2{text-transform:uppercase;letter-spacing:-.015em}
.arch-poster .kicker{font-size:.66rem;letter-spacing:.3em}
.arch-poster .hero__title{font-size:clamp(3.2rem,11vw,9.5rem);line-height:.94;max-width:15ch;letter-spacing:-.025em}
.arch-poster .hero__sub{max-width:38ch}
.arch-poster .section{border-top:1px solid var(--line);padding:clamp(3.2rem,7vw,6rem) 0}
.arch-poster .section-head{grid-template-columns:auto 1fr;align-items:end;gap:1rem 2.5rem;margin-bottom:clamp(2rem,4vw,3.2rem)}
.arch-poster .section-head h2{max-width:20ch}
.arch-poster .btn{border-radius:0;padding:1rem 1.6rem}
.arch-poster .btn--ghost{border:1px solid var(--ink)}
.arch-poster .btn--primary::after{display:none}
.arch-poster .nav{border-bottom:1px solid var(--line)}
.arch-poster .nav__brand{font-size:.8rem;letter-spacing:.22em;text-transform:uppercase}
.arch-poster .nav__link{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase}
.arch-poster .nav .btn{font-size:.7rem;letter-spacing:.18em;text-transform:uppercase}
.arch-poster .marquee__track span{font-size:clamp(1rem,2vw,1.4rem);letter-spacing:.16em;text-transform:uppercase}
.arch-poster .statement p{text-align:left;max-width:26ch}
.arch-poster .card,.arch-poster .quote,.arch-poster .stat,.arch-poster .tier,.arch-poster .gallery__card,.arch-poster .member,.arch-poster .faq details,.arch-poster .stats__chart,.arch-poster .story__media{border-radius:0}
.arch-poster .contact .container,.arch-poster .cta .container{justify-items:start;text-align:left}
.arch-poster .contact input,.arch-poster .contact textarea{border-radius:0}

/* ============ SPLIT - split-screen studio ============ */
.arch-split .hero .container{grid-template-columns:1.06fr .94fr;grid-template-areas:"kick sub" "title sub" "title actions" "cue cue";column-gap:clamp(2.5rem,6vw,6rem);align-content:center}
.arch-split .hero__kicker{grid-area:kick}
.arch-split .hero__title{grid-area:title;font-size:clamp(2.7rem,6.4vw,5.6rem)}
.arch-split .hero__sub{grid-area:sub;border-left:1px solid var(--line);padding-left:clamp(1.4rem,3vw,2.6rem)}
.arch-split .hero--center .container{justify-items:start;text-align:left}
.arch-split .hero__actions{grid-area:actions}
.arch-split .hero__cue{grid-area:cue}
.arch-split .section-head{grid-template-columns:auto 1fr;align-items:end;gap:1rem 2.5rem}
.arch-split .section-head h2{max-width:18ch}
@media (max-width:860px){
  .arch-split .hero .container{grid-template-columns:1fr;grid-template-areas:"kick" "title" "sub" "actions" "cue"}
  .arch-split .hero__sub{border-left:0;padding-left:0}
}

/* ============ BRUTAL - neo-brutalist ============ */
.arch-brutal .aurora{display:none}
.arch-brutal h1,.arch-brutal h2,.arch-brutal h3{text-transform:uppercase;letter-spacing:.005em}
.arch-brutal .hero__title{font-size:clamp(2.7rem,9.6vw,8.2rem);line-height:.95;letter-spacing:-.01em}
.arch-brutal .kicker{display:inline-block;background:var(--accent);color:var(--accent-ink);padding:.45rem .7rem;border:2px solid var(--ink);border-radius:0;letter-spacing:.16em}
.arch-brutal .btn{border-radius:0;border:2px solid var(--ink);box-shadow:4px 4px 0 var(--accent)}
.arch-brutal .btn--ghost{background:transparent}
.arch-brutal .btn--primary::after{display:none}
.arch-brutal .btn:not([data-magnetic]):hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--accent)}
.arch-brutal .card,.arch-brutal .tier,.arch-brutal .quote,.arch-brutal .stat,.arch-brutal .gallery__card,.arch-brutal .member,.arch-brutal .faq details,.arch-brutal .stats__chart{border:2px solid var(--ink);border-radius:0}
.arch-brutal .card:hover,.arch-brutal .tier:hover,.arch-brutal .quote:hover,.arch-brutal .gallery__card:hover{box-shadow:6px 6px 0 var(--accent)}
.arch-brutal .marquee{border-block:3px solid var(--ink);background:var(--accent)}
.arch-brutal .marquee__track span{color:var(--accent-ink);text-transform:uppercase;font-weight:700}
.arch-brutal .marquee__track em{color:var(--ink)}
.arch-brutal .nav{border-bottom:2px solid var(--line)}
.arch-brutal .nav.is-scrolled{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}
.arch-brutal .nav__brand{letter-spacing:.04em;text-transform:uppercase}
.arch-brutal .statement{border-block:3px solid var(--ink)}
.arch-brutal .statement p{text-align:left;max-width:24ch}
.arch-brutal .aq-cursor-ring{border-radius:0}
.arch-brutal .contact input,.arch-brutal .contact textarea{border-radius:0;border:2px solid var(--line)}
.arch-brutal .contact .container,.arch-brutal .cta .container{justify-items:start;text-align:left}
.arch-brutal .product__size,.arch-brutal .qv__size{border:2px solid var(--ink);border-radius:0}

/* ============ MONO - terminal dossier ============ */
.arch-mono .aurora{display:none}
body.arch-mono{background-image:linear-gradient(color-mix(in srgb,var(--ink) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--ink) 5%,transparent) 1px,transparent 1px);background-size:44px 44px}
.arch-mono h1,.arch-mono h2,.arch-mono h3{letter-spacing:-.01em}
.arch-mono .kicker::before{content:"[ "}
.arch-mono .kicker::after{content:" ]"}
.arch-mono .kicker{letter-spacing:.06em}
.arch-mono .hero__title{font-size:clamp(2.1rem,6vw,4.6rem);line-height:1.08}
.arch-mono .hero__sub{max-width:46ch}
.arch-mono .btn{border-radius:2px;font-family:var(--font-body);padding:.85rem 1.5rem}
.arch-mono .btn--primary::after{display:none}
.arch-mono .nav{border-bottom:1px solid var(--line)}
.arch-mono .nav.is-scrolled{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}
.arch-mono .nav__brand{font-family:var(--font-body);font-size:.9rem}
.arch-mono .nav__brand::before{content:"~/"}
.arch-mono .menu{background:var(--bg);backdrop-filter:none;-webkit-backdrop-filter:none}
.arch-mono .statement p{font-family:var(--font-display);font-size:clamp(1.6rem,4.2vw,2.8rem);text-align:left;max-width:32ch}
.arch-mono .statement p::after{content:"_";color:var(--accent);animation:aq-blink 1.1s steps(1) infinite;margin-left:.08em}
@keyframes aq-blink{50%{opacity:0}}
.arch-mono .stat__num{font-variant-numeric:tabular-nums}
.arch-mono .marquee__track span{font-family:var(--font-display);letter-spacing:.06em}
.arch-mono .contact input,.arch-mono .contact textarea{border-radius:2px}
.arch-mono .contact .container,.arch-mono .cta .container{justify-items:start;text-align:left}

/* ============ MAGAZINE - editorial print ============ */
.arch-magazine h1,.arch-magazine h2{font-weight:400}
.arch-magazine .hero__title{font-size:clamp(2.9rem,7.6vw,6.4rem);line-height:1.04}
.arch-magazine .hero__word:nth-child(3n) .hero__word-inner{font-style:italic;color:var(--accent)}
.arch-magazine .section-head{border-bottom:1px solid var(--ink);padding-bottom:1.2rem;margin-bottom:clamp(2.4rem,5vw,4rem)}
.arch-magazine .lead::first-letter{font-family:var(--font-display);font-size:3em;line-height:.85;float:left;padding-right:.14em;color:var(--accent)}
.arch-magazine .statement p{text-align:left;font-style:italic;max-width:23ch}
.arch-magazine .statement p::first-letter{font-size:1.7em;color:var(--accent)}
.arch-magazine .marquee__track span{font-style:italic}
.arch-magazine .kicker{font-family:var(--font-body);font-size:.7rem;letter-spacing:.26em}
.arch-magazine .btn{border-radius:0}
.arch-magazine .btn--primary{background:transparent;color:var(--ink);border-bottom:2px solid var(--accent);padding-inline:.2rem}
.arch-magazine .btn--primary::after{display:none}
.arch-magazine .btn--primary:hover{background:transparent;color:var(--accent)}
.arch-magazine .btn--ghost{border:0;border-bottom:1px solid var(--line);padding-inline:.2rem}
.arch-magazine .btn--ghost:hover{border-color:var(--accent)}
.arch-magazine .card,.arch-magazine .quote,.arch-magazine .stat,.arch-magazine .tier,.arch-magazine .gallery__card,.arch-magazine .member,.arch-magazine .faq details,.arch-magazine .stats__chart,.arch-magazine .story__media{border-radius:0}
.arch-magazine .nav__brand{font-style:italic}
.arch-magazine .contact input,.arch-magazine .contact textarea{border-radius:0}

/* ============ KINETIC - energy and motion ============ */
.arch-kinetic .hero__title{font-size:clamp(3.4rem,11vw,10rem);line-height:.92;letter-spacing:-.02em}
.arch-kinetic .hero__word:nth-child(even) .hero__word-inner{color:transparent;-webkit-text-stroke:1.5px var(--ink)}
.arch-kinetic .hero__title--grad .hero__word:nth-child(even) .hero__word-inner{-webkit-text-stroke:0}
.arch-kinetic .kicker{letter-spacing:.42em}
.arch-kinetic .btn{clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px)}
.arch-kinetic .btn--primary::after{display:none}
.arch-kinetic .marquee{transform:rotate(-1.6deg) scale(1.03);border-block:0;padding:2rem 0;margin-block:1.5rem}
.arch-kinetic .marquee__track span{font-weight:700;text-transform:uppercase;font-size:clamp(1.7rem,3.6vw,3rem);letter-spacing:.02em}
.arch-kinetic .section-head h2{text-transform:uppercase;letter-spacing:.01em}
.arch-kinetic .statement p{text-transform:uppercase;letter-spacing:.01em;line-height:1.06}
.arch-kinetic .section{padding:clamp(4rem,9vw,7.5rem) 0}

/* ============ SOFT - fluid and floating ============ */
.arch-soft .hero__title{font-size:clamp(3rem,9vw,7.6rem);line-height:1.04;letter-spacing:-.02em}
.arch-soft .kicker{display:inline-block;background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent);padding:.45rem 1rem;border-radius:999px}
.arch-soft .aurora--1{width:64vw;height:64vw;opacity:.45}
.arch-soft .aurora--2{width:52vw;height:52vw;opacity:.4}
.arch-soft .section{padding:clamp(5rem,11vw,9rem) 0}
.arch-soft .card,.arch-soft .quote,.arch-soft .stat,.arch-soft .tier,.arch-soft .gallery__card,.arch-soft .member,.arch-soft .faq details,.arch-soft .stats__chart{border-color:transparent;box-shadow:0 30px 70px -34px color-mix(in srgb,var(--ink) 30%,transparent)}
.arch-soft .card:hover,.arch-soft .tier:hover,.arch-soft .quote:hover,.arch-soft .gallery__card:hover{border-color:transparent}
.arch-soft .btn--primary{box-shadow:0 16px 40px -18px color-mix(in srgb,var(--accent) 70%,transparent)}
.arch-soft .contact input,.arch-soft .contact textarea{border-radius:18px;border-color:transparent;box-shadow:0 10px 30px -18px color-mix(in srgb,var(--ink) 30%,transparent)}
.arch-soft .contact input:focus,.arch-soft .contact textarea:focus{border-color:var(--accent)}

/* ============ FRAME - gallery minimalism ============ */
.arch-frame .aurora{display:none}
.arch-frame .hero .container{justify-items:center;text-align:center;gap:1.8rem}
.arch-frame .hero__title{font-size:clamp(2.3rem,5.2vw,4rem);font-weight:400;max-width:24ch;line-height:1.15}
.arch-frame .hero__sub{max-width:42ch}
.arch-frame .hero__actions{justify-content:center}
.arch-frame .hero__cue{margin-inline:auto;justify-content:center}
.arch-frame .kicker{letter-spacing:.5em;font-size:.6rem}
.arch-frame .nav__brand{font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;font-family:var(--font-body)}
.arch-frame .nav__link{font-size:.66rem;letter-spacing:.28em;text-transform:uppercase}
.arch-frame .nav .btn{font-size:.64rem;letter-spacing:.22em;text-transform:uppercase}
.arch-frame .btn{border-radius:0;padding:.95rem 1.7rem}
.arch-frame .btn--primary{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.arch-frame .btn--primary::after{display:none}
.arch-frame .btn--primary:hover{background:var(--ink);color:var(--bg)}
.arch-frame .btn--ghost{border:0;border-bottom:1px solid var(--line);padding-inline:0}
.arch-frame .btn--ghost:hover{border-color:var(--accent)}
.arch-frame .section{padding:clamp(5rem,12vw,10rem) 0}
.arch-frame .section-head{justify-items:center;text-align:center}
.arch-frame .statement{border-block:0;border-top:1px solid var(--line)}
.arch-frame .statement p{font-style:italic;font-size:clamp(1.7rem,4.4vw,3.2rem);line-height:1.3}
.arch-frame .card,.arch-frame .quote,.arch-frame .stat,.arch-frame .tier,.arch-frame .member,.arch-frame .faq details,.arch-frame .stats__chart{border:0;border-top:1px solid var(--line);border-radius:0;background:transparent}
.arch-frame .gallery__card{background:transparent;border:1px solid var(--line);border-radius:0}
.arch-frame .contact input,.arch-frame .contact textarea{border-radius:0;background:transparent}
.arch-frame .footer{letter-spacing:.18em;text-transform:uppercase;font-size:.68rem}

@media (prefers-reduced-motion:reduce){.arch-mono .statement p::after{animation:none}}


/* FORMAT parts - shared blocks for the vertical templates */
.fxp__wrap{width:min(var(--maxw),100% - var(--pad)*2);margin-inline:auto}
.fx-chrome__brand{position:fixed;top:1.3rem;left:var(--pad);z-index:120;font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink);text-decoration:none}
.fx-chrome__meta{position:fixed;bottom:1.4rem;left:var(--pad);z-index:120;font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.fx-chrome__nav{position:fixed;top:1.35rem;right:var(--pad);z-index:121;display:flex;gap:1.4rem;flex-wrap:wrap;justify-content:flex-end}
.fx-chrome__nav a{font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color .3s}
.fx-chrome__nav a:hover{color:var(--accent)}
.fx-chrome__nav a.fx-chrome__nav-login{color:var(--accent)}
.fxp__label{font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;color:var(--accent);margin-bottom:2rem}
.fxp__block{border-top:1px solid var(--line);padding:clamp(3.5rem,10vh,7rem) 0}
.fxp__cover{min-height:100svh;display:grid;align-content:center;padding:14vh 0 10vh}
.fxp__cover-k{font-size:.66rem;letter-spacing:.4em;text-transform:uppercase;color:var(--accent);margin-bottom:2.2rem}
.fxp__cover-h{font-family:var(--font-display);font-weight:500;font-size:clamp(2.8rem,9vw,8rem);line-height:.98;letter-spacing:-.02em;max-width:18ch;margin-left:-.03em}
.fxp__cover-sub{color:var(--muted);max-width:46ch;margin-top:2.2rem;font-size:clamp(1rem,1.4vw,1.2rem)}
.fxp__row{display:grid;grid-template-columns:110px 200px 1fr;gap:1rem;padding:1.3rem 0;border-bottom:1px solid var(--line)}
.fxp__row-tag{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);padding-top:.35rem}
.fxp__row-name{font-family:var(--font-display);font-size:1.25rem}
.fxp__row-text{color:var(--muted);font-size:.95rem;max-width:52ch}
@media(max-width:760px){.fxp__row{grid-template-columns:1fr;gap:.3rem}}
.fxp__figs{display:grid}
.fxp__fig{display:grid;grid-template-columns:auto 1fr;gap:clamp(1.2rem,4vw,3rem);align-items:baseline;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.fxp__fig b{font-family:var(--font-display);font-size:clamp(2.2rem,5vw,3.8rem);line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.fxp__fig span{color:var(--muted)}
.fxp__fine{margin-top:1.4rem;font-size:.72rem;color:var(--muted)}
.fxp__step{display:grid;grid-template-columns:80px 1fr;gap:1.4rem;padding:1.5rem 0;border-top:1px solid var(--line)}
.fxp__step-no{font-family:var(--font-display);font-size:1.4rem;color:transparent;-webkit-text-stroke:1px var(--muted)}
.fxp__step h3{font-size:1.25rem;margin-bottom:.5rem}
.fxp__step p{color:var(--muted);max-width:52ch}
.fxp__note{border-bottom:1px solid var(--line)}
.fxp__note summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.3rem 0;font-weight:500}
.fxp__note summary::-webkit-details-marker{display:none}
.fxp__note summary i{font-style:normal;color:var(--accent);font-size:1.2rem;transition:transform .4s var(--ease)}
.fxp__note[open] summary i{transform:rotate(45deg)}
.fxp__note p{color:var(--muted);max-width:60ch;padding-bottom:1.4rem}
.fxp__voice-wrap{display:grid;justify-items:center;text-align:center;border-block:1px solid var(--line);padding:clamp(4rem,12vh,8rem) 0}
.fxp__voice{font-family:var(--font-display);font-size:clamp(1.7rem,4.4vw,3.2rem);line-height:1.2;max-width:26ch}
.fxp__voice-by{margin-top:1.4rem;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.fxp__statement{font-family:var(--font-display);font-size:clamp(2rem,6.4vw,5rem);line-height:1.08;max-width:22ch}
.fxp__end{border-top:1px solid var(--line);padding:clamp(6rem,18vh,11rem) 0 8rem}
.fxp__mail{display:inline-block;font-family:var(--font-display);font-size:clamp(1.7rem,5.4vw,4.4rem);line-height:1.1;border-bottom:2px solid var(--accent);padding-bottom:.15rem;transition:color .4s var(--ease),border-color .4s var(--ease);word-break:break-all}
.fxp__mail:hover{color:var(--accent);border-color:var(--ink)}
.fxp__end-sub{color:var(--muted);margin-top:1.6rem;max-width:46ch}
.fxp__foot{margin-top:clamp(3rem,8vh,5rem);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
/* TEMPLATE lookbook - the catalog page */
.fxk__brand{font-family:var(--font-display);font-weight:500;font-size:clamp(3rem,11vw,9.5rem);line-height:.94;text-transform:uppercase;letter-spacing:-.02em;margin-left:-.03em}
.fxk__count{margin-top:2.4rem;font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;color:var(--muted)}
section.fxk__grid-wrap{border-top:1px solid var(--line);padding:clamp(3.5rem,10vh,7rem) 0}
.fxk__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(2rem,4vw,3.5rem) clamp(1rem,2.5vw,2rem)}
@media(max-width:860px){.fxk__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.fxk__grid{grid-template-columns:1fr}}
.fxk__item{cursor:pointer}
.fxk__media{position:relative;overflow:hidden;aspect-ratio:3/4;background:var(--surface)}
.fxk__media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s var(--ease)}
.fxk__item:hover .fxk__media img{transform:scale(1.045)}
.fxk__no{position:absolute;top:.8rem;left:.8rem;font-size:.62rem;letter-spacing:.24em;color:var(--ink);mix-blend-mode:difference}
.fxk__peek{position:absolute;left:0;right:0;bottom:0;background:var(--ink);color:var(--bg);font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;text-align:center;padding:.7rem;transform:translateY(102%);transition:transform .4s var(--ease)}
.fxk__item:hover .fxk__peek{transform:none}
.fxk__meta{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-top:.7rem}
.fxk__meta h3{font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500}
.fxk__meta p{color:var(--muted);font-size:.82rem;font-variant-numeric:tabular-nums}
.fxk__spot{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.5rem,4vw,4rem);align-items:center;border-top:1px solid var(--line);padding:clamp(3.5rem,10vh,7rem) 0}
@media(max-width:820px){.fxk__spot{grid-template-columns:1fr}}
.fxk__spot-media{overflow:hidden;aspect-ratio:4/5;background:var(--surface)}
.fxk__spot-media img{width:100%;height:100%;object-fit:cover;display:block}
.fxk__spot-name{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,3.2rem);text-transform:uppercase;letter-spacing:.02em;margin-top:-.6rem}
.fxk__spot-price{font-family:var(--font-display);font-size:1.6rem;color:var(--accent);margin-top:.6rem;font-variant-numeric:tabular-nums}
.fxk__spot-desc{color:var(--muted);max-width:44ch;margin-top:1.2rem;line-height:1.65}
.fxk__spot-view{display:inline-block;margin-top:1.6rem;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:.4rem;cursor:pointer;transition:color .3s,border-color .3s}
.fxk__spot-view:hover{color:var(--ink);border-color:var(--ink)}
/* Definition pass: every product card carries its category and its line. */
.fxk__cat{margin-top:.5rem;font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:var(--accent)}
.fxk__blurb{margin-top:.3rem;font-size:.78rem;line-height:1.5;color:var(--muted);max-width:34ch}
/* AQSITE complete-site pages - header, footer, covers, listings, details.
   Shared by every format and every subpage. */

/* slim subpage header */
.pghead{position:fixed;top:0;left:0;right:0;z-index:160;transition:background .5s var(--ease),border-color .5s var(--ease);border-bottom:1px solid transparent}
.pghead.is-scrolled{background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5);border-color:var(--line)}
.pghead__inner{width:min(var(--maxw),100% - var(--pad)*2);margin-inline:auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.05rem 0}
.pghead__brand{font-family:var(--font-display);font-size:.95rem;font-weight:600;letter-spacing:.02em;text-decoration:none;color:var(--ink)}
.pghead__links{display:flex;gap:1.5rem;flex-wrap:wrap}
.pghead__links a{font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color .3s}
.pghead__links a:hover{color:var(--accent)}
.pghead__links a.is-active{color:var(--ink)}
@media(max-width:560px){.pghead__links{gap:1rem}.pghead__brand{font-size:.85rem}}

/* page cover (subpage hero) */
.pgcover{min-height:72svh;display:grid;align-content:end;padding:22vh 0 clamp(3rem,8vh,6rem)}
.pgcover__k{font-size:.66rem;letter-spacing:.4em;text-transform:uppercase;color:var(--accent);margin-bottom:2rem}
.pgcover__h{font-family:var(--font-display);font-weight:500;font-size:clamp(2.6rem,8vw,6.5rem);line-height:.98;letter-spacing:-.02em;max-width:16ch;margin-left:-.03em}
.pgcover__sub{color:var(--muted);max-width:46ch;margin-top:2rem;font-size:clamp(1rem,1.4vw,1.2rem)}
.pgblock{border-top:1px solid var(--line);padding:clamp(3.5rem,10vh,7rem) 0}
.pgstatement{border-block:1px solid var(--line);padding:clamp(4rem,12vh,8rem) 0}
.pgstatement__p{font-family:var(--font-display);font-size:clamp(1.9rem,5.4vw,4.2rem);line-height:1.1;max-width:22ch}

/* team rows */
.pg-team__row{display:grid;grid-template-columns:44px 72px 1fr;gap:1.4rem;padding:1.6rem 0;border-bottom:1px solid var(--line);align-items:start}
.pg-team__no{font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums;padding-top:.5rem}
.pg-team__avatar{width:72px;height:90px;border-radius:calc(var(--radius) * .6);overflow:hidden;background:color-mix(in srgb,var(--accent) 14%,transparent);flex:none}
.pg-team__avatar img{width:100%;height:100%;object-fit:cover;display:block}
@media (max-width:640px){.pg-team__row{grid-template-columns:32px 56px 1fr;gap:.9rem}.pg-team__avatar{width:56px;height:70px}}

/* about-page hero image */
.pg-heroimg{padding:0}
.pg-heroimg__img{width:100%;aspect-ratio:16/8;object-fit:cover;display:block;border-radius:var(--radius)}
.pg-team__row h3{font-size:1.3rem}
.pg-team__role{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--accent);margin:.4rem 0 .6rem}
.pg-team__bio{color:var(--muted);max-width:56ch}

/* services / collection listing rows */
.pg-items{display:grid}
.pg-item{display:grid;grid-template-columns:150px 44px 1fr auto 40px;gap:1.4rem;align-items:center;padding:1.6rem 0;border-bottom:1px solid var(--line);text-decoration:none;transition:padding-left .5s var(--ease)}
.pg-item:hover{padding-left:.8rem}
.pg-item__img{width:150px;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--surface)}
.pg-item__no{font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums}
.pg-item__name{display:block;font-family:var(--font-display);font-size:clamp(1.2rem,2.4vw,1.7rem);transition:color .3s}
.pg-item:hover .pg-item__name{color:var(--accent)}
.pg-item__blurb{display:block;color:var(--muted);font-size:.92rem;max-width:52ch;margin-top:.35rem}
.pg-item__price{font-family:var(--font-display);font-size:1.15rem;color:var(--accent);white-space:nowrap;font-variant-numeric:tabular-nums}
.pg-item__go{color:var(--accent);opacity:0;transform:translateX(-.6rem);transition:opacity .4s var(--ease),transform .5s var(--ease)}
.pg-item:hover .pg-item__go{opacity:1;transform:none}
@media(max-width:760px){.pg-item{grid-template-columns:96px 1fr;grid-template-rows:auto auto}.pg-item__img{grid-row:1/3;width:96px}.pg-item__no,.pg-item__go{display:none}.pg-item__price{grid-column:2}}
/* detail page */
.pg-detail{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(1.5rem,4vw,4rem);align-items:start}
@media(max-width:820px){.pg-detail{grid-template-columns:1fr}}
.pg-detail__imgwrap{overflow:hidden;background:var(--surface)}
.pg-detail__img{width:100%;display:block}
.pg-detail__price{font-family:var(--font-display);font-size:clamp(2rem,4.6vw,3.4rem);color:var(--accent);font-variant-numeric:tabular-nums}
.pg-detail__price-note{color:var(--muted);font-size:.9rem;margin-top:.6rem;max-width:38ch}
.pg-detail__cta{display:inline-block;margin-top:2rem;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:.5rem;transition:color .3s,border-color .3s}
.pg-detail__cta:hover{color:var(--accent);border-color:var(--ink)}
.pg-standard__row{display:grid;grid-template-columns:110px 1fr;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--line)}
.pg-standard__tag{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);padding-top:.4rem}
.pg-standard__row>span:last-child{color:var(--muted);font-size:.95rem;max-width:56ch}
.pg-relateds{display:grid;gap:0}
.pg-related{display:flex;justify-content:space-between;align-items:baseline;padding:1.3rem 0;border-bottom:1px solid var(--line);text-decoration:none;font-family:var(--font-display);font-size:clamp(1.2rem,2.6vw,1.9rem);transition:color .3s,padding-left .5s var(--ease)}
.pg-related:hover{color:var(--accent);padding-left:.8rem}

/* contact info rows */
.pg-info__row{display:grid;grid-template-columns:140px 1fr;gap:1rem;padding:1.2rem 0;border-bottom:1px solid var(--line)}
.pg-info__k{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted);padding-top:.35rem}
.pg-info__row a{color:var(--accent)}

/* rich footer */
.pgfoot{border-top:1px solid var(--line);margin-top:clamp(2rem,6vh,4rem)}
.pgfoot__inner{width:min(var(--maxw),100% - var(--pad)*2);margin-inline:auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:clamp(2rem,5vw,4rem);padding:clamp(3rem,8vh,5rem) 0 2.5rem}
@media(max-width:860px){.pgfoot__inner{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.pgfoot__inner{grid-template-columns:1fr}}
.pgfoot__brand{font-family:var(--font-display);font-size:clamp(1.6rem,3.4vw,2.4rem);color:var(--ink);text-decoration:none;line-height:1.05;display:inline-block}
.pgfoot__tag{color:var(--muted);margin-top:1rem;max-width:30ch}
.pgfoot__mail{display:inline-block;margin-top:1.6rem;font-size:.8rem;letter-spacing:.14em;color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:.3rem}
.pgfoot__col{display:grid;gap:.55rem;align-content:start;font-size:.85rem;color:var(--muted)}
.pgfoot__col-h{font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink);margin-bottom:.6rem}
.pgfoot__col a{color:var(--muted);text-decoration:none;transition:color .3s}
.pgfoot__col a:hover{color:var(--accent)}
.pgfoot__bar{border-top:1px solid var(--line);width:min(var(--maxw),100% - var(--pad)*2);margin-inline:auto;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:1.3rem 0 2.4rem;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.pgfoot__aq{color:var(--accent)}

/* header scroll state (shared runtime handles .nav; this handles .pghead) */

/* ============ AUTH (login / signup) ============ */
.pgauth{min-height:100svh;display:grid;place-items:center;padding:14vh 0 10vh}
.pgauth__card{width:min(460px,100%);border:1px solid var(--line);background:var(--surface);padding:clamp(1.8rem,4vw,2.8rem);display:grid;gap:1.3rem}
.pgauth__brand{font-family:var(--font-display);font-size:1.3rem;font-weight:600;text-decoration:none;color:var(--ink)}
.pgauth__k{font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:var(--accent)}
.pgauth__h{font-family:var(--font-display);font-weight:500;font-size:clamp(1.7rem,4vw,2.4rem);line-height:1.05;margin-top:-.6rem}
.pgauth__field{display:grid;gap:.45rem}
.pgauth__field label{font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--muted)}
.pgauth__field input{width:100%;background:var(--bg);border:1px solid var(--line);padding:.9rem 1rem;color:var(--ink);font:inherit;font-size:.95rem;border-radius:2px}
.pgauth__field input:focus{outline:none;border-color:var(--accent)}
.pgauth__submit{justify-self:start;display:inline-block;background:none;border:none;cursor:pointer;font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--accent);padding:0 0 .5rem;margin-top:.4rem;transition:color .3s,border-color .3s}
.pgauth__submit:hover{color:var(--accent);border-color:var(--ink)}
.pgauth__alt{font-size:.8rem;color:var(--muted)}
.pgauth__alt a{color:var(--accent);text-decoration:none;border-bottom:1px solid var(--accent)}
.pgauth__note{font-size:.72rem;color:var(--muted);border-top:1px solid var(--line);padding-top:1.1rem}

/* ============ DASHBOARD (member area) ============ */
.pgdash{display:grid;grid-template-columns:200px 1fr;gap:clamp(2rem,5vw,4.5rem);padding:16vh 0 8rem}
@media(max-width:820px){.pgdash{grid-template-columns:1fr}}
.pgdash__side{position:sticky;top:6rem;align-self:start;display:grid;gap:.2rem}
@media(max-width:820px){.pgdash__side{position:static;display:flex;flex-wrap:wrap;gap:1rem}}
.pgdash__side a{display:block;padding:.55rem 0;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);text-decoration:none;border-bottom:1px solid transparent;transition:color .3s,border-color .3s}
.pgdash__side a:hover{color:var(--accent)}
.pgdash__side a.is-active{color:var(--ink);border-color:var(--accent)}
.pgdash__side-out{color:var(--accent)}
.pgdash__main{display:grid;gap:clamp(2.5rem,6vh,4rem);align-content:start}
.pgdash__hello{font-family:var(--font-display);font-weight:500;font-size:clamp(1.9rem,4.6vw,3.4rem);line-height:1.05}
.pgdash__demo{font-size:.72rem;color:var(--muted);margin-top:.8rem;max-width:52ch}
.pgdash__stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:1rem}
.pgdash__stat{border:1px solid var(--line);padding:1.4rem;display:grid;gap:.4rem;align-content:start;background:var(--surface)}
.pgdash__stat b{font-family:var(--font-display);font-size:clamp(1.8rem,4vw,2.8rem);line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.pgdash__stat span{font-size:.78rem;color:var(--muted)}
.pgdash__sec{display:grid;gap:1rem}
.pgdash__sec-h{font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:var(--accent);margin-bottom:.4rem}
.pgdash__row{display:grid;grid-template-columns:1fr auto auto;gap:1.2rem;align-items:baseline;padding:1.2rem 0;border-bottom:1px solid var(--line)}
.pgdash__row-name{font-family:var(--font-display);font-size:1.15rem}
.pgdash__row-meta{font-size:.8rem;color:var(--muted)}
.pgdash__chip{font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--accent);border:1px solid var(--line);padding:.35rem .6rem;white-space:nowrap}
.pgdash__profile{border:1px solid var(--line);background:var(--surface);padding:1.8rem;display:grid;gap:1.1rem;max-width:520px}
.pgdash__profile .pgauth__field{max-width:420px}
.pgdash__saved{font-size:.74rem;color:var(--accent)}



/* ---- Definition pass: five precise columns + the honest bar ---- */
@media(min-width:861px){.pgfoot__inner{grid-template-columns:1.5fr 1fr 1.2fr 1.2fr 1fr}}
.pgfoot__socials{font-size:.78rem;line-height:1.5}
.pgfoot__note{font-family:ui-monospace,monospace;font-size:.6rem;letter-spacing:.14em;color:var(--muted);text-align:center}

