/*
  MyEmployment shared stylesheet. Plain CSS, no build step.
  Locked tokens and fonts per Master Brief v2, Section 6.3.
  Restyle freely. Do not reword the copy in the page files.
  Component class names follow Master Brief v2, Section 6.2.
*/

/* Self-hosted fonts (Master Brief v29, P5). SIL Open Font License, see OFL-*.txt in /assets/fonts/. */
@font-face{font-family:'Newsreader';font-style:normal;font-weight:500 600;font-display:swap;src:url(/assets/fonts/newsreader-normal.woff2) format('woff2')}
@font-face{font-family:'Newsreader';font-style:italic;font-weight:500;font-display:swap;src:url(/assets/fonts/newsreader-italic.woff2) format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 700;font-display:swap;src:url(/assets/fonts/inter.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-400.woff2) format('woff2')}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/ibm-plex-mono-500.woff2) format('woff2')}

:root{
  --navy:#0b1a22;
  --navy-2:#102630;
  --lavender:#f5f4fb;
  --lavender-2:#eeedf8;
  --indigo:#4c46c8;
  --indigo-deep:#342f9f;
  --teal:#2ab3a5;
  --rust:#b45a35;
  --ink:#1b2931;

  /* derived, not new colors */
  --ink-soft:#4d5d66;
  --on-dark:#f5f4fb;
  --on-dark-soft:rgba(245,244,251,.74);
  --on-dark-faint:rgba(245,244,251,.5);
  --rule:rgba(52,47,159,.16);
  --rule-dark:rgba(245,244,251,.14);
  --teal-deep:#1d8076;

  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;

  --wrap:1160px;
  --gutter:clamp(20px,4vw,40px);
  --header-h:68px;
  --radius-s:6px;
  --radius-m:12px;
}

*,*::before,*::after{box-sizing:border-box}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-h) + 16px + env(safe-area-inset-top,0px));
}
body{
  margin:0;
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  color:var(--ink);
  background:var(--lavender);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
strong,b{font-weight:600}

.wrap{width:min(var(--wrap),100% - 2*var(--gutter));margin-inline:auto}
.skip{position:absolute;left:-9999px;top:0;background:var(--teal);color:var(--navy);padding:10px 14px;z-index:200}
.skip:focus{left:12px;top:12px}
:focus-visible{outline:3px solid var(--teal);outline-offset:3px}

/* ---------- type ---------- */
h1,h2{font-family:var(--serif);font-weight:600;letter-spacing:-.018em;text-wrap:balance}
h1{font-size:clamp(38px,4.3vw,60px);line-height:1.05}
h2{font-size:clamp(31px,3.5vw,48px);line-height:1.1;max-width:24ch}
h2 em,h1 em{font-style:italic;font-weight:500;color:inherit}
h3{font-size:19px;line-height:1.35;font-weight:600}
.lede{font-size:clamp(18px,1.4vw,20px);line-height:1.62;max-width:62ch;margin-top:22px;color:var(--ink-soft)}
.dark .lede{color:var(--on-dark-soft)}

/* numbered eyebrow, locked pattern: "01 What happens today" */
.eyebrow{
  display:block;font-family:var(--mono);font-size:13px;font-weight:500;
  letter-spacing:.02em;color:var(--indigo);margin-bottom:16px;
}
.dark .eyebrow{color:var(--teal)}

/* statistic with its source directly under the claim */
.src{display:block;font-family:var(--mono);font-size:12px;line-height:1.55;color:var(--ink-soft);margin-top:10px}
.dark .src{color:var(--on-dark-faint)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:48px;padding:12px 22px;border-radius:var(--radius-s);
  font:600 15px/1.2 var(--sans);text-decoration:none;cursor:pointer;
  border:1px solid transparent;background:var(--teal);color:var(--navy);
  transition:background-color .15s ease,border-color .15s ease;
}
.btn:hover{background:#3cc3b5}
.btn-ghost{background:transparent;color:var(--on-dark);border-color:var(--rule-dark)}
.btn-ghost:hover{background:rgba(245,244,251,.08)}
.btn-indigo{background:var(--indigo);color:#fff}
.btn-indigo:hover{background:var(--indigo-deep)}

/* ---------- sections ---------- */
.section{padding:clamp(64px,8vw,104px) 0}
.section.dark{background:var(--navy);color:var(--on-dark)}
.section.alt{background:var(--lavender-2)}

/* ---------- header and nav ---------- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(11,26,34,.94);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--rule-dark);
  padding-top:env(safe-area-inset-top,0px);
}
.site-header .wrap{height:var(--header-h);display:flex;align-items:center;gap:24px}
.brand{font:600 22px/1 var(--serif);color:var(--on-dark);text-decoration:none;white-space:nowrap;letter-spacing:-.01em}
.brand span{color:var(--teal)}
.site-nav{margin-left:auto}
.site-nav ul{display:flex;gap:18px}
.site-nav a{font-size:13.5px;color:var(--on-dark-soft);text-decoration:none;white-space:nowrap}
.site-nav a:hover{color:var(--on-dark)}
.nav-cta{min-height:40px;padding:9px 16px;font-size:14px;white-space:nowrap}
.nav-toggle{
  display:none;margin-left:auto;background:none;border:1px solid var(--rule-dark);
  color:var(--on-dark);border-radius:var(--radius-s);padding:9px 12px;font:500 14px var(--sans);cursor:pointer;
}

/* ---------- hero ---------- */
.hero{
  background:var(--navy);color:var(--on-dark);
  padding:clamp(56px,7vw,96px) 0 0;
  position:relative;overflow:hidden;
}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,72px);align-items:end}
.hero-copy{padding-bottom:clamp(48px,6vw,80px);align-self:center}
.hero h1{max-width:17ch}
.hero .stat .src{margin-top:14px}
.hero .beat{font:500 clamp(22px,2.3vw,30px)/1.25 var(--serif);margin-top:28px;color:var(--on-dark)}
.hero .lede{max-width:56ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.cred{font-family:var(--mono);font-size:12.5px;line-height:1.6;color:var(--on-dark-faint);margin-top:22px;max-width:58ch}

/* the phone sits on a lavender plinth that rises out of the trust bar */
.hero-figure{position:relative;align-self:end;justify-self:center;width:min(320px,100%)}
.hero-figure::before{
  content:"";position:absolute;left:-14%;right:-14%;bottom:0;height:62%;
  background:var(--navy-2);border:1px solid var(--rule-dark);border-bottom:0;
  border-radius:200px 200px 0 0;
}
.phone{position:relative}
.phone img{width:100%;border-radius:36px;filter:drop-shadow(0 28px 60px rgba(0,0,0,.45))}
.hero .phone{margin-bottom:-2px}
.phone figcaption{font-family:var(--mono);font-size:12.5px;color:var(--on-dark-faint);text-align:center;padding:14px 0 18px;position:relative}

/* ---------- trust bar ---------- */
.trust-bar{background:var(--navy-2);color:var(--on-dark);border-top:1px solid var(--rule-dark)}
.trust-bar ul{display:grid;grid-template-columns:repeat(4,1fr)}
.trust-bar li{padding:22px 20px;border-left:1px solid var(--rule-dark)}
.trust-bar li:first-child{border-left:0;padding-left:0}
.trust-bar strong{display:block;font-size:15px;color:var(--on-dark)}
.trust-bar span{font-size:13px;line-height:1.5;color:var(--on-dark-faint)}

/* ---------- integrations logo band (employer pages only) ---------- */
.logo-band{background:var(--lavender);padding:clamp(56px,7vw,88px) 0}
.logo-band h2{font-size:clamp(27px,2.8vw,38px);max-width:24ch}
.logo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-top:36px}
.logo-grid li{
  background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);
  height:92px;display:flex;align-items:center;justify-content:center;padding:18px 22px;
}
.logo-grid img{max-height:44px;max-width:100%;width:auto}
.fine{font-size:13px;line-height:1.6;color:var(--ink-soft);margin-top:18px;max-width:80ch}

/* ---------- quote band ---------- */
.quote-band{background:var(--lavender-2);padding:clamp(56px,7vw,88px) 0}
.quote-band .wrap{display:grid;grid-template-columns:minmax(0,1fr);gap:0;max-width:880px}
.quote-band blockquote{font:500 clamp(22px,2.3vw,31px)/1.38 var(--serif);color:var(--ink);text-indent:-.42em}
.quote-band cite{display:block;font-style:normal;font-size:14.5px;line-height:1.6;color:var(--ink-soft);margin-top:22px;max-width:66ch}
.quote-band cite b{display:block;color:var(--ink);font-size:15px}
.quote-band a{color:var(--indigo-deep);text-underline-offset:3px}

