/* ============================================================
   Virescent — site-wide design system
   Editorial, enterprise-grade: warm paper, deep green, serif display.
   ============================================================ */

:root{
  --paper:#F7F5EF;
  --paper-2:#FFFFFF;
  --ink:#141F19;
  --ink-2:#48584E;
  --ink-3:#76847B;
  --green-deep:#0A2A1C;
  --green-deep-2:#0D3322;
  --green:#15573A;
  --green-bright:#1E7C4E;
  --green-wash:#E8EFE6;
  --line:#E3DECF;
  --line-2:#ECE8DB;
  --amber:#9A6A14;
  --amber-wash:#F5EBD7;
  --violet:#54487E;
  --violet-wash:#ECE8F4;
  --max:1180px;
  --serif:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:"EB Garamond", Georgia, serif;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--sans); background:var(--paper); color:var(--ink);
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
img,svg{display:block; max-width:100%;}
a{color:inherit;}
::selection{background:#D5E0D2;}

.wrap{max-width:var(--max); margin:0 auto; padding:0 32px;}
.wrap-narrow{max-width:860px; margin:0 auto; padding:0 32px;}
@media(max-width:640px){.wrap,.wrap-narrow{padding:0 22px;}}

h1,h2,h3,h4{font-family:var(--serif); font-weight:600; letter-spacing:-.012em; line-height:1.08; text-wrap:balance;}
h1{font-size:clamp(40px,5.4vw,68px);}
h2{font-size:clamp(30px,3.6vw,46px);}
h3{font-size:21px; line-height:1.3;}
h4{font-size:17px; line-height:1.35;}
p{color:var(--ink-2);}
strong{color:var(--ink); font-weight:600;}

.eyebrow{
  font-size:12.5px; font-weight:650; letter-spacing:.18em; text-transform:uppercase;
  color:var(--green); display:flex; align-items:center; gap:12px; margin-bottom:22px;
}
.eyebrow::before{content:""; width:26px; height:1px; background:var(--green); opacity:.55;}
.eyebrow.centered{justify-content:center;}
.eyebrow.centered::after{content:""; width:26px; height:1px; background:var(--green); opacity:.55;}
.on-dark .eyebrow{color:#8FCBA5;}
.on-dark .eyebrow::before,.on-dark .eyebrow::after{background:#8FCBA5;}

.lead{font-size:20px; line-height:1.65; max-width:720px; color:var(--ink-2);}
.lead.centered{margin-left:auto; margin-right:auto; text-align:center;}

section{padding:104px 0;}
.sec-head{margin-bottom:56px; max-width:780px;}
.sec-head h2{margin-bottom:18px;}
.sec-head.centered{margin-left:auto; margin-right:auto; text-align:center;}

/* ---------------- buttons & links ---------------- */
.btn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--sans); font-weight:600; font-size:16.5px; line-height:1;
  padding:15px 26px; border-radius:999px; text-decoration:none;
  border:1px solid transparent; cursor:pointer;
  transition:background .18s ease, transform .18s ease, border-color .18s ease;
}
.btn .arr{transition:transform .18s ease; font-weight:500;}
.btn:hover .arr{transform:translateX(3px);}
.btn-primary{background:var(--green-deep); color:#F4F1E8;}
.btn-primary:hover{background:var(--green);}
.btn-outline{border-color:#C9C3B2; color:var(--ink); background:transparent;}
.btn-outline:hover{border-color:var(--ink);}
.btn-light{background:#F4F1E8; color:var(--green-deep);}
.btn-light:hover{background:#fff;}
.btn-sm{padding:11px 20px; font-size:15px;}
.tlink{
  font-weight:600; font-size:15px; color:var(--green-deep); text-decoration:none;
  border-bottom:1px solid #AFC7B6; padding-bottom:2px; transition:border-color .15s ease;
}
.tlink:hover{border-color:var(--green-deep);}
.tlink .arr{display:inline-block; transition:transform .18s ease;}
.tlink:hover .arr{transform:translateX(3px);}

/* ---------------- header / nav ---------------- */
.site-head{
  position:sticky; top:0; z-index:90;
  background:rgba(247,245,239,.9); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-2);
}
.head-in{display:flex; align-items:center; height:68px; gap:40px;}
.brand{display:flex; align-items:center; gap:10px; text-decoration:none;}
.brand .mark{
  font-family:var(--serif); font-weight:700; font-size:26px; line-height:.78;
  color:var(--green); display:inline-block; transform:translateY(1px);
}
.brand .word{font-family:var(--serif); font-size:21.5px; font-weight:600; letter-spacing:-.01em; color:var(--ink);}
.nav{display:flex; gap:30px; margin-left:8px; align-items:baseline;}
.nav-drop{display:inline-flex; align-items:baseline;}
.nav a{
  font-size:15.5px; font-weight:500; color:var(--ink-2); text-decoration:none;
  padding:6px 0; position:relative;
}
.nav a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1.5px;
  background:var(--green-deep); transition:right .2s ease;
}
.nav a:hover{color:var(--ink);}
.nav a:hover::after{right:0;}
.nav a.active{color:var(--ink); font-weight:600;}
.nav a.active::after{right:0;}
.head-cta{margin-left:auto; display:flex; align-items:center; gap:22px;}
.head-cta .login{font-size:15.5px; font-weight:500; color:var(--ink-2); text-decoration:none;}
.head-cta .login:hover{color:var(--ink);}
.nav-toggle{
  display:none; margin-left:auto; background:none; border:1px solid var(--line);
  border-radius:8px; padding:9px 11px; cursor:pointer;
}
.nav-toggle span{display:block; width:18px; height:2px; background:var(--ink); margin:3.5px 0; transition:.2s;}
@media(max-width:920px){
  .nav, .head-cta{display:none;}
  .nav-toggle{display:block;}
  .site-head.open .mobile-menu{display:block;}
}
.mobile-menu{display:none; border-top:1px solid var(--line-2); background:var(--paper); padding:10px 32px 26px;}
.mobile-menu a{display:block; padding:13px 0; font-size:16px; font-weight:550; color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line-2);}
.mobile-menu .btn{margin-top:18px;}

/* ---------------- page hero ---------------- */
.phero{padding:108px 0 84px;}
.phero h1{max-width:880px; margin-bottom:26px;}
.phero .lead{max-width:680px;}
.phero-ctas{display:flex; flex-wrap:wrap; gap:16px; margin-top:40px; align-items:center;}
.phero-note{font-size:13.5px; color:var(--ink-3); margin-top:18px; max-width:560px;}
.phero.compact{padding:96px 0 64px; border-bottom:1px solid var(--line-2);}

/* ---------------- credibility strip ---------------- */
.cred{border-top:1px solid var(--line-2); border-bottom:1px solid var(--line-2); background:var(--paper-2); padding:26px 0;}
.cred-in{display:flex; flex-wrap:wrap; gap:18px 44px; align-items:center; justify-content:center;}
.cred-in .lbl{font-size:11.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--ink-3); font-weight:600;}
.cred-in b{font-family:var(--serif); font-size:17px; font-weight:560; color:var(--ink-2); letter-spacing:.01em;}

/* ---------------- tiles & grids ---------------- */
.g2{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}
.g3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.g4{display:grid; grid-template-columns:repeat(4,1fr); gap:18px;}
.g5{display:grid; grid-template-columns:repeat(5,1fr); gap:16px;}
@media(max-width:1020px){.g4,.g5{grid-template-columns:repeat(2,1fr);}}
@media(max-width:880px){.g3{grid-template-columns:1fr;} .g2{grid-template-columns:1fr;}}
@media(max-width:600px){.g4,.g5{grid-template-columns:1fr;}}

.tile{background:var(--paper-2); border:1px solid var(--line); border-radius:14px; padding:34px 32px;}
.tile h3{margin-bottom:12px;}
.tile p{font-size:14.5px;}
.tile .knum{
  font-family:var(--serif); font-size:14px; font-style:italic; color:var(--green);
  display:block; margin-bottom:14px;
}
.tile.tinted{background:var(--green-wash); border-color:#D5E0D2;}

/* numbered ledger rows (Harvey-style list) */
.ledger{border-top:1px solid var(--line);}
.ledger-row{
  display:grid; grid-template-columns:90px 1fr 1.6fr; gap:28px;
  padding:34px 0; border-bottom:1px solid var(--line); align-items:start;
}
.ledger-row .no{font-family:var(--serif); font-style:italic; font-size:17px; color:var(--green);}
.ledger-row h3{font-size:22px;}
.ledger-row p{font-size:15px; max-width:560px;}
.ledger-row .meta{margin-top:10px;}
@media(max-width:840px){
  .ledger-row{grid-template-columns:1fr; gap:10px; padding:28px 0;}
  .ledger-row .no{font-size:15px;}
}

/* ---------------- badges ---------------- */
.badge{
  display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; padding:4px 11px; border-radius:999px; line-height:1.5;
}
.badge-live{background:var(--green-deep); color:#EDF3EC;}
.badge-build{background:var(--amber-wash); color:var(--amber); border:1px solid #E5D2AC;}
.badge-road{background:transparent; color:var(--ink-3); border:1px solid var(--line);}
.on-dark .badge-road{color:#8FAF9B; border-color:#2C5942;}
.on-dark .badge-build{background:rgba(154,106,20,.16); border-color:#7A6028; color:#E2B96A;}

/* ---------------- statement bands ---------------- */
.band{background:var(--green-deep); color:#EDF3EC; padding:110px 0;}
.band h2{color:#F6F8F1;}
.band p{color:#AFC7B6;}
.band .statement{
  font-family:var(--serif); font-size:clamp(28px,4vw,52px); font-weight:560;
  line-height:1.18; letter-spacing:-.01em; color:#F6F8F1; max-width:980px; text-wrap:balance;
}
.band .statement em{font-style:italic; color:#9FD8B4;}
.band-foot{margin-top:44px; display:flex; gap:18px; flex-wrap:wrap; align-items:center;}

/* ---------------- mock workspace ---------------- */
.mockshell{
  background:var(--green-deep); border-radius:18px; padding:16px;
  box-shadow:0 40px 90px rgba(10,42,28,.30);
}
.mockbar{display:flex; align-items:center; gap:7px; padding:4px 8px 14px;}
.mockbar i{width:9px; height:9px; border-radius:50%; background:#2B5740;}
.mockbar span{font-size:11.5px; color:#8FAF9B; margin-left:10px; font-weight:520; letter-spacing:.02em;}
.mockgrid{display:grid; grid-template-columns:5fr 7fr; gap:13px;}
@media(max-width:880px){.mockgrid{grid-template-columns:1fr;}}
.pane{background:#F7F5EF; border-radius:11px; overflow:hidden; border:1px solid #103823;}
.pane-h{display:flex; justify-content:space-between; align-items:center; padding:13px 17px; border-bottom:1px solid var(--line-2); background:#F8F6EF;}
.pane-h b{font-size:13px; font-weight:680;}
.pane-h small{font-size:11px; color:var(--ink-3); font-weight:520;}
.qrow{padding:13px 17px; border-bottom:1px solid var(--line-2);}
.qrow:last-child{border-bottom:0;}
.qrow.sel{background:#F2F6EE; box-shadow:inset 3px 0 0 var(--green-bright);}
.qtop{display:flex; justify-content:space-between; gap:10px; align-items:baseline;}
.qname{font-size:13.5px; font-weight:620;}
.qdpd{font-size:11px; color:var(--ink-3); white-space:nowrap;}
.qnext{font-size:12.5px; color:var(--ink-2); margin-top:2px;}
.qnext b{color:var(--green); font-weight:620;}
.qtag{
  display:inline-block; font-size:10px; font-weight:700; letter-spacing:.07em;
  text-transform:uppercase; padding:2.5px 8px; border-radius:999px; margin-top:7px;
}
.qtag.cad{background:var(--green-wash); color:var(--green);}
.qtag.appr{background:var(--amber-wash); color:var(--amber);}
.qtag.esc{background:var(--violet-wash); color:var(--violet);}
.case-h{padding:15px 18px 12px; border-bottom:1px solid var(--line-2);}
.case-h .qname{font-size:15px;}
.case-h .meta{font-size:11.5px; color:var(--ink-3); margin-top:3px;}
.guard{display:flex; flex-wrap:wrap; gap:7px; padding:11px 18px; background:#F4F8F2; border-bottom:1px solid var(--line-2);}
.guard span{
  font-size:11px; font-weight:620; color:var(--green); background:#fff;
  border:1px solid #D5E0D2; border-radius:999px; padding:3.5px 10px;
}
.guard span::before{content:"✓ "; color:var(--green-bright);}
.tl{list-style:none; padding:6px 18px 2px;}
.tl li{display:flex; gap:12px; padding:9px 0; border-bottom:1px dashed var(--line-2); font-size:12.5px; align-items:baseline;}
.tl li:last-child{border-bottom:0;}
.tl time{color:var(--ink-3); font-size:10.5px; min-width:44px; white-space:nowrap;}
.tl .sysnote{
  font-size:9.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--ink-3); background:var(--paper); border-radius:4px; padding:1px 6px; margin-left:7px; white-space:nowrap;
}
.approve{
  margin:10px 18px 14px; border:1px solid #E8D9BC; background:#FBF5E8;
  border-radius:9px; padding:12px 15px; display:flex; justify-content:space-between;
  align-items:center; gap:12px; flex-wrap:wrap;
}
.approve p{font-size:12px; color:#6E5A26; font-weight:540;}
.approve .ok{
  font-size:12px; font-weight:680; color:#fff; background:var(--green-deep);
  border-radius:999px; padding:7px 15px; text-decoration:none;
}
.exportrow{
  display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap;
  padding:12px 18px; border-top:1px solid var(--line-2); background:#F8F6EF;
}
.exportrow span{font-size:11.5px; color:var(--ink-3);}
.exportrow a{font-size:12.5px; font-weight:700; color:var(--green-deep); text-decoration:none;}
.mockcap{text-align:center; font-size:12.5px; color:#8FAF9B; padding:15px 8px 4px;}
.mockcap b{color:#D9E8DC; font-weight:620;}

/* ---------------- comparison table ---------------- */
.cmp{
  width:100%; border-collapse:separate; border-spacing:0; background:var(--paper-2);
  border:1px solid var(--line); border-radius:14px; overflow:hidden;
}
.cmp th,.cmp td{padding:18px 24px; text-align:left; font-size:14.5px; vertical-align:top;}
.cmp thead th{
  font-family:var(--sans); font-size:11.5px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-3); background:#F8F6EF; border-bottom:1px solid var(--line); font-weight:680;
}
.cmp thead th:last-child{color:var(--green); background:var(--green-wash);}
.cmp tbody th{
  font-family:var(--serif); font-weight:560; font-size:15.5px; width:17%;
  background:#F8F6EF; border-bottom:1px solid var(--line-2); color:var(--ink);
}
.cmp td{color:var(--ink-2); border-bottom:1px solid var(--line-2); width:41.5%;}
.cmp td.win{background:#F2F6EE; color:var(--ink); border-left:1px solid var(--line-2);}
.cmp tr:last-child th,.cmp tr:last-child td{border-bottom:0;}
@media(max-width:720px){
  .cmp thead{display:none;}
  .cmp tbody th,.cmp td{display:block; width:100%;}
  .cmp td.win{border-left:0;}
  .cmp td::before{font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; display:block; margin-bottom:4px; color:var(--ink-3);}
  .cmp td:nth-child(2)::before{content:"A dashboard";}
  .cmp td.win::before{content:"The Virescent workspace"; color:var(--green);}
}

/* ---------------- platform layers ---------------- */
.layer-row{
  display:grid; grid-template-columns:64px 1.1fr 1.5fr; gap:30px;
  padding:40px 0; border-bottom:1px solid var(--line); align-items:start;
}
.layer-row:first-of-type{border-top:1px solid var(--line);}
.layer-row .lnum{font-family:var(--serif); font-size:40px; font-weight:480; color:var(--green-bright); line-height:1;}
.layer-row h3{font-size:24px; margin-bottom:10px;}
.layer-row .ldesc{font-size:15px; max-width:540px;}
.layer-row .lmods{margin-top:14px; display:flex; flex-wrap:wrap; gap:8px;}
.lmods span{
  font-size:12px; font-weight:560; color:var(--ink-2); background:var(--paper-2);
  border:1px solid var(--line); border-radius:999px; padding:5px 13px;
}
@media(max-width:840px){.layer-row{grid-template-columns:1fr; gap:12px;}}

/* ---------------- honesty columns ---------------- */
.truth{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
@media(max-width:920px){.truth{grid-template-columns:1fr;}}
.truth-col{border:1px solid #224E37; border-radius:14px; padding:32px 30px; background:var(--green-deep-2);}
.truth-col.lit{background:#F7F5EF; border-color:#F7F5EF; color:var(--ink);}
.truth-col h3{font-size:18px; margin:16px 0 4px; color:#F6F8F1;}
.truth-col.lit h3{color:var(--ink);}
.truth-col .sub{font-size:12.5px; color:#8FAF9B; display:block; margin-bottom:14px;}
.truth-col.lit .sub{color:var(--ink-3);}
.truth-col ul{list-style:none;}
.truth-col li{font-size:14px; line-height:1.55; padding:11px 0; border-top:1px dashed #2C5942; color:#C6D8CB;}
.truth-col.lit li{border-top:1px dashed var(--line); color:var(--ink-2);}
.truth-col li b{color:#fff; font-weight:600;}
.truth-col.lit li b{color:var(--ink);}
.controlbar{
  margin-top:40px; border:1px solid #2C5942; background:rgba(31,124,78,.12);
  border-radius:14px; padding:30px 34px; text-align:center;
}
.controlbar p{
  font-family:var(--serif); font-size:clamp(18px,2.4vw,24px); color:#F6F8F1; font-weight:500; line-height:1.4;
}
.controlbar small{display:block; margin-top:10px; font-size:13px; color:#8FAF9B;}

/* ---------------- workflow walkthroughs ---------------- */
.flow{
  display:grid; grid-template-columns:1fr 1.15fr; gap:54px; align-items:center;
  padding:64px 0; border-bottom:1px solid var(--line);
}
.flow:last-of-type{border-bottom:0;}
.flow:nth-child(even) .flow-copy{order:2;}
@media(max-width:880px){.flow{grid-template-columns:1fr; gap:30px;} .flow:nth-child(even) .flow-copy{order:0;}}
.flow-copy .fno{font-family:var(--serif); font-style:italic; font-size:15px; color:var(--green); display:block; margin-bottom:12px;}
.flow-copy h3{font-size:26px; margin-bottom:14px;}
.flow-copy p{font-size:15px;}
.flow-copy ul{margin-top:16px; list-style:none;}
.flow-copy li{font-size:14px; color:var(--ink-2); padding:7px 0 7px 24px; position:relative;}
.flow-copy li::before{content:"—"; position:absolute; left:0; color:var(--green-bright);}
.flow-panel{background:var(--paper-2); border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:0 18px 44px rgba(20,31,25,.07);}
.fp-h{padding:13px 18px; background:#F8F6EF; border-bottom:1px solid var(--line-2); font-size:12px; font-weight:680; color:var(--ink-2); display:flex; justify-content:space-between; align-items:center;}
.fp-h em{font-style:normal; font-size:10.5px; color:var(--ink-3); font-weight:560; letter-spacing:.06em; text-transform:uppercase;}
.fp-body{padding:8px 18px 16px;}
.fstep{display:flex; gap:13px; padding:11px 0; border-bottom:1px dashed var(--line-2); align-items:flex-start;}
.fstep:last-child{border-bottom:0;}
.fstep .dot{
  width:22px; height:22px; flex:0 0 22px; border-radius:50%; background:var(--green-wash);
  color:var(--green); font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; margin-top:1px;
}
.fstep p{font-size:13px; line-height:1.5;}
.fstep p b{font-weight:640; color:var(--ink);}
.fstep .chiprow{display:flex; flex-wrap:wrap; gap:6px; margin-top:7px;}
.chip{
  font-size:10.5px; font-weight:640; color:var(--green); background:var(--green-wash);
  border:1px solid #D5E0D2; padding:3px 9px; border-radius:999px;
}
.chip.warn{color:var(--amber); background:var(--amber-wash); border-color:#E5D2AC;}

/* ---------------- steps / engagement ---------------- */
.steps{counter-reset:step;}
.step-row{
  display:grid; grid-template-columns:120px 1fr 1.4fr; gap:28px;
  padding:36px 0; border-bottom:1px solid var(--line); align-items:start;
}
.step-row:first-child{border-top:1px solid var(--line);}
.step-row .when{font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--green); padding-top:6px;}
.step-row h3{font-size:22px;}
.step-row p{font-size:15px; max-width:560px;}
@media(max-width:840px){.step-row{grid-template-columns:1fr; gap:8px; padding:28px 0;}}

/* ---------------- segment blocks ---------------- */
.seg{
  display:grid; grid-template-columns:1fr 1.6fr; gap:44px;
  padding:58px 0; border-bottom:1px solid var(--line); align-items:start;
}
.seg:last-of-type{border-bottom:0;}
.seg .seg-side .pri{font-size:11.5px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--green); display:block; margin-bottom:12px;}
.seg h3{font-size:27px; margin-bottom:12px;}
.seg .seg-side p{font-size:14px; color:var(--ink-3);}
.seg-main p{font-size:15px; margin-bottom:14px;}
.seg-main .wedge{
  margin-top:20px; background:var(--paper-2); border:1px solid var(--line);
  border-left:3px solid var(--green-bright); border-radius:0 12px 12px 0; padding:18px 22px;
}
.seg-main .wedge b{font-size:11px; letter-spacing:.13em; text-transform:uppercase; color:var(--green); display:block; margin-bottom:6px;}
.seg-main .wedge p{font-size:14px; margin:0;}
@media(max-width:840px){.seg{grid-template-columns:1fr; gap:18px;}}

/* ---------------- seats ---------------- */
.seat{background:var(--paper-2); border:1px solid var(--line); border-radius:14px; padding:26px 24px;}
.seat .who{font-size:10.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-3); display:block; margin-bottom:10px;}
.seat h3{font-size:19px; margin-bottom:8px;}
.seat p{font-size:13px;}

/* ---------------- security ---------------- */
.sec-card{background:var(--paper-2); border:1px solid var(--line); border-radius:14px; padding:30px 28px;}
.sec-card .ic{
  width:38px; height:38px; border-radius:10px; background:var(--green-wash);
  display:flex; align-items:center; justify-content:center; margin-bottom:18px;
  color:var(--green); font-size:16px;
}
.sec-card h3{font-size:17px; margin-bottom:8px;}
.sec-card p{font-size:13.5px;}

/* ---------------- FAQ ---------------- */
.faq details{background:var(--paper-2); border:1px solid var(--line); border-radius:12px; margin-bottom:12px; padding:0 26px;}
.faq summary{
  cursor:pointer; font-family:var(--serif); font-weight:560; font-size:17.5px;
  padding:21px 0; list-style:none; display:flex; justify-content:space-between; gap:16px; align-items:center;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; font-family:var(--serif); font-size:24px; color:var(--green); flex-shrink:0; line-height:1;}
.faq details[open] summary::after{content:"–";}
.faq details p{padding:0 0 22px; font-size:14.5px; max-width:680px;}

/* ---------------- forms ---------------- */
.form-card{background:var(--paper-2); border:1px solid var(--line); border-radius:16px; padding:40px;}
@media(max-width:640px){.form-card{padding:26px 22px;}}
.field{margin-bottom:20px;}
.field label{display:block; font-size:12px; font-weight:680; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-2); margin-bottom:8px;}
.field input,.field select,.field textarea{
  width:100%; font-family:var(--sans); font-size:15px; color:var(--ink);
  background:var(--paper); border:1px solid var(--line); border-radius:9px; padding:13px 15px;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--green-bright); outline-offset:0; border-color:transparent;}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media(max-width:640px){.field-row{grid-template-columns:1fr;}}
.form-done{display:none; margin-top:18px; font-size:14.5px; color:var(--green); font-weight:560;}

/* ---------------- CTA band ---------------- */
.cta-band{background:var(--green-deep); color:#EDF3EC; padding:110px 0; text-align:center;}
.cta-band h2{color:#F6F8F1; font-size:clamp(32px,4.4vw,54px); max-width:780px; margin:0 auto 20px;}
.cta-band .lead{color:#AFC7B6; margin:0 auto;}
.cta-band .actions{margin-top:42px; display:flex; gap:16px; justify-content:center; flex-wrap:wrap;}
.cta-band .fine{margin-top:26px; font-size:13px; color:#7FA28C; max-width:560px; margin-left:auto; margin-right:auto;}

/* ---------------- footer ---------------- */
.site-foot{background:var(--green-deep); color:#C9DACE; padding:78px 0 38px; border-top:1px solid #143A27;}
.foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr 1fr; gap:40px;}
@media(max-width:980px){.foot-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:600px){.foot-grid{grid-template-columns:1fr;}}
.foot-brand .brand .word{color:#F4F1E8;}
.foot-brand p{font-size:13px; color:#8FAF9B; margin-top:16px; max-width:300px; line-height:1.6;}
.foot-col h4{
  font-family:var(--sans); font-size:11px; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:#7FA28C; margin-bottom:18px;
}
.foot-col a{display:block; font-size:14px; color:#C9DACE; text-decoration:none; padding:5.5px 0;}
.foot-col a:hover{color:#fff;}
.foot-bottom{
  margin-top:64px; padding-top:26px; border-top:1px solid #16402B;
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
}
.foot-bottom p{font-size:12.5px; color:#7FA28C;}

/* ---------------- reveal ---------------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .6s cubic-bezier(.2,.6,.2,1), transform .6s cubic-bezier(.2,.6,.2,1);}
.reveal.in{opacity:1; transform:none;}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1; transform:none; transition:none;}}

/* ============================================================
   Storyboards — animated section narratives
   ============================================================ */
.sb{position:relative;}
.sb-panel{background:var(--paper-2); border:1px solid var(--line); border-radius:14px; overflow:hidden; box-shadow:0 18px 44px rgba(20,31,25,.06);}

/* narration bar */
.sb-bar{display:flex; align-items:center; gap:14px; padding:11px 18px; border-top:1px solid var(--line-2); background:#F8F6EF;}
.sb-live{width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:var(--green-bright); animation:sbliv 1.8s infinite;}
@keyframes sbliv{0%,100%{box-shadow:0 0 0 0 rgba(31,124,78,.45);} 50%{box-shadow:0 0 0 5px rgba(31,124,78,0);}}
.sb-caption{flex:1; font-size:14px; font-weight:500; color:var(--ink-2); min-height:19px; transition:opacity .16s ease;}
.sb-caption.swap{opacity:0;}
.sb-tag{font-size:9.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-3); border:1px solid var(--line); border-radius:999px; padding:2px 9px; white-space:nowrap;}
.sb-dots{display:flex; gap:5px; align-items:center;}
.sb-dots i{width:5px; height:5px; border-radius:50%; background:var(--line); transition:background .25s ease, transform .25s ease;}
.sb-dots i.on{background:var(--green-bright); transform:scale(1.3);}
.sb-bar.dark{background:rgba(10,42,28,.55); border-top-color:#1C4A33;}
.sb-bar.dark .sb-caption{color:#C9DACE;}
.sb-bar.dark .sb-tag{color:#7FA28C; border-color:#2C5942;}
.sb-bar.dark .sb-dots i{background:#2C5942;}
.sb-bar.dark .sb-dots i.on{background:#8FCBA5;}
.sb-bar.standalone{border:1px solid #2C5942; border-radius:999px; margin-top:30px;}
@media(max-width:640px){.sb-tag{display:none;}}

/* fx primitives */
.sb .sb-step{opacity:0; transform:translateY(7px); transition:opacity .45s ease, transform .45s ease;}
.sb .sb-step.sb-in{opacity:1; transform:none;}
.sb .dl1{transition-delay:.1s;} .sb .dl2{transition-delay:.22s;} .sb .dl3{transition-delay:.34s;} .sb .dl4{transition-delay:.46s;}
.sb-glow{box-shadow:0 0 0 3px rgba(31,124,78,.22) !important;}
.sb-dim{opacity:.35 !important;}
.sb .qrow,.sb .guard span,.sb .fstep,.sb .lay,.sb .gt-node,.sb .truth-col,.sb .vs-pane,.sb .pane{transition:opacity .4s ease, box-shadow .4s ease, transform .4s ease, background .3s ease, border-color .3s ease;}
.sb-cursor{position:absolute; left:46%; top:32%; width:17px; height:17px; border-radius:50%; background:rgba(20,31,25,.922); border:2px solid #fff; box-shadow:0 3px 10px rgba(0,0,0,.35); z-index:6; opacity:0; pointer-events:none; transition:left .75s cubic-bezier(.3,.7,.2,1), top .75s cubic-bezier(.3,.7,.2,1), transform .16s ease, opacity .3s ease;}
.sb-cursor.sb-vis{opacity:1;}
.sb-cursor.sb-click{transform:scale(.62);}

/* workspace-mock storyboard states */
.approve .ap-done{display:none; font-size:12px; font-weight:640; color:var(--green);}
.approve.sb-done{background:#EFF5EC; border-color:#CFDFC9;}
.approve.sb-done .ap-pend{display:none;}
.approve.sb-done .ap-done{display:block;}
.approve.sb-done .ok{background:var(--green-bright);}

/* swivel-chair storyboard */
.swivel-wrap{margin:46px 0 8px;}
.sw-tabs{display:flex; flex-wrap:wrap; gap:6px; padding:13px 16px 0; border-bottom:1px solid var(--line-2); background:#F8F6EF;}
.sw-tab{font-size:11.5px; font-weight:640; color:var(--ink-3); border:1px solid var(--line); border-bottom:none; background:#fff; border-radius:8px 8px 0 0; padding:7px 14px; transition:all .25s ease;}
.sw-tab.sb-on{color:#fff; background:var(--green-deep); border-color:var(--green-deep);}
.sw-screen{position:relative; min-height:196px; padding:20px 22px;}
.sw-scr{display:none;}
.sw-scr.sb-on{display:block; animation:swin .35s ease;}
@keyframes swin{from{opacity:0; transform:translateY(5px);} to{opacity:1; transform:none;}}
.sw-scr b{font-size:13px; font-weight:660; display:block; margin-bottom:13px;}
.sw-scr i{display:block; height:10px; border-radius:5px; background:var(--line-2); margin:10px 0; width:86%;}
.sw-scr i:nth-of-type(2){width:62%;}
.sw-scr i:nth-of-type(3){width:73%;}
.sw-scr em{display:inline-block; font-style:normal; font-size:11px; font-weight:660; color:var(--amber); background:var(--amber-wash); border-radius:999px; padding:3.5px 11px; margin-top:12px;}
.sw-note{position:absolute; right:20px; bottom:18px; max-width:300px; background:#FFFDF4; border:1px solid #E8D9BC; border-radius:10px; padding:12px 14px; font-size:12px; color:#6E5A26; line-height:1.5;}
.sw-note em{font-style:normal; display:block; margin-top:7px; font-size:9.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--amber);}
.sw-verdict{position:absolute; inset:0; background:rgba(247,245,239,.95); display:flex; flex-direction:column; justify-content:center; align-items:center; gap:9px; text-align:center; padding:22px; pointer-events:none;}
.sw-verdict b{font-family:var(--serif); font-size:clamp(19px,2.6vw,27px); font-weight:560;}
.sw-verdict span{font-size:14px; color:var(--ink-2); max-width:480px;}
.sw-status{display:flex; gap:24px; padding:10px 20px; border-top:1px solid var(--line-2); background:#F8F6EF; font-size:11px; font-weight:640; color:var(--ink-3); flex-wrap:wrap;}
.sw-status .sw-timer{font-variant-numeric:tabular-nums; color:var(--ink);}

/* dashboard-vs-workspace storyboard */
.vsplit{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:52px;}
@media(max-width:760px){.vsplit{grid-template-columns:1fr;}}
.vs-pane{background:#F7F5EF; border-radius:12px; border:1px solid #103823; padding:22px; color:var(--ink);}
.vs-pane h5{font-family:var(--sans); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3); margin-bottom:16px; font-weight:700;}
.vs-num{font-family:var(--serif); font-size:44px; font-weight:560; line-height:1; color:var(--ink);}
.vs-sub{font-size:12px; color:var(--ink-3); margin-top:9px;}
.vs-flat{margin-top:20px; height:40px; border-radius:6px; position:relative; background:repeating-linear-gradient(90deg, var(--line-2) 0 2px, transparent 2px 20px);}
.vs-flat::after{content:""; position:absolute; left:0; right:0; top:55%; border-top:2px solid var(--line);}
.vs-act{list-style:none;}
.vs-act li{display:flex; gap:10px; align-items:baseline; font-size:13px; padding:8.5px 0; border-bottom:1px dashed var(--line-2);}
.vs-act li:last-child{border-bottom:0;}
.vs-act .ck{color:var(--green-bright); font-weight:700;}
.vs-act .lg{margin-left:auto; font-size:9.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); background:var(--paper); padding:1.5px 7px; border-radius:4px; white-space:nowrap;}

/* platform layers storyboard */
.laystack{display:flex; flex-direction:column-reverse; gap:10px; padding:28px 28px 24px;}
.lay{display:flex; align-items:center; gap:16px; border:1px solid var(--line); border-radius:11px; padding:15px 19px; background:#FFFFFF; opacity:.45; flex-wrap:wrap;}
.lay.sb-on{opacity:1; background:#fff; border-color:#BFD3BC; box-shadow:0 8px 22px rgba(20,31,25,.06);}
.lay.sb-warm{opacity:.85; border-color:#E5D2AC; background:#FFFDF4;}
.lay .ln{font-family:var(--serif); font-size:21px; color:var(--green-bright); width:24px; flex:0 0 24px;}
.lay .lt b{font-size:14px; font-weight:660; display:block;}
.lay .lt small{font-size:11.5px; color:var(--ink-3); display:block; margin-top:1px;}
.lay .badge{margin-left:auto;}
.laypulse{display:flex; gap:5px; margin-left:6px;}
.laypulse i{width:5px; height:5px; border-radius:50%; background:var(--green-bright); opacity:0;}
.laypulse.sb-on i{animation:lpf 1.4s infinite;}
.laypulse.sb-on i:nth-child(2){animation-delay:.25s;}
.laypulse.sb-on i:nth-child(3){animation-delay:.5s;}
@keyframes lpf{0%{opacity:0; transform:translateY(5px);} 40%{opacity:1;} 100%{opacity:0; transform:translateY(-7px);}}

/* pilot timeline storyboard */
.pilot{padding:36px 32px 28px;}
.pl-track{position:relative;}
.pl-line{position:absolute; left:12.5%; right:12.5%; top:7px; height:3px; background:var(--line-2); border-radius:2px;}
.pl-fillbar{position:absolute; left:12.5%; top:7px; height:3px; width:0; background:var(--green-bright); border-radius:2px; transition:width .9s cubic-bezier(.3,.7,.2,1);}
.pl-fillbar.w1{width:25%;} .pl-fillbar.w2{width:50%;} .pl-fillbar.w3{width:75%;}
.pl-nodes{position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:8px;}
.pl-node{text-align:center;}
.pl-node .nd{display:block; width:17px; height:17px; border-radius:50%; border:3px solid var(--line); background:#fff; margin:0 auto 13px; transition:all .35s ease;}
.pl-node.sb-on .nd{border-color:var(--green-bright); background:var(--green-bright); box-shadow:0 0 0 4px rgba(31,124,78,.16);}
.pl-node b{font-size:12.5px; font-weight:680; display:block;}
.pl-node small{font-size:11px; color:var(--ink-3); display:block; margin-top:3px;}
.pl-chip{display:inline-block; margin-top:9px; font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--green); background:var(--green-wash); border-radius:999px; padding:3px 9px;}
@media(max-width:680px){.pl-node small{display:none;}}

/* compounding storyboard */
.cmpd{display:flex; align-items:flex-end; gap:16px; padding:36px 32px 8px; height:225px;}
.cm-col{flex:1; text-align:center;}
.cm-bar{position:relative; width:100%; border-radius:7px 7px 0 0; overflow:hidden; background:var(--line-2); height:0; transition:height .7s cubic-bezier(.3,.7,.2,1);}
.cm-col.sb-on .cm-bar{height:var(--h);}
.cm-auto{position:absolute; left:0; right:0; bottom:0; background:var(--green-bright); height:var(--a);}
.cm-col small{font-size:10.5px; color:var(--ink-3); margin-top:9px; display:block; font-weight:600;}
.cm-flag{display:inline-block; margin-top:5px; font-size:9px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--green); background:var(--green-wash); border-radius:999px; padding:2px 7px;}
.cm-legend{display:flex; gap:22px; padding:14px 32px 22px; flex-wrap:wrap;}
.cm-legend span{font-size:11px; color:var(--ink-3); display:flex; align-items:center; gap:7px; font-weight:560;}
.cm-legend i{width:10px; height:10px; border-radius:3px; display:inline-block;}
.cm-legend .sw1{background:var(--line-2);} .cm-legend .sw2{background:var(--green-bright);}
@media(max-width:680px){.cmpd{gap:8px; padding:28px 18px 6px;} .cm-flag{display:none;}}

/* approval-gate storyboard */
.gate{padding:34px 30px 28px;}
.gt-row{display:grid; grid-template-columns:repeat(4,1fr); gap:12px;}
@media(max-width:760px){.gt-row{grid-template-columns:repeat(2,1fr);}}
.gt-node{border:1px solid var(--line); border-radius:11px; background:#FFFFFF; padding:17px 14px; text-align:center; opacity:.5;}
.gt-node.sb-on{opacity:1; background:#fff; border-color:#BFD3BC; box-shadow:0 8px 20px rgba(20,31,25,.06);}
.gt-node.sb-warm{opacity:1; border-color:#D9B96E; background:#FFFDF4; box-shadow:0 0 0 3px rgba(154,106,20,.12);}
.gt-node .gi{font-size:18px; display:block; margin-bottom:9px; line-height:1;}
.gt-node b{font-size:12.5px; font-weight:680; display:block;}
.gt-node small{font-size:10.5px; color:var(--ink-3); display:block; margin-top:5px; line-height:1.45;}
.gt-track{position:relative; height:24px; margin:16px 4px 2px;}
.gt-line{position:absolute; left:11%; right:11%; top:10px; height:2px; background:var(--line-2);}
.gt-token{position:absolute; top:2px; left:11%; width:17px; height:17px; border-radius:50%; background:var(--green-deep); border:2.5px solid #fff; box-shadow:0 2px 8px rgba(0,0,0,.28); transition:left .85s cubic-bezier(.3,.7,.2,1);}
.gt-token.p2{left:36%;} .gt-token.p3{left:61%;} .gt-token.p4{left:86%;}
.gt-ledger{list-style:none; margin:18px 4px 0; border-top:1px dashed var(--line); padding-top:13px;}
.gt-ledger li{display:flex; gap:11px; font-size:12px; color:var(--ink-2); padding:6px 0; align-items:baseline;}
.gt-ledger time{font-size:10.5px; color:var(--ink-3); min-width:42px; font-variant-numeric:tabular-nums;}
.gt-ledger .lg{margin-left:auto; font-size:9px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); background:var(--paper); border-radius:4px; padding:1px 6px;}
@media(prefers-reduced-motion:reduce){
  .sb .sb-step{opacity:1; transform:none; transition:none;}
  .sb-cursor{display:none;}
  .laypulse.sb-on i{animation:none; opacity:.7;}
}

/* ============================================================
   Nav dropdown (Solutions)
   ============================================================ */
.nav-drop{position:relative; display:inline-block;}
.nav-drop::after{content:""; position:absolute; left:-20px; right:-20px; top:100%; height:18px;}
.nav-drop .drop{
  position:absolute; top:calc(100% + 14px); left:-18px; min-width:300px;
  background:var(--paper-2); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 26px 64px rgba(20,31,25,.16); padding:10px; z-index:99;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.nav-drop:hover .drop, .nav-drop:focus-within .drop{opacity:1; visibility:visible; transform:none;}
.nav .drop a{display:block; padding:10px 13px; border-radius:9px;}
.nav .drop a::after{display:none;}
.nav .drop a:hover{background:var(--green-wash);}
.nav .drop a b{display:block; font-size:13.5px; font-weight:640; color:var(--ink); line-height:1.35;}
.nav .drop a small{display:block; font-size:11.5px; color:var(--ink-3); margin-top:1px; font-weight:480; line-height:1.4;}
.mobile-menu .sub{padding-left:22px; font-size:14.5px; color:var(--ink-2);}

/* ============================================================
   Cinematic homepage hero
   ============================================================ */
.hero-cine{position:relative; background:var(--green-deep); color:#F4F1E8; overflow:hidden; padding:0;}
.hero-cine canvas{position:absolute; inset:0; width:100%; height:100%; display:block;}
.hero-cine::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:
    radial-gradient(110% 80% at 22% 12%, rgba(10,42,28,0) 30%, rgba(10,42,28,.42) 100%),
    linear-gradient(180deg, rgba(10,42,28,.25) 0%, rgba(10,42,28,0) 22%, rgba(10,42,28,0) 70%, rgba(10,42,28,.4) 100%);
}
.hero-cine .inner{position:relative; z-index:2; padding:140px 0 250px;}
.hero-cine h1{
  color:#F6F8F1; font-size:clamp(48px,7vw,96px); font-weight:560;
  letter-spacing:-.018em; line-height:1.02; max-width:1020px; margin-bottom:0;
}
.hero-cine .lead{color:#B9CFC0; font-size:19.5px; max-width:660px; margin-top:30px;}
.hero-cine .phero-ctas{margin-top:44px;}
.hero-ghost{border:1px solid #2C5942; color:#EDF3EC; background:rgba(10,42,28,.4);}
.hero-ghost:hover{border-color:#8FCBA5;}
.hero-cine .hero-fine{font-size:13px; color:#7FA28C; margin-top:20px; letter-spacing:.02em;}
.mock-pullup{margin-top:-170px; position:relative; z-index:3; padding-bottom:104px;}
@media(max-width:760px){
  .hero-cine .inner{padding:96px 0 220px;}
  .mock-pullup{margin-top:-150px;}
}

/* ============================================================
   Solution-page pieces
   ============================================================ */
/* backlog lanes (fintech) */
.lane{border-bottom:1px solid var(--line-2);}
.lane:last-child{border-bottom:0;}
.lane-h{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:11px 18px; background:#F8F6EF; font-size:10.5px; letter-spacing:.11em;
  text-transform:uppercase; font-weight:700; color:var(--ink-3); border-bottom:1px solid var(--line-2);
  transition:color .3s ease, background .3s ease;
}
.lane-h .cnt{font-size:11.5px; font-variant-numeric:tabular-nums; white-space:nowrap;}
.lane-h.sb-glow{color:var(--amber); background:var(--amber-wash); box-shadow:none !important;}
.lane .qrow .qtag{margin-top:6px;}
/* audience hero variant */
.phero .aud{font-family:var(--serif); font-style:italic; font-size:16px; color:var(--green); display:block; margin-bottom:10px;}
/* small cross-link cards */
.xsell{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
@media(max-width:760px){.xsell{grid-template-columns:1fr;}}
.xsell a{display:block; text-decoration:none; background:var(--paper-2); border:1px solid var(--line); border-radius:14px; padding:26px 28px; transition:border-color .2s ease, transform .2s ease;}
.xsell a:hover{border-color:var(--green-bright); transform:translateY(-2px);}
.xsell h3{font-size:18px; margin-bottom:6px;}
.xsell p{font-size:13.5px;}
.xsell .go{font-size:13px; font-weight:700; color:var(--green-deep); margin-top:12px; display:inline-block;}

/* ---------------- connector logos (from production repo assets) ---------------- */
.intlogos{display:flex; flex-wrap:wrap; gap:12px; margin-bottom:16px;}
.intlogos .il{display:flex; align-items:center; gap:10px; height:50px; padding:0 22px; background:var(--paper-2); border:1px solid var(--line); border-radius:11px;}
.intlogos .il img{height:21px; width:auto; display:block;}
.intlogos .il.txt{font-family:var(--serif); font-size:18px; font-weight:600; color:var(--ink-2);}
.int-note{font-size:14px; color:var(--ink-3); margin-bottom:44px;}

/* team-credential logos (extracted from repo landing.html) */
.cred-in img.cl{height:22px; width:auto; opacity:.78; filter:grayscale(1);}
.cred-in .cl-rh{height:20px;}
.cred-in .cl-pf{height:21px;}
.cred-in .cl-p72{height:25px;}
.cred-in .cl-mit{height:25px;}
.cred-in .cl-su{height:20px;}