/* GrowthGo · web v2 · identity: ivory + charcoal, light does the color (ElevenLabs / Claude inspired)
   1 Tokens · 2 Base · 3 Type · 4 Components · 5 Sections · 6 Responsive · 7 Reduced motion */

/* ---------- 1 · Tokens ---------- */
@font-face{font-family:"Inter Tight";src:url("../assets/fonts/InterTight-var.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("../assets/fonts/InstrumentSerif-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("../assets/fonts/InstrumentSerif-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}

:root{
  --gg-ink:#1F2421; --gg-ivory:#F3EFE5; --gg-paper:#FBF9F4;
  --gg-line:rgba(31,36,33,.12); --gg-line-2:rgba(31,36,33,.07); --gg-mute:rgba(31,36,33,.58);
  --gg-sales:#FF6B4A; --gg-mkt:#8B5CF6; --gg-ai:#3D7BFF; --gg-talent:#FFB547;
  --sans:"Inter Tight",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Instrument Serif",Georgia,serif;
  --on-dark:rgba(243,239,229,.72); --on-dark-2:rgba(243,239,229,.5); --line-d:rgba(243,239,229,.14);
  --nav-h:68px; --gutter:20px; --maxw:1240px; --r:22px;
  --ease:cubic-bezier(.16,1,.3,1);
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- 2 · Base ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-padding-top:var(--nav-h)}
body{font-family:var(--sans);font-size:16px;line-height:1.55;color:var(--gg-ink);background:var(--gg-ivory);-webkit-font-smoothing:antialiased;overflow-x:clip}
body.menu-open{overflow:hidden}
img,svg,video,canvas{display:block;max-width:100%}
video{object-fit:cover}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
p{text-wrap:pretty}
h1,h2,h3{text-wrap:balance;font-weight:300}
::selection{background:var(--gg-ink);color:var(--gg-ivory)}
:focus-visible{outline:2px solid var(--gg-ai);outline-offset:3px;border-radius:8px}
.wrap{width:min(var(--maxw),100% - 2*var(--gutter));margin-inline:auto}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;top:-80px;left:12px;z-index:999;padding:10px 14px;border-radius:10px;background:var(--gg-ink);color:var(--gg-ivory)}
.skip:focus{top:12px}
.center{text-align:center;margin-inline:auto}

/* ---------- 3 · Type ---------- */
.h-xl{font-weight:300;font-size:clamp(2.7rem,1rem + 6.4vw,6.8rem);line-height:.98;letter-spacing:-.045em}
.h-l{font-weight:300;font-size:clamp(2.1rem,1rem + 3.6vw,4.2rem);line-height:1.02;letter-spacing:-.04em}
.h-m{font-weight:300;font-size:clamp(1.6rem,1rem + 1.7vw,2.4rem);line-height:1.08;letter-spacing:-.03em}
.h-xl em,.h-l em,.h-m em{font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.015em}
.ey{font-weight:500;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--gg-mute);margin-bottom:16px}
.ey-light,.dark .ey{color:var(--on-dark-2)}
.lead{font-size:clamp(1.02rem,.95rem + .35vw,1.22rem);line-height:1.55;color:var(--gg-mute);max-width:52ch;margin-top:20px}
.dark .lead{color:var(--on-dark)}
.fine{font-size:12.5px;color:var(--gg-mute);margin-top:26px;max-width:70ch}

/* ---------- 4 · Components ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 20px;border-radius:999px;font-weight:500;font-size:14.5px;letter-spacing:-.005em;white-space:nowrap;transition:transform .5s var(--ease),background-color .3s,color .3s,box-shadow .5s var(--ease)}
.btn-lg{height:54px;padding:0 26px;font-size:15.5px}
.btn-ink{background:var(--gg-ink);color:var(--gg-ivory)}
.btn-ink:hover{transform:translateY(-2px);box-shadow:0 14px 30px -16px rgba(31,36,33,.6)}
.btn-ghost{border:1px solid var(--gg-line);background:rgba(255,255,255,.5)}
.btn-ghost:hover{border-color:var(--gg-ink)}
.btn-ivory{background:var(--gg-ivory);color:var(--gg-ink)}
.btn-ivory:hover{transform:translateY(-2px);box-shadow:0 14px 34px -14px rgba(243,239,229,.45)}

/* chip of operation (brand signature) */
.gg-chip{display:inline-flex;align-items:center;gap:.6em;height:38px;padding:0 15px 0 7px;border-radius:999px;font-weight:500;font-size:13.5px;letter-spacing:-.005em;white-space:nowrap;
  background:rgba(22,25,23,.62);color:var(--gg-ivory);border:1px solid rgba(243,239,229,.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.gg-chip.on-light{background:rgba(255,255,255,.86);color:var(--gg-ink);border-color:var(--gg-line);box-shadow:0 10px 26px -18px rgba(31,36,33,.45)}
.gg-chip.sm{height:32px;font-size:12.5px;padding:0 12px 0 5px}
.gg-chip .ic{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;flex:none}
.gg-chip.sm .ic{width:21px;height:21px}
.gg-chip .ic svg{width:12px;height:12px;stroke:var(--gg-ink);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.gg-chip .mut{opacity:.55;font-weight:400}
.ic.sales{background:var(--gg-sales)} .ic.mkt{background:var(--gg-mkt)} .ic.ai{background:var(--gg-ai)} .ic.talent{background:var(--gg-talent)}
.ic.mkt svg,.ic.ai svg{stroke:#fff}
.gg-chip.grey{color:var(--gg-mute)} .ic.grey{background:#E4DED1}

/* light (watercolor glow with grain) */
.glow-field{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.glow{position:absolute;border-radius:50%;filter:blur(70px);will-change:transform,opacity}
.grain{position:absolute;inset:-50%;background-image:var(--grain);opacity:.16;mix-blend-mode:multiply}
.dark .grain{mix-blend-mode:overlay;opacity:.22}
.person-dot{display:block;width:12px;height:12px;border-radius:50%;background:var(--gg-ink);position:relative}
.person-dot::before,.person-dot::after{content:"";position:absolute;inset:-18px;border-radius:50%;background:radial-gradient(circle,rgba(31,36,33,.12),rgba(31,36,33,0) 70%)}
.person-dot::after{inset:-46px;background:radial-gradient(circle,rgba(31,36,33,.06),rgba(31,36,33,0) 70%)}
.breathe{animation:breathe 7s ease-in-out infinite}
.breathe-dot::before{animation:halo 4.2s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:translate(-50%,-50%) scale(1);opacity:.9}50%{transform:translate(-50%,-50%) scale(1.12);opacity:1}}
@keyframes halo{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.35);opacity:.55}}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(6%,-4%) scale(1.08)}66%{transform:translate(-5%,5%) scale(.95)}}
@keyframes pulseDot{0%,100%{box-shadow:0 0 0 0 currentColor}50%{box-shadow:0 0 0 5px transparent}}

/* blur-in words */
.w{display:inline-block;will-change:filter,opacity,transform}

/* reveals */
.js [data-reveal]{opacity:0;transform:translateY(22px);filter:blur(6px);transition:opacity 1s var(--ease),transform 1.1s var(--ease),filter 1s var(--ease)}
.js [data-reveal].in{opacity:1;transform:none;filter:none}

/* ---------- 5 · Sections ---------- */
/* NAV */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;height:var(--nav-h);transition:background-color .4s,box-shadow .4s}
.nav.scrolled,.nav.open{background:rgba(243,239,229,.82);backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);box-shadow:0 1px 0 var(--gg-line)}
.nav-in{height:100%;display:flex;align-items:center;gap:24px}
.nav-logo img{width:118px;height:auto}
.nav-links{display:none;gap:28px;margin-inline:auto;font-size:14px;color:var(--gg-mute)}
.nav-links a{transition:color .3s}
.nav-links a:hover,.nav-links a.act{color:var(--gg-ink)}
.nav-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.nav-cta{display:none}
.lang{display:inline-flex;padding:3px;border-radius:999px;border:1px solid var(--gg-line);background:rgba(255,255,255,.5)}
.lang button{height:28px;min-width:34px;padding:0 8px;border-radius:999px;font-size:12px;font-weight:500;color:var(--gg-mute)}
.lang button[aria-pressed="true"]{background:var(--gg-ink);color:var(--gg-ivory)}
.lang-dark{border-color:var(--line-d);background:rgba(255,255,255,.04)}
.lang-dark button{color:var(--on-dark)}
.lang-dark button[aria-pressed="true"]{background:var(--gg-ivory);color:var(--gg-ink)}
.burger{width:40px;height:40px;border-radius:50%;border:1px solid var(--gg-line);display:grid;place-content:center;gap:5px}
.burger i{display:block;width:15px;height:1.5px;background:var(--gg-ink);transition:transform .45s var(--ease)}
.nav.open .burger i:first-child{transform:translateY(3.2px) rotate(45deg)}
.nav.open .burger i:nth-child(2){transform:translateY(-3.2px) rotate(-45deg)}
.mnav{position:fixed;inset:var(--nav-h) 0 0 0;background:var(--gg-ivory);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .35s,transform .45s var(--ease),visibility 0s .45s}
.nav.open .mnav{opacity:1;visibility:visible;transform:none;transition:opacity .35s,transform .45s var(--ease)}
.mnav-in{display:grid;gap:4px;padding-top:28px}
.mnav-in a:not(.btn){font-weight:300;font-size:2rem;letter-spacing:-.03em;padding:8px 0;border-bottom:1px solid var(--gg-line-2)}
.mnav-in .btn{margin-top:24px;justify-self:start}

