/* ============================================================
   ABOUT SPACES — css/style.css · FULL PRODUCTION REGENERATION
   Brand: indigo #23215C · lime #8FBE2F · mint #C9EA6E · porcelain
   Type:  Fraunces (display) · Space Grotesk (UI) · Space Mono (labels)
   ============================================================ */

:root{
  --ink:#23215C;         /* deep indigo */
  --ink-2:#1B1946;
  --em:#8FBE2F;          /* logo lime */
  --em-2:#6F9A1F;
  --mint:#C9EA6E;
  --sand:#F6F4EE;        /* porcelain */
  --sand-2:#ECE9DF;
  --cream:#FCFBF7;
  --brass:#7B79D6;       /* periwinkle accent */
  --terra:#5552B0;
  --line:rgba(35,33,92,.14);
  --line-l:rgba(246,244,238,.16);
  --f-disp:'Fraunces',Georgia,serif;
  --f-body:'Space Grotesk','Helvetica Neue',Arial,sans-serif;
  --f-mono:'Space Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
  --dur:.7s;
  --container:1340px;
  --pad:clamp(1.25rem,4vw,3rem);
  --r:20px;
  --sh:0 24px 60px rgba(35,33,92,.16);
}

/* ---------- Reset / base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:100px;-webkit-text-size-adjust:100%}
body{font-family:var(--f-body);font-weight:300;font-size:16px;line-height:1.65;color:var(--ink);background:var(--sand);overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
figure img{filter:saturate(1.08) contrast(1.02) sepia(.05)}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font:inherit;background:none;border:none;color:inherit;cursor:pointer}
::selection{background:var(--em);color:var(--ink)}
:focus-visible{outline:2px solid var(--em);outline-offset:3px}
/* Plaster grain overlay */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:120;opacity:.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.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E")}
html.preloading *,html.preloading *::before,html.preloading *::after{animation-play-state:paused !important}

.container{max-width:var(--container);margin-inline:auto;padding-inline:var(--pad)}
.section{padding-block:clamp(4.5rem,9vw,8.5rem);position:relative}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Depth / decor helpers ---------- */
.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;pointer-events:none;z-index:0}
.orb--em{background:radial-gradient(circle,rgba(143,190,47,.5),transparent 70%)}
.orb--brass{background:radial-gradient(circle,rgba(123,121,214,.45),transparent 70%)}
.pattern::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(45deg,rgba(143,190,47,.06) 0 2px,transparent 2px 16px);pointer-events:none}
.kanga{height:4px;background:linear-gradient(90deg,var(--em),var(--brass) 45%,var(--terra) 90%)}
.chip-glass{background:rgba(252,251,247,.82);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.65);border-radius:16px;box-shadow:0 16px 40px rgba(35,33,92,.18)}
.side-tag{position:absolute;top:5.5rem;right:1.1rem;writing-mode:vertical-rl;font-family:var(--f-mono);font-size:.58rem;letter-spacing:.42em;text-transform:uppercase;color:rgba(35,33,92,.35);z-index:2;user-select:none}
@media (max-width:1180px){.side-tag{display:none}}

/* Sparkling shimmer text */
.shimmer{font-style:italic;background:linear-gradient(110deg,var(--em-2) 15%,var(--em) 35%,var(--mint) 50%,var(--terra) 68%,var(--em-2) 85%);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shimmer 5.5s linear infinite}
@keyframes shimmer{to{background-position:200% 0}}

/* ---------- Type ---------- */
.eyebrow{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--em-2)}
.eyebrow.light{color:var(--mint)}
.sec-title{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.1rem,4.6vw,3.9rem);line-height:1.05;letter-spacing:-.01em;margin-top:1.1rem}
.sec-sub{max-width:46ch;color:rgba(35,33,92,.66);margin-top:1rem}
.sec-head{margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.sec-head.split{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap}
.anno{font-family:var(--f-mono);font-size:.64rem;letter-spacing:.12em;color:var(--em-2)}

/* Reveal-on-scroll */
[data-reveal]{opacity:0;transform:translateY(28px);transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
[data-reveal].in-view{opacity:1;transform:none}
/* Line-mask reveal */
.rl{display:block;overflow:hidden}
.rl>span{display:block;transform:translateY(115%);animation:riseUp 1.1s var(--ease) both}
.rl:nth-child(2)>span{animation-delay:.12s}
.rl:nth-child(3)>span{animation-delay:.24s}
@keyframes riseUp{to{transform:none}}
.mask .rl>span{animation:none;transform:translateY(115%);transition:transform 1s var(--ease)}
.mask.in-view .rl>span{transform:none}
.mask .rl:nth-child(2)>span{transition-delay:.12s}
.mask .rl:nth-child(3)>span{transition-delay:.24s}

/* ---------- Buttons ---------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:.9rem;padding:1.05rem 2rem;font-size:.68rem;font-weight:500;letter-spacing:.26em;text-transform:uppercase;border:1px solid transparent;border-radius:999px;overflow:hidden;isolation:isolate;transition:color .45s var(--ease),border-color .45s var(--ease),box-shadow .45s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease);z-index:-1}
.btn .arr{transition:transform .4s var(--ease)}
.btn:hover .arr{transform:translateX(6px)}
.btn:hover::before{transform:scaleY(1);transform-origin:top}
.btn--em{background:linear-gradient(120deg,var(--em-2),var(--em));color:var(--ink);box-shadow:0 14px 34px rgba(143,190,47,.35)}
.btn--em::before{background:var(--ink)}
.btn--em:hover{color:var(--mint)}
.btn--bone{background:var(--sand);border-color:var(--sand);color:var(--ink)}
.btn--bone::before{background:var(--em)}
.btn--bone:hover{color:var(--ink)}
.btn--ghost{border-color:rgba(246,244,238,.5);color:var(--sand)}
.btn--ghost::before{background:var(--sand)}
.btn--ghost:hover{color:var(--ink)}
.btn--ghost-cream{border-color:rgba(246,244,238,.5);color:var(--cream)}
.btn--ghost-cream::before{background:var(--cream)}
.btn--ghost-cream:hover{color:var(--ink)}
.btn--ghost-ink{border-color:var(--ink);color:var(--ink)}
.btn--ghost-ink::before{background:var(--ink)}
.btn--ghost-ink:hover{color:var(--sand)}
.link-arrow{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--em-2);padding-bottom:.45rem;border-bottom:1px solid rgba(111,154,31,.45);transition:gap .35s var(--ease),border-color .35s}
.link-arrow:hover{gap:1.1rem;border-color:var(--em)}

/* ---------- Rotating badge ---------- */
.badge{position:relative;width:118px;height:118px;display:grid;place-items:center;color:var(--ink)}
.badge svg{position:absolute;inset:0;animation:spin 16s linear infinite}
.badge text{font-family:var(--f-mono);font-size:10.5px;letter-spacing:.22em;fill:currentColor;text-transform:uppercase}
.badge-c{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--em),var(--em-2));color:var(--ink);display:grid;place-items:center;font-size:1.15rem;box-shadow:0 0 0 6px rgba(143,190,47,.2),0 12px 26px rgba(111,154,31,.4);transition:transform .45s var(--ease)}
.badge:hover .badge-c{transform:rotate(45deg) scale(1.06)}
.badge--cream{color:var(--cream)}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- Skip / progress / to-top ---------- */
.skip-link{position:fixed;top:-80px;left:1rem;z-index:220;background:var(--ink);color:var(--sand);padding:.9rem 1.4rem;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;transition:top .35s var(--ease)}
.skip-link:focus{top:1rem}
.progress-bar{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--em-2),var(--em),var(--brass));z-index:130}
.to-top{position:fixed;left:1.4rem;bottom:1.4rem;z-index:115;width:52px;height:52px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;background:var(--sand);color:var(--ink);font-size:1.05rem;opacity:0;transform:translateY(16px);pointer-events:none;transition:all .45s var(--ease)}
.to-top.is-show{opacity:1;transform:none;pointer-events:auto}
.to-top:hover{background:var(--em);color:var(--ink);border-color:var(--em)}

