:root{
  --eggshell:#F4F0E6;
  --ink:#16181C;
  --muted:#4B5158;
  --tri-bg:#E9E9E7;
  --tri-orange:#C9461A;
  --tri-orange-text:#A83A12;
  --navy:#1B2A5A;
  --navy-2:#2A3D78;
  --sky:#3BA7DF;
  --sky-text:#7CC4EC;
  --black:#0B0B0B;
  --lime:#DFFF00;
  --sage:#C2CDB2;
  --green:#154021;
  --green-2:#0F3019;
  --gap:14px;
}
main img{display:block}
main p,main h1,main h2,main h3,main figure,main ul,main ol,main dl,main dd{margin:0}
.page.flat{min-height:0}
.wrap{max-width:1280px;margin-inline:auto;padding-inline:clamp(20px,11vw,142px)}
.anton{font-family:Anton,Impact,"Arial Narrow",sans-serif;font-weight:400;letter-spacing:.01em}
.bebas{font-family:"Bebas Neue",Impact,"Arial Narrow",sans-serif;font-weight:400;letter-spacing:.02em}
main{font-size:1rem;line-height:1.6}

/* shared section pieces */
.band{padding:clamp(44px,6vw,64px) 0}
.kicker{font-size:.78rem;letter-spacing:.12em}
.lede{margin-top:14px;max-width:62ch;font-size:1.05rem;line-height:1.6}
.end-link{margin-top:24px;text-align:right}
.end-link a,.small-link,.lime-link{font-size:.95rem;font-weight:600}
.ph{position:relative;overflow:hidden;border-radius:8px;aspect-ratio:4/5}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.btn{display:inline-flex;align-items:center;min-height:48px;padding:0 24px;border-radius:6px;font-size:1.1rem}
.btn:hover{text-decoration:none;filter:brightness(1.08)}