/* HERO */
.hero{position:relative;min-height:100vh;min-height:100svh;display:grid;place-items:center;text-align:center;padding:calc(var(--nav-h) + 40px) 0 160px;overflow:clip;isolation:isolate}
.hero-in{position:relative;z-index:2}
.hero .h-xl{max-width:15ch;margin-inline:auto}
.hero .lead{margin-inline:auto}
.ctas{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:32px}
.g-neutral{width:70vmax;height:70vmax;left:50%;top:44%;background:radial-gradient(circle,rgba(176,190,214,.55),rgba(214,206,226,.25) 45%,rgba(243,239,229,0) 70%);filter:blur(40px)}
.g-sales{width:38vmax;height:38vmax;left:-6%;top:40%;background:var(--gg-sales)}
.g-mkt{width:36vmax;height:36vmax;right:-8%;top:16%;background:var(--gg-mkt)}
.g-ai{width:34vmax;height:34vmax;left:22%;bottom:-22%;background:var(--gg-ai)}
.g-talent{width:30vmax;height:30vmax;right:14%;bottom:-18%;background:var(--gg-talent)}
.hero [data-team-light]{opacity:.32}
.js .hero [data-team-light]{opacity:0}
.hero-person{position:absolute;left:50%;bottom:72px;transform:translateX(-50%);z-index:2;width:min(760px,92vw);height:120px}
.hero-person .person-dot{position:absolute;left:50%;top:50%;margin:-6px 0 0 -6px}
.orbit{position:absolute;top:50%;left:50%}
.o1{transform:translate(-118%,-150%)} .o2{transform:translate(18%,-160%)} .o3{transform:translate(-128%,60%)} .o4{transform:translate(26%,58%)}
.js .orbit{opacity:0}