/* ---------- Header (light at top over dark hero, dark on scroll) ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;color:var(--sand);transition:background .5s var(--ease),color .5s var(--ease),box-shadow .5s}
.header-inner{display:flex;align-items:center;gap:2.4rem;padding-block:1.5rem;transition:padding .5s var(--ease)}
.site-header.is-scrolled{background:rgba(246,244,238,.92);backdrop-filter:blur(12px);box-shadow:0 1px 0 var(--line);color:var(--ink)}
.site-header.is-scrolled .header-inner{padding-block:.85rem}
/* Keep light while the indigo mobile menu is open */
.nav-open .site-header,.nav-open .site-header.is-scrolled{color:var(--sand)}
/* Accent polish over the dark hero */
.site-header:not(.is-scrolled) .logo-mark{color:var(--em)}
.site-header:not(.is-scrolled) .logo-word em{color:var(--mint)}
.site-header:not(.is-scrolled) .header-cta{border-color:rgba(246,244,238,.6)}
.site-header:not(.is-scrolled) .header-cta:hover{background:var(--em);border-color:var(--em);color:var(--ink)}

.logo{display:inline-flex;align-items:center;gap:.7rem;flex-shrink:0}
.logo-mark{width:32px;height:32px}
.logo-word{font-family:var(--f-disp);font-weight:600;font-size:1.02rem;letter-spacing:.01em;text-transform:lowercase;display:inline-flex;flex-direction:column;line-height:1.02;white-space:nowrap}
.logo-word em{font-style:normal;font-weight:500;color:var(--em-2)}
.logo--light{color:var(--sand)}
.main-nav{margin-left:auto}
.main-nav ul{display:flex;gap:2rem}
.main-nav a{position:relative;font-size:.68rem;font-weight:400;letter-spacing:.22em;text-transform:uppercase;padding:.4rem 0}
.main-nav a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;background:linear-gradient(90deg,var(--em),var(--brass));transform:scaleX(0);transform-origin:right;transition:transform .45s var(--ease)}
.main-nav a:hover::after,.main-nav a.is-active::after{transform:scaleX(1);transform-origin:left}
.header-cta{flex-shrink:0;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;border:1px solid currentColor;border-radius:999px;padding:.75rem 1.4rem;transition:all .4s}
.header-cta:hover{background:var(--em);border-color:var(--em);color:var(--ink);box-shadow:0 10px 26px rgba(143,190,47,.4)}
.burger{display:none;position:relative;width:44px;height:44px;z-index:112}
.burger span{position:absolute;left:10px;right:10px;height:1.5px;background:currentColor;transition:transform .45s var(--ease),top .45s var(--ease)}
.burger span:first-child{top:18px}.burger span:last-child{top:26px}
.nav-open .burger span:first-child{top:22px;transform:rotate(45deg)}
.nav-open .burger span:last-child{top:22px;transform:rotate(-45deg)}
.mobile-nav{position:fixed;inset:0;z-index:110;background:var(--ink);color:var(--sand);display:flex;flex-direction:column;justify-content:center;padding:var(--pad);visibility:hidden;opacity:0;transition:opacity .5s var(--ease),visibility 0s .5s}
.nav-open .mobile-nav{visibility:visible;opacity:1;transition:opacity .5s var(--ease)}
.mn-list li{overflow:hidden;border-bottom:1px solid var(--line-l)}
.mn-list a{display:flex;align-items:baseline;gap:1.2rem;padding:1.05rem 0;font-family:var(--f-disp);font-size:clamp(2rem,7vw,3rem);font-weight:300;transform:translateY(110%);transition:transform .7s var(--ease)}
.nav-open .mn-list a{transform:none}
.mn-list li:nth-child(1) a{transition-delay:.08s}.mn-list li:nth-child(2) a{transition-delay:.14s}.mn-list li:nth-child(3) a{transition-delay:.2s}.mn-list li:nth-child(4) a{transition-delay:.26s}.mn-list li:nth-child(5) a{transition-delay:.32s}.mn-list li:nth-child(6) a{transition-delay:.38s}
.mn-list a span{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.3em;color:var(--em)}
.mn-foot{margin-top:2.4rem;display:flex;gap:1.8rem;flex-wrap:wrap;font-family:var(--f-mono);font-size:.72rem;color:var(--brass)}

/* ---------- Hero (dark indigo) ---------- */
.hero{position:relative;background:var(--ink);color:var(--sand);padding-top:clamp(7.5rem,14vh,10rem);padding-bottom:clamp(3.5rem,7vh,5.5rem);overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;gap:clamp(2.5rem,6vw,6rem);align-items:center;position:relative;z-index:1}
.hero-kicker{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--mint);margin-bottom:1.8rem}
.hero-title{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.9rem,7.4vw,6rem);line-height:1;letter-spacing:-.02em}
.hero-copy{max-width:50ch;margin-top:1.8rem;color:rgba(246,244,238,.78)}
.hero-ctas{display:flex;gap:1rem;margin-top:2.3rem;flex-wrap:wrap}
.hero-meta{display:flex;gap:2.2rem;flex-wrap:wrap;margin-top:clamp(2.5rem,6vh,4rem);font-family:var(--f-mono);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(246,244,238,.55)}
.hm-scroll{display:inline-flex;align-items:center;gap:.7rem}
.hm-scroll i{width:1px;height:34px;background:var(--line-l);position:relative;overflow:hidden}
.hm-scroll i::after{content:"";position:absolute;left:0;top:-50%;width:100%;height:50%;background:var(--em);animation:scrollDot 2.2s var(--ease) infinite}
@keyframes scrollDot{to{top:110%}}
.hero-right{position:relative}
.hero-media{overflow:hidden;border-radius:26px;box-shadow:0 40px 90px rgba(0,0,0,.5);aspect-ratio:3/4;position:relative}
.hero-media img{width:100%;height:100%;object-fit:cover;animation:kenburns 14s var(--ease) both}
@keyframes kenburns{from{transform:scale(1.12)}to{transform:scale(1)}}
.hero-mini{position:absolute;left:-12%;bottom:10%;width:38%;border:8px solid var(--sand);border-radius:18px;overflow:hidden;transform:rotate(-4deg);box-shadow:0 26px 60px rgba(0,0,0,.45)}
.hero-chip{position:absolute;top:8%;right:-14px;padding:.9rem 1.2rem;text-align:left}
.hero-chip strong{display:block;font-family:var(--f-disp);font-size:1.5rem;font-weight:400;color:var(--em-2)}
.hero-chip span{font-family:var(--f-mono);font-size:.55rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(35,33,92,.6)}
.hero-right .badge{position:absolute;right:-26px;bottom:-34px}

/* ---------- Ticker ---------- */
.ticker{background:var(--ink-2);color:var(--sand);overflow:hidden;padding:.95rem 0;border-block:1px solid var(--line-l)}
.ticker-track{display:flex;width:max-content;animation:marquee 32s linear infinite}
.ticker-track span{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.32em;text-transform:uppercase;white-space:nowrap}
.ticker-track i{font-style:normal;color:var(--em);margin:0 1.4rem}
@keyframes marquee{to{transform:translateX(-50%)}}

