/* Tercero Analytics prototype · shared styles */
:root{
  --deep:#0e1a24; --deep-2:#13212e; --deep-3:#19303f;
  --charcoal:#2d3436;
  --teal:#00b894; --teal-soft:#00a383; --teal-deep:#00866a;
  --off:#eef4f7; --paper:#f7fafb; --cloud:#ffffff;
  --ink:#0d1b24; --ink-soft:#52656f;
  --snow:#eef3f6; --snow-soft:#aec2cd;
  --rule-d:rgba(255,255,255,.12); --rule-l:rgba(14,26,36,.12);
  --warn:#c5a046; --crit:#b8453a;
  --maxw:1180px;
  --sans:'Archivo',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --exp:'Archivo Expanded','Archivo',var(--sans);
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --e-out:cubic-bezier(.16,1,.3,1);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
body{font-family:var(--sans);background:var(--deep);color:var(--snow);font-size:clamp(1rem,.96rem + .2vw,1.07rem);line-height:1.65;font-feature-settings:"ss01","tnum";overflow-x:hidden;}
::selection{background:var(--teal);color:var(--deep);}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,5vw,48px);}
.mono{font-family:var(--mono);}
.eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.26em;text-transform:uppercase;color:var(--teal);font-weight:500;display:inline-flex;align-items:center;gap:.6em;}
.eyebrow::before{content:none;}
/* Headings wrap NATURALLY to fill their column. Do NOT use text-wrap:balance —
   it forces short, awkward, centred-looking line breaks and leaves dead space.
   `pretty` only avoids a lonely last word; lines still fill the available width. */
h1,h2,h3{font-family:var(--exp);font-weight:800;line-height:1.05;letter-spacing:-.02em;text-wrap:pretty;}
h2{font-size:clamp(2rem,1.3rem + 2.6vw,3.15rem);}
h3{font-family:var(--sans);font-weight:700;font-size:1.3rem;letter-spacing:-.01em;line-height:1.2;}
p{text-wrap:pretty;}
.lead{font-size:clamp(1.08rem,1rem + .5vw,1.3rem);line-height:1.6;color:var(--snow);max-width:70ch;}
.muted{color:var(--snow-soft);}
section{position:relative;}

/* mark */
.mark{width:1em;height:1em;display:inline-block;flex:none;}
.mark .legs{fill:none;stroke:currentColor;stroke-width:7;stroke-linecap:round;}
.mark .node{fill:var(--teal);}

/* buttons */
.btn{--bg:var(--teal);--fg:var(--deep);display:inline-flex;align-items:center;gap:.6em;font-weight:600;font-size:.98rem;padding:.85em 1.4em;background:var(--bg);color:var(--fg);border:1px solid var(--bg);transition:transform .25s var(--e-out),background .25s var(--e-out),box-shadow .35s var(--e-out);}
.btn .arw{transition:transform .3s var(--e-out);}
.btn:hover{box-shadow:0 10px 34px -12px var(--teal);transform:translateY(-2px);}
.btn:hover .arw{transform:translateX(4px);}
.btn.ghost{--bg:transparent;--fg:var(--snow);border-color:var(--rule-d);}
.btn.ghost:hover{border-color:var(--teal);color:var(--snow);box-shadow:none;}
.btn.dark{--bg:var(--deep);--fg:var(--snow);border-color:var(--deep);}
.btn.onlight{--bg:var(--deep);--fg:var(--snow);border-color:var(--deep);}
.btn.onlight.ghost{--bg:transparent;--fg:var(--ink);border-color:var(--rule-l);}
/* ghost button on a light background must keep dark text on hover (was inheriting white from .btn.ghost:hover) */
.btn.onlight.ghost:hover{color:var(--ink);background:rgba(14,26,36,.04);border-color:var(--teal-deep);box-shadow:none;}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;}

/* header */
header.site{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .4s var(--e-out),border-color .4s;border-bottom:1px solid transparent;}
header.site.scrolled{background:rgba(10,18,26,.82);backdrop-filter:blur(14px);border-bottom-color:var(--rule-d);}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;}
.brand{display:flex;align-items:center;gap:.6em;font-family:var(--exp);font-weight:700;font-size:1.05rem;letter-spacing:-.01em;color:var(--snow);}
.brand .mark{font-size:1.5rem;color:var(--snow);}
.nav-links{display:flex;align-items:center;gap:1.4rem;}
.nav-links a.lnk{font-size:.93rem;color:var(--snow-soft);transition:color .2s;position:relative;}
.nav-links a.lnk:hover,.nav-links a.lnk[aria-current="page"]{color:var(--snow);}
.nav-links a.lnk::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:0;background:var(--teal);transition:width .3s var(--e-out);}
.nav-links a.lnk:hover::after,.nav-links a.lnk[aria-current="page"]::after{width:100%;}
.nav .btn{padding:.6em 1.05em;font-size:.88rem;}
.menu-btn{display:none;background:none;border:1px solid var(--rule-d);color:var(--snow);padding:.5em .8em;font-family:var(--mono);font-size:.8rem;cursor:pointer;}
/* dark header text when sitting over a light hero (before scroll) */
header.site.onlight:not(.scrolled) .brand,header.site.onlight:not(.scrolled) .brand .mark{color:var(--ink);}
header.site.onlight:not(.scrolled) .nav-links a.lnk{color:var(--ink-soft);}
header.site.onlight:not(.scrolled) .nav-links a.lnk:hover,header.site.onlight:not(.scrolled) .nav-links a.lnk[aria-current="page"]{color:var(--ink);}
header.site.onlight:not(.scrolled) .menu-btn{color:var(--ink);border-color:var(--rule-l);}

/* generic section */
.sec{padding:clamp(4.5rem,9vw,8rem) 0;}
/* Section heads fill their column — no narrow cap that strands the heading in a
   thin left column with dead space beside it. The heading runs the full width and
   wraps naturally; only the intro paragraph keeps a readable measure (below). */
.sec-head{margin-bottom:clamp(2.2rem,5vw,3.6rem);}
.sec-head > p,.sec-head > .lead,.sec-head > .muted{max-width:90ch;}
.sec-head h2{margin:1rem 0 1rem;}
.sec.light{background:var(--off);color:var(--ink);border-top:1px solid var(--rule-l);}
.sec.light .muted{color:var(--ink-soft);}
.sec.light h2{color:var(--ink);}
.sec.light .eyebrow{color:var(--teal-deep);}
.sec.light .eyebrow::before{background:var(--teal-deep);}
.alt{background:var(--deep-2);border-top:1px solid var(--rule-d);}

