/* ==========================================================================
   RunFitCoach — Meridian design system
   Warm sand · deep ink · clay accent · Schibsted Grotesk + Inter
   Single source of truth for the premium 1-on-1 coaching site.
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --sand:#EBE4D6; --sand-2:#F5F0E6; --sand-3:#E0D7C5; --paper:#FBF8F2;
  --ink:#1F211C; --ink-2:#56584E; --ink-3:#8B8B7E;
  --line:rgba(31,33,28,0.13); --line-soft:rgba(31,33,28,0.07);
  --clay:#B0542F; --clay-2:#9A4527; --clay-soft:#E69B6E; --pine:#27483A;
  --grot:'Schibsted Grotesk', system-ui, sans-serif;
  --sans:'Inter', system-ui, sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,monospace;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;background:var(--sand);scroll-behavior:smooth;}
body{background:var(--sand);color:var(--ink);font-family:var(--sans);line-height:1.6;}
img{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:1220px;margin:0 auto;padding:0 48px;}
.wrap-narrow{max-width:880px;margin:0 auto;padding:0 48px;}
.eyebrow{font-family:var(--grot);font-weight:600;font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--clay);}

/* ── Buttons ──────────────────────────────────────────── */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--grot);font-weight:600;font-size:14px;padding:12px 22px;border-radius:8px;transition:all .22s ease;cursor:pointer;border:1px solid transparent;}
.btn-clay{background:var(--clay);color:#FBF8F2;}
.btn-clay:hover{background:var(--clay-2);}
.btn-line{background:transparent;color:var(--ink);border-color:var(--line);}
.btn-line:hover{border-color:var(--ink);}
.btn-dark{background:var(--ink);color:var(--sand-2);}
.btn-dark:hover{background:#000;}
.btn-lg{padding:15px 28px;font-size:15px;}

/* ── Nav ──────────────────────────────────────────────── */
.nav{display:flex;align-items:center;justify-content:space-between;padding:24px 48px;max-width:1220px;margin:0 auto;}
.brand{display:inline-flex;align-items:center;gap:10px;font-family:var(--grot);font-weight:800;font-size:19px;letter-spacing:-0.01em;}
.brand-mark{height:24px;width:auto;display:block;flex:none;}
.brand .wm{font-style:normal;}
.brand .wm i{color:var(--clay);font-style:normal;}
.nav-links{display:flex;gap:34px;font-size:14.5px;font-weight:500;color:var(--ink-2);}
.nav-links a:hover{color:var(--ink);}
.nav-links a.active{color:var(--ink);}
.nav-tog-cb{display:none;}
.nav-toggle{display:none;align-items:center;justify-content:center;width:42px;height:42px;margin-right:-8px;border:0;background:none;color:var(--ink);cursor:pointer;}
.nav-toggle svg{width:24px;height:24px;}

/* ── Section rhythm ───────────────────────────────────── */
section{padding:100px 0;}
.sec-head{max-width:680px;margin-bottom:52px;}
.sec-head.center{text-align:center;margin-left:auto;margin-right:auto;}
.sec-head .eyebrow{display:block;margin-bottom:16px;}
.sec-head h2{font-family:var(--grot);font-weight:800;font-size:44px;line-height:1.04;letter-spacing:-0.025em;text-wrap:balance;}
.sec-head p{font-size:17px;color:var(--ink-2);line-height:1.65;margin-top:18px;}

/* ── Roster pill ──────────────────────────────────────── */
.roster{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:500;color:var(--ink-2);}
.roster .dot{width:7px;height:7px;border-radius:50%;background:var(--clay);box-shadow:0 0 0 4px rgba(176,84,47,0.14);}

/* ── Hero ─────────────────────────────────────────────── */
.hero{padding:46px 0 84px;}
.hero-grid{display:grid;grid-template-columns:1.04fr 0.96fr;gap:56px;align-items:center;}
.hero h1{font-family:var(--grot);font-weight:800;font-size:64px;line-height:1.0;letter-spacing:-0.03em;margin:22px 0 0;text-wrap:balance;}
.hero h1 .clay{color:var(--clay);}
.hero .lede{font-size:18px;line-height:1.65;color:var(--ink-2);max-width:480px;margin:26px 0 0;}
.hero .cta-row{display:flex;align-items:center;gap:16px;margin-top:32px;flex-wrap:wrap;}
.hero-fig{position:relative;}
.hero-photo{aspect-ratio:4/4.4;overflow:hidden;border-radius:14px;background:var(--sand-3);}
.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 28%;filter:saturate(0.96);}

/* Data readout card (optimization motif) */
.readout{position:absolute;left:-34px;bottom:34px;width:268px;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px 20px 18px;box-shadow:0 24px 50px rgba(31,33,28,0.16);}
.readout .rt{font-family:var(--grot);font-size:11px;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-3);display:flex;justify-content:space-between;align-items:center;}
.readout .rt b{color:var(--pine);font-weight:600;}
.readout .big{display:flex;align-items:baseline;gap:8px;margin:8px 0 14px;}
.readout .big .v{font-family:var(--grot);font-weight:800;font-size:42px;line-height:1;letter-spacing:-0.03em;}
.readout .big .u{font-size:13px;color:var(--ink-3);}
.readout .big .trend{margin-left:auto;font-family:var(--grot);font-weight:600;font-size:13px;color:var(--clay);}
.zones{display:flex;gap:4px;align-items:flex-end;height:38px;}
.zones .z{flex:1;border-radius:3px 3px 0 0;background:var(--sand-3);}
.zones .z.a{background:rgba(176,84,47,0.3);}
.zones .z.b{background:rgba(176,84,47,0.55);}
.zones .z.c{background:var(--clay);}
.zlabel{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;color:var(--ink-3);margin-top:7px;letter-spacing:0.02em;}

