/* ==========================================================================
   TENDERCO V3 — design system  ·  palette: SPRING (locked)
   All audit fixes applied: modular type scale, 4px/8px spacing, ≥16px body,
   skip nav, semantic landmark support, CSS/SVG logo only.
   ========================================================================== */

:root{
  /* ---- SPRING palette ---- */
  --field:#A6DB5E;
  --field-d:#8CC544;
  --field-ink:#4C6B2A;
  --field-d-text:var(--field-ink);
  --field-l:#BEE585;

  --cream:#F2EFE4;
  --cream-2:#EAE6D8;

  --char:#1C1C1A;
  --char-soft:#3A3A36;
  --char-mut:#5F5D56;
  --white:#FFFFFF;

  --r-field:28px; --r-nav:20px; --r-panel:22px; --r-card:16px; --r-pill:999px;
  --font:Figtree,-apple-system,BlinkMacSystemFont,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;

  /* ---- content widths ----
     The shell is ~1290px of content on a desktop viewport, which is wider than
     any single column of text or list should ever run. Blocks that stand alone
     in a full-width row use one of these two widths and centre themselves.
     --w-prose: a reading column (prose, a lone panel of copy)
     --w-block: a stacked component (accordion, queue, spine, log)
  */
  --w-prose:760px;
  --w-block:960px;

  /* ---- Modular type scale (1.125 minor third, base 16px) ----
     8 sizes only, mapped to rem values:
     --text-xs:  0.75rem   (12px) — mono labels, legal micro-copy
     --text-sm:  0.875rem  (14px) — captions, footer, small UI
     --text-base: 1rem     (16px) — body default (≥16px per UI-1)
     --text-md:  1.125rem  (18px) — lead paragraphs, sub heads
     --text-lg:  1.25rem   (20px) — h3 equivalent
     --text-xl:  1.5rem    (24px) — h2 small
     --text-2xl: 1.875rem  (30px) — h2
     --text-3xl: 2.25rem+  (36px+) — h1 (fluid)
  */
  --text-xs:0.75rem;
  --text-sm:0.875rem;
  --text-base:1rem;
  --text-md:1.125rem;
  --text-lg:1.25rem;
  --text-xl:1.5rem;
  --text-2xl:1.875rem;
  --text-3xl:clamp(2.5rem,6.6vw,5rem);

  /* ---- 4px/8px spacing scale ---- */
  --sp-1:4px;
  --sp-2:8px;
  --sp-3:12px;
  --sp-4:16px;
  --sp-5:20px;
  --sp-6:24px;
  --sp-7:32px;
  --sp-8:40px;
  --sp-9:48px;
  --sp-10:56px;
  --sp-11:64px;
  --sp-12:80px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--cream);color:var(--char);font-family:var(--font);
  font-size:var(--text-base);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
img{max-width:100%;display:block}
h1,h2,h3{margin:0;font-weight:700;letter-spacing:-.038em;line-height:1.06}
h1{font-size:var(--text-3xl);font-weight:800;letter-spacing:-.048em;line-height:.96}
h2{font-size:clamp(var(--text-2xl),4.3vw,3rem)}
h3{font-size:var(--text-lg);letter-spacing:-.028em}
p{margin:0;font-size:var(--text-base)}
li{font-size:var(--text-base)}

/* ---------- skip navigation ---------- */
.skip-nav{
  position:absolute;top:-100%;left:var(--sp-4);z-index:100;
  background:var(--char);color:var(--white);padding:var(--sp-3) var(--sp-5);
  border-radius:var(--r-pill);text-decoration:none;font-weight:600;
  font-size:var(--text-sm);transition:top .2s ease;
}
.skip-nav:focus{top:var(--sp-4);color:var(--white)}

/* ---------- layout ---------- */
.shell{max-width:1340px;margin-inline:auto;padding:0 var(--sp-6)}
.fin{padding-inline:clamp(var(--sp-6),4.5vw,60px)}
.sec{padding-block:clamp(var(--sp-11),8vw,110px)}
.sechead{max-width:44ch}
.sechead p{margin-top:var(--sp-4);font-size:var(--text-md);color:var(--char-mut)}
.centre{text-align:center;margin-inline:auto}
.prose{max-width:var(--w-prose);margin-inline:auto}
.hold{max-width:var(--w-block);margin-inline:auto}

/* ---------- nav: white card overlapping the field ---------- */
.nav{position:relative;z-index:5;background:var(--white);border-radius:var(--r-nav);
  display:flex;align-items:center;gap:var(--sp-6);padding:var(--sp-4) var(--sp-4) var(--sp-4) var(--sp-6);
  box-shadow:0 1px 3px rgba(0,0,0,.05);margin-top:var(--sp-5)}
.logo{display:flex;align-items:center;text-decoration:none;line-height:1}
.logo .wordmark{font-size:var(--text-xl);font-weight:800;letter-spacing:-.055em;color:var(--char);line-height:1;
  font-family:var(--font);text-decoration:none}