/* home hero */
.hero{min-height:100svh;display:flex;align-items:center;padding-top:72px;position:relative;overflow:hidden;}
#signal{position:absolute;inset:0;width:100%;height:100%;z-index:0;}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.42;}
@media (prefers-reduced-motion:reduce){.hero-bg{display:none;}.hero{background:#0b141c url(assets/video/hero-poster.jpg) center/cover no-repeat;}}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(120% 80% at 78% 18%, rgba(0,184,148,.10), transparent 60%),linear-gradient(180deg, rgba(10,18,26,.30), rgba(10,18,26,.78) 88%);pointer-events:none;}
.hero .wrap{position:relative;z-index:2;width:100%;padding-top:5vh;padding-bottom:8vh;}
.hero h1{font-family:var(--exp);font-weight:900;font-size:clamp(2.5rem,1.6rem + 5.1vw,4.7rem);letter-spacing:-.03em;line-height:1.0;margin:.6rem 0 1.4rem;max-width:18ch;}
.hero h1 .em{color:var(--teal);}
.hero .lead{margin-bottom:2.2rem;}
.paths{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:.4rem;}
.path{display:flex;align-items:center;gap:1rem;padding:1.05rem 1.3rem;min-width:288px;flex:1 1 300px;max-width:380px;background:rgba(255,255,255,.03);border:1px solid var(--rule-d);transition:border-color .3s,background .3s,transform .3s var(--e-out);}
.path:hover{border-color:var(--teal);background:rgba(0,184,148,.06);transform:translateY(-2px);}
.path .k{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;color:var(--teal);text-transform:uppercase;}
.path .t{font-weight:600;font-size:1.04rem;color:var(--snow);}
.path .arw{margin-left:auto;color:var(--snow-soft);transition:transform .3s var(--e-out),color .3s;}
.path:hover .arw{transform:translateX(5px);color:var(--teal);}
.scrollcue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;font-family:var(--mono);font-size:.66rem;letter-spacing:.3em;color:var(--snow-soft);text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px;}
.scrollcue .ln{width:1px;height:34px;background:linear-gradient(var(--teal),transparent);animation:drop 2.2s var(--e-out) infinite;}
@keyframes drop{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* page hero (inner pages) */
.phero{padding:calc(72px + clamp(3.5rem,8vw,6rem)) 0 clamp(2.5rem,5vw,4rem);border-bottom:1px solid var(--rule-d);position:relative;overflow:hidden;}
.phero.light{background:var(--off);color:var(--ink);border-bottom-color:var(--rule-l);}
.phero.light .muted{color:var(--ink-soft);}
.phero.light .eyebrow{color:var(--teal-deep);}
.phero.light .eyebrow::before{background:var(--teal-deep);}
.phero h1{font-family:var(--exp);font-weight:900;font-size:clamp(2.3rem,1.6rem + 3.6vw,4rem);letter-spacing:-.03em;line-height:1.02;margin:1.1rem 0 1.2rem;max-width:20ch;}
.phero h1 .em{color:var(--teal);}
.phero.light h1 .em{color:var(--teal-deep);}
.phero .lead{margin-top:0;}

/* proof strip */
.proof{border-top:1px solid var(--rule-d);border-bottom:1px solid var(--rule-d);background:var(--deep-2);}
.proof .grid{display:grid;grid-template-columns:repeat(4,1fr);}
.stat{padding:2.4rem clamp(16px,2.4vw,30px);border-left:1px solid var(--rule-d);}
.stat:first-child{border-left:0;}
.stat .n{font-family:var(--exp);font-weight:800;font-size:clamp(1.9rem,1.2rem + 2vw,2.9rem);letter-spacing:-.02em;color:var(--snow);line-height:1;font-variant-numeric:tabular-nums;}
.stat .n .u{color:var(--teal);}
.stat .l{font-family:var(--mono);font-size:.74rem;color:var(--snow-soft);margin-top:.7rem;line-height:1.4;}

/* value spine (from -> to) */
.changes{border-top:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.chg{display:grid;grid-template-columns:1fr 44px 1.3fr;align-items:center;gap:1.2rem;padding:1.35rem 0;border-bottom:1px solid var(--rule-d);}
.chg .from{color:var(--snow-soft);font-size:1.05rem;}
.chg .ar{color:var(--teal);text-align:center;font-size:1.3rem;}
.chg .to{color:var(--snow);font-weight:600;font-size:clamp(1.05rem,1rem + .4vw,1.25rem);}
@media (max-width:680px){.chg{grid-template-columns:1fr;gap:.2rem;padding:1.05rem 0;}.chg .ar{display:none;}.chg .from{font-size:.92rem;}.chg .from::after{content:" \2192";color:var(--teal);}}

/* diptych */
.diptych{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule-d);}
.arm{padding:clamp(2.6rem,5vw,4.6rem) clamp(22px,5vw,56px);border-left:1px solid var(--rule-d);position:relative;overflow:hidden;}
.arm:first-child{border-left:0;}
.arm.ai{background:linear-gradient(180deg,var(--deep-2),var(--deep));}
.arm .tag{font-family:var(--mono);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);}
.arm h3{font-family:var(--exp);font-weight:800;font-size:clamp(1.5rem,1rem + 1.6vw,2.05rem);letter-spacing:-.02em;margin:1.1rem 0 1rem;color:var(--snow);}
.arm ul{list-style:none;margin:1.4rem 0;display:flex;flex-direction:column;gap:.85rem;}
.arm li{display:flex;gap:.8rem;color:var(--snow);font-size:1rem;align-items:flex-start;}
.arm li .dot{width:7px;height:7px;background:var(--teal);flex:none;margin-top:.55em;}
.arm .more{display:inline-flex;align-items:center;gap:.5em;font-weight:600;color:var(--teal);margin-top:1rem;}
.arm .more .arw{transition:transform .3s var(--e-out);}
.arm:hover .more .arw{transform:translateX(5px);}
.arm .ix{position:absolute;top:clamp(2.6rem,5vw,4.6rem);right:clamp(22px,5vw,56px);font-family:var(--mono);font-size:.74rem;color:var(--snow-soft);}

/* home split: the two arms as big half-page panels */
.split{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--rule-d);border-bottom:1px solid var(--rule-d);}
.split .panel{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;min-height:min(74vh,640px);padding:clamp(2rem,4.5vw,4rem);overflow:hidden;border-left:1px solid var(--rule-d);transition:background .4s var(--e-out);}
.split .panel:first-child{border-left:0;}
.split .panel.re{background:var(--deep-2);}
.split .panel.sme{background:linear-gradient(155deg,#143038,var(--deep-2));}
.split .panel:hover{background:var(--deep-3);}
.split .panel .markbg{position:absolute;top:6%;right:-7%;width:48%;height:auto;color:rgba(255,255,255,.035);pointer-events:none;}
.split .panel .ptag{position:relative;font-family:var(--mono);font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;color:var(--teal);}
.split .panel h2{position:relative;font-family:var(--exp);font-weight:800;font-size:clamp(1.9rem,1.2rem + 2.4vw,3.1rem);letter-spacing:-.02em;color:var(--snow);margin:1rem 0 1rem;max-width:16ch;}
.split .panel p{position:relative;color:var(--snow-soft);font-size:1.05rem;line-height:1.55;max-width:40ch;}
.split .panel .go{position:relative;margin-top:1.7rem;display:inline-flex;align-items:center;gap:.5em;font-weight:600;color:var(--teal);}
.split .panel .go .arw{transition:transform .3s var(--e-out);}
.split .panel:hover .go .arw{transform:translateX(6px);}

/* story page */
.storypage{max-width:64ch;margin:0 auto;}
.storypage p{font-size:clamp(1.08rem,1rem + .4vw,1.25rem);line-height:1.75;color:var(--snow);margin:0 0 1.5rem;}
.storypage p b{color:var(--snow);font-weight:600;}
.storypage .said{font-weight:600;font-size:1.12rem;color:var(--snow);margin:0 0 1.5rem;}
.storypage .lede{font-family:var(--exp);font-weight:600;font-size:clamp(1.45rem,1rem + 1.5vw,2.1rem);line-height:1.3;letter-spacing:-.01em;color:var(--snow);margin:2.2rem 0 1.7rem;}
.storypage .lede b{color:var(--teal);font-weight:600;}
.pull{text-align:center;margin:2.8rem 0;padding:0 1rem;}
.pull .q{font-family:var(--exp);font-weight:800;font-size:clamp(1.9rem,1rem + 2.8vw,3.2rem);line-height:1.12;letter-spacing:-.02em;color:var(--teal);}
.pull .who{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;color:var(--snow-soft);margin-top:1rem;}
@media (max-width:760px){.split{grid-template-columns:1fr;} .split .panel{min-height:auto;border-left:0;border-top:1px solid var(--rule-d);} .split .panel:first-child{border-top:0;}}

/* wedge / capabilities (RE) */
.wedge{font-size:clamp(1.15rem,1rem + .7vw,1.5rem);line-height:1.55;color:var(--snow);font-weight:500;}
.wedge b{color:var(--teal);font-weight:600;}
.caps{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2.2rem,5vw,3.4rem);}
.cap{background:var(--deep);padding:2.1rem 1.7rem;display:flex;flex-direction:column;gap:.85rem;}
.cap .h{font-family:var(--exp);font-weight:700;font-size:1.18rem;color:var(--snow);}
.cap .pf{font-family:var(--mono);font-size:.78rem;color:var(--teal);line-height:1.5;}
.cap p{color:var(--snow-soft);font-size:.94rem;line-height:1.6;}
.feature{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,4vw,4rem);align-items:center;margin-top:clamp(2.6rem,5vw,4rem);padding:clamp(2.2rem,4vw,3.2rem);border:1px solid var(--rule-d);background:var(--deep-2);}
.bigjump{display:flex;align-items:baseline;gap:1rem;font-family:var(--exp);font-weight:900;letter-spacing:-.03em;}
.bigjump .was{font-size:clamp(1.6rem,3vw,2.4rem);color:var(--snow-soft);text-decoration:line-through;text-decoration-color:var(--rule-d);}
.bigjump .arw{color:var(--teal);font-weight:400;font-size:1.6rem;}
.bigjump .now{font-size:clamp(3rem,6vw,5rem);color:var(--teal);line-height:1;}
.feature .q{font-family:var(--mono);font-size:.82rem;color:var(--snow-soft);margin-top:1.2rem;line-height:1.6;border-top:1px solid var(--rule-d);padding-top:1.2rem;}
.tags{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.4rem;}
.tags .tg{font-family:var(--mono);font-size:.76rem;color:var(--snow);border:1px solid var(--rule-d);padding:.5em .9em;background:rgba(255,255,255,.02);}
.honesty{margin-top:2.2rem;font-size:.98rem;color:var(--snow-soft);max-width:64ch;}
.honesty b{color:var(--snow);font-weight:600;}

/* workflows grid (shared RE + AI) */
.flows{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.flows.two{grid-template-columns:repeat(2,1fr);}

/* clickable demo / dashboard boxes */
.demos{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.demo-card{display:flex;flex-direction:column;gap:.55rem;background:var(--deep);padding:clamp(1.5rem,3vw,2rem);position:relative;transition:background .3s var(--e-out);}
.sec.light .demo-card{background:var(--paper);}
.demo-card:hover{background:rgba(0,184,148,.06);}
.demo-card .mini{display:flex;align-items:flex-end;gap:4px;height:32px;margin-bottom:.5rem;}
.demo-card .mini i{flex:1;background:var(--teal);opacity:.4;transition:opacity .3s var(--e-out);}
.demo-card:hover .mini i{opacity:.85;}
.demo-card .tagm{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--teal);}
.sec.light .demo-card .tagm{color:var(--teal-deep);}
.demo-card h3{font-family:var(--exp);font-weight:700;font-size:1.18rem;color:var(--snow);}
.sec.light .demo-card h3,.sec.cloud .demo-card h3{color:var(--ink);}
.demo-card p{font-size:.92rem;color:var(--snow-soft);line-height:1.55;}
.sec.light .demo-card p,.sec.cloud .demo-card p{color:var(--ink-soft);}
.demo-card .open{margin-top:auto;padding-top:.7rem;display:inline-flex;align-items:center;gap:.5em;font-weight:600;font-size:.9rem;color:var(--teal);}
.sec.light .demo-card .open,.sec.cloud .demo-card .open{color:var(--teal-deep);}
.demo-card .open .arw{transition:transform .3s var(--e-out);}
.demo-card:hover .open .arw{transform:translateX(5px);}
.flow{background:var(--deep);padding:1.8rem 1.6rem;}
.sec.light .flow{background:var(--paper);}
.flow .h{font-family:var(--exp);font-weight:700;font-size:1.05rem;color:var(--snow);margin-bottom:.5rem;}
.sec.light .flow .h{color:var(--ink);}
.flow p{font-size:.92rem;color:var(--snow-soft);line-height:1.55;}
.sec.light .flow p{color:var(--ink-soft);}

/* AI: failure framing */
.fail{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:2.4rem 0 1rem;}
.fail .f{padding:1.6rem;background:var(--paper);border:1px solid var(--rule-l);}
.fail .f .q{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--crit);}
.fail .f p{margin-top:.7rem;color:var(--ink);font-size:1rem;line-height:1.5;}
.turn{font-size:clamp(1.15rem,1rem + .7vw,1.5rem);line-height:1.55;max-width:62ch;color:var(--ink);font-weight:500;margin-top:1.4rem;}
.turn b{color:var(--teal-deep);font-weight:700;}

/* ladder */
.ladder{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:clamp(2.6rem,5vw,4rem);counter-reset:rung;}
.rung{position:relative;padding:1.8rem 1.4rem 0 0;border-top:2px solid var(--ink);}
.sec:not(.light) .rung{border-top-color:var(--snow);}
.rung::before{counter-increment:rung;content:"0" counter(rung);font-family:var(--mono);font-size:.8rem;color:var(--teal-deep);position:absolute;top:-1.7rem;left:0;font-weight:600;}
.sec:not(.light) .rung::before{color:var(--teal);}
.rung .h{font-family:var(--exp);font-weight:700;font-size:1.1rem;color:var(--ink);margin-bottom:.5rem;}
.sec:not(.light) .rung .h{color:var(--snow);}
.rung p{color:var(--ink-soft);font-size:.92rem;line-height:1.55;}
.sec:not(.light) .rung p{color:var(--snow-soft);}
.rung .free{display:inline-block;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--teal-deep);border:1px solid var(--teal-deep);padding:.15em .5em;margin-bottom:.6rem;}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:2.4rem;align-items:center;}
.chips .lbl{font-family:var(--mono);font-size:.74rem;color:var(--ink-soft);margin-right:.4rem;}
.chips .c{font-family:var(--mono);font-size:.78rem;color:var(--ink);border:1px solid var(--rule-l);padding:.45em .8em;background:var(--paper);}

