/* ============================================================
   CounselNow — single-file site
   Dark-first · Newsreader + Inter · JS view routing
   ============================================================ */
:root{
  --ink:#090A0C; --ink-2:#0F1115; --ink-3:#15181E;
  --crimson:#E51D45; --crimson-deep:#C4163A;
  --canvas:#FAF9F7; --blush:#FCECEF;
  --graphite:#6E6B67; --graphite-light:#9A9691;
  --od-muted:rgba(250,249,247,.64); --od-faint:rgba(250,249,247,.38);
  --line-d:rgba(250,249,247,.12); --line-l:rgba(9,10,12,.12);
  --serif:"Newsreader",Georgia,serif;
  --sans:"Inter","Helvetica Neue",Arial,sans-serif;
  --sect:clamp(6rem,11vw,10.5rem); --blk:clamp(3rem,5vw,5rem);
  --gut:clamp(1.25rem,4vw,4rem); --maxw:84rem;
  --eo:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--canvas);font-family:var(--sans);font-size:1.0625rem;line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer}
h1,h2,h3,h4,p,figure{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
::selection{background:var(--crimson);color:var(--canvas)}
:focus-visible{outline:2px solid var(--crimson);outline-offset:3px;border-radius:2px}
.skip-link{position:absolute;left:1rem;top:-4rem;background:var(--crimson);color:var(--canvas);padding:.6rem 1.1rem;z-index:300;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;transition:top .25s var(--eo)}
.skip-link:focus{top:1rem}

/* ---------- Preloader ---------- */
.preloader{position:fixed;inset:0;z-index:400;background:var(--ink);display:flex;align-items:center;justify-content:center;transition:opacity .6s var(--eo),visibility 0s .6s}
.preloader.is-done{opacity:0;visibility:hidden}
.preloader .pl-mark{font-family:var(--serif);font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.01em;display:inline-flex;align-items:baseline;opacity:0;animation:plIn .9s var(--eo) .1s forwards}
.preloader .pl-mark .wm-dot{width:.3em;height:.3em;background:var(--crimson);border-radius:50%;margin-left:.2em;align-self:center;transform:translateY(.14em)}
.preloader .pl-rule{position:absolute;bottom:38%;left:50%;transform:translateX(-50%);width:0;height:1px;background:var(--crimson);animation:plRule 1.1s var(--eo) .25s forwards}
@keyframes plIn{from{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}
@keyframes plRule{to{width:6rem}}

/* ---------- Grain ---------- */
.grain{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:220;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 300 300' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grainShift 9s steps(6) infinite}
@keyframes grainShift{0%,100%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-2%)}80%{transform:translate(3%,3%)}}

/* ---------- Type ---------- */
.eyebrow{font-family:var(--sans);font-size:.72rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;color:var(--od-muted);display:flex;align-items:center;gap:1rem;margin-bottom:1.75rem}
.eyebrow::before{content:"";width:2.25rem;height:1px;background:var(--crimson);flex:none}
.eyebrow--center{justify-content:center}
.eyebrow--center::before{display:none}
.on-light .eyebrow{color:var(--graphite)}
.h-display{font-family:var(--serif);font-weight:400;font-size:clamp(2.7rem,6.4vw,5.4rem);line-height:1.02;letter-spacing:-.018em}
.h-1{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4.4vw,3.6rem);line-height:1.06;letter-spacing:-.014em}
.h-2{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.4vw,2.05rem);line-height:1.18}
.h-display em,.h-1 em,.h-2 em{font-style:italic;color:var(--crimson)}
.lede{font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.7;color:var(--od-muted);max-width:38em}
.on-light .lede,.on-light .body-muted{color:var(--graphite)}
.body-muted{color:var(--od-muted)}
.small-note{font-size:.82rem;letter-spacing:.04em;color:var(--od-faint)}