/* ---------- Intro ---------- */
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,6rem);align-items:start}
.intro-media{margin-top:clamp(2rem,4vw,3.5rem);position:relative}
.intro-media img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);box-shadow:var(--sh)}
.intro-media figcaption{margin-top:.9rem}
.intro-copy{display:grid;gap:1.1rem;color:rgba(35,33,92,.76);font-size:1.05rem}
.intro-right .anno{display:block;margin-top:1.8rem}
.intro-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:2.2rem 0;border-block:1px solid var(--line);padding-block:1.4rem}
.intro-facts span{font-family:var(--f-disp);font-size:clamp(1.8rem,3vw,2.6rem);font-weight:300;color:var(--em-2)}
.intro-facts p{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(35,33,92,.55);margin-top:.3rem}

/* ---------- Featured projects ---------- */
.featured{background:var(--cream)}
.pgrid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(1rem,2.4vw,2rem)}
.proj{display:block;position:relative}
.proj figure{position:relative;overflow:hidden;height:100%;border-radius:var(--r);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 2px 4px rgba(35,33,92,.06),0 26px 60px rgba(35,33,92,.14)}
.proj figure::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(160deg,rgba(143,190,47,.3),rgba(35,33,92,.05) 55%,transparent 80%);opacity:0;transition:opacity .5s var(--ease)}
.proj:hover figure::after{opacity:1}
.proj img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3;transition:transform 1.1s var(--ease)}
.proj.tall img{aspect-ratio:3/4}
.proj:hover img{transform:scale(1.06)}
.p-num{position:absolute;top:.9rem;left:1rem;z-index:2;font-family:var(--f-mono);font-size:.6rem;letter-spacing:.24em;color:var(--cream);background:rgba(35,33,92,.68);backdrop-filter:blur(6px);padding:.4rem .6rem;border-radius:8px}
.proj figcaption{position:absolute;inset:auto .9rem .9rem .9rem;z-index:2;display:flex;flex-direction:column;justify-content:center;padding:1rem 1.2rem;border-radius:14px;background:rgba(252,251,247,.88);backdrop-filter:blur(12px);box-shadow:0 14px 34px rgba(35,33,92,.22);color:var(--ink);opacity:0;transform:translateY(14px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.proj:hover figcaption,.proj:focus-visible figcaption{opacity:1;transform:none}
.p-cat{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--em-2)}
.p-title{font-family:var(--f-disp);font-size:clamp(1.2rem,2vw,1.7rem);font-weight:300;margin:.3rem 0}
.p-view{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--em)}
.span-5{grid-column:span 5}.span-7{grid-column:span 7}
.offset{margin-top:clamp(2rem,5vw,5rem)}

/* ---------- Capabilities ---------- */
.serv-index li{border-top:1px solid var(--line)}
.serv-index li:last-child{border-bottom:1px solid var(--line)}
.serv-index a{display:grid;grid-template-columns:80px 1fr auto 44px;align-items:center;gap:1.5rem;padding:1.5rem .6rem;transition:background .45s var(--ease),color .45s var(--ease),padding .45s var(--ease)}
.serv-index a:hover{background:var(--em);color:var(--ink);padding-left:1.6rem}
.si-num{font-family:var(--f-mono);font-size:.72rem;color:var(--em)}
.serv-index a:hover .si-num{color:var(--ink)}
.serv-index h3{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.3rem,2.4vw,1.9rem)}
.si-tag{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(35,33,92,.5)}
.serv-index a:hover .si-tag{color:rgba(35,33,92,.8)}
.serv-index .arr{justify-self:end;transition:transform .4s var(--ease);color:var(--em)}
.serv-index a:hover .arr{transform:translateX(8px);color:var(--ink)}
.serv-float{position:fixed;top:0;left:0;width:min(300px,30vw);aspect-ratio:4/3;z-index:95;pointer-events:none;opacity:0;transition:opacity .35s var(--ease);overflow:hidden;border-radius:16px;border:3px solid var(--brass);box-shadow:0 30px 60px rgba(35,33,92,.3)}
.serv-float img{width:100%;height:100%;object-fit:cover}
.serv-float.is-on{opacity:1}

/* ---------- Manifesto ---------- */
.manifesto{background:var(--ink);color:var(--sand);overflow:hidden}
.m-title{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.3rem,5.8vw,4.8rem);line-height:1.1;letter-spacing:-.01em;margin-top:1.6rem;position:relative;z-index:1}
.m-title .rl{display:block}
.m-cols{margin-top:clamp(2.5rem,5vw,4rem);display:grid;grid-template-columns:repeat(4,1fr);gap:1.6rem clamp(1.5rem,3vw,3rem);position:relative;z-index:1}
.m-cols div{border-top:1px solid var(--line-l);padding-top:1.2rem}
.m-cols h4{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--em);margin-bottom:.7rem}
.m-cols p{font-size:.9rem;color:rgba(246,244,238,.7)}

/* ---------- Chapters ---------- */
.chapter-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}
.chapter-grid.reverse .chapter-media{order:2}
.chapter-media{overflow:hidden;border-radius:var(--r);box-shadow:var(--sh)}
.chapter-media img{width:100%;aspect-ratio:5/6;object-fit:cover}
.chapter-body p{margin-top:1.3rem;color:rgba(35,33,92,.74);max-width:52ch}
.chapter--ink{background:var(--ink);color:var(--sand)}
.chapter--ink .chapter-body p{color:rgba(246,244,238,.74)}
.type-list{margin:1.8rem 0 2.3rem;display:grid;grid-template-columns:1fr 1fr;gap:.75rem 1.5rem}
.type-list li{position:relative;padding-left:1.5rem;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase}
.type-list li::before{content:"";position:absolute;left:0;top:.55em;width:14px;height:2px;background:var(--em)}
.chapter--full{position:relative;overflow:hidden;color:var(--sand);min-height:88vh;display:flex;align-items:flex-end}
.cf-media{position:absolute;inset:0}
.cf-media img{width:100%;height:100%;object-fit:cover}
.chapter--full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(35,33,92,.2),rgba(111,154,31,.45) 60%,rgba(35,33,92,.85))}
.cf-inner{position:relative;z-index:2;padding-bottom:clamp(3rem,7vh,5rem)}
.cf-copy{margin-top:1.3rem;max-width:56ch;color:rgba(246,244,238,.88)}
.cf-inner .btn{margin-top:2.2rem}

/* ---------- Process stack ---------- */
.process{background:var(--cream)}
.stack{display:grid;gap:1.2rem;padding-bottom:2rem}
.stack-card{position:sticky;display:grid;grid-template-columns:170px 1fr auto;gap:2rem;align-items:center;background:var(--sand);border:1px solid var(--line);border-left:4px solid var(--em);border-radius:var(--r);padding:clamp(1.6rem,3vw,2.6rem);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 14px 40px rgba(35,33,92,.08);transition:border-color .4s,box-shadow .4s}
.stack-card:nth-child(1){top:100px}.stack-card:nth-child(2){top:112px}.stack-card:nth-child(3){top:124px}.stack-card:nth-child(4){top:136px}.stack-card:nth-child(5){top:148px}.stack-card:nth-child(6){top:160px}.stack-card:nth-child(7){top:172px}.stack-card:nth-child(8){top:184px}
.stack-card:nth-child(even){background:var(--sand-2)}
.stack-card.active{border-color:var(--em);box-shadow:0 24px 60px rgba(143,190,47,.25)}
.sc-num{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.6rem,5vw,4rem);line-height:1;color:transparent;-webkit-text-stroke:1px var(--em-2)}
.stack-card.active .sc-num{color:var(--em);-webkit-text-stroke:0}
.stack-card h3{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.4rem,2.4vw,2rem);margin-bottom:.4rem}
.stack-card p{font-size:.95rem;color:rgba(35,33,92,.7);max-width:56ch}
.sc-tag{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.26em;text-transform:uppercase;color:var(--em-2);white-space:nowrap}

