/* ReDevelop Group - design system.
   Brand: near-black + lime green (from the deck). Poppins wordmark/display +
   Geist body. One theme (dark), one accent, one radius rule. No serif, no
   em-dash. A11y + perf fixes from the review folded in. */

:root{
  color-scheme: dark;
  --bg:#0B0B0C; --bg-2:#111113; --surface:#17181A; --surface-2:#1F2023;
  --line:rgba(255,255,255,.11); --line-strong:rgba(255,255,255,.2);
  --text:#F3F3F4; --muted:#A3A4A8; --faint:#84858A;
  --accent:#8CC63F; --accent-hi:#A0D657; --accent-dim:#4C6B33; --accent-deep:#20261A; --accent-ink:#0C1A04; --accent-tx:#8CC63F;
  --scrim:10,10,12; --hero-bright:.55; --chip-bg:rgba(20,20,22,.6);
  --r-card:14px; --r-pill:999px;
  --ease:cubic-bezier(.16,1,.3,1);
  --maxw:1320px;
}
html[data-theme="light"]{
  color-scheme: light;
  --bg:#F5F3ED; --bg-2:#ECE9E1; --surface:#FFFFFF; --surface-2:#F1EEE5;
  --line:rgba(20,22,15,.13); --line-strong:rgba(20,22,15,.22);
  --text:#14160F; --muted:#4E5246; --faint:#5F6354;
  --accent:#5A9E22; --accent-hi:#6BB52C; --accent-dim:#A8D77E; --accent-deep:#E7F1D8; --accent-ink:#FFFFFF; --accent-tx:#3F7A17;
  --scrim:245,243,237; --hero-bright:1; --chip-bg:rgba(255,255,255,.62);
}
html{transition:background-color .4s var(--ease)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);
  font-family:'Geist',system-ui,-apple-system,sans-serif;font-weight:400;
  font-size:clamp(15px,1.04vw,17px);line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.menu-open{overflow:hidden}
h1,h2,h3,h4{font-family:'Poppins',system-ui,sans-serif;font-weight:600;line-height:1.04;letter-spacing:-.02em;margin:0}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
p{margin:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}

/* skip link */
.skip-link{position:fixed;top:10px;left:10px;z-index:200;background:var(--accent);color:var(--accent-ink);
  padding:10px 16px;border-radius:8px;font-weight:600;transform:translateY(-150%);transition:transform .25s var(--ease)}
.skip-link:focus{transform:none}

/* utilities */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,4.5vw,60px)}
.eyebrow{font-family:'Geist';font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--accent-tx);display:inline-block}
.h2{font-size:clamp(1.95rem,4.4vw,3.4rem);font-weight:600;max-width:20ch;letter-spacing:-.025em;text-wrap:balance}
.lead{color:var(--muted);max-width:56ch;font-size:clamp(1rem,1.2vw,1.13rem);text-wrap:pretty}
.sec{padding:clamp(70px,9vw,140px) 0;position:relative}
.section-head{margin-bottom:clamp(40px,5vw,66px)}
.section-head .eyebrow{margin-bottom:18px}
.section-head .lead{margin-top:18px}
.section-head.is-center{text-align:center}
.section-head.is-center .h2,.section-head.is-center .lead{margin-inline:auto}

button.btn{font:inherit}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:'Geist';font-weight:500;font-size:.92rem;
  padding:13px 26px;border-radius:var(--r-pill);cursor:pointer;border:1px solid transparent;background:none;
  transition:transform .3s var(--ease),background .3s,color .3s,border-color .3s}
.btn svg{width:17px;height:17px}
.btn-primary{background:var(--accent);color:var(--accent-ink)}
.btn-primary:hover{background:var(--accent-hi)}
.btn-ghost{border-color:var(--line-strong);color:var(--text)}
.btn-ghost:hover{border-color:var(--accent-tx);color:var(--accent-tx)}
.btn:active{transform:scale(.985)}
.tlink{display:inline-flex;align-items:center;gap:8px;color:var(--accent-tx);font-weight:500;font-size:.92rem}
.tlink svg{width:16px;height:16px;transition:transform .3s var(--ease)}
.tlink:hover svg{transform:translateX(4px)}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

[data-reveal]{opacity:0;transform:translateY(34px) scale(.985);filter:blur(7px);transition:opacity .95s var(--ease),transform .95s var(--ease),filter .85s var(--ease)}
[data-reveal].in{opacity:1;transform:none;filter:none}
[data-delay="1"]{transition-delay:.1s}[data-delay="2"]{transition-delay:.2s}[data-delay="3"]{transition-delay:.3s}

/* language switcher */
.lang-select{background:none;border:1px solid var(--line-strong);color:var(--text);border-radius:var(--r-pill);font:inherit;font-size:.8rem;font-weight:500;padding:6px 10px;cursor:pointer;transition:border-color .3s}
.lang-select:hover{border-color:var(--accent-tx)}
.mobile-lang{margin-top:18px}
.mobile-lang .lang-select{width:100%;padding:12px}
@media(max-width:880px){.header-cta .lang-select{display:none}}