/* ---------- Layout ---------- */
.container{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.section{padding-block:var(--sect);position:relative}
.section--flush-top{padding-top:0}
.on-light{background:var(--canvas);color:var(--ink)}
.on-light ::selection{background:var(--ink);color:var(--canvas)}
.section-head{max-width:47rem;margin-bottom:var(--blk)}
.section-head .lede{margin-top:1.5rem}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.9rem;font-family:var(--sans);font-size:.8rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;padding:1.05rem 1.9rem;border:1px solid transparent;transition:background-color .35s var(--eo),color .35s var(--eo),border-color .35s var(--eo)}
.btn .btn-arrow{width:1.35rem;height:1px;background:currentColor;position:relative;transition:width .35s var(--eo)}
.btn .btn-arrow::after{content:"";position:absolute;right:0;top:50%;width:.45rem;height:.45rem;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:translateY(-50%) rotate(45deg)}
.btn:hover .btn-arrow{width:2rem}
.btn--primary{background:var(--crimson);color:var(--canvas)}
.btn--primary:hover{background:var(--crimson-deep)}
.btn--ghost{background:transparent;color:var(--canvas);border-color:rgba(250,249,247,.3)}
.btn--ghost:hover{border-color:var(--canvas)}
.on-light .btn--ghost{color:var(--ink);border-color:rgba(9,10,12,.3)}
.on-light .btn--ghost:hover{border-color:var(--ink)}
.text-link{font-size:.8rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;display:inline-flex;align-items:center;gap:.75rem;padding-bottom:.35rem;background-image:linear-gradient(var(--crimson),var(--crimson));background-repeat:no-repeat;background-size:0% 1px;background-position:left bottom;transition:background-size .4s var(--eo)}
.text-link:hover{background-size:100% 1px}

/* ---------- Header ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;transition:background-color .4s var(--eo),border-color .4s var(--eo);border-bottom:1px solid transparent}
.site-header.is-scrolled{background:rgba(9,10,12,.84);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--line-d)}
.nav-bar{display:flex;align-items:center;justify-content:space-between;height:4.75rem;gap:2rem}
.wordmark{font-family:var(--serif);font-size:1.4rem;letter-spacing:-.01em;color:var(--canvas);display:inline-flex;align-items:baseline}
.wordmark .wm-dot{width:.3em;height:.3em;background:var(--crimson);border-radius:50%;margin-left:.2em;align-self:center;transform:translateY(.14em)}
.nav-links{display:flex;align-items:center;gap:clamp(1.2rem,2.4vw,2.4rem)}
.nav-links a{font-size:.78rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--od-muted);padding:.4rem 0;background-image:linear-gradient(var(--crimson),var(--crimson));background-repeat:no-repeat;background-size:0% 1px;background-position:left bottom;transition:color .3s var(--eo),background-size .4s var(--eo)}
.nav-links a:hover,.nav-links a.is-active{color:var(--canvas);background-size:100% 1px}
.nav-cta .btn{padding:.7rem 1.3rem;font-size:.72rem}
.menu-toggle{display:none;background:none;border:none;width:2.75rem;height:2.75rem;position:relative;z-index:260}
.menu-toggle span{position:absolute;left:.55rem;right:.55rem;height:1px;background:var(--canvas);transition:transform .4s var(--eo),top .4s var(--eo)}
.menu-toggle span:nth-child(1){top:1.1rem}
.menu-toggle span:nth-child(2){top:1.65rem}
.menu-toggle[aria-expanded="true"] span:nth-child(1){top:1.375rem;transform:rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){top:1.375rem;transform:rotate(-45deg)}
.menu-panel{position:fixed;inset:0;z-index:240;background:var(--ink);display:flex;flex-direction:column;justify-content:center;padding:var(--gut);transform:translateX(100%);visibility:hidden;transition:transform .6s var(--eo),visibility 0s .6s}
.menu-panel.is-open{transform:translateX(0);visibility:visible;transition:transform .6s var(--eo)}
.menu-panel nav{display:flex;flex-direction:column;gap:.35rem}
.menu-panel a.menu-item{font-family:var(--serif);font-size:clamp(1.9rem,7.5vw,2.6rem);line-height:1.35;color:var(--canvas);opacity:0;transform:translateY(1.2rem);transition:opacity .55s var(--eo),transform .55s var(--eo),color .3s}
.menu-panel.is-open a.menu-item{opacity:1;transform:none}
.menu-panel a.menu-item:hover{color:var(--crimson)}
.menu-panel .menu-cta{margin-top:2.25rem;opacity:0;transition:opacity .55s var(--eo) .35s}
.menu-panel.is-open .menu-cta{opacity:1}
.menu-panel .menu-foot{position:absolute;bottom:2rem;left:var(--gut);right:var(--gut)}

/* ---------- Photo frames ---------- */
.ph{position:relative;overflow:hidden;background:var(--ink-2)}
.ph img{width:100%;height:100%;object-fit:cover;filter:saturate(.8) contrast(1.06) brightness(.86)}
.ph::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(9,10,12,.55),rgba(9,10,12,.08) 55%),radial-gradient(ellipse 130% 100% at 50% 40%,transparent 60%,rgba(9,10,12,.42));pointer-events:none}
.ph--light::after{background:linear-gradient(to top,rgba(9,10,12,.28),transparent 60%)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero-media img{width:100%;height:100%;object-fit:cover;filter:saturate(.85) contrast(1.05) brightness(.92);animation:kenburns 28s ease-in-out infinite alternate;transform-origin:center 40%}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.09)}}
.hero-scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(9,10,12,.97) 0%,rgba(9,10,12,.74) 32%,rgba(9,10,12,.3) 60%,rgba(9,10,12,.55) 100%)}
.hero-vignette{position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 120% 90% at 50% 42%,transparent 55%,rgba(9,10,12,.55) 100%)}
.hero-inner{width:100%;padding-bottom:clamp(4rem,9vh,7.5rem);padding-top:9rem}
.hero .h-display{max-width:13em}
.hero .lede{margin-top:2rem}
.hero-ctas{display:flex;flex-wrap:wrap;gap:1rem;margin-top:3rem}
.proof-strip{border-top:1px solid var(--line-d);margin-top:clamp(3.5rem,7vh,5.5rem);padding-top:1.6rem;display:flex;flex-wrap:wrap;gap:.9rem 2.75rem}
.proof-strip li{font-size:.7rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--od-faint);display:flex;align-items:center;gap:2.75rem}
.proof-strip li+li::before{content:"";width:3px;height:3px;background:var(--crimson);border-radius:50%}

