/* ===== Base reset ===== */
html,body{margin:0}
img{max-width:100%}
[hidden]{display:none!important}

:root{
  --ground:#F4F6F0; --surface:#FFFFFF; --sunk:#EBEFE4; --ink:#10140D; --ink-2:#4A5244; --ink-3:#7A8472; --line:#DADFD1;
  --leaf:#86BC29; --leaf-deep:#4B7410; --leaf-wash:#E7F1D5;
  --night:#FFFFFF; --night-2:#F4F7EF; --night-3:#E6EDDB; --night-line:#DCE3D0; --night-ink:#10140D; --night-ink-2:#566050; --lime:#B8E063;
  --display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --body:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --r:18px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ground);color:var(--ink);font:400 16px/1.6 var(--body);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
button{font:inherit;color:inherit}
.wrap{max-width:1200px;margin-inline:auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3,h4{font-family:var(--display);line-height:1.02;text-wrap:balance;margin:0;letter-spacing:-.025em}
p{margin:0}
.eyebrow{font:500 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--leaf-deep);display:inline-flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:18px;height:1.5px;background:currentColor}
.dark .eyebrow{color:var(--leaf-deep)}
:focus-visible{outline:2px solid var(--leaf);outline-offset:3px;border-radius:6px}
.h2{font-size:clamp(34px,5vw,64px);font-weight:800}
.lead{font-size:clamp(17px,1.5vw,19px);color:var(--ink-2);max-width:36em}
.dark{background:var(--night);color:var(--night-ink)}
.dark .lead{color:var(--night-ink-2)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font:600 15px/1 var(--body);padding:15px 22px;border-radius:999px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .2s,background .2s,border-color .2s,color .2s;white-space:nowrap}
.btn .arr{transition:transform .2s}
.btn:hover .arr{transform:translateX(3px)}
.btn-lime{background:var(--lime);color:#10140D}
.btn-lime:hover{background:#C9EC7F}
.btn-ink{background:var(--ink);color:var(--ground)}
.btn-ink:hover{transform:translateY(-1px)}
.btn-line{border-color:var(--line);background:transparent}
.btn-line:hover{border-color:var(--ink)}
.dark .btn-line{border-color:var(--night-line);color:var(--night-ink)}
.dark .btn-line:hover{border-color:var(--night-ink)}

/* header */
header.top{position:fixed;top:0;left:0;right:0;z-index:50;padding-top:env(safe-area-inset-top,0px);transition:background .3s,border-color .3s;border-bottom:1px solid transparent}
header.top.solid{background:color-mix(in srgb,var(--ground) 85%,transparent);backdrop-filter:blur(14px);border-color:var(--night-line)}
.nav{display:flex;align-items:center;gap:20px;height:72px;color:var(--night-ink)}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;font:700 20px/1 var(--display);letter-spacing:-.02em}
.brand img{width:40px;height:40px;border-radius:50%;background:#fff;padding:1px}
.brand small{display:block;font:500 9.5px/1 var(--mono);letter-spacing:.14em;color:var(--night-ink-2);margin-top:5px;text-transform:uppercase}
.links{display:flex;gap:2px;margin-left:auto}
.links a{text-decoration:none;font-weight:500;font-size:15px;padding:9px 14px;border-radius:999px;color:var(--night-ink-2);transition:color .2s,background .2s}
.links a:hover{color:var(--night-ink)}
.links a.on{color:#10140D;background:var(--lime)}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid var(--night-line);border-radius:999px;padding:9px 16px;color:var(--night-ink);font:500 14px var(--body);cursor:pointer}
@media (max-width:900px){.links,.nav .btn{display:none}.menu-btn{display:block}
  .links.open{display:flex;position:absolute;top:calc(72px + env(safe-area-inset-top,0px));left:0;right:0;flex-direction:column;background:var(--night);padding:12px 16px 22px;border-bottom:1px solid var(--night-line)}
  .links.open a{font-size:18px;padding:12px 14px}}

/* pages */
[data-page]{animation:pagein .5s ease both}
@keyframes pagein{from{transform:translateY(10px)}to{transform:none}}

/* ===== HERO v3 ===== */
.hero{position:relative;padding-top:calc(72px + env(safe-area-inset-top,0px));overflow:hidden;isolation:isolate;background:var(--ground)}
.hero::before{content:"";position:absolute;inset:0;z-index:-2;background-image:radial-gradient(circle,#C9D3BA 1px,transparent 1.2px);background-size:26px 26px;mask-image:radial-gradient(75% 85% at 70% 45%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(75% 85% at 70% 45%,#000 30%,transparent 80%)}
.hero::after{content:"";position:absolute;z-index:-1;width:900px;height:900px;right:-240px;top:-160px;border-radius:50%;background:radial-gradient(circle,rgba(184,224,99,.38),rgba(184,224,99,0) 62%);pointer-events:none}
.hero-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(24px,3vw,48px);align-items:center;padding-block:clamp(40px,6vw,80px) clamp(48px,6vw,80px)}
.badge{display:inline-flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 14px 6px 6px;font:500 13px var(--body);color:var(--ink-2);box-shadow:0 6px 20px -12px rgba(40,60,20,.3)}
.badge b{background:var(--ink);color:var(--ground);font:600 11px/1 var(--mono);letter-spacing:.06em;padding:6px 9px;border-radius:999px;text-transform:uppercase}
.hero h1{font-size:clamp(42px,5.1vw,78px);font-weight:800;letter-spacing:-.045em;line-height:.93;margin-top:26px}
.hero h1 .l2{display:block;color:var(--ink-3)}
.hero h1 .l3{display:block;color:var(--leaf-deep)}
.rot{display:block;color:var(--leaf-deep);min-height:1em;white-space:nowrap;position:relative;overflow:hidden;padding-bottom:.08em}
#rot-t{display:inline-block;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .45s}
#rot-t.out{transform:translateY(-60%);opacity:0}
#rot-t.pre{transform:translateY(60%);opacity:0;transition:none}
.rot .caret{display:inline-block;width:.07em;height:.78em;background:var(--leaf);margin-left:.06em;vertical-align:-.04em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero .lead{margin-top:26px;max-width:31em}
.cond{margin-top:30px;display:inline-flex;flex-wrap:wrap;gap:4px;padding:5px;border-radius:16px;background:var(--surface);border:1px solid var(--line);box-shadow:0 14px 40px -24px rgba(40,60,20,.35);font:400 14px/1 var(--mono);max-width:100%}
.cond button{border:0;background:transparent;padding:11px 14px;border-radius:11px;cursor:pointer;color:var(--ink-2);display:flex;gap:6px;align-items:center;position:relative;transition:background .25s,color .25s;white-space:nowrap}
.cond button .k{color:#3F6B0B;font-weight:500}
.cond button .v{color:#9A5B0A}
.cond button:hover{background:var(--night-2)}
.cond button[aria-pressed="true"]{background:var(--ink);color:#E9EFE1}
.cond button[aria-pressed="true"] .k{color:var(--lime)}
.cond button[aria-pressed="true"] .v{color:#F0CF83}
.cond .prog{position:absolute;left:12px;right:12px;bottom:4px;height:2px;border-radius:2px;background:rgba(184,224,99,.25);overflow:hidden;opacity:0}
.cond button[aria-pressed="true"] .prog{opacity:1}
.cond .prog i{display:block;height:100%;width:0;background:var(--lime)}
.cond.auto button[aria-pressed="true"] .prog i{animation:fill 4.2s linear forwards}
@keyframes fill{to{width:100%}}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero .btn-line{background:var(--surface)}

/* scene */
.stage{position:relative;aspect-ratio:590/450;width:100%;max-width:100%}
.spin{transform-box:fill-box;transform-origin:center;animation:spin 140s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.scene{position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible}
.scene .grp{transition:opacity .6s ease,filter .6s ease}
.stage[data-s="0"] .g-cloud,.stage[data-s="1"] .g-prem{opacity:.28;filter:grayscale(1)}
.stage[data-s="0"] .g-bridge,.stage[data-s="1"] .g-bridge{opacity:0}
.stage[data-s="2"] .g-bridge{opacity:1}
.g-bridge{opacity:0}
.led{animation:led 1.6s steps(2) infinite}
.led:nth-child(3n){animation-delay:.4s}.led:nth-child(4n){animation-delay:.9s}
@keyframes led{50%{opacity:.25}}
.stage[data-s="1"] .led{animation:none}
.flow{stroke-dasharray:6 8;animation:dash 1.2s linear infinite}
@keyframes dash{to{stroke-dashoffset:-28}}
.cloud-rain{opacity:0;transition:opacity .5s}
.stage[data-s="1"] .cloud-rain,.stage[data-s="2"] .cloud-rain{opacity:1}
.float{animation:bob 6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-8px)}}
.tag-cards{position:absolute;inset:0;z-index:2;pointer-events:none}
.fc{position:absolute;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:0 20px 40px -22px rgba(40,60,20,.4);font-size:13px;min-width:190px;transition:transform .6s cubic-bezier(.2,.7,.2,1),opacity .6s;pointer-events:auto}
.fc small{display:block;font:500 10.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3);margin-bottom:6px}
.fc b{font:600 15px var(--display);letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.fc .bar{height:6px;border-radius:6px;background:var(--night-3);margin-top:10px;overflow:hidden}
.fc .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--leaf),var(--lime));border-radius:6px;transition:width 1s ease}
.fc .row{display:flex;justify-content:space-between;margin-top:6px;font:500 11px var(--mono);color:var(--ink-3)}
.fc-a{left:-3%;bottom:16%}
.fc-b{right:-2%;bottom:2%}
.dot{width:8px;height:8px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 0 rgba(134,188,41,.6);animation:ping 1.8s infinite;flex:none}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(134,188,41,0)}100%{box-shadow:0 0 0 0 rgba(134,188,41,0)}}
.hero-foot{border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;padding-block:20px 22px;font:500 12.5px var(--mono);color:var(--ink-3)}
.hero-foot a{text-decoration:none;color:var(--ink-2);display:inline-flex;align-items:center;gap:8px}
.hero-foot a::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--leaf)}
.hero-foot a:hover{color:var(--ink)}
.hero-foot span{letter-spacing:.08em;text-transform:uppercase}
@media (max-width:980px){.hero-in{grid-template-columns:1fr}.stage{max-width:640px;margin-inline:auto}}
@media (max-width:560px){.fc{min-width:0;font-size:12px;padding:9px 11px}.fc-a{display:none}.fc-b{right:0;bottom:-6%}.cond{font-size:12.5px}.cond button{padding:10px 10px}}

/* start-here section */
.start{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:center}
@media (max-width:900px){.start{grid-template-columns:1fr}}

/* picker */
.picker{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:22px;font:400 14px/1.7 var(--mono);box-shadow:0 30px 70px -40px rgba(40,60,20,.35)}
.picker-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;font-size:12px;color:var(--night-ink-2)}
.dots{display:flex;gap:6px}.dots i{width:10px;height:10px;border-radius:50%;background:#D5DDC8}.dots i:first-child{background:var(--leaf)}
.branch{display:flex;gap:8px;width:100%;text-align:left;background:transparent;border:1px solid transparent;color:var(--night-ink);font:inherit;padding:9px 12px;border-radius:10px;cursor:pointer;transition:background .15s,border-color .15s}
.branch:hover{background:var(--night-2)}
.branch[aria-pressed="true"]{border-color:var(--leaf);background:var(--leaf-wash)}
.ln{color:#A9B29E;width:1.4em;flex:none;text-align:right}
.kw{color:#3F6B0B;font-weight:500}.str{color:#9A5B0A}.cm{color:#6F7A66}
.out{margin-top:14px;border-top:1px dashed var(--night-line);padding-top:16px;min-height:150px}
.out b{font:600 24px/1.1 var(--display);color:var(--ink);display:block;margin:6px 0 8px;letter-spacing:-.02em}
.out p{font:400 15px/1.55 var(--body);color:var(--night-ink-2)}
.out a{color:var(--leaf-deep);font:600 14px var(--body);display:inline-flex;gap:6px;margin-top:12px;text-decoration:none}
.out a:hover{text-decoration:underline}

/* marquee */
.marquee{border-block:1px solid var(--line);background:var(--surface);color:var(--night-ink-2);overflow:hidden;padding-block:22px;display:flex;gap:0}
.mq{display:flex;gap:56px;padding-right:56px;flex:none;animation:mq 38s linear infinite;font:700 22px/1 var(--display);letter-spacing:-.01em;white-space:nowrap;align-items:center}
.mq span.sep{width:8px;height:8px;border-radius:50%;background:var(--leaf);display:inline-block}
@keyframes mq{to{transform:translateX(-100%)}}
.marquee:hover .mq{animation-play-state:paused}

section.block{padding-block:clamp(72px,10vw,136px)}
.head{display:grid;grid-template-columns:1.2fr .8fr;gap:24px 56px;align-items:end;margin-bottom:clamp(40px,5vw,64px)}
.head .h2{margin-top:18px}
@media (max-width:860px){.head{grid-template-columns:1fr}}

/* services explorer */
.explorer{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,3vw,40px);align-items:start}
.svc-list{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.svc-tab{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;padding:20px 8px;border:0;border-bottom:1px solid var(--line);background:none;text-align:left;cursor:pointer;transition:padding .25s,color .2s;color:var(--ink-3)}
.svc-tab .t{font:700 clamp(22px,2.4vw,30px)/1.05 var(--display);letter-spacing:-.02em}
.svc-tab svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.6}
.svc-tab .go{font:500 12px var(--mono);opacity:0;transition:opacity .2s}
.svc-tab:hover{color:var(--ink)}
.svc-tab[aria-selected="true"]{color:var(--ink);padding-left:18px}
.svc-tab[aria-selected="true"] svg{stroke:var(--leaf-deep)}
.svc-tab[aria-selected="true"] .go{opacity:1;color:var(--leaf-deep)}
.svc-panel{position:sticky;top:96px;background:var(--surface);border:1px solid var(--line);border-radius:26px;overflow:hidden}
.svc-art{height:220px;background:var(--night-2);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.svc-art svg{position:absolute;inset:0;width:100%;height:100%}
.svc-body{padding:clamp(22px,3vw,34px);display:grid;gap:18px}
.svc-body h3{font-size:clamp(28px,3vw,38px);font-weight:800}
.svc-body p{color:var(--ink-2)}
.incl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px 20px}
.incl li{display:flex;gap:10px;font-size:15px;align-items:baseline}
.incl li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--leaf);transform:translateY(-1px)}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags span{font:500 12px/1 var(--mono);padding:7px 10px;border-radius:7px;background:var(--leaf-wash);color:var(--leaf-deep)}
@media (max-width:900px){.explorer{grid-template-columns:1fr}.svc-panel{position:static}}
@media (max-width:480px){.incl{grid-template-columns:1fr}}