/* intro + bridge */
.intro{padding-block:clamp(48px,7vw,72px) clamp(40px,6vw,64px);text-align:center}
.intro h1{font-size:clamp(3rem,9vw,5.5rem);font-weight:400;letter-spacing:-.03em;line-height:1}
.intro p{margin:14px auto 0;max-width:560px;font-size:1.05rem;color:var(--muted)}
.bridge{padding-block:clamp(56px,8vw,80px);text-align:center}
.bridge p{margin-inline:auto;max-width:820px;font-size:clamp(1.5rem,3.6vw,2.3rem);font-style:italic;letter-spacing:-.02em;line-height:1.3;color:#2C2C2A}

/* chapter 1: triathlon */
.tri{background:var(--tri-bg)}
.tri .kicker{color:#5F5E5A}
.tri-title{margin-top:8px;font-size:clamp(4rem,11vw,7rem);line-height:.9;color:var(--tri-orange)}
.tri .lede{color:#2C2C2A}
.tri-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;margin-top:36px}
.tri-photo{width:100%;height:100%;object-fit:cover;border-radius:8px;aspect-ratio:635/728}
.tri-side{display:flex;flex-direction:column;gap:14px}
.milestone{flex:1;display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:#fff;border-radius:8px;padding:24px 26px}
.milestone-label{font-size:.82rem;color:#5F5E5A}
.milestone-title{font-size:clamp(3rem,6vw,4.4rem);line-height:.95;color:var(--tri-orange)}
.milestone-time{margin-top:10px;font-size:1.6rem;font-weight:600;line-height:1.3}
.milestone-pace{margin-top:2px;color:var(--muted)}
.baselines{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.baselines div{background:#fff;border-radius:8px;padding:14px 16px}
.baselines dt{font-size:.78rem;color:#5F5E5A}
.baselines dd{font-size:1.4rem;font-weight:600;line-height:1.3}
.timeline{position:relative;list-style:none;padding:30px 0 0;margin-top:44px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:.9rem;color:#2C2C2A}
.timeline::before,.timeline::after{content:"";position:absolute;top:6px;height:3px;left:8px}
.timeline::before{right:8px;background:#B4B2A9}
.timeline::after{width:calc(50% - 8px);background:var(--tri-orange)}
.timeline li::before{content:"";position:absolute;top:0;z-index:1;width:16px;height:16px;border-radius:50%;background:var(--tri-bg);border:3px solid #888780}
.timeline li:nth-child(1)::before{left:0;background:var(--tri-orange);border-color:var(--tri-orange)}
.timeline li:nth-child(2){text-align:center}
.timeline li:nth-child(2)::before{left:calc(50% - 8px)}
.timeline li:nth-child(3){text-align:right}
.timeline li:nth-child(3)::before{right:0}
.tri-link{color:var(--tri-orange-text)}

.club{background:var(--navy);border-top:6px solid var(--sky);padding-top:44px;padding-bottom:48px}
.club-head{display:flex;align-items:center;gap:24px}
.club-logo{width:96px;height:auto;flex:none}
.club-title{font-size:clamp(1.8rem,3.4vw,2.4rem);line-height:1;color:#fff}
.club-head p{margin-top:6px;color:#C9E3F5}
.club-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap);margin-top:28px}
.club .ph{background:var(--navy-2)}
.club-link{color:var(--sky-text)}

/* chapter 2: NDRC */
.ndrc{background:var(--black);color:#fff}
.ndrc .kicker,.months .kicker{color:#A3A29C}
.ndrc-title{margin-top:8px}
.ndrc-name{display:block;font-size:clamp(3rem,9vw,6rem);line-height:.95;font-style:italic;color:var(--lime)}
.ndrc-city{display:block;margin-top:6px;font-size:1.2rem;letter-spacing:.3em}
.ndrc-mission{margin-top:28px;font-size:clamp(1.6rem,3.6vw,2.2rem);line-height:1.05}
.ndrc .lede,.months .lede{color:#C9C8C2}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);margin-top:32px}
.ndrc .ph,.months .ph{background:#2C2C2A}

.newdad{background:var(--sage)}
.newdad .kicker{color:#3B4A2E}
.newdad-title{margin-top:8px;font-size:clamp(2.4rem,6vw,4rem);line-height:1;color:var(--black)}
.newdad-hook{margin-top:16px;font-size:clamp(1.5rem,3vw,2rem);line-height:1.1;color:var(--green)}
.newdad-intro{margin-top:10px;font-size:1.05rem;color:#27500A}
.newdad-list{list-style:none;margin-top:24px;padding:12px clamp(20px,3.5vw,36px);background:var(--green);border-radius:12px}
.newdad-list li{padding:16px 0;border-bottom:1px solid #2A5A37;font-size:clamp(1.3rem,2.8vw,1.9rem);line-height:1.1;color:#fff}
.newdad-list li:last-child{border-bottom:0}
.newdad-list span{color:var(--lime)}
.newdad-close{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:24px;margin-top:36px}
.newdad-close p{font-size:clamp(1.8rem,4vw,2.6rem);line-height:1.05;color:var(--black)}
.newdad-close p.green{color:var(--green)}
.newdad-actions{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.btn-dark{background:var(--black);color:var(--lime)}
.small-link{color:#27500A}

.months{background:var(--black);color:#fff}
.months-title{margin-top:8px;font-size:clamp(2.2rem,5.4vw,3.6rem);line-height:1}
.months-title span{color:var(--lime);font-style:italic}
.row-label{margin:32px 0 0;font-size:.78rem;font-weight:400;letter-spacing:.12em;color:#A3A29C}
.months .row-label+.row3{margin-top:12px}
.tagged figcaption{position:absolute;left:12px;bottom:12px;display:flex;flex-direction:column;gap:2px;max-width:calc(100% - 24px);background:var(--black);padding:8px 12px;border-radius:6px;font-size:.82rem;line-height:1.3}
.tagged figcaption b{font-weight:600;color:var(--lime)}
.tagged figcaption span{color:#E6E5DF}
.months-actions{display:flex;flex-wrap:wrap;gap:20px;align-items:center;margin-top:32px}
.btn-lime{background:var(--lime);color:var(--black)}
.lime-link{color:var(--lime)}

.cookout{background:var(--green);color:#fff}
.cookout .kicker{color:#B7D48C}
.cookout-title{margin-top:8px;font-size:clamp(2.4rem,6vw,4rem);line-height:1}
.cookout-title span{color:var(--lime);font-style:italic}
.cookout .lede{color:#E3EDD6}
.cookout .ph{background:var(--green-2);aspect-ratio:auto}
.cookout-top{display:grid;grid-template-columns:minmax(0,496fr) minmax(0,486fr);gap:var(--gap);margin-top:32px}
.cookout-stack{display:flex;flex-direction:column;gap:var(--gap)}
.cookout .land{aspect-ratio:3/2}
.cookout-strip{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,2fr) minmax(0,1fr);gap:var(--gap);margin-top:var(--gap)}
.cookout-close{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:32px}
.cookout-close p{font-size:1.8rem}

/* tablet */
@media (max-width:860px){
  .tri-hero{grid-template-columns:1fr}
  .club-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* phone */
@media (max-width:640px){
  .club-head{align-items:flex-start}
  .club-logo{width:72px}
  .baselines div{padding:12px}
  .baselines dd{font-size:1.15rem}
  .timeline{font-size:.8rem}
  .end-link{text-align:left}
  .snap{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:78%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:thin}
  .snap>*{scroll-snap-align:start}
  .newdad-actions{align-items:flex-start}
  .cookout-top{grid-template-columns:1fr}
  .cookout .cookout-hero{aspect-ratio:3/4}
  .cookout-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cookout-strip .ph{aspect-ratio:4/5}
}
