/* ==========================================================================
   CAKESMASH DESIGN RULES, Oct 13 2026 (Impeccable site pass, Kyle's notes)
   Loaded LAST on every core page, so these rules win.
   1. Two faces only: Gloock for headings, DM Sans for everything you read.
   2. Reading text is never fine print: 18px body, 21px leads, regular weight,
      near-full brightness on dark, near-black on light.
   3. Light bands always get dark ink. Dark bands always get light ink.
   4. No small labels above headings. The heading carries its own weight.
   5. One footer, built like the rest of the site.
   ========================================================================== */

:root{
  --ink:#1b1f29;          /* text on light bands */
  --ink-soft:#3b4250;     /* secondary text on light bands */
  --paper:#f3f0eb;        /* light band */
  --on-dark:rgba(241,244,249,.93);   /* body text on dark bands */
  --on-dark-soft:rgba(241,244,249,.74);
  --coral:#ee5a73;
  --red:#e3405b;
  --royal:#0e4382;
}

/* ---------- 1 + 2. Type: one display face, readable body ---------- */
body.v3{--font-display:'Gloock',Georgia,serif;--font-body:'DM Sans','Helvetica Neue',Arial,sans-serif;--v3-text:var(--on-dark)}
body.v3{font-family:var(--font-body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.v3 p,body.v3 li{font-size:18px;line-height:1.62;font-weight:400}
body.v3 .lead,body.v3 p.lead{font-size:clamp(19px,1.45vw,21.5px);line-height:1.52;font-weight:400;letter-spacing:-.003em}
body.v3 strong,body.v3 b{font-weight:700}
@media (max-width:640px){
  body.v3 p,body.v3 li{font-size:17.5px}
  body.v3 .lead,body.v3 p.lead{font-size:var(--cs-body-size);line-height:1.55}
}
/* headings that were still in a second serif */
body.v3 h1,body.v3 h2,body.v3 h3{font-family:var(--font-display);font-weight:400}
body.v3 ::selection{background:var(--coral);color:#fff}

/* ---------- 3. Ink by band ---------- */
body.v3 .lite p,body.v3 .lite li,body.v3 .lite .lead{color:var(--ink-soft)}
body.v3 .lite h1,body.v3 .lite h2,body.v3 .lite h3,body.v3 .lite h4{color:var(--ink)}
/* booking page: "What happens on the call" sat white on paper */
body.v3:not(.page-call-confirmed) .why-section h2{color:var(--ink)!important}
body.v3:not(.page-call-confirmed) .why-section p{color:var(--ink-soft)!important;font-size:18px;line-height:1.62}
body.v3.page-call-confirmed .why-section h2{color:#fff!important}
body.v3.page-call-confirmed .why-section p{color:var(--on-dark)!important}
/* manifesto article: paragraphs were near-white on near-white */
body.v3 .mf-article p{color:var(--ink-soft)}
body.v3 .mf-article p.lede{color:var(--ink);font-size:22px;font-weight:500}
body.v3 .mf-article .mf-close{color:var(--ink);font-weight:600}
body.v3 .mf-interstitial p{font-family:var(--font-display);font-style:normal;font-weight:400;font-size:clamp(30px,4.2vw,48px);line-height:1.12;max-width:22ch;color:#fff}
/* contact: "One inbox" heading was royal blue over a dark photo */
body.v3 .gb-contact-direct h2{color:#fff!important}

/* ---------- 4. Labels above headings: gone (markup removed too) ---------- */
body.v3 .mf-eyebrow,body.v3 .hero-eyebrow{display:none}
body.v3 .meta-line{font-size:14px;letter-spacing:.02em;color:var(--on-dark-soft);margin-top:18px}

/* ---------- 5. Footer ---------- */
body.v3 .site-footer.f3v{padding:96px 0 0}
body.v3 .f3v .f-top{grid-template-columns:1.35fr 1fr .8fr;gap:56px}
body.v3 .f3v .footer-logo{height:44px}
body.v3 .f3v .f-tag{font-size:clamp(28px,2.4vw,34px);line-height:1.14;max-width:16ch;margin-top:26px;letter-spacing:-.01em}
body.v3 .f3v .f-h4{font:600 13px/1 var(--font-body);letter-spacing:.14em;color:rgba(241,244,249,.62);margin:6px 0 20px}
body.v3 .f3v .f-contact a.mail{font:400 clamp(22px,1.9vw,27px)/1.25 var(--font-display);letter-spacing:-.005em;border-bottom:0;margin-bottom:18px;
  background:linear-gradient(var(--coral),var(--coral)) 0 100%/100% 1.5px no-repeat;padding-bottom:6px;transition:background-size .35s cubic-bezier(.2,.7,.2,1)}
body.v3 .f3v .f-contact a.mail:hover{background-size:0 1.5px;background-position:100% 100%}
body.v3 .f3v .f-contact a.book{display:inline-flex;align-items:center;gap:10px;margin-top:4px;padding:13px 24px;border-radius:999px;background:var(--red);color:#fff;
  font:600 16px/1 var(--font-body);box-shadow:0 12px 28px -14px rgba(227,64,91,.8);transition:transform .2s,background .2s}
body.v3 .f3v .f-contact a.book:hover{background:var(--coral);transform:translateY(-2px)}
body.v3 .f3v .f-contact span{font-size:15px;color:rgba(241,244,249,.62);margin-top:18px}
body.v3 .f3v .f-links a{font:400 18px/2.05 var(--font-body);color:rgba(241,244,249,.86)}
body.v3 .f3v .f-links a:hover{color:var(--coral)}
body.v3 .f3v .f-big{margin:84px 0 22px;opacity:1;color:rgba(255,255,255,.95)}
body.v3 .f3v .f-legal{font-size:13.5px;color:rgba(241,244,249,.62);padding:24px 0 34px}
body.v3 .f3v .f-legal a{color:rgba(241,244,249,.62)}
body.v3 .f3v .f-legal a:hover{color:#fff}
@media (max-width:820px){
  body.v3 .site-footer.f3v{padding-top:72px}
  body.v3 .f3v .f-top{grid-template-columns:1fr;gap:40px}
  body.v3 .f3v .f-big{margin:56px 0 18px}
  body.v3 .f3v .f-legal{flex-direction:column;align-items:flex-start;gap:10px}
  body.v3 .f3v .f-legal a{margin:0 18px 0 0}
}

/* ---------- Contact header: the springboard to the call ---------- */
body.v3 .ct-hero{position:relative;overflow:hidden;color:#fff;padding:150px 0 110px;
  background:radial-gradient(90% 120% at 85% 10%,rgba(238,90,115,.30) 0%,rgba(238,90,115,0) 55%),
             linear-gradient(160deg,#123f86 0%,#1a1550 52%,#0a0f1e 100%)}
body.v3 .ct-grid{max-width:1180px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1.15fr .85fr;gap:72px;align-items:center}
body.v3 .ct-hero h1{font-size:clamp(46px,5.6vw,82px);line-height:.98;letter-spacing:-.025em;margin:0;color:#fff;text-wrap:balance}
body.v3 .ct-hero h1 i{font-style:italic;color:var(--coral)}
body.v3 .ct-hero .ct-lead{font-size:clamp(19px,1.5vw,22px);line-height:1.52;color:var(--on-dark);max-width:34ch;margin:28px 0 0}
body.v3 .ct-actions{display:flex;flex-wrap:wrap;align-items:center;gap:22px;margin-top:36px}
body.v3 .ct-actions .btn{margin:0}
body.v3 .ct-actions .ct-mail{color:#fff;text-decoration:none;font-size:17px;border-bottom:1.5px solid var(--coral);padding-bottom:3px}
body.v3 .ct-hero .ct-micro{font-size:15px;line-height:1.55;color:var(--on-dark-soft);max-width:46ch;margin:30px 0 0}
body.v3 .ct-portrait{margin:0;position:relative}
body.v3 .ct-portrait img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%;border-radius:18px;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.08)}
body.v3 .ct-portrait figcaption{position:absolute;left:22px;bottom:20px;font:400 22px/1.15 var(--font-display);color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.6)}
body.v3 .ct-portrait figcaption span{display:block;font:500 14px/1.4 var(--font-body);color:rgba(241,244,249,.85);margin-top:4px}
@media (max-width:900px){
  body.v3 .ct-hero{padding:118px 0 72px}
  body.v3 .ct-grid{grid-template-columns:1fr;gap:44px;padding:0 20px}
  body.v3 .ct-portrait{max-width:420px}
}

/* ---------- Facts: a real header, and the same tier boxes as What We Run ---------- */
body.v3 .fx-hero{background:radial-gradient(80% 120% at 90% 0%,rgba(238,90,115,.22) 0%,rgba(238,90,115,0) 55%),linear-gradient(165deg,#123f86 0%,#17134a 60%,#0a0f1e 100%)!important;color:#fff!important}
body.v3 .fx-hero h1{color:#fff!important;font-size:clamp(44px,5.4vw,76px);line-height:1;letter-spacing:-.025em;text-wrap:balance}
body.v3 .fx-hero p{color:var(--on-dark)!important}
body.v3 .fx-hero .divider{background:rgba(255,255,255,.2)!important}
body.v3 .fx-hero .btn{background:var(--red)!important;border-color:var(--red)!important;color:#fff!important}
body.v3 .fx-term h4,body.v3 .fx-q h4{font:400 clamp(21px,1.7vw,24px)/1.2 var(--font-display);text-transform:none;letter-spacing:-.005em;color:var(--ink)}
body.v3 .fx-term p,body.v3 .fx-q p{font-size:17.5px;color:var(--ink-soft)}
body.v3 .fx-q{padding:24px 0}
body.v3 .fx-quiet{font-size:16px!important;opacity:1!important;color:var(--ink-soft)!important}

/* tier boxes, shared by What We Run and Facts (copied from solutions inline, Sep 14 refinement) */
body.v3 .tier-card{padding:52px 48px 48px;display:flex;flex-direction:column}
body.v3 .tier-card .eyebrow{font-size:11px;letter-spacing:.24em;margin-bottom:18px}
body.v3 .tier-lede{font-family:var(--font-display);font-weight:400;font-size:1.85rem;line-height:1.12;letter-spacing:-.01em;color:#fff;margin:0 0 16px}
body.v3 .tier-price{font:500 10.5px/1 var(--font-body);letter-spacing:.22em;text-transform:uppercase;color:rgba(232,237,244,.5);margin:0 0 28px;padding-bottom:22px;border-bottom:1px solid rgba(255,255,255,.14)}
body.v3 .tier-reading{font-size:.97rem;line-height:1.6;color:rgba(232,237,244,.74);margin:0 0 8px;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.1)}
body.v3 .tier-reading em{font-family:var(--font-display);font-style:normal;font-size:1.08rem;color:#fff;margin-right:2px}
body.v3 .tier-group{padding:24px 0 10px;border-bottom:1px solid rgba(255,255,255,.1)}
body.v3 .tier-group:last-of-type{border-bottom:0}
body.v3 .tier-glabel{font:700 10px/1 var(--font-body);letter-spacing:.24em;text-transform:uppercase;color:var(--v3-coral);margin:0 0 14px}
body.v3 .tier-card--core .tier-glabel{color:#9fb6ff}
body.v3 .tier-row{display:grid;grid-template-columns:44px 1fr;column-gap:10px;align-items:baseline;padding:7px 0;font-size:.98rem;line-height:1.5;color:rgba(232,237,244,.88)}
body.v3 .tier-row b{color:#fff;font-weight:600}
body.v3 .tier-num{font-family:var(--font-display);font-size:1.75rem;line-height:1;color:#fff;text-align:right;padding-right:2px}
body.v3 .tier-num--none{visibility:hidden}
body.v3 .tier-close{font-family:var(--font-display);font-size:1.25rem;line-height:1.25;color:#fff;margin:auto 0 0;padding-top:26px;border-top:1px solid rgba(255,255,255,.14)}
@media (max-width:820px){body.v3 .tier-card{padding:36px 26px 34px}body.v3 .tier-lede{font-size:1.5rem}body.v3 .tier-row{grid-template-columns:34px 1fr}}

/* ---------- Buttons: readable, sentence case, one shape site-wide ---------- */
body.v3 .btn{font-size:16px!important;font-weight:700;letter-spacing:.01em!important;text-transform:none!important;padding:16px 30px}
body.v3 .ct-hero .ct-micro,body.v3 .fx-hero p+p{font-size:16px}

/* ==========================================================================
   HOMEPAGE LOWER HALF, Oct 13 (Kyle: "no background images... boring and stale")
   Real shoot photography beside each step, one editorial number for proof,
   Kyle's face next to the closing questions.
   ========================================================================== */
body.v3 .hm-wrap{max-width:1200px;margin:0 auto;padding:0 32px;position:relative;z-index:1}
@media (max-width:820px){body.v3 .hm-wrap{padding:0 20px}}

/* How we work */
body.v3 .hm-how{padding:120px 0 110px}
body.v3 .hm-head{text-align:center;max-width:900px;margin:0 auto 88px}
body.v3 .hm-head h2{font-size:clamp(44px,5.6vw,80px);line-height:1;letter-spacing:-.03em;margin:0}
body.v3 .hm-head .lead{margin:20px 0 0;color:var(--on-dark)}
body.v3 .hm-step{display:grid;grid-template-columns:1.15fr 1fr;gap:72px;align-items:center;margin:0 0 96px}
body.v3 .hm-step--flip .hm-shot{order:2}
body.v3 .hm-shot{margin:0;position:relative;border-radius:18px;overflow:hidden;aspect-ratio:4/3;
  box-shadow:0 40px 90px -40px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.07)}
body.v3 .hm-shot img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.04);transition:transform 1.6s cubic-bezier(.16,1,.3,1)}
body.v3 .hm-step.is-visible .hm-shot img{transform:scale(1)}
body.v3 .hm-shot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,20,60,0) 55%,rgba(14,20,60,.35) 100%);pointer-events:none}
body.v3 .hm-n{display:block;font:400 clamp(72px,7vw,112px)/.8 var(--font-display);color:transparent;-webkit-text-stroke:1.2px rgba(238,90,115,.85);margin:0 0 22px}
body.v3 .hm-copy h3{font-size:clamp(32px,3vw,44px);line-height:1.04;letter-spacing:-.02em;color:#fff;margin:0 0 18px}
body.v3 .hm-copy p{font-size:var(--cs-body-size);line-height:1.55;color:var(--on-dark);max-width:40ch;margin:0}
body.v3 .hm-own{text-align:center;border-top:1px solid rgba(255,255,255,.14);padding-top:56px;margin-top:8px}
body.v3 .hm-own p{font:400 clamp(24px,2.3vw,32px)/1.25 var(--font-display);color:#fff;max-width:30ch;margin:0 auto}
body.v3 .hm-link{display:inline-block;margin-top:22px;color:var(--coral);font-weight:700;font-size:17px;text-decoration:none;border-bottom:1.5px solid currentColor;padding-bottom:3px}
@media (max-width:900px){
  body.v3 .hm-how{padding:84px 0 72px}
  body.v3 .hm-head{margin-bottom:56px}
  body.v3 .hm-step{grid-template-columns:1fr;gap:28px;margin-bottom:64px}
  body.v3 .hm-step--flip .hm-shot{order:0}
  body.v3 .hm-n{font-size:64px;margin-bottom:14px}
}

/* Proof: one big number, a ruled stat line, a photographic backdrop */
body.v3 .hm-proof{position:relative;overflow:hidden;padding:130px 0 120px}
body.v3 .hm-proof-bg{position:absolute;inset:0;z-index:0;
  background:linear-gradient(180deg,rgba(18,40,120,.92) 0%,rgba(22,72,190,.86) 45%,rgba(14,40,120,.95) 100%),url('/assets/home/haze.webp') center/cover no-repeat}
body.v3 .hm-proof-grid{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:center}
body.v3 .hm-big{font:400 clamp(180px,22vw,330px)/.78 var(--font-display);letter-spacing:-.06em;color:#fff;text-shadow:0 30px 80px rgba(0,0,0,.35)}
body.v3 .hm-proof-copy h2{font-size:clamp(36px,3.8vw,56px);line-height:1.04;letter-spacing:-.02em;margin:0;color:#fff;text-wrap:balance}
body.v3 .hm-proof-copy .lead{margin:22px 0 0;color:var(--on-dark);max-width:44ch}
body.v3 .hm-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:80px 0 0;border-top:1px solid rgba(255,255,255,.22)}
body.v3 .hm-stats>div{padding:34px 34px 0 0;border-right:1px solid rgba(255,255,255,.14);margin-right:34px}
body.v3 .hm-stats>div:last-child{border-right:0;margin-right:0}
body.v3 .hm-stats dt{font:400 clamp(44px,4.4vw,64px)/1 var(--font-display);letter-spacing:-.02em;color:#fff;margin:0 0 14px}
body.v3 .hm-stats dd{margin:0;font-size:17px;line-height:1.55;color:var(--on-dark)}
body.v3 .hm-stats dd a{color:#fff;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--coral)}
body.v3 .hm-proof-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;margin-top:64px;padding-top:32px;border-top:1px solid rgba(255,255,255,.14)}
body.v3 .hm-proof-foot p{margin:0;color:var(--on-dark-soft);font-size:16px}
@media (max-width:900px){
  body.v3 .hm-proof{padding:88px 0 80px}
  body.v3 .hm-proof-grid{grid-template-columns:1fr;gap:12px}
  body.v3 .hm-big{font-size:150px}
  body.v3 .hm-stats{grid-template-columns:1fr;margin-top:48px}
  body.v3 .hm-stats>div{border-right:0;margin-right:0;padding:28px 0;border-bottom:1px solid rgba(255,255,255,.14)}
  body.v3 .hm-proof-foot{margin-top:36px}
}

/* Close: Kyle's face beside the questions */
body.v3 .hm-close{padding:130px 0 130px}
body.v3 .hm-close-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}
body.v3 .hm-kyle{margin:0;position:relative}
body.v3 .hm-kyle img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 28%;border-radius:18px;box-shadow:0 40px 90px -36px rgba(0,0,0,.8),0 0 0 1px rgba(255,255,255,.08)}
body.v3 .hm-kyle figcaption{position:absolute;left:22px;bottom:20px;font:400 22px/1.15 var(--font-display);color:#fff;text-shadow:0 2px 16px rgba(0,0,0,.6)}
body.v3 .hm-kyle figcaption span{display:block;font:500 14px/1.4 var(--font-body);color:rgba(241,244,249,.85);margin-top:4px}
body.v3 .hm-close-copy{text-align:left}
body.v3 .hm-close-copy h2{font-size:clamp(44px,5vw,76px);line-height:1;letter-spacing:-.03em;margin:0;color:#fff;text-wrap:balance}
body.v3 .hm-close .owner-qs{margin:26px 0 26px;max-width:none}
body.v3 .hm-close .owner-qs li{text-align:left}
body.v3 .hm-close .qs-intro,body.v3 .hm-close .qs-out{text-align:left}
@media (max-width:900px){
  body.v3 .hm-close{padding:84px 0}
  body.v3 .hm-close-grid{grid-template-columns:1fr;gap:40px}
  body.v3 .hm-kyle{max-width:340px}
}

/* ==========================================================================
   OCT 13 refinement round (Kyle: email "so fucking huge", menu bar broken,
   "2 different font sizes of the same font"). Premium = restraint.
   ========================================================================== */
/* Nav: no blur on the menu text, ever */
body.v3 .site-header .nav-links a,body.v3 .site-header a{filter:none!important}
/* Facts: the hero runs under the sticky menu, so no pale band above it */
body.v3 .fx-hero{margin-top:-104px;padding-top:calc(var(--s-10) + 104px)!important}
/* One paragraph size per block. Only a meta line steps down, and it looks different on purpose */
body.v3 .fx-hero p:not(.meta-line),body.v3 .ct-hero .ct-lead,body.v3 .ct-hero .ct-micro{font-size:clamp(18px,1.35vw,20px)!important;line-height:1.55}
body.v3 .ct-hero .ct-micro{color:var(--on-dark-soft)}
body.v3 .meta-line{font-size:13px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--on-dark-soft)!important;margin-top:22px}
/* Buttons: confident, not shouty */
body.v3 .btn{font-size:15px!important;font-weight:600;padding:14px 26px}
/* Footer: quiet and expensive */
body.v3 .f3v .f-tag{font-size:clamp(22px,1.8vw,26px);line-height:1.2;max-width:18ch}
body.v3 .f3v .f-h4{font:600 12px/1 var(--font-body);letter-spacing:.16em;color:rgba(241,244,249,.55);margin:8px 0 18px}
body.v3 .f3v .f-contact a.mail{font:500 16px/1.4 var(--font-body);letter-spacing:.01em;color:#fff;padding-bottom:4px;margin-bottom:14px;background-size:100% 1px}
body.v3 .f3v .f-contact a.book{display:inline-block;padding:0;background:none;box-shadow:none;border-radius:0;color:var(--coral);font:600 16px/1.6 var(--font-body);margin-top:0}
body.v3 .f3v .f-contact a.book:hover{background:none;color:#fff;transform:none}
body.v3 .f3v .f-contact span{font-size:14px;margin-top:10px}
body.v3 .f3v .f-links a{font-size:16px;line-height:2.1}
/* A paragraph that directly follows a lead takes the lead's size: no two sizes side by side */
body.v3 .lead + p:not(.micro):not(.meta-line):not(.qs-out):not(.fx-quiet),body.v3 .lead + p + p:not(.micro):not(.meta-line):not(.qs-out):not(.fx-quiet){font-size:clamp(19px,1.45vw,21.5px);line-height:1.52}