/* ═══════════════════════════════════════════════════════════════════════
   CONSULTING — warmed editorial
   Same visual world, different temperature. This page talks to a nervous
   20-year-old and their parents: warm near-black, sentence case, one serif
   voice (Newsreader italic), a centered reading measure, ghost numerals,
   and far more air than the other two properties. No specimen plates.
   ═══════════════════════════════════════════════════════════════════════ */

body{
  background:#131110;color:#EDEAE2;
  font-size:16px;line-height:1.7;
}
:root{
  --line:#2A2724;--line-soft:#1E1C19;
  --panel:#181614;--panel-2:#1C1A17;
  --mid:#B3AEA4;--dim:#948F85;
  --faint:#87827A; /* was #6A665E — 3.29:1 on this warm ground, failed AA on the
                      kickers/attr/tier numbers; now 4.9:1 (4.6:1 worst panel) */
}
.serif{font-family:"Newsreader",Georgia,"Times New Roman",serif}
em.warm{
  font-family:"Newsreader",Georgia,serif;font-style:italic;font-weight:420;
  letter-spacing:0;text-transform:none;
}

/* nav — same strip, warmer voice: sentence case, serif mark */
.nav{
  position:sticky;top:0;z-index:50;background:rgba(19,17,16,.9);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav .wrap{display:flex;align-items:center;gap:20px;min-height:62px;flex-wrap:wrap}
.mark{
  font-family:"Newsreader",Georgia,serif;font-style:italic;font-weight:460;
  font-size:19px;letter-spacing:.01em;text-decoration:none;white-space:nowrap;
}
.nav ul{display:flex;gap:24px;list-style:none;margin:0 0 0 auto;padding:0;flex-wrap:wrap}
.nav ul a{
  font:450 13px/1 var(--sans);letter-spacing:.01em;color:var(--dim);
  text-decoration:none;padding:8px 0;
}
.nav ul a:hover,.nav ul a:focus-visible{color:var(--bone-hi)}
.nav ul a.on{color:var(--bone-hi);border-bottom:1px solid var(--dim)}

/* ── hero — human scale: text + warm portrait slot ────────────── */
.hero{border-bottom:1px solid var(--line)}
.hero .wrap{
  display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);
  gap:clamp(32px,6vw,88px);align-items:center;
  padding-top:clamp(56px,9vh,110px);padding-bottom:clamp(56px,9vh,110px);
}
.hero .kicker{
  font:500 12px/1.6 var(--mono);letter-spacing:.22em;text-transform:uppercase;
  color:var(--dim);
}
.hero h1{
  font:400 clamp(34px,4.6vw,58px)/1.12 "Newsreader",Georgia,serif;
  letter-spacing:-.015em;margin:22px 0 0;max-width:18ch;
}
.hero h1 i{font-style:italic;color:var(--mid)}
.hero .lede{margin:26px 0 0;font-size:clamp(17px,1.8vw,19px);line-height:1.75;max-width:46ch}
.hero .cta{margin-top:36px}
.hero-img .slot{aspect-ratio:4/5}
.hero-img .slot-cap{justify-content:flex-end}

/* ── sections — generous, centered reading measure ────────────── */
.sec{border-bottom:1px solid var(--line)}
.sec>.wrap{padding-top:clamp(56px,9vh,104px);padding-bottom:clamp(56px,9vh,104px)}
.sec-head{margin:0 0 clamp(32px,5vh,52px)}
.sec-head .kicker{
  font:500 12px/1 var(--mono);letter-spacing:.24em;text-transform:uppercase;
  color:var(--faint);display:block;margin-bottom:16px;
}
.sec-head h2{
  font:420 clamp(26px,3.2vw,40px)/1.18 "Newsreader",Georgia,serif;
  letter-spacing:-.012em;text-transform:none;max-width:24ch;
}
.reading{max-width:720px}

/* ── who this is for — ghost numerals, stacked, offset ────────── */
.whos{display:grid;gap:clamp(28px,4vh,44px)}
.who{
  position:relative;display:grid;grid-template-columns:minmax(0,1fr);
  padding:26px 28px 26px clamp(84px,10vw,130px);min-height:120px;
  border-left:1px solid var(--line);
}
.who:nth-child(2){margin-left:clamp(0px,6vw,90px)}
.who:nth-child(3){margin-left:clamp(0px,12vw,180px)}
.who .gn{
  position:absolute;left:12px;top:50%;transform:translateY(-50%);
  font-family:var(--display);font-weight:700;font-stretch:64%;
  font-size:clamp(56px,7vw,92px);line-height:1;color:transparent;
  -webkit-text-stroke:1px var(--faint);
}
.who h3{font:600 19px/1.35 var(--sans);letter-spacing:-.014em;margin:0 0 8px}
.who p{color:var(--mid);max-width:52ch;margin:0}

/* ── why me — two columns, hung serif ampersand rules ─────────── */
.why{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,64px)}
.why>div{padding-top:20px;border-top:1px solid var(--line)}
.why h3{font:600 18px/1.35 var(--sans);margin:0 0 10px}
.why p{color:var(--mid)}