/* theme toggle */
.theme-toggle{background:none;border:1px solid var(--line-strong);color:var(--text);width:40px;height:40px;border-radius:50%;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:border-color .3s,color .3s,transform .3s var(--ease)}
.theme-toggle:hover{border-color:var(--accent-tx);color:var(--accent-tx);transform:rotate(12deg)}
.theme-toggle svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle .i-sun{display:none}
html[data-theme="light"] .theme-toggle .i-sun{display:block}
html[data-theme="light"] .theme-toggle .i-moon{display:none}

/* header */
header{position:fixed;top:0;left:0;right:0;z-index:60;transition:background .4s var(--ease),border-color .4s,backdrop-filter .4s}
header .bar{display:flex;align-items:center;justify-content:space-between;height:72px;border-bottom:1px solid transparent}
header.stuck{background:rgba(var(--scrim),.82);backdrop-filter:blur(12px)}
header.stuck .bar{border-color:var(--line)}
/* wordmark logo */
.brand{font-family:'Poppins';font-weight:700;font-size:1.4rem;letter-spacing:-.03em;position:relative;display:inline-block;padding-bottom:3px}
.brand .u{position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.brand:hover .u{transform:scaleX(1)}
nav.main{display:flex;gap:32px;align-items:center}
nav.main a{font-size:.86rem;color:var(--muted);transition:color .25s}
nav.main a:hover{color:var(--text)}
nav.main a[aria-current]{color:var(--accent-tx);font-weight:600}
.header-cta{display:flex;align-items:center;gap:16px}
.burger{display:none;background:none;border:0;color:var(--text);width:44px;height:44px;cursor:pointer;align-items:center;justify-content:center}
.burger svg{width:24px;height:24px}
.mobile-menu{position:fixed;inset:72px 0 0;background:var(--bg);z-index:55;transform:translateY(-12px);opacity:0;
  transition:opacity .35s var(--ease),transform .35s var(--ease);padding:30px clamp(20px,5vw,40px);display:flex;flex-direction:column;gap:6px}
.mobile-menu[hidden]{display:none}
body.menu-open .mobile-menu{opacity:1;transform:none}
.mobile-menu a{font-family:'Poppins';font-size:1.8rem;font-weight:600;padding:14px 0;border-bottom:1px solid var(--line)}
.mobile-menu a[aria-current]{color:var(--accent-tx)}
.mobile-menu .btn{margin-top:22px;justify-content:center}
@media(max-width:880px){nav.main,.header-cta .btn{display:none}.burger{display:inline-flex}}

/* hero */
.hero{position:relative;min-height:100dvh;display:flex;align-items:center;overflow:hidden;background:var(--bg)}
.hero.short{min-height:80dvh}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:1;opacity:.9}
/* sketch heroes (sub pages): pencil drawing, colour paints in under the cursor */
.hero-art{position:absolute;inset:0;z-index:1;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 16%,#000 55%);
  mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) 16%,#000 55%)}
.hero-art .sketch{width:100%;height:100%;object-fit:cover}
.hero-art::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;
  background:linear-gradient(180deg, rgb(var(--scrim)) 0%, rgba(var(--scrim),.45) 10%, rgba(var(--scrim),0) 22%)}
.hero-art .skd{display:none}
html:not([data-theme="light"]) .hero-art .skl{display:none}
html:not([data-theme="light"]) .hero-art .skd{display:block}
.hero-art .paint{position:absolute;inset:0;width:100%;height:100%}
@media (prefers-reduced-motion:reduce){.hero-art .paint{display:none}}
@media (hover:none){.hero-art .paint{display:none}}
.hero::before{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.hero::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:
  linear-gradient(0deg, rgb(var(--scrim)) 0%, rgba(var(--scrim),.55) 14%, rgba(var(--scrim),0) 38%)}
.hero .wrap{position:relative;z-index:3;width:100%;padding-top:100px;padding-bottom:54px}

/* floating asset card (gravitas / detail, home hero) */
.asset-card{position:absolute;z-index:3;right:clamp(20px,5vw,84px);top:52%;transform:translateY(-30%);width:330px;
  background:rgba(18,20,16,.55);backdrop-filter:blur(16px);border:1px solid var(--line-strong);border-radius:16px;padding:24px;
  box-shadow:0 30px 70px rgba(0,0,0,.5)}