/* ---------- 01 what happens today ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:48px;border-top:1px solid var(--rule-dark)}
.step{padding:26px 24px 8px 0}
.step+.step{padding-left:24px;border-left:1px solid var(--rule-dark)}
.step-num{display:block;font-family:var(--mono);font-size:13px;color:var(--teal);margin-bottom:14px}
.step h3{color:var(--on-dark);margin-bottom:10px}
.step p{font-size:15px;color:var(--on-dark-soft)}

/* the fee path diagram: the page's one animated moment */
.fee-paths{margin-top:64px;display:grid;gap:18px}
.fee-path{border:1px solid var(--rule-dark);border-radius:var(--radius-m);padding:26px 26px 22px;background:var(--navy-2)}
.fee-path-label{font-family:var(--mono);font-size:13px;color:var(--rust);margin-bottom:22px}
.fee-path.next .fee-path-label{color:var(--teal)}
.track{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.track::before,.track::after{
  content:"";position:absolute;left:8px;right:8px;top:7px;height:2px;background:var(--rule-dark);
}
.track::after{right:auto;width:calc(100% - 16px);background:var(--rust);transform-origin:left center;transform:scaleX(1)}
.fee-path.next .track::after{background:var(--teal)}
.node{position:relative;padding-top:30px}
.node::before{
  content:"";position:absolute;left:0;top:0;width:16px;height:16px;border-radius:50%;
  background:var(--navy);border:2px solid var(--on-dark-faint);
}
.node.end::before{border-color:var(--rust);background:var(--rust)}
.fee-path.next .node.end::before{border-color:var(--teal);background:var(--teal)}
.node-text{display:block;font-size:15px;line-height:1.4;color:var(--on-dark)}
.node-link{display:block;font-family:var(--mono);font-size:12px;color:var(--on-dark-faint);margin-bottom:4px}
.node.end .node-text{font-weight:600}
.fee-path-note{margin-top:22px;font-size:15px;color:var(--on-dark-soft);max-width:72ch}
.turn{margin-top:56px;font:500 clamp(24px,2.6vw,34px)/1.25 var(--serif);max-width:28ch;color:var(--on-dark)}

/* reveal: only runs when site.js marks the diagram as armed */
.fee-paths.armed .track::after{transform:scaleX(0);transition:transform 1.1s cubic-bezier(.5,0,.2,1)}
.fee-paths.armed .fee-path.next .track::after{transition-delay:.9s}
.fee-paths.armed .node{opacity:0;transform:translateY(6px);transition:opacity .4s ease,transform .4s ease}
.fee-paths.armed .fee-path .node:nth-child(1){transition-delay:.05s}
.fee-paths.armed .fee-path .node:nth-child(2){transition-delay:.35s}
.fee-paths.armed .fee-path .node:nth-child(3){transition-delay:.65s}
.fee-paths.armed .fee-path .node:nth-child(4){transition-delay:.95s}
.fee-paths.armed .fee-path.next .node:nth-child(1){transition-delay:.95s}
.fee-paths.armed .fee-path.next .node:nth-child(2){transition-delay:1.25s}
.fee-paths.armed .fee-path.next .node:nth-child(3){transition-delay:1.55s}
.fee-paths.armed .fee-path.next .node:nth-child(4){transition-delay:1.85s}
.fee-paths.armed.shown .track::after{transform:scaleX(1)}
.fee-paths.armed.shown .node{opacity:1;transform:none}

/* ---------- 02 revenue ---------- */
.formula{font:600 clamp(36px,4.6vw,60px)/1.05 var(--serif);letter-spacing:-.02em;color:var(--indigo-deep)}
.formula .x{color:var(--teal-deep);font-weight:500;padding:0 .14em}
.inputs{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.input-card{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:24px}
.input-card .val{display:block;font:600 34px/1 var(--serif);color:var(--ink);margin-bottom:12px}
.input-card h3{font-size:16px;margin-bottom:6px}
.input-card p{font-size:14.5px;color:var(--ink-soft)}

.calc-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:16px;margin-top:16px}
.calc{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:clamp(22px,3vw,32px)}
.calc h3{font:600 23px/1.2 var(--serif)}
.hint{font-size:14px;color:var(--ink-soft);margin:6px 0 20px}
.field{display:grid;gap:6px;margin-bottom:16px}
.field label{font-size:13.5px;font-weight:600}
.field input,.field select{
  font:inherit;font-size:17px;padding:10px 12px;width:100%;
  border:1px solid rgba(52,47,159,.3);border-radius:var(--radius-s);background:var(--lavender);color:var(--ink);
}
.field input:focus-visible,.field select:focus-visible{background:#fff;outline-offset:1px}
.field .note{font-size:12.5px;line-height:1.5;color:var(--ink-soft)}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.result{border-top:1px solid var(--rule);padding-top:18px;margin-top:4px}
.r-label{font-size:13.5px;color:var(--ink-soft)}
.result .r-value{font:600 clamp(36px,4vw,50px)/1.05 var(--serif);color:var(--indigo-deep);margin:4px 0 14px;font-variant-numeric:tabular-nums}
.result .r-sub{font:600 20px/1.3 var(--serif);margin:2px 0 12px}
.result .poolnote{border-left:3px solid var(--indigo);padding:10px 14px;margin:0 0 10px;font-size:14px;font-weight:500;color:var(--indigo-deep);background:rgba(76,70,200,.06)}
.result p{font-size:14.5px;color:var(--ink-soft)}

.side-dark{background:var(--navy);color:var(--on-dark);border-radius:var(--radius-m);padding:clamp(24px,3vw,34px);display:flex;flex-direction:column;justify-content:space-between;gap:22px}
.side-dark .kicker{font-size:14px;color:var(--on-dark-soft)}
.side-dark .big{font:600 clamp(30px,3.3vw,44px)/1.08 var(--serif);margin-top:6px}
.side-dark p{font-size:14.5px;color:var(--on-dark-soft)}
.side-dark .side-note{border-top:1px solid var(--rule-dark);padding-top:14px;font-family:var(--mono);font-size:12.5px;color:var(--on-dark-faint)}
.cta-row{margin-top:28px}
.section.alt .alt-link{display:inline-block;margin-top:18px;color:var(--indigo-deep);font-size:15.5px;font-weight:600;text-underline-offset:3px}
.section.alt .alt-link:hover{color:var(--indigo)}

/* consortium: second and smaller, below the calculator */
.consortium{margin-top:56px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,48px);border-top:1px solid var(--rule);padding-top:40px}
.consortium h3{font:600 clamp(22px,2.2vw,28px)/1.2 var(--serif);max-width:26ch}
.consortium p{font-size:15.5px;color:var(--ink-soft);margin-top:12px;max-width:62ch}
.consortium .boundary{color:var(--ink);font-weight:500}
.mini-calc{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:24px}
.mini-out{display:grid;grid-template-columns:1fr auto;gap:8px 16px;border-top:1px solid var(--rule);padding-top:14px;font-size:14.5px}
.mini-out dt{color:var(--ink-soft)}
.mini-out dd{margin:0;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.mini-out .total{color:var(--indigo-deep);font:600 22px/1.2 var(--serif)}

/* ---------- 03 employee benefit ---------- */
.employee-grid{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:start;margin-top:44px}
.employee .phone{position:sticky;top:calc(var(--header-h) + 24px)}
.employee .lede{margin-top:0}
.points{margin-top:28px;border-top:1px solid var(--rule-dark)}
.points li{padding:18px 0;border-bottom:1px solid var(--rule-dark)}
.points strong{display:block;color:var(--on-dark);margin-bottom:4px}
.points p{font-size:15px;color:var(--on-dark-soft)}
.points li.strict strong{color:var(--teal)}

/* ---------- 04 how it connects ---------- */
.opts{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:44px}
.opt{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:28px;border-top:4px solid var(--teal)}
.opt+.opt{border-top-color:var(--indigo)}
.opt .lbl{display:block;font-family:var(--mono);font-size:13px;color:var(--indigo);margin-bottom:10px}
.opt h3{font:600 22px/1.25 var(--serif);margin-bottom:10px}
.opt p{font-size:15px;color:var(--ink-soft)}
.rows{margin-top:36px;border-top:1px solid var(--rule)}
.rows li{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;padding:20px 0;border-bottom:1px solid var(--rule)}
.rows h3{font-size:16px}
.rows p{font-size:15.5px;color:var(--ink-soft)}
.facts{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.facts li{background:var(--lavender-2);border-radius:var(--radius-m);padding:22px;font-size:14.5px;color:var(--ink-soft)}
.facts b{display:block;color:var(--ink);font-size:15.5px;margin-bottom:6px}

/* ---------- security and compliance strip ---------- */
.security-strip{background:var(--navy-2);color:var(--on-dark);padding:40px 0;border-top:1px solid var(--rule-dark)}
.security-strip .wrap{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:32px;align-items:start}
.security-strip h2{font:500 13px/1.4 var(--mono);color:var(--teal);max-width:none;letter-spacing:.02em}
.sec-items{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.sec-items li{font-size:14px;line-height:1.55;color:var(--on-dark-soft)}
.sec-items b{display:block;color:var(--on-dark);font-size:15px;margin-bottom:4px}
.sec-link{font-size:14px;font-weight:600;color:var(--teal);white-space:nowrap;text-underline-offset:3px}

/* ---------- 05 team Q and A (not marked up as FAQPage) ---------- */
.team-list{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:0 48px}
.team-item{padding:22px 0;border-top:1px solid var(--rule-dark)}
.team-item h3{color:var(--on-dark);margin-bottom:8px}
.team-item .who{display:block;font-family:var(--mono);font-size:13px;color:var(--teal);margin-bottom:6px;font-weight:500}
.team-item p{font-size:15px;color:var(--on-dark-soft)}

/* ---------- 06 FAQ ---------- */
.faq-layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(24px,5vw,72px);margin-top:12px}
.faq-intro{position:sticky;top:calc(var(--header-h) + 24px);align-self:start}
.faq-group+.faq-group{margin-top:40px}
.group-label{font-family:var(--mono);font-size:13px;color:var(--indigo);margin-bottom:6px}
.faq-item{border-top:1px solid var(--rule)}
.faq-group .faq-item:last-child{border-bottom:1px solid var(--rule)}
.faq-q{font-size:17px;line-height:1.4;font-weight:600;margin:0}
.faq-q button{
  all:unset;box-sizing:border-box;display:flex;justify-content:space-between;gap:16px;width:100%;
  padding:18px 0;cursor:pointer;
}
.faq-q button:focus-visible{outline:3px solid var(--teal);outline-offset:2px}
.faq-q .mark{flex:none;width:18px;height:18px;position:relative;margin-top:3px}
.faq-q .mark::before,.faq-q .mark::after{content:"";position:absolute;left:3px;right:3px;top:8px;height:2px;background:var(--indigo)}
.faq-q .mark::after{transform:rotate(90deg);transition:transform .2s ease}
.faq-q button[aria-expanded="true"] .mark::after{transform:rotate(0)}
.faq-a{padding:0 0 20px;color:var(--ink-soft);font-size:15.5px;max-width:70ch}
.faq-a[hidden]{display:none}

/* ---------- close and form ---------- */
.cta-band{background:var(--navy);color:var(--on-dark);padding:clamp(64px,8vw,104px) 0}
.cta-band h2{max-width:22ch}
.cta-band .aside{font-size:16px;color:var(--on-dark-faint);margin-top:14px;max-width:62ch}
.form-embed{margin-top:40px;background:#fff;border-radius:var(--radius-m);padding:8px}
.form-embed iframe{display:block;width:100%;height:1100px;border:0;border-radius:8px}

/* ---------- footer ---------- */
.site-footer{background:var(--navy);color:var(--on-dark-faint);border-top:1px solid var(--rule-dark);padding:48px 0 calc(40px + env(safe-area-inset-bottom,0px));font-size:14px}
.foot-cols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px}
.foot-cols h2{font:500 13px/1.4 var(--mono);color:var(--on-dark-soft);letter-spacing:.02em;margin-bottom:12px;max-width:none}
.foot-cols li+li{margin-top:8px}
.foot-legal{margin-top:28px}
.site-footer a{color:var(--on-dark-soft);text-decoration:none}
.site-footer a:hover{color:var(--on-dark)}
.foot-line{margin-top:36px;padding-top:20px;border-top:1px solid var(--rule-dark);font-family:var(--mono);font-size:12.5px;line-height:1.7;max-width:80ch}

/* mobile sticky CTA */
.mobile-cta{display:none}


/* ==========================================================
   Verifiers page components (added chat 3).
   Consumer-flow phone screens are HTML, not images, so they stay sharp and editable.
   The .phone frame is shared; screens are never shared between models.
   ========================================================== */

/* HTML phone: a bezel around a live screen; type scales with the phone width */
.ui-phone{
  container-type:inline-size;position:relative;width:100%;aspect-ratio:9/19;
  background:#060f14;border-radius:40px;padding:10px;
  box-shadow:0 0 0 1px rgba(245,244,251,.12) inset;
  filter:drop-shadow(0 28px 60px rgba(0,0,0,.42));
}
.ui-screen{
  height:100%;border-radius:31px;overflow:hidden;background:#fff;color:var(--ink);
  display:flex;flex-direction:column;font-family:var(--sans);font-size:4.3cqw;line-height:1.38;
}
.ui-status{display:flex;justify-content:space-between;padding:4.6cqw 7cqw 2cqw;font-size:3.6cqw;font-weight:600}
.ui-status i{font-style:normal;letter-spacing:.1em;opacity:.55}
.ui-bar{display:flex;align-items:center;justify-content:space-between;padding:2.4cqw 6cqw 3.6cqw;border-bottom:1px solid var(--rule)}
.ui-bar b{font:600 4.9cqw/1 var(--serif)}
.ui-bar b span{color:var(--teal-deep)}
.ui-bar small{font-size:3.3cqw;color:var(--ink-soft)}
.ui-body{flex:1;display:flex;flex-direction:column;gap:3.4cqw;padding:5cqw 6cqw 6cqw;overflow:hidden}
.ui-title{font:600 7cqw/1.15 var(--serif);letter-spacing:-.01em}
.ui-muted{color:var(--ink-soft);font-size:3.8cqw}
.ui-card{background:var(--lavender);border:1px solid var(--rule);border-radius:3.4cqw;padding:3.8cqw 4.2cqw}
.ui-card b{display:block;font-size:4.3cqw}
.ui-label{display:block;font-family:var(--mono);font-size:3.2cqw;color:var(--indigo);margin-bottom:1.6cqw}
.ui-list li{display:flex;gap:2.6cqw;align-items:flex-start;padding:1.5cqw 0;font-size:3.9cqw}
.ui-list li::before{content:"";flex:none;width:3.6cqw;height:3.6cqw;margin-top:.9cqw;border-radius:50%;background:var(--teal)}
.ui-list.off li{color:var(--ink-soft)}
.ui-list.off li::before{background:transparent;border:1px solid var(--ink-soft)}
.ui-btn{display:block;text-align:center;border-radius:2.6cqw;padding:3.4cqw;font-weight:600;font-size:4cqw;background:var(--indigo);color:#fff}
.ui-btn.ghost{background:transparent;color:var(--indigo-deep);border:1px solid var(--rule)}
.ui-spacer{flex:1}
.ui-search{border:1.5px solid var(--indigo);border-radius:2.6cqw;padding:3cqw 3.6cqw;color:var(--ink-soft);font-size:3.8cqw}
.ui-chips{display:flex;gap:2cqw}
.ui-chips span{border:1px solid var(--rule);border-radius:99px;padding:1.2cqw 3.2cqw;font-size:3.4cqw}
.ui-chips span:first-child{background:var(--indigo);border-color:var(--indigo);color:#fff}
.ui-rows li{display:flex;justify-content:space-between;align-items:center;gap:3cqw;padding:3cqw 0;border-bottom:1px solid var(--rule)}
.ui-rows li:first-child{border-top:1px solid var(--rule)}
.ui-rows b{display:block;font-size:4cqw}
.ui-rows small{display:block;font-size:3.3cqw;color:var(--ink-soft)}
.ui-tag{flex:none;font-family:var(--mono);font-size:3cqw;color:var(--teal-deep);background:rgba(42,179,165,.12);border-radius:99px;padding:.8cqw 2.4cqw}
.ui-notify{background:var(--navy);color:var(--on-dark);border-radius:3.4cqw;padding:4cqw 4.4cqw}
.ui-notify small{display:block;font-family:var(--mono);font-size:3.1cqw;color:var(--teal);margin-bottom:1.4cqw}
.ui-check{width:15cqw;height:15cqw;border-radius:50%;background:var(--teal);position:relative;margin-top:4cqw}
.ui-check::after{content:"";position:absolute;left:5cqw;top:3.4cqw;width:3.8cqw;height:6.8cqw;border:solid var(--navy);border-width:0 1.2cqw 1.2cqw 0;transform:rotate(45deg)}
.hero .ui-phone{width:100%}
.hero-figure.ui-fig{width:min(300px,100%)}
.hero-figure.ui-fig .ui-phone{margin-bottom:0}

/* 02 how it works: four phones in sequence */
.flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.4vw,32px);margin-top:48px;counter-reset:none}
.flow-step .ui-phone{max-width:260px}
.flow-step .step-num{margin-top:26px}
.flow-step h3{color:var(--on-dark);margin-bottom:8px}
.flow-step > p{font-size:15px;color:var(--on-dark-soft)}
.flow-note{margin-top:40px;padding-top:22px;border-top:1px solid var(--rule-dark);font-size:15.5px;color:var(--on-dark-soft);max-width:72ch}
.flow-note b{color:var(--on-dark)}

/* 03 coverage: phone beside the source list */
.split{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:clamp(32px,6vw,80px);align-items:start;margin-top:44px}
.split .rows{margin-top:0}
.split .ui-phone{filter:drop-shadow(0 22px 44px rgba(11,26,34,.22))}
.split .phone figcaption{color:var(--ink-soft)}
.sum-line{margin-top:28px;font:500 clamp(20px,2vw,25px)/1.35 var(--serif);max-width:38ch}

/* 04 what you receive: a sample report */
.report-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start;margin-top:44px}
.report-grid .points{margin-top:0}
.specimen{background:var(--lavender);color:var(--ink);border-radius:var(--radius-m);padding:clamp(22px,3vw,32px);font-size:15px}
.specimen-head{border-bottom:1px solid var(--rule);padding-bottom:14px;margin-bottom:6px}
.specimen-head b{display:block;font:600 22px/1.2 var(--serif)}
.specimen-head span{font-size:14px;color:var(--ink-soft)}
.specimen dl{display:grid;grid-template-columns:minmax(0,1fr) auto;margin:0}
.specimen dt,.specimen dd{padding:9px 0;border-bottom:1px solid var(--rule)}
.specimen dt{color:var(--ink-soft)}
.specimen dd{margin:0;text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.specimen dt.sum,.specimen dd.sum{border-bottom:0;padding-top:14px;color:var(--indigo-deep);font:600 18px/1.3 var(--serif)}
.specimen .withheld{margin-top:16px;padding:12px 14px;border:1px dashed rgba(52,47,159,.35);border-radius:var(--radius-s);font-size:14px;color:var(--ink-soft)}
.specimen .withheld b{color:var(--ink)}
.specimen .src{margin-top:14px;color:var(--ink-soft)}

.cta-band .alt-link{display:inline-block;margin-top:20px;color:var(--on-dark-soft);font-size:15.5px;text-underline-offset:3px}
.cta-band .alt-link:hover{color:var(--on-dark)}

@media (max-width:1020px){
  .flow{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(230px,42%);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px;margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter)}
  .flow-step{scroll-snap-align:start}
  .split,.report-grid{grid-template-columns:1fr}
  .split .phone{max-width:300px}
}
@media (max-width:720px){
  .flow{grid-auto-columns:74%}
  .specimen dl{grid-template-columns:1fr}
  .specimen dt{border-bottom:0;padding-bottom:0;font-size:13.5px}
  .specimen dd{text-align:left;padding-top:2px}
  .specimen dt.sum{padding-bottom:0}
  .specimen dd.sum{padding-top:2px}
  .hero-figure.ui-fig{width:min(280px,80%)}
}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .site-nav{display:none}
  .nav-toggle{display:inline-flex}
  .site-header .nav-cta{margin-left:0}
  .site-nav.open{
    display:block;position:absolute;left:0;right:0;top:100%;
    background:var(--navy);border-bottom:1px solid var(--rule-dark);padding:8px var(--gutter) 20px;
  }
  .site-nav.open ul{flex-direction:column;gap:0}
  .site-nav.open a{display:block;padding:12px 0;font-size:16px;border-bottom:1px solid var(--rule-dark)}
}
@media (max-width:1020px){
  .site-nav{display:none}
  .nav-toggle{display:inline-flex}
  .site-header .nav-cta{display:none}
  .site-nav.open{
    display:block;position:absolute;left:0;right:0;top:100%;
    background:var(--navy);border-bottom:1px solid var(--rule-dark);padding:8px var(--gutter) 20px;
  }
  .site-nav.open ul{flex-direction:column;gap:0}
  .site-nav.open a{display:block;padding:12px 0;font-size:16px;border-bottom:1px solid var(--rule-dark)}
  .hero-grid{grid-template-columns:1fr}
  .hero-copy{padding-bottom:8px}
  .hero-figure{width:min(320px,80%)}
  .trust-bar ul{grid-template-columns:1fr 1fr}
  .trust-bar li:nth-child(3){border-left:0;padding-left:0}
  .trust-bar li:nth-child(n+3){border-top:1px solid var(--rule-dark)}
  .steps{grid-template-columns:1fr 1fr}
  .step:nth-child(3){padding-left:0;border-left:0}
  .step:nth-child(n+3){border-top:1px solid var(--rule-dark)}
  .logo-grid{grid-template-columns:repeat(3,1fr)}
  .inputs,.calc-grid,.consortium,.opts,.facts{grid-template-columns:1fr}
  .employee-grid{grid-template-columns:1fr}
  .employee .phone{position:static;max-width:320px}
  .faq-layout{grid-template-columns:1fr}
  .faq-intro{position:static}
  .rows li{grid-template-columns:1fr;gap:6px}
  .security-strip .wrap{grid-template-columns:1fr;gap:18px}
  .sec-items{grid-template-columns:1fr;gap:16px}
}
@media (max-width:720px){
  body{font-size:16px}
  .hero-actions{display:grid}
  .hero-actions .btn{width:100%}
  .trust-bar ul{grid-template-columns:1fr}
  .trust-bar li{border-left:0!important;padding-left:0!important;border-top:1px solid var(--rule-dark)}
  .trust-bar li:first-child{border-top:0}
  .steps{grid-template-columns:1fr}
  .step,.step+.step{padding:22px 0 8px;border-left:0}
  .step+.step{border-top:1px solid var(--rule-dark)}
  .track{grid-template-columns:1fr;gap:18px;padding-left:30px}
  .track::before,.track::after{left:7px;right:auto;top:8px;bottom:8px;width:2px;height:auto}
  .track::after{transform-origin:center top}
  .fee-paths.armed .track::after{transform:scaleY(0)}
  .fee-paths.armed.shown .track::after{transform:scaleY(1)}
  .node{padding-top:0}
  .node::before{left:-30px;top:2px}
  .logo-grid{grid-template-columns:repeat(2,1fr)}
  .logo-grid li{height:80px}
  .field-row{grid-template-columns:1fr}
  .team-list{grid-template-columns:1fr}
  .foot-cols{grid-template-columns:1fr}
  .form-embed iframe{height:1400px}
  .mobile-cta{
    display:block;position:fixed;left:16px;right:16px;z-index:90;
    bottom:calc(14px + env(safe-area-inset-bottom,0px));
    transform:translateY(160%);transition:transform .25s ease;
  }
  .mobile-cta.show{transform:none}
  .mobile-cta .btn{width:100%;box-shadow:0 14px 36px rgba(0,0,0,.35)}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important}
}
@media print{
  .site-header,.mobile-cta,.form-embed,.nav-toggle{display:none}
  .faq-a[hidden]{display:block}
  .section.dark,.hero,.trust-bar,.cta-band,.site-footer{background:#fff;color:#000}
}


/* ==========================================================
   Applicants page components (added chat 4).
   ========================================================== */
.ui-btn.deny{background:transparent;color:var(--rust);border:1px solid rgba(180,90,53,.45)}
.ui-tag.off{color:var(--rust);background:rgba(180,90,53,.10)}
.ui-tag.wait{color:var(--indigo-deep);background:rgba(76,70,200,.10)}
.scenario{margin-top:36px;max-width:64ch;display:grid;gap:18px}
.scenario p{font-size:17px;line-height:1.65;color:var(--ink)}
.scenario p.turn-line{font:500 clamp(20px,2vw,24px)/1.4 var(--serif)}
.controls{margin-top:24px}
.controls li{font-size:15.5px}


/* ==========================================================
   Homepage components (added chat 5).
   Text-only hero; the doors are the visual. Door grid auto-fits,
   so adding the Employees door in chat 6 needs no CSS change.
   ========================================================== */
.home-hero{padding-bottom:clamp(56px,7vw,96px)}
.home-hero h1{font-size:clamp(40px,5.2vw,74px);line-height:1.03;max-width:19ch;letter-spacing:-.022em}
.doors{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:clamp(40px,5vw,64px)}
.door{position:relative;background:var(--lavender);color:var(--ink);border-radius:var(--radius-m);padding:28px 28px 24px;display:flex;flex-direction:column;gap:12px}
.door h2{font-size:clamp(28px,2.6vw,36px);max-width:none}
.door p{font-size:16px;line-height:1.55;color:var(--ink-soft);max-width:44ch}
.door-link{margin-top:auto;padding-top:8px;font-weight:600;font-size:15.5px;color:var(--indigo-deep);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.door-link::after{content:"";position:absolute;inset:0;border-radius:var(--radius-m)}
.door:hover{background:#fff}
.door:hover .door-link{text-decoration-thickness:2px}
.door:focus-within{outline:3px solid var(--teal);outline-offset:3px}
.door-link:focus-visible{outline:none}

.principle h2{max-width:22ch}
.principle-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(28px,5vw,72px);align-items:end}
.principle-grid .principle-body{margin-top:0}
.principle-body{font:500 clamp(20px,1.9vw,25px)/1.5 var(--serif);color:var(--ink);max-width:48ch;margin-top:28px}

.founder-band h2{max-width:none}
.creds{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--rule-dark)}
.creds li{padding:22px 24px 4px 0;font-size:16px;line-height:1.55;color:var(--on-dark-soft)}
.creds li+li{padding-left:24px;border-left:1px solid var(--rule-dark)}
.creds a{color:var(--on-dark);text-underline-offset:3px}

.trust-two ul{grid-template-columns:repeat(2,1fr)}

.door-band{background:var(--navy);color:var(--on-dark);padding:clamp(44px,5vw,64px) 0}
.door-band .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 32px}
.door-band h2{font-size:clamp(26px,2.6vw,34px)}
.door-band ul{display:flex;flex-wrap:wrap;gap:12px}
.door-band a{display:inline-flex;align-items:center;min-height:46px;padding:10px 20px;border:1px solid var(--rule-dark);border-radius:var(--radius-s);color:var(--on-dark);text-decoration:none;font-weight:600;font-size:15.5px}
.door-band a:hover{background:rgba(245,244,251,.08)}