/* trust row (security mini) */
.trust{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin-top:2.4rem;padding-top:1.8rem;border-top:1px solid var(--rule-l);}
.sec:not(.light) .trust{border-top-color:var(--rule-d);}
.trust .t{display:flex;align-items:center;gap:.6em;font-size:.95rem;color:var(--ink);font-weight:500;}
.sec:not(.light) .trust .t{color:var(--snow);}
.trust .t .dot{width:7px;height:7px;background:var(--teal);flex:none;}

/* security section / page */
.secband{background:var(--deep);border-top:1px solid var(--rule-d);}
.seclist{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.secitem{background:var(--deep);padding:1.9rem 1.7rem;}
.secitem .hd{display:flex;align-items:center;gap:.7rem;margin-bottom:.7rem;}
.secitem .hd .ic{width:30px;height:30px;border:1px solid var(--teal);display:flex;align-items:center;justify-content:center;color:var(--teal);flex:none;}
.secitem .hd .ic svg{width:15px;height:15px;}
.secitem .hd h3{font-family:var(--exp);font-weight:700;font-size:1.08rem;color:var(--snow);}
.secitem p{color:var(--snow-soft);font-size:.94rem;line-height:1.6;}
.secitem .st{display:inline-block;margin-top:.8rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;padding:.2em .6em;border:1px solid var(--rule-d);color:var(--snow-soft);}
.secitem .st.live{color:var(--teal);border-color:var(--teal);}
.secitem .st.prog{color:var(--warn);border-color:var(--warn);}
/* compact security grid (home teaser) */
.secgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(1.8rem,4vw,2.6rem);}
.secgrid .item{background:var(--deep);padding:1.2rem 1.35rem;display:flex;align-items:center;gap:.9rem;}
.secgrid .item .ic{width:38px;height:38px;border:1px solid rgba(0,184,148,.4);background:rgba(0,184,148,.08);color:var(--teal);display:flex;align-items:center;justify-content:center;flex:none;}
.secgrid .item .ic svg{width:18px;height:18px;}
.secgrid .item .t{font-size:.98rem;color:var(--snow);font-weight:500;line-height:1.25;}
.sec.light .secgrid{background:var(--rule-l);border-color:var(--rule-l);}
.sec.light .secgrid .item{background:var(--paper);}
.sec.light .secgrid .item .t{color:var(--ink);}
.sec.light .secgrid .item .ic{border-color:rgba(0,125,99,.4);background:rgba(0,125,99,.08);color:var(--teal-deep);}
@media (max-width:860px){.secgrid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.secgrid{grid-template-columns:1fr;}}

/* examples / case cards */
.cases{display:flex;flex-direction:column;gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.case{background:var(--deep);padding:clamp(1.8rem,3vw,2.6rem);display:grid;grid-template-columns:.9fr 1.4fr .9fr;gap:clamp(1.4rem,3vw,3rem);align-items:start;}
.case .sector{font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);}
.case .ttl{font-family:var(--exp);font-weight:700;font-size:1.15rem;color:var(--snow);margin-top:.6rem;line-height:1.25;}
.case .body p{font-size:.95rem;color:var(--snow-soft);line-height:1.6;margin-bottom:.6rem;}
.case .body p b{color:var(--snow);font-weight:600;}
.case .metrics{display:flex;flex-direction:column;gap:1rem;}
.case .metric .mn{font-family:var(--exp);font-weight:800;font-size:1.5rem;color:var(--teal);line-height:1;font-variant-numeric:tabular-nums;}
.case .metric .ml{font-family:var(--mono);font-size:.72rem;color:var(--snow-soft);margin-top:.35rem;line-height:1.4;}

/* band */
.band{background:var(--deep);border-top:1px solid var(--rule-d);padding:clamp(3.5rem,6vw,5rem) 0;}
.band p{font-family:var(--exp);font-weight:600;font-size:clamp(1.4rem,1rem + 1.8vw,2.3rem);line-height:1.25;letter-spacing:-.02em;color:var(--snow);}
.band p b{color:var(--teal);}

/* team */
.founders{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2.2rem,5vw,3.4rem);}
.founder{background:var(--deep);padding:2.3rem 1.9rem;display:flex;flex-direction:column;gap:1rem;}
.medallion{width:64px;height:64px;border:1px solid var(--rule-d);display:flex;align-items:center;justify-content:center;font-family:var(--exp);font-weight:800;font-size:1.3rem;color:var(--snow);background:rgba(0,184,148,.05);position:relative;}
.medallion .mark{position:absolute;right:-1px;bottom:-1px;font-size:1rem;color:var(--snow);background:var(--deep);padding:2px;}
.founder .nm{font-family:var(--exp);font-weight:700;font-size:1.18rem;color:var(--snow);}
.founder .rl{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);}
.founder p{color:var(--snow-soft);font-size:.93rem;line-height:1.6;}
.founders.two{grid-template-columns:repeat(2,1fr);}

/* portraits */
.portrait{position:relative;aspect-ratio:4/5;width:100%;background:rgba(0,184,148,.07);border:1px solid var(--rule-d);overflow:hidden;display:flex;align-items:center;justify-content:center;margin-bottom:.4rem;}
.portrait .ph{font-family:var(--exp);font-weight:800;font-size:2.6rem;color:var(--snow-soft);}
.portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;}

/* clickable arm box */
a.arm.box{cursor:pointer;}
a.arm.box:hover{background:rgba(0,184,148,.05);}
a.arm.box:hover .more .arw{transform:translateX(5px);}

/* story (full width, single column across the page) */
.story p{font-size:clamp(1.05rem,1rem + .25vw,1.2rem);line-height:1.75;color:var(--snow);margin:0 0 1.4rem;}
.story p b{color:var(--snow);font-weight:600;}
.story .lede{font-family:var(--exp);font-weight:600;font-size:clamp(1.4rem,1rem + 1.4vw,2.2rem);line-height:1.3;letter-spacing:-.01em;color:var(--snow);margin:1.6rem 0 1.6rem;}
.story .lede b{color:var(--teal);font-weight:600;}

/* quotes */
.quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.quote{background:var(--deep);padding:clamp(1.8rem,3vw,2.4rem);display:flex;flex-direction:column;gap:1.1rem;}
.sec.light .quote,.band-tint .quote{background:var(--paper);}
.quote .mk{font-family:var(--exp);font-weight:800;font-size:2rem;color:var(--teal);line-height:.5;height:.8em;}
.quote .qt{font-family:var(--exp);font-weight:600;font-size:clamp(1.1rem,1rem + .5vw,1.35rem);line-height:1.35;color:var(--snow);}
.sec.light .quote .qt,.band-tint .quote .qt{color:var(--ink);}
.quote .at{font-family:var(--mono);font-size:.74rem;letter-spacing:.08em;color:var(--snow-soft);margin-top:auto;}
.sec.light .quote .at,.band-tint .quote .at{color:var(--ink-soft);}

/* single feature quote */
.proofq{max-width:48ch;margin:0 auto;text-align:center;}
.proofq .mk{font-family:var(--exp);font-weight:800;font-size:2.6rem;color:var(--teal);line-height:.35;display:block;margin-bottom:1.2rem;}
.sec.light .proofq .mk,.band-tint .proofq .mk{color:var(--teal-deep);}
.proofq .qt{font-family:var(--exp);font-weight:600;font-size:clamp(1.4rem,1rem + 1.6vw,2.1rem);line-height:1.3;letter-spacing:-.01em;color:var(--snow);}
.sec.light .proofq .qt,.band-tint .proofq .qt{color:var(--ink);}
.proofq .at{font-family:var(--mono);font-size:.78rem;letter-spacing:.06em;color:var(--snow-soft);margin-top:1.4rem;}
.sec.light .proofq .at,.band-tint .proofq .at{color:var(--ink-soft);}

/* trusted-by strip */
.trustedby{margin-top:clamp(2rem,4vw,2.6rem);padding-top:1.6rem;border-top:1px solid var(--rule-d);display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.5rem;}
.sec.light .trustedby{border-top-color:var(--rule-l);}
.trustedby .lbl{font-family:var(--mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--snow-soft);}
.sec.light .trustedby .lbl{color:var(--ink-soft);}
.trustedby .c{font-family:var(--exp);font-weight:600;font-size:1rem;color:var(--snow);}
.sec.light .trustedby .c{color:var(--ink);}

/* client logo wall */
.logowall{margin-top:clamp(2rem,4vw,3rem);}
.logowall .grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);}
.logowall.four .grid{grid-template-columns:repeat(4,1fr);}
.sec.light .logowall .grid{background:var(--rule-l);border-color:var(--rule-l);}
.logowall .cell{position:relative;background:var(--deep);display:flex;align-items:center;justify-content:center;padding:1.7rem 1.3rem;min-height:104px;}
.alt .logowall .cell{background:var(--deep-2);}
.sec.light .logowall .cell{background:var(--paper);}
.logowall .cell img{max-height:34px;max-width:148px;width:auto;object-fit:contain;filter:brightness(0) invert(1);opacity:.62;transition:opacity .35s var(--e-out);}
.sec.light .logowall .cell img{filter:brightness(0);opacity:.5;}
.logowall .cell:hover img{opacity:1;}
.logowall .cell .word{font-family:var(--exp);font-weight:700;font-size:1.02rem;letter-spacing:-.01em;line-height:1.12;text-align:center;color:var(--snow);opacity:.6;transition:opacity .35s var(--e-out);}
.sec.light .logowall .cell .word{color:var(--ink);opacity:.55;}
.logowall .cell:hover .word{opacity:1;}
/* pending client sign-off — visible gate in the prototype; flip data-cleared to "yes" to publish */
.logowall .cell[data-cleared="pending"] img,.logowall .cell[data-cleared="pending"] .word{opacity:.2;}
.logowall .cell[data-cleared="pending"]:hover img,.logowall .cell[data-cleared="pending"]:hover .word{opacity:.32;}
.logowall .cell[data-cleared="pending"]::after{content:"Pending sign-off";position:absolute;bottom:9px;left:0;right:0;text-align:center;font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--warn);}
.logowall .lw-note{margin-top:1.1rem;font-family:var(--mono);font-size:.74rem;line-height:1.6;color:var(--snow-soft);max-width:70ch;}
.sec.light .logowall .lw-note{color:var(--ink-soft);}
@media (max-width:900px){.logowall .grid,.logowall.four .grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:560px){.logowall .grid,.logowall.four .grid{grid-template-columns:repeat(2,1fr);}.logowall .cell{min-height:88px;padding:1.3rem 1rem;}}