/* ---------- Reveal ---------- */
.reveal{opacity:0;transform:translateY(2.2rem);transition:opacity .9s var(--eo),transform .9s var(--eo)}
.reveal.in-view{opacity:1;transform:none}
.reveal-d1{transition-delay:.12s}.reveal-d2{transition-delay:.24s}.reveal-d3{transition-delay:.36s}

/* ---------- Gap section ---------- */
.gap-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2.5rem,6vw,6rem);align-items:center}
.gap-points{display:grid;margin-top:2.5rem}
.gap-points li{padding:1.35rem 0;border-top:1px solid var(--line-l);display:grid;grid-template-columns:2.4rem 1fr;gap:1rem;align-items:baseline}
.gap-points li:last-child{border-bottom:1px solid var(--line-l)}
.gap-points .idx{font-size:.72rem;letter-spacing:.12em;color:var(--crimson);font-weight:500}
.gap-points p{color:var(--graphite);font-size:1rem}
.gap-points strong{color:var(--ink);font-weight:600}
.gap-chart{background:var(--ink);padding:clamp(1.75rem,3.5vw,3rem)}
.gap-chart .chart-label{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;fill:var(--od-faint);font-family:var(--sans)}
.gap-chart .chart-label--crimson{fill:var(--crimson)}
.gap-chart .line-capacity,.gap-chart .line-workload{fill:none;stroke-width:1.75;stroke-dasharray:720;stroke-dashoffset:720}
.gap-chart .line-capacity{stroke:rgba(250,249,247,.5)}
.gap-chart .line-workload{stroke:var(--crimson)}
.gap-chart.in-view .line-capacity{animation:draw 2.4s var(--eo) .2s forwards}
.gap-chart.in-view .line-workload{animation:draw 2.8s var(--eo) .55s forwards}
.gap-chart .gap-fill{opacity:0;transition:opacity 1.4s ease 2.4s}
.gap-chart.in-view .gap-fill{opacity:1}
.gap-chart .gap-marker{opacity:0;transition:opacity .8s ease 2.8s}
.gap-chart.in-view .gap-marker{opacity:1}
@keyframes draw{to{stroke-dashoffset:0}}

/* ---------- Comparison ---------- */
.compare-wrap{position:relative;isolation:isolate;padding-block:var(--sect)}
.compare-bg{position:absolute;inset:0;z-index:-2}
.compare-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.6) contrast(1.05) brightness(.5)}
.compare-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,var(--ink) 2%,rgba(9,10,12,.82) 30%,rgba(9,10,12,.86) 70%,var(--ink) 98%)}
.compare-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;align-items:stretch}
.compare-col{padding:clamp(1.75rem,3vw,2.75rem);border:1px solid var(--line-d);display:flex;flex-direction:column;gap:1.25rem;background:rgba(9,10,12,.55);backdrop-filter:blur(6px);transition:border-color .4s var(--eo)}
.compare-col:hover{border-color:rgba(250,249,247,.28)}
.compare-col .comp-tag{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--od-faint)}
.compare-col h3{font-family:var(--serif);font-weight:400;font-size:1.5rem}
.compare-col p{color:var(--od-muted);font-size:.98rem}
.compare-col ul{display:grid;gap:.7rem;margin-top:auto}
.compare-col ul li{font-size:.88rem;color:var(--od-muted);padding-left:1.3rem;position:relative}
.compare-col ul li::before{content:"";position:absolute;left:0;top:.62em;width:.55rem;height:1px;background:var(--od-faint)}
.compare-col--featured{background:var(--canvas);color:var(--ink);border-color:var(--canvas);transform:translateY(-1.25rem);box-shadow:0 40px 80px -30px rgba(0,0,0,.75)}
.compare-col--featured .comp-tag{color:var(--crimson)}
.compare-col--featured p,.compare-col--featured ul li{color:var(--graphite)}
.compare-col--featured ul li::before{background:var(--crimson)}