@media (max-width:1020px){
  .principle-grid{grid-template-columns:1fr;gap:0}
  .principle-grid .principle-body{margin-top:28px}
  .creds{grid-template-columns:1fr}
  .creds li,.creds li+li{padding:18px 0 4px;border-left:0}
  .creds li+li{border-top:1px solid var(--rule-dark)}
}
@media (max-width:720px){
  .trust-two ul{grid-template-columns:1fr}
  .door{padding:24px 22px 20px}
  .door-band ul{display:grid;width:100%}
  .door-band a{justify-content:center}
}


/* ==========================================================
   Employees page components (added chat 6).
   Text-only hero, scenario columns, a note for HR, and a restyle
   of the Zoho Campaigns signup embed. The Zoho code ships with
   inline styles, so the overrides below use !important. Leave the
   Zoho markup unedited; restyle it here.
   ========================================================== */
.text-hero{padding-bottom:clamp(56px,7vw,96px)}
.text-hero h1{max-width:20ch;font-size:clamp(40px,5vw,70px);line-height:1.04;letter-spacing:-.022em}
.text-hero .lede{max-width:52ch}

.trust-three ul{grid-template-columns:repeat(3,1fr)}

.scenarios{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:44px;border-top:1px solid var(--rule)}
.scenarios article{padding:28px 28px 8px 0}
.scenarios article+article{padding-left:28px;border-left:1px solid var(--rule)}
.scenarios h3{font:600 22px/1.25 var(--serif);margin-bottom:12px}
.scenarios p{font-size:16px;line-height:1.65;color:var(--ink-soft)}
.scenarios .stat{margin-top:18px;padding-top:14px;border-top:1px dashed var(--rule)}
.scenarios .stat-line{color:var(--ink);font-weight:500;font-size:15px}