/* home trusted-by strip (slim, cleared logos only) */
.logostrip{padding:clamp(2.6rem,5vw,3.6rem) 0;border-top:1px solid var(--rule-d);border-bottom:1px solid var(--rule-d);background:var(--deep);}
.logostrip .lbl{display:block;text-align:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--snow-soft);margin-bottom:1.8rem;}
.logostrip .row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2rem 3rem;}
.logostrip img{max-height:30px;max-width:128px;width:auto;object-fit:contain;filter:brightness(0) invert(1);opacity:.55;transition:opacity .35s var(--e-out);}
.logostrip img:hover{opacity:1;}
@media (max-width:560px){.logostrip .row{gap:1.5rem 2rem;}.logostrip img{max-height:24px;}}

/* flagship: noise -> signal transform */
.n2s-stage{display:grid;grid-template-columns:1fr 66px 1fr;gap:0;margin-top:clamp(2rem,4vw,3rem);border:1px solid var(--rule-d);background:var(--rule-d);}
.n2s-side{background:var(--deep-2);padding:clamp(1.4rem,3vw,2rem);position:relative;min-height:286px;overflow:hidden;}
.n2s-tag{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--snow-soft);}
.n2s-tag.done{color:var(--teal);}
.n2s-noise{list-style:none;margin:1.3rem 0 0;padding:0;display:flex;flex-direction:column;gap:.85rem;font-family:var(--mono);font-size:.82rem;color:var(--snow-soft);}
.n2s-noise li{opacity:.55;filter:blur(.3px);transition:opacity 1s var(--e-out),filter 1s var(--e-out);}
.n2s-noise li:nth-child(odd){transform:translateX(7px) rotate(-.4deg);}
.n2s-noise li:nth-child(3n){transform:translateX(-9px) rotate(.5deg);}
.n2s.is-on .n2s-noise li{opacity:.15;filter:blur(1.6px);}
.n2s-mid{background:var(--deep);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.n2s-mid .n2s-mark{width:32px;height:32px;opacity:.45;transition:opacity 1s var(--e-out);}
.n2s-mid .n2s-mark .legs path{stroke:var(--teal);stroke-width:5;fill:none;}
.n2s-mid .n2s-mark .node circle{fill:var(--teal);}
.n2s.is-on .n2s-mid .n2s-mark{opacity:1;}
.n2s-scan{position:absolute;top:0;bottom:0;width:2px;background:linear-gradient(180deg,transparent,var(--teal),transparent);left:0;opacity:0;}
.n2s.is-on .n2s-scan{animation:n2sscan 1.5s var(--e-out) forwards;}
@keyframes n2sscan{0%{left:0;opacity:0}12%{opacity:.95}100%{left:100%;opacity:0}}
.n2s-table{width:100%;border-collapse:collapse;margin-top:1.2rem;font-family:var(--mono);font-size:.82rem;}
.n2s-table td{padding:.55rem .3rem;border-bottom:1px solid var(--rule-d);color:var(--snow);}
.n2s-table td:nth-child(2){color:var(--teal);text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.n2s-table td:nth-child(3){color:var(--snow-soft);text-align:right;font-size:.7rem;white-space:nowrap;}
html.js .n2s .n2s-table tr{opacity:0;transform:translateY(7px);}
.n2s.is-on .n2s-table tr{opacity:1;transform:none;transition:opacity .5s var(--e-out),transform .5s var(--e-out);}
.n2s.is-on .n2s-table tr:nth-child(1){transition-delay:.5s}
.n2s.is-on .n2s-table tr:nth-child(2){transition-delay:.64s}
.n2s.is-on .n2s-table tr:nth-child(3){transition-delay:.78s}
.n2s.is-on .n2s-table tr:nth-child(4){transition-delay:.92s}
.n2s.is-on .n2s-table tr:nth-child(5){transition-delay:1.06s}
.n2s.is-on .n2s-table tr:nth-child(6){transition-delay:1.2s}
.n2s-foot{margin-top:1.5rem;color:var(--snow-soft);font-size:.86rem;}
.n2s-foot b{color:var(--teal);font-weight:600;}
@media (max-width:760px){.n2s-stage{grid-template-columns:1fr;}.n2s-side{min-height:0;}.n2s-mid{min-height:56px;}.n2s-scan{display:none;}.n2s-side.raw{border-bottom:1px solid var(--rule-d);}}
@media (prefers-reduced-motion:reduce){html.js .n2s .n2s-table tr{opacity:1;transform:none;}.n2s-noise li{opacity:.22;filter:none;}.n2s-scan{display:none;}}

/* good-fit / not-for-you */
.fit{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--rule-d);border:1px solid var(--rule-d);margin-top:clamp(2rem,4vw,3rem);}
.fit .col{background:var(--deep);padding:clamp(1.6rem,3vw,2.2rem);}
.fit .col h3{font-family:var(--exp);font-weight:700;font-size:1.15rem;color:var(--snow);margin-bottom:1.2rem;}
.fit .col.yes h3{color:var(--teal);}
.fit .col ul{list-style:none;display:flex;flex-direction:column;gap:.85rem;}
.fit .col li{display:flex;gap:.75rem;color:var(--snow);font-size:.98rem;line-height:1.45;align-items:flex-start;}
.fit .col li .m{flex:none;font-weight:800;font-family:var(--mono);}
.fit .col.yes li .m{color:var(--teal);}
.fit .col.no li,.fit .col.no li .m{color:var(--snow-soft);}
.sec.light .fit{background:var(--rule-l);border-color:var(--rule-l);}
.sec.light .fit .col{background:var(--paper);}
.sec.light .fit .col h3{color:var(--ink);}
.sec.light .fit .col.yes h3{color:var(--teal-deep);}
.sec.light .fit .col li{color:var(--ink);}
.sec.light .fit .col.yes li .m{color:var(--teal-deep);}
.sec.light .fit .col.no li,.sec.light .fit .col.no li .m{color:var(--ink-soft);}

/* faq */
.faq{margin-top:clamp(2rem,4vw,2.6rem);border-top:1px solid var(--rule-d);}
.sec.light .faq{border-top-color:var(--rule-l);}
.faq .qa{padding:1.3rem 0;border-bottom:1px solid var(--rule-d);}
.sec.light .faq .qa{border-bottom-color:var(--rule-l);}
.faq .qa .q{font-family:var(--exp);font-weight:700;font-size:1.06rem;color:var(--snow);margin-bottom:.5rem;}
.sec.light .faq .qa .q{color:var(--ink);}
.faq .qa .a{color:var(--snow-soft);font-size:.96rem;line-height:1.6;max-width:84ch;}
.sec.light .faq .qa .a{color:var(--ink-soft);}

/* 3-step ladder */
.ladder.three{grid-template-columns:repeat(3,1fr);}
@media (max-width:760px){.fit{grid-template-columns:1fr;} .ladder.three{grid-template-columns:1fr;}}

/* contact */
.contact{background:var(--deep);border-top:1px solid var(--rule-d);text-align:center;overflow:hidden;position:relative;}
.contact .glow{position:absolute;inset:0;background:radial-gradient(60% 60% at 50% 0%,rgba(0,184,148,.13),transparent 70%);pointer-events:none;}
.contact .wrap{position:relative;z-index:1;}
.contact h2{font-family:var(--exp);font-weight:900;font-size:clamp(2.2rem,1.4rem + 4vw,4rem);letter-spacing:-.03em;}
.contact .lead{margin:1.4rem auto 2.2rem;text-align:center;}
.contact .ctas{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;}
.contact .note{font-family:var(--mono);font-size:.8rem;color:var(--snow-soft);margin-top:2rem;}

/* footer */
footer.site{background:var(--deep-2);border-top:1px solid var(--rule-d);padding:3.4rem 0 2.4rem;}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2rem;align-items:flex-start;}
.foot .brand{font-size:1.1rem;}
.foot .tl{font-family:var(--mono);font-size:.8rem;color:var(--snow-soft);margin-top:.6rem;}
.foot nav{display:flex;gap:1.5rem;flex-wrap:wrap;}
.foot nav a{font-size:.9rem;color:var(--snow-soft);transition:color .2s;}
.foot nav a:hover{color:var(--snow);}
footer.site .reg{width:100%;border-top:1px solid var(--rule-d);margin-top:1rem;padding-top:1.4rem;font-family:var(--mono);font-size:.74rem;color:var(--snow-soft);display:flex;justify-content:space-between;flex-wrap:wrap;gap:.6rem;}
.ribbon{position:fixed;right:0;top:50%;transform:translateY(-50%) rotate(180deg);writing-mode:vertical-rl;z-index:40;font-family:var(--mono);font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--deep);background:var(--teal);padding:.7em .4em;}

/* reveal */
html.js [data-reveal]{opacity:0;transform:translateY(20px);}
html.js [data-reveal].is-in{opacity:1;transform:none;transition:opacity .8s var(--e-out),transform .8s var(--e-out);}