.nav .links{display:flex;align-items:center;gap:var(--sp-6);margin-left:var(--sp-3)}
.nav .links a{font-size:var(--text-base);font-weight:500;text-decoration:none;color:var(--char-soft)}
.nav .links a:hover{color:var(--char)}
.nav .links a[aria-current="page"]{color:var(--char);font-weight:700}
.nav .right{margin-left:auto;display:flex;align-items:center;gap:var(--sp-3)}
.burger{width:42px;height:42px;border-radius:var(--r-pill);background:var(--field);flex:none;
  display:none;place-items:center;border:0;cursor:pointer}
.burger i{display:block;width:15px;height:1.5px;background:var(--char);position:relative;transition:transform .15s ease,opacity .15s ease}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:15px;height:1.5px;background:var(--char);transition:transform .15s ease,top .15s ease}
.burger i::before{top:-5px}.burger i::after{top:5px}
.burger[aria-expanded="true"] i{background:transparent}
.burger[aria-expanded="true"] i::before{top:0;transform:rotate(45deg)}
.burger[aria-expanded="true"] i::after{top:0;transform:rotate(-45deg)}

/* ---------- mobile nav menu (<=920px) ---------- */
@media(max-width:920px){
  .burger{display:grid}
  .nav .links{
    display:none;
    position:absolute;
    top:calc(100% + var(--sp-3));
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    gap:var(--sp-1);
    margin-left:0;
    background:var(--white);
    border-radius:var(--r-nav);
    box-shadow:0 14px 36px rgba(0,0,0,.16);
    padding:var(--sp-3);
    z-index:20;
  }
  .nav .links.open{display:flex}
  .nav .links a{padding:var(--sp-4) var(--sp-4);border-radius:var(--r-card);width:100%;font-size:var(--text-base)}
  .nav .links a:hover{background:var(--cream)}
  .nav .links a[aria-current="page"]{background:var(--cream-2)}
}

/* ---------- buttons ---------- */
.btn{border-radius:var(--r-pill);padding:var(--sp-4) var(--sp-6);font-size:var(--text-base);font-weight:600;
  text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  border:0;cursor:pointer;font-family:var(--font);transition:transform .14s ease,box-shadow .14s ease,opacity .14s ease}
.btn:active{transform:translateY(1px)}
.btn-sm{padding:var(--sp-3) var(--sp-5)}
.b-dark{background:var(--char);color:var(--white)}
.b-white{background:var(--white);color:var(--char)}
.b-line{border:1.5px solid rgba(28,28,26,.3);color:var(--char);background:transparent}
.btnrow{display:flex;gap:var(--sp-3);flex-wrap:wrap}

.b-dark:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(28,28,26,.18)}
.b-white:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(28,28,26,.1)}
.b-line:hover{transform:translateY(-1px);border-color:rgba(28,28,26,.5)}

@media (prefers-reduced-motion: reduce){
  .b-dark:hover,.b-white:hover,.b-line:hover{transform:none;box-shadow:none}
}

/* ---------- the field ---------- */
.field{background:var(--field);border-radius:var(--r-field);margin-top:-32px;
  padding-top:82px;padding-bottom:clamp(52px,6vw,82px)}
.kick{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;
  color:var(--char);opacity:.75;margin-bottom:var(--sp-6)}

/* ---------- hero ---------- */
.hero h1{max-width:16ch}
.hero .sub{margin-top:var(--sp-6);font-size:clamp(var(--text-md),1.75vw,1.375rem);line-height:1.5;
  max-width:44ch;color:var(--char);opacity:.72}
.hero .btnrow{margin-top:var(--sp-7)}

/* ---------- metadata row ---------- */
.meta{display:flex;flex-wrap:wrap;align-items:center;margin-top:var(--sp-7);gap:var(--sp-3) var(--sp-5);
  border-top:1px solid rgba(28,28,26,.16);padding-top:var(--sp-4)}
.meta span{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;
  color:var(--char);opacity:.80;padding-right:var(--sp-5);
  border-right:1px solid rgba(28,28,26,.18);line-height:1.4}
.meta span:last-child{border-right:0;padding-right:0}
.meta.on-white span{color:var(--char-mut);opacity:1;border-right-color:var(--cream-2)}

@media(max-width:900px){
  .meta{display:grid;grid-template-columns:repeat(3,1fr);align-items:start;gap:var(--sp-4) var(--sp-5)}
  .meta span{padding-right:0;border-right:0}
}
@media(max-width:560px){
  .meta{grid-template-columns:1fr;gap:var(--sp-3)}
  .meta span{display:flex;align-items:center;gap:var(--sp-3)}
  .meta span::before{content:"";flex:none;width:4px;height:4px;
    border-radius:var(--r-pill);background:currentColor}
}