/* ---------- Before / After ---------- */
.ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.5vw,2rem)}
.ba{margin:0}
.ba-view{position:relative;aspect-ratio:16/11;overflow:hidden;background:var(--ink);border-radius:var(--r);box-shadow:var(--sh);--pos:50%}
.ba-img,.ba-before,.ba-before img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-before{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba-handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:var(--cream);transform:translateX(-50%);pointer-events:none}
.ba-handle span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--em),var(--em-2));color:var(--ink);display:grid;place-items:center;font-size:.85rem;box-shadow:0 0 0 5px rgba(143,190,47,.28),0 8px 20px rgba(35,33,92,.4)}
.ba-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;-webkit-appearance:none;appearance:none}
.ba-range::-webkit-slider-thumb{-webkit-appearance:none;width:60px;height:100%}
.ba-tag{position:absolute;top:1rem;font-family:var(--f-mono);font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;background:rgba(35,33,92,.72);color:var(--sand);padding:.45rem .75rem;border-radius:8px;pointer-events:none}
.t-before{left:1rem}.t-after{right:1rem}
.ba figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-top:1.1rem}
.ba figcaption h3{font-family:var(--f-disp);font-weight:300;font-size:1.15rem}
.ba figcaption span{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.24em;text-transform:uppercase;color:var(--em-2)}

/* ---------- Materials ---------- */
.hg{position:relative}
.hg-arrows{display:flex;gap:.8rem}
.hg-btn{width:52px;height:52px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;font-size:1rem;transition:all .4s}
.hg-btn:hover{background:var(--em);border-color:var(--em);color:var(--ink);box-shadow:0 10px 26px rgba(143,190,47,.4)}
.hg-track{display:flex;gap:1.2rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.6rem;scrollbar-width:none;cursor:grab}
.hg-track::-webkit-scrollbar{display:none}
.hg-track:focus-visible{outline:2px solid var(--em);outline-offset:6px}
.hg-track.dragging{cursor:grabbing;scroll-snap-type:none}
.hg-track img{width:100%;object-fit:cover;pointer-events:none}
.mat-card{flex:0 0 236px;scroll-snap-align:start;margin:0;position:relative}
.mat-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(160deg,rgba(143,190,47,.3),transparent 70%);opacity:0;transition:opacity .5s var(--ease)}
.mat-card:hover::after{opacity:1}
.mat-card img{aspect-ratio:3/4;border-radius:118px 118px 16px 16px;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 26px 60px rgba(35,33,92,.14)}
.mat-i{position:absolute;top:.9rem;left:50%;transform:translateX(-50%);z-index:2;font-family:var(--f-mono);font-size:.56rem;letter-spacing:.24em;color:var(--cream);background:rgba(35,33,92,.68);padding:.35rem .6rem;border-radius:8px}
.mat-card figcaption{margin-top:.9rem;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--em-2);text-align:center}
.hg-bar{margin-top:1.4rem;height:1px;background:var(--line);position:relative}
.hg-bar span{position:absolute;left:0;top:-1px;height:3px;width:12%;background:linear-gradient(90deg,var(--em),var(--brass));transition:width .25s var(--ease)}

/* ---------- Viz ---------- */
.viz{background:var(--cream)}
.viz-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2.5rem,6vw,6rem);align-items:center}
.viz-steps{margin-top:2.2rem;display:grid;gap:.9rem}
.viz-steps li{display:flex;align-items:center;gap:1rem;font-family:var(--f-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase}
.viz-steps li span{color:var(--em-2)}
.viz-steps li:not(:last-child)::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---------- Why ---------- */
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.why-grid.three{grid-template-columns:repeat(3,1fr)}
.why-item{background:var(--cream);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.6rem,3vw,2.4rem);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 30px rgba(35,33,92,.06);transition:transform .45s var(--ease),box-shadow .45s,border-color .45s}
.why-item:hover{transform:translateY(-8px);border-color:var(--em);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 34px 70px rgba(143,190,47,.2)}
.wi-num{font-family:var(--f-mono);font-size:.68rem;color:var(--em)}
.why-item h3{font-family:var(--f-disp);font-weight:300;font-size:1.45rem;margin:.8rem 0 .5rem}
.why-item p{font-size:.92rem;color:rgba(35,33,92,.68)}

/* ---------- Stats ---------- */
.stats{background:linear-gradient(120deg,var(--em-2),var(--em) 60%,#A8D34A);color:var(--ink)}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center}
.stat{position:relative;z-index:1}
.stat::before{content:"";position:absolute;inset:-24% 6%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 62%);pointer-events:none;z-index:-1}
.stat-num{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.8rem,6vw,4.8rem);line-height:1;display:block;color:var(--ink)}
.stat-num i{font-style:normal;color:var(--cream)}
.stat-label{display:block;margin-top:.9rem;font-family:var(--f-mono);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:rgba(35,33,92,.78)}

/* ---------- Estimator ---------- */
.estimator{background:var(--sand)}
.est-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.est-field{margin-bottom:2.2rem}
.est-label{display:block;font-family:var(--f-mono);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--em-2);margin-bottom:1rem}
.est-types{display:flex;flex-wrap:wrap;gap:.6rem}
.est-types button{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:.75rem 1.3rem;transition:all .35s var(--ease)}
.est-types button:hover{border-color:var(--em)}
.est-types button.is-active{background:var(--em);border-color:var(--em);color:var(--ink);box-shadow:0 10px 26px rgba(143,190,47,.35)}
.est-finish{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem}
.est-finish button{position:relative;text-align:left;border:1px solid var(--line);border-radius:16px;background:var(--cream);padding:1.1rem 1.2rem;transition:all .4s var(--ease)}
.est-finish button strong{display:block;font-family:var(--f-disp);font-weight:300;font-size:1.2rem;margin-bottom:.3rem}
.est-finish button span{font-family:var(--f-mono);font-size:.55rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(35,33,92,.55)}
.est-finish button:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(35,33,92,.12)}
.est-finish button.is-active{border-color:var(--em);box-shadow:0 0 0 3px rgba(143,190,47,.18),0 18px 40px rgba(143,190,47,.2)}
.est-finish button.is-active::after{content:"✓";position:absolute;top:.8rem;right:.9rem;width:22px;height:22px;border-radius:50%;background:var(--em);color:var(--ink);display:grid;place-items:center;font-size:.7rem}
.est-size-row{display:flex;align-items:center;gap:1.2rem}
.est-size-row input[type=range]{flex:1;accent-color:var(--em);height:6px;cursor:pointer}
.est-val{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.12em;background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:.6rem 1rem;white-space:nowrap;color:var(--em-2)}
.est-result{position:sticky;top:110px;background:var(--ink);color:var(--sand);border-radius:26px;padding:clamp(2rem,4vw,2.8rem);overflow:hidden;box-shadow:0 40px 90px rgba(35,33,92,.35)}
.est-k{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--mint)}
.est-range{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.1rem,4vw,3.3rem);line-height:1.1;margin:.9rem 0 0}
.est-range i{font-style:normal;color:var(--brass)}
.est-break{margin-top:1.8rem;border-top:1px solid var(--line-l);padding-top:1.4rem;display:grid;gap:.6rem}
.est-break div{display:flex;justify-content:space-between;gap:1rem;font-family:var(--f-mono);font-size:.64rem;letter-spacing:.12em;color:rgba(246,244,238,.75)}
.est-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}
.est-note{margin-top:1.6rem;font-family:var(--f-mono);font-size:.55rem;letter-spacing:.1em;color:rgba(246,244,238,.45)}