.asset-card .ac-k{font-family:'Geist';font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-tx);margin-bottom:12px}
.asset-card .ac-h{font-family:'Poppins';font-weight:600;font-size:1.15rem;margin-bottom:8px}
.asset-card .ac-p{color:var(--muted);font-size:.85rem;margin-bottom:18px}
.asset-card .ac-row{display:flex;gap:22px;border-top:1px solid var(--line);padding-top:16px}
.asset-card .ac-m .v{font-family:'Poppins';font-weight:600;font-size:1.5rem;line-height:1}
.asset-card .ac-m .v span{color:var(--accent-tx)}
.asset-card .ac-m .l{font-size:.72rem;color:var(--faint);margin-top:4px}
@media(max-width:1040px){.asset-card{display:none}}
.hero .eyebrow{margin-bottom:22px}
.hero h1{font-size:clamp(2.4rem,5.2vw,4.7rem);font-weight:600;max-width:20ch;letter-spacing:-.03em;text-wrap:balance}
.hero.short h1{max-width:24ch}
.hero h1 .g,.statement .g{color:var(--accent-tx)}
.hero .sub{margin-top:24px;max-width:50ch;color:var(--muted);font-size:clamp(1rem,1.3vw,1.2rem);text-wrap:pretty}
.hero .acts{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap}

/* animated wordmark (home hero) */

/* hero wordmark (static, clean) */
.hero-wm{font-family:'Poppins';font-weight:700;letter-spacing:-.035em;line-height:.95;
  font-size:clamp(2.6rem,7vw,5.8rem);color:var(--text);margin:6px 0 10px;max-width:12ch}
.hero-wm .g{color:var(--accent-tx)}

/* statement */
.statement{font-family:'Poppins';font-weight:500;font-size:clamp(1.7rem,3.6vw,3rem);line-height:1.16;letter-spacing:-.02em;max-width:26ch}
.statement b{font-weight:600;color:var(--text)}
.statement .dim{color:var(--muted)}

/* pillars / capabilities */
.caps{display:grid;grid-template-columns:1fr 1fr;gap:0 64px}
.cap{padding:30px 0;border-top:1px solid var(--line);position:relative}
.cap::before{content:"";position:absolute;top:-1px;left:0;height:1px;width:0;background:var(--accent);transition:width .7s var(--ease)}
.cap:hover::before{width:100%}
.cap .k{font-family:'Geist';font-size:.8rem;color:var(--accent-tx);font-weight:500;margin-bottom:12px;letter-spacing:.04em}
.cap h3{font-size:1.5rem;font-weight:600;margin-bottom:10px}
.cap p{color:var(--muted);max-width:44ch}
@media(max-width:760px){.caps{grid-template-columns:1fr}}
/* governance pillars with drawing icons */
.cap.has-icon{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:start}
.gicon{width:54px;height:54px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line);flex:none;
  display:flex;align-items:center;justify-content:center;color:var(--accent-tx);
  opacity:0;transform:scale(.6);transition:opacity .55s var(--ease) .15s,transform .55s var(--ease) .15s}
.gicon svg{width:27px;height:27px}
.cap.in .gicon{opacity:1;transform:none}
.cap.in .gicon svg *{stroke-dasharray:150;stroke-dashoffset:150;animation:draw 1.2s var(--ease) .35s forwards}
@media (prefers-reduced-motion:reduce){.gicon{opacity:1;transform:none}.cap.in .gicon svg *{stroke-dasharray:none;stroke-dashoffset:0;animation:none}}

/* figures */
.figs{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.figs .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:48px}
.figs .num{font-family:'Poppins';font-size:clamp(2.4rem,5vw,3.9rem);font-weight:600;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.figs .num .u{color:var(--accent-tx)}
.figs .lbl{margin-top:14px;color:var(--muted);font-size:.9rem;max-width:24ch}
.figs .note{grid-column:1/-1;margin-top:6px;color:var(--faint);font-size:.84rem;max-width:70ch}
@media(max-width:760px){.figs .grid{grid-template-columns:1fr 1fr;gap:36px 28px}}

/* cards */
.cardgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden;
  min-height:240px;display:flex;flex-direction:column;justify-content:flex-end;position:relative;
  content-visibility:auto;contain-intrinsic-size:240px;
  transition:border-color .35s,transform .35s var(--ease)}
.card:hover{border-color:var(--accent-dim);transform:translateY(-4px)}
.card.img > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.5;
  filter:grayscale(.4) brightness(.72) contrast(1.05);transition:opacity .4s,transform .6s var(--ease);z-index:0}
.card.img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,11,10,.15),rgba(10,11,10,.9));z-index:1}
.card.img:hover > img{opacity:.6;transform:scale(1.04)}
.card .body{position:relative;z-index:2;padding:26px}
.card .k{font-family:'Geist';font-size:.74rem;color:var(--accent-tx);font-weight:500;letter-spacing:.06em;margin-bottom:10px}
.card h3{font-size:1.3rem;font-weight:600;margin-bottom:8px}
.card p{color:var(--muted);font-size:.88rem}
@media(max-width:880px){.cardgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cardgrid{grid-template-columns:1fr}}
/* cycling cards with traveling border (ESG-style selection) */
.cardgrid.cycle .card{cursor:pointer}
.card .trace,.xp .trace{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;opacity:0;transition:opacity .4s var(--ease);overflow:visible}
.card .trace rect,.xp .trace rect{width:calc(100% - 3px);height:calc(100% - 3px);fill:none;stroke:var(--accent);stroke-width:2.5;stroke-linecap:round;
  stroke-dasharray:26 74;filter:drop-shadow(0 0 6px rgba(140,198,63,.45));animation:traceRun 3.4s linear infinite}