/* ── Creds strip ──────────────────────────────────────── */
.creds{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--sand-2);}
.creds .wrap{display:flex;justify-content:space-between;gap:24px;padding:30px 48px;flex-wrap:wrap;}
.cred{display:flex;flex-direction:column;gap:4px;}
.cred .n{font-family:var(--grot);font-weight:800;font-size:34px;line-height:1;letter-spacing:-0.02em;color:var(--ink);}
.cred .l{font-size:12px;color:var(--ink-2);max-width:160px;}

/* ── Who this is for (photo cards) ────────────────────── */
.who-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.who-card{position:relative;aspect-ratio:4/4.6;border-radius:16px;overflow:hidden;background:var(--sand-3);}
.who-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease,ease);filter:saturate(0.95) brightness(0.92);}
.who-card:hover img{transform:scale(1.04);}
.who-card::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(31,33,28,0) 40%,rgba(31,33,28,0.5) 72%,rgba(31,33,28,0.9) 100%);}
.who-card .body{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:24px;color:#fff;}
.who-card .tag{display:inline-block;font-family:var(--grot);font-weight:600;font-size:10.5px;letter-spacing:0.12em;text-transform:uppercase;color:var(--clay-soft);margin-bottom:10px;}
.who-card h3{font-family:var(--grot);font-weight:700;font-size:22px;line-height:1.1;letter-spacing:-0.01em;margin:0 0 8px;color:#fff;text-wrap:balance;}
.who-card p{font-size:14px;line-height:1.5;color:rgba(255,255,255,0.85);margin:0;}

/* ── Pillars ──────────────────────────────────────────── */
.pillars{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.pillar{background:var(--sand-2);border:1px solid var(--line);border-radius:14px;padding:24px 22px 26px;min-height:212px;display:flex;flex-direction:column;transition:transform .25s ease,box-shadow .25s ease;}
.pillar:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(31,33,28,0.1);}
.pillar .ic{width:34px;height:34px;border-radius:9px;background:rgba(176,84,47,0.1);color:var(--clay);display:grid;place-items:center;margin-bottom:auto;}
.pillar .ic svg{width:18px;height:18px;}
.pillar h3{font-family:var(--grot);font-weight:700;font-size:19px;letter-spacing:-0.01em;margin:18px 0 8px;}
.pillar p{font-size:13px;color:var(--ink-2);line-height:1.5;}

/* ── The Journey (vertical timeline) ──────────────────── */
.journey-sec{background:var(--ink);color:var(--sand-2);}
.journey-sec .eyebrow{color:var(--clay-soft);}
.journey-sec .sec-head h2{color:var(--sand-2);}
.journey-sec .sec-head p{color:rgba(245,240,230,0.7);}
.journey{display:grid;gap:0;border-top:1px solid rgba(245,240,230,0.12);}
.jstep{display:grid;grid-template-columns:120px 1fr 1fr;gap:40px;padding:38px 0;border-bottom:1px solid rgba(245,240,230,0.12);align-items:start;}
.jstep .jno{font-family:var(--grot);font-weight:800;font-size:15px;color:var(--clay-soft);letter-spacing:0.04em;display:flex;align-items:center;gap:12px;}
.jstep .jno .ph{font-family:var(--grot);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(245,240,230,0.4);font-weight:600;}
.jstep h3{font-family:var(--grot);font-weight:700;font-size:27px;line-height:1.08;letter-spacing:-0.02em;color:var(--sand-2);}
.jstep .jbody{font-size:15.5px;line-height:1.65;color:rgba(245,240,230,0.72);}
.jstep .jbody b{color:var(--sand-2);font-weight:600;}
.jstep ul{list-style:none;margin:14px 0 0;display:grid;gap:9px;}
.jstep li{font-size:13.5px;color:rgba(245,240,230,0.7);padding-left:20px;position:relative;line-height:1.45;}
.jstep li::before{content:'';position:absolute;left:0;top:8px;width:11px;height:1px;background:var(--clay-soft);}

/* ── Tiers ────────────────────────────────────────────── */
.tiers-sec{background:var(--sand-2);}
.tiers{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.tier{background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:40px 36px;display:flex;flex-direction:column;}
.tier.feat{background:var(--ink);color:var(--sand-2);position:relative;box-shadow:0 30px 70px rgba(31,33,28,0.22);}
.tier-name{font-family:var(--grot);font-weight:600;font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--clay);}
.tier.feat .tier-name{color:var(--clay-soft);}
.tier .flag{position:absolute;top:-11px;right:36px;background:var(--clay);color:#FBF8F2;font-family:var(--grot);font-size:10.5px;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:6px 13px;border-radius:999px;}
.tier .price{font-family:var(--grot);font-weight:800;font-size:58px;line-height:1;margin:16px 0 4px;letter-spacing:-0.03em;}
.tier .price span{font-size:16px;font-weight:500;color:var(--ink-3);}
.tier.feat .price span{color:rgba(245,240,230,0.55);}
.tier .tier-desc{font-size:14.5px;color:var(--ink-2);line-height:1.6;margin-bottom:22px;min-height:46px;}
.tier.feat .tier-desc{color:rgba(245,240,230,0.72);}
.tier ul{list-style:none;display:flex;flex-direction:column;gap:12px;margin:20px 0 28px;flex:1;}
.tier li{font-size:14px;color:var(--ink);line-height:1.45;padding-left:26px;position:relative;}
.tier.feat li{color:rgba(245,240,230,0.92);}
.tier li::before{content:'';position:absolute;left:0;top:3px;width:15px;height:15px;border-radius:50%;background:rgba(176,84,47,0.12);}
.tier li::after{content:'';position:absolute;left:5px;top:8px;width:5px;height:3px;border-left:1.5px solid var(--clay);border-bottom:1.5px solid var(--clay);transform:rotate(-45deg);}
.tier.feat li::before{background:rgba(230,155,110,0.18);}
.tier.feat li::after{border-color:var(--clay-soft);}
.tier .btn{width:100%;justify-content:center;}
.tier.feat .btn-clay{background:var(--clay-soft);color:var(--ink);}
.tier.feat .btn-clay:hover{background:#efaf88;}
.tiers-note{text-align:center;font-size:13.5px;color:var(--ink-2);margin-top:24px;}

/* ── Athletes / testimonials ──────────────────────────── */
.tw-grid{columns:3;column-gap:18px;}
.tw-card{break-inside:avoid;margin-bottom:18px;background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden;}
.tw-card .ph{aspect-ratio:5/4;overflow:hidden;background:var(--sand-3);}
.tw-card .ph img{width:100%;height:100%;object-fit:cover;}
.tw-card .tx{padding:22px 22px 20px;}
.tw-card blockquote{font-size:15.5px;line-height:1.55;color:var(--ink);margin:0 0 16px;font-weight:500;text-wrap:pretty;}
.tw-card.text-only blockquote{font-family:var(--grot);font-weight:600;font-size:18px;line-height:1.4;letter-spacing:-0.01em;}
.tw-card .who{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--line);padding-top:14px;}
.tw-card .who .nm{font-family:var(--grot);font-weight:700;font-size:14px;color:var(--ink);}
.tw-card .who .mt{font-size:12.5px;color:var(--ink-3);}

/* ── FAQ ──────────────────────────────────────────────── */
.faq{max-width:780px;margin:0 auto;}
.faq details{border-bottom:1px solid var(--line);padding:22px 0;}
.faq details:first-child{border-top:1px solid var(--line);}
.faq summary{cursor:pointer;font-family:var(--grot);font-weight:700;font-size:19px;color:var(--ink);letter-spacing:-0.01em;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:'+';font-family:var(--grot);font-weight:400;font-size:26px;color:var(--clay);transition:transform .2s;flex-shrink:0;line-height:1;}
.faq details[open] summary::after{content:'\2212';}
.faq p{margin:14px 0 0;font-size:15px;line-height:1.65;color:var(--ink-2);}

/* ── Coach ────────────────────────────────────────────── */
.coach-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:54px;align-items:center;}
.coach-fig{aspect-ratio:4/4.6;overflow:hidden;border-radius:16px;background:var(--sand-3);}
.coach-fig img{width:100%;height:100%;object-fit:cover;object-position:center 20%;}
.coach-grid h2{font-family:var(--grot);font-weight:800;font-size:40px;line-height:1.05;letter-spacing:-0.025em;margin:14px 0 6px;}
.coach-grid .role{font-family:var(--grot);font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--clay);font-weight:600;margin-bottom:22px;}
.coach-grid p{font-size:16px;color:var(--ink-2);line-height:1.68;margin-bottom:14px;max-width:540px;}
.coach-creds{list-style:none;margin-top:24px;display:grid;gap:10px;}
.coach-creds li{font-size:14px;color:var(--ink);padding-left:24px;position:relative;line-height:1.5;}
.coach-creds li::before{content:'';position:absolute;left:0;top:9px;width:13px;height:2px;background:var(--clay);border-radius:2px;}

/* ── Final CTA ────────────────────────────────────────── */
.final{background:var(--pine);color:var(--sand-2);text-align:center;}
.final h2{font-family:var(--grot);font-weight:800;font-size:52px;line-height:1.04;letter-spacing:-0.025em;max-width:740px;margin:0 auto;text-wrap:balance;}
.final p{font-size:17px;color:rgba(245,240,230,0.72);margin:20px auto 34px;max-width:460px;}
.final .btn-clay{background:var(--clay-soft);color:var(--ink);}
.final .btn-clay:hover{background:#efaf88;}
.final .micro{margin-top:18px;font-size:13px;color:rgba(245,240,230,0.55);}
.final .micro a{color:var(--clay-soft);text-decoration:underline;text-underline-offset:3px;}

/* ── Footer ───────────────────────────────────────────── */
.foot{background:var(--ink);color:var(--sand-2);padding:64px 0 40px;}
.foot .wrap{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;}
.foot .brand-col .brand{color:var(--sand-2);font-size:21px;margin-bottom:14px;}
.foot .brand-col p{font-size:14px;color:rgba(245,240,230,0.55);line-height:1.6;max-width:280px;}
.foot h5{font-family:var(--grot);font-weight:600;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:rgba(245,240,230,0.45);margin-bottom:16px;}
.foot ul{list-style:none;display:grid;gap:11px;}
.foot ul a{font-size:14px;color:rgba(245,240,230,0.78);}
.foot ul a:hover{color:var(--clay-soft);}
.foot .legal{grid-column:1/-1;border-top:1px solid rgba(245,240,230,0.12);margin-top:48px;padding-top:24px;display:flex;justify-content:space-between;font-size:12.5px;color:rgba(245,240,230,0.45);flex-wrap:wrap;gap:8px;}
.foot .legal a{color:rgba(245,240,230,0.6);text-decoration:none;}
.foot .legal a:hover{color:var(--clay-soft);}

/* ── Responsive ───────────────────────────────────────── */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr;gap:40px;}
  .pillars{grid-template-columns:repeat(2,1fr);}
  .who-grid{grid-template-columns:repeat(2,1fr);}
  .tw-grid{columns:2;}
  .coach-grid{grid-template-columns:1fr;gap:32px;}
  .jstep{grid-template-columns:1fr;gap:14px;}
  .foot .wrap{grid-template-columns:1fr 1fr;}
}
@media (max-width:680px){
  .wrap,.wrap-narrow,.nav,.creds .wrap{padding-left:24px;padding-right:24px;}
  .nav{flex-wrap:wrap;}
  .brand{flex:1;}
  .nav-toggle{display:inline-flex;order:2;}
  .nav-links{display:none;order:3;width:100%;flex-direction:column;gap:0;margin-top:8px;}
  .nav-tog-cb:checked ~ .nav-links{display:flex;}
  .nav-links a{padding:14px 2px;border-top:1px solid var(--line);font-size:16px;color:var(--ink);}
  .nav .btn-clay{display:none;order:4;width:100%;justify-content:center;margin-top:10px;}
  .nav-tog-cb:checked ~ .btn-clay{display:inline-flex;}
  .hero h1{font-size:46px;}
  .sec-head h2{font-size:34px;}
  .tiers{grid-template-columns:1fr;}
  .who-grid{grid-template-columns:1fr;}
  .pillars{grid-template-columns:1fr;}
  .tw-grid{columns:1;}
  .foot .wrap{grid-template-columns:1fr;}
}
