/* ═════════════════════════════════════════════════════════════════════════
   OVERTHRIVE INNER PAGES — the home page design, ruled by Paul 2026-10-02.
   Loads last on /pricing, /schedule, /contractors, /sessions, /card and
   /legal, in place of logo-bar.css. The home page carries the same rules in
   its own stylesheet.

   - One-row black header: the logo and the tagline at one width.
   - Page titles in Forum, left-aligned to the page's content column, with a
     short red rule under them. Body text in Inter 400 at 17–18px.
   - Headings, card text and wrapping body text align left. Buttons, stat
     figures and the footer stay centered.
   - The footer matches the header: same black, same hairline edge.
   /booth is the summit display and does not load this file.
   ═════════════════════════════════════════════════════════════════════════ */

:root {
  --ot-red: #A30B12; --ot-red-hot: #8C0910; --ot-red-dark: #EF1C24;
  --ot-ink: #141417; --ot-text: #34373D; --ot-muted: #596069;
  --ot-line: rgba(20,20,23,.11); --ot-line-strong: rgba(20,20,23,.18);
  --ot-black: #030507; --ot-on-dark: #E7E4E0; --ot-on-dark-muted: #A9ADB3;
  --ot-pad: clamp(20px, 5vw, 64px);
  /* The page's content column; the title block lines up with it. */
  --ot-col: 780px; --ot-col-pad: 32px;
}
body:has(.programs) { --ot-col: 1080px; }
body:has(.ct-main), body:has(.legal-content) { --ot-col: 900px; }
body:has(.ct-main) { --ot-col-pad: 19px; }

html body { font-weight: 400; color: var(--ot-text); text-rendering: optimizeLegibility; }
html body :is(h1, h2, h3, h4, strong, b, legend) { color: var(--ot-ink); }