.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:40px}
.stat-row li{background:var(--lavender-2);border-radius:var(--radius-m);padding:22px}
.stat-row p{font:500 18px/1.4 var(--serif);color:var(--ink)}
.stat-row .src a{color:inherit;text-underline-offset:2px}
#today .turn-line{margin-top:48px;font:500 clamp(22px,2.3vw,30px)/1.35 var(--serif);max-width:36ch;color:var(--ink)}

.dark .facts.tools li{background:var(--navy-2);border:1px solid var(--rule-dark);color:var(--on-dark-soft)}
.dark .facts.tools b{color:var(--on-dark)}
.dark .facts.tools li:last-child{border-color:var(--teal)}

.lookup{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(28px,5vw,72px);align-items:start}
.lookup-box{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:28px}
.lookup-box .btn{width:100%}
.lookup-box .fine{margin-top:14px}

.hr-note{margin-top:40px;max-width:760px;background:var(--navy-2);border:1px solid var(--rule-dark);border-left:4px solid var(--teal);border-radius:var(--radius-m);padding:28px 32px}
.hr-note-label{font-family:var(--mono);font-size:13px;color:var(--teal);margin-bottom:14px}
.hr-note-text{display:grid;gap:12px;font:500 clamp(18px,1.7vw,21px)/1.5 var(--serif);color:var(--on-dark)}
.hr-note-text p:nth-child(3){font:400 14px/1.5 var(--mono);color:var(--on-dark-soft);word-break:break-word}
.hr-note .hero-actions{margin-top:24px}
.hr-note button.btn{font-family:var(--sans)}