/* ---------- panels ---------- */
.panel{background:var(--white);border-radius:var(--r-panel);padding:clamp(var(--sp-6),2.8vw,34px)}
.panel.ink{background:var(--char);color:var(--cream)}
.panel.ink p{color:#B8B5AC}
.panel p{color:var(--char-soft);font-size:var(--text-base)}
.plab{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;
  opacity:.7;margin-bottom:var(--sp-4)}

/* ---------- tray of image cards ---------- */
.tray{background:var(--white);border-radius:var(--r-panel);padding:var(--sp-4);
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4)}
@media(max-width:860px){.tray{grid-template-columns:1fr}}
.tcard{position:relative;border-radius:var(--r-card);overflow:hidden;min-height:215px;
  display:flex;align-items:flex-end;padding:var(--sp-5);color:var(--white);text-decoration:none}
.tcard::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 36%,rgba(0,0,0,.6))}
.tcard>*{position:relative;z-index:2}
.tcard .row{display:flex;align-items:center;width:100%;gap:var(--sp-3)}
.tcard span{font-size:var(--text-md);font-weight:600}
.tcard .arrow{margin-left:auto;width:30px;height:30px;border-radius:var(--r-pill);
  background:var(--white);color:var(--char);display:grid;place-items:center;font-size:var(--text-sm);flex:none}

/* ---------- lists ---------- */
.inc{list-style:none;margin:var(--sp-5) 0 var(--sp-6);padding:0;font-size:var(--text-base)}
.inc li{padding:var(--sp-2) 0 var(--sp-2) 25px;position:relative;color:var(--char-soft)}
.inc li::before{content:"";position:absolute;left:0;top:14px;width:12px;height:12px;
  border-radius:var(--r-pill);background:var(--field)}
.tick,.cross{list-style:none;margin:var(--sp-4) 0 0;padding:0;font-size:var(--text-base)}
.tick li,.cross li{padding:var(--sp-2) 0 var(--sp-2) 27px;position:relative;color:var(--char-soft)}
.tick li::before{content:"";position:absolute;left:0;top:12px;width:16px;height:16px;border-radius:50%;
  background:var(--field-l) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234C6B2A' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/10px no-repeat}
.cross li{color:var(--char-mut)}
.cross li::before{content:"";position:absolute;left:0;top:12px;width:16px;height:16px;border-radius:50%;
  background:var(--cream-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A8578' stroke-width='3.5' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E") center/9px no-repeat}

/* ---------- price ---------- */
.price{display:flex;align-items:baseline;gap:var(--sp-2);margin:var(--sp-1) 0 var(--sp-1)}
.price b{font-size:clamp(2.75rem,5.4vw,3.75rem);font-weight:800;letter-spacing:-.05em;line-height:.92}
.price span{font-size:var(--text-base);color:var(--char-mut)}

/* ---------- homepage pricing panel ---------- */
.pricing-panel{display:flex;flex-direction:column}
.pricing-panel .inc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:0 var(--sp-6);margin-bottom:auto}
.pricing-panel .inc li{padding-right:var(--sp-2)}
@media(max-width:560px){.pricing-panel .inc{grid-template-columns:1fr}}

/* ---------- stat trio ---------- */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
.trio div{background:var(--white);border-radius:var(--r-card);padding:var(--sp-5)}
.trio b{display:block;font-size:var(--text-2xl);font-weight:800;letter-spacing:-.04em;line-height:1}
.trio i{font-style:normal;display:block;font-size:var(--text-xs);color:var(--char-mut);margin-top:var(--sp-1)}

/* ---------- two-column blocks ---------- */
.evg{display:grid;grid-template-columns:1.2fr .8fr;gap:var(--sp-4)}
.evcol{display:grid;gap:var(--sp-4);align-content:start}
.fit{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-4)}
@media(min-width:901px){
  #work .evg>.evcol{align-content:stretch}
  #work .evg>.evcol:last-child{grid-template-rows:auto 1fr}
}
@media(max-width:900px){.evg{grid-template-columns:1fr}}
@media(max-width:760px){.fit{grid-template-columns:1fr}}

/* ---------- accordion ---------- */
.acc{border-top:1px solid var(--cream-2)}
.acc details{border-bottom:1px solid var(--cream-2)}
.acc summary{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-5);
  padding:var(--sp-5) 0;cursor:pointer;list-style:none;font-weight:600;font-size:var(--text-base)}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"";flex:none;width:16px;height:16px;transition:transform .2s ease;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E6C64' stroke-width='2.5' stroke-linecap='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E") center/contain no-repeat}
.acc details[open] summary::after{transform:rotate(45deg)}
.acc details>div{padding-bottom:var(--sp-5);color:var(--char-mut);font-size:var(--text-base);max-width:68ch}
.acc summary:hover{color:var(--field-d-text)}

/* ---------- thesis line (motion 02) ---------- */
.tline{margin-top:var(--sp-6)}
.tline .row{margin-bottom:var(--sp-5)}
.tline .row:last-child{margin-bottom:0}
.tline .cap{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;
  display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--sp-1) var(--sp-4);
  color:var(--char-mut);margin-bottom:var(--sp-2)}