/* SECTIONS */
.sec{position:relative;padding:clamp(5rem,10vw,9rem) 0;isolation:isolate}
.dark{background:var(--gg-ink);color:var(--gg-ivory)}

/* MAP */
.mapsec{overflow:clip}
.map-grid{display:grid;gap:40px;align-items:center}
.map-stage{position:relative;width:100%;max-width:640px;aspect-ratio:96/116;margin:0 auto 64px}
.map-fallback,.map-canvas,.map-arcs{position:absolute;inset:0;width:100%;height:100%}
.map-fallback{opacity:.5}
.js .map-fallback{display:none}
.map-arcs{overflow:visible}
.map-arcs path{fill:none;stroke:rgba(243,239,229,.28);stroke-width:.25}
.map-arcs path.on{stroke:rgba(243,239,229,.75)}
.map-arcs .pulse{stroke:var(--gg-ivory);stroke-width:.75;filter:drop-shadow(0 0 3px rgba(243,239,229,.9))}
.map-marks{position:absolute;inset:0}
.mk{position:absolute;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;z-index:2}
.mk.c{background:var(--gg-sales);color:rgba(255,107,74,.5);box-shadow:0 0 0 4px rgba(255,107,74,.18)}
.mk.p{background:var(--gg-ivory);color:rgba(243,239,229,.4);box-shadow:0 0 0 4px rgba(243,239,229,.12)}
.mk.live{animation:pulseDot 1.6s ease-in-out infinite}
.mlabel{position:absolute;z-index:3;transform:translate(14px,-50%);height:30px;font-size:12px;padding:0 11px 0 5px;gap:6px;opacity:0;transition:opacity .5s var(--ease),transform .6s var(--ease);pointer-events:none}
.mlabel.l{transform:translate(calc(-100% - 14px),-50%)}
.mlabel.show{opacity:1}
.mlabel .ic{width:20px;height:20px}
.mstatus{position:absolute;z-index:4;transform:translate(-50%,-50%) scale(.92);opacity:0;transition:opacity .45s var(--ease),transform .55s var(--ease);height:32px;font-size:12.5px}
.mstatus.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.map-legend{position:absolute;left:0;top:100%;margin-top:14px;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--on-dark-2)}
.map-legend span{display:inline-flex;align-items:center;gap:7px}
.map-legend i{width:8px;height:8px;border-radius:50%}
.lg-c{background:var(--gg-sales)} .lg-p{background:var(--gg-ivory)}
.map-legend .note{padding:2px 8px;border:1px solid var(--line-d);border-radius:999px}
.map-side .h-l{font-size:clamp(1.9rem,1rem + 2.4vw,3.1rem)}
.sys{display:grid;gap:10px;margin-top:28px}
.sys-card{position:relative;display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.045);border:1px solid var(--line-d);transition:border-color .5s,background-color .5s}
.sys-card b{display:block;font-weight:500;font-size:15px}
.sys-card small{font-size:13px;color:var(--on-dark-2)}
.sys-dot{width:10px;height:10px;border-radius:50%;flex:none;margin-top:6px}
[data-layer="sales"] .sys-dot,.hl-sales .sys-dot{background:var(--gg-sales)}
[data-layer="mkt"] .sys-dot,.hl-mkt .sys-dot{background:var(--gg-mkt)}
[data-layer="ai"] .sys-dot,.hl-ai .sys-dot{background:var(--gg-ai)}
[data-layer="talent"] .sys-dot,.hl-talent .sys-dot{background:var(--gg-talent)}
.sys-card.lit{border-color:rgba(243,239,229,.35);background:rgba(255,255,255,.08)}
.sys-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:1;display:none}
.sys-lines path{fill:none;stroke-width:1.2;opacity:0;transition:opacity .5s}
.sys-lines path.on{opacity:.7}
.sys-lines .pulse{stroke-width:2.6;opacity:1;filter:drop-shadow(0 0 5px currentColor)}

/* PROBLEM */
.problem-in{display:flex;flex-direction:column;align-items:center}
.pile{position:relative;width:min(640px,100%);height:300px;margin:40px auto 10px}
.pile .gg-chip{--drop:0px;position:absolute;left:50%;top:62%;transform:translate(-50%,-50%) translate(calc(var(--x) * 3.2),calc(var(--y) * 2.6 + var(--drop))) rotate(var(--r))}
.pile-dot{position:absolute;left:50%;top:92%;margin:-6px 0 0 -6px}
.pb-end{margin-top:34px}
.problem .lead{text-align:center}

