/* ============================================================
   Tom Brittain — shared styles for all pages
   Used by: index.html, about.html, talks.html
   ============================================================ */

:root{
  --navy:#152a40;
  --navy-2:#1d3a57;
  --ink:#23292f;
  --muted:#5d6b78;
  --cream:#faf7f1;
  --card:#ffffff;
  --gold:#b0832f;
  --gold-dark:#8f6a23;
  --gold-light:#dcb26a;
  --line:rgba(20,42,64,.12);
  --shadow:0 18px 50px -24px rgba(21,42,64,.35);
  --maxw:1140px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.serif{font-family:'EB Garamond',Georgia,'Times New Roman',serif;}
h2{font-size:clamp(1.9rem,3.4vw,2.9rem);font-weight:600;line-height:1.12;letter-spacing:.2px;margin:0 0 .5em;color:var(--navy);}
h3{font-size:1.45rem;font-weight:600;margin:0 0 .35em;color:var(--navy);}
p{margin:0 0 1.1em;}
a{color:inherit;}
img{max-width:100%;display:block;}
section{scroll-margin-top:84px;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
.narrow{max-width:760px;}
.eyebrow{
  font-family:'Inter',sans-serif;font-size:.78rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin:0 0 1rem;
}
.center{text-align:center;}
.lede{font-family:'EB Garamond',serif;font-size:1.3rem;color:var(--muted);font-style:italic;}

/* ---------- buttons ---------- */
.btn{
  display:inline-block;font-family:'Inter',sans-serif;font-weight:600;font-size:.95rem;
  letter-spacing:.02em;padding:14px 28px;border-radius:2px;cursor:pointer;
  text-decoration:none;transition:all .18s ease;border:1.5px solid transparent;
}
.btn-gold{background:var(--gold);color:#fff;}
.btn-gold:hover{background:var(--gold-dark);transform:translateY(-1px);}
.btn-outline{background:transparent;border-color:rgba(255,255,255,.55);color:#fff;}
.btn-outline:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.btn-outline-dark{background:transparent;border-color:var(--navy);color:var(--navy);}
.btn-outline-dark:hover{background:var(--navy);color:#fff;}

/* ---------- header / nav ---------- */
header.site{
  position:sticky;top:0;z-index:50;background:rgba(250,247,241,.92);
  backdrop-filter:blur(8px);border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;}
.brand{font-family:'EB Garamond',serif;font-size:1.5rem;font-weight:600;color:var(--navy);text-decoration:none;letter-spacing:.3px;}
.brand span{color:var(--gold);}
.nav-links{display:flex;align-items:center;gap:30px;list-style:none;margin:0;padding:0;}
.nav-links a{text-decoration:none;font-size:.92rem;font-weight:500;color:var(--ink);transition:color .15s;}
.nav-links a:hover,.nav-links a.active{color:var(--gold);}
.nav-links .btn{padding:10px 20px;}
.nav-links .btn:hover{color:#fff;}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;font-size:1.5rem;color:var(--navy);}

/* ---------- hero (homepage) ---------- */
.hero{background:linear-gradient(150deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;overflow:hidden;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;padding:84px 0 90px;}
.hero .eyebrow{color:var(--gold-light);}
.hero h1{font-size:clamp(2.8rem,6vw,4.4rem);font-weight:600;line-height:1.02;margin:0 0 .2em;letter-spacing:.5px;}
.hero .tagline{font-family:'EB Garamond',serif;font-style:italic;font-size:clamp(1.4rem,2.6vw,1.9rem);color:#e9c485;margin:0 0 1rem;}
.hero p.sub{font-size:1.1rem;color:rgba(255,255,255,.82);max-width:30em;margin-bottom:2rem;}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;}

/* ---------- interior page header ---------- */
.pagehead{background:linear-gradient(150deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;}
.pagehead .wrap{padding:72px 28px 78px;}
.pagehead .eyebrow{color:var(--gold-light);}
.pagehead h1{font-size:clamp(2.4rem,5vw,3.6rem);font-weight:600;line-height:1.05;margin:0 0 .35em;letter-spacing:.4px;}
.pagehead p{font-size:1.18rem;color:rgba(255,255,255,.84);max-width:38em;margin:0;}
.pagehead p.lede{color:#e9c485;}

/* ---------- photo / video placeholders ---------- */
.photo-ph{
  position:relative;border-radius:3px;overflow:hidden;
  background:repeating-linear-gradient(45deg,rgba(255,255,255,.05),rgba(255,255,255,.05) 14px,rgba(255,255,255,.09) 14px,rgba(255,255,255,.09) 28px);
  border:1px solid rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;text-align:center;
  color:rgba(255,255,255,.6);font-size:.82rem;letter-spacing:.04em;padding:24px;
  aspect-ratio:4/5;
}
.photo-ph.light{background:repeating-linear-gradient(45deg,#eee7d8,#eee7d8 14px,#e6ddc9 14px,#e6ddc9 28px);border:1px solid var(--line);color:#9a8e74;}
.photo-ph.wide{aspect-ratio:16/7;}
.photo-ph .ph-tag{max-width:20em;}
.photo-ph .ph-icon{font-size:2rem;display:block;margin-bottom:.5rem;opacity:.7;}

.video-ph{
  position:relative;aspect-ratio:16/9;border-radius:4px;
  background:linear-gradient(150deg,#1d3a57,#0f2235);color:rgba(255,255,255,.8);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.1);
}
.video-ph .play{width:74px;height:74px;border-radius:50%;border:2px solid rgba(255,255,255,.7);display:flex;align-items:center;justify-content:center;margin-bottom:18px;}
.video-ph .play:after{content:"";border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:5px;}
.video-ph small{font-size:.82rem;letter-spacing:.05em;}

/* embedded (real) video + media grid */
.embed{position:relative;aspect-ratio:16/9;border-radius:4px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);background:#000;}
.embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.media-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:44px;}
.media-item .cap{margin-top:14px;}
.media-item .cap .tag{font-size:.74rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);}
.media-item .cap h3{font-size:1.3rem;margin:.2rem 0 .2rem;}
.media-item .cap p{font-size:.95rem;color:var(--muted);margin:0;}

/* real photos filling layout slots (object-fit crops to the slot) */
img.shot{display:block;width:100%;object-fit:cover;border-radius:3px;}
img.shot-portrait{aspect-ratio:4/5;}
img.shot-wide{aspect-ratio:16/7;}
img.shot-video{aspect-ratio:16/9;border-radius:0;}

/* photo figures (family, coaching) — captioned, gold-ruled */
figure.photo{margin:40px 0;}
figure.photo img{display:block;width:100%;height:auto;border-radius:3px;box-shadow:var(--shadow);}
figure.photo figcaption{
  margin-top:.75rem;padding-left:14px;border-left:2px solid var(--gold);
  font-family:'EB Garamond',serif;font-style:italic;font-size:1rem;line-height:1.35;color:#5d6772;
}
/* small, secondary variant — used for the coaching photo */
figure.photo.sm{max-width:340px;margin:30px auto;}
@media(min-width:720px){
  figure.photo.sm.right{float:right;width:300px;margin:4px 0 16px 34px;}
}

/* video poster: real thumbnail + play overlay, until the embed is live */
.poster{position:relative;border-radius:4px;overflow:hidden;box-shadow:var(--shadow);}
.poster::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,22,33,.12),rgba(12,22,33,.58));}
.poster-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:66px;height:66px;border-radius:50%;border:2px solid rgba(255,255,255,.9);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.3rem;padding-left:5px;z-index:2;}
.poster-note{position:absolute;left:16px;bottom:13px;color:#fff;font-size:.8rem;letter-spacing:.04em;z-index:2;text-shadow:0 1px 3px rgba(0,0,0,.5);}

/* numbered steps */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;counter-reset:step;}
.step{background:var(--card);border:1px solid var(--line);border-radius:3px;padding:30px 28px;position:relative;}
.step .n{width:42px;height:42px;border-radius:50%;background:var(--gold);color:#fff;font-family:'EB Garamond',serif;font-size:1.4rem;display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.step h4{margin:0 0 .35rem;font-family:'EB Garamond',serif;font-size:1.3rem;color:var(--navy);}
.step p{margin:0;font-size:.95rem;color:var(--muted);}

/* ---------- endorsement band ---------- */
.endorse{background:var(--card);border-bottom:1px solid var(--line);}
.endorse .wrap{padding:54px 28px;display:grid;grid-template-columns:auto 1fr;gap:34px;align-items:center;}
.endorse .crest{
  width:96px;height:96px;border-radius:50%;flex:none;
  border:2px solid var(--gold);color:var(--gold);
  display:flex;align-items:center;justify-content:center;font-size:2.2rem;
}
.endorse blockquote{margin:0;font-family:'EB Garamond',serif;font-size:clamp(1.25rem,2.1vw,1.6rem);line-height:1.4;color:var(--navy);font-style:italic;}
.endorse cite{display:block;margin-top:.9rem;font-family:'Inter',sans-serif;font-style:normal;font-size:.86rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-dark);}

/* ---------- generic section spacing ---------- */
.pad{padding:88px 0;}
.pad-sm{padding:64px 0;}
.bg-warm{background:#f3eee2;}

/* ---------- about intro (homepage) ---------- */
.about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center;}
.about-grid .photo-ph{aspect-ratio:4/5;}

/* ---------- prose (about page) ---------- */
.prose{max-width:720px;margin:0 auto;}
.prose p{font-size:1.08rem;color:#33404b;}
.prose .kicker{font-family:'Inter',sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);margin:2.6em 0 .4em;}
.prose h3{font-size:1.7rem;margin:.1em 0 .5em;}
.prose .first::first-letter{font-family:'EB Garamond',serif;float:left;font-size:3.6rem;line-height:.8;padding:.05em .12em 0 0;color:var(--gold);}
.pullquote{
  margin:42px 0;padding:6px 0 6px 28px;border-left:3px solid var(--gold);
  font-family:'EB Garamond',serif;font-style:italic;font-size:1.5rem;line-height:1.35;color:var(--navy);
}
.biobox{
  background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);
  border-radius:3px;padding:30px 32px;margin:46px auto 0;max-width:720px;box-shadow:var(--shadow);
}
.biobox h4{margin:0 0 .4rem;font-family:'Inter',sans-serif;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-dark);}
.biobox p{margin:0;font-size:1.04rem;color:#33404b;}
.creds{max-width:720px;margin:26px auto 0;font-size:.92rem;color:var(--muted);text-align:center;}

/* ---------- talks ---------- */
.talks-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:48px;}
.talk{
  background:var(--card);border:1px solid var(--line);border-top:3px solid var(--gold);
  border-radius:3px;padding:34px 32px;transition:transform .18s ease,box-shadow .18s ease;
  display:flex;flex-direction:column;
}
.talk:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.talk .aud{font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.8rem;}
.talk p{color:var(--muted);font-size:1rem;flex:1;}
.talk .more{margin-top:1rem;font-weight:600;font-size:.92rem;color:var(--navy);text-decoration:none;}
.talk .more:hover{color:var(--gold);}
.talk .more:after{content:" \2192";}

/* ---------- talk detail (talks page) ---------- */
.talkfull{
  background:var(--card);border:1px solid var(--line);border-radius:4px;
  padding:40px;margin-bottom:28px;box-shadow:var(--shadow);
  display:grid;grid-template-columns:1fr;gap:6px;
}
.talkfull .aud{font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);margin-bottom:.5rem;}
.talkfull h3{font-size:1.9rem;}
.talkfull .positioning{font-family:'EB Garamond',serif;font-style:italic;font-size:1.25rem;color:var(--muted);margin:0 0 1.1rem;}
.talkfull p{color:#33404b;}
.tmeta{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 32px;margin-top:18px;padding-top:22px;border-top:1px solid var(--line);}
.tmeta dt{font-size:.74rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:.3rem;}
.tmeta dd{margin:0;color:var(--ink);font-size:.98rem;}

/* ---------- other topics list ---------- */
.topics{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px;}
.topic{background:var(--card);border:1px solid var(--line);border-radius:3px;padding:26px 26px;}
.topic h4{margin:0 0 .3rem;font-family:'EB Garamond',serif;font-size:1.25rem;color:var(--navy);}
.topic p{margin:0;font-size:.95rem;color:var(--muted);}

/* ---------- formats ---------- */
.formats{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:36px;}
.format{text-align:center;padding:26px 14px;background:var(--card);border:1px solid var(--line);border-radius:3px;}
.format .ic{font-size:1.6rem;color:var(--gold);margin-bottom:.5rem;}
.format strong{display:block;color:var(--navy);font-size:1.02rem;margin-bottom:.2rem;}
.format span{font-size:.84rem;color:var(--muted);}

/* ---------- who he serves ---------- */
.serves{background:#f3eee2;}
.pills{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:30px;}
.pill{background:#fff;border:1px solid var(--line);border-radius:40px;padding:11px 22px;font-size:.92rem;font-weight:500;color:var(--navy);}

/* ---------- witness stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px;}
.stat{text-align:center;padding:24px 14px;border-left:1px solid var(--line);}
.stat:first-child{border-left:0;}
.stat .num{font-family:'EB Garamond',serif;font-size:2.6rem;font-weight:600;color:var(--gold);line-height:1;}
.stat .lbl{font-size:.86rem;color:var(--muted);margin-top:.5rem;letter-spacing:.02em;}

/* ---------- quote band ---------- */
.quoteband{background:linear-gradient(150deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;text-align:center;}
.quoteband .wrap{padding:84px 28px;}
.quoteband blockquote{margin:0;font-family:'EB Garamond',serif;font-style:italic;font-size:clamp(1.8rem,4vw,2.9rem);line-height:1.25;max-width:18em;margin:0 auto;}
.quoteband cite{display:block;margin-top:1.4rem;font-family:'Inter',sans-serif;font-style:normal;font-size:.84rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-light);}

/* ---------- reusable CTA band ---------- */
.ctaband{background:linear-gradient(150deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;text-align:center;}
.ctaband .wrap{padding:74px 28px;}
.ctaband h2{color:#fff;}
.ctaband p{color:rgba(255,255,255,.82);max-width:34em;margin:0 auto 1.8rem;}

/* ---------- testimonials ---------- */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:46px;}
.tcard{background:var(--card);border:1px solid var(--line);border-radius:3px;padding:30px;}
.tcard p{font-family:'EB Garamond',serif;font-size:1.15rem;font-style:italic;color:var(--ink);}
.tcard .who{font-size:.82rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--gold-dark);}
.placeholder-note{font-style:normal !important;color:#b6aa90 !important;font-family:'Inter',sans-serif !important;font-size:.9rem !important;}

/* ---------- invite / booking ---------- */
.invite{background:#f3eee2;}
.invite-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:start;}
.invite-info .item{margin-bottom:22px;}
.invite-info .item strong{display:block;color:var(--navy);font-size:1.02rem;margin-bottom:.15rem;}
.invite-info .item span{color:var(--muted);font-size:.96rem;}
form{background:#fff;border:1px solid var(--line);border-radius:4px;padding:32px;box-shadow:var(--shadow);}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
label{display:block;font-size:.82rem;font-weight:600;color:var(--navy);margin:0 0 6px;letter-spacing:.02em;}
.field{margin-bottom:16px;}
input,select,textarea{
  width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:3px;
  font-family:'Inter',sans-serif;font-size:.95rem;color:var(--ink);background:#fdfcf9;
}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);background:#fff;}
textarea{resize:vertical;min-height:96px;}
.form-note{font-size:.8rem;color:var(--muted);margin-top:6px;}

/* ---------- footer ---------- */
footer.site{background:var(--navy);color:rgba(255,255,255,.72);}
footer.site .wrap{padding:56px 28px 36px;}
.foot-top{display:flex;justify-content:space-between;flex-wrap:wrap;gap:24px;align-items:flex-start;}
.foot-brand{font-family:'EB Garamond',serif;font-size:1.6rem;color:#fff;}
.foot-brand span{color:var(--gold);}
.foot-tag{font-style:italic;font-family:'EB Garamond',serif;color:var(--gold-light);margin-top:.3rem;}
.foot-links{display:flex;gap:26px;flex-wrap:wrap;list-style:none;margin:0;padding:0;}
.foot-links a{color:rgba(255,255,255,.78);text-decoration:none;font-size:.92rem;}
.foot-links a:hover{color:#fff;}
.foot-bottom{margin-top:40px;padding-top:22px;border-top:1px solid rgba(255,255,255,.12);font-size:.82rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;}

/* ---------- responsive ---------- */
@media(max-width:880px){
  .hero-grid,.about-grid,.invite-grid{grid-template-columns:1fr;gap:40px;}
  .hero-grid{padding:60px 0 64px;}
  .about-grid .photo-ph,.hero .photo-ph,.about-grid img.shot,.hero img.shot{max-width:360px;margin:0 auto;}
  .talks-grid,.tgrid,.stats,.topics{grid-template-columns:1fr 1fr;}
  .formats{grid-template-columns:1fr 1fr 1fr;}
  .endorse .wrap{grid-template-columns:1fr;text-align:center;}
  .endorse .crest{margin:0 auto;}
  .tmeta{grid-template-columns:1fr;}
  .talkfull{padding:30px 26px;}
  .nav-links{
    position:absolute;top:72px;left:0;right:0;background:var(--cream);
    flex-direction:column;align-items:flex-start;gap:0;padding:8px 28px 18px;
    border-bottom:1px solid var(--line);display:none;
  }
  .nav-links.open{display:flex;}
  .nav-links li{width:100%;padding:8px 0;}
  .nav-links .btn{margin-top:8px;}
  .nav-toggle{display:block;}
}
@media(max-width:880px){
  .media-grid,.steps{grid-template-columns:1fr;}
}
@media(max-width:560px){
  .talks-grid,.tgrid,.stats,.frow,.topics,.formats{grid-template-columns:1fr;}
  .stat{border-left:0;border-top:1px solid var(--line);}
  .stat:first-child{border-top:0;}
}