.signup-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,72px);align-items:center}
.signup h2{max-width:18ch}
.zoho-optin{margin-top:0;padding:28px}
.zoho-optin [name="SIGNUP_BODY"]{width:auto!important;height:auto!important;background:transparent!important;overflow:visible!important;font-family:var(--sans)!important}
.zoho-optin [changeitem="ELEGANTFORM_IMAGE"]{display:none!important}
.zoho-optin [name="SIGNUP_BODY"]>div{position:static!important;float:none!important;bottom:auto!important;text-align:left!important}
.zoho-optin form{color:var(--ink)!important}
.zoho-optin form>div:empty{display:none!important}
.zoho-optin form>div[style*="227px"]{width:100%!important;height:auto!important;margin:0!important;text-align:left!important}
.zoho-optin #EMBED_FORM_EMAIL_LABEL{box-sizing:border-box;height:50px!important;padding:0 14px!important;border:1px solid var(--rule)!important;border-radius:var(--radius-s)!important;color:var(--ink)!important;font:400 16px var(--sans)!important;background:#fff!important}
.zoho-optin #EMBED_FORM_EMAIL_LABEL:focus-visible{outline:3px solid var(--teal)!important;outline-offset:2px}
.zoho-optin form>div[style*="113px"]{display:block!important;width:100%!important;height:auto!important;margin-top:12px!important}
.zoho-optin #zcWebOptin{min-height:48px;background:var(--indigo)!important;border-radius:var(--radius-s)!important;font:600 15px var(--sans)!important}
.zoho-optin #zcWebOptin:hover{background:var(--indigo-deep)!important}
.zoho-optin #errorMsgDiv{position:static!important;margin:0 0 12px!important;box-shadow:none!important}
#zcOptinSuccessPopup{width:min(720px,88vw)!important;left:50%!important;transform:translateX(-50%);box-sizing:border-box;height:auto!important}

@media (max-width:1020px){
  .scenarios,.stat-row{grid-template-columns:1fr}
  .scenarios article,.scenarios article+article{padding:24px 0 8px;border-left:0}
  .scenarios article+article{border-top:1px solid var(--rule)}
  .lookup,.signup-grid{grid-template-columns:1fr}
  .trust-three ul{grid-template-columns:1fr}
  .trust-three li{border-left:0!important;padding-left:0!important}
  .trust-three li+li{border-top:1px solid var(--rule-dark)}
}
@media (max-width:720px){
  .hr-note{padding:22px 20px}
  .zoho-optin{padding:20px}
}
/* Close band contrast fix (chat 6, applies site-wide): the band is navy without the .dark class */
.cta-band .eyebrow{color:var(--teal)}
.cta-band .lede{color:var(--on-dark-soft)}