/* HOW */
.how-head{max-width:760px}
.how-stage{position:relative;display:grid;gap:14px;margin-top:44px}
.how-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0;display:none}
.how-lines path{fill:none;stroke-width:1.2;stroke-dasharray:4 6}
.how-lines .pulse{stroke-dasharray:none;stroke-width:2.6;filter:drop-shadow(0 0 5px currentColor)}
.how-center{position:relative;z-index:2;display:grid;justify-items:center;gap:14px;padding:24px;text-align:center}
.how-center b{font-weight:500;font-size:14px}
.center-light{position:absolute;width:240px;height:240px;left:50%;top:40%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(31,36,33,.08),rgba(31,36,33,0) 70%)}
.how-layer{position:relative;z-index:2;padding:20px;border-radius:var(--r);background:rgba(251,249,244,.86);border:1px solid var(--gg-line);overflow:hidden;isolation:isolate}
.how-layer header{display:flex;align-items:center;gap:10px}
.how-layer header b{font-weight:500;font-size:16px}
.how-layer header .sys-dot{margin:0}
.how-layer p{margin:10px 0 14px;font-size:14.5px;color:var(--gg-mute);max-width:36ch}
.hl-glow{position:absolute;width:220px;height:220px;right:-80px;top:-90px;border-radius:50%;filter:blur(50px);opacity:.45;z-index:-1}
.hl-sales .hl-glow{background:var(--gg-sales)} .hl-mkt .hl-glow{background:var(--gg-mkt)} .hl-ai .hl-glow{background:var(--gg-ai)} .hl-talent .hl-glow{background:var(--gg-talent)}