@keyframes traceRun{to{stroke-dashoffset:-100}}
.card.active{border-color:var(--accent-dim);transform:translateY(-4px)}
.card.active .trace{opacity:1}
.xp.active .trace{opacity:1}
.card.active.img > img{opacity:.62}

/* expanding gallery (Living) */
.xpander{display:flex;gap:12px;height:clamp(400px,54vh,540px)}
.xp{position:relative;flex:1 1 0;min-width:0;border-radius:var(--r-card);overflow:hidden;cursor:pointer;
  border:1px solid var(--line);background:var(--surface);transition:flex-grow .85s var(--ease)}
.xp.active{flex-grow:3.4}
.xp > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.4) brightness(.78);transition:filter .7s var(--ease),transform 1s var(--ease)}
.xp.active > img{filter:saturate(1) brightness(1);transform:scale(1.03)}
.xp::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(0deg,rgba(8,9,8,.84) 0%,rgba(8,9,8,.3) 42%,rgba(8,9,8,0) 68%)}
.xp-body{position:absolute;left:0;right:0;bottom:0;padding:clamp(16px,2vw,26px);z-index:2;color:#F3F3F4}
.xp-body .k{font-family:'Geist';font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;font-weight:500;color:#A0D657;
  margin-bottom:8px;opacity:0;transform:translateY(8px);transition:opacity .5s var(--ease) .2s,transform .5s var(--ease) .2s}
.xp-body h3{font-size:clamp(1.1rem,1.9vw,1.65rem);font-weight:600;white-space:nowrap;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,#000 72%,transparent 96%);mask-image:linear-gradient(90deg,#000 72%,transparent 96%);
  transition:font-size .5s var(--ease)}
.xp:not(.active) .xp-body h3{font-size:1.02rem;opacity:.85}
.xp.active .xp-body h3{-webkit-mask-image:none;mask-image:none}
.xp-body p{max-width:48ch;color:rgba(243,243,244,.85);font-size:.95rem;margin-top:8px;max-height:0;overflow:hidden;
  opacity:0;transform:translateY(10px);transition:max-height .6s var(--ease),opacity .5s var(--ease) .25s,transform .5s var(--ease) .25s}
.xp.active .xp-body .k{opacity:1;transform:none}
.xp.active .xp-body p{max-height:180px;opacity:1;transform:none}
.xp:hover > img{filter:saturate(.7) brightness(.9)}
.xp.active:hover > img{filter:saturate(1) brightness(1)}
@media(max-width:820px){.xpander{flex-direction:column;height:min(94vh,900px)}.xp-body h3{white-space:normal}}
@media (prefers-reduced-motion:reduce){.xp-body .k,.xp-body p{opacity:1;transform:none}.xp.active .xp-body p{max-height:180px}}

/* interactive building diagram */
.stack{display:grid;grid-template-columns:.82fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.bldg-wrap{display:flex;justify-content:center}
.bldg{width:min(100%,290px);height:auto;overflow:visible;color:rgba(140,198,63,.4)}
.bldg .z{transition:color .4s var(--ease),opacity .5s var(--ease),filter .4s var(--ease)}
.stack[data-active] .z{opacity:.22}
.stack[data-active="retail"] #z-retail,
.stack[data-active="homes"] #z-homes,
.stack[data-active="civic"] #z-civic,
.stack[data-active="fabric"] #z-fabric{opacity:1;color:var(--accent-hi);filter:drop-shadow(0 0 9px rgba(140,198,63,.5))}
.layers{display:flex;flex-direction:column;gap:4px}
.layer{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:start;padding:22px 20px;border-radius:14px;
  border:1px solid transparent;transition:background .35s,border-color .35s,transform .35s var(--ease);cursor:default}
.layer:hover,.layer:focus-visible{background:var(--surface);border-color:var(--accent-dim);transform:translateX(6px);outline:none}
.licon{width:50px;height:50px;border-radius:13px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;
  color:var(--accent-tx);flex:none;opacity:0;transform:scale(.7);
  transition:background .35s var(--ease),transform .55s var(--ease),opacity .55s var(--ease)}
.licon svg{width:25px;height:25px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.stack.in .licon{opacity:1;transform:none}
.stack.in .layers .layer:nth-child(2) .licon{transition-delay:.09s}
.stack.in .layers .layer:nth-child(3) .licon{transition-delay:.18s}
.stack.in .layers .layer:nth-child(4) .licon{transition-delay:.27s}
.layer:hover .licon,.layer:focus-visible .licon{background:var(--accent-deep);transform:scale(1.1)}
.layer .k{font-family:'Geist';font-size:.74rem;color:var(--accent-tx);letter-spacing:.06em;margin-bottom:6px;font-weight:500}
.layer h3{font-size:1.4rem;font-weight:600;margin-bottom:6px}
.layer p{color:var(--muted);font-size:.92rem;max-width:48ch}
/* assembly reveal */
.stack .z{opacity:0;transform:translateY(28px)}
.stack.in .z{opacity:1;transform:none;transition:opacity .7s var(--ease),transform .7s var(--ease)}
.stack.in #z-retail{transition-delay:.05s}
.stack.in #z-homes{transition-delay:.2s}
.stack.in #z-civic{transition-delay:.36s}
.stack.in #z-fabric{transition-delay:.5s}
.stack.in .licon svg *{stroke-dasharray:240;stroke-dashoffset:240;animation:draw 1.1s var(--ease) .3s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@media(max-width:900px){.stack{grid-template-columns:1fr;gap:26px}.bldg{width:200px}}
@media (prefers-reduced-motion:reduce){.stack .z{opacity:1;transform:none}.licon{opacity:1;transform:none}.stack.in .licon svg *{stroke-dasharray:none;stroke-dashoffset:0;animation:none}}

/* process timeline (top-agency, per-element build on scroll) */
.timeline{list-style:none;margin:0;padding:0;position:relative}
.timeline::before{content:"";position:absolute;left:26px;top:var(--rail-top,22px);height:var(--rail-h,0);width:2px;
  background:linear-gradient(var(--line),var(--line));transform:translateX(-50%)}
.timeline::after{content:"";position:absolute;left:26px;top:var(--rail-top,22px);height:var(--rail-fill,0px);width:2px;
  background:var(--accent);transform:translateX(-50%);transition:height 1s var(--ease);
  box-shadow:0 0 12px rgba(140,198,63,.35)}
.tstep{display:grid;grid-template-columns:52px 1fr;gap:clamp(24px,4vw,64px);padding-bottom:clamp(44px,6vw,84px);opacity:1;transform:none}
.tstep:last-child{padding-bottom:0}
.trail{position:relative;display:flex;flex-direction:column;align-items:center}
.tdot{width:15px;height:15px;border-radius:50%;border:2px solid var(--line-strong);background:var(--bg);flex:none;margin-top:18px;position:relative;z-index:1;
  transition:border-color .6s var(--ease),background .6s var(--ease),box-shadow .6s var(--ease)}
.tseg{display:none}
.tstep.in .tdot{border-color:var(--accent);background:var(--accent);box-shadow:0 0 0 6px rgba(140,198,63,.12),0 0 16px rgba(140,198,63,.35)}
.tnum{font-family:'Poppins';font-weight:700;font-size:clamp(2.4rem,5vw,3.8rem);line-height:.9;letter-spacing:-.03em;margin-bottom:14px;
  color:transparent;-webkit-text-stroke:1.4px var(--line-strong);
  transition:color .6s var(--ease) .1s,-webkit-text-stroke-color .6s var(--ease)}
.tstep.in .tnum{color:var(--accent-tx);-webkit-text-stroke-color:transparent}
.tcontent .k,.tstep h3,.tstep p,.ttags{opacity:0;transform:translateY(16px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.tstep.in .tcontent .k{opacity:1;transform:none;transition-delay:.14s}
.tstep.in h3{opacity:1;transform:none;transition-delay:.24s}
.tstep.in p{opacity:1;transform:none;transition-delay:.34s}
.tstep.in .ttags{opacity:1;transform:none;transition-delay:.44s}
.tcontent .k{font-family:'Geist';color:var(--accent-tx);font-size:.8rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;margin-bottom:8px}
.tstep h3{font-size:clamp(1.6rem,2.8vw,2.3rem);font-weight:600;margin-bottom:12px}
.tstep p{color:var(--muted);max-width:56ch}
.ttags{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0 0;padding:0;list-style:none}
.ttags li{font-size:.82rem;color:var(--text);border:1px solid var(--line-strong);border-radius:var(--r-pill);padding:6px 14px;transition:border-color .3s,color .3s}
.ttags li:hover{border-color:var(--accent-tx);color:var(--accent-tx)}
@media (prefers-reduced-motion:reduce){.tseg{transform:scaleY(1)}.tnum{color:var(--accent-tx);-webkit-text-stroke-color:transparent}.tcontent .k,.tstep h3,.tstep p,.ttags{opacity:1;transform:none}}

/* cursor spotlight on cards */
.card,.gco{--mx:50%;--my:50%}
.gco{position:relative;overflow:hidden}
.card::before,.gco::before{content:"";position:absolute;inset:0;border-radius:inherit;opacity:0;pointer-events:none;z-index:2;
  background:radial-gradient(340px circle at var(--mx) var(--my),rgba(140,198,63,.09),transparent 62%);transition:opacity .45s var(--ease)}
.card:hover::before,.gco:hover::before{opacity:1}

/* cities marquee */


/* project mosaic */
.mosaic{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.mosaic .shot{grid-column:span 2;margin:0;position:relative;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);background:var(--surface);aspect-ratio:4/3}
.mosaic .shot.big{grid-column:span 3;aspect-ratio:16/10}
.mosaic.studies .shot{grid-column:span 2;aspect-ratio:3/2}
.mosaic .shot img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.92);transition:transform .8s var(--ease),filter .5s}
.mosaic .shot:hover img{transform:scale(1.05);filter:saturate(1.05)}
.mosaic .shot figcaption{position:absolute;left:0;right:0;bottom:0;padding:36px 18px 14px;color:#F3F3F4;
  background:linear-gradient(0deg,rgba(8,8,10,.85),rgba(8,8,10,0));display:flex;flex-direction:column;gap:2px}
.mosaic .shot figcaption strong{font-family:'Poppins';font-weight:600;font-size:.98rem;letter-spacing:-.01em}
.mosaic .shot figcaption span{font-size:.78rem;color:rgba(243,243,244,.75)}
@media(max-width:900px){.mosaic .shot,.mosaic .shot.big,.mosaic.studies .shot{grid-column:span 3}}
@media(max-width:560px){.mosaic .shot,.mosaic .shot.big,.mosaic.studies .shot{grid-column:span 6}}

/* reference project grid (1:1 portfolio) */
.refgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ref{position:relative;margin:0;aspect-ratio:4/3;border-radius:var(--r-card);overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.ref img{width:100%;height:100%;object-fit:cover;filter:saturate(.92);transition:transform .7s var(--ease),filter .5s}
.ref:hover img{transform:scale(1.08);filter:saturate(1.05)}
.ref figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 14px 11px;color:#F3F3F4;
  background:linear-gradient(0deg,rgba(8,8,10,.88),rgba(8,8,10,0));display:flex;flex-direction:column;gap:1px}
.ref figcaption strong{font-family:'Poppins';font-weight:600;font-size:.88rem;letter-spacing:-.01em;line-height:1.2}
.ref figcaption span{font-size:.73rem;color:rgba(243,243,244,.72)}
@media(max-width:1000px){.refgrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.refgrid{grid-template-columns:repeat(2,1fr);gap:10px}}

/* ESG wheel */
.esg{position:relative;width:min(94vw,660px);aspect-ratio:1;margin:20px auto 0}
.esg-ring{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.esg-ring circle{fill:none;stroke:var(--line-strong);stroke-width:.3;stroke-dasharray:277;stroke-dashoffset:277;transition:stroke-dashoffset 1.5s var(--ease)}
.esg.in .esg-ring circle{stroke-dashoffset:0}
.esg-ring .esg-prog{stroke:var(--accent);stroke-width:.9;stroke-linecap:round;stroke-dasharray:0 100;stroke-dashoffset:0;
  transform:rotate(-90deg);transform-origin:50% 50%;transition:stroke-dasharray .7s var(--ease);
  filter:drop-shadow(0 0 5px rgba(140,198,63,.5))}
.esg-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54%;height:54%;display:flex;align-items:center;justify-content:center;text-align:center}
.esg-c{font-family:'Poppins';font-weight:700;font-size:clamp(2.4rem,7vw,4.2rem);color:var(--accent-tx);letter-spacing:-.02em;transition:opacity .35s}
.esg-d{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;opacity:0;transition:opacity .35s}
.esg-dt{font-family:'Poppins';font-weight:700;font-size:clamp(1.1rem,2.1vw,1.55rem);color:var(--accent-tx);line-height:1.12;letter-spacing:-.01em;max-width:100%;overflow-wrap:break-word;hyphens:auto}
.esg-dd{font-size:clamp(.8rem,1.35vw,.98rem);color:var(--muted);line-height:1.4;max-width:26ch}
.esg.show .esg-c{opacity:0}
.esg.show .esg-d{opacity:1}
.esg-node{position:absolute;transform:translate(-50%,-50%);width:clamp(56px,12vw,80px);height:clamp(56px,12vw,80px);border-radius:50%;
  background:var(--surface);border:1px solid var(--line-strong);color:var(--accent-tx);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;
  opacity:0;transition:opacity .5s var(--ease) calc(var(--i)*.05s),background .35s,border-color .35s,color .35s,transform .4s var(--ease),box-shadow .35s}
.esg.in .esg-node{opacity:1}
.esg-node:hover,.esg-node:focus-visible{background:var(--accent-deep);border-color:var(--accent-tx);transform:translate(-50%,-50%) scale(1.12);outline:none;z-index:2}
.esg-node.active{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);transform:translate(-50%,-50%) scale(1.16);box-shadow:0 0 0 7px rgba(140,198,63,.13),0 0 20px rgba(140,198,63,.4);z-index:3}
.esg-ic svg{width:clamp(26px,6vw,34px);height:clamp(26px,6vw,34px)}
@media (prefers-reduced-motion:reduce){.esg-ring circle{stroke-dashoffset:0}.esg-node{opacity:1}}

/* group / partner cards */
.grouplist{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grouplist.g2{grid-template-columns:repeat(2,1fr)}
.gco{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:30px;display:flex;flex-direction:column;gap:12px;transition:border-color .35s,transform .35s var(--ease),box-shadow .35s}
.gco:hover{border-color:var(--accent-dim);transform:translateY(-4px);box-shadow:0 18px 40px rgba(0,0,0,.22)}
.gco-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px}
.gco-logo{flex:none}
.gco-logo{min-width:56px;height:56px;padding:10px 14px;border-radius:14px;background:#FFFFFF;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
  font-family:'Poppins';font-weight:700;font-size:1.15rem;letter-spacing:-.02em;color:#3F7A17;transition:transform .35s var(--ease),box-shadow .35s}
.gco-logo img{max-height:30px;max-width:130px;width:auto;object-fit:contain;display:block}
.gco:hover .gco-logo{transform:scale(1.04);box-shadow:0 6px 18px rgba(0,0,0,.25)}
.badge{font-family:'Geist';font-size:.72rem;letter-spacing:.05em;color:var(--accent-tx);border:1px solid var(--accent-dim);border-radius:var(--r-pill);padding:5px 12px;white-space:nowrap}
.gco h3{font-size:1.5rem;font-weight:600}
.gco p{color:var(--muted);font-size:.92rem;flex:1}
.gco-note{color:var(--faint);font-size:.85rem}
.gco .tlink{margin-top:6px}
@media(max-width:820px){.grouplist,.grouplist.g2{grid-template-columns:1fr}}

/* contact */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,72px);align-items:start}
.contact-info .row{display:flex;gap:14px;align-items:flex-start;padding:18px 0;border-top:1px solid var(--line)}
.contact-info .row svg{width:20px;height:20px;color:var(--accent-tx);flex:none;margin-top:2px}
.contact-info .row a,.contact-info .row span{color:var(--muted)}
.contact-info .row a:hover{color:var(--text)}
form .field{margin-bottom:18px}
form label{display:block;font-size:.84rem;color:var(--muted);margin-bottom:8px}
form input,form textarea{width:100%;background:var(--surface);border:1px solid var(--line-strong);border-radius:10px;color:var(--text);
  font:inherit;font-size:.95rem;padding:13px 15px;transition:border-color .25s}
form input::placeholder,form textarea::placeholder{color:var(--muted)}
form input:focus-visible,form textarea:focus-visible{outline:none;border-color:var(--accent-tx);box-shadow:0 0 0 3px rgba(140,198,63,.25)}
form textarea{resize:vertical;min-height:130px}
.form-note{color:var(--muted);font-size:.82rem;margin-top:14px}
.form-status{color:var(--accent-tx);font-size:.9rem;margin-top:14px;min-height:1.2em}
@media(max-width:820px){.contact-grid{grid-template-columns:1fr}}

/* offices */
.region{margin-bottom:40px}
.region h3{font-size:.95rem;color:var(--faint);font-weight:500;letter-spacing:.04em;margin-bottom:18px;text-transform:uppercase}
.offices{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r-card);overflow:hidden}
.office{background:var(--bg);padding:24px}
.office h4{font-size:1.15rem;font-weight:600;margin-bottom:6px}
.office p{color:var(--muted);font-size:.86rem;line-height:1.6}
@media(max-width:820px){.offices{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.offices{grid-template-columns:1fr}}

/* header icon link (lock) */
.icon-link{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:var(--muted);transition:color .3s,background .3s}
.icon-link svg{width:19px;height:19px}
.icon-link:hover{color:var(--accent-tx);background:var(--surface)}

/* contact offices */
.office-row{position:relative;padding:16px 0;border-top:1px solid var(--line)}
.office-row::before{content:"";position:absolute;top:-1px;left:0;height:1px;width:0;background:var(--accent);transition:width .7s var(--ease)}
.office-row:hover::before{width:100%}
.office-row h3{font-size:1.05rem;font-weight:600;margin-bottom:2px}
.office-row p{color:var(--muted);font-size:.9rem}

/* premium contact form card */
.form-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);
  padding:clamp(26px,3.4vw,42px);box-shadow:0 30px 70px -38px rgba(0,0,0,.35)}