/* ---------- Testimonials ---------- */
.t-carousel{max-width:920px;position:relative}
.t-carousel::before{content:"“";position:absolute;top:-4.2rem;left:-1.2rem;font-family:var(--f-disp);font-size:clamp(6rem,12vw,10rem);line-height:1;color:rgba(143,190,47,.2);pointer-events:none}
.t-viewport{overflow:hidden}
.t-track{display:flex;transition:transform .7s var(--ease)}
.t-slide{flex:0 0 100%;padding-right:1rem}
.t-slide p{font-family:var(--f-disp);font-style:italic;font-weight:300;font-size:clamp(1.4rem,2.8vw,2.15rem);line-height:1.35}
.t-slide footer{margin-top:1.8rem;display:flex;flex-direction:column;gap:.25rem}
.t-slide footer strong{font-weight:500;letter-spacing:.06em;font-size:.9rem}
.t-slide footer span{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--em-2)}
.t-controls{display:flex;align-items:center;gap:1.4rem;margin-top:2.4rem}
.t-btn{width:52px;height:52px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;transition:all .4s}
.t-btn:hover{background:var(--em);border-color:var(--em);color:var(--ink);box-shadow:0 10px 26px rgba(143,190,47,.4)}
.t-count{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.2em;color:var(--em-2)}

/* ---------- Journal ---------- */
.journal{background:var(--cream)}
.j-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.5vw,2rem)}
.j-card{overflow:hidden;background:var(--sand);border-radius:var(--r);border:1px solid var(--line);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 30px rgba(35,33,92,.06);transition:transform .45s var(--ease),box-shadow .45s}
.j-card:hover{transform:translateY(-8px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 34px 70px rgba(143,190,47,.16)}
.j-card a{display:block;height:100%}
.j-card img{width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform 1s var(--ease)}
.j-card:hover img{transform:scale(1.05)}
.j-feature{grid-column:span 3}
.j-feature a{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(1.5rem,3vw,3rem);align-items:center;padding:clamp(1rem,2vw,1.8rem)}
.j-feature img{aspect-ratio:4/3;border-radius:14px}
.j-body{padding:1.4rem}
.j-feature .j-body{padding:0}
.j-meta{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--em)}
.j-card h3{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.2rem,2vw,1.7rem);line-height:1.2;margin:.7rem 0 .5rem;transition:color .3s}
.j-card:hover h3{color:var(--em-2)}
.j-body p{font-size:.92rem;color:rgba(35,33,92,.68);margin-bottom:1.2rem}
.j-body .link-arrow{font-size:.6rem}

/* ---------- CTA band ---------- */
.cta-band{background:var(--ink);color:var(--sand);text-align:center;overflow:hidden}
.cta-inner{display:flex;flex-direction:column;align-items:center;position:relative;z-index:1}
.cta-title{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.4rem,5.5vw,4.4rem);line-height:1.06}
.cta-inner>p{margin-top:1.2rem;color:rgba(246,244,238,.8);max-width:52ch}
.cta-actions{display:flex;gap:1rem;margin-top:2.4rem;flex-wrap:wrap;justify-content:center}
.cta-band .badge{position:static;margin-top:2.6rem;color:var(--cream)}

/* ---------- Contact strip ---------- */
.contact-strip{background:var(--sand);padding-block:clamp(3rem,6vw,5rem)}
.cs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.cs-line{margin-top:1rem;line-height:2}
.cs-line a{border-bottom:1px solid transparent;transition:border-color .3s,color .3s}
.cs-line a:hover{color:var(--em-2);border-color:var(--em)}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:var(--sand);padding-top:clamp(4rem,8vw,7rem);overflow:hidden}
.foot-statement{font-family:var(--f-disp);font-weight:300;font-size:clamp(2.6rem,7vw,6rem);line-height:1.04;letter-spacing:-.015em}
.foot-cta{display:inline-flex;align-items:center;gap:1rem;margin:1.8rem 0 clamp(2rem,4vw,3.5rem);font-family:var(--f-mono);font-size:.72rem;letter-spacing:.32em;text-transform:uppercase;color:var(--em)}
.foot-cta span{transition:transform .4s var(--ease)}
.foot-cta:hover span{transform:translate(8px,-8px)}
.foot-ghost{font-family:var(--f-disp);font-style:italic;font-weight:300;font-size:clamp(3rem,9vw,8rem);line-height:1;white-space:nowrap;width:max-content;color:transparent;-webkit-text-stroke:1px rgba(143,190,47,.3);user-select:none;margin-bottom:clamp(2rem,4vw,3rem);animation:ghostMove 42s linear infinite}
@keyframes ghostMove{to{transform:translateX(-33.333%)}}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:2.5rem;padding-block:3rem;border-top:1px solid var(--line-l)}
.f-brand p{margin-top:1.4rem;color:rgba(246,244,238,.55);font-size:.9rem;line-height:1.9}
.f-head{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--mint);margin-bottom:1.2rem}
.f-col ul{display:grid;gap:.65rem;font-size:.92rem;color:rgba(246,244,238,.72)}
.f-col a{transition:color .3s}
.f-col a:hover{color:var(--em)}
.foot-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:1.6rem;border-top:1px solid var(--line-l);font-family:var(--f-mono);font-size:.64rem;letter-spacing:.08em;color:rgba(246,244,238,.45)}

/* ---------- WhatsApp float ---------- */
.whatsapp{position:fixed;right:1.4rem;bottom:1.4rem;z-index:115;display:flex;align-items:center;gap:0;background:linear-gradient(135deg,var(--em),var(--em-2));color:var(--ink);width:58px;height:58px;border-radius:50%;box-shadow:0 0 0 6px rgba(143,190,47,.2),0 14px 34px rgba(111,154,31,.4);transition:width .5s var(--ease),background .4s}
.whatsapp svg{width:26px;height:26px;flex-shrink:0;margin:auto}
.whatsapp .wa-label{max-width:0;overflow:hidden;white-space:nowrap;font-family:var(--f-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);transition:max-width .5s var(--ease),margin .5s var(--ease)}
.whatsapp:hover,.whatsapp:focus-visible{width:auto;background:var(--ink)}
.whatsapp:hover .wa-label{max-width:260px;margin-right:1.4rem;color:var(--sand)}