/* ==========================================================
   About page components (added chat 7), plus the homepage
   founder headshot and a four-column footer when a page
   carries both an "On this page" column and a Company column.
   ========================================================== */
.foot-cols:has(> :nth-child(4)){grid-template-columns:1.2fr 1fr 1fr 1fr}

.leaders{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:44px}
.leader{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:28px}
.leader-photo{width:min(100%,240px);aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-m);margin-bottom:22px;background:var(--lavender-2)}
.leader h3{font:600 26px/1.2 var(--serif);letter-spacing:-.01em}
.leader-title{font-family:var(--mono);font-size:13px;color:var(--indigo);margin:6px 0 16px}
.leader p:not(.leader-title){font-size:16px;line-height:1.7;color:var(--ink-soft)}

.press{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(28px,5vw,72px);align-items:end}
.press-box{background:var(--navy-2);border:1px solid var(--rule-dark);border-left:4px solid var(--teal);border-radius:var(--radius-m);padding:28px 32px;color:var(--on-dark)}
.press-label{font-family:var(--mono);font-size:13px;color:var(--teal);margin-bottom:6px}
.press-box p+.press-label,.press-box ul+.press-label{margin-top:20px}
.press-box a{color:var(--on-dark);text-underline-offset:3px;word-break:break-word}
.press-downloads li+li{margin-top:6px}

.founder-grid{display:grid;grid-template-columns:160px minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:start}
.founder-photo{width:160px;aspect-ratio:1/1;object-fit:cover;border-radius:var(--radius-m)}

@media (max-width:1020px){
  .foot-cols:has(> :nth-child(4)){grid-template-columns:1fr 1fr}
  .leaders,.press{grid-template-columns:1fr}
}
@media (max-width:720px){
  .foot-cols:has(> :nth-child(4)){grid-template-columns:1fr}
  .leader{padding:22px}
  .press-box{padding:22px 20px}
  .founder-grid{grid-template-columns:1fr}
  .founder-photo{width:120px}
}
.founder-more{margin-top:24px}
.founder-more a{color:var(--teal);font-weight:600;text-underline-offset:3px}

