/* ============================================================
   Sifonn Pro — licensed font, not on a CDN.
   Drop sifonn-pro.woff2 / .woff into /fonts/ and this picks it up.
   Until then the wordmark falls back to Inter.
   ============================================================ */
@font-face{
  font-family:'Sifonn Pro';
  /* Lightened cut (outlines eroded 32/1000 em). For the original weight,
     point at sifonn-pro.woff2 instead. */
  src:url('../fonts/sifonn-pro-light.woff2') format('woff2'),
      url('../fonts/sifonn-pro-light.woff') format('woff');
  font-weight:400;font-style:normal;font-display:swap;
}

:root{
  --paper:#ffffff;--tint:#f4fafc;--mist:#eef5f7;
  --ink:#003d54;--body:#4a5c64;--muted:#6d8792;--faint:#93a6ae;--hair:#e4ebee;
  --teal:#2eacc6;--aqua:#5de0e6;--deep-blue:#0078a6;

  --serif:'Source Serif 4','Signifier',ui-serif,Georgia,serif;
  --sans:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --wordmark:'Sifonn Pro','Inter',ui-sans-serif,system-ui,sans-serif;

  --r-card:24px;--r-elev:20px;--r-sm:16px;--r-pill:9999px;

  /* one shadow language, three depths */
  --sh-sm:0 1px 2px rgba(0,40,56,.04),0 6px 16px -10px rgba(0,40,56,.20);
  --sh-card:0 1px 2px rgba(0,40,56,.05),0 14px 30px -14px rgba(0,40,56,.24);
  --sh-float:0 0 0 1px rgba(0,61,84,.04),0 20px 30px -8px rgba(0,40,56,.16),0 8px 12px -6px rgba(0,40,56,.10);

  --page:1200px;--gap:88px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
section[id],div[id="stage"],.hv2-legal h3[id]{scroll-margin-top:104px;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{margin:0;background:var(--paper);color:var(--body);font-family:var(--sans);
  font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
img,svg{display:block;max-width:100%;}
a{color:inherit;}
.wrap{max-width:var(--page);margin:0 auto;padding:0 24px;position:relative;z-index:2;}

h1,h2,h3{margin:0;font-family:var(--serif);font-weight:400;color:var(--ink);}
h1{font-size:clamp(36px,5.6vw,78px);line-height:1.05;letter-spacing:-.028em;}
h1 em{font-style:italic;}
h2{font-size:clamp(32px,4.2vw,58px);line-height:1.16;letter-spacing:-.015em;}
h3{font-family:var(--sans);font-size:20px;font-weight:500;line-height:1.3;letter-spacing:-.009em;color:var(--ink);}
p{margin:0;}
.lede{font-size:clamp(17px,1.5vw,20px);line-height:1.45;color:var(--muted);font-weight:430;}
.tag{font-size:14px;color:var(--faint);}
.eyebrow{font-size:14px;color:var(--faint);margin-bottom:14px;}

.pill{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;
  border-radius:var(--r-pill);font-size:15px;font-weight:450;text-decoration:none;
  border:1px solid transparent;cursor:pointer;white-space:nowrap;
  transition:background-color .18s ease,border-color .18s ease;}
.pill-lg{height:48px;padding:0 24px;font-size:16px;}
.pill-fill{background:var(--ink);color:#fff;border-color:var(--ink);}
.pill-fill:hover{background:#00506e;}
.pill-ghost{background:transparent;color:var(--ink);border-color:rgba(0,61,84,.32);}
.pill-ghost:hover{border-color:var(--ink);background:rgba(0,61,84,.04);}
.pill-light{background:#fff;color:var(--ink);border-color:#fff;}
.pill-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.45);}
.pill-outline-light:hover{border-color:#fff;background:rgba(255,255,255,.1);}
.pair{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.pair .or-sep{font-size:14px;color:var(--muted);}
.close .pair .or-sep{color:rgba(255,255,255,.5);}
.tlink{display:inline-block;font-size:16px;font-weight:450;color:var(--ink);text-decoration:none;}
.textcta{font-size:16px;font-weight:450;color:var(--ink);text-decoration:none;opacity:.9;}
.textcta:hover{opacity:1;text-decoration:underline;text-underline-offset:4px;}
.tlink:hover{text-decoration:underline;text-underline-offset:3px;}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:6px;}

/* wordmark */
.brand{display:flex;align-items:center;gap:9px;text-decoration:none;flex:none;}
.brand span{font-family:var(--wordmark);font-size:23px;font-weight:400;letter-spacing:.004em;color:var(--ink);line-height:1;}

/* nav */
/* --navband is the strip the floating nav occupies at the top of the page:
   its 14px top margin plus the nav itself. The nav is in normal flow, so
   anything that should run behind it (a hero background) has to reach up
   into this band explicitly. 2px less at <=400px, where the Book-a-demo
   pill is hidden and the nav is 62px tall rather than 64. */
:root{--navband:78px;}
@media (max-width:400px){:root{--navband:76px;}}
.navdock{position:sticky;top:14px;z-index:60;padding:0 24px;margin-top:14px;}
.nav{max-width:1160px;margin:0 auto;display:flex;align-items:center;gap:20px;
  padding:9px 9px 9px 20px;border-radius:var(--r-pill);background:rgba(255,255,255,.94);
  -webkit-backdrop-filter:blur(20px) saturate(180%);backdrop-filter:blur(20px) saturate(180%);
  border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),var(--sh-sm);}
.nav-links{position:relative;display:flex;gap:2px;margin:0 auto;}
.nav-links a{position:relative;z-index:1;padding:9px 15px;border-radius:var(--r-pill);
  font-size:15px;color:var(--ink);text-decoration:none;opacity:.72;
  transition:opacity .2s ease,color .2s ease;}
.nav-links a:hover,.nav-links a.here{opacity:1;}
/* the indicator slides between items and rests on the section you're in */
.navpill{position:absolute;top:0;left:0;height:100%;border-radius:var(--r-pill);
  background:rgba(0,61,84,.075);opacity:0;pointer-events:none;z-index:0;
  transform:translate3d(0,0,0);
  transition:transform .38s cubic-bezier(.34,1.46,.44,1),
             width .38s cubic-bezier(.34,1.46,.44,1),
             opacity .22s ease;}
@media (prefers-reduced-motion:reduce){.navpill{transition:opacity .2s ease;}}

/* hamburger + drawer */
.navtoggle{display:none;width:42px;height:42px;flex:none;border-radius:var(--r-pill);
  border:1px solid rgba(0,61,84,.18);background:rgba(255,255,255,.6);cursor:pointer;
  align-items:center;justify-content:center;flex-direction:column;gap:5px;}
.navtoggle i{display:block;width:17px;height:1.6px;border-radius:2px;background:var(--ink);
  transition:transform .26s ease,opacity .2s ease;}
.navtoggle[aria-expanded="true"] i:first-child{transform:translateY(3.3px) rotate(45deg);}
.navtoggle[aria-expanded="true"] i:last-child{transform:translateY(-3.3px) rotate(-45deg);}
.mobmenu{overflow:hidden;max-height:0;opacity:0;
  transition:max-height .34s cubic-bezier(.3,.8,.3,1),opacity .24s ease,margin .34s ease;}
.mobmenu.open{max-height:520px;opacity:1;margin-top:10px;}
.mobinner{max-width:1120px;margin:0 auto;padding:14px;border-radius:26px;
  background:rgba(255,255,255,.82);
  -webkit-backdrop-filter:blur(22px) saturate(180%);backdrop-filter:blur(22px) saturate(180%);
  border:1px solid rgba(255,255,255,.8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),var(--sh-card);}
.mobinner a.ml{display:block;padding:13px 16px;border-radius:14px;font-size:17px;
  color:var(--ink);text-decoration:none;}
.mobinner a.ml:hover,.mobinner a.ml.here{background:rgba(0,61,84,.06);}
.mobcta{display:grid;gap:8px;margin-top:10px;padding-top:14px;border-top:1px solid var(--hair);}
.mobcta .pill{width:100%;height:48px;}
/* 1220 — the full nav-links row (logo + all 5 items + search icon + both
   CTA pills, "Book a 15-minute call" being the long one) needs ~1150px,
   so below ~1220px of viewport (once the navdock's side padding is
   subtracted) it would overflow past the pill's rounded edge. Keep this in
   step with the .nav-links breakpoint above. */
@media (max-width:1220px){.navtoggle{display:flex;}}
@media (min-width:1181px){.mobmenu{display:none;}}
.nav-cta{display:flex;align-items:center;gap:8px;flex:none;}
.nav .pill-ghost{background:rgba(255,255,255,.55);}
@media (max-width:1220px){.nav-links{display:none;}.nav{gap:10px;padding-left:18px;}.nav-cta{margin-left:auto;}}
@media (max-width:520px){.nav-cta .pill-ghost{display:none;}}
@media (max-width:400px){.nav-cta .pill-fill{display:none;}}

/* stage */
.stage{position:relative;height:420vh;}
.pin{position:sticky;top:0;height:100vh;overflow:hidden;}
.atmos{position:absolute;left:0;right:0;top:290px;bottom:-160px;overflow:hidden;pointer-events:none;z-index:0;}
.atmos i{position:absolute;display:block;border-radius:50%;filter:blur(90px);}
.b1{width:1250px;height:620px;left:50%;top:-120px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.55) 0%,rgba(93,224,230,0) 70%);}
.b2{width:900px;height:540px;left:15%;top:80px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(0,120,166,.34) 0%,rgba(0,120,166,0) 70%);}
.b3{width:860px;height:520px;left:87%;top:40px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(46,172,198,.38) 0%,rgba(46,172,198,0) 70%);}
.atmos::after{content:"";position:absolute;left:0;right:0;top:0;height:190px;
  background:linear-gradient(to bottom,#fff 0%,rgba(255,255,255,0) 100%);}
.grain{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.5;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");}
.stage-head{position:absolute;inset:0;z-index:1;/* under .dashwrap (2): the panel rises over the shrinking headline */display:flex;align-items:flex-start;justify-content:center;
  padding:8vh 24px 0;pointer-events:none;}
.hin{text-align:center;max-width:900px;transform-origin:50% 0;/* shrink from the top, so the buttons lift as it shrinks */will-change:transform,opacity;pointer-events:auto;}
.hin h1{max-width:1000px;margin:0 auto;}
.hin .lede,.hin .pair{max-width:640px;margin-left:auto;margin-right:auto;}
.stage-head .lede{max-width:640px;margin:26px auto 0;color:#4a6f7c;font-size:clamp(16px,1.42vw,19.5px);line-height:1.5;font-weight:400;}
.stage-head .pair{justify-content:center;align-items:center;gap:22px;margin-top:30px;}
.dashwrap{position:absolute;left:0;right:0;top:35%;bottom:3%;z-index:2;padding:0 24px;will-change:transform;}
.dash{height:100%;max-width:1120px;margin:0 auto;min-height:470px;display:flex;overflow:hidden;
  /* No backdrop-filter: this subtree repaints every scroll frame (counters,
     donut), and re-running a blur each frame is what caused the jank. */
  background:rgba(255,255,255,.94);
  border:1px solid rgba(255,255,255,.9);border-radius:var(--r-elev);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),var(--sh-float);}
.side{width:194px;flex:none;border-right:1px solid var(--hair);padding:34px 14px 18px;}
.side-brand{font-size:14px;font-weight:500;color:var(--ink);}
.side-org{font-size:11px;color:var(--faint);margin-top:3px;}
.badge{display:inline-block;margin-top:8px;padding:2px 9px;border-radius:var(--r-pill);background:var(--mist);font-size:10px;color:var(--muted);}
.side-nav{margin-top:18px;}
.side-nav a{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:9px;font-size:12.5px;color:var(--muted);text-decoration:none;}
.side-nav a.on{background:var(--ink);color:#fff;font-weight:480;}
.side-nav a .ic{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.55;flex:none;}
.side-nav .sub{padding-left:26px;}
.side-group{font-size:9.5px;letter-spacing:.06em;color:var(--faint);margin:16px 0 6px 9px;}
.meter{margin-top:20px;padding-top:14px;border-top:1px solid var(--hair);}
.meter-top{display:flex;font-size:10px;color:var(--faint);}
.meter-top b{margin-left:auto;font-weight:400;}
.meter-num{font-size:12.5px;color:var(--ink);margin:5px 0 7px;}
.meter-bar{height:4px;border-radius:2px;background:var(--mist);overflow:hidden;}
.meter-bar i{display:block;height:100%;width:48%;border-radius:2px;background:linear-gradient(90deg,var(--aqua),var(--deep-blue));}
.dmain{flex:1;min-width:0;padding:34px 24px 20px;display:flex;flex-direction:column;}
.dhead{display:flex;align-items:flex-start;gap:16px;}
.dhead h4{margin:0;font-family:var(--sans);font-size:17px;font-weight:500;color:var(--ink);}
.dhead p{font-size:11.5px;color:var(--faint);margin-top:3px;}
.ranges{margin-left:auto;display:flex;gap:4px;flex:none;}
.ranges span{font-size:11px;padding:5px 10px;border-radius:var(--r-pill);color:var(--muted);border:1px solid var(--hair);}
.ranges span.on{background:var(--ink);color:#fff;border-color:var(--ink);}
@media (max-width:1240px){.ranges span:nth-child(-n+2){display:none;}}
/* panes: Overview cross-fades to Recent calls on continued scroll */
.panes{position:relative;flex:1;min-height:0;margin-top:16px;}
.pane{position:absolute;inset:0;display:flex;flex-direction:column;will-change:transform,opacity;}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;flex:none;}
.charts{display:grid;grid-template-columns:1.52fr 1fr;gap:14px;margin-top:14px;flex:1;min-height:0;}
.slot{min-height:92px;border:1px dashed rgba(0,61,84,.18);border-radius:var(--r-sm);}
.slot.wide{min-height:0;height:100%;}
.chartbox{padding:15px 17px;background:#fff;border-radius:var(--r-sm);box-shadow:var(--sh-float);
  height:100%;display:flex;flex-direction:column;}
.chartbox h5{margin:0;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink);}
.chartbox p.sub{font-size:11.5px;color:var(--faint);margin-top:3px;}
.plotwrap{display:flex;flex-direction:column;flex:1 1 auto;min-height:0;margin-top:12px;}
.chartrow{display:flex;flex:1 1 auto;min-height:0;gap:6px;}
.yaxis{flex:none;width:20px;position:relative;}
.yaxis span{position:absolute;right:0;left:0;text-align:right;font-size:9.5px;line-height:1;
  color:var(--faint);transform:translateY(-50%);font-variant-numeric:tabular-nums;}
.xaxisrow{display:flex;flex:none;margin-top:5px;gap:6px;}
.yspacer{flex:none;width:20px;}
.xaxis{flex:1 1 auto;min-width:0;position:relative;height:12px;}
.xaxis span{position:absolute;top:0;font-size:9.5px;line-height:1;color:var(--faint);white-space:nowrap;}
.xaxis span.mid{transform:translateX(-50%);}
.xaxis span.end{transform:translateX(-100%);}
.plot{position:relative;flex:1 1 auto;min-height:0;}
.bars{position:absolute;inset:0;display:flex;align-items:flex-end;gap:2px;}
.bars .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;height:100%;}
.bars .ah{background:#8fdae6;border-radius:2px 2px 0 0;}
.bars .bh{background:var(--ink);}
.line{position:absolute;inset:0;width:100%;height:100%;}
.line-dots{position:absolute;inset:0;pointer-events:none;}
.line-dot{position:absolute;width:4.5px;height:4.5px;margin:-2.25px 0 0 -2.25px;border-radius:50%;
  background:var(--deep-blue);box-shadow:0 0 0 1px #fff;}
.legend{display:flex;flex:none;flex-wrap:wrap;gap:6px 16px;margin-top:14px;font-size:10.5px;color:var(--muted);}
.legend i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:5px;}
/* Call outcomes donut */
.donutbox{background:#fff;border-radius:var(--r-sm);box-shadow:var(--sh-card);padding:15px 17px;
  display:flex;flex-direction:column;min-width:0;contain:layout paint;}
.donutbox h5{margin:0;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink);}
.donutbox p.sub{font-size:11.5px;color:var(--faint);margin-top:3px;}
.dwrap{position:relative;flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;margin:10px 0 12px;}
.dwrap svg{height:100%;max-height:132px;width:auto;}
.dctr{position:absolute;text-align:center;}
.dctr b{display:block;font-family:var(--serif);font-size:24px;line-height:1;color:var(--ink);
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;}
.dctr span{display:block;font-size:10px;color:var(--faint);margin-top:3px;}
.dkey{display:grid;flex:none;grid-template-columns:1fr 1fr;gap:5px 12px;font-size:10.5px;color:var(--muted);}
.dkey i{display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:5px;}
.dkey b{float:right;font-weight:450;color:var(--ink);}

/* Recent calls table */
.tablecard{background:#fff;border-radius:var(--r-sm);box-shadow:var(--sh-card);overflow:hidden;
  display:flex;flex-direction:column;height:100%;}
.tchead{display:flex;align-items:flex-start;padding:15px 18px 13px;}
.tchead h5{margin:0;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink);}
.tchead p{font-size:11.5px;color:var(--faint);margin-top:3px;}
.viewall{margin-left:auto;font-size:11.5px;color:var(--teal);}
.rtable{width:100%;border-collapse:collapse;font-size:11.5px;}
.rtable th{text-align:left;padding:7px 18px;background:#f2f9fb;color:var(--muted);font-weight:450;}
.rtable td{padding:8px 18px;border-top:1px solid #eef4f6;color:var(--ink);}
.rtable td.num{text-align:right;color:var(--muted);}
.rtable .when b{display:block;font-weight:450;}
.rtable .when span{color:var(--faint);font-size:10.5px;}
.chip{display:inline-block;padding:2px 8px;border-radius:var(--r-pill);border:1px solid var(--hair);font-size:10.5px;color:var(--muted);}
.chip.vm{border-color:#bfe6f0;color:var(--deep-blue);background:#f2fbfd;}
.chip.ok{border-color:#a9e2e8;color:#0a6b7d;background:#effbfc;}
.rtable .arw{text-align:right;color:var(--faint);}

.flys{position:absolute;inset:0;z-index:6;pointer-events:none;will-change:opacity;}
.fly{position:absolute;will-change:transform;}
.kpi{height:100%;padding:16px 18px 16px;border-radius:var(--r-sm);background:#fff;
  display:flex;flex-direction:column;justify-content:space-between;
  contain:layout paint;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),var(--sh-float);}
.k-top{display:flex;align-items:center;gap:9px;min-width:0;}
.k-lab{font-size:10.5px;letter-spacing:.09em;color:var(--muted);line-height:1;white-space:nowrap;}
.k-ic{flex:none;width:17px;height:17px;display:flex;align-items:center;justify-content:center;
  color:var(--teal);opacity:.8;}
.k-ic svg{width:15px;height:15px;display:block;}
.kpi b{display:block;font-family:var(--serif);font-weight:400;font-size:36px;line-height:.95;
  letter-spacing:-.022em;color:var(--ink);
  font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;}
.k-sub{font-size:11.5px;color:var(--faint);line-height:1.35;margin-top:7px;}
.k-body{margin-top:auto;}
@media (max-width:1080px){
  /* No pinning and no assembly below this width — the dashboard is shown in its
     finished state, cards already docked in their slots. Phase 2 is dropped. */
  .stage{height:auto;}
  .pin{position:relative;height:auto;overflow:visible;padding:24px 0 40px;display:block;}
  .stage-head{position:static;display:block;padding:0 24px;}
  .hin{max-width:none;opacity:1!important;transform:none!important;}
  .atmos{top:170px;}

  .dashwrap{position:relative;top:auto;bottom:auto;margin-top:44px;padding:0 24px;
            transform:none!important;}
  .dash{height:auto;min-height:0;opacity:1!important;border-radius:var(--r-elev);}
  .dmain{padding:26px 20px 22px;}
  .ranges{display:none;}

  /* panes flow in normal order — absolute panes inside a flexed parent were
     collapsing to zero height, which is what broke the earlier mobile build */
  .panes{position:static;flex:none;margin-top:18px;}
  .pane{position:static;opacity:1!important;transform:none!important;}
  #paneCalls{display:none;}

  .charts{grid-template-columns:1fr;gap:14px;margin-top:14px;flex:none;}
  .slot.wide{height:260px;}
  .chartbox .plot{min-height:120px;}
  .dwrap svg{max-height:150px;}

  /* artifacts stay docked over their slots */
  .flys{opacity:1!important;}
  .fly{transform:none!important;}
}

@media (max-width:860px){
  .side{display:none;}
  .kpis{grid-template-columns:1fr 1fr;}
  .slot{min-height:88px;}
}

@media (max-width:620px){
  .kpis{grid-template-columns:1fr;}
  .slot{min-height:84px;}
  .kpi{padding:15px 17px;flex-direction:row;align-items:center;gap:14px;}
  .kpi .k-top{flex:1;min-width:0;}
  .kpi .k-body{margin-top:0;text-align:right;flex:none;}
  .kpi b{font-size:30px;}
  .k-sub{margin-top:3px;}
  .slot.wide{height:230px;}
  .dkey{grid-template-columns:1fr 1fr;}
  .dmain{padding:22px 16px 18px;}
}

/* reveal */
.rv{opacity:0;transform:translateY(20px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.7,.3,1);}
.rv.in{opacity:1;transform:none;}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none;}}

/* industries — single row */
.strip{padding:58px 0 62px;}
.strip h6{margin:0 0 32px;text-align:center;font-family:var(--sans);font-size:14px;font-weight:450;color:var(--faint);}
.marq{overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);}
.track{display:flex;width:max-content;animation:slide 48s linear infinite;}
.marq:hover .track{animation-play-state:paused;}
@keyframes slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.track{animation:none;}}
.mi{display:inline-flex;align-items:center;padding:0 32px;white-space:nowrap;color:#0a5573;opacity:.5;font-size:27px;line-height:1;}
.mi:hover{opacity:.85;}
.f-bebas{font-family:'Bebas Neue',sans-serif;letter-spacing:.06em;font-size:34px;}
.f-play{font-family:'Playfair Display',serif;font-weight:500;}
.f-grot{font-family:'Space Grotesk',sans-serif;font-weight:500;letter-spacing:-.02em;}
.f-arch{font-family:'Archivo Black',sans-serif;font-size:22px;letter-spacing:-.01em;}
.f-corm{font-family:'Cormorant Garamond',serif;font-style:italic;font-weight:600;font-size:34px;}
.f-mono{font-family:'JetBrains Mono',monospace;font-weight:500;font-size:21px;letter-spacing:-.03em;}
.f-inter{font-family:var(--sans);font-weight:500;font-size:23px;letter-spacing:-.02em;}
.f-serif{font-family:var(--serif);font-size:29px;}

/* sections */
.sec{padding:var(--gap) 0;}
.band{background:var(--tint);}
.sec-head{max-width:700px;margin-bottom:48px;}
.sec-head .lede{margin-top:18px;}
.center{margin-left:auto;margin-right:auto;text-align:center;}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:900px){.grid-3{grid-template-columns:1fr;}}
.card{background:#fff;border-radius:var(--r-card);padding:28px 26px 26px;box-shadow:var(--sh-card);}
.card .tag{margin-bottom:14px;}
.card p.txt{margin-top:10px;font-size:16px;line-height:1.5;color:var(--body);}

/* founder quote */
.quote{position:relative;max-width:900px;margin:0 auto;padding:78px 64px 62px;border-radius:var(--r-card);
  background:linear-gradient(140deg,#eafafc 0%,#cbe9f2 100%);box-shadow:var(--sh-float);overflow:hidden;}
.qmark{position:absolute;top:10px;left:34px;font-family:var(--serif);font-size:210px;line-height:1;
  color:#fff;opacity:.6;pointer-events:none;user-select:none;}
.qmark.end{top:auto;left:auto;right:34px;bottom:-96px;}
.qbig{position:relative;font-family:var(--serif);font-style:italic;
  font-size:clamp(27px,4vw,50px);line-height:1.16;letter-spacing:-.018em;color:#00394d;
  max-width:16ch;}
@media (max-width:760px){.qbig{max-width:none;}.qbig br{display:none;}}
.qsmall{position:relative;margin-top:24px;font-size:17.5px;line-height:1.6;color:#0d5771;}
.qsmall em{font-family:var(--serif);font-style:italic;font-size:19px;}
.qby{position:relative;margin-top:40px;display:flex;align-items:center;gap:13px;}
.qav{width:42px;height:42px;border-radius:50%;flex:none;color:#fff;font-size:15px;font-weight:500;
  background:linear-gradient(135deg,var(--aqua),var(--deep-blue));display:flex;align-items:center;justify-content:center;}
.qwho b{display:block;font-family:var(--sans);font-size:15.5px;font-weight:500;color:#00394d;line-height:1.3;}
.qwho em{display:block;font-style:normal;font-size:14px;color:#3d7a90;margin-top:2px;}
@media (max-width:760px){.quote{padding:56px 28px 40px;}.qmark{font-size:140px;left:18px;}.qmark.end{display:none;}}

/* call + recording */
.phone-cta{position:relative;overflow:hidden;}
.phone-cta::before{content:"";position:absolute;width:1100px;height:600px;left:50%;top:-240px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.34) 0%,rgba(93,224,230,0) 70%);filter:blur(80px);}
.callpanel{max-width:540px;margin:0 auto;padding:13px;border-radius:30px;
  background:linear-gradient(180deg,#01455e 0%,#002534 100%);
  box-shadow:0 34px 64px -26px rgba(0,38,54,.62),0 4px 14px -6px rgba(0,38,54,.34);}
.callinner{position:relative;overflow:hidden;border-radius:22px;padding:26px 28px 28px;text-align:center;
  border:1px solid rgba(93,224,230,.30);
  background:radial-gradient(130% 90% at 50% -10%,rgba(93,224,230,.16) 0%,rgba(93,224,230,0) 62%);}
.callinner::before{content:"";position:absolute;left:50%;top:-140px;width:420px;height:280px;
  transform:translateX(-50%);pointer-events:none;filter:blur(50px);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.30),rgba(93,224,230,0) 70%);}
.calleyebrow{position:relative;font-size:11.5px;font-weight:500;letter-spacing:.13em;
  color:#7fdfe8;margin-bottom:22px;}

.agentchip{position:relative;display:inline-flex;align-items:center;gap:10px;
  padding:7px 18px 7px 7px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);}
.agentchip .av{width:30px;height:30px;border-radius:50%;flex:none;display:flex;
  align-items:center;justify-content:center;font-size:13px;font-weight:500;color:#00303f;
  background:linear-gradient(135deg,var(--aqua),var(--deep-blue));}
.agentchip b{font-size:15px;font-weight:500;color:#8fe6ee;}
.agentchip s{text-decoration:none;color:rgba(255,255,255,.28);}
.agentchip span{font-size:15px;color:rgba(255,255,255,.55);}

.micwrap{position:relative;display:flex;align-items:center;justify-content:center;margin:26px 0 0;}
.mic{position:relative;width:128px;height:128px;border-radius:50%;cursor:pointer;
  border:1px solid rgba(93,224,230,.55);color:#bff2f6;
  background:radial-gradient(110% 110% at 50% 20%,rgba(93,224,230,.20) 0%,rgba(0,50,68,.6) 70%);
  box-shadow:0 0 0 1px rgba(93,224,230,.10),0 0 44px -6px rgba(93,224,230,.42),
             inset 0 1px 0 rgba(255,255,255,.14);
  display:flex;align-items:center;justify-content:center;transition:transform .18s ease;}
.mic:hover{transform:scale(1.03);}
.mic::after{content:"";position:absolute;inset:-1px;border-radius:50%;
  border:1px solid rgba(93,224,230,.5);animation:ring 2.8s ease-out infinite;}
@keyframes ring{0%{transform:scale(1);opacity:.55;}70%{transform:scale(1.28);opacity:0;}100%{opacity:0;}}
@media (prefers-reduced-motion:reduce){.mic::after{animation:none;opacity:.3;}}
.miclabel{position:relative;margin-top:20px;font-size:16.5px;color:#eaf8fa;}

.calldiv{position:relative;height:1px;margin:26px 0 22px;background:rgba(255,255,255,.13);}
.callor{position:relative;font-size:14px;color:rgba(255,255,255,.5);}
.callnum{position:relative;display:inline-flex;align-items:center;gap:11px;margin-top:10px;
  font-size:27px;font-weight:500;letter-spacing:-.01em;color:#7fdfe8;text-decoration:none;}
.callnum:hover{color:#a5ecf2;}
.callnum svg{flex:none;}
.callsub{position:relative;margin-top:9px;font-size:13.5px;color:rgba(255,255,255,.42);}
.callfoot{margin-top:16px;text-align:center;font-size:13.5px;color:var(--muted);}
@media (max-width:560px){
  .callpanel{padding:9px;border-radius:24px;}
  .callinner{padding:22px 18px 24px;}
  .mic{width:110px;height:110px;}
  .callnum{font-size:23px;}
}

.orrule{display:flex;align-items:center;gap:18px;max-width:560px;margin:40px auto;}
.orrule i{flex:1;height:1px;background:var(--hair);}
.orrule span{font-size:14px;color:var(--faint);}

.player{max-width:560px;margin:0 auto;background:#fff;border-radius:var(--r-card);box-shadow:var(--sh-card);padding:26px 28px;}
.player-top{display:flex;align-items:center;gap:15px;}
.play{width:48px;height:48px;border-radius:var(--r-pill);border:1px solid var(--hair);background:#fff;
  flex:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:border-color .16s ease;}
.play:hover{border-color:var(--ink);}
.play svg{margin-left:3px;}
.player-label{font-size:15.5px;font-weight:480;color:var(--ink);}
.player-sub{font-size:13.5px;color:var(--muted);margin-top:3px;}
.ptime{margin-left:auto;font-size:13px;color:var(--faint);}
.bigwave{display:flex;align-items:center;gap:3px;height:34px;margin:20px 0 18px;}
.bigwave i{flex:1;border-radius:2px;background:var(--teal);opacity:.34;}
.bigwave i.done{opacity:.8;}
.script{border-top:1px solid var(--hair);padding-top:18px;}
.turn{display:flex;gap:10px;margin-bottom:13px;}
.turn:last-child{margin-bottom:0;}
.who{font-size:13px;color:var(--faint);flex:none;width:64px;padding-top:1px;}
.said{font-size:15px;line-height:1.4;color:var(--ink);}

/* dark 4-step */
.dark{position:relative;background:var(--ink);color:rgba(255,255,255,.74);overflow:hidden;}
.dark::before{content:"";position:absolute;width:1100px;height:640px;left:12%;top:-220px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.4) 0%,rgba(0,120,166,.2) 45%,rgba(0,61,84,0) 72%);filter:blur(70px);}
.dark h2,.dark h3{color:#fff;}
.dark .lede,.dark .eyebrow{color:rgba(255,255,255,.6);}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}
@media (max-width:1000px){.steps4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.steps4{grid-template-columns:1fr;}}
.st{padding-top:22px;border-top:1px solid rgba(255,255,255,.22);}
.st .num{font-family:var(--serif);font-size:34px;line-height:1;color:rgba(255,255,255,.42);margin-bottom:16px;}
.st h3{font-size:19px;}
.st p{margin-top:10px;font-size:15.5px;line-height:1.55;color:rgba(255,255,255,.7);}

/* differentiation — tightened */
.diff{display:grid;grid-template-columns:1fr 1.1fr;gap:64px;align-items:start;}
@media (max-width:900px){.diff{grid-template-columns:1fr;gap:32px;}}
.dpoint{padding:22px 0;border-top:1px solid var(--hair);}
.dpoint:first-child{border-top:0;padding-top:0;}
.dpoint b{display:block;font-size:17px;font-weight:500;color:var(--ink);margin-bottom:7px;}
.dpoint p{font-size:16px;line-height:1.5;}

/* problem section */
.probs{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;}
@media (max-width:900px){.probs{grid-template-columns:1fr;gap:26px;}}
.prob{padding-top:22px;border-top:1px solid var(--hair);}
.prob b{display:block;font-family:var(--serif);font-size:clamp(29px,3.2vw,40px);font-weight:400;
  line-height:1.08;letter-spacing:-.018em;color:var(--ink);}
.prob h3{margin-top:12px;font-size:17px;}
.prob p{margin-top:9px;font-size:15.5px;line-height:1.55;color:var(--body);}
.bottomline{margin-top:52px;padding-top:26px;border-top:1px solid var(--hair);
  display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;}
.bottomline b{font-family:var(--serif);font-size:clamp(21px,2.2vw,28px);font-weight:400;color:var(--ink);}
.bottomline span{font-size:15.5px;color:var(--muted);}
.bottomline a{margin-left:auto;font-size:16px;font-weight:450;color:var(--ink);text-decoration:none;}
.bottomline a:hover{text-decoration:underline;text-underline-offset:3px;}

.record{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;}
@media (max-width:760px){.record{grid-template-columns:1fr;}}
.rec b{display:block;font-family:var(--serif);font-size:44px;font-weight:400;line-height:1.1;letter-spacing:-.015em;color:var(--ink);}
.rec span{display:block;margin-top:8px;font-size:15px;color:var(--muted);line-height:1.45;}

/* pricing */
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch;}
@media (max-width:980px){.tiers{grid-template-columns:1fr;max-width:520px;margin:0 auto;}}
.tier{position:relative;background:#fff;border-radius:var(--r-card);padding:32px 28px;display:flex;flex-direction:column;box-shadow:var(--sh-card);}
.tier.lead{background:linear-gradient(160deg,#00567a 0%,#003d54 100%);box-shadow:0 24px 44px -18px rgba(0,40,56,.5);}
.flagpop{position:absolute;top:-11px;left:28px;padding:3px 12px;border-radius:var(--r-pill);
  background:linear-gradient(135deg,var(--aqua),var(--deep-blue));color:#fff;font-size:12px;font-weight:480;}
.tname{font-size:16px;font-weight:500;color:var(--ink);}
.tfor{font-size:14px;color:var(--muted);margin-top:6px;min-height:40px;}
.price{font-family:var(--serif);font-size:44px;line-height:1.1;color:var(--ink);margin:16px 0 4px;letter-spacing:-.018em;}
.price small{font-family:var(--sans);font-size:15px;color:var(--muted);}
.setup{font-size:13.5px;color:var(--faint);}
.tier.lead .tname,.tier.lead .price{color:#fff;}
.tier.lead .tfor,.tier.lead .price small{color:rgba(255,255,255,.62);}
.tier.lead .setup{color:rgba(255,255,255,.5);}
.tier.lead .tlist li{color:rgba(255,255,255,.8);}
.tier.lead .tlist li::before{background:var(--aqua);}
.tlist{list-style:none;margin:24px 0 28px;padding:0;}
.tlist li{font-size:15px;line-height:1.45;color:var(--body);padding-left:19px;position:relative;margin-bottom:11px;}
.tlist li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;border-radius:50%;background:var(--teal);}
.tier .pill{margin-top:auto;}
.pricing-note{margin-top:30px;text-align:center;font-size:15px;color:var(--muted);}
.pricing-note a{color:var(--ink);}

/* calendar — Cal.com's inline embed.

   Two sizing facts, both learned from looking at the rendered embed rather
   than from the docs:

   1. month_view needs ~900px to put the calendar and the times side by side.
      Narrower and it stacks them into a tall rectangle. (It used to sit in a
      two-column split at ~560px, which is exactly what went wrong.)
   2. Cal.com ALSO caps its own booker at roughly that width and centres it
      inside whatever space you give it. So anything wider than ~950px is not
      a bigger calendar, it is white gutters inside our card.

   Hence a container sized to what Cal.com actually uses, centred, rather than
   full-bleed. The max-height stays as a backstop only. */
/* Balance the heading's line lengths so "real time." doesn't sit alone on a
   third line. Scoped to this section rather than applied to every h2 on the
   site, which would be a wider restyle than this change is for. */
#book .hv2-head h2{text-wrap:balance;}

/* The section header uses .hv2-head.hv2-center from the design system —
   nothing bespoke here, so the measure, heading size and the 56px gap down
   to the card match Pricing, FAQ and every other section. */

/* The "don't see a slot" line sits AFTER the calendar: it only makes sense
   once you have looked at the times. Given real separation from the card so
   it reads as a footnote rather than a caption fighting the widget. */
.calnote{margin:28px auto 0;max-width:640px;text-align:center;font-size:15px;line-height:1.6;color:var(--muted);
  /* Stops "open the calendar on / Cal.com" breaking mid-phrase. */
  text-wrap:balance;}
.calnote a{color:var(--ink);}

.calembed{
  /* Sized from a pixel measurement of a real Cal.com render, not a guess:
     the booker is 774px wide, and Cal.com centres it inside whatever space
     it is given. 792px of content box leaves ~9px of its own centring per
     side (so ~33px of visual inset with the padding below) and keeps a
     little slack over 774 — pinning exactly would risk tipping month_view
     back into its stacked, tall-rectangle layout. */
  max-width:840px;margin:0 auto;
  background:#fff;border-radius:var(--r-card);box-shadow:var(--sh-float);
  /* Asymmetric ON PURPOSE, because Cal.com's own internal spacing is:
       8px above the booker, ~55px below it, then its wordmark.
     Symmetric padding here would therefore render asymmetrically. 48px on
     top brings the gap above to ~56px, matching the ~55px below; 0 on the
     bottom because Cal.com already supplies it, and adding ours would make
     the card bottom-heavy. Previously this was padding:0, which is why the
     booker's top border sat against the card's. */
  padding:48px 24px 0;
  /* auto, NOT hidden: with a max-height, hidden CLIPS the times list and
     makes slots unreachable. auto still respects the border radius. */
  overflow:auto;
  /* Backstop only — the width fix is what actually keeps this short. */
  max-height:min(720px,82vh);
}
/* Holds space while the iframe sizes itself, so the section doesn't jolt. */
.calembed-target{min-height:480px;width:100%;}
@media (max-width:960px){
  .calembed{max-height:none;overflow:visible;}
  .calembed-target{min-height:580px;}
}
.calembed-fallback{padding:28px;font-size:15px;color:var(--muted);text-align:center;}
.calembed-fallback a{color:var(--ink);}

/* faq — now cards */
.faq{max-width:820px;}
.faq details{background:#fff;border-radius:var(--r-sm);box-shadow:var(--sh-card);padding:22px 26px;margin-bottom:12px;}
.faq summary{list-style:none;cursor:pointer;font-size:17.5px;font-weight:450;color:var(--ink);display:flex;align-items:flex-start;gap:16px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";margin-left:auto;color:var(--muted);font-size:22px;line-height:1.1;}
.faq details[open] summary::after{content:"–";}
.faq .ans{margin-top:14px;font-size:16px;line-height:1.55;color:var(--body);max-width:660px;}

/* close + footer */
.close{position:relative;background:var(--ink);color:#fff;padding:112px 0 0;overflow:hidden;}
.close::before{content:"";position:absolute;width:1250px;height:720px;left:50%;top:-120px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.5) 0%,rgba(0,120,166,.24) 42%,rgba(0,61,84,0) 72%);filter:blur(70px);}
.close h2{color:#fff;}
.close-in{text-align:center;padding-bottom:100px;}
.close .lede{color:rgba(255,255,255,.72);max-width:560px;margin:22px auto 0;}
.close .pair{justify-content:center;margin-top:32px;}
.close-note{margin-top:24px;display:flex;gap:24px;justify-content:center;flex-wrap:wrap;font-size:14px;color:rgba(255,255,255,.5);}
footer{position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.14);padding:64px 0 36px;}
.fgrid{display:grid;grid-template-columns:1.6fr repeat(4,1fr);gap:40px;}
@media (max-width:1000px){.fgrid{grid-template-columns:repeat(2,1fr);gap:36px;}}
@media (max-width:560px){.fgrid{grid-template-columns:1fr;}}
.fbrand .brand span{color:#fff;font-size:26px;}
.fbrand p{margin-top:16px;font-size:15px;line-height:1.5;color:rgba(255,255,255,.55);max-width:280px;}
.fcol h6{margin:0 0 16px;font-family:var(--sans);font-size:15px;font-weight:500;color:#fff;}
.fcol ul{list-style:none;margin:0;padding:0;}
.fcol li{margin-bottom:11px;}
.fcol a{font-size:15px;color:rgba(255,255,255,.6);text-decoration:none;}
.fcol a:hover{color:#fff;}
.fbot{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:56px;padding-top:26px;border-top:1px solid rgba(255,255,255,.12);}
.fbot p{font-size:14px;color:rgba(255,255,255,.42);}
.fbot .right{margin-left:auto;display:flex;gap:22px;}
.fbot .right a{font-size:14px;color:rgba(255,255,255,.42);text-decoration:none;}
.fbot .right a:hover{color:#fff;}

/* ============================================================
   Multi-page additions: dropdown nav, inner-page shells
   ============================================================ */

/* --- desktop dropdowns --- */
.nav-links{align-items:center;}
.navitem{position:relative;display:flex;align-items:center;}
.navitem>a{display:inline-flex;align-items:center;gap:5px;}
.navitem>a .chev{width:11px;height:11px;flex:none;opacity:.6;transition:transform .22s ease;}
.navitem:hover>a .chev,.navitem:focus-within>a .chev{transform:rotate(180deg);}

.dropdown{position:absolute;top:100%;left:50%;z-index:70;padding-top:14px;
  transform:translate(-50%,6px);opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s ease,transform .24s cubic-bezier(.3,.9,.3,1),visibility .2s;}
.navitem:hover .dropdown,.navitem:focus-within .dropdown{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);}
/* just-clicked item: closed until the pointer leaves (site.js) */
.navitem.is-closed .dropdown{opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,6px);}
.dinner{display:flex;gap:34px;padding:22px 26px;border-radius:22px;
  background:#fff;
  border:1px solid rgba(255,255,255,.9);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 24px 48px -20px rgba(0,40,56,.34);}
.dcol{min-width:186px;}
.dcol+.dcol{padding-left:34px;border-left:1px solid var(--hair);}
.dcol .dh{font-size:11px;letter-spacing:.1em;color:var(--faint);margin:0 0 12px 10px;}
.dcol a{display:block;padding:9px 10px;border-radius:11px;font-size:15px;
  color:var(--ink);text-decoration:none;opacity:.85;transition:background-color .16s ease,opacity .16s ease;}
.dcol a:hover{background:rgba(0,61,84,.06);opacity:1;}
.dcol a small{display:block;font-size:12.5px;color:var(--faint);margin-top:2px;}

/* --- mobile drawer accordions --- */
.mobgroup{border-radius:14px;}
.mobgroup>button{display:flex;align-items:center;width:100%;padding:13px 16px;border:0;
  border-radius:14px;background:none;cursor:pointer;font-family:var(--sans);
  font-size:17px;color:var(--ink);text-align:left;}
.mobgroup>button .chev{margin-left:auto;width:12px;height:12px;opacity:.5;transition:transform .24s ease;}
.mobgroup.open>button .chev{transform:rotate(180deg);}
.mobsub{overflow:hidden;max-height:0;transition:max-height .3s cubic-bezier(.3,.8,.3,1);}
.mobgroup.open .mobsub{max-height:420px;}
.mobsub a{display:block;padding:10px 16px 10px 30px;font-size:15.5px;
  color:var(--muted);text-decoration:none;}
.mobsub a:hover{color:var(--ink);}
.mobsub .dh{font-size:10.5px;letter-spacing:.1em;color:var(--faint);padding:10px 16px 4px 30px;}

/* --- inner page header --- */
.pagehead{position:relative;overflow:hidden;padding:120px 0 72px;}
.pagehead::before{content:"";position:absolute;left:50%;top:-260px;width:1180px;height:620px;
  transform:translateX(-50%);pointer-events:none;filter:blur(90px);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.42) 0%,rgba(93,224,230,0) 70%);}
.pagehead .wrap{max-width:900px;text-align:center;}
.pagehead h1{font-size:clamp(36px,4.8vw,64px);line-height:1.1;letter-spacing:-.024em;}
.pagehead .lede{margin:24px auto 0;max-width:640px;}
.pagehead .pair{justify-content:center;margin-top:30px;}
.crumb{font-size:14px;color:var(--faint);margin-bottom:18px;}
.crumb a{color:var(--muted);text-decoration:none;}
.crumb a:hover{color:var(--ink);}

/* --- prose --- */
.prose{max-width:760px;}
.prose h2{font-size:clamp(26px,2.8vw,36px);margin-top:52px;}
.prose h2:first-child{margin-top:0;}
.prose h3{margin-top:32px;font-size:19px;}
.prose p{margin-top:16px;font-size:17px;line-height:1.62;}
.prose ul{margin:16px 0 0;padding-left:20px;}
.prose li{margin-bottom:10px;font-size:17px;line-height:1.6;}

/* --- FAQ page --- */
.faqgroup{margin-bottom:44px;}
.faqgroup>h2{margin-bottom:22px;font-size:clamp(24px,2.5vw,32px);}
.faqnav{position:sticky;top:110px;align-self:start;}
.faqnav a{display:block;padding:8px 0;font-size:15px;color:var(--muted);text-decoration:none;}
.faqnav a:hover{color:var(--ink);}
.faqlayout{display:grid;grid-template-columns:220px 1fr;gap:56px;align-items:start;}
@media (max-width:900px){.faqlayout{grid-template-columns:1fr;gap:0;}.faqnav{display:none;}}

/* --- industry page --- */
.usecases{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;}
@media (max-width:820px){.usecases{grid-template-columns:1fr;}}
.uc{background:#fff;border-radius:var(--r-card);padding:28px 26px;box-shadow:var(--sh-card);}
.uc .tag{margin-bottom:12px;}
.uc p{margin-top:10px;font-size:16px;line-height:1.55;}
.scenario{display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:var(--r-card);overflow:hidden;
  box-shadow:var(--sh-card);background:#fff;}
@media (max-width:760px){.scenario{grid-template-columns:1fr;}}
.scenario>div{padding:30px 28px;}
.scenario .before{background:var(--mist);}
.scenario .after{background:linear-gradient(150deg,#e6f8fa,#cfeaf3);}
.scenario .lbl{font-size:12px;letter-spacing:.1em;color:var(--muted);margin-bottom:12px;}
.scenario p{font-size:16.5px;line-height:1.55;color:var(--ink);}

/* ============================================================
   Blog
   ============================================================ */

/* --- cards / grid (blog index, tag pages, author pages) --- */
.postgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
@media (max-width:980px){.postgrid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.postgrid{grid-template-columns:1fr;}}
.postcard{display:block;background:#fff;border-radius:var(--r-card);overflow:hidden;
  box-shadow:var(--sh-card);text-decoration:none;color:inherit;
  transition:transform .18s ease,box-shadow .18s ease;}
.postcard:hover{transform:translateY(-3px);box-shadow:var(--sh-float);}
.postcover{aspect-ratio:16/9;background:var(--mist);overflow:hidden;}
.postcover img{width:100%;height:100%;object-fit:cover;display:block;}
.postcover-generated svg{display:block;width:100%;height:100%;}
.postcard-body{padding:20px 22px 22px;}
.postcard-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px;}
.postcard h3{font-size:19px;line-height:1.32;margin:0;}
.postcard-excerpt{margin-top:8px;font-size:14.5px;line-height:1.55;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.postcard-meta{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:13px;color:var(--faint);}
.postcard-meta .dot{opacity:.6;}

.tagchip{display:inline-block;padding:4px 11px;border-radius:var(--r-pill);font-size:12px;
  font-weight:500;color:var(--ink);background:var(--mist);text-decoration:none;
  transition:background-color .15s ease;}
.tagchip:hover{background:rgba(0,61,84,.1);}
.tagchip-plain{color:var(--faint);cursor:default;}
.tagchip-plain:hover{background:var(--mist);}

.pin-badge{display:inline-block;margin-bottom:10px;padding:3px 10px;border-radius:var(--r-pill);
  font-size:11px;letter-spacing:.04em;font-weight:500;color:#0078a6;background:#e6f8fa;}
.draft-badge{color:#a6650a;background:#fdf0dc;margin-left:6px;}

.author-avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;
  flex:none;object-fit:cover;background:var(--mist);}
.author-avatar-fallback{background:linear-gradient(135deg,#5de0e6,#0078a6);color:#fff;font-weight:500;
  font-family:var(--sans);}

/* --- single post --- */
.post-head{max-width:820px;margin:0 auto;text-align:left;padding:120px 24px 0;}
.post-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px;}
.post-head h1{font-size:clamp(30px,4vw,46px);line-height:1.12;letter-spacing:-.02em;}
.post-byline{display:flex;align-items:center;gap:14px;margin-top:26px;padding-top:22px;
  border-top:1px solid var(--hair);}
.author-link{display:flex;align-items:center;gap:11px;text-decoration:none;color:inherit;}
.author-link span{display:flex;flex-direction:column;line-height:1.35;}
.author-link b{font-size:14.5px;font-weight:500;color:var(--ink);}
.author-link small{font-size:12.5px;color:var(--faint);}
.author-link:hover b{text-decoration:underline;}
.post-byline time{margin-left:auto;font-size:13.5px;color:var(--faint);}

.post-cover{max-width:960px;margin:36px auto 0;padding:0 24px;}
.post-cover img,.post-cover.postcover-generated{width:100%;border-radius:var(--r-card);
  overflow:hidden;aspect-ratio:16/7.4;}

.post-layout{max-width:960px;margin:44px auto 0;padding:0 24px var(--gap);
  display:grid;grid-template-columns:1fr 220px;gap:56px;align-items:start;}
@media (max-width:900px){.post-layout{grid-template-columns:1fr;}.toc{display:none;}}
.post-body img{max-width:100%;border-radius:var(--r-sm);margin:20px 0;}
.post-body blockquote{margin:24px 0;padding:4px 0 4px 20px;border-left:3px solid rgba(0,61,84,.18);
  font-style:italic;color:var(--muted);}
.post-body code{font-family:var(--mono);font-size:.9em;background:var(--mist);
  padding:2px 6px;border-radius:5px;}
.post-body hr{border:0;border-top:1px solid var(--hair);margin:36px 0;}

.toc{position:sticky;top:110px;align-self:start;}
.toc-h{font-size:12px;letter-spacing:.08em;color:var(--faint);margin-bottom:12px;text-transform:uppercase;}
.toc ul{list-style:none;margin:0;padding:0;border-left:1px solid var(--hair);}
.toc li{margin:0;}
.toc a{display:block;padding:7px 0 7px 16px;margin-left:-1px;border-left:2px solid transparent;
  font-size:13.5px;line-height:1.4;color:var(--muted);text-decoration:none;transition:color .15s ease,border-color .15s ease;}
.toc a:hover{color:var(--ink);}
.toc a.on{color:var(--ink);font-weight:500;border-left-color:var(--ink);}

.author-hero{display:flex;align-items:center;gap:20px;margin-top:8px;}
.author-hero h1{font-size:clamp(28px,3.6vw,40px);}

/* --- search: nav trigger + Ctrl/Cmd+K modal --- */
.searchbtn{display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:var(--r-pill);
  border:1px solid rgba(0,61,84,.14);background:rgba(255,255,255,.6);color:var(--muted);cursor:pointer;
  transition:border-color .16s ease,color .16s ease;}
.searchbtn:hover{color:var(--ink);border-color:rgba(0,61,84,.3);}
.searchbtn-label{font-size:13.5px;font-weight:500;}
/* Icon-only on desktop too, so both nav buttons fit inside the 1160px bar. */
.searchbtn-label{display:none;}.searchbtn{padding:0 11px;}

.searchModal{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-start;
  justify-content:center;padding:12vh 20px 0;}
.searchModal[hidden]{display:none;}
.searchModal-backdrop{position:absolute;inset:0;background:rgba(0,20,28,.44);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);}
.searchModal-panel{position:relative;width:100%;max-width:600px;background:#fff;border-radius:var(--r-elev);
  box-shadow:0 30px 70px -20px rgba(0,20,28,.5);overflow:hidden;max-height:66vh;display:flex;flex-direction:column;}
.searchModal-field{display:flex;align-items:center;gap:12px;padding:18px 20px;color:var(--faint);
  border-bottom:1px solid var(--hair);flex:none;}
.searchModal-field input{flex:1;border:0;outline:0;font-family:var(--sans);font-size:16px;color:var(--ink);
  background:transparent;}
.searchModal-field kbd{font-size:11px;color:var(--faint);border:1px solid var(--hair);border-radius:5px;padding:2px 6px;}
.searchModal-results{overflow-y:auto;padding:8px;}
.searchModal-result{display:block;padding:11px 12px;border-radius:12px;text-decoration:none;}
.searchModal-result b{display:block;font-size:14.5px;font-weight:500;color:var(--ink);}
.searchModal-result span{display:block;margin-top:3px;font-size:13px;line-height:1.4;color:var(--faint);}
.searchModal-result span mark{background:rgba(0,120,166,.16);color:var(--ink);border-radius:3px;}
.searchModal-result.active{background:var(--mist);}
.searchModal-empty{padding:22px 12px;font-size:14px;color:var(--faint);}
.searchModal-empty code{font-family:var(--mono);background:var(--mist);padding:1px 6px;border-radius:5px;}

/* ============================================================
   Industry-page redesign (draft) — HVAC, built from a content spec.
   Kept separate from the shared component names above since these are
   new patterns this one page needs; fold into the main system once the
   redesign is approved.
   ============================================================ */

.badgerow{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:22px;}
.badgerow .badge{margin:0;padding:7px 14px;font-size:12.5px;background:#fff;border:1px solid var(--hair);
  box-shadow:var(--sh-sm);}

/* placeholder marker — anything still needing a real value before launch */
.todo-fill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:8px;
  border:1px dashed #c99a3d;background:#fdf6e8;color:#8a5f10;font-family:var(--mono);font-size:.88em;}
.todo-fill::before{content:"⚠";font-size:.9em;}

/* live-demo band */
.demoband{position:relative;background:var(--ink);color:rgba(255,255,255,.78);overflow:hidden;text-align:center;}
.demoband::before{content:"";position:absolute;width:1100px;height:640px;left:50%;top:-260px;transform:translateX(-50%);
  background:radial-gradient(ellipse at center,rgba(93,224,230,.42) 0%,rgba(0,120,166,.2) 45%,rgba(0,61,84,0) 72%);filter:blur(70px);}
.demoband .wrap{position:relative;max-width:720px;}
.demoband h2{color:#fff;}
.demoband .lede{color:rgba(255,255,255,.68);margin-top:16px;}
.demo-number{display:inline-block;margin-top:32px;font-family:var(--serif);font-size:clamp(30px,5vw,52px);
  color:#fff;text-decoration:none;border-bottom:2px solid rgba(93,224,230,.5);padding-bottom:6px;
  letter-spacing:-.01em;transition:border-color .16s ease;}
.demo-number:hover{border-color:#5de0e6;}
.demoband .todo-fill{font-size:clamp(22px,3.6vw,34px);border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.08);color:#fff;}

/* stat rows (block 04) */
.statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:40px;}
@media (max-width:760px){.statgrid{grid-template-columns:1fr;}}
.statgrid .rec{padding-top:0;}
.statcite{display:block;margin-top:10px;font-size:12.5px;color:var(--faint);font-style:italic;line-height:1.45;}
.statcite a{color:var(--faint);}

/* call-by-call cards (block 06) */
.callcards{display:flex;flex-direction:column;gap:16px;margin-top:36px;}
.callcard{background:#fff;border-radius:var(--r-card);box-shadow:var(--sh-card);padding:26px 28px;}
.callcard-meta{font-size:12px;letter-spacing:.06em;color:var(--faint);text-transform:uppercase;}
.callcard-who{display:block;margin-top:6px;font-size:17px;font-weight:500;color:var(--ink);font-family:var(--sans);}
.callcard-body{margin-top:10px;font-size:15.5px;line-height:1.6;color:var(--body);}
.callcard-foot{margin-top:16px;padding-top:14px;border-top:1px solid var(--hair);font-size:13.5px;color:var(--muted);}
.callcard-foot b{color:var(--ink);font-weight:500;}
.callcard.warn{background:#fff6f5;box-shadow:0 1px 2px rgba(160,30,20,.06),0 14px 30px -14px rgba(160,30,20,.22);
  border:1px solid #f3c9c4;}
.callcard.warn .callcard-meta{color:#b03a2e;}
.callcard.warn .callcard-foot{border-top-color:#f3c9c4;}

/* reads/writes (block 07) */
.reviewflag{display:inline-block;margin-bottom:18px;padding:6px 13px;border-radius:8px;
  background:#fdf0dc;color:#8a5f10;font-size:12.5px;font-weight:500;border:1px solid #ecd3a0;}
.rwgrid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:36px;}
@media (max-width:700px){.rwgrid{grid-template-columns:1fr;}}
.rwgrid h3{font-size:15px;}
.rwgrid ul{margin:14px 0 0;padding-left:19px;}
.rwgrid li{margin-bottom:10px;font-size:15px;line-height:1.5;color:var(--body);}
.rwtable{width:100%;border-collapse:collapse;margin-top:20px;font-size:14.5px;}
.rwtable th{text-align:left;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);
  font-weight:500;padding:0 16px 10px 0;}
.rwtable td{padding:16px 16px 16px 0;border-top:1px solid var(--hair);vertical-align:top;line-height:1.55;color:var(--body);}
.rwtable td:first-child{width:220px;font-weight:500;color:var(--ink);font-family:var(--sans);}

/* approval line (block 08) */
.approvaltable{width:100%;border-collapse:collapse;margin-top:32px;}
.approvaltable th{text-align:left;font-size:13px;color:var(--faint);font-weight:500;padding:0 20px 12px 0;
  border-bottom:1px solid var(--hair);}
.approvaltable td{padding:12px 20px 12px 0;font-size:15px;line-height:1.5;color:var(--body);
  border-bottom:1px solid var(--hair);vertical-align:top;}
.approvaltable td:first-child{color:var(--ink);}
@media (max-width:700px){.approvaltable,.approvaltable tbody,.approvaltable tr{display:block;}
  .approvaltable th{display:none;}
  .approvaltable td{display:block;border-bottom:0;padding:8px 0;}
  .approvaltable tr{padding:14px 0;border-bottom:1px solid var(--hair);}
  .approvaltable td:first-child::before{content:"Agent handles: ";font-size:12px;color:var(--faint);display:block;}
  .approvaltable td:last-child::before{content:"Person joins: ";font-size:12px;color:var(--faint);display:block;}}
.boundarypanel{margin-top:32px;padding:32px 34px;border-radius:var(--r-card);background:#fff6f5;
  border:1.5px solid #f0bcb5;}
.boundarypanel p{font-size:15.5px;line-height:1.6;color:#5c2318;}
.boundarypanel p+p{margin-top:16px;}
.boundarypanel b{color:#8a1f10;}
.boundary-close{margin-top:22px;font-size:14.5px;color:var(--muted);font-style:italic;}

/* onboarding timeline (block 09) */
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:40px;}
@media (max-width:820px){.timeline{grid-template-columns:1fr;}}
.timestep{position:relative;padding-top:52px;}
.timestep-n{position:absolute;top:0;left:0;width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,var(--aqua),var(--deep-blue));color:#fff;font-family:var(--sans);
  font-size:15px;font-weight:500;display:flex;align-items:center;justify-content:center;}
.timestep h3{font-size:17px;}
.timestep p{margin-top:9px;font-size:15px;line-height:1.55;color:var(--body);}

/* integrations list (block 11) */
.intlist{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;}
.intlist span{display:inline-block;padding:7px 14px;border-radius:var(--r-pill);font-size:13.5px;
  font-weight:500;color:var(--ink);background:var(--mist);}

/* author card (block 14) */
.authorcard{display:flex;gap:20px;align-items:flex-start;margin-top:8px;padding:30px 32px;
  background:#fff;border-radius:var(--r-card);box-shadow:var(--sh-card);}
.authorcard-av{width:56px;height:56px;border-radius:50%;flex:none;color:#fff;font-size:20px;font-weight:500;
  font-family:var(--sans);background:linear-gradient(135deg,var(--aqua),var(--deep-blue));
  display:flex;align-items:center;justify-content:center;}
.authorcard b{display:block;font-size:16.5px;font-weight:500;color:var(--ink);}
.authorcard em{display:block;font-style:normal;font-size:13.5px;color:var(--faint);margin-top:2px;}
.authorcard p{margin-top:12px;font-size:15px;line-height:1.55;color:var(--body);}
.authorcard a.tlink{margin-top:12px;}
@media (max-width:560px){.authorcard{flex-direction:column;}}

/* Blank placeholder homepage (content/pages/index.main.html) — keeps the
   footer from riding up under the nav until the new page is built. */
.home-blank{min-height:60vh;}

/* PMC demo pages: just the widget, centred in the space between nav and footer */
/* Bare single-screen layout (layout.mjs page({bare:true})): the gradient
   fills the viewport, the logo sits at the top, the content is centred, and
   the page never scrolls. */
body.bare{margin:0;height:100vh;height:100dvh;overflow:hidden;background:var(--hv-cta-gradient);}
body.bare main{position:relative;height:100%;box-sizing:border-box;padding:88px 16px 24px;background:none;
  display:flex;flex-direction:column;align-items:center;justify-content:center;}
.bare-logo{position:absolute;top:28px;left:50%;transform:translateX(-50%);}
.bare-logo svg{width:30px;height:30px;}
.bare-logo span{color:#fff;font-size:27px;}
.hv2-demoband.pmc-demo{width:100%;padding:0;margin:0;background:none;overflow:visible;}
.pmc-demo .hv2-wrap{width:100%;}
/* With nothing else on the page, the widget is scaled up from the
   industry-page size (hvac-v2.css) so it carries the space on its own. */
.pmc-demo .hv2-widget{max-width:520px;margin:0 auto;padding:56px 48px 52px;}
.pmc-demo .hv2-widget-agent{margin-top:0;padding:10px 22px;}
.pmc-demo .hv2-widget-agent b{font-size:17px;letter-spacing:.01em;}
.pmc-demo .hv2-widget-micwrap{margin-top:44px;}
.pmc-demo .hv2-widget-mic{width:128px;height:128px;}
.pmc-demo .hv2-widget-mic-icon svg{width:40px;height:40px;}
.pmc-demo .hv2-widget-miclabel{margin-top:28px;font-size:17px;}
.pmc-demo .hv2-widget-timer:not([hidden]){margin-top:12px;font-size:15px;}
.pmc-demo .hv2-widget-msg{font-size:15px;}
.pmc-demo .hv2-demoband-legal{margin-top:22px;font-size:13px;}
@media (max-height:700px){
  body.bare main{padding-top:76px;}
  .bare-logo{top:22px;}
  .pmc-demo .hv2-widget{padding:40px 36px 36px;}
  .pmc-demo .hv2-widget-micwrap{margin-top:30px;}
  .pmc-demo .hv2-widget-mic{width:108px;height:108px;}
  .pmc-demo .hv2-widget-miclabel{margin-top:20px;}
}
@media (max-width:560px){
  .pmc-demo .hv2-widget{padding:44px 24px 40px;}
  .pmc-demo .hv2-widget-agent b{font-size:15.5px;}
  .pmc-demo .hv2-widget-micwrap{margin-top:36px;}
  .pmc-demo .hv2-widget-mic{width:112px;height:112px;}
  .pmc-demo .hv2-widget-mic-icon svg{width:36px;height:36px;}
  .pmc-demo .hv2-widget-miclabel{font-size:16px;}
}
@media (max-width:400px){.pmc-demo .hv2-widget-miclabel{font-size:15px;}}