/* ---------- Preloader / curtain ---------- */
.preloader{position:fixed;inset:0;z-index:210;background:var(--sand);color:var(--ink);display:flex;align-items:center;justify-content:center;transition:transform .85s var(--ease) .1s}
.preloader.is-done{transform:translateY(-101%)}
.preloader.no-anim{transition:none}
.pl-inner{text-align:center}
.pl-mark{width:46px;height:46px;margin:0 auto 1.3rem;color:var(--em-2);opacity:0;animation:plFade .9s .15s var(--ease) forwards}
.pl-word{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.6rem,3.8vw,2.5rem);letter-spacing:.3em;text-indent:.3em;text-transform:lowercase;color:var(--ink);opacity:0;animation:plFade .9s .3s var(--ease) forwards}
.pl-sub{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--terra);margin-top:.9rem;opacity:0;animation:plFade .9s .45s var(--ease) forwards}
.pl-count{position:absolute;right:var(--pad);bottom:1.4rem;font-family:var(--f-disp);font-weight:300;font-size:clamp(2rem,5vw,3.4rem);color:var(--em-2)}
@keyframes plFade{to{opacity:1}}
.page-curtain{position:fixed;inset:0;z-index:205;background:linear-gradient(135deg,var(--em-2),var(--em));display:grid;place-items:center;transform:translateY(101%);transition:transform .6s var(--ease);pointer-events:none}
.page-curtain .pc-mark{width:54px;height:54px;color:var(--ink)}
.page-curtain.is-cover{transform:translateY(0);pointer-events:all}
.page-curtain.no-anim{transition:none}

/* ---------- Custom cursor ---------- */
.cursor-dot,.cursor-ring{position:fixed;top:0;left:0;z-index:230;pointer-events:none;border-radius:50%}
.cursor-dot{width:6px;height:6px;background:var(--em)}
.cursor-ring{width:38px;height:38px;border:1px solid var(--em);display:grid;place-items:center;transition:width .35s var(--ease),height .35s var(--ease),background-color .35s,border-color .35s,opacity .3s}
.cursor-ring .c-label{font-family:var(--f-mono);font-size:.52rem;letter-spacing:.28em;text-transform:uppercase;color:var(--ink);opacity:0;transition:opacity .25s}
.cursor-ring.is-link{width:60px;height:60px}
.cursor-ring.is-view{width:88px;height:88px;background:var(--em);border-color:var(--em)}
.cursor-ring.is-view .c-label{opacity:1}
.cursor-ring.is-hidden{opacity:0}
html.has-cursor *{cursor:none !important}
html.has-cursor :is(input,textarea){cursor:text !important}
html.has-cursor select{cursor:auto !important}
html.has-cursor .ba-range{cursor:ew-resize !important}
@media (pointer:coarse){.cursor-dot,.cursor-ring{display:none}}

/* ---------- Parallax ---------- */
.plx-wrap,.plx{overflow:hidden}
.plx-wrap [data-parallax],.plx [data-parallax]{will-change:transform}

/* ---------- Page hero ---------- */
.page-hero{background:var(--ink);color:var(--sand);padding-top:clamp(8rem,15vh,11rem);padding-bottom:clamp(3rem,6vh,5rem);position:relative;overflow:hidden}
.ph-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2.5rem,6vw,6rem);align-items:center;position:relative;z-index:1}
.crumb{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(246,244,238,.55);margin-bottom:1.6rem;display:flex;gap:.7rem;flex-wrap:wrap}
.crumb a:hover{color:var(--em)}
.ph-sub{margin-top:1.8rem;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.16em;color:var(--mint)}
.ph-media{overflow:hidden;border-radius:26px;box-shadow:0 40px 90px rgba(0,0,0,.5);aspect-ratio:4/5;position:relative}
.ph-media img{width:100%;height:100%;object-fit:cover;animation:kenburns 14s var(--ease) both}

/* ---------- About ---------- */
.story{background:var(--cream)}
.story-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2.5rem,6vw,6rem);align-items:start}
.story-copy{margin-top:1.8rem;display:grid;gap:1.1rem;color:rgba(35,33,92,.76);max-width:58ch}
.story-media img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--r);box-shadow:var(--sh)}
.story-media figcaption{margin-top:.9rem}
.studio{background:var(--sand)}
.studio-collage{position:relative;display:grid;grid-template-columns:repeat(12,1fr);gap:1.3rem;margin-bottom:3.6rem}
.studio-collage figure{margin:0;overflow:hidden;border-radius:var(--r)}
.studio-collage img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.studio-collage figure:hover img{transform:scale(1.05)}
.sc-1{grid-column:span 6}.sc-1 img{aspect-ratio:4/3}
.sc-2{grid-column:span 3;transform:rotate(1.6deg)}.sc-2 img{aspect-ratio:3/4}
.sc-3{grid-column:span 3;transform:rotate(-1.6deg)}.sc-3 img{aspect-ratio:3/4}
.sc-chip{position:absolute;left:50%;bottom:-1.8rem;transform:translateX(-50%);display:flex;align-items:center;gap:1rem;padding:1rem 1.5rem;white-space:nowrap}
.sc-chip strong{font-family:var(--f-disp);font-weight:400;font-size:2.1rem;color:var(--em-2);line-height:1}
.sc-chip span{font-family:var(--f-mono);font-size:.56rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(35,33,92,.6);line-height:1.7}
.studio-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.4rem,3vw,3rem);margin-top:1.6rem}
.studio-notes>div{border-top:2px solid var(--em);padding-top:1.2rem}
.sn-i{display:inline-block;font-family:var(--f-mono);font-size:.58rem;letter-spacing:.26em;color:var(--terra);margin-bottom:.6rem}
.studio-notes h4{font-family:var(--f-disp);font-weight:300;font-size:1.45rem;margin-bottom:.5rem}
.studio-notes p{font-size:.92rem;color:rgba(35,33,92,.7)}