.fc-k{font-family:'Geist';font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;color:var(--accent-tx);margin-bottom:20px}
.topics{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.topic input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px;margin:0}
.topic span{display:inline-block;padding:8px 16px;border:1px solid var(--line-strong);border-radius:var(--r-pill);
  font-size:.86rem;color:var(--muted);cursor:pointer;transition:border-color .3s,color .3s,background .3s}
.topic span:hover{border-color:var(--accent-tx)}
.topic input:checked+span{border-color:var(--accent-tx);color:var(--accent-tx);background:rgba(140,198,63,.09)}
.topic input:focus-visible+span{outline:2px solid var(--accent-tx);outline-offset:2px}
.form-card .field{position:relative;margin-bottom:26px}
.form-card label{font-family:'Geist';font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.form-card input,.form-card textarea{background:transparent;border:0;border-bottom:1px solid var(--line-strong);border-radius:0;padding:12px 2px}
.form-card input:focus-visible,.form-card textarea:focus-visible{outline:none;border-color:var(--line-strong);box-shadow:none}
.form-card .field::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--accent);transition:width .55s var(--ease)}
.form-card .field:focus-within::after{width:100%}

/* projects gallery */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.shot{margin:0;border-radius:var(--r-card);overflow:hidden;position:relative;border:1px solid var(--line);background:var(--surface)}
.shot img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;transition:transform .6s var(--ease),filter .4s}
.shot figcaption{position:absolute;left:0;right:0;bottom:0;padding:16px;font-size:.85rem;color:#F2F3EE;
  background:linear-gradient(0deg,rgba(8,9,7,.82),transparent);opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s var(--ease)}