.tline .cap span{white-space:nowrap}
.tline .row.good .cap{color:var(--field-d-text)}
.draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len)}
.playing .draw{animation:draw 1.25s cubic-bezier(.22,1,.36,1) forwards}
.playing .draw.s2{animation-delay:.7s}
.playing .draw.s3{animation-delay:1.4s}
.playing .draw.long{animation-duration:2.1s;animation-delay:.15s}
.playing .pop{animation:pop .45s cubic-bezier(.34,1.56,.64,1) backwards}
.pop{transform-box:fill-box;transform-origin:center}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:560px){
  .tline .cap{font-size:var(--text-xs);letter-spacing:.07em;gap:var(--sp-1) var(--sp-3);margin-bottom:var(--sp-2)}
  .tline .row{margin-bottom:var(--sp-6)}
  .tline line{stroke-width:7}
  .tline circle{r:7}
}

/* ---------- scroll spine (motion 03) ---------- */
.spine{position:relative;display:grid;grid-template-columns:70px 1fr;background:var(--white);
  border-radius:var(--r-panel);overflow:hidden}
@media(max-width:640px){.spine{grid-template-columns:52px 1fr}}
.rail{position:relative;border-right:1px solid var(--cream-2)}
.track{position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--cream-2);transform:translateX(-50%)}
.fill{position:absolute;left:50%;top:0;width:2px;height:0;background:var(--field-d);
  transform:translateX(-50%);transition:height .1s linear}
.node{position:absolute;left:50%;width:11px;height:11px;border-radius:50%;background:var(--white);
  border:2px solid var(--cream-2);transform:translate(-50%,-50%);transition:.3s}
.node.on{background:var(--field-d);border-color:var(--field-d);box-shadow:0 0 0 5px var(--field-l)}
.step{padding:clamp(28px,3.4vw,44px);border-bottom:1px solid var(--cream-2);
  opacity:1;transform:none;transition:opacity .45s ease,transform .45s ease}
.step:last-child{border-bottom:0}
.step.dim{opacity:.34;transform:translateY(6px)}
.step.on{opacity:1;transform:none}
.step .n{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;color:var(--field-d-text);
  display:block;margin-bottom:var(--sp-2)}
.step p{margin-top:var(--sp-2);color:var(--char-mut);font-size:var(--text-base)}

/* ---------- live queue (motion 04) ---------- */
.qwrap{background:var(--white);border-radius:var(--r-panel);padding:clamp(var(--sp-6),3vw,34px)}
.queue{display:grid;gap:var(--sp-2)}
.q{display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-4) var(--sp-5);border-radius:var(--r-card);
  background:var(--cream);font-size:var(--text-base);transition:.45s cubic-bezier(.22,1,.36,1)}
.q .dot{width:9px;height:9px;border-radius:50%;background:#CFCCC2;flex:none;transition:.4s}
.q .st{margin-left:auto;font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;
  text-transform:uppercase;color:var(--char-mut);transition:.4s}
.q.active{background:var(--field-l);transform:translateX(5px)}
.q.active .dot{background:var(--field-d);animation:blink 1.15s ease-in-out infinite}
.q.active .st{color:#4C6B2A}
.q.done{opacity:.45}
.q.done .dot{background:var(--char)}
.qbar{height:2px;background:var(--cream-2);margin-top:var(--sp-4);overflow:hidden;border-radius:2px}
.qbar i{display:block;height:100%;width:0;background:var(--field-d)}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}

/* ---------- ticker (motion 05) ---------- */
.ticker{overflow:hidden;padding:52px 0 0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tracks{display:flex;width:max-content;animation:slide 40s linear infinite}
.tracks span{font-size:clamp(var(--text-md),2.1vw,1.625rem);font-weight:600;padding-inline:var(--sp-5);
  white-space:nowrap;letter-spacing:-.025em}
.tracks span::after{content:"·";margin-left:var(--sp-5);opacity:.4}
@keyframes slide{to{transform:translateX(-50%)}}

/* ---------- closing field + footer ---------- */
.close{background:var(--field);border-radius:var(--r-field);
  padding:clamp(44px,6vw,86px) var(--sp-6);text-align:center;margin-bottom:var(--sp-6)}
.close h2{max-width:20ch;margin-inline:auto}
.close p{margin-top:var(--sp-4);opacity:.72;font-size:var(--text-md)}
.footer{padding-block:var(--sp-8) var(--sp-10);font-size:var(--text-sm);color:var(--char-mut)}
.footer-in{display:flex;flex-wrap:wrap;gap:var(--sp-6);justify-content:space-between;align-items:center}
.footer a{text-decoration:none}
.footer a:hover{color:var(--char)}
.flinks{display:flex;flex-wrap:wrap;gap:var(--sp-5)}

/* ---------- ledger ---------- */
.ledger{background:var(--white);border-radius:var(--r-panel);padding:clamp(var(--sp-6),3vw,38px)}
.ledger-head{display:flex;justify-content:space-between;align-items:baseline;gap:var(--sp-4);
  font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;
  color:var(--char-mut);padding-bottom:var(--sp-4);border-bottom:1.5px dashed var(--cream-2);margin-bottom:2px}
.li{display:flex;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-3) 0;
  border-bottom:1px dashed var(--cream-2);font-size:var(--text-base);color:var(--char-soft)}
.li span:last-child{font-family:var(--mono);color:var(--field-d-text);flex:none;font-weight:600}
.ledger .total{display:flex;justify-content:space-between;align-items:baseline;
  padding-top:var(--sp-5);margin-top:var(--sp-2);border-top:1.5px solid var(--char)}
.ledger .total span{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--char-mut)}
.ledger .total b{font-size:clamp(2rem,4vw,2.75rem);letter-spacing:-.04em;font-weight:800}
.ledger .nfp-note{margin-top:var(--sp-4);font-size:var(--text-sm);text-align:center;color:var(--char-mut)}
.ledger .nfp-note a{color:var(--field-d-text);font-weight:600;text-decoration:none}
.ledger .nfp-note a:hover{text-decoration:underline}