/* Contact page (chat 8) */
.contact-doors .door{background:#fff;border:1px solid var(--rule)}
.contact-doors .door:hover{background:var(--lavender-2)}
.door h3{font-family:var(--serif);font-weight:600;letter-spacing:-.018em;font-size:clamp(26px,2.4vw,32px);line-height:1.1}
.contact-doors{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.contact-doors .door-link{word-break:break-word}
.zoho-webform{color:var(--ink);padding:clamp(20px,3vw,36px);max-width:680px}
.form-fallback{font-size:15px;color:var(--ink-soft);margin-top:18px}
.form-fallback a{color:var(--indigo-deep)}
/* Zoho CRM Webform overrides (ruling 78: Zoho markup ships unedited; restyle here only) */
.zoho-webform #crmWebToEntityForm.zcwf_lblLeft{padding:0;max-width:100%!important;background:transparent!important}
.zoho-webform .zcwf_lblLeft .zcwf_title{display:none}
.zoho-webform .zcwf_lblLeft .zcwf_row{margin:0 0 18px}
.zoho-webform .zcwf_lblLeft .zcwf_col_lab{width:100%;float:none;margin:0 0 6px;padding:0;font-family:var(--sans)!important;font-size:15px!important;font-weight:500;color:var(--ink)}
.zoho-webform .zcwf_lblLeft .zcwf_col_lab span{color:var(--rust)!important}
.zoho-webform .zcwf_lblLeft .zcwf_col_fld{width:100%;float:none;padding:0;margin:0}
.zoho-webform .zcwf_lblLeft .zcwf_col_fld input[type=text],.zoho-webform .zcwf_lblLeft .zcwf_col_fld textarea{width:100%;float:none;min-height:48px;padding:11px 13px;border:1px solid #c9c7e3!important;border-radius:var(--radius-s);font-family:var(--sans)!important;font-size:16px;color:var(--ink);background:#fff}
.zoho-webform .zcwf_lblLeft .zcwf_col_fld textarea{min-height:130px}
.zoho-webform .zcwf_lblLeft .zcwf_col_fld input[type=text]:focus,.zoho-webform .zcwf_lblLeft .zcwf_col_fld textarea:focus{outline:3px solid var(--teal);outline-offset:1px}
.zoho-webform .zcwf_lblLeft .zcwf_col_help{display:none}
.zoho-webform .zcwf_lblLeft .formsubmit.zcwf_button{max-width:none;min-height:50px;padding:13px 24px;border:0;border-radius:var(--radius-s);background:var(--indigo);color:#fff!important;font-family:var(--sans);font-weight:600;font-size:16px;white-space:normal}
.zoho-webform .zcwf_lblLeft .formsubmit.zcwf_button:hover{background:var(--indigo-deep)}
.zoho-webform .zcwf_lblLeft .formsubmit.zcwf_button[disabled]{opacity:.6;cursor:wait}
.zoho-webform input[type=reset]{display:none}
.zoho-webform .zcwf_lblLeft .zcwf_col_fld select.zcwf_col_fld_slt{width:100%;float:none;min-height:48px;padding:11px 13px;border:1px solid #c9c7e3;border-radius:var(--radius-s);font-family:var(--sans);font-size:16px;color:var(--ink);background:#fff}
.zoho-webform .zcwf_lblLeft .zcwf_col_fld select.zcwf_col_fld_slt:focus{outline:3px solid var(--teal);outline-offset:1px}
.lookup .zoho-webform{margin-top:0}
@media (max-width:400px){.zoho-webform .g-recaptcha{transform:scale(.88);transform-origin:0 0}}
.form-fallback.on-dark{color:var(--on-dark-soft)}
.form-fallback.on-dark a{color:var(--on-dark)}

/* Legal shells and 404 (chat 10). .legal-body holds Termly or counsel text; style it, never edit it. */
.legal-page{padding-top:clamp(48px,6vw,80px)}
.legal-page h1{font-size:clamp(36px,4.4vw,56px);line-height:1.05;margin:10px 0 clamp(24px,3vw,36px)}
.legal-body{max-width:78ch;color:var(--ink);font-size:16.5px;line-height:1.7;overflow-wrap:anywhere}
.legal-body h1,.legal-body h2,.legal-body h3{font-family:var(--serif);color:var(--ink);line-height:1.2;margin:1.6em 0 .5em}
.legal-body h1{font-size:28px}.legal-body h2{font-size:24px}.legal-body h3{font-size:19px}
.legal-body p,.legal-body ul,.legal-body ol,.legal-body table{margin:0 0 1em}
.legal-body ul,.legal-body ol{padding-left:1.4em}
.legal-body ul{list-style:disc}.legal-body ol{list-style:decimal}
.legal-body li+li{margin-top:.35em}
.legal-body a{color:var(--indigo-deep);text-underline-offset:3px}
.legal-body table{display:block;overflow-x:auto;border-collapse:collapse;font-size:15px}
.legal-body th,.legal-body td{border:1px solid var(--rule);padding:8px 10px;text-align:left;vertical-align:top}
.legal-contact{border-top:1px solid var(--rule);padding-top:20px;margin-top:clamp(36px,4vw,56px)}
.legal-contact a{color:var(--indigo-deep);font-weight:600}

/* Blog index and article template (chat 11) */
.post-list{display:grid;gap:clamp(20px,2.4vw,28px);max-width:860px}
.post-card{background:#fff;border:1px solid var(--rule);border-radius:var(--radius-m);padding:clamp(22px,3vw,36px)}
.post-card h2{font-size:clamp(24px,2.6vw,32px);line-height:1.15}
.post-card h2 a{color:var(--ink);text-decoration:none}
.post-card h2 a:hover{color:var(--indigo-deep)}
.post-card p{margin-top:12px;color:var(--ink-soft);line-height:1.6;max-width:68ch}
.post-read{display:inline-block;margin-top:16px;font-weight:600;color:var(--indigo-deep);text-underline-offset:3px}
.post-dates{font-family:var(--mono);font-size:13px;color:var(--ink-soft)}
.post{padding:clamp(48px,6vw,88px) 0 clamp(56px,7vw,96px)}
.post-wrap{max-width:760px}
.post-back{text-decoration:none}
.post-head h1{font-size:clamp(34px,4.4vw,54px);line-height:1.08;margin:6px 0 20px}
.post-byline{font-weight:600;color:var(--ink)}
.post-head .post-dates{margin-top:6px}
.post-lede{font-family:var(--serif);font-size:clamp(20px,1.8vw,24px);line-height:1.5;color:var(--ink);margin-top:28px;padding-top:24px;border-top:1px solid var(--rule)}
.post-body{margin-top:clamp(28px,3vw,40px);font-size:17.5px;line-height:1.72;color:var(--ink);overflow-wrap:break-word}
.post-body h2{font-size:clamp(25px,2.4vw,31px);line-height:1.2;margin:1.9em 0 .55em}
.post-body p,.post-body ul{margin:0 0 1.05em}
.post-body ul{padding-left:1.2em;list-style:disc}
.post-body li+li{margin-top:.6em}
.post-body strong{font-weight:650}
.post-stat{border-left:3px solid var(--teal);background:var(--lavender-2);padding:16px 20px;margin:0 0 1.2em;border-radius:0 var(--radius-s) var(--radius-s) 0}
.post-stat p{margin:0;font-weight:600}
.post-question{font-family:var(--serif);font-size:clamp(20px,1.9vw,24px);line-height:1.45;border-left:3px solid var(--indigo);padding:6px 0 6px 20px;margin:0 0 1.2em}
.post-ctas{margin-top:clamp(40px,5vw,64px);background:var(--navy);color:var(--on-dark);border-radius:var(--radius-m);padding:clamp(24px,3vw,36px)}
.post-ctas h2{font-size:clamp(22px,2.2vw,28px)}
.post-ctas ul{margin-top:18px;display:grid;gap:14px}
.post-ctas li{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline;border-top:1px solid var(--rule-dark);padding-top:14px}
.post-ctas span{font-family:var(--mono);font-size:13px;color:var(--teal);min-width:90px}
.post-ctas a{color:var(--on-dark);font-weight:600;text-underline-offset:3px}

/* Chat 12: /screening-companies/ */
.stat-row-two{grid-template-columns:repeat(2,1fr)}
.section.dark .alt-link{display:inline-block;margin-top:32px;color:var(--on-dark-soft);font-size:15.5px;text-underline-offset:3px}
.section.dark .alt-link:hover{color:var(--on-dark)}
@media (max-width:720px){.stat-row-two{grid-template-columns:1fr}}


/* ==========================================================
   Chat 13: shared header and rebuilt homepage (Master Brief v20).
   One site nav on every page, current page marked with aria-current.
   Model pages carry their in-page anchors in .page-nav under the header.
   ========================================================== */
.site-nav a[aria-current]{color:var(--on-dark);box-shadow:inset 0 -2px 0 var(--teal);padding-bottom:6px}

.page-nav{
  position:sticky;top:calc(var(--header-h) + env(safe-area-inset-top,0px));z-index:99;
  background:var(--navy-2);border-bottom:1px solid var(--rule-dark);
}
.page-nav ul{display:flex;gap:4px 22px;height:var(--page-nav-h,44px);align-items:center;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.page-nav ul::-webkit-scrollbar{display:none}
.page-nav a{font-size:13px;color:var(--on-dark-faint);text-decoration:none;white-space:nowrap;padding:6px 0}
.page-nav a:hover,.page-nav a:focus-visible{color:var(--on-dark)}
html:has(.page-nav){scroll-padding-top:calc(var(--header-h) + 44px + 16px + env(safe-area-inset-top,0px))}
body:has(.page-nav) .faq-intro,
body:has(.page-nav) .employee .phone{top:calc(var(--header-h) + 68px)}

@media (max-width:1180px){
  .site-nav.open a[aria-current]{box-shadow:inset 3px 0 0 var(--teal);padding-left:14px}
}

/* ---------- homepage hero ---------- */
.home-hero{padding:clamp(56px,7vw,96px) 0 clamp(64px,7vw,96px)}
.home-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(32px,5vw,64px);align-items:center}
.home-hero h1{font-size:clamp(48px,6.2vw,88px);line-height:.98;letter-spacing:-.03em;max-width:10ch}
.home-stat{margin-top:clamp(28px,3vw,40px);max-width:30ch}
.home-stat p{font:500 clamp(22px,2.2vw,30px)/1.28 var(--serif);color:var(--on-dark)}
.home-stat .src{margin-top:10px}
.home-sub{margin-top:22px;font-size:clamp(17px,1.35vw,19px);color:var(--on-dark-soft);max-width:44ch}
.home-hero .hero-actions{margin-top:30px}
.home-links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:20px}
.home-links a{font-size:15px;color:var(--on-dark-soft);text-underline-offset:4px;text-decoration-thickness:1px}
.home-links a:hover{color:var(--on-dark);text-decoration-thickness:2px}

/* the fan: three employee-side requests; the collector sits left so its label reads */
.fan{position:relative;height:540px;width:100%;max-width:480px;justify-self:center;margin:0}
.fan .fan-card{position:absolute;top:0;left:50%;width:236px;height:auto;margin-left:-118px;transform-origin:50% 85%;filter:drop-shadow(0 24px 48px rgba(0,0,0,.5))}
.fan-front{z-index:3;top:34px}
.fan-mid{z-index:2;transform:translateX(60%) rotate(7deg)}
.fan-back{z-index:1;transform:translateX(-60%) rotate(-7deg)}
.ui-flag{font-family:var(--mono);font-size:3.4cqw;color:var(--rust);margin-top:-1cqw}
@keyframes fan-mid{from{transform:translateX(0) rotate(0)}}
@keyframes fan-back{from{transform:translateX(0) rotate(0)}}
.fan-mid{animation:fan-mid .9s .25s cubic-bezier(.2,.8,.2,1) both}
.fan-back{animation:fan-back .9s .25s cubic-bezier(.2,.8,.2,1) both}
@media (prefers-reduced-motion:reduce){.fan-mid,.fan-back{animation:none}}

/* ---------- homepage doors ---------- */
.home-doors h2{font-size:clamp(28px,3vw,40px)}
.doors.four{grid-template-columns:repeat(4,minmax(0,1fr));margin-top:32px}
.home-doors .door{background:#fff;border:1px solid var(--rule)}
.home-doors .door:hover{background:var(--lavender-2)}
.home-doors .door h3{font-size:clamp(24px,2vw,28px)}
.home-doors .door p{font-size:15.5px}

/* ---------- homepage facts on navy ---------- */
.home-facts .facts li{background:var(--navy-2);border:1px solid var(--rule-dark);color:var(--on-dark-soft)}
.home-facts .facts b{color:var(--on-dark)}

/* ---------- founder band on light ---------- */
.founder-band.alt .creds{border-top-color:var(--rule)}
.founder-band.alt .creds li{color:var(--ink-soft)}
.founder-band.alt .creds li+li{border-left-color:var(--rule)}
.founder-band.alt .creds a{color:var(--indigo-deep)}
.founder-band.alt .founder-more a{color:var(--indigo-deep)}

@media (max-width:1020px){
  .home-grid{grid-template-columns:1fr}
  .fan{height:540px;margin-top:8px}
  .doors.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .founder-band.alt .creds li+li{border-top-color:var(--rule)}
}
@media (max-width:720px){
  .fan{height:auto;max-width:260px}
  .fan-mid,.fan-back{display:none}
  .fan .fan-front{position:relative;top:0;left:0;margin:0;width:100%}
  .doors.four{grid-template-columns:1fr}
}

/* /employees/ section 03: cutout phone image (chat 13, ruling 157) */
.phone .phone-cutout{width:100%;max-width:320px;margin-inline:auto;border-radius:0;filter:drop-shadow(0 24px 44px rgba(11,26,34,.28))}

/* Form confirmation, shown by site.js after a Zoho submit (verifiers page, chat 14) */
.form-confirm{margin-top:40px;background:#fff;color:var(--ink);border-radius:var(--radius-m);padding:28px 30px;border-left:6px solid var(--teal);max-width:640px}
.form-confirm h3{margin:0 0 8px;color:var(--ink)}
.form-confirm p{margin:0;font-size:16.5px;color:var(--ink-soft)}
.form-confirm:focus{outline:3px solid var(--teal);outline-offset:3px}
.zoho-webform.is-sent .wf_customMessageBox{display:none!important}


/* ==========================================================
   App phone, chat 14: HTML screens rebuilt to match the live MyEmployment app
   (iPhone frame with Dynamic Island, the ME app mark, centered title, pill buttons,
   navy tab bar). Replaces the chat 3 frame rules above. Markup: .ui-phone > .ui-screen
   > .ui-island, .ui-status, .ui-top, .ui-body, .ui-tabs.
   ========================================================== */
.ui-phone{aspect-ratio:9/19.3;background:linear-gradient(145deg,#3a4248,#0d1114 38%,#2a3137);border-radius:44px;padding:9px;box-shadow:0 0 0 2px #4a535a inset,0 0 0 1px rgba(0,0,0,.6)}
.ui-phone::before,.ui-phone::after{content:"";position:absolute;width:3px;background:#3a4248;border-radius:2px}
.ui-phone::before{left:-3px;top:20%;height:5%;box-shadow:0 34px 0 #3a4248,0 62px 0 #3a4248}
.ui-phone::after{right:-3px;top:28%;height:11%}
.ui-screen{position:relative;border-radius:36px;background:#fff;color:#0b1a22;font-family:var(--sans);-webkit-font-smoothing:antialiased}
.ui-island{position:absolute;top:3cqw;left:50%;transform:translateX(-50%);width:29cqw;height:8.6cqw;border-radius:99px;background:#000;z-index:2}
.ui-island::after{content:"";position:absolute;right:3cqw;top:2.8cqw;width:3cqw;height:3cqw;border-radius:50%;background:#1b2440}
.ui-status{position:relative;align-items:center;padding:4.6cqw 7.5cqw 1.5cqw 9.5cqw;font-size:4.1cqw;font-weight:600;letter-spacing:-.01em}
.ui-icons{display:flex;gap:1.4cqw;align-items:center}
.ui-icons i{display:block;height:3cqw;background:center/contain no-repeat}
.ui-icons .s{width:4.4cqw;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12' fill='%230b1a22'%3E%3Crect x='0' y='8' width='3' height='4' rx='1'/%3E%3Crect x='5' y='5.5' width='3' height='6.5' rx='1'/%3E%3Crect x='10' y='3' width='3' height='9' rx='1'/%3E%3Crect x='15' y='0' width='3' height='12' rx='1'/%3E%3C/svg%3E")}
.ui-icons .w{width:4cqw;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 12' fill='none' stroke='%230b1a22' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M1.5 4.2a9.5 9.5 0 0 1 13 0M4 7a6 6 0 0 1 8 0'/%3E%3Ccircle cx='8' cy='10' r='1.3' fill='%230b1a22' stroke='none'/%3E%3C/svg%3E")}
.ui-icons .b{width:6.6cqw;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 12'%3E%3Crect x='.6' y='.6' width='22.8' height='10.8' rx='3' fill='none' stroke='%230b1a22' stroke-opacity='.4' stroke-width='1.2'/%3E%3Crect x='2.4' y='2.4' width='19.2' height='7.2' rx='1.6' fill='%230b1a22'/%3E%3Crect x='24.6' y='3.8' width='1.8' height='4.4' rx='.9' fill='%230b1a22' fill-opacity='.45'/%3E%3C/svg%3E")}
.ui-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:3.2cqw 6cqw 0}
.ui-top .back{width:6cqw;height:6cqw;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1a22' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 12H5M11 5l-7 7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}
.ui-top img{width:9.4cqw;height:9.4cqw;display:block}
.ui-body{gap:3.2cqw;padding:3cqw 6cqw 4cqw}
.ui-title{font:600 6.1cqw/1.18 var(--sans);letter-spacing:-.015em;text-align:center;color:#0b1a22;margin-bottom:1cqw}
.ui-muted{font-size:3.7cqw;color:#5a6670}
.ui-card{background:#f1f0fb;border:0;border-radius:4cqw;padding:4cqw 4.4cqw}
.ui-card b{font-size:4.4cqw;color:#0b1a22}
.ui-label{font-family:var(--sans);font-size:3.9cqw;font-weight:600;color:#0b1a22;margin-bottom:1.4cqw;padding-bottom:1.6cqw;border-bottom:1.5px solid #0b1a22}
.ui-list li{font-size:3.9cqw;padding:1.1cqw 0;color:#1b2931}
.ui-list li::before{width:2.9cqw;height:2.9cqw;margin-top:1.2cqw;background:#2aa79b}
.ui-btn{border-radius:99px;padding:2.7cqw 3cqw;font-size:3.9cqw;font-weight:600;background:#4c46c8}
.ui-btn.approve{background:#2aa79b;color:#fff}
.ui-btn.ghost{border:1.5px solid #4c46c8;color:#3a35a8;background:#fff}
.ui-btn.deny{border:1.5px solid #c0392b;color:#c0392b;background:#fff}
.ui-search{border:1.5px solid #c9c7e3;border-radius:99px;padding:2.8cqw 4.4cqw;font-size:3.7cqw}
.ui-chips span{border-color:#c9c7e3;font-size:3.4cqw}
.ui-chips span:first-child{background:#0f1b2d;border-color:#0f1b2d}
.ui-rows li{border-color:#e6e5f2}
.ui-tag{font-family:var(--sans);font-weight:600;color:#1f8a80;background:rgba(42,167,155,.12)}
.ui-notify{background:#f1f0fb;color:#0b1a22;border-radius:4cqw;text-align:center}
.ui-notify small{font-family:var(--sans);font-weight:600;color:#4c46c8;font-size:3.3cqw}
.ui-notify b{display:block;font-size:4.9cqw;margin:.6cqw 0}
.ui-check{margin:2cqw auto 0;width:14cqw;height:14cqw;background:#2aa79b}
.ui-check::after{border-color:#fff;left:4.8cqw;top:3cqw}
.ui-tabs{flex:none;display:flex;justify-content:space-around;align-items:center;background:#0f1b2d;padding:3.4cqw 3cqw 7cqw;position:relative}
.ui-tabs i{display:block;width:6.2cqw;height:6.2cqw;background:center/contain no-repeat;opacity:.8}
.ui-tabs i:first-child{opacity:1}
.ui-tabs::after{content:"";position:absolute;bottom:2.2cqw;left:50%;transform:translateX(-50%);width:34cqw;height:1.3cqw;border-radius:99px;background:#fff}
.ui-tabs .t1{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e9e8f7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10.5 12 4l8.5 6.5V20h-5.5v-5.5h-6V20H3.5z'/%3E%3C/svg%3E")}
.ui-tabs .t2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e9e8f7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 3h8l4 4v14H6z M14 3v4h4 M9 12h6 M9 16h6'/%3E%3C/svg%3E")}
.ui-tabs .t3{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e9e8f7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5.5' width='18' height='13' rx='1.5'/%3E%3Cpath d='m3.5 6.5 8.5 6.5 8.5-6.5'/%3E%3C/svg%3E")}
.ui-tabs .t4{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e9e8f7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='18' cy='5.5' r='2.5'/%3E%3Ccircle cx='6' cy='12' r='2.5'/%3E%3Ccircle cx='18' cy='18.5' r='2.5'/%3E%3Cpath d='m8.2 10.8 7.6-4.1M8.2 13.2l7.6 4.1'/%3E%3C/svg%3E")}
.ui-tabs .t5{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e9e8f7' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2.5v3M12 18.5v3M2.5 12h3M18.5 12h3M5.3 5.3l2.1 2.1M16.6 16.6l2.1 2.1M5.3 18.7l2.1-2.1M16.6 7.4l2.1-2.1'/%3E%3C/svg%3E")}
.split .ui-phone,.flow-step .ui-phone{filter:drop-shadow(0 24px 40px rgba(0,0,0,.35))}
.ui-card .ui-label{border-bottom:0;padding-bottom:0;font-size:3.3cqw;color:#5a6670;font-weight:500}

/* ==========================================================
   Header "Log in" (ruling 234): parked until the verifier console is live.
   Then add <li class="nav-login"><a href="CONSOLE_URL">Log in</a></li> after Blog
   on every page; it links straight to the production console.
   ========================================================== */
.site-nav li.nav-login{padding-left:18px;border-left:1px solid var(--rule-dark)}
@media (max-width:1180px){
  .site-nav li.nav-login{padding-left:0;border-left:0}
}