.shot:hover img{transform:scale(1.06)}
.shot:hover figcaption{opacity:1;transform:none}
@media(max-width:860px){.gallery{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.gallery{grid-template-columns:1fr}}

/* secure area */
.secure-grid{display:grid;grid-template-columns:1fr .8fr;gap:clamp(24px,4vw,56px);align-items:start}
.access-list{display:flex;flex-direction:column;gap:2px}
.access{padding:22px 0;border-top:1px solid var(--line)}
.access:first-child{border-top:0}
.access h3{font-size:1.25rem;font-weight:600;margin-bottom:4px}
.access p{color:var(--muted);font-size:.92rem;max-width:52ch}
.login-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-card);padding:clamp(24px,3vw,34px);box-shadow:0 24px 60px rgba(0,0,0,.28)}
.lock-badge{width:52px;height:52px;border-radius:14px;background:var(--accent-deep);color:var(--accent-tx);display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.lock-badge svg{width:24px;height:24px}
.login-card h3{font-size:1.4rem;font-weight:600;margin-bottom:18px}
.login-card .tlink{margin-top:18px}
.powered{margin-top:24px;padding-top:18px;border-top:1px solid var(--line);color:var(--faint);font-size:.82rem;letter-spacing:.02em}
.powered strong{color:var(--accent-tx);font-weight:600}
@media(max-width:820px){.secure-grid{grid-template-columns:1fr}}

/* legal prose */
.prose{max-width:70ch}
.prose h2{font-size:1.5rem;margin:38px 0 12px}
.prose p,.prose li{color:var(--muted);margin-bottom:12px}
.prose ul{padding-left:20px}
.callout{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;padding:18px 20px;color:var(--muted);margin:24px 0}

/* CTA */
.cta{position:relative;overflow:hidden;background:var(--bg-2);border-top:1px solid var(--line)}
.cta canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:.7}
.cta .wrap{position:relative;z-index:2;text-align:center;padding-top:clamp(80px,11vw,150px);padding-bottom:clamp(80px,11vw,150px)}
.cta h2{font-size:clamp(2.2rem,5.6vw,4.4rem);font-weight:600;max-width:20ch;margin:0 auto;text-wrap:balance}
.cta h2 .g{color:var(--accent-tx)}
.cta .btn{margin-top:32px}