/* responsive */
@media (max-width:960px){
  .nav-links{display:none;} .menu-btn{display:inline-block;}
  /* real mobile nav: menu button toggles a full-width dropdown panel */
  header.site.nav-open{background:var(--deep);border-bottom-color:var(--rule-d);}
  header.site.nav-open .brand,header.site.nav-open .brand .mark{color:var(--snow);}
  header.site.nav-open .menu-btn{color:var(--snow);border-color:var(--rule-d);}
  header.site.nav-open .nav-links{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--deep);border-top:1px solid var(--rule-d);box-shadow:0 26px 44px -26px rgba(0,0,0,.7);padding:.3rem clamp(20px,5vw,48px) 1.2rem;}
  header.site.nav-open .nav-links a.lnk{padding:.95rem 0;border-bottom:1px solid var(--rule-d);color:var(--snow);font-size:1rem;}
  header.site.nav-open .nav-links a.lnk::after{display:none;}
  header.site.nav-open .nav-links .btn{margin-top:1rem;justify-content:center;}
  .proof .grid{grid-template-columns:repeat(2,1fr);}
  .stat:nth-child(3){border-left:0;} .stat:nth-child(n+3){border-top:1px solid var(--rule-d);}
  .diptych{grid-template-columns:1fr;} .arm{border-left:0;border-top:1px solid var(--rule-d);} .arm:first-child{border-top:0;}
  .caps,.flows,.demos{grid-template-columns:1fr;} .feature{grid-template-columns:1fr;}
  .fail{grid-template-columns:1fr;} .ladder{grid-template-columns:1fr 1fr;}
  .seclist{grid-template-columns:1fr;}
  .founders{grid-template-columns:1fr;}
  .founders.two{grid-template-columns:1fr;}
  .quotes{grid-template-columns:1fr;}
  .case{grid-template-columns:1fr;gap:1.2rem;}
}
@media (max-width:560px){
  .proof .grid{grid-template-columns:1fr;} .stat{border-left:0;border-top:1px solid var(--rule-d);} .stat:first-child{border-top:0;}
  .ladder{grid-template-columns:1fr;} .ribbon{display:none;} .path{min-width:0;}
  .hero h1{font-size:1.95rem;letter-spacing:-.025em;line-height:1.08;}
  .eyebrow{font-size:.62rem;letter-spacing:.14em;flex-wrap:wrap;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  html.js [data-reveal]{opacity:1!important;transform:none!important;transition:none!important;}
  .scrollcue .ln{animation:none;}
  .btn,.path,.arm,.more .arw{transition:none!important;}
}

/* ============================================================
   v2 DESIGN UPGRADE — lighter, richer, less templated
   (lightened impression, aurora light bands, soft elevation,
    differentiated workflow cards, working pop-ups, polish)
   ============================================================ */

/* custom scroll rail - right side dot indicator, replaces native scrollbar */
html:not(.dash-root){scrollbar-width:none;}
html:not(.dash-root)::-webkit-scrollbar{display:none;}
.sc-rail{position:fixed;right:10px;top:0;bottom:0;width:1px;background:rgba(255,255,255,.12);z-index:9999;pointer-events:none;}
.sc-dot{position:absolute;left:50%;transform:translate(-50%,-50%);width:8px;height:8px;border-radius:50%;background:#3ff0cf;box-shadow:0 0 8px rgba(63,240,207,.65);top:0;}

/* richer light sections: airy, soft teal aurora, gentle depth */
.sec.light{background:var(--paper);position:relative;overflow:hidden;}
.sec.light::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(48% 60% at 8% -6%, rgba(0,184,148,.10), transparent 60%),
             radial-gradient(46% 56% at 104% 8%, rgba(0,134,106,.09), transparent 62%);}
.sec.light > .wrap{position:relative;z-index:1;}
/* a brighter "cloud" variant for hero-adjacent light bands */
.sec.cloud{background:var(--cloud);color:var(--ink);border-top:1px solid var(--rule-l);position:relative;overflow:hidden;}
.sec.cloud::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(40% 52% at 92% -8%, rgba(0,184,148,.12), transparent 60%),
             radial-gradient(52% 48% at -6% 106%, rgba(0,134,106,.08), transparent 64%);}
.sec.cloud > .wrap{position:relative;z-index:1;}
.sec.cloud .muted{color:var(--ink-soft);}
.sec.cloud h2,.sec.cloud h3{color:var(--ink);}
.sec.cloud .eyebrow{color:var(--teal-deep);}
.sec.cloud .eyebrow::before{background:var(--teal-deep);}

/* gradient accent on headline emphasis (replaces flat teal where used) */
.gx{background:linear-gradient(100deg,var(--teal-deep),var(--teal) 55%,#19c9a6);-webkit-background-clip:text;background-clip:text;color:transparent;}

/* soft elevation utility for light cards (lifts out of flat-hairline "AI template" look) */
.sec.light .flow,.sec.cloud .flow{box-shadow:0 1px 0 rgba(14,26,36,.04);}
/* price/cap cards on light */
.sec.light .caps,.sec.cloud .caps,.band-tint .caps{background:var(--rule-l);border-color:var(--rule-l);}
.sec.light .cap,.sec.cloud .cap,.band-tint .cap{background:var(--cloud);}
.sec.light .cap .h,.sec.cloud .cap .h,.band-tint .cap .h{color:var(--ink);}
.sec.light .cap .pf,.sec.cloud .cap .pf,.band-tint .cap .pf{color:var(--teal-deep);}
.sec.light .cap p,.sec.cloud .cap p,.band-tint .cap p{color:var(--ink-soft);}

/* --- aurora light hero for inner pages (replaces flat grey) --- */
.phero.light{background:var(--cloud);}
.phero.light::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(38% 70% at 88% -10%, rgba(0,184,148,.16), transparent 58%),
             radial-gradient(46% 80% at -4% 120%, rgba(0,134,106,.12), transparent 60%);
  animation:auroraDrift 14s var(--e-out) infinite alternate;}
.phero.light .wrap{position:relative;z-index:1;}
@keyframes auroraDrift{0%{transform:translate3d(0,0,0) scale(1);opacity:.9}100%{transform:translate3d(-2.5%,1.5%,0) scale(1.08);opacity:1}}
@media (prefers-reduced-motion:reduce){.phero.light::after{animation:none;}}

/* thin signal rule that draws itself in under a hero headline */
.sigrule{position:relative;height:2px;width:0;max-width:340px;margin:1.6rem 0 .4rem;
  background:linear-gradient(90deg,var(--teal),var(--teal-soft),transparent);box-shadow:0 0 14px rgba(0,184,148,.5);}
.phero.light .sigrule{background:linear-gradient(90deg,var(--teal-deep),var(--teal),transparent);box-shadow:none;}
html.js .sigrule{animation:drawRule 1.1s var(--e-out) .3s forwards;}
@keyframes drawRule{to{width:min(340px,72%);}}

/* ---- buttons: subtle sheen on the primary CTA ---- */
.btn{position:relative;overflow:hidden;}
.btn:not(.ghost)::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.35),transparent);transform:skewX(-18deg);transition:left .6s var(--e-out);}
.btn:not(.ghost):hover::after{left:140%;}

/* ============================================================
   DIFFERENTIATED WORKFLOW CARDS (RE + SME)
   distinct icon + accent per card, depth, click affordance
   ============================================================ */
.demos{gap:clamp(14px,1.6vw,20px);background:transparent;border:0;}
.demo-card{border:1px solid var(--rule-d);background:var(--deep-2);padding:clamp(1.6rem,3vw,2.1rem);
  --ac:var(--teal);position:relative;overflow:hidden;border-radius:2px;
  transition:transform .35s var(--e-out),box-shadow .35s var(--e-out),border-color .35s;}
.sec.light .demo-card,.sec.cloud .demo-card{background:var(--cloud);border-color:var(--rule-l);box-shadow:0 1px 2px rgba(14,26,36,.04);}
.demo-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--ac);transform:scaleX(.0);transform-origin:left;transition:transform .4s var(--e-out);}
.demo-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--ac) 55%,transparent);box-shadow:0 22px 44px -26px rgba(0,0,0,.5);background:var(--deep-3);}
.sec.light .demo-card:hover,.sec.cloud .demo-card:hover{box-shadow:0 26px 50px -30px rgba(14,26,36,.45);background:var(--cloud);}
.demo-card:hover::before{transform:scaleX(1);}
.demo-card .wfic{width:46px;height:46px;display:flex;align-items:center;justify-content:center;flex:none;margin-bottom:1rem;
  border:1px solid color-mix(in srgb,var(--ac) 42%,transparent);background:color-mix(in srgb,var(--ac) 12%,transparent);color:var(--ac);border-radius:3px;
  transition:transform .35s var(--e-out);}