/* ---------- Service cards ---------- */
.svc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.svc-card{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:36rem;padding:clamp(1.75rem,2.6vw,2.5rem);overflow:hidden;isolation:isolate;border:1px solid var(--line-d);transition:border-color .5s var(--eo)}
.svc-card:hover,.svc-card:focus-within{border-color:rgba(250,249,247,.32)}
.svc-card .svc-img{position:absolute;inset:0;z-index:-2}
.svc-card .svc-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.06) brightness(.8);transition:transform 1.4s var(--eo)}
.svc-card:hover .svc-img img{transform:scale(1.05)}
.svc-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(9,10,12,.96) 10%,rgba(9,10,12,.5) 52%,rgba(9,10,12,.18) 100%)}
.svc-card .svc-num{position:absolute;top:clamp(1.5rem,2.4vw,2.25rem);left:clamp(1.75rem,2.6vw,2.5rem);font-size:.72rem;letter-spacing:.18em;color:rgba(250,249,247,.6)}
.svc-card h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.55rem,2vw,1.9rem);line-height:1.12}
.svc-card p{color:var(--od-muted);font-size:.95rem;margin-top:.9rem;max-width:26em}
.svc-card .text-link{margin-top:1.6rem;color:var(--canvas)}
.svc-card .svc-rule{width:2.25rem;height:1px;background:var(--crimson);margin-bottom:1.4rem;transition:width .5s var(--eo)}
.svc-card:hover .svc-rule{width:4rem}
.svc-card>a.svc-cover{position:absolute;inset:0;z-index:5}
.svc-card .svc-content{position:relative}

/* ---------- Engagement model strip ---------- */
.model-table{border:1px solid var(--line-d);margin-top:var(--blk);overflow-x:auto}
.model-table table{width:100%;border-collapse:collapse;min-width:52rem}
.model-table th,.model-table td{text-align:left;padding:1.3rem 1.5rem;border-bottom:1px solid var(--line-d);vertical-align:top;font-size:.93rem}
.model-table th{font-family:var(--serif);font-weight:400;font-size:1.25rem;border-bottom:1px solid rgba(250,249,247,.3)}
.model-table th:first-child,.model-table td:first-child{font-size:.7rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--od-faint);width:12rem}
.model-table td{color:var(--od-muted)}
.model-table tr:last-child td{border-bottom:none}
.model-table th em{font-style:italic;color:var(--crimson)}

/* ---------- Workflow ---------- */
.workflow{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:clamp(1.25rem,2.5vw,2.5rem);align-items:stretch;margin-top:var(--blk)}
.wf-step{border-top:1px solid var(--line-d);padding-top:1.75rem;position:relative}
.wf-step::before{content:"";position:absolute;top:-1px;left:0;width:0;height:1px;background:var(--crimson);transition:width 1.1s var(--eo)}
.wf-step.in-view::before{width:3.5rem}
.wf-step .wf-kind{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--crimson);margin-bottom:1rem;display:block}
.wf-step .wf-kind--tech{color:var(--od-faint)}
.wf-step h3{font-family:var(--serif);font-weight:400;font-size:1.45rem;margin-bottom:.8rem}
.wf-step p{color:var(--od-muted);font-size:.95rem}
.wf-conn{display:flex;align-items:center;color:var(--od-faint)}
.wf-conn svg{width:2rem;height:.75rem;overflow:visible}
.wf-conn line,.wf-conn polyline{stroke:currentColor;stroke-width:1;fill:none}