/* Floor plan */
.plan-block{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(2rem,5vw,4rem);align-items:center;margin-top:clamp(3rem,6vw,5rem)}
.plan-wrap{position:relative;background:var(--cream);border:1px solid var(--line);border-radius:24px;padding:clamp(1.2rem,3vw,2.4rem);box-shadow:var(--sh);
  background-image:linear-gradient(rgba(35,33,92,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(35,33,92,.05) 1px,transparent 1px);background-size:26px 26px}
.plan-svg{width:100%;height:auto;display:block}
.plan-svg :is(path,circle){fill:none;stroke-width:1.6;stroke-dasharray:1;stroke-dashoffset:1}
.plan-svg .pw{stroke:var(--em-2)}
.plan-svg .pf{stroke:var(--brass)}
.plan-svg .pd{stroke:var(--terra)}
.plan-svg .pl{stroke:none;fill:var(--ink);opacity:0;font-family:var(--f-mono);font-size:9px;letter-spacing:.2em}
.plan-svg .pfade{opacity:0}
.plan-svg .pfade .pd2{stroke:var(--em-2);stroke-width:1;stroke-dasharray:none}
.plan-wrap.draw .pw,.plan-wrap.draw .pf,.plan-wrap.draw .pd{stroke-dashoffset:0;transition:stroke-dashoffset 1.3s var(--ease)}
.plan-wrap.draw .pl{opacity:.75;transition:opacity .7s var(--ease) 2.9s}
.plan-wrap.draw .pfade{opacity:.7;transition:opacity .8s var(--ease) 2.6s}
.plan-copy h3{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.8rem,3.4vw,2.6rem);margin:.9rem 0 1rem}
.plan-copy>p{color:rgba(35,33,92,.74);max-width:48ch}
.plan-key{margin:1.8rem 0 2.2rem;display:grid;gap:.8rem}
.plan-key li{display:flex;align-items:center;gap:.9rem;font-family:var(--f-mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase}
.plan-key i{width:26px;height:2px}
.plan-key .k-em{background:var(--em-2)}
.plan-key .k-br{background:var(--brass)}
.plan-key .k-te{background:var(--terra)}

/* Values */
.values{background:var(--cream)}
.val-list{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.val-list li{border-top:2px solid var(--em);padding-top:1.2rem}
.val-list span{font-family:var(--f-disp);font-style:italic;font-size:1.6rem}
.val-list p{margin-top:.6rem;font-size:.9rem;color:rgba(35,33,92,.68)}

/* ---------- Services ---------- */
.svc-jump{display:flex;flex-wrap:wrap;gap:.6rem;padding-block:2.4rem}
.svc-jump a{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:.7rem 1.2rem;transition:all .35s var(--ease)}
.svc-jump a:hover{background:var(--em);border-color:var(--em);color:var(--ink)}
.svc-blocks{background:var(--cream);padding-top:1rem}
.svc-block{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:clamp(2.5rem,5vw,4rem);border-top:1px solid var(--line)}
.svc-block.rev .svc-media{order:2}
.svc-media{overflow:hidden;border-radius:var(--r);box-shadow:var(--sh)}
.svc-media img{width:100%;aspect-ratio:5/4;object-fit:cover}
.svc-num{font-family:var(--f-mono);font-size:.72rem;color:var(--em)}
.svc-body h2{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.7rem,3vw,2.5rem);margin:.7rem 0 .9rem}
.svc-body>p{color:rgba(35,33,92,.72);max-width:52ch}
.chip-list{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.6rem}
.chip-list li{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:.55rem 1rem;color:rgba(35,33,92,.75)}
.svc-compact{background:var(--sand)}
.svc-duo{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.svc-card{background:var(--cream);padding:clamp(1.6rem,3vw,2.4rem);border-radius:var(--r);border-top:3px solid var(--em);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 30px rgba(35,33,92,.06);transition:transform .45s var(--ease),box-shadow .45s}
.svc-card:hover{transform:translateY(-8px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 34px 70px rgba(143,190,47,.18)}
.svc-card h3{font-family:var(--f-disp);font-weight:300;font-size:1.55rem;margin:.7rem 0 .6rem}
.svc-card p{font-size:.92rem;color:rgba(35,33,92,.7)}

/* ---------- Projects ---------- */
.portfolio{background:var(--cream)}
.filters{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:clamp(2rem,4vw,3.5rem)}
.filter-btn{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.22em;text-transform:uppercase;border:1px solid var(--line);border-radius:999px;padding:.75rem 1.3rem;transition:all .35s var(--ease)}
.filter-btn:hover{border-color:var(--em)}
.filter-btn.is-active{background:var(--em);border-color:var(--em);color:var(--ink);box-shadow:0 10px 26px rgba(143,190,47,.35)}
.masonry{columns:3;column-gap:1.4rem}
.m-item{position:relative;display:block;break-inside:avoid;margin-bottom:1.4rem;overflow:hidden;border-radius:var(--r);box-shadow:var(--sh)}
.m-item.arch-frame{border-radius:999px 999px 20px 20px}
.m-item::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(160deg,rgba(143,190,47,.3),transparent 70%);opacity:0;transition:opacity .5s var(--ease)}
.m-item:hover::after{opacity:1}
.m-item img{width:100%;transition:transform 1s var(--ease)}
.m-item:hover img{transform:scale(1.05)}
.m-num{position:absolute;top:.9rem;left:1rem;z-index:2;font-family:var(--f-mono);font-size:.56rem;letter-spacing:.24em;color:var(--cream);background:rgba(35,33,92,.68);padding:.4rem .6rem;border-radius:8px}
.m-meta{position:absolute;inset:auto .8rem .8rem .8rem;z-index:2;padding:1rem 1.1rem;border-radius:12px;background:rgba(252,251,247,.9);backdrop-filter:blur(10px);color:var(--ink);opacity:0;transform:translateY(10px);transition:all .5s var(--ease)}
.m-item:hover .m-meta{opacity:1;transform:none}
.m-meta h3{font-family:var(--f-disp);font-weight:300;font-size:1.25rem}
.m-meta span{font-family:var(--f-mono);font-size:.56rem;letter-spacing:.28em;text-transform:uppercase;color:var(--em-2)}
.m-item.is-hidden{display:none}

/* ---------- Case study ---------- */
.case-meta{background:var(--cream);border-block:1px solid var(--line)}
.cm-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1.5rem;padding-block:2rem}
.cm-k{display:block;font-family:var(--f-mono);font-size:.56rem;letter-spacing:.28em;text-transform:uppercase;color:var(--em);margin-bottom:.45rem}
.cm-v{font-size:.92rem}
.case-body{background:var(--sand)}
.case-sec{max-width:760px;margin-bottom:clamp(2.5rem,5vw,4rem)}
.case-sec .eyebrow{margin-bottom:.9rem;display:block}
.case-sec h2{margin-bottom:1.2rem}
.case-sec p{color:rgba(35,33,92,.76)}
.case-sec .chip-list{margin-top:1.4rem}
.case-img.full{margin:0 0 clamp(2.5rem,5vw,4rem)}
.case-img.full img{width:100%;max-height:78vh;object-fit:cover;border-radius:var(--r);box-shadow:var(--sh)}
.case-duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,4vw,4rem);margin-bottom:clamp(2.5rem,5vw,4rem)}
.case-duo .case-sec{margin-bottom:0}
.case-duo-img{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-bottom:clamp(2.5rem,5vw,4rem)}
.case-duo-img figure{margin:0;overflow:hidden;border-radius:var(--r);box-shadow:var(--sh)}
.case-duo-img img{width:100%;aspect-ratio:4/5;object-fit:cover}
.case-body .ba{margin-bottom:clamp(2.5rem,5vw,4rem)}
.case-cta{display:flex;gap:1rem;flex-wrap:wrap;margin:0 0 clamp(2.5rem,5vw,4rem)}
.gallery-strip{display:grid;grid-auto-flow:column;grid-auto-columns:min(320px,72vw);gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}
.gallery-strip a{display:block;scroll-snap-align:start;position:relative;overflow:hidden;border-radius:var(--r);box-shadow:var(--sh)}
.gallery-strip img{width:100%;aspect-ratio:3/4;object-fit:cover;transition:transform .8s var(--ease)}
.gallery-strip a:hover img{transform:scale(1.04)}
.gallery-strip a::after{content:"⤢";position:absolute;top:.9rem;right:.9rem;width:36px;height:36px;display:grid;place-items:center;background:rgba(35,33,92,.68);color:var(--mint);border-radius:50%;opacity:0;transition:opacity .35s}
.gallery-strip a:hover::after,.gallery-strip a:focus-visible::after{opacity:1}
.next-project{border-top:1px solid var(--line)}
.next-project a{display:flex;align-items:center;gap:2rem;padding:clamp(3rem,6vw,5rem) var(--pad);max-width:var(--container);margin-inline:auto;transition:gap .4s var(--ease)}
.next-project a:hover{gap:3rem}
.np-k{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--em)}
.np-title{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.8rem,4.5vw,3.4rem)}
.np-arrow{margin-left:auto;font-size:2rem;color:var(--em);transition:transform .4s var(--ease)}
.next-project a:hover .np-arrow{transform:translateX(12px)}

/* ---------- Locations ---------- */
.loc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.4rem}
.loc-card{background:var(--cream);border:1px solid var(--line);border-radius:var(--r);padding:1.8rem;box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 10px 30px rgba(35,33,92,.06);transition:transform .45s var(--ease),box-shadow .45s,border-color .45s}
.loc-card:hover{transform:translateY(-8px);border-color:var(--em);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 34px 70px rgba(143,190,47,.2)}
.loc-tag{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--em-2)}
.loc-card h3{font-family:var(--f-disp);font-weight:300;font-size:1.5rem;margin:.6rem 0 .5rem}
.loc-card p{font-size:.9rem;color:rgba(35,33,92,.7)}
.loc-card ul{margin-top:1rem;display:grid;gap:.5rem}
.loc-card ul li{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(35,33,92,.6)}
.loc-links{margin-top:1.3rem;display:flex;gap:1.4rem;flex-wrap:wrap}