.demo-card:hover .wfic{transform:scale(1.06) rotate(-3deg);}
.demo-card .wfic svg{width:22px;height:22px;}
.demo-card .tagm{color:var(--ac);}
.sec.light .demo-card .tagm,.sec.cloud .demo-card .tagm{color:color-mix(in srgb,var(--ac) 78%,#0d1b24);}
/* per-card accents (single-accent family — teal through-line + restrained cool/warm siblings) */
.demo-card.a-teal{--ac:#00b894;} .demo-card.a-deep{--ac:#0e9c9c;} .demo-card.a-slate{--ac:#4f86c6;}
.demo-card.a-gold{--ac:#c79a3e;} .demo-card.a-violet{--ac:#7b76d6;} .demo-card.a-grass{--ac:#3fae74;}
.demo-card .open{cursor:pointer;}
/* drop the old flat mini-bars in favour of icons; keep if present but tidy */
.demo-card .mini{height:26px;opacity:.55;}

/* ============================================================
   MODAL / POP-UP — the "make the cards work" fix
   ============================================================ */
.modal{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:clamp(16px,4vw,40px);
  opacity:0;visibility:hidden;transition:opacity .3s var(--e-out),visibility .3s;}
.modal.open{opacity:1;visibility:visible;}
.modal .scrim{position:absolute;inset:0;background:rgba(7,13,18,.72);backdrop-filter:blur(6px);}
.modal .card{position:relative;width:min(680px,100%);max-height:88vh;overflow:auto;background:var(--cloud);color:var(--ink);
  border:1px solid var(--rule-l);border-radius:4px;box-shadow:0 50px 120px -40px rgba(0,0,0,.7);
  transform:translateY(18px) scale(.98);opacity:0;transition:transform .4s var(--e-out),opacity .4s var(--e-out);}
.modal.open .card{transform:none;opacity:1;}
.modal .card .top{position:relative;padding:clamp(1.6rem,3vw,2.2rem) clamp(1.6rem,3vw,2.4rem) 1.3rem;
  border-bottom:1px solid var(--rule-l);overflow:hidden;--ac:var(--teal);}
.modal .card .top::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 120% at 100% -20%,color-mix(in srgb,var(--ac) 16%,transparent),transparent 60%);pointer-events:none;}
.modal .mhead{display:flex;align-items:center;gap:1rem;position:relative;}
.modal .mhead .wfic{width:50px;height:50px;border:1px solid color-mix(in srgb,var(--ac) 42%,transparent);background:color-mix(in srgb,var(--ac) 12%,transparent);color:var(--ac);display:flex;align-items:center;justify-content:center;border-radius:3px;flex:none;}
.modal .mhead .wfic svg{width:24px;height:24px;}
.modal .mtag{font-family:var(--mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:color-mix(in srgb,var(--ac) 78%,#0d1b24);}
.modal .mhead h3{font-family:var(--exp);font-weight:800;font-size:clamp(1.3rem,1rem + 1vw,1.7rem);color:var(--ink);margin-top:.25rem;letter-spacing:-.02em;}
.modal .mbody{padding:clamp(1.4rem,3vw,2rem) clamp(1.6rem,3vw,2.4rem) clamp(1.6rem,3vw,2.2rem);}
.modal .mlede{font-size:1.06rem;line-height:1.6;color:var(--ink);margin-bottom:1.4rem;}
.modal .mxf{display:grid;grid-template-columns:1fr 38px 1fr;gap:.6rem;align-items:stretch;margin-bottom:1.5rem;}
.modal .mxf .col{border:1px solid var(--rule-l);background:var(--paper);padding:1rem 1.05rem;border-radius:3px;}
.modal .mxf .col .k{font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;margin-bottom:.6rem;}
.modal .mxf .col.before .k{color:var(--ink-soft);} .modal .mxf .col.after .k{color:var(--teal-deep);}
.modal .mxf .col.after{border-color:color-mix(in srgb,var(--teal) 40%,transparent);background:rgba(0,184,148,.05);}
.modal .mxf ul{list-style:none;display:flex;flex-direction:column;gap:.5rem;}
.modal .mxf li{font-size:.9rem;line-height:1.4;color:var(--ink);display:flex;gap:.5rem;}
.modal .mxf .before li{color:var(--ink-soft);}
.modal .mxf li .d{flex:none;color:var(--teal-deep);font-weight:700;}
.modal .mxf .arr{display:flex;align-items:center;justify-content:center;color:var(--teal);font-size:1.3rem;}
.modal .mmetrics{display:flex;flex-wrap:wrap;gap:1.4rem 2.2rem;padding:1.1rem 0 1.4rem;border-top:1px solid var(--rule-l);margin-bottom:1.4rem;}
.modal .mmetrics .m .mn{font-family:var(--exp);font-weight:800;font-size:1.6rem;color:var(--teal-deep);line-height:1;}
.modal .mmetrics .m .ml{font-family:var(--mono);font-size:.7rem;color:var(--ink-soft);margin-top:.35rem;}
.modal .macts{display:flex;flex-wrap:wrap;gap:.8rem;}
.modal .close{position:absolute;top:14px;right:14px;z-index:3;width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  background:var(--cloud);border:1px solid var(--rule-l);color:var(--ink);cursor:pointer;border-radius:3px;font-size:1.1rem;line-height:1;transition:background .2s,border-color .2s;}
.modal .close:hover{border-color:var(--teal);background:var(--paper);}
@media (max-width:560px){.modal .mxf{grid-template-columns:1fr;}.modal .mxf .arr{transform:rotate(90deg);height:24px;}}

/* ============================================================
   DEMO MODAL — chrome-less frame, the LIVE tool fills it edge to edge.
   No header, no border, no internal scrollbar. The dash page inside
   provides its own heading + styles its own slim scrollbar.
   ============================================================ */
.modal-demo .card.demo-card-modal{position:relative;width:min(1240px,96vw);max-width:none;height:min(900px,94vh);max-height:none;
  display:block;overflow:hidden;padding:0;border:0;border-radius:14px;background:var(--deep);--ac:var(--teal);
  box-shadow:0 60px 140px -40px rgba(0,0,0,.78),0 0 0 1px rgba(0,0,0,.4);
  transform:translateY(18px) scale(.985);opacity:0;transition:transform .42s var(--e-out),opacity .42s var(--e-out);}
.modal-demo.open .card.demo-card-modal{transform:none;opacity:1;}
.modal-demo .dbody{position:absolute;inset:0;overflow:hidden;background:var(--deep);}
.modal-demo .dframe{display:block;width:100%;height:100%;border:0;background:var(--cloud);}

/* floating controls overlaid top-right, on a subtle dark backdrop so they
   stay visible over any tool */
.modal-demo .dfloat{position:absolute;top:14px;right:14px;z-index:4;display:flex;align-items:center;gap:.5rem;}
.modal-demo .dfull{font-family:var(--sans);font-weight:600;font-size:.74rem;letter-spacing:.02em;
  color:#fff;display:inline-flex;align-items:center;gap:.4em;padding:.5em .85em;border-radius:999px;
  background:rgba(14,26,36,.66);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(8px);
  transition:background .2s,border-color .2s,transform .2s var(--e-out);}
.modal-demo .dfull:hover{background:rgba(0,134,106,.85);border-color:color-mix(in srgb,var(--teal) 60%,transparent);transform:translateY(-1px);}
.modal-demo .dfull .arw{font-size:1.05em;}
.modal-demo .dclose{width:38px;height:38px;display:flex;align-items:center;justify-content:center;
  background:rgba(14,26,36,.66);border:1px solid rgba(255,255,255,.16);color:#fff;cursor:pointer;border-radius:999px;
  font-size:1.25rem;line-height:1;backdrop-filter:blur(8px);transition:background .2s,border-color .2s,transform .2s var(--e-out);}
.modal-demo .dclose:hover{background:rgba(0,134,106,.85);border-color:color-mix(in srgb,var(--teal) 60%,transparent);transform:translateY(-1px);}
.modal-demo .dclose:focus-visible,.modal-demo .dfull:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}
@media (max-width:680px){
  .modal-demo .card.demo-card-modal{width:96vw;height:94vh;border-radius:10px;}
  .modal-demo .dfull{display:none;}
}

/* ============================================================
   BOOKING MODAL — "Book a free consultation"
   ============================================================ */
.modal-book .card.book-card{width:min(720px,100%);max-height:min(680px,92vh);overflow-y:auto;overflow-x:hidden;border-radius:10px;--ac:var(--teal);
  scrollbar-width:thin;scrollbar-color:var(--teal) rgba(14,26,36,.08);overscroll-behavior:contain;}
/* slim, branded scrollbar — no OS grey anywhere */
.modal-book .card.book-card::-webkit-scrollbar{width:8px;}
.modal-book .card.book-card::-webkit-scrollbar-track{background:rgba(14,26,36,.06);border-radius:999px;margin:6px 0;}
.modal-book .card.book-card::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--teal) 78%,var(--deep));border-radius:999px;border:2px solid transparent;background-clip:padding-box;}
.modal-book .card.book-card::-webkit-scrollbar-thumb:hover{background:var(--teal-deep);background-clip:padding-box;border:2px solid transparent;}

.modal-book .book-top{--ac:var(--teal);}
.modal-book .book-top .mtag{font-family:var(--mono);color:var(--teal-deep);}
.modal-book .bwfic{width:50px;height:50px;border:1px solid color-mix(in srgb,var(--teal) 42%,transparent);background:color-mix(in srgb,var(--teal) 12%,transparent);color:var(--teal-deep);display:flex;align-items:center;justify-content:center;border-radius:6px;flex:none;}
.modal-book .bwfic svg{width:24px;height:24px;}
.modal-book .book-sub{margin-top:.9rem;font-family:var(--sans);font-size:1rem;line-height:1.5;color:var(--ink-soft);max-width:46ch;}
.modal-book .book-body{padding-top:1.2rem;}

/* segmented chooser — Archivo labels, not mono */
.modal-book .bseg{display:flex;gap:.3rem;padding:.32rem;background:var(--off);border:1px solid var(--rule-l);border-radius:8px;margin-bottom:1.5rem;}
.modal-book .bseg-tab{flex:1 1 0;font-family:var(--sans);font-weight:600;font-size:.86rem;letter-spacing:-.005em;
  padding:.66em .5em;background:transparent;border:0;border-radius:6px;color:var(--ink-soft);cursor:pointer;
  transition:background .25s var(--e-out),color .2s,box-shadow .2s;white-space:nowrap;}
.modal-book .bseg-tab:hover{color:var(--ink);}
.modal-book .bseg-tab.is-on{background:var(--cloud);color:var(--teal-deep);box-shadow:0 1px 3px rgba(14,26,36,.12),0 0 0 1px rgba(14,26,36,.04);}
.modal-book .bpane[hidden]{display:none;}
.modal-book .bpane{animation:bfade .35s var(--e-out);}
@keyframes bfade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}

