/* Home page's new look (11/11/2026; Tanner approved the preview, look only): warm cream page, softer serif headings, solid buttons with a navy
   offset edge, thin navy rules between sections. Colors are the logo's: navy #263B4B, blue #22A9E0
   (#10719C where text sits on it, for contrast), green #6CC24A (#2F6E1A for small text).
   Only the look changes; no words, links, photos or forms. */
:root{
  --bg:#F7F1E6; --surface:#FFFDF8; --fg:#1F2B36; --muted:#46525D; --line:#E2D7C3; --rule:#263B4B;
  --heading:#263B4B; --tint:#EEF5EC; --eyebrow:#2F6E1A; --lead:#33404B; --edge:#263B4B;
  --display:"Fraunces",Georgia,"Times New Roman",serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#141A20; --surface:#1B232C; --fg:#F2EEE6; --muted:#C2BCB0; --line:#33404C; --rule:#5B6B7A;
  --heading:#FFFFFF; --tint:#1F2B26; --eyebrow:#9BE07F; --lead:#DAD5CB; --edge:#000000}}
:root[data-theme="dark"]{
  --bg:#141A20; --surface:#1B232C; --fg:#F2EEE6; --muted:#C2BCB0; --line:#33404C; --rule:#5B6B7A;
  --heading:#FFFFFF; --tint:#1F2B26; --eyebrow:#9BE07F; --lead:#DAD5CB; --edge:#000000}

/* Type: bigger, softer headings in navy */
h1,h2,h3{font-family:var(--display);letter-spacing:-.01em;color:var(--heading)}
h1{font-size:clamp(2.2rem,4.6vw,3.4rem);font-weight:600;line-height:1.08}
h2{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:600}
body{font-size:19px}
.eyebrow{color:var(--eyebrow)!important;letter-spacing:.14em;font-size:.82rem;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:36px;height:2px;background:currentColor;flex:none}

/* Header: cream bar with a navy rule */
header{background:var(--bg);border-bottom:1.5px solid var(--rule)}
/* the logo's white box blends into the cream in light mode (dark mode keeps its white pill) */
.nav img{mix-blend-mode:multiply}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .nav img{mix-blend-mode:normal}}
:root[data-theme="dark"] .nav img{mix-blend-mode:normal}

/* Buttons: one style, logo blue, navy offset edge */
.btn{border-radius:6px;padding:14px 24px;font-size:1.02rem}
.btn-primary,.btn-green{background:#10719C;color:#fff;border:2px solid var(--edge);box-shadow:4px 4px 0 var(--edge)}
.btn-primary:hover,.btn-green:hover{background:#0B5E86;color:#fff}
.btn-outline,.hero .btn-outline{border:2px solid var(--heading)!important;color:var(--heading)!important;background:transparent}
.btn-outline:hover{background:var(--tint)}
@media (prefers-reduced-motion:no-preference){
  .btn-primary:hover,.btn-green:hover{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--edge)}
}
.nav .nav-cta{padding:10px 18px;box-shadow:3px 3px 0 var(--edge)}

/* Hero: light and warm instead of dark navy; Jamie's photo larger, in a framed card */
.hero{background:var(--bg);color:var(--fg);border-bottom:1.5px solid var(--rule)}
.hero h1{color:var(--heading)}
.hero p.lead{color:var(--lead);font-size:1.22rem;max-width:36rem}
@media (min-width:861px){.hero .wrap{grid-template-columns:1.1fr .9fr}}
.hero .wrap{padding-block:30px 40px;gap:48px;position:relative;z-index:1}
.hero .wave{opacity:.22;height:46%;bottom:-30px}
.hero-card{background:var(--surface);border:2px solid var(--rule);border-radius:12px;box-shadow:10px 10px 0 var(--edge);padding:20px;gap:10px}
.hero-card .who{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center}
.hero-card img{width:120px;height:150px;border-radius:10px;border:2px solid var(--rule);object-position:top}
.hero-card .who strong{font-size:1.3rem;color:var(--heading)}

/* Stats banner (kept on the first screen, with its count-up): light logo-blue band, navy rules, big serif numbers */
.trust{background:#EAF6FC;border-bottom:1.5px solid var(--rule)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .trust{background:#1B2A38}}
:root[data-theme="dark"] .trust{background:#1B2A38}
.trust .wrap{padding-block:14px}
.trust strong{font-size:1.8rem;font-weight:600}
.trust span{color:var(--muted);font-size:.95rem}

/* Sections: more room, alternating cream tones, navy rules */
section.block{padding-block:84px}
section.alt{background:var(--surface);border-block:1.5px solid var(--rule)}
.sec-head{max-width:44rem;margin-bottom:40px;gap:14px}
.sec-head p{color:var(--muted);font-size:1.05rem}
.step{border-top:3px solid #6CC24A}
.step small{color:var(--eyebrow)}
.card,.event,.quote,.tool{background:var(--surface);border:1.5px solid var(--rule);border-radius:10px;box-shadow:5px 5px 0 var(--line)}
section.alt .card,section.alt .event,section.alt .quote{background:var(--bg)}
.card p,.event .meta{color:var(--muted)}
.card{padding:26px}
.about img{border:2px solid var(--rule);box-shadow:10px 10px 0 var(--edge);border-radius:12px}
.about .book,.tpmo,.formmsg,.wresult .ok{background:var(--tint)}
.quote p{font-family:var(--display);font-style:italic;font-size:1.08rem}
input,select,textarea{border:1.5px solid #8A97A3;background:var(--surface)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) input,:root:not([data-theme="light"]) select,:root:not([data-theme="light"]) textarea{border-color:var(--rule)}}
:root[data-theme="dark"] input,:root[data-theme="dark"] select,:root[data-theme="dark"] textarea{border-color:var(--rule)}

@media (max-width:860px){
  section.block{padding-block:60px}
  .hero .wrap{padding-block:48px 60px;gap:40px}
  .hero-card{box-shadow:6px 6px 0 var(--edge)}
}
@media (max-width:520px){
  body{font-size:18px}
  .eyebrow::before{display:none}
  .hero-card .who{grid-template-columns:110px 1fr}
  .hero-card img{width:110px;height:140px}
}