/* ---------- lead split: hero copy beside the ledger card ----------
   Stacked below 921px, where the card fills its column rather than sitting in
   a 560px block with dead space down the right-hand side. */
.lead-split{display:grid;gap:var(--sp-8)}
@media(min-width:921px){
  .lead-split{grid-template-columns:repeat(2,minmax(0,1fr));
    gap:clamp(var(--sp-8),5vw,72px);align-items:center}
  /* the hero heads its own column here, so it stays left of the card rather
     than centring the way a full-width hero does */
  .lead-split .hero{text-align:left}
  .lead-split .hero h1,.lead-split .hero .sub{margin-inline:0}
  .lead-split .hero .btnrow,.lead-split .hero .meta{justify-content:flex-start}
  .lead-split .ledger{max-width:560px;margin-inline:0}
}

/* ---------- founder-forward about split ---------- */
.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:var(--sp-4);align-items:stretch}
@media(max-width:900px){.split{grid-template-columns:1fr}}
/* square source (1254x1254) filling a taller column — cover, biased up so the face stays in frame */
.split .photo{display:block;width:100%;height:100%;min-height:360px;
  object-fit:cover;object-position:50% 30%;
  border-radius:var(--r-panel);background:var(--field);
  background-image:linear-gradient(150deg,var(--field-d),var(--field) 60%,var(--field-l))}
@media(max-width:900px){
  .split .photo{height:auto;min-height:0;aspect-ratio:1/1;max-height:440px}
}
.split .copy{background:var(--white);border-radius:var(--r-panel);padding:clamp(28px,4vw,52px);
  display:flex;flex-direction:column;justify-content:center}
.split .copy p{color:var(--char-soft);font-size:var(--text-md);margin-top:var(--sp-4);max-width:48ch}
.split .copy p:first-of-type{margin-top:var(--sp-5)}
.split .sig{margin-top:var(--sp-5);font-family:Georgia,serif;font-style:italic;font-size:var(--text-2xl);color:var(--char)}

/* ---------- NFP tint block ---------- */
.tintblock{background:var(--field-l);border-radius:var(--r-panel);padding:clamp(var(--sp-6),3vw,36px);
  display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-5)}
@media(max-width:760px){.tintblock{grid-template-columns:1fr}}
.tintblock div{text-align:center}
.tintblock b{display:block;font-size:clamp(var(--text-xl),3vw,2rem);font-weight:800;letter-spacing:-.03em}
.tintblock i{font-style:normal;display:block;margin-top:var(--sp-2);font-size:var(--text-sm);color:var(--char-soft)}

/* ---------- partner calculator ---------- */
.calc{background:var(--white);border-radius:var(--r-panel);padding:clamp(var(--sp-6),3vw,36px)}
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-7)}
@media(max-width:900px){.calc-grid{grid-template-columns:1fr}}
.calc-field{margin-bottom:var(--sp-6)}
.calc-field:last-child{margin-bottom:0}
.calc-field label{display:flex;justify-content:space-between;font-size:var(--text-sm);font-weight:600;margin-bottom:var(--sp-3)}
.calc-field .val{font-family:var(--mono);color:var(--field-d-text);font-weight:600}
.calc-field input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:32px;
  background:transparent;border-radius:var(--r-pill);cursor:pointer;--range-progress:17.24%}
.calc-field input[type=range]::-webkit-slider-runnable-track{height:10px;border-radius:var(--r-pill);
  background:linear-gradient(to right,var(--field-d) 0 var(--range-progress),var(--char) var(--range-progress) 100%)}
.calc-field input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;
  margin-top:-8px;border:4px solid var(--cream);border-radius:50%;background:var(--field-d);
  box-shadow:0 0 0 2px var(--char),0 3px 10px rgba(28,28,26,.24)}
.calc-field input[type=range]::-moz-range-track{height:10px;border-radius:var(--r-pill);background:var(--char)}
.calc-field input[type=range]::-moz-range-progress{height:10px;border-radius:var(--r-pill);background:var(--field-d)}
.calc-field input[type=range]::-moz-range-thumb{width:18px;height:18px;border:4px solid var(--cream);border-radius:50%;
  background:var(--field-d);box-shadow:0 0 0 2px var(--char),0 3px 10px rgba(28,28,26,.24)}