/* ---------- Audiences ---------- */
.aud-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.25rem}
.aud-card{position:relative;overflow:hidden;isolation:isolate;min-height:24rem;display:flex;flex-direction:column;justify-content:flex-end;padding:1.75rem;border:1px solid var(--line-l)}
.aud-card .aud-img{position:absolute;inset:0;z-index:-2}
.aud-card .aud-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.05) brightness(.78);transition:transform 1.2s var(--eo)}
.aud-card:hover .aud-img img{transform:scale(1.05)}
.aud-card::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(9,10,12,.92) 12%,rgba(9,10,12,.4) 55%,rgba(9,10,12,.12) 100%)}
.aud-card h3{font-family:var(--serif);font-weight:400;font-size:1.35rem;line-height:1.2;color:var(--canvas)}
.aud-card p{font-size:.88rem;color:var(--od-muted);margin-top:.6rem}
.aud-card .aud-rule{width:1.8rem;height:1px;background:var(--crimson);margin-bottom:1.1rem}

/* ---------- Why / capability ---------- */
.why-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,6vw,6rem)}
.why-list{display:grid}
.why-list li{display:grid;grid-template-columns:3rem 1fr;gap:1.5rem;padding:1.6rem 0;border-top:1px solid var(--line-d);align-items:baseline}
.why-list li:last-child{border-bottom:1px solid var(--line-d)}
.why-list .idx{font-family:var(--serif);font-style:italic;color:var(--crimson);font-size:1rem}
.why-list h3{font-family:var(--serif);font-weight:400;font-size:1.4rem;margin-bottom:.4rem}
.why-list p{color:var(--od-muted);font-size:.95rem}
.why-media{position:relative;min-height:22rem}
.why-media .ph{position:absolute;inset:0}
.cap-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line-l);border:1px solid var(--line-l);margin-top:var(--blk)}
.cap-cell{background:var(--canvas);padding:1.75rem 1.5rem;min-height:9rem;display:flex;flex-direction:column;justify-content:space-between;gap:1rem;transition:background-color .4s var(--eo)}
.cap-cell:hover{background:var(--blush)}
.cap-cell .cap-idx{font-size:.66rem;letter-spacing:.16em;color:var(--crimson);font-weight:500}
.cap-cell h3{font-family:var(--serif);font-weight:400;font-size:1.15rem;line-height:1.3}

/* ---------- Bench / network band ---------- */
.band{position:relative;isolation:isolate;overflow:hidden;padding-block:var(--sect)}
.band-bg{position:absolute;inset:0;z-index:-2}
.band-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.7) contrast(1.05) brightness(.55)}
.band-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(to right,rgba(9,10,12,.94) 20%,rgba(9,10,12,.55) 70%,rgba(9,10,12,.35)),linear-gradient(to bottom,var(--ink) 0%,transparent 18%,transparent 82%,var(--ink) 100%)}
.band .lede{margin-top:1.5rem}
.band .band-points{display:grid;gap:1rem;margin-top:2.25rem;max-width:36rem}
.band .band-points li{display:grid;grid-template-columns:1.5rem 1fr;gap:1rem;color:var(--od-muted);font-size:.97rem;align-items:baseline}
.band .band-points li::before{content:"";width:.8rem;height:1px;background:var(--crimson);transform:translateY(-.3em)}

/* ---------- CTA end ---------- */
.cta-end{text-align:center;position:relative;overflow:hidden}
.cta-end .lede{margin:2rem auto 0}
.cta-end .btn{margin-top:3rem}
.cta-end .cta-glow{position:absolute;left:50%;bottom:-30%;width:60rem;height:30rem;transform:translateX(-50%);background:radial-gradient(ellipse at center,rgba(229,29,69,.14),transparent 65%);pointer-events:none}

/* ---------- Interior page hero ---------- */
.page-hero{position:relative;min-height:72svh;display:flex;align-items:flex-end;overflow:hidden;isolation:isolate;padding-bottom:var(--blk)}
.page-hero .hero-media img{animation-duration:34s}
.page-hero .h-display{max-width:12.5em}
.page-hero .lede{margin-top:2rem}
.page-hero .hero-ctas{margin-top:2.75rem}
.page-hero-inner{width:100%;padding-top:9rem}

/* ---------- Detail / use cases ---------- */
.detail-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(2.5rem,6vw,6rem);align-items:start}
.detail-grid .sticky-side{position:sticky;top:7.5rem}
.usecase-list li{border-top:1px solid var(--line-l);padding:1.5rem 0;display:grid;grid-template-columns:2.4rem 1fr;gap:1.25rem;align-items:baseline;transition:padding-left .4s var(--eo)}
.usecase-list li:hover{padding-left:.6rem}
.usecase-list li:last-child{border-bottom:1px solid var(--line-l)}
.usecase-list .idx{font-size:.72rem;letter-spacing:.12em;color:var(--crimson);font-weight:500}
.usecase-list h3{font-family:var(--serif);font-weight:400;font-size:1.35rem}
.usecase-list p{color:var(--graphite);font-size:.93rem;margin-top:.4rem}
.on-dark-list .usecase-list li{border-color:var(--line-d)}
.on-dark-list .usecase-list p{color:var(--od-muted)}
.fact-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;margin-top:var(--blk)}
.fact{border-top:1px solid var(--line-d);padding-top:1.4rem}
.fact .fact-k{font-family:var(--serif);font-size:clamp(1.5rem,2.4vw,2rem);line-height:1.15}
.fact .fact-k em{font-style:italic;color:var(--crimson)}
.fact p{font-size:.9rem;color:var(--od-muted);margin-top:.7rem;max-width:24em}
.on-light .fact{border-color:var(--line-l)}
.on-light .fact p{color:var(--graphite)}

