/* ═══════════════════════════════════════════════════════════
   99 — the coaches' page.

   Same night-court palette as the rest of the site, taken from styles.css
   rather than redeclared, so a token change there moves this too. What is
   new here is a PRICE LADDER, which is the only thing on the site a visitor
   is expected to operate rather than read.
   ═══════════════════════════════════════════════════════════ */

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}

/* ── hero ─────────────────────────────────────────────── */
.chero{position:relative;z-index:1;max-width:var(--maxw);margin:0 auto;padding:22px var(--gut) 60px}
.chero-title{font-family:Anton,Impact,sans-serif;text-transform:uppercase;color:var(--bone);
  font-size:clamp(2.2rem,8.6vw,4.4rem);line-height:.88;letter-spacing:-.012em;
  margin:26px 0 0;margin-left:-.017em;max-width:16ch}
.chero-title em{color:var(--sodium);font-style:normal}
.chero-sub{margin:18px 0 0;max-width:52ch;font-size:14px;line-height:1.65;color:var(--dim)}

.backlink{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--steel);text-decoration:none}
.backlink:hover{color:var(--bone)}

/* ── what it gives ────────────────────────────────────── */
.gives{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:44px}
@media(min-width:760px){.gives{grid-template-columns:repeat(3,1fr)}}
.give{background:var(--asphalt);padding:22px 20px;display:grid;gap:8px;align-content:start}
.give h3{margin:0;font-family:Anton,Impact,sans-serif;text-transform:uppercase;
  font-size:clamp(1.15rem,3.4vw,1.5rem);line-height:1;color:var(--bone);letter-spacing:.005em}
.give p{margin:0;font-size:12.5px;line-height:1.6;color:var(--dim)}
.give .n{font-size:9.5px;letter-spacing:.24em;color:var(--sodium)}

/* ── the fork: two ways to coach ──────────────────────── */
.fork{display:grid;gap:14px;margin-top:18px}
@media(min-width:860px){.fork{grid-template-columns:1fr 1fr}}
.path{position:relative;display:grid;gap:12px;align-content:start;
  padding:26px 24px 24px;background:rgba(232,230,225,.022);
  border:1px solid var(--line);cursor:pointer;text-align:left;width:100%;
  transition:border-color 180ms var(--ease),background 180ms var(--ease),transform 180ms var(--ease)}
.path:hover{border-color:var(--sodium);background:rgba(255,106,0,.05)}
.path[aria-pressed="true"]{border-color:var(--sodium);background:rgba(255,106,0,.07)}
.path[aria-pressed="true"]::after{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:3px;background:var(--sodium)}
.path h2{margin:0;font-family:Anton,Impact,sans-serif;text-transform:uppercase;
  font-size:clamp(1.6rem,5vw,2.1rem);line-height:.96;color:var(--bone)}
.path .who{font-size:9.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--sodium)}
.path p{margin:0;font-size:12.5px;line-height:1.6;color:var(--dim)}
.path ul{margin:4px 0 0;padding:0;list-style:none;display:grid;gap:5px}
.path li{font-size:12px;line-height:1.5;color:var(--steel);padding-left:16px;position:relative}
.path li::before{content:"";position:absolute;left:0;top:.52em;width:7px;height:1px;background:var(--sodium)}
.path .from{margin-top:6px;font-family:Anton,Impact,sans-serif;font-size:1.5rem;color:var(--bone);line-height:1}
.path .from span{font-family:"Plex Mono",monospace;font-size:9.5px;letter-spacing:.2em;color:var(--steel);margin-left:6px}

/* ── the ladder ───────────────────────────────────────── */
.picker{margin-top:16px;border:1px solid var(--line);background:rgba(232,230,225,.022)}
.picker[hidden]{display:none}
.picker-head{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline;justify-content:space-between;
  padding:20px 22px 0}
.picker-head h2{margin:0;font-family:Anton,Impact,sans-serif;text-transform:uppercase;
  font-size:clamp(1.5rem,4.6vw,2rem);line-height:1;color:var(--bone)}
.founding{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:#0B0D0F;
  background:var(--sodium);padding:5px 9px;white-space:nowrap}

.seats{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line);
  margin:18px 0 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.seat{background:var(--asphalt);border:0;cursor:pointer;padding:16px 4px 13px;
  display:grid;gap:3px;justify-items:center;color:var(--steel);
  transition:background 160ms var(--ease),color 160ms var(--ease)}