.calc-out{background:var(--cream);border-radius:var(--r-card);padding:clamp(var(--sp-5),2.6vw,28px)}
.calc-out .row{display:flex;justify-content:space-between;align-items:baseline;
  padding:var(--sp-3) 0;border-bottom:1px solid var(--cream-2);font-size:var(--text-base)}
.calc-out .row:last-child{border-bottom:0}
.calc-out .row b{font-size:var(--text-xl);font-weight:800;letter-spacing:-.03em}
.calc-out .headline{background:var(--char);color:var(--cream);border-radius:var(--r-card);
  padding:var(--sp-5) var(--sp-6);margin-bottom:var(--sp-4);text-align:center}
.calc-out .headline b{display:block;font-size:clamp(var(--text-2xl),3.2vw,2.5rem);font-weight:800;letter-spacing:-.03em;color:var(--white)}
.calc-out .headline span{font-size:var(--text-xs);font-family:var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.65}
.calc-foot{margin-top:var(--sp-4);font-size:var(--text-sm);color:var(--char-mut);text-align:center;
  max-width:var(--w-prose);margin-inline:auto}
.tiertable-wrap{overflow-x:auto;margin-top:var(--sp-2);-webkit-overflow-scrolling:touch}
.tiertable{width:100%;min-width:480px;border-collapse:collapse;font-size:var(--text-base)}
.tiertable th,.tiertable td{text-align:left;padding:var(--sp-3) var(--sp-3);border-bottom:1px solid var(--cream-2);white-space:nowrap}
.tiertable th{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.1em;text-transform:uppercase;color:var(--char-mut);font-weight:500}
.tiertable td:last-child,.tiertable th:last-child{text-align:right}

/* ---------- legal/simple content ---------- */
.legal{max-width:74ch;margin-inline:auto}
.legal h2{margin-top:var(--sp-9);font-size:var(--text-xl)}
.legal h2:first-child{margin-top:0}
.legal p,.legal li{color:var(--char-soft);font-size:var(--text-base);margin-top:var(--sp-3)}
.legal ul{padding-left:var(--sp-6)}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-4);margin-top:var(--sp-7)}
@media(max-width:760px){.steps3{grid-template-columns:1fr}}
.steps3 .panel .n{font-family:var(--mono);font-size:var(--text-xs);letter-spacing:.12em;color:var(--field-d-text);display:block;margin-bottom:var(--sp-2)}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .draw{stroke-dashoffset:0!important}
  .step{opacity:1!important;transform:none!important}
}

/* ---------- focus states ---------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
summary:focus-visible,
.btn:focus-visible,
.tcard:focus-visible{
  outline:2.5px solid var(--char);
  outline-offset:2px;
  border-radius:var(--r-card);
}
.nav .links a:focus-visible{outline-offset:4px}
.burger:focus-visible{outline-offset:3px}
input[type=range]:focus-visible{outline-offset:6px}

/* ---------- nav mobile CTA ---------- */
.nav .right .btn-nav-primary{display:inline-flex}
.nav-mobile-cta{display:none}
@media(max-width:920px){
  .nav .right .btn-nav-primary{display:none}
  .nav-mobile-cta{
    display:block;
    padding:var(--sp-2) var(--sp-2) var(--sp-1);
    border-top:1px solid var(--cream-2);
    margin-top:var(--sp-2);
  }
  .nav-mobile-cta .btn{width:100%;justify-content:center}
}