/* ---------- Timeline ---------- */
.timeline{position:relative;margin-top:var(--blk);display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.timeline::before{content:"";position:absolute;top:.35rem;left:0;height:1px;width:0;background:linear-gradient(to right,var(--crimson),rgba(229,29,69,.25));transition:width 2.2s var(--eo)}
.timeline.in-view::before{width:100%}
.tl-step{padding-top:2rem;position:relative}
.tl-step::before{content:"";position:absolute;top:0;left:0;width:.7rem;height:.7rem;border:1px solid var(--crimson);border-radius:50%;background:var(--ink);transition:background-color .5s ease}
.timeline.in-view .tl-step::before{background:var(--crimson)}
.timeline.in-view .tl-step:nth-child(2)::before{transition-delay:.55s}
.timeline.in-view .tl-step:nth-child(3)::before{transition-delay:1.1s}
.timeline.in-view .tl-step:nth-child(4)::before{transition-delay:1.65s}
.tl-step .tl-phase{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--od-faint);display:block;margin-bottom:.8rem}
.tl-step h3{font-family:var(--serif);font-weight:400;font-size:1.35rem;margin-bottom:.6rem}
.tl-step p{font-size:.92rem;color:var(--od-muted)}

/* ---------- Process ---------- */
.process-list{counter-reset:proc;display:grid}
.process-list li{counter-increment:proc;border-top:1px solid var(--line-l);padding:2rem 0;display:grid;grid-template-columns:minmax(4rem,8rem) 1fr;gap:1.5rem}
.process-list li:last-child{border-bottom:1px solid var(--line-l)}
.process-list li::before{content:"0" counter(proc);font-family:var(--serif);font-style:italic;font-size:1.6rem;color:var(--crimson);line-height:1}
.process-list h3{font-family:var(--serif);font-weight:400;font-size:1.45rem;margin-bottom:.5rem}
.process-list p{color:var(--graphite);font-size:.97rem;max-width:40em}
.key-msgs{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:var(--blk)}
.key-msgs li{font-size:.72rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--line-d);padding:.8rem 1.4rem;color:var(--od-muted)}

/* ---------- FAQ ---------- */
.faq{max-width:52rem}
.faq details{border-top:1px solid var(--line-d)}
.faq details:last-child{border-bottom:1px solid var(--line-d)}
.on-light .faq details{border-color:var(--line-l)}
.faq summary{list-style:none;cursor:pointer;padding:1.5rem 3rem 1.5rem 0;font-family:var(--serif);font-size:1.3rem;position:relative;transition:color .3s}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:.4rem;top:50%;width:.6rem;height:.6rem;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:translateY(-70%) rotate(45deg);transition:transform .35s var(--eo)}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq summary:hover{color:var(--crimson)}
.faq .faq-a{padding:0 0 1.75rem;color:var(--od-muted);font-size:.97rem;max-width:44em}
.on-light .faq .faq-a{color:var(--graphite)}