/* ── Header ─────────────────────────────────────────────────────────────── */
html body nav.pg-nav, html body nav.legal-nav {
  position: sticky; top: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  height: 80px; padding: 0 var(--ot-pad); margin: 0;
  background: var(--ot-black); border-bottom: 1px solid rgba(255,255,255,.08);
  box-shadow: none; backdrop-filter: none;
}
.ot-id { display: flex; align-items: center; text-decoration: none; min-width: 0; }
.ot-lock { display: flex; flex-direction: column; gap: 8px; width: 240px; flex: none; }
.ot-logo { display: block; width: 100%; height: auto; }
.ot-tag {
  display: flex; align-items: center; justify-content: space-between; margin-right: -.24em;
  font: 500 10px/1 'Inter', sans-serif; letter-spacing: .24em; text-transform: uppercase;
  color: var(--ot-on-dark-muted);
}
.ot-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--ot-red-dark); }
html body nav :is(.pg-nav, .legal-nav) .nav-back, html body .nav-back {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px;
  font: 600 12.5px/1 'Inter', sans-serif; letter-spacing: .12em; text-transform: uppercase;
  color: #fff; background: var(--ot-red); border: 1px solid var(--ot-red); border-radius: 2px;
  text-decoration: none; white-space: nowrap;
}
html body .nav-back:hover { background: var(--ot-red-hot); border-color: var(--ot-red-hot); color: #fff; }
@media (max-width: 640px) {
  html body nav.pg-nav, html body nav.legal-nav { height: 72px; }
  .ot-lock { width: 170px; gap: 6px; }
  .ot-tag { font-size: 8px; letter-spacing: .14em; margin-right: -.14em; }
  html body .nav-back { padding: 0 14px; font-size: 11.5px; letter-spacing: .08em; }
}

/* ── Page title block ───────────────────────────────────────────────────── */
html body header.pg-header, html body header.legal-header {
  text-align: left; background: #fff; border-bottom: 0;
  padding: clamp(48px, 6vw, 88px) max(var(--ot-pad), calc((100% - var(--ot-col)) / 2 + var(--ot-col-pad))) clamp(40px, 5vw, 64px);
}
html body header :is(.card-sweep.tl) { display: none; }
html body header.pg-header > :not(.card-sweep), html body header.legal-header > :not(.card-sweep) {
  margin-left: 0; margin-right: 0;
}
html body :is(.pg-eyebrow, .legal-eyebrow) {
  display: block; font: 600 13px/1.4 'Inter', sans-serif; letter-spacing: .2em; text-transform: uppercase;
  color: var(--ot-red); margin-bottom: 18px;
}
html body :is(header.pg-header h1, .legal-h1) {
  font-family: 'Forum', Georgia, serif; font-weight: 400; text-transform: uppercase;
  font-size: clamp(38px, 5.2vw, 64px); line-height: 1.06; letter-spacing: .005em;
  color: var(--ot-ink); margin: 0; text-wrap: balance;
}
html body :is(header.pg-header h1, .legal-h1)::after {
  content: ''; display: block; width: 48px; height: 2px; background: var(--ot-red); margin: 28px 0 0;
}
html body :is(header.pg-header h1, .legal-h1) .accent-red { color: var(--ot-red); }
html body :is(.pg-sub, .legal-subtitle, .ct-trades, .reassure, .legal-updated) {
  max-width: 760px; text-align: left; text-wrap: pretty;
  font-size: clamp(17px, 1.4vw, 19px); line-height: 1.7; color: var(--ot-text);
}
html body :is(.pg-sub, .legal-subtitle) { margin-top: 28px; }
html body :is(.ct-trades, .reassure, .legal-updated) { margin-top: 14px; }
html body .legal-updated { font-size: 14px; color: var(--ot-muted); }
html body header.pg-header :is(.ct-ask, .save-contact-wrap) { display: flex; justify-content: flex-start; margin-top: 32px; }
html body header.pg-header .talk-first { text-align: left; margin-left: 0; margin-right: 0; }

/* /card is the page behind the business-card QR code: a greeting with
   Paul's photo, so its title block stays centered. */
html body header.pg-header:has(.card-photo) { text-align: center; padding-left: var(--ot-pad); padding-right: var(--ot-pad); }
html body header.pg-header:has(.card-photo) > :not(.card-sweep) { margin-left: auto; margin-right: auto; }
html body header.pg-header:has(.card-photo) :is(.pg-sub, .talk-first) { text-align: center; }
html body header.pg-header:has(.card-photo) h1::after { margin: 28px auto 0; }
html body header.pg-header:has(.card-photo) .save-contact-wrap { justify-content: center; }

/* ── Section headings ───────────────────────────────────────────────────── */
html body :is(.section-title, .quote h2, section.legal-section h2, .ct-section h2) {
  font-family: 'Forum', Georgia, serif; font-weight: 400; text-transform: uppercase;
  letter-spacing: .01em; line-height: 1.1; color: var(--ot-ink); text-wrap: balance;
}
html body :is(.section-title, .section-lead, .prog-group, .quote-inner, .ct-section) { text-align: left; }
html body .section-lead { margin-left: 0; }
html body .quote-inner .btn-submit, html body .lead-form .btn-submit { margin-left: 0; }

/* ── Program cards (/pricing): one left edge per card ───────────────────── */
html body .prog { text-align: left; border-radius: 0; }
html body .prog-head { align-items: flex-start; text-align: left; }
html body .prog-for { text-align: left; }
html body .prog-for::after { margin: .9rem 0 0; }
html body .prog-price { align-items: flex-start; text-align: left; justify-content: flex-start; }
html body .prog-cta { margin-left: 0; }
html body .prog-ladder { margin-left: 0; }
html body .prog-ladder :is(th, td) { text-align: left; }
html body .prog p, html body .prog li { color: var(--ot-text); text-wrap: pretty; }

/* ── Buttons: the home page system ─────────────────────────────────────── */
html body :is(.btn-submit, .prog-cta, .btn-register, .btn-ghost, .btn-room, .btn-id) {
  border-radius: 2px; font-size: 13px; letter-spacing: .14em;
}

/* ── Step labels (/card, /sessions), ruled by Paul 2026-10-01 ──────────────
   Carried over from logo-bar.css: headings set in the brand face with a short
   red rule under them, balanced so a phone never strands a word. */
.step-label {
  display: block !important; text-align: center;
  font-family: 'Forum', Georgia, serif; font-weight: 400; text-transform: uppercase;
  font-size: clamp(1.15rem, 4.2vw, 1.45rem); letter-spacing: 0.06em; line-height: 1.25;
  color: var(--ot-ink) !important; margin: 2.8rem auto 1.1rem; max-width: 30ch;
  text-wrap: balance;
}
.step-label::before { content: none !important; }
.step-label::after {
  content: '' !important; display: block; width: 40px; height: 2px;
  background: var(--ot-red) !important; margin: 0.75rem auto 0;
}
.step-label b { display: none; }
.talk-first { text-wrap: balance; line-height: 1.7; }
.talk-first a {
  font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 4px; white-space: nowrap;
}

/* ── Footer: matches the header ─────────────────────────────────────────── */
html body footer.pg-footer, html body footer.legal-footer {
  background: var(--ot-black); color: var(--ot-on-dark-muted);
  border-top: 1px solid rgba(255,255,255,.08);
  padding: clamp(64px, 7vw, 96px) var(--ot-pad) 40px; text-align: center;
}
html body footer :is(.card-sweep) { display: none; }
html body footer .footer-logo { width: min(340px, 78vw); margin: 0 auto 32px; }
html body footer :is(p, span, div) { color: var(--ot-on-dark-muted); }
html body footer .footer-brand, html body footer .footer-contact strong {
  font-family: 'Forum', Georgia, serif; font-size: 22px; letter-spacing: .08em; text-transform: uppercase;
  color: #F2EFED !important;
}
html body footer .footer-coach { margin-top: 12px; font-size: 14px; line-height: 1.7; }
html body footer .footer-coach span { color: var(--ot-on-dark-muted); }
html body footer .xmark { color: var(--ot-red-dark) !important; }
html body footer a { color: var(--ot-on-dark); text-decoration: none; }
html body footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
html body footer .footer-contact { margin-top: 20px; font-size: 14.5px; line-height: 1.8; }
html body footer .footer-copyright {
  max-width: 1200px; margin: 48px auto 0; padding-top: 24px;
  border-top: 1px solid rgba(255,255,255,.1); font-size: 13px; line-height: 1.6;
}

/* ── /contractors: headings, intro and the frameworks table align left ─── */
html body .ct-section h2, html body .ct-section .ct-lead { text-align: left; margin-left: 0; }
html body .ct-table :is(th, td) { text-align: left; }

/* ── /legal: section headings align left; the section links fill the column */
html body .legal-eyebrow::before, html body section.legal-section .section-tag::before { content: none; }
html body section.legal-section :is(h2, h3, .section-tag) { text-align: left; }
html body .toc {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px;
  max-width: none; padding: 0 max(var(--ot-pad), calc((100% - var(--ot-col)) / 2 + var(--ot-col-pad)));
}
html body .toc a { display: block; width: auto; }
@media (max-width: 640px) {
  html body main.legal-content { padding-left: var(--ot-pad); padding-right: var(--ot-pad); }
}