/* ---------- text inputs ---------- */
.input-wrap{position:relative;margin-bottom:0}
.input-wrap input[type=text],
.input-wrap input[type=email],
.input-wrap input[type=tel],
.input-wrap select,
.input-wrap textarea{
  width:100%;font-family:var(--font);font-size:var(--text-base);color:var(--char);
  background:var(--cream);border:1.5px solid rgba(28,28,26,.18);
  border-radius:var(--r-card);padding:var(--sp-4) var(--sp-4);
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease;
  outline:none;-webkit-appearance:none;appearance:none;
}
.input-wrap select{cursor:pointer}
.input-wrap input::placeholder,.input-wrap textarea::placeholder{color:var(--char-mut)}
.input-wrap input:hover,.input-wrap select:hover,.input-wrap textarea:hover{border-color:rgba(28,28,26,.35)}
.input-wrap input:focus,.input-wrap select:focus,.input-wrap textarea:focus{
  border-color:var(--char);background:var(--white);
  box-shadow:0 0 0 3px rgba(28,28,26,.08);
}
.input-error{display:none;color:#B43E2A;font-size:var(--text-sm);margin-top:var(--sp-2)}
.input-wrap textarea{display:block;min-height:112px;resize:vertical}
.input-wrap [aria-invalid="true"]{border-color:#B43E2A;background:#FFF8F6}

/* ---------- modal ---------- */
.modal-overlay{
  position:fixed;inset:0;z-index:50;
  background:rgba(28,28,26,.55);backdrop-filter:blur(3px);
  /* flex-start + auto margins on the dialog: centred while there is room, and
     scrollable from the top rather than clipped once there isn't */
  display:flex;align-items:flex-start;justify-content:center;padding:var(--sp-4);
  overflow-y:auto;overscroll-behavior:contain;
  opacity:0;pointer-events:none;transition:opacity .2s ease;
}
.modal-overlay.open{opacity:1;pointer-events:all}
.modal-dialog{
  background:var(--white);border-radius:var(--r-panel);
  padding:clamp(28px,4.5vw,48px);width:100%;max-width:490px;
  position:relative;max-height:calc(100dvh - var(--sp-8));overflow-y:auto;
  margin-block:auto;
  transform:translateY(14px);transition:transform .25s cubic-bezier(.22,1,.36,1);
}
.modal-overlay.open .modal-dialog{transform:none}
/* a 490px card is not the place for the page's fluid display heading */
.modal-dialog h2{font-size:var(--text-xl);line-height:1.15}
.modal-close{
  position:absolute;top:var(--sp-4);right:var(--sp-4);width:36px;height:36px;
  border-radius:var(--r-pill);background:var(--cream);border:0;cursor:pointer;
  font-size:var(--text-lg);color:var(--char);display:grid;place-items:center;line-height:1;
}
.modal-close:hover{background:var(--cream-2)}
.modal-back{
  background:none;border:0;cursor:pointer;padding:0;margin-bottom:var(--sp-5);
  font-size:var(--text-sm);color:var(--char-mut);font-family:var(--font);
  display:inline-flex;align-items:center;gap:var(--sp-1);
}
.modal-back:hover{color:var(--char)}
.modal-label{font-size:var(--text-sm);font-weight:600;color:var(--char);margin:var(--sp-5) 0 var(--sp-2)}
.modal-label:first-of-type{margin-top:0}
.modal-form-field{margin-top:var(--sp-4)}
.modal-form-field:first-child{margin-top:var(--sp-5)}
.modal-form-field .modal-label{display:block;margin:0 0 var(--sp-2)}
.modal-optional{font-weight:400;color:var(--char-mut)}
.modal-submit-error{text-align:center}
.enquiry-honeypot{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(1px,1px,1px,1px)!important;white-space:nowrap!important}
.modal-or{text-align:center;font-size:var(--text-sm);color:var(--char-mut);
  margin:var(--sp-2) 0;font-family:var(--mono);letter-spacing:.06em}
.modal-path-cards{display:grid;gap:var(--sp-3);margin-top:var(--sp-6)}
.modal-path-card{
  background:var(--cream);border:1.5px solid rgba(28,28,26,.12);
  border-radius:var(--r-card);padding:var(--sp-5) var(--sp-5);text-align:left;cursor:pointer;
  font-family:var(--font);transition:border-color .15s ease,background .15s ease;
  text-decoration:none;display:block;width:100%;
}
.modal-path-card:hover{border-color:rgba(28,28,26,.5);background:var(--white)}
.modal-path-card:disabled{cursor:not-allowed;opacity:.58}
.modal-path-card:disabled:hover{border-color:rgba(28,28,26,.12);background:var(--cream)}
.modal-path-card strong{display:block;font-size:var(--text-base);font-weight:700;color:var(--char)}
.modal-path-card span{display:block;font-size:var(--text-sm);color:var(--char-mut);margin-top:var(--sp-1)}
.chip-row{display:flex;gap:var(--sp-2);flex-wrap:wrap}
.chip{
  padding:var(--sp-2) var(--sp-5);border-radius:var(--r-pill);
  border:1.5px solid rgba(28,28,26,.18);background:transparent;
  cursor:pointer;font-size:var(--text-base);font-family:var(--font);
  color:var(--char-soft);transition:all .15s ease;
}
.chip:hover{border-color:rgba(28,28,26,.5);color:var(--char)}
.chip.selected{background:var(--field);border-color:var(--field-d);color:var(--char);font-weight:600}
.modal-success-icon{
  width:56px;height:56px;border-radius:50%;background:var(--field);
  display:flex;align-items:center;justify-content:center;font-size:var(--text-xl);margin:0 auto var(--sp-5);
}
.modal-note{font-size:var(--text-sm);color:var(--char-mut);text-align:center;margin-top:var(--sp-3)}

/* ---------- embedded booking modal ---------- */
.modal-overlay.booking-open .modal-dialog{
  max-width:1180px;padding:0;overflow:hidden;background:var(--cream);
}
.modal-overlay.booking-open .modal-close{
  z-index:2;top:20px;right:20px;background:var(--cream);box-shadow:0 4px 18px rgba(28,28,26,.12);
}
.booking-shell{display:grid;grid-template-columns:minmax(280px,34%) minmax(0,1fr);min-height:700px}
.booking-intro{
  position:relative;overflow:hidden;background:var(--char);color:var(--white);
  padding:40px 36px;display:flex;flex-direction:column;justify-content:space-between;gap:48px;
}
.booking-intro::after{
  content:"";position:absolute;width:320px;height:320px;right:-180px;bottom:-165px;
  border-radius:50%;background:var(--field);opacity:.92;
}
.booking-brand{position:relative;z-index:1;font-size:var(--text-lg);font-weight:800;letter-spacing:-.04em}
.booking-intro-copy{position:relative;z-index:1}
.booking-intro .kick{color:var(--field);margin-bottom:12px}
.booking-intro h2{font-size:clamp(2rem,3vw,2.75rem);line-height:1.02;letter-spacing:-.045em}
.booking-intro p{margin-top:18px;color:rgba(255,255,255,.72);font-size:var(--text-md);line-height:1.5}
.booking-details{position:relative;z-index:1;display:grid;gap:14px}
.booking-details div{padding-top:14px;border-top:1px solid rgba(255,255,255,.16);display:grid;gap:2px}
.booking-details strong{font-size:var(--text-base)}
.booking-details span{color:rgba(255,255,255,.58);font-size:var(--text-sm)}
.booking-calendar{min-width:0;padding:28px 28px 24px;background:var(--cream)}
.booking-calendar-label{
  margin:0 52px 16px 2px;font-family:var(--mono);font-size:var(--text-xs);font-weight:500;
  letter-spacing:.16em;text-transform:uppercase;color:var(--char-mut);
}
.booking-embed{
  min-height:640px;border:1px solid rgba(28,28,26,.1);border-radius:var(--r-card);
  overflow:hidden;background:var(--white);position:relative;box-shadow:0 16px 40px rgba(28,28,26,.07);
}
.booking-embed iframe{display:block;width:100%;height:640px;border:0;background:var(--white)}
@media(max-width:680px){
  .modal-overlay.booking-open{padding:0}
  .modal-overlay.booking-open .modal-dialog{
    min-height:100dvh;max-height:none;border-radius:0;padding:0;background:var(--cream);
  }
  .modal-overlay.booking-open .modal-close{top:14px;right:14px}
  .booking-shell{display:block;min-height:100dvh}
  .booking-intro{padding:24px 64px 22px 20px;gap:22px}
  .booking-intro::after{width:170px;height:170px;right:-105px;bottom:-105px}
  .booking-brand{font-size:var(--text-base)}
  .booking-intro .kick{margin-bottom:8px}
  .booking-intro h2{font-size:1.75rem;max-width:310px}
  .booking-intro p{margin-top:10px;font-size:var(--text-base);max-width:420px}
  .booking-details{display:flex;gap:18px;flex-wrap:wrap}
  .booking-details div{padding-top:8px;min-width:120px}
  .booking-details div:nth-child(3){display:none}
  .booking-calendar{padding:14px 8px 8px}
  .booking-calendar-label{margin:0 44px 10px 6px}
  .booking-embed{min-height:650px;border-radius:12px;box-shadow:none}
  .booking-embed iframe{height:650px;min-height:650px}
}

/* ---------- commitments block (D7 trust section) ---------- */
.commitments{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sp-3)}
@media(max-width:860px){.commitments{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.commitments{grid-template-columns:1fr}}
.commitment{background:var(--white);border-radius:var(--r-card);padding:var(--sp-5) var(--sp-6)}
.commitment .cicon{font-size:var(--text-lg);margin-bottom:var(--sp-3)}
.commitment h3{font-size:var(--text-base);font-weight:700;margin:0;color:var(--char);letter-spacing:-.01em}
.commitment p{margin-top:var(--sp-2);font-size:var(--text-base);color:var(--char-mut);line-height:1.55}

/* ==========================================================================
   DESKTOP BALANCE (>=921px)
   Above the mobile-nav breakpoint the content column is ~1290px wide — wide
   enough that a left-aligned heading or a narrow block leaves a large void
   beside it, and wide enough that a single row of text runs well past a
   readable measure. These rules centre what stands alone and cap what
   stretches. Everything at 920px and below is deliberately left untouched.
   ========================================================================== */
@media(min-width:921px){

  /* section heads sit over the middle of the content they introduce */
  .sechead{max-width:58ch;margin-inline:auto;text-align:center}

  /* hero: centred in the field rather than hugging its left edge */
  .hero{text-align:center}
  .hero h1,.hero .sub{margin-inline:auto}
  .hero .btnrow,.hero .meta{justify-content:center}

  /* the pricing ledger is a narrow card in a very wide field */
  .ledger{margin-inline:auto}

  /* stacked components: cap the row so labels and values stay related */
  .acc,.qwrap,.spine{max-width:var(--w-block);margin-inline:auto}
  .step p{max-width:68ch}

  /* evergreen split: let both columns run the full height of the
     taller column beside them instead of leaving a void underneath */
  .evg>.evcol:last-child{align-content:stretch}
  .evg>.evcol:last-child .panel{display:flex;flex-direction:column}
  #work .evg>.evcol:last-child .panel.ink{justify-content:center}
  .evg>.evcol:last-child .inc{margin-bottom:auto}
}

/* Embedded Stripe checkout panel (mpE) */
#modal-embed{min-height:480px}
#modal-embed iframe{border:0!important;border-radius:8px!important}
.modal-note{color:var(--char-mut);font-size:var(--text-sm);text-align:center;padding:24px 0;margin:0}