/* ---------- Founders ---------- */
.founder-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}
.founder-card{background:var(--ink-2);border:1px solid var(--line-d);overflow:hidden}
.founder-media{position:relative;aspect-ratio:4/3.2;background:radial-gradient(ellipse 65% 75% at 50% 62%,rgba(250,249,247,.07),transparent 70%),linear-gradient(160deg,#151a24 0%,#0b0c0f 100%);display:flex;align-items:center;justify-content:center;overflow:hidden}
.founder-media .silhouette{width:42%;opacity:.5}
.founder-media .placeholder-tag{position:absolute;bottom:1.1rem;left:50%;transform:translateX(-50%);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--od-faint);border:1px solid var(--line-d);padding:.45rem .9rem;white-space:nowrap;background:rgba(9,10,12,.6);backdrop-filter:blur(4px)}
.founder-body{padding:clamp(1.75rem,3vw,2.5rem)}
.founder-body .f-label{font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;color:var(--crimson);display:block;margin-bottom:.9rem}
.founder-body h3{font-family:var(--serif);font-weight:400;font-size:1.75rem;margin-bottom:1.1rem}
.founder-body p{color:var(--od-muted);font-size:.97rem}
.founder-body p+p{margin-top:.9rem}
.pov{text-align:center;max-width:54rem;margin-inline:auto}
.pov .h-1{margin-top:1.75rem}

/* ---------- Insights ---------- */
.insight-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}
.insight-card{border:1px solid var(--line-l);display:flex;flex-direction:column;background:transparent;transition:transform .45s var(--eo),box-shadow .45s var(--eo);position:relative}
.insight-card:hover{transform:translateY(-.35rem);box-shadow:0 24px 48px -24px rgba(9,10,12,.28)}
.insight-card .i-img{aspect-ratio:16/10;overflow:hidden}
.insight-card .i-img img{width:100%;height:100%;object-fit:cover;filter:saturate(.75) contrast(1.05) brightness(.9);transition:transform 1.2s var(--eo)}
.insight-card:hover .i-img img{transform:scale(1.05)}
.insight-card .i-body{padding:1.6rem 1.6rem 1.9rem;display:flex;flex-direction:column;flex:1}
.insight-card .i-tag{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--crimson);display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.insight-card .i-tag::before{content:"";width:.45rem;height:.45rem;border:1px solid var(--crimson);border-radius:50%}
.insight-card h3{font-family:var(--serif);font-weight:400;font-size:1.4rem;line-height:1.22}
.insight-card p{font-size:.92rem;color:var(--graphite);margin-top:.7rem}
.insight-card .i-foot{margin-top:auto;padding-top:1.3rem;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--graphite-light)}
.insight-card>a.i-cover{position:absolute;inset:0;z-index:5}

/* ---------- Article ---------- */
.article{max-width:44rem;margin-inline:auto}
.article .art-meta{display:flex;gap:1.5rem;align-items:center;margin-bottom:2rem;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--graphite)}
.article .art-meta .dot{width:3px;height:3px;background:var(--crimson);border-radius:50%}
.article h1{margin-bottom:2rem}
.article .art-body p{font-size:1.08rem;line-height:1.85;color:#2c2b29}
.article .art-body p+p{margin-top:1.5rem}
.article .art-body h2{font-family:var(--serif);font-weight:400;font-size:1.65rem;margin:3rem 0 1.25rem}
.article .art-body .pull{font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:1.4;color:var(--ink);border-left:2px solid var(--crimson);padding-left:1.75rem;margin:2.75rem 0}
.article .art-back{margin-bottom:3rem;display:inline-flex}

/* ---------- Contact ---------- */
.contact-layout{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(2.5rem,6vw,6.5rem);align-items:start}
.contact-aside .assure{margin-top:2.5rem;display:grid;gap:1.4rem}
.contact-aside .assure li{display:grid;grid-template-columns:1.5rem 1fr;gap:1rem;font-size:.93rem;color:var(--od-muted);align-items:baseline}
.contact-aside .assure li::before{content:"";width:.8rem;height:1px;background:var(--crimson);transform:translateY(-.3em)}
.contact-aside .c-email{margin-top:2.5rem}
.contact-aside .c-email a{font-family:var(--serif);font-size:1.35rem;color:var(--canvas);background-image:linear-gradient(var(--crimson),var(--crimson));background-repeat:no-repeat;background-size:0% 1px;background-position:left bottom;transition:background-size .4s var(--eo);padding-bottom:.2rem}
.contact-aside .c-email a:hover{background-size:100% 1px}
.contact-form{background:var(--canvas);color:var(--ink);padding:clamp(1.75rem,3.5vw,3rem)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.field{margin-bottom:1.4rem}
.field label{display:block;font-size:.7rem;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--graphite);margin-bottom:.55rem}
.field label .req{color:var(--crimson)}
.field input,.field select,.field textarea{width:100%;font:inherit;font-size:.98rem;color:var(--ink);background:transparent;border:none;border-bottom:1px solid var(--line-l);padding:.55rem 0;border-radius:0;transition:border-color .3s var(--eo);appearance:none}
.field select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236E6B67' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .2rem center;padding-right:1.5rem}
.field textarea{resize:vertical;min-height:7rem}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-bottom-color:var(--ink)}
.field.has-error input,.field.has-error select,.field.has-error textarea{border-bottom-color:var(--crimson)}
.field .error-msg{display:none;font-size:.78rem;color:var(--crimson);margin-top:.45rem}
.field.has-error .error-msg{display:block}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.25rem;margin-top:2rem}
.form-foot .small-note{color:var(--graphite-light);max-width:22em}
.btn.is-loading{pointer-events:none;opacity:.75}
.btn.is-loading .btn-arrow{display:none}
.btn .spinner{display:none;width:.95rem;height:.95rem;border:1.5px solid rgba(250,249,247,.35);border-top-color:var(--canvas);border-radius:50%;animation:spin .8s linear infinite}
.btn.is-loading .spinner{display:inline-block}
@keyframes spin{to{transform:rotate(360deg)}}
.form-success{display:none;text-align:center;padding:clamp(2rem,5vw,4rem) 1rem}
.form-success.is-visible{display:block}
.form-success .h-2{margin-top:1.25rem}
.form-success p{color:var(--graphite);margin-top:.9rem;max-width:32em;margin-inline:auto}
.form-success .check-mark{width:3rem;height:3rem;margin-inline:auto;color:var(--crimson)}
.form-success .mailto-line{margin-top:1.5rem;font-size:.9rem}
.form-success .mailto-line a{color:var(--crimson);border-bottom:1px solid currentColor}
.contact-form form.is-hidden{display:none}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);border-top:1px solid var(--line-d);padding:clamp(3.5rem,6vw,5.5rem) 0 2.5rem}
.footer-grid{display:grid;grid-template-columns:minmax(0,2fr) repeat(3,minmax(0,1fr));gap:2.5rem;margin-bottom:3.5rem}
.footer-grid .wordmark{font-size:1.55rem}
.footer-tag{margin-top:1.25rem;font-size:.85rem;color:var(--od-muted);max-width:22em}
.footer-addr{margin-top:1.5rem;font-size:.82rem;color:var(--od-faint);font-style:normal;line-height:1.8}
.footer-addr a{color:var(--od-muted)}
.footer-addr a:hover{color:var(--canvas)}
.footer-col h4{font-size:.68rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--od-faint);margin-bottom:1.25rem}
.footer-col ul{display:grid;gap:.75rem}
.footer-col a{font-size:.9rem;color:var(--od-muted);transition:color .3s}
.footer-col a:hover{color:var(--canvas)}
.footer-base{border-top:1px solid var(--line-d);padding-top:1.75rem;display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;font-size:.78rem;color:var(--od-faint)}
.footer-base a{color:inherit;transition:color .3s}
.footer-base a:hover{color:var(--canvas)}
.footer-base .legal-links{display:flex;gap:1.75rem}