/* CONNECTED */
.conn{background:var(--gg-paper)}
.conn-grid{display:grid;gap:40px;align-items:center}
.call{border-radius:26px;background:#fff;border:1px solid var(--gg-line);box-shadow:0 50px 90px -60px rgba(31,36,33,.55);overflow:hidden}
.call-bar{display:flex;align-items:center;gap:12px;height:46px;padding:0 16px;border-bottom:1px solid var(--gg-line-2);font-size:13px}
.call-bar b{font-weight:500}
.call-bar .dots{display:flex;gap:6px}
.call-bar .dots i{width:9px;height:9px;border-radius:50%;background:#E4DED1}
.live{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.1em;color:var(--gg-sales)}
.live i{width:7px;height:7px;border-radius:50%;background:var(--gg-sales);animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.3}}
.call-body{position:relative;display:grid;grid-template-columns:1fr 1.15fr 1fr;grid-template-rows:1fr 1fr;gap:12px;padding:14px;background:#F6F3EC}
.call-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:3}
.call-lines path{fill:none;stroke:rgba(31,36,33,.25);stroke-width:1;stroke-dasharray:3 5}
.call-lines .pulse{stroke-dasharray:none;stroke-width:2.6;filter:drop-shadow(0 0 5px currentColor)}
.call-main{grid-column:2;grid-row:1 / 3;position:relative;border-radius:16px;overflow:hidden;background:#ddd;aspect-ratio:9/14}
.call-main video{width:100%;height:100%}
.call-tag{position:absolute;left:10px;bottom:10px;padding:4px 9px;border-radius:999px;background:rgba(22,25,23,.6);color:var(--gg-ivory);font-size:10.5px;letter-spacing:.04em;backdrop-filter:blur(8px)}
.call-tile{position:relative;border-radius:16px;overflow:hidden;background:var(--gg-ink);color:var(--gg-ivory);display:flex;align-items:flex-end;gap:7px;padding:12px;font-size:12.5px;font-weight:500;min-height:120px;isolation:isolate}
.ct-sales{grid-column:1;grid-row:1}.ct-mkt{grid-column:3;grid-row:1}.ct-ai{grid-column:1;grid-row:2}.ct-talent{grid-column:3;grid-row:2}
.tile-light{position:absolute;width:80%;height:80%;right:-20%;top:-25%;border-radius:50%;filter:blur(34px);opacity:.6;z-index:-1;animation:drift 9s ease-in-out infinite}
.ct-sales .tile-light{background:var(--gg-sales)}.ct-mkt .tile-light{background:var(--gg-mkt);animation-delay:-2s}.ct-ai .tile-light{background:var(--gg-ai);animation-delay:-4s}.ct-talent .tile-light{background:var(--gg-talent);animation-delay:-6s}
.status{width:8px;height:8px;border-radius:50%;background:#7CF29A;color:rgba(124,242,154,.6);animation:pulseDot 1.8s ease-in-out infinite;flex:none;margin-bottom:4px}

/* HUMANS × AI */
.hai-grid{display:grid;gap:16px;margin-top:44px}
.hai-col{position:relative;overflow:hidden;isolation:isolate;padding:28px;border-radius:26px;background:var(--gg-paper);border:1px solid var(--gg-line);min-height:380px}
.hai-light{position:absolute;width:360px;height:360px;right:-120px;top:-140px;border-radius:50%;filter:blur(60px);opacity:.45;z-index:-1}
.hai-ai .hai-light{background:var(--gg-ai)} .hai-human .hai-light{background:var(--gg-sales)}
.feed{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:30px}
.hai-foot{margin-top:34px;text-align:center}

/* WORK */
.work-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px}
.tabs{display:inline-flex;gap:4px;padding:4px;border-radius:999px;border:1px solid var(--gg-line);background:rgba(255,255,255,.55)}
.tabs button{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:500;color:var(--gg-mute);transition:background-color .3s,color .3s}
.tabs button[aria-selected="true"]{background:var(--gg-ink);color:var(--gg-ivory)}
.tabs i{width:8px;height:8px;border-radius:50%}
.dot-sales{background:var(--gg-sales)}.dot-mkt{background:var(--gg-mkt)}.dot-talent{background:var(--gg-talent)}
.wf-shell{position:relative;margin-top:28px;border-radius:26px;background:var(--gg-paper);border:1px solid var(--gg-line);box-shadow:0 50px 90px -70px rgba(31,36,33,.6);padding:16px;overflow:hidden}
.sim{position:absolute;top:14px;right:16px;z-index:5;font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gg-mute);border:1px dashed rgba(31,36,33,.3);border-radius:6px;padding:3px 8px;background:var(--gg-paper)}
.wf[hidden]{display:none}

/* sales workflow */
.ws-body{position:relative;display:grid;gap:12px;padding-top:30px}
.ws-zone{position:relative;z-index:1;padding:16px;border-radius:18px;background:#fff;border:1px solid var(--gg-line-2)}
.ws-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:11.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--gg-mute)}
.ws-n{text-transform:none;letter-spacing:0;font-weight:400}
.ws-n b{font-weight:300;font-size:1.6rem;color:var(--gg-ink);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.ws-swarm-wrap{margin-top:12px;border-radius:12px;background:#F6F3EC;overflow:hidden}
.ws-swarm{width:100%;aspect-ratio:320/210}
.ws-dot{fill:rgba(31,36,33,.35)}
.ws-dot.lit{fill:var(--gg-ai)}
.ws-link{fill:none;stroke:rgba(61,123,255,.5);stroke-width:.8;stroke-dasharray:1 1}
.ws-ai{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:13px;color:var(--gg-mute);min-height:2.8em}
.ai-tag{flex:none;display:grid;place-items:center;width:28px;height:22px;border-radius:7px;background:var(--gg-ai);color:#fff;font-size:10.5px;font-weight:700}
.ws-leads{display:grid;gap:8px;margin-top:12px}
.lead-c{display:grid;grid-template-columns:34px 1fr;gap:3px 10px;align-items:center;padding:10px;border-radius:14px;border:1px solid var(--gg-line-2);background:var(--gg-paper)}
.av{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--gg-ink);color:var(--gg-ivory);font-size:11px;font-weight:600;grid-row:span 2}
.lead-c b{font-weight:500;font-size:14px}
.lead-c small{display:block;font-size:12px;color:var(--gg-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.st{grid-column:2;justify-self:start;display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:999px;font-size:11.5px;font-weight:500;background:#ECE8DF;color:var(--gg-mute)}
.st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st-q{background:rgba(61,123,255,.12);color:#2A5FD6}
.st-meet{background:rgba(255,107,74,.15);color:#D9482A}
.ws-cal{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:14px}
.ws-cal i{position:relative;height:22px;border-radius:6px;background:#F1EDE4}
.ws-cal i::after{content:"";position:absolute;inset:3px;border-radius:4px;background:var(--gg-ink);opacity:.8;transform:scale(1);transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
.ws-cal i:not(.on)::after{display:none}
.ws-cal i.first::after{background:var(--gg-sales);opacity:1}
.ws-anim .ws-cal i.on::after{transform:scale(0)}
.ws-anim .ws-cal i.on.lit::after{transform:scale(1)}
.ws-cal.notr i::after{transition:none!important}
.ws-chart{width:100%;height:70px;margin-top:14px;overflow:visible}
.ws-line{fill:none;stroke:var(--gg-ink);stroke-width:2;stroke-dasharray:1 1;stroke-dashoffset:0;stroke-linecap:round}
.ws-rail{display:flex;flex-wrap:wrap;gap:6px 18px;padding:14px 4px 4px;font-size:12px;color:var(--gg-mute)}
.ws-rail li{display:inline-flex;align-items:center;gap:7px;transition:color .3s}
.ws-rail li::before{content:"";width:9px;height:9px;border-radius:50%;border:1.5px solid rgba(31,36,33,.25);transition:background-color .3s,border-color .3s}
.ws-rail li.on::before{background:var(--gg-ink);border-color:var(--gg-ink)}
.ws-rail li.cur{color:var(--gg-ink)}
.ws-rail li.cur::before{background:var(--gg-sales);border-color:var(--gg-sales);box-shadow:0 0 0 4px rgba(255,107,74,.2)}
.wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}
.wires .wire{fill:none;stroke:rgba(31,36,33,.22);stroke-width:1;stroke-dasharray:3 5}
.wires .pulse{fill:none;stroke-width:2.6;filter:drop-shadow(0 0 4px currentColor)}

/* marketing workflow */
.wm-grid{display:grid;gap:16px;padding-top:30px}
.wm-steps{display:grid;gap:6px;counter-reset:s}
.wm-steps li{counter-increment:s;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;font-size:14px;color:var(--gg-mute);transition:background-color .4s,color .4s}
.wm-steps li::before{content:"0" counter(s);font-size:11px;font-weight:600;display:grid;place-items:center;width:28px;height:22px;border-radius:999px;border:1px solid currentColor}
.wm-steps li.cur{background:#fff;color:var(--gg-ink);box-shadow:0 8px 20px -16px rgba(31,36,33,.5)}
.wm-steps li.cur::before{background:var(--gg-mkt);border-color:var(--gg-mkt);color:#fff}
.wm-stage{position:relative;height:clamp(420px,52vw,560px);border-radius:18px;background:#F6F3EC;overflow:hidden;container-type:size}
.wm-layer{position:absolute;inset:0;padding:16px;opacity:0;pointer-events:none}
.wm-layer[data-wm-layer="grid"]{display:grid;grid-template-columns:repeat(6,min(calc((100cqw - 82px) / 6),calc((100cqh - 110px) / 2 * .5625)));justify-content:center;gap:10px;align-content:center;padding:70px 16px 16px}
.wm-layer .slot{aspect-ratio:9/16;display:block}
.wm-lanes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:70px}
.wm-lane{border-radius:14px;background:rgba(255,255,255,.7);border:1px solid var(--gg-line-2);padding:10px}
.wm-lane b{display:flex;align-items:center;gap:8px;font-weight:500;font-size:13px;margin-bottom:8px}
.wm-lane b::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gg-mkt)}
.wm-lane[data-lane="b"] b::before{background:var(--gg-ai)}
.wm-lane[data-lane="c"] b::before{background:var(--gg-sales)}
.wm-slots{display:grid;grid-template-columns:repeat(3,min(calc((100% - 12px) / 3),calc((100cqh - 160px) / 2 * .5625)));gap:6px}
.wm-cal{padding-top:70px}
.wm-cal-h{display:block;font-weight:500;font-size:13px;margin-bottom:8px}
.wm-cal-g{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
.wm-cal-g div{position:relative;border-radius:8px;background:rgba(255,255,255,.75);border:1px solid var(--gg-line-2);height:calc((100cqh - 110px) / 5 - 5px);padding:4px;font-size:9.5px;color:var(--gg-mute);display:flex}
.wm-cal-g .slot{height:100%;aspect-ratio:9/16;margin-left:auto}
.wm-source{position:absolute;left:0;top:0;width:300px;aspect-ratio:9/16;border-radius:14px;overflow:hidden;transform-origin:0 0;z-index:3;box-shadow:0 30px 60px -36px rgba(31,36,33,.7)}
.wm-source img{width:100%;height:100%;object-fit:cover}
.wm-source .rec{position:absolute;top:10px;left:10px;width:9px;height:9px;border-radius:50%;background:var(--gg-sales);animation:blink 1.4s infinite}
.wm-src-l{position:absolute;left:10px;right:10px;bottom:10px;padding:5px 9px;border-radius:999px;background:rgba(22,25,23,.6);color:var(--gg-ivory);font-size:11px;backdrop-filter:blur(8px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wm-clips{position:absolute;inset:0;z-index:2;pointer-events:none}
.wm-clip{position:absolute;left:0;top:0;width:100px;height:177.78px;border-radius:10px;overflow:hidden;transform-origin:0 0;box-shadow:0 12px 26px -18px rgba(31,36,33,.7);opacity:0}
.wm-clip img{width:100%;height:100%;object-fit:cover}
.wm-clip::after{content:"";position:absolute;top:6px;left:6px;width:8px;height:8px;border-radius:50%;background:var(--lc,var(--gg-mkt));box-shadow:0 0 0 2px #fff}
.wm-real{position:absolute;right:14px;bottom:14px;z-index:4;max-width:240px;padding:14px;border-radius:16px;background:var(--gg-ink);color:var(--gg-ivory);opacity:0}
.wm-real b{display:block;margin-top:8px;font-weight:300;font-size:1.25rem;line-height:1.15;letter-spacing:-.02em}
.pill-real{display:inline-block;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:999px;background:var(--gg-ivory);color:var(--gg-ink)}

/* talent workflow */
.wt-board{display:grid;gap:8px;padding-top:30px}
.wt-col{display:grid;gap:8px;padding:10px;border-radius:14px;background:#fff;border:1px solid var(--gg-line-2);align-content:start}
.wt-col header{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600}
.wt-col header em{margin-left:auto;font-style:normal;font-size:11px;font-weight:500;padding:1px 8px;border-radius:999px;background:#F1EDE4;font-variant-numeric:tabular-nums}
.wt-slot{display:flex;flex-wrap:wrap;gap:6px;min-height:40px}
.wt-role{width:100%;padding:10px;border-radius:12px;background:var(--gg-ink);color:var(--gg-ivory)}
.wt-role b{display:block;font-weight:500;font-size:13px}
.wt-role small{font-size:11px;color:var(--on-dark-2)}
.cand{display:flex;align-items:center;gap:8px;padding:6px 10px 6px 6px;border-radius:12px;background:var(--gg-paper);border:1px solid var(--gg-line-2);transition:opacity .4s,filter .4s,box-shadow .4s,border-color .4s}
.cand .av{width:28px;height:28px;font-size:10px;grid-row:auto}
.cand b{display:block;font-weight:500;font-size:12.5px;white-space:nowrap}
.cand small{display:block;font-size:11px;color:var(--gg-mute);white-space:nowrap}
.cand.out{opacity:.35;filter:grayscale(1)}
.cand.sel{border-color:var(--gg-talent);box-shadow:0 0 0 3px rgba(255,181,71,.35)}
.cand.sel .av{background:var(--gg-talent);color:var(--gg-ink)}
.wt-onb{width:100%;padding:10px;border-radius:12px;background:var(--gg-ink);color:var(--gg-ivory)}
.wt-onb .bar{height:4px;border-radius:4px;background:rgba(243,239,229,.15);overflow:hidden}
.wt-onb .bar i{display:block;height:100%;width:100%;background:var(--gg-talent);transition:width .6s var(--ease)}
.wt-onb ul{display:grid;gap:4px;margin-top:8px}
.wt-onb li{font-size:11px;color:var(--on-dark);padding-left:16px;position:relative}
.wt-onb li::before{content:"";position:absolute;left:0;top:3px;width:10px;height:10px;border-radius:50%;border:1.3px solid rgba(243,239,229,.4)}
.wt-onb li.done{color:var(--gg-ivory)}
.wt-onb li.done::before{background:var(--gg-talent);border-color:var(--gg-talent)}
.wt-onb.hide{display:none}

/* ROLES */
.role-grid{display:grid;gap:12px;margin-top:40px}
.role-c{position:relative;overflow:hidden;isolation:isolate;padding:24px;border-radius:var(--r);background:var(--gg-paper);border:1px solid var(--gg-line);transition:border-color .5s,transform .6s var(--ease)}
.role-c:hover{transform:translateY(-3px);border-color:rgba(31,36,33,.22)}
.role-glow{position:absolute;width:240px;height:240px;right:-110px;top:-120px;border-radius:50%;background:var(--c);filter:blur(55px);opacity:.28;z-index:-1;transition:opacity .6s}
.role-c:hover .role-glow{opacity:.55}
.role-dot{display:block;width:10px;height:10px;border-radius:50%;background:var(--c)}
.role-c h3{margin-top:16px;font-weight:400;font-size:1.3rem;letter-spacing:-.02em;line-height:1.2}
.role-c .k{margin-top:16px;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gg-mute)}
.role-c p:not(.k){margin-top:4px;font-size:14.5px}
.role-more{display:grid;place-content:center;justify-items:start;gap:14px;background:transparent;border-style:dashed}
.role-more p{font-family:var(--serif);font-style:italic;font-size:1.6rem;line-height:1.1}

/* PROOF */
.proof-grid{display:grid;gap:12px;margin-top:40px}
.proof-c{padding:28px;border-radius:26px;background:var(--gg-paper);border:1px solid var(--gg-line)}
.tag{display:inline-block;font-size:11px;font-weight:600;letter-spacing:.06em;padding:4px 10px;border-radius:999px;border:1px solid var(--gg-line);color:var(--gg-mute)}
.pk{margin-top:14px;font-size:14px;color:var(--gg-mute)}
.nums{display:flex;flex-wrap:wrap;gap:18px 40px;margin-top:22px}
.nums div{display:grid}
.nums b{font-weight:300;font-size:clamp(2.6rem,1.6rem + 3vw,4.4rem);letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.nums span{margin-top:6px;font-size:13.5px;color:var(--gg-mute)}
.pone{margin-top:22px;font-family:var(--serif);font-style:italic;font-size:1.35rem}

/* START */
.steps{position:relative;display:grid;gap:14px;margin-top:44px}
.steps li{position:relative;padding:24px;border-radius:var(--r);background:var(--gg-paper);border:1px solid var(--gg-line)}
.sn{font-size:12px;font-weight:600;letter-spacing:.1em;color:var(--gg-mute)}
.steps h3{margin-top:12px;font-weight:400;font-size:1.4rem;letter-spacing:-.02em}
.steps p{margin-top:6px;font-size:14.5px;color:var(--gg-mute)}

/* FINAL */
.final{overflow:clip;min-height:90vh;display:grid;place-items:center;text-align:center}
.final-in{position:relative;z-index:2}
.final .h-xl{max-width:14ch;margin-inline:auto}
.final .lead{margin-inline:auto}
.f-sales{width:46vmax;height:46vmax;left:-8%;top:-10%;background:var(--gg-sales);opacity:.55}
.f-mkt{width:44vmax;height:44vmax;right:-10%;top:-14%;background:var(--gg-mkt);opacity:.55}
.f-ai{width:42vmax;height:42vmax;left:16%;bottom:-30%;background:var(--gg-ai);opacity:.5}
.f-talent{width:38vmax;height:38vmax;right:10%;bottom:-26%;background:var(--gg-talent);opacity:.45}
.drift{animation:drift 18s ease-in-out infinite}
.d2{animation-delay:-5s}.d3{animation-delay:-9s}.d4{animation-delay:-13s}
.final-contact{margin-top:22px;font-size:14px;color:var(--on-dark)}
.final-contact a{border-bottom:1px solid rgba(243,239,229,.3)}

/* FOOTER */
.foot{background:var(--gg-ink);color:var(--on-dark);padding:56px 0 40px;border-top:1px solid var(--line-d)}
.foot-grid{display:grid;gap:30px;font-size:14px}
.foot img{width:170px;height:auto}
.foot-grid p{margin-top:12px}
.foot-grid > div{display:grid;gap:6px;align-content:start}
.foot a{color:var(--gg-ivory)}
.foot a:hover{opacity:.7}
.fh{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-2);margin:0 0 4px!important}
.copy{margin-top:10px;font-size:12px;color:var(--on-dark-2)}

/* WhatsApp floating chip */
.wa-float{position:fixed;right:18px;bottom:18px;z-index:90;display:inline-flex;align-items:center;gap:9px;height:48px;padding:0 18px 0 12px;border-radius:999px;
  background:rgba(31,36,33,.88);color:var(--gg-ivory);font-size:14px;font-weight:500;border:1px solid rgba(243,239,229,.14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 16px 36px -18px rgba(31,36,33,.7);transition:transform .5s var(--ease)}
.wa-float:hover{transform:translateY(-2px)}
.wa-float svg{width:22px;height:22px;fill:#25D366}
@media (max-width:539px){.wa-float{width:52px;height:52px;padding:0;justify-content:center}.wa-float span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}

/* no GSAP: show everything */
.no-gsap .orbit{opacity:1}.no-gsap .hero [data-team-light]{opacity:.32}.no-gsap .map-fallback{display:block}.no-gsap .wm-real{opacity:1}

/* ---------- 6 · Responsive ---------- */
@media (min-width:540px){:root{--gutter:28px}.nav-cta{display:inline-flex}}
@media (min-width:720px){
  :root{--gutter:36px}
  .hai-grid,.proof-grid{grid-template-columns:1fr 1fr}
  .role-grid{grid-template-columns:repeat(2,1fr)}
  .how-stage{grid-template-columns:1fr 1fr}
  .how-center{grid-column:1 / -1}
  .steps{grid-template-columns:repeat(3,1fr)}
  .foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr}
  .ws-body{grid-template-columns:1fr 1fr}
  .ws-body .ws-zone:last-of-type{grid-column:1 / -1}
  .wt-board{grid-template-columns:repeat(3,1fr)}
}
@media (min-width:960px){
  :root{--gutter:44px;--nav-h:74px}
  .nav-links{display:flex}
  .burger,.mnav{display:none}
  .map-grid{grid-template-columns:1.25fr .75fr;gap:56px}
  .map-stage{max-height:calc(100vh - 160px);width:auto;height:min(78vh,760px);margin:0}
  .sys-lines{display:block}
  .conn-grid{grid-template-columns:.85fr 1.15fr;gap:60px}
  .role-grid{grid-template-columns:repeat(3,1fr)}
  .proof-grid{grid-template-columns:1.25fr 1fr}
  .ws-body{grid-template-columns:1.12fr 1fr 1fr}
  .ws-body .ws-zone:last-of-type{grid-column:auto}
  .wm-grid{grid-template-columns:240px 1fr;align-items:center}
  .wt-board{grid-template-columns:repeat(6,1fr)}
  .wt-col{min-height:300px}
  .wt-slot{flex-direction:column;flex-wrap:nowrap}
  .wt-slot>*{width:100%}
  /* pinned "how it works": center + 4 corners */
  .how-stage{grid-template-columns:1fr minmax(220px,.7fr) 1fr;grid-template-rows:auto auto;gap:22px 30px;align-items:center}
  .how-center{grid-column:2;grid-row:1 / 3}
  .hl-sales{grid-column:1;grid-row:1}.hl-mkt{grid-column:3;grid-row:1}.hl-ai{grid-column:1;grid-row:2}.hl-talent{grid-column:3;grid-row:2}
  .how-lines{display:block}
  .pin-wrap{min-height:100vh;display:flex;align-items:center;padding:calc(var(--nav-h) + 10px) 0 20px}
  .problem.sec,.how.sec{padding:0}
}
@media (max-width:719px){
  .call-body{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto}
  .call-main{grid-column:1 / -1;grid-row:1;aspect-ratio:4/5}
  .ct-sales{grid-column:1;grid-row:2}.ct-mkt{grid-column:2;grid-row:2}.ct-ai{grid-column:1;grid-row:3}.ct-talent{grid-column:2;grid-row:3}
  .call-lines{display:none}
  .call-tile{min-height:84px}
  .pile{height:260px}
  .pile .gg-chip{font-size:12px;height:32px;transform:translate(-50%,-50%) translate(calc(var(--x) * 1.5),calc(var(--y) * 2.4 + var(--drop))) rotate(var(--r))}
  .hero-person{bottom:40px}
  .o1{transform:translate(-100%,-170%)} .o2{transform:translate(4%,-180%)} .o3{transform:translate(-104%,70%)} .o4{transform:translate(6%,70%)}
  .orbit{font-size:12px;height:32px}
  .wm-layer[data-wm-layer="grid"]{grid-template-columns:repeat(4,min(calc((100cqw - 62px) / 4),calc((100cqh - 120px) / 3 * .5625)))}
}

/* ---------- 7 · Reduced motion (intrusive effects only) ---------- */
@media (prefers-reduced-motion:reduce){
  .breathe,.breathe-dot::before,.drift,.tile-light,.status,.live i,.mk.live,.wm-source .rec{animation:none}
}