/* ── pull — the serif voice at full size ──────────────────────── */
.pullband{background:#161412;border-bottom:1px solid var(--line)}
.pullband .wrap{padding-top:clamp(64px,11vh,120px);padding-bottom:clamp(64px,11vh,120px)}
.pullband p{
  font:400 clamp(24px,3.4vw,42px)/1.3 "Newsreader",Georgia,serif;
  font-style:italic;letter-spacing:-.01em;max-width:26ch;margin:0;color:var(--bone-hi);
}
.pullband .attr{
  margin-top:22px;font:500 12px/1 var(--mono);letter-spacing:.2em;
  text-transform:uppercase;color:var(--faint);
}

/* ── sessions — three tiers, middle raised ────────────────────── */
.tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.5vw,28px)}
.tier{
  background:var(--panel);border:1px solid var(--line);
  padding:clamp(24px,3vw,36px);display:flex;flex-direction:column;gap:12px;
}
.tier:nth-child(2){background:var(--panel-2);transform:translateY(-14px)}
.tier .tno{
  font:500 11px/1 var(--mono);letter-spacing:.22em;text-transform:uppercase;
  color:var(--faint);
}
.tier h3{font:600 20px/1.25 var(--sans);letter-spacing:-.015em}
.tier p{color:var(--mid);flex:1;font-size:15px}
.tier .price{
  font-family:var(--display);font-weight:720;font-stretch:72%;
  font-size:34px;line-height:1;margin-top:8px;
}
.tier .meta{font:400 var(--t-micro)/1.6 var(--mono);letter-spacing:.14em;text-transform:uppercase}

/* TidyCal stub */
.embed-stub{
  margin-top:clamp(28px,4vh,44px);border:1px dashed var(--signal);
  padding:clamp(28px,4vw,44px);text-align:center;
}

/* ── supporting image ─────────────────────────────────────────── */
.supimg{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,5vw,72px);align-items:center}
.supimg .slot{aspect-ratio:3/2}
.supimg blockquote{
  margin:0;font:400 clamp(19px,2vw,24px)/1.5 "Newsreader",Georgia,serif;
  font-style:italic;color:var(--mid);
}

/* ── FAQ ──────────────────────────────────────────────────────── */
.faq{display:grid;gap:0}
.faq>div{padding:26px 0;border-bottom:1px solid var(--line-soft)}
.faq>div:last-child{border-bottom:0}
.faq h3{font:600 18px/1.4 var(--sans);margin:0 0 10px}
.faq h3::before{content:"Q · ";font:500 12px var(--mono);color:var(--faint);letter-spacing:.14em}
.faq p{color:var(--mid);max-width:60ch}

/* ── responsive ───────────────────────────────────────────────── */
@media(max-width:960px){
  .hero .wrap{grid-template-columns:1fr}
  .hero-img{max-width:440px}
  .supimg{grid-template-columns:1fr}
  .why{grid-template-columns:1fr}
  .tiers{grid-template-columns:1fr}
  .tier:nth-child(2){transform:none}
  .who:nth-child(2),.who:nth-child(3){margin-left:0}
}

/* ── LIGHT MODE — warm cream, the same temperature shift ──────────
   The dark consulting ground is the warm one of the three (#131110 vs
   #050505/#030303); the light consulting ground is likewise the warm
   one: cream against the other properties' bone paper and clinical
   white. Serif voice and air unchanged — only the ground turns over. */
:root[data-theme="light"]{
  --black:#F6F1E8;--near:#F0EBE1;
  --line:#D9D2C5;--line-soft:#E4DED2;
  --panel:#EFE9DE;--panel-2:#EAE3D6;
  --bone:#26211A;--bone-hi:#141210;
  --mid:#4F4A41;--dim:#615B51;--faint:#665F55;
}
[data-theme="light"] body{background:#F6F1E8;color:#2A251E}
[data-theme="light"] .nav{background:rgba(246,241,232,.92)}
[data-theme="light"] .pullband{background:#EFE8DB}

/* ── fallback enquiry — the page must convert without TidyCal ──── */
.enquiry{
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);
  gap:clamp(24px,4vw,56px);align-items:start;
  margin-top:clamp(30px,4vw,52px);padding-top:clamp(30px,4vw,52px);
  border-top:1px solid var(--line);
}
.enquiry h3{margin-bottom:10px}
@media(max-width:760px){.enquiry{grid-template-columns:1fr}}

/* ── fee note — replaces the fixed price list. Fees are task-based per the
   client, so the page must not present numbers it does not have.        ── */
.fee-note{
  margin-top:clamp(24px,3vw,40px);padding:clamp(20px,2.6vw,30px);
  border:1px solid var(--line);background:var(--panel);
}
.fee-note .lbl{margin-bottom:12px}
.fee-note p{font-size:15.5px;line-height:1.72;color:var(--mid);max-width:62ch;margin:0 0 .9em}
.fee-note p:last-child{margin-bottom:0}
.fee-note strong{color:var(--bone);font-weight:600}
.tier .meta{
  display:block;margin-top:14px;font:400 var(--t-micro)/1.5 var(--mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--dim);
}