/* ---------- Article ---------- */
.article{background:var(--sand)}
.article-head{max-width:860px;margin-inline:auto}
.article-meta{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:rgba(35,33,92,.55);margin-top:1.2rem}
.article-hero{max-width:1100px;margin:2.5rem auto}
.article-hero img{width:100%;max-height:70vh;object-fit:cover;border-radius:var(--r);box-shadow:var(--sh)}
.article-hero figcaption{margin-top:.9rem}
.article-body{max-width:760px;margin-inline:auto}
.article-body h2{font-family:var(--f-disp);font-weight:300;font-size:clamp(1.4rem,2.6vw,1.8rem);margin:2.4rem 0 .8rem}
.article-body p{margin-bottom:1.2rem;color:rgba(35,33,92,.78);font-size:1.02rem}
.article-body blockquote{border-left:3px solid var(--em);padding-left:1.3rem;margin:1.8rem 0;font-family:var(--f-disp);font-style:italic;font-size:1.3rem;line-height:1.4;color:var(--ink)}
.share-row{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:2.4rem}

/* ---------- Contact form ---------- */
.contact-page{background:var(--cream)}
.cp-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:clamp(2.5rem,6vw,6rem);align-items:start}
.form-intro{font-size:.95rem;color:rgba(35,33,92,.7);margin-bottom:2rem}
.f-section{border:none;margin-bottom:2.5rem}
.f-section legend{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.3em;text-transform:uppercase;color:var(--em-2);margin-bottom:1.2rem;padding-bottom:.5rem;border-bottom:1px solid var(--line);width:100%}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.f-field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.4rem}
.f-field label{font-family:var(--f-mono);font-size:.58rem;font-weight:400;letter-spacing:.26em;text-transform:uppercase;color:var(--em-2)}
.f-field input,.f-field select,.f-field textarea{font:inherit;font-weight:300;font-size:.95rem;color:var(--ink);background:var(--sand);border:1px solid var(--line);border-radius:12px;padding:.95rem 1.05rem;transition:border-color .3s,background .3s,box-shadow .3s;width:100%}
.f-field textarea{resize:vertical}
.f-field input:focus,.f-field select:focus,.f-field textarea:focus{outline:none;border-color:var(--em);background:var(--cream);box-shadow:0 0 0 4px rgba(143,190,47,.15)}
.f-checkboxes{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.7rem}
.f-check{display:flex;align-items:center;gap:.6rem;font-size:.85rem;cursor:pointer}
.f-check input{width:auto;accent-color:var(--em)}
.f-upload-wrap{position:relative}
.f-upload-wrap input[type=file]{padding:.8rem}
.f-upload-btn{position:absolute;right:.6rem;top:50%;transform:translateY(-50%);font-family:var(--f-mono);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;background:var(--em);color:var(--ink);padding:.5rem .9rem;border-radius:999px;pointer-events:none}
.f-help{font-size:.72rem;color:rgba(35,33,92,.55);margin-top:.4rem}
.f-submit{display:flex;flex-direction:column;gap:1rem;align-items:flex-start}
.f-note{font-size:.78rem;color:rgba(35,33,92,.6)}
.form-success{margin-top:1.5rem;background:rgba(143,190,47,.15);border:1px solid var(--em);border-radius:12px;padding:1.2rem;color:var(--em-2)}
.form-success p{margin:.2rem 0}
.cp-side{display:grid;gap:2rem}
.cp-block{border-top:1px solid var(--line);padding-top:1.4rem}
.cp-map{margin-top:1.2rem;width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r);box-shadow:var(--sh)}
.lead-magnet{background:linear-gradient(135deg,var(--ink),#2E2B6B);color:var(--sand);border:none;border-radius:20px;padding:1.6rem}
.lead-magnet h3{font-family:var(--f-disp);font-weight:300;font-size:1.4rem;margin:.6rem 0 .4rem}
.lead-magnet p{font-size:.85rem;color:rgba(246,244,238,.75);margin-bottom:1rem}
.lead-form{display:flex;border:1px solid rgba(246,244,238,.4);border-radius:999px;overflow:hidden}
.lead-form input{flex:1;min-width:0;border:0;background:transparent;color:var(--sand);padding:.9rem 1.2rem;font:inherit;font-weight:300}
.lead-form input::placeholder{color:rgba(246,244,238,.45)}
.lead-form input:focus{outline:none;background:rgba(255,255,255,.08)}
.lead-form button{background:var(--em);color:var(--ink);padding:0 1.4rem;font-size:1.1rem}
.book-row{display:flex;gap:.8rem;margin:1rem 0}
.book-row input,.book-row select{flex:1;font:inherit;font-weight:300;font-size:.9rem;color:var(--ink);background:var(--sand);border:1px solid var(--line);border-radius:12px;padding:.85rem 1rem}
.book-row input:focus,.book-row select:focus{outline:none;border-color:var(--em);box-shadow:0 0 0 4px rgba(143,190,47,.15)}
.book-actions{display:flex;gap:.8rem;flex-wrap:wrap}
.acc-btn{display:flex;justify-content:space-between;align-items:center;gap:1rem;width:100%;text-align:left;padding:1.1rem 0;font-family:var(--f-disp);font-weight:300;font-size:1.1rem;border-top:1px solid var(--line)}
.acc-ic{font-size:1.3rem;color:var(--em);transition:transform .4s var(--ease)}
.acc-item.open .acc-ic{transform:rotate(45deg)}
.acc-panel{max-height:0;overflow:hidden;transition:max-height .5s var(--ease)}
.acc-panel p{padding-bottom:1.2rem;font-size:.9rem;color:rgba(35,33,92,.7)}

/* ---------- 404 ---------- */
.err{min-height:88vh;display:grid;place-items:center;text-align:center;background:var(--ink);color:var(--sand);padding:8rem 1.5rem 5rem;position:relative;overflow:hidden}
.err-num{font-family:var(--f-disp);font-weight:300;font-size:clamp(6rem,20vw,14rem);line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(143,190,47,.5)}
.err-copy{max-width:46ch;margin:1.2rem auto 2rem;color:rgba(246,244,238,.75)}

/* ---------- Lightbox ---------- */
.lightbox{position:fixed;inset:0;z-index:240;background:rgba(35,33,92,.94);display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .4s var(--ease),visibility 0s .4s}
.lightbox.is-open{opacity:1;visibility:visible;transition:opacity .4s var(--ease)}
.lb-img{max-width:min(88vw,1200px);max-height:74vh;object-fit:contain;border-radius:14px;transform:scale(.96);transition:transform .45s var(--ease)}
.lightbox.is-open .lb-img{transform:none}
.lb-cap{margin-top:1.1rem;font-family:var(--f-mono);font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--mint)}
.lb-btn{position:fixed;width:52px;height:52px;border:1px solid rgba(246,244,238,.35);border-radius:50%;display:grid;place-items:center;color:var(--sand);transition:all .3s}
.lb-btn:hover,.lb-btn:focus-visible{background:var(--em);border-color:var(--em);color:var(--ink)}
.lb-close{top:1.4rem;right:1.4rem}
.lb-prev{left:1.4rem;top:50%;transform:translateY(-50%)}
.lb-next{right:1.4rem;top:50%;transform:translateY(-50%)}
</content>
</invoke>

</parameter>

</function>