/* scheduler (Calendly placeholder) */
.modal-book .sched{display:grid;grid-template-columns:1.4fr 1fr;gap:1.1rem;align-items:stretch;}
.modal-book .sched-cal{border:1px solid var(--rule-l);border-radius:8px;padding:1.1rem;background:var(--cloud);box-shadow:0 1px 2px rgba(14,26,36,.04);}
.modal-book .cal-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:.9rem;}
.modal-book .cal-month{font-family:var(--exp);font-weight:800;font-size:1.02rem;color:var(--ink);letter-spacing:-.01em;}
/* GMT label = data, stays mono */
.modal-book .cal-tz{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);}
.modal-book .cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
.modal-book .cal-dow{margin-bottom:.5rem;}
.modal-book .cdow{font-family:var(--sans);font-weight:600;font-size:.64rem;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);text-align:center;padding:.2rem 0;}
/* day numbers = data, stay mono */
.modal-book .cday{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:.8rem;color:var(--ink);border-radius:6px;border:1px solid transparent;}
.modal-book .cday.empty{visibility:hidden;}
.modal-book .cday.past{color:color-mix(in srgb,var(--ink-soft) 50%,transparent);}
.modal-book .cday.avail{cursor:pointer;font-weight:500;color:var(--teal-deep);border-color:color-mix(in srgb,var(--teal) 28%,transparent);background:rgba(0,184,148,.06);transition:background .18s,border-color .18s,transform .18s var(--e-out),box-shadow .18s;}
.modal-book .cday.avail:hover{background:rgba(0,184,148,.14);border-color:color-mix(in srgb,var(--teal) 50%,transparent);transform:translateY(-1px);box-shadow:0 4px 10px -6px rgba(0,134,106,.5);}
.modal-book .cday.avail:focus-visible{outline:2px solid var(--teal);outline-offset:2px;}
.modal-book .cday.is-sel{background:var(--teal);color:#fff;border-color:var(--teal);font-weight:600;box-shadow:0 6px 14px -6px rgba(0,134,106,.6);}
.modal-book .cday .cdot{position:absolute;bottom:5px;left:50%;transform:translateX(-50%);width:4px;height:4px;border-radius:50%;background:var(--teal);}
.modal-book .cday.is-sel .cdot{background:#fff;}
.modal-book .cal-key{margin-top:.9rem;display:flex;align-items:center;gap:.45em;font-family:var(--sans);font-weight:500;font-size:.7rem;color:var(--ink-soft);}
.modal-book .cal-key .cdot{position:static;transform:none;display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--teal);}
.modal-book .sched-slots{display:flex;flex-direction:column;}
.modal-book .slots-head{font-family:var(--sans);font-weight:700;font-size:.84rem;letter-spacing:-.005em;color:var(--ink);margin-bottom:.75rem;}
.modal-book .slots-list{display:flex;flex-direction:column;gap:.55rem;}
/* times = data, stay mono */
.modal-book .cslot{display:flex;align-items:center;justify-content:space-between;gap:.5em;font-family:var(--mono);font-size:.9rem;font-weight:500;color:var(--ink);
  padding:.72em .95em;background:var(--cloud);border:1px solid var(--rule-l);border-radius:7px;cursor:pointer;
  transition:border-color .18s,background .18s,transform .18s var(--e-out),box-shadow .18s;}
.modal-book .cslot:hover{border-color:color-mix(in srgb,var(--teal) 55%,transparent);background:rgba(0,184,148,.05);transform:translateY(-1px);box-shadow:0 6px 14px -10px rgba(0,134,106,.55);}
.modal-book .cslot.is-sel{border-color:var(--teal);background:var(--teal);color:#fff;box-shadow:0 8px 18px -10px rgba(0,134,106,.65);}
.modal-book .cslot-ampm{font-size:.66rem;letter-spacing:.06em;color:var(--ink-soft);}
.modal-book .cslot.is-sel .cslot-ampm{color:rgba(255,255,255,.82);}
.modal-book .sched-note{margin-top:.95rem;padding:.75rem .9rem;font-family:var(--sans);font-size:.84rem;line-height:1.45;color:var(--ink);
  border:1px solid color-mix(in srgb,var(--teal) 38%,transparent);background:rgba(0,184,148,.07);border-radius:7px;}
.modal-book .sched-note strong{font-family:var(--mono);font-weight:600;color:var(--teal-deep);}
.modal-book .sched-foot{margin-top:auto;padding-top:.95rem;font-family:var(--sans);font-weight:500;font-size:.72rem;color:var(--ink-soft);}

/* details form — Archivo labels, not mono */
.modal-book .bform{display:flex;flex-direction:column;gap:.95rem;}
.modal-book .bform .brow{display:grid;grid-template-columns:1fr 1fr;gap:.9rem;}
.modal-book .bform label{display:flex;flex-direction:column;gap:.4rem;font-family:var(--sans);font-weight:600;font-size:.78rem;letter-spacing:-.005em;color:var(--ink);}
.modal-book .bform input,.modal-book .bform textarea{font-family:var(--sans);font-weight:400;font-size:.95rem;color:var(--ink);background:var(--cloud);
  border:1px solid var(--rule-l);border-radius:7px;padding:.72em .85em;transition:border-color .18s,box-shadow .18s;}
.modal-book .bform input::placeholder,.modal-book .bform textarea::placeholder{color:color-mix(in srgb,var(--ink-soft) 75%,transparent);}
.modal-book .bform input:focus,.modal-book .bform textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 3px rgba(0,184,148,.14);}
.modal-book .bform textarea{resize:vertical;min-height:78px;line-height:1.45;}
.modal-book .book-send{align-self:flex-start;margin-top:.3rem;--bg:var(--teal);--fg:var(--cloud);
  display:inline-flex;align-items:center;gap:.6em;font-family:var(--sans);font-weight:700;font-size:.95rem;padding:.85em 1.5em;background:var(--teal);color:#fff;border:1px solid var(--teal);border-radius:7px;cursor:pointer;transition:background .2s,transform .2s var(--e-out),box-shadow .2s;}
.modal-book .book-send:hover{background:var(--teal-deep);transform:translateY(-1px);box-shadow:0 10px 22px -12px rgba(0,134,106,.7);}
.modal-book .book-send .arw{transition:transform .3s var(--e-out);}
.modal-book .book-send:hover .arw{transform:translateX(3px);}
.modal-book .bform-done{font-family:var(--sans);font-size:.88rem;color:var(--teal-deep);font-weight:600;padding:.65rem .85rem;border:1px solid color-mix(in srgb,var(--teal) 38%,transparent);background:rgba(0,184,148,.07);border-radius:7px;}
.modal-book .bform-fine{font-family:var(--sans);font-size:.78rem;line-height:1.45;color:var(--ink-soft);}

/* email directly */
.modal-book .bdirect{text-align:center;padding:1.4rem 0 .6rem;}
.modal-book .bdirect-lede{font-family:var(--sans);font-size:1rem;line-height:1.55;color:var(--ink);max-width:42ch;margin:0 auto 1.2rem;}
/* email address = data, stays mono */
.modal-book .bdirect-addr{font-family:var(--mono);font-size:1.05rem;color:var(--teal-deep);letter-spacing:.01em;margin-bottom:1.3rem;
  padding:.85rem;border:1px solid color-mix(in srgb,var(--teal) 22%,transparent);border-radius:7px;background:rgba(0,184,148,.05);}
.modal-book .book-mailto{--bg:var(--teal);--fg:var(--cloud);font-family:var(--sans);font-weight:700;background:var(--teal);color:#fff;border-color:var(--teal);border-radius:7px;}
.modal-book .book-mailto:hover{background:var(--teal-deep);border-color:var(--teal-deep);}

.modal-book .book-foot{margin-top:1.6rem;padding-top:1.2rem;border-top:1px solid var(--rule-l);
  font-family:var(--sans);font-weight:500;font-size:.76rem;letter-spacing:-.005em;color:var(--ink-soft);text-align:center;}

@media (max-width:560px){
  .modal-book .sched{grid-template-columns:1fr;}
  .modal-book .bform .brow{grid-template-columns:1fr;}
  .modal-book .bseg-tab{font-size:.64rem;letter-spacing:.02em;}
}
@media (prefers-reduced-motion:reduce){
  .modal-book .bpane{animation:none;}
  .modal-demo .card.demo-card-modal{transition:opacity .2s;}
}

/* ---- card tilt (JS adds --rx/--ry) ---- */
.tilt{transform:perspective(900px) rotateX(var(--rx,0)) rotateY(var(--ry,0)) translateY(var(--ty,0));transition:transform .25s var(--e-out);}

/* SME USP block — "why not just get Claude yourself" */
.usp{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(1.6rem,4vw,3.4rem);align-items:center;margin-top:clamp(2rem,4vw,3rem);}
.usp .claim{border-left:3px solid var(--teal);padding:.2rem 0 .2rem 1.3rem;}
.usp .claim .q{font-family:var(--exp);font-weight:700;font-size:clamp(1.2rem,1rem + 1vw,1.7rem);line-height:1.3;letter-spacing:-.01em;color:var(--ink);}
.usp .claim .who{font-family:var(--mono);font-size:.74rem;color:var(--ink-soft);margin-top:.9rem;}
.usp .steps{display:flex;flex-direction:column;gap:.75rem;}
.usp .step{display:flex;gap:1rem;align-items:flex-start;background:var(--cloud);border:1px solid var(--rule-l);padding:1.05rem 1.2rem;border-radius:3px;box-shadow:0 1px 2px rgba(14,26,36,.04);transition:transform .3s var(--e-out),box-shadow .3s;}
.usp .step:hover{transform:translateX(4px);box-shadow:0 16px 32px -22px rgba(14,26,36,.4);}
.usp .step .no{font-family:var(--mono);font-size:.78rem;font-weight:600;color:var(--teal-deep);border:1px solid var(--teal-deep);width:30px;height:30px;display:flex;align-items:center;justify-content:center;flex:none;border-radius:2px;}
.usp .step .tx b{font-family:var(--sans);font-weight:700;color:var(--ink);display:block;font-size:1.02rem;}
.usp .step .tx span{color:var(--ink-soft);font-size:.92rem;line-height:1.5;}
@media (max-width:760px){.usp{grid-template-columns:1fr;}}

/* security commitments on light */
.sec.light .seclist,.sec.cloud .seclist{background:var(--rule-l);border-color:var(--rule-l);}
.sec.light .secitem,.sec.cloud .secitem{background:var(--cloud);}
.sec.light .secitem .hd h3,.sec.cloud .secitem .hd h3{color:var(--ink);}
.sec.light .secitem p,.sec.cloud .secitem p{color:var(--ink-soft);}
.sec.light .secitem .hd .ic,.sec.cloud .secitem .hd .ic{border-color:var(--teal-deep);color:var(--teal-deep);}
.sec.light .secitem .st,.sec.cloud .secitem .st{border-color:var(--rule-l);color:var(--ink-soft);}
.sec.light .secitem .st.live,.sec.cloud .secitem .st.live{color:var(--teal-deep);border-color:var(--teal-deep);}
.sec.light .secitem .st.prog,.sec.cloud .secitem .st.prog{color:#9a7a26;border-color:#c5a046;}

/* compliance status pill — confident + plain */
.complior{display:flex;flex-wrap:wrap;gap:1rem;margin-top:clamp(1.6rem,4vw,2.4rem);}
.complior .pill{display:flex;align-items:center;gap:.7rem;border:1px solid var(--rule-d);padding:.7rem 1.1rem;border-radius:3px;font-size:.95rem;color:var(--snow);}
.sec.light .complior .pill,.sec.cloud .complior .pill,.phero.light .complior .pill{border-color:var(--rule-l);color:var(--ink);background:var(--cloud);}
.complior .pill .dt{width:9px;height:9px;border-radius:50%;flex:none;background:var(--teal);box-shadow:0 0 0 4px rgba(0,184,148,.18);}
.complior .pill.prog .dt{background:var(--warn);box-shadow:0 0 0 4px rgba(197,160,70,.18);}

/* logostrip on light */
.logostrip.onlight{background:var(--cloud);}
.logostrip.onlight img{filter:brightness(0);opacity:.45;}
.logostrip.onlight .lbl{color:var(--ink-soft);}

/* proof strip — allow a light institutional variant */
.proof.onlight{background:var(--cloud);border-color:var(--rule-l);}
.proof.onlight .stat{border-color:var(--rule-l);}
.proof.onlight .stat .n{color:var(--ink);}
.proof.onlight .stat .l{color:var(--ink-soft);}

/* noise->signal console embedded in a light section (dark device on a clean page) */
.sec.light.n2s .n2s-foot{color:var(--ink-soft);}
.sec.light.n2s .n2s-foot b{color:var(--teal-deep);}
.sec.light.n2s .n2s-stage{box-shadow:0 30px 70px -40px rgba(14,26,36,.5);border-color:var(--rule-l);}

/* ============================================================
   v3 SHARED COMPONENTS — reusable across RE / SME / Security /
   Story so the whole site is consistent and high-craft.
   (Throxy-grade: scrolling customers, timeline, unified
    hover-open callouts, contrast bands.) Work on light + dark.
   ============================================================ */

/* ---- CONTRAST BANDS: break up big white/dark blocks ---- */
.band-accent{background:linear-gradient(110deg,var(--deep) 0%,#10242b 60%,var(--deep-2) 100%);color:var(--snow);border-top:1px solid var(--rule-d);border-bottom:1px solid var(--rule-d);position:relative;overflow:hidden;}
.band-accent::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 120% at 12% 0%,rgba(0,184,148,.14),transparent 60%);pointer-events:none;}
.band-accent .wrap{position:relative;z-index:1;}
.band-tint{background:linear-gradient(180deg,var(--cloud),var(--paper));position:relative;color:var(--ink);}
/* band-tint is a LIGHT band: enforce the dark-on-light contract (mirrors .sec.light) so
   shared headings/eyebrows/copy never inherit the body's light text on this pale background */
.band-tint h2,.band-tint h3,.band-tint h4{color:var(--ink);}
.band-tint .muted{color:var(--ink-soft);}
.band-tint .eyebrow{color:var(--teal-deep);}
.band-tint .eyebrow::before{background:var(--teal-deep);}
.band-tint .lead{color:var(--ink);}

/* ---- SCROLLING CUSTOMER STRIP (Throxy-style, hover -> review+stat) ----
   Markup: <div class="cust"><div class="cust-track"> N x .cust-item, DUPLICATED
   once more for a seamless loop. Each item: <a class="cust-item" href=URL>
   <img...> <span class="cust-card"><span class="stat">..</span>
   <span class="q">..</span><span class="who">..</span></span></a>           */
.cust{position:relative;overflow:hidden;padding:clamp(1.6rem,3.5vw,2.6rem) 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.cust-track{display:flex;gap:clamp(2.6rem,5vw,4.6rem);width:max-content;align-items:center;animation:custScroll 44s linear infinite;}
.cust:hover .cust-track{animation-play-state:paused;}
@keyframes custScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.cust-item{position:relative;flex:none;display:flex;align-items:center;justify-content:center;min-width:120px;}
.cust-item img{max-height:32px;max-width:150px;width:auto;object-fit:contain;opacity:.55;transition:opacity .3s var(--e-out),transform .3s var(--e-out);filter:brightness(0) invert(1);}
.sec.light .cust-item img,.band-tint .cust-item img{filter:brightness(0);opacity:.5;}
.cust-item:hover img{opacity:1;transform:translateY(-2px);}
.cust-card{position:absolute;bottom:calc(100% + 14px);left:50%;transform:translateX(-50%) translateY(6px);width:min(300px,80vw);
  background:var(--cloud);color:var(--ink);border:1px solid var(--rule-l);border-radius:4px;padding:1.1rem 1.2rem;
  box-shadow:0 30px 60px -28px rgba(0,0,0,.55);opacity:0;visibility:hidden;transition:opacity .28s var(--e-out),transform .28s var(--e-out),visibility .28s;z-index:6;text-align:left;pointer-events:none;}
.cust-card::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:7px solid transparent;border-top-color:var(--cloud);}
.cust-item:hover .cust-card{opacity:1;visibility:visible;transform:translateX(-50%);}
.cust-card .stat{display:block;font-family:var(--exp);font-weight:800;font-size:1.05rem;color:var(--teal-deep);letter-spacing:-.01em;line-height:1.2;}
.cust-card .q{display:block;margin-top:.55rem;font-size:.92rem;line-height:1.5;color:var(--ink);}
.cust-card .who{display:block;margin-top:.6rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);}
.cust-lbl{display:block;text-align:center;font-family:var(--mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--snow-soft);margin-bottom:1.6rem;}
.sec.light .cust-lbl,.band-tint .cust-lbl{color:var(--ink-soft);}
@media (prefers-reduced-motion:reduce){.cust-track{animation:none;flex-wrap:wrap;justify-content:center;}}

/* ---- COMPACT HORIZONTAL TIMELINE (Throxy spine) ----
   <div class="tline" style="--n:3"> N x <div class="tstep"><span class="tdot">
   <i>1</i></span><span class="twhen">..</span><h4>..</h4><p>..</p></div>          */
.tline{position:relative;display:grid;grid-template-columns:repeat(var(--n,3),1fr);gap:clamp(1.4rem,3vw,2.6rem);margin-top:clamp(2.2rem,4vw,3.2rem);}
.tline::before{content:"";position:absolute;top:19px;left:6%;right:6%;height:2px;background:linear-gradient(90deg,var(--teal-deep),var(--teal),transparent);opacity:.45;}
.tstep{position:relative;}
.tstep .tdot{position:relative;z-index:1;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:600;font-size:.85rem;
  color:var(--teal-deep);background:var(--cloud);border:1.5px solid var(--teal-deep);box-shadow:0 0 0 6px var(--paper);}
.sec:not(.light) .tstep .tdot{color:var(--teal);border-color:var(--teal);background:var(--deep);box-shadow:0 0 0 6px var(--deep);}
.tstep .twhen{display:block;margin-top:1rem;font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--teal-deep);}
.sec:not(.light) .tstep .twhen{color:var(--teal);}
.tstep h4{font-family:var(--exp);font-weight:700;font-size:1.1rem;margin:.5rem 0 .5rem;color:var(--ink);letter-spacing:-.01em;}
.sec:not(.light) .tstep h4{color:var(--snow);}
.tstep p{font-size:.92rem;line-height:1.55;color:var(--ink-soft);}
.sec:not(.light) .tstep p{color:var(--snow-soft);}
@media (max-width:760px){.tline{grid-template-columns:1fr;}.tline::before{display:none;}}

/* ---- UNIFIED HOVER-OPEN CALLOUT (one vibe, accent per section) ----
   <button class="callout a-teal"><span class="co-ic"><svg/></span>
   <span class="co-tag">..</span><h3>..</h3><div class="co-more"><div class="co-in">
   <p>..</p><span class="co-go">..</span></div></div></button>                      */
.callouts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.6vw,20px);margin-top:clamp(2rem,4vw,3rem);}
.callout{--ac:var(--teal);position:relative;overflow:visible;text-align:left;cursor:pointer;border-radius:3px;
  border:1px solid var(--rule-d);background:var(--deep-2);padding:clamp(1.5rem,3vw,2rem);
  transition:transform .35s var(--e-out),box-shadow .35s var(--e-out),border-color .35s,background .35s;}