/* sharepoint showcase */
.sp{background:var(--night-2);color:var(--night-ink);border-block:1px solid var(--line)}
.sp-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(32px,5vw,64px);align-items:center}
.areas{display:flex;flex-wrap:wrap;gap:8px;margin-top:32px}
.area{border:1px solid var(--night-line);background:transparent;color:var(--night-ink-2);border-radius:999px;padding:10px 16px;font:500 14.5px var(--body);cursor:pointer;transition:all .2s}
.area:hover{color:var(--night-ink);border-color:#4a5540}
.area[aria-pressed="true"]{background:var(--lime);color:#10140D;border-color:var(--leaf-deep)}
.browser{background:#F7F9F4;color:#1A1F16;border-radius:16px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(40,60,20,.35),0 0 0 1px var(--line);font-size:13px}
.b-bar{display:flex;align-items:center;gap:10px;background:#E4E8DD;padding:10px 14px}
.b-bar .dots i{background:#C5CBBC}
.b-url{flex:1;background:#fff;border-radius:6px;padding:5px 10px;font:400 11.5px var(--mono);color:#6B7463;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.b-site{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;background:#1D2A10;color:#fff}
.b-site b{font:700 16px var(--display);letter-spacing:-.01em}
.b-site span{font:400 11px var(--mono);opacity:.7}
.b-nav{display:flex;gap:16px;padding:10px 18px;border-bottom:1px solid #E0E5D8;font-weight:500;color:#5A6450;overflow:hidden;white-space:nowrap}
.b-nav span:first-child{color:#1A1F16;box-shadow:inset 0 -2px 0 #86BC29;padding-bottom:6px}
.b-main{display:grid;grid-template-columns:1.4fr 1fr;gap:12px;padding:16px 18px 20px;min-height:260px}
.b-hero{background:linear-gradient(135deg,#86BC29,#4B7410);border-radius:10px;color:#fff;padding:16px;display:flex;flex-direction:column;justify-content:flex-end;min-height:120px}
.b-hero b{font:700 18px/1.1 var(--display)}
.b-hero small{opacity:.85}
.b-card{background:#fff;border:1px solid #E0E5D8;border-radius:10px;padding:12px}
.b-card h5{margin:0 0 8px;font:600 12px var(--body);color:#5A6450;text-transform:uppercase;letter-spacing:.05em}
.b-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-top:1px solid #EEF1EA;font-size:12.5px}
.b-row:first-of-type{border-top:0}
.b-row i{width:22px;height:22px;border-radius:6px;background:#E7F1D5;flex:none;display:grid;place-items:center;font:600 10px var(--mono);color:#4B7410;font-style:normal}
.b-row em{margin-left:auto;font-style:normal;font:500 10.5px var(--mono);color:#8A9380;white-space:nowrap}
.b-stack{display:grid;gap:12px}
.pill{font:600 10px var(--mono);padding:3px 7px;border-radius:999px;background:#E7F1D5;color:#4B7410}
.pill.w{background:#FBEFD0;color:#8A5A00}
.sp-note{font:400 12px var(--mono);color:var(--night-ink-2);margin-top:14px}
@media (max-width:960px){.sp-grid{grid-template-columns:1fr}}
@media (max-width:560px){.b-main{grid-template-columns:1fr}}

/* process */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:0;position:relative;counter-reset:s}
.step{padding:28px 22px 8px 0;position:relative;border-top:2px solid var(--line)}
.step::before{content:"";position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:50%;background:var(--ground);border:2px solid var(--leaf-deep)}
.step .n{font:500 12px var(--mono);color:var(--leaf-deep);letter-spacing:.08em}
.step h3{font-size:24px;font-weight:700;margin:10px 0 10px}
.step p{color:var(--ink-2);font-size:15px}
.steps .bar{position:absolute;top:0;left:0;height:2px;background:var(--leaf);width:0;transition:width 1.4s ease}
.steps.go .bar{width:100%}
@media (max-width:960px){.steps{grid-template-columns:1fr 1fr;gap:0 24px}}
@media (max-width:560px){.steps{grid-template-columns:1fr}}

/* values */
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.val{background:var(--surface);padding:30px 26px 34px;display:flex;flex-direction:column;gap:14px;min-height:230px;transition:background .25s}
.val:hover{background:var(--leaf-wash)}
.val code{font:500 13px var(--mono);color:var(--leaf-deep)}
.val h3{font-size:26px;font-weight:700;margin-top:auto}
.val p{color:var(--ink-2);font-size:15px}
@media (max-width:960px){.values{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.values{grid-template-columns:1fr}}

/* support ops */
.ops{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center}
.console{background:var(--surface);border:1px solid var(--line);color:var(--night-ink);border-radius:24px;padding:22px;font:400 13px var(--mono);box-shadow:0 40px 80px -40px rgba(16,20,13,.5)}
.console-h{display:flex;justify-content:space-between;align-items:center;color:var(--night-ink-2);font-size:12px;margin-bottom:16px}
.live{display:inline-flex;align-items:center;gap:7px;color:var(--leaf-deep)}
.live::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--leaf);box-shadow:0 0 0 0 rgba(184,224,99,.6);animation:ping 1.8s infinite}
@keyframes ping{70%{box-shadow:0 0 0 9px rgba(184,224,99,0)}100%{box-shadow:0 0 0 0 rgba(184,224,99,0)}}
.c-rows{display:grid;gap:8px}
.c-row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;background:var(--night-2);border:1px solid var(--night-line);border-radius:12px;padding:13px 14px}
.c-row b{font:600 15px var(--body);color:var(--night-ink)}
.c-row small{display:block;color:var(--night-ink-2);font-size:11.5px;margin-top:3px}
.st{font:500 11px var(--mono);padding:5px 9px;border-radius:999px;background:var(--leaf-wash);color:var(--leaf-deep);white-space:nowrap}
.spark{display:block;width:100%;height:56px;margin-top:14px}
.channels{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:32px}
.chan{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;text-decoration:none;background:var(--surface);transition:border-color .2s,transform .2s}
.chan:hover{border-color:var(--leaf-deep);transform:translateY(-2px)}
.chan svg{width:22px;height:22px;stroke:var(--leaf-deep);fill:none;stroke-width:1.7;flex:none}
.chan b{font-weight:600;font-size:15px;display:block}
.chan small{color:var(--ink-3);font-size:13px}
@media (max-width:900px){.ops{grid-template-columns:1fr}}
@media (max-width:440px){.channels{grid-template-columns:1fr}}

/* mission */
.mission{padding-block:clamp(72px,10vw,140px);text-align:left}
.mission blockquote{margin:0;font:700 clamp(30px,4.6vw,62px)/1.08 var(--display);letter-spacing:-.03em;max-width:18em;text-wrap:balance}
.mission blockquote mark{background:none;color:var(--leaf-deep)}
.mission cite{display:block;margin-top:28px;font:500 13px var(--mono);font-style:normal;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}

/* cta band */
.cta{background:var(--lime);color:#10140D;border-radius:32px;padding:clamp(32px,6vw,80px);display:grid;grid-template-columns:1.3fr auto;gap:32px;align-items:end;position:relative;overflow:hidden}
.cta h2{font-size:clamp(36px,5.6vw,80px);font-weight:800;letter-spacing:-.04em}
.cta p{margin-top:16px;max-width:30em;font-size:18px;color:#2C3622}
.cta .btn-ink{background:#10140D;color:#F4F6F0}
.cta .ghost-if{position:absolute;right:-20px;top:-40px;font:500 220px/1 var(--mono);color:rgba(16,20,13,.07);pointer-events:none;letter-spacing:-.06em}
@media (max-width:800px){.cta{grid-template-columns:1fr}}

/* inner page hero */
.phero{background:radial-gradient(60% 80% at 85% 0%,var(--leaf-wash),transparent 70%),var(--ground);padding-top:calc(72px + env(safe-area-inset-top,0px));position:relative;overflow:hidden}
.phero .wrap{position:relative;padding-block:clamp(64px,9vw,120px) clamp(48px,6vw,80px)}
.phero h1{font-size:clamp(44px,7vw,96px);font-weight:800;letter-spacing:-.04em;margin-top:22px;max-width:12em}
.phero .lead{margin-top:24px}
.phero .grid-bg{position:absolute;inset:0;background-image:linear-gradient(var(--night-line) 1px,transparent 1px),linear-gradient(90deg,var(--night-line) 1px,transparent 1px);background-size:56px 56px;mask-image:radial-gradient(70% 90% at 90% 20%,#000,transparent 70%);opacity:.6;pointer-events:none}
.crumbs{display:flex;gap:18px;flex-wrap:wrap;margin-top:40px}
.crumbs a{font:500 13px var(--mono);color:var(--night-ink-2);text-decoration:none;border-bottom:1px solid var(--night-line);padding-bottom:4px}
.crumbs a:hover{color:var(--leaf-deep);border-color:var(--leaf-deep)}

/* services page detail */
.sd{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,5vw,72px);padding-block:clamp(48px,6vw,80px);border-top:1px solid var(--line);scroll-margin-top:90px}
.sd:first-child{border-top:0}
.sd .idx{font:500 13px var(--mono);color:var(--leaf-deep)}
.sd h2{font-size:clamp(32px,4vw,52px);font-weight:800;margin-top:12px}
.sd .desc{color:var(--ink-2);font-size:17px}
.sd-right{display:grid;gap:26px}
.sd-cols{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.sd h4{font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);margin-bottom:12px}
.sd ul.plain{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sd ul.plain li{padding-left:18px;position:relative}
.sd ul.plain li::before{content:"→";position:absolute;left:0;color:var(--leaf-deep)}
@media (max-width:860px){.sd{grid-template-columns:1fr}.sd-cols{grid-template-columns:1fr}}

/* about */
.mv{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.mv-card{border-radius:24px;padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;gap:18px;min-height:320px}
.mv-card.a{background:var(--lime);color:#10140D}
.mv-card.b{background:var(--leaf-wash)}
.mv-card h3{font-size:clamp(26px,3vw,40px);font-weight:700;margin-top:auto;letter-spacing:-.03em}
.mv-card .eyebrow{color:var(--leaf-deep)}
.mv-card.a .eyebrow{color:var(--leaf-deep)}
@media (max-width:760px){.mv{grid-template-columns:1fr}}
.map{background:var(--night-2);border:1px solid var(--line);border-radius:26px;padding:clamp(24px,4vw,44px);color:var(--night-ink);display:grid;grid-template-columns:1fr 1fr;gap:24px;position:relative;overflow:hidden}
.map svg.globe{position:absolute;right:-60px;top:-60px;width:420px;height:420px;opacity:.5;pointer-events:none}
.loc{position:relative;border-top:1px solid var(--night-line);padding-top:18px}
.loc h3{font-size:30px;font-weight:700;margin:10px 0 8px}
.loc p{color:var(--night-ink-2);font-size:15px}
.loc .clock{font:500 28px var(--mono);color:var(--leaf-deep);margin-top:14px;font-variant-numeric:tabular-nums}
.loc .clock small{font-size:12px;color:var(--night-ink-2);margin-left:8px}
@media (max-width:700px){.map{grid-template-columns:1fr}}

/* careers */
.quote-xl{font:800 clamp(34px,5.4vw,76px)/1 var(--display);letter-spacing:-.04em}
.quote-xl span{display:block}
.quote-xl span:nth-child(2){color:var(--ink-3)}
.quote-xl span:nth-child(3){color:var(--leaf-deep)}
.perks{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.perk{border:1px solid var(--line);border-radius:20px;padding:26px;background:var(--surface);display:grid;gap:10px}
.perk h3{font-size:22px;font-weight:700}
.perk p{color:var(--ink-2);font-size:15px}
@media (max-width:860px){.perks{grid-template-columns:1fr}}
.jobs{border:1px solid var(--line);border-radius:20px;overflow:hidden;background:var(--surface)}
.jobs-h{display:grid;grid-template-columns:2fr 1fr 2fr;gap:16px;padding:14px 22px;background:var(--sunk);font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.jobs-empty{padding:40px 22px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px}
.jobs-empty b{font:700 22px var(--display);letter-spacing:-.02em;display:block}
.jobs-empty p{color:var(--ink-2);margin-top:6px;max-width:34em}
@media (max-width:560px){.jobs-h{display:none}}

/* contact */
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,4vw,56px);align-items:start}
.form{background:var(--surface);border:1px solid var(--line);border-radius:26px;padding:clamp(22px,3.5vw,40px);display:grid;gap:18px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fld{display:grid;gap:7px}
.fld>span,.lab{font:500 12px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
input,select,textarea{font:400 16px var(--body);color:var(--ink);background:var(--ground);border:1px solid var(--line);border-radius:12px;padding:14px 15px;width:100%;transition:border-color .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--leaf-deep);box-shadow:0 0 0 4px var(--leaf-wash)}
textarea{min-height:120px;resize:vertical}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative;display:inline-flex;font:500 14px var(--body);border:1px solid var(--line);border-radius:999px;padding:9px 15px;cursor:pointer;transition:all .15s;background:var(--ground)}
.chip input{position:absolute;opacity:0;width:1px;height:1px;padding:0}
.chip:has(input:checked){background:var(--ink);color:var(--ground);border-color:var(--ink)}
.chip:has(input:focus-visible){outline:2px solid var(--leaf);outline-offset:2px}
.budget{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.budget .chip{justify-content:center}
.form-foot{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
.note{font-size:13px;color:var(--ink-3)}
.note.ok{color:var(--leaf-deep);font-weight:500}
.cinfo{display:grid;gap:14px}
.cinfo .item{display:grid;grid-template-columns:auto 1fr;gap:16px;padding:20px;border:1px solid var(--line);border-radius:18px;background:var(--surface)}
.cinfo svg{width:24px;height:24px;stroke:var(--leaf-deep);fill:none;stroke-width:1.7}
.cinfo b{display:block;font-weight:600}
.cinfo p,.cinfo a{color:var(--ink-2);font-size:15px}
.cinfo a{text-decoration:none;border-bottom:1px solid var(--line)}
.cinfo a:hover{color:var(--ink);border-color:var(--leaf-deep)}
@media (max-width:900px){.contact{grid-template-columns:1fr}}
@media (max-width:520px){.row2{grid-template-columns:1fr}.budget{grid-template-columns:1fr 1fr}}

/* footer */
footer{background:var(--night-2);border-top:1px solid var(--line);color:var(--night-ink-2);padding-block:clamp(56px,7vw,96px) 28px;margin-top:clamp(64px,8vw,120px)}
.f-top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
.f-top h4{font:500 12px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--night-ink);margin-bottom:14px}
.f-top ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:15px}
.f-top a{text-decoration:none}.f-top a:hover{color:var(--leaf-deep)}
.f-big{font:800 clamp(56px,13vw,200px)/.85 var(--display);letter-spacing:-.06em;color:var(--leaf-wash);margin-top:56px;white-space:nowrap;overflow:hidden;-webkit-text-stroke:1px var(--night-line)}
.f-bot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;border-top:1px solid var(--night-line);padding-top:22px;font-size:13px}
.f-bot nav{display:flex;flex-wrap:wrap;gap:18px}
.f-bot a{text-decoration:none}.f-bot a:hover{color:var(--leaf-deep)}
@media (max-width:860px){.f-top{grid-template-columns:1fr 1fr}}

.rv{transform:translateY(22px);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{transform:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.rv{transform:none}}
.wa{position:fixed;right:18px;bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;align-items:center;gap:10px;background:var(--ink);color:var(--ground);text-decoration:none;padding:12px 18px 12px 14px;border-radius:999px;font:600 14px var(--body);box-shadow:0 18px 40px -16px rgba(0,0,0,.5)}
.wa i{width:26px;height:26px;border-radius:50%;background:var(--leaf);display:grid;place-items:center}
.wa svg{width:15px;height:15px;fill:#10140D}