/* footer */
footer{background:var(--bg);padding:64px 0 38px;font-size:.9rem;border-top:1px solid var(--line)}
footer .top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:44px;padding-bottom:40px;border-bottom:1px solid var(--line)}
footer .brand{font-size:1.5rem}
footer .top p{color:var(--muted);margin-top:14px;max-width:42ch}
footer .col h4{font-family:'Geist';font-weight:500;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}
footer .col a{display:block;color:var(--muted);line-height:2.1;transition:color .25s}
footer .col a:hover{color:var(--accent-tx)}
footer .bottom{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;padding-top:24px;color:var(--faint);font-size:.82rem}
footer .bottom a{color:var(--faint)}
footer .bottom a:hover{color:var(--accent-tx)}
@media(max-width:760px){footer .top{grid-template-columns:1fr;gap:30px}}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  [data-reveal]{opacity:1;transform:none;filter:none}
  .hero-img{animation:none}
  html{scroll-behavior:auto}
}

/* mobile refinements */
@media(max-width:640px){
  .esg-dt{font-size:1.02rem}
  .esg-dd{font-size:.78rem;max-width:24ch}
  form input,form textarea{font-size:16px}
  .form-card{padding:22px 18px}
  .topics{gap:6px}
  .topic span{padding:7px 12px;font-size:.8rem}
}