.sec.light .callout,.band-tint .callout{background:var(--cloud);border-color:var(--rule-l);box-shadow:0 1px 2px rgba(14,26,36,.04);}
.callout::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--ac);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--e-out);}
.callout:hover,.callout:focus-visible{transform:translateY(-4px);border-color:color-mix(in srgb,var(--ac) 55%,transparent);box-shadow:0 24px 46px -28px rgba(0,0,0,.5);outline:none;}
.sec.light .callout:hover,.band-tint .callout:hover{box-shadow:0 26px 50px -30px rgba(14,26,36,.42);}
.callout:hover::before,.callout:focus-visible::before{transform:scaleX(1);}
.callout .co-ic{width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:3px;margin-bottom:1rem;
  color:var(--ac);border:1px solid color-mix(in srgb,var(--ac) 42%,transparent);background:color-mix(in srgb,var(--ac) 12%,transparent);transition:transform .35s var(--e-out);}
.callout:hover .co-ic{transform:scale(1.06) rotate(-3deg);}
.callout .co-ic svg{width:22px;height:22px;}
.callout .co-tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ac);}
.callout h3{font-family:var(--exp);font-weight:700;font-size:1.18rem;margin-top:.35rem;color:var(--snow);letter-spacing:-.01em;}
.sec.light .callout h3,.band-tint .callout h3{color:var(--ink);}
/* hover reveal = an absolute flyout, so the PAGE never reflows — only the card animates */
.callout .co-more{position:absolute;left:-1px;right:-1px;top:100%;z-index:6;
  background:var(--deep-2);border:1px solid color-mix(in srgb,var(--ac) 45%,var(--rule-d));border-top:0;border-radius:0 0 3px 3px;
  padding:.3rem clamp(1.5rem,3vw,2rem) 1.4rem;box-shadow:0 28px 48px -24px rgba(0,0,0,.62);
  opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .32s var(--e-out),transform .32s var(--e-out);}
.sec.light .callout .co-more,.band-tint .callout .co-more{background:var(--cloud);box-shadow:0 28px 48px -26px rgba(14,26,36,.4);}
.callout:hover,.callout:focus-visible{z-index:5;}
.callout:hover .co-more,.callout:focus-visible .co-more{opacity:1;transform:none;pointer-events:auto;}
.callout .co-in{min-height:0;}
.callout .co-in p{font-size:.92rem;line-height:1.55;color:var(--snow-soft);margin-top:.7rem;}
.sec.light .callout .co-in p,.band-tint .callout .co-in p{color:var(--ink-soft);}
.callout .co-go{display:inline-flex;align-items:center;gap:.4em;margin-top:.8rem;font-weight:600;font-size:.9rem;color:var(--ac);}
/* accent family — single-accent teal through-line + restrained siblings */
.callout.a-teal{--ac:#00b894;} .callout.a-deep{--ac:#0e9c9c;} .callout.a-slate{--ac:#4f86c6;}
.callout.a-gold{--ac:#c79a3e;} .callout.a-violet{--ac:#7b76d6;} .callout.a-grass{--ac:#3fae74;}
.sec.light .callout .co-tag,.band-tint .callout .co-tag{color:color-mix(in srgb,var(--ac) 78%,#0d1b24);}
@media (max-width:900px){.callouts{grid-template-columns:1fr;}}

/* missing-logo placeholder — show the company NAME as a clean text wordmark,
   styled like the other (dimmed) logos so it reads as a name, not a yellow block. */
.cust-item.cust-todo{min-width:0;}
.cust-ph{display:inline-flex;align-items:center;justify-content:center;min-width:120px;padding:.3rem .5rem;
  font-family:var(--exp);font-weight:700;font-size:1.02rem;letter-spacing:-.01em;line-height:1.1;text-align:center;
  white-space:nowrap;color:var(--snow);opacity:.5;transition:opacity .3s var(--e-out),transform .3s var(--e-out);}
.sec.light .cust-ph,.band-tint .cust-ph{color:var(--ink);}
.cust-item:hover .cust-ph{opacity:1;transform:translateY(-2px);}