.seat:hover{background:rgba(255,106,0,.06);color:var(--bone)}
.seat b{font-family:Anton,Impact,sans-serif;font-size:clamp(1.5rem,5vw,2rem);line-height:1;color:inherit;font-weight:400}
.seat span{font-size:8.5px;letter-spacing:.2em;text-transform:uppercase}
.seat[aria-pressed="true"]{background:var(--sodium);color:#0B0D0F}
.seat[aria-pressed="true"] span{color:#0B0D0F;opacity:.75}

.quote{display:grid;gap:16px;padding:22px;align-items:end}
@media(min-width:720px){.quote{grid-template-columns:1fr auto}}
.price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.price .now{font-family:Anton,Impact,sans-serif;font-size:clamp(3rem,11vw,4.4rem);line-height:.86;color:var(--bone)}
.price .was{font-family:Anton,Impact,sans-serif;font-size:clamp(1.3rem,4vw,1.8rem);color:var(--steel);
  text-decoration:line-through;text-decoration-thickness:2px;opacity:.75}
.price .per{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--steel)}
.terms{margin:10px 0 0;font-size:11.5px;line-height:1.6;color:var(--steel);max-width:46ch}
.terms b{color:var(--bone);font-weight:400}

.buy{border:0;cursor:pointer;background:var(--sodium);color:#0B0D0F;
  font-family:"Plex Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  padding:17px 26px;white-space:nowrap;transition:filter 160ms var(--ease),transform 120ms var(--ease)}
.buy:hover{filter:brightness(1.08)}
.buy:active{transform:translateY(1px)}

/* ── the personal-coach panel ─────────────────────────── */
.solo{margin-top:16px;border:1px solid var(--line);background:rgba(232,230,225,.022);padding:24px 22px;
  display:grid;gap:12px}
.solo[hidden]{display:none}
.solo h2{margin:0;font-family:Anton,Impact,sans-serif;text-transform:uppercase;
  font-size:clamp(1.5rem,4.6vw,2rem);line-height:1;color:var(--bone)}
.solo p{margin:0;font-size:12.5px;line-height:1.65;color:var(--dim);max-width:56ch}
.solo .rows{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);margin-top:6px}
@media(min-width:680px){.solo .rows{grid-template-columns:1fr 1fr}}
.solo .row{background:var(--asphalt);padding:16px 18px;display:grid;gap:4px}
.solo .row b{font-family:Anton,Impact,sans-serif;font-size:1.4rem;color:var(--bone);font-weight:400;line-height:1}
.solo .row span{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--sodium)}
.solo .row p{font-size:11.5px;color:var(--steel)}

.note{font-size:11px;line-height:1.6;color:var(--steel);margin:14px 0 0}
.note a{color:var(--sodium)}

/* ── hero, at desk widths ─────────────────────────────── */
.chero-grid{display:grid;gap:34px;align-items:start}
@media(min-width:1000px){.chero-grid{grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);gap:46px}}

/* A slice of the real dashboard. Same shapes, same colour rule. */
.peek{border:1px solid var(--line);background:rgba(232,230,225,.022);margin-top:8px}
.peek-top{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:13px 15px;border-bottom:1px solid var(--line);
  font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--steel)}
.peek-live{color:var(--sodium);display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.peek-live i{width:6px;height:6px;border-radius:50%;background:var(--sodium);
  box-shadow:0 0 0 3px rgba(255,106,0,.18)}
.peek-list{list-style:none;margin:0;padding:0}
.peek-list li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:14px;align-items:center;
  padding:12px 15px;border-bottom:1px solid var(--line-soft,rgba(232,230,225,.07))}
.peek-list li:last-child{border-bottom:0}
.peek-list b{font-weight:400;font-size:12px;letter-spacing:.05em;color:var(--bone);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.peek-list em{font-family:Anton,Impact,sans-serif;font-style:normal;font-size:1.5rem;line-height:1;min-width:2.1ch;text-align:right}
.peek-list .t0{color:#8A8078}.peek-list .t1{color:#E85A1A}.peek-list .t2{color:#FF6A00}
.peek-list .t3{color:#FF9B2E}.peek-list .t4{color:#FFC48A}
.peek-list .quiet b{color:var(--steel)}
.dots{display:inline-flex;gap:3px}
.dots i{width:7px;height:7px;border-radius:2px;background:rgba(232,230,225,.14)}
.dots i.on{background:var(--sodium)}
.peek-foot{padding:11px 15px;border-top:1px solid var(--line);
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--steel)}