/* ---------- Responsive ---------- */
@media (max-width:64rem){
  .nav-links,.nav-cta{display:none}
  .menu-toggle{display:block}
  .gap-layout,.why-layout,.detail-grid,.contact-layout{grid-template-columns:1fr}
  .detail-grid .sticky-side{position:static}
  .compare-grid{grid-template-columns:1fr;gap:1rem}
  .compare-col--featured{transform:none;order:-1}
  .svc-grid{grid-template-columns:1fr}
  .svc-card{min-height:26rem}
  .workflow{grid-template-columns:1fr}
  .wf-conn{transform:rotate(90deg);justify-content:center;width:2rem}
  .aud-grid,.cap-grid{grid-template-columns:repeat(2,1fr)}
  .timeline{grid-template-columns:repeat(2,1fr);row-gap:3rem}
  .founder-grid{grid-template-columns:1fr}
  .insight-grid{grid-template-columns:repeat(2,1fr)}
  .fact-strip{grid-template-columns:1fr;gap:0}
  .fact{padding-block:1.4rem}
  .footer-grid{grid-template-columns:1fr 1fr}
  .why-media{min-height:16rem;margin-top:2.5rem}
}
@media (max-width:40rem){
  body{font-size:1rem}
  .aud-grid,.cap-grid,.insight-grid,.timeline{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr;gap:0}
  .hero-ctas .btn{width:100%;justify-content:center}
  .proof-strip{gap:.8rem 1.5rem}
  .proof-strip li{gap:1.5rem}
  .process-list li{grid-template-columns:3rem 1fr;gap:1rem}
  .footer-grid{grid-template-columns:1fr;gap:2rem}
  .footer-base{flex-direction:column}
  .aud-card{min-height:19rem}
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
  .grain{animation:none}
  .hero-media img{animation:none}
  .gap-chart .line-capacity,.gap-chart .line-workload{stroke-dashoffset:0;animation:none}
  .gap-chart .gap-fill,.gap-chart .gap-marker{opacity:1}
  .timeline::before{width:100%}
  .timeline .tl-step::before{background:var(--crimson)}
}
