/* /coach (website/design/coach). Loads after home.css and reuses its nav, footer, .sec, .kick,
   .up and theme tokens; everything new here is prefixed c- so nothing on home changes. */
.cpg{--sunk:#efece4;--proof:#2f8f5b;--proof-wash:#e6f3ec;--coral-ink:#b8331d;--term:#161615;--glow:rgba(255,196,180,.75);--dot2:rgba(17,17,17,.13);
  --shadow:0 0 0 1px rgba(0,0,0,.06),0 20px 40px -30px rgba(60,40,20,.35)}
html.is-dark .cpg{--sunk:#232321;--proof:#4cc285;--proof-wash:#16261d;--coral-ink:#ff8a72;--term:#0b0b0a;--glow:rgba(232,67,42,.28);--dot2:rgba(255,255,255,.07);
  --shadow:0 0 0 1px rgba(255,255,255,.07),0 20px 40px -30px rgba(0,0,0,.8)}
.cpg em{font-style:normal;color:var(--coral)}
.nav a.lk[aria-current]{color:var(--ink);text-decoration:underline;text-decoration-color:var(--coral);text-decoration-thickness:2px;text-underline-offset:7px}
footer a[aria-current]{color:#f7f6f2}

/* hero */
.c-hero{position:relative;padding:130px 0 40px;overflow:hidden}
.c-bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.c-bg .c-tone{position:absolute;inset:0;background-image:radial-gradient(circle,var(--dot) 1.4px,transparent 1.9px);background-size:12px 12px;
  -webkit-mask-image:radial-gradient(ellipse 30% 44% at 2% 80%,#000,transparent 70%),radial-gradient(ellipse 30% 40% at 99% 8%,#000,transparent 70%);
          mask-image:radial-gradient(ellipse 30% 44% at 2% 80%,#000,transparent 70%),radial-gradient(ellipse 30% 40% at 99% 8%,#000,transparent 70%)}
.c-bg .c-grid{position:absolute;inset:0;background-image:radial-gradient(circle,var(--dot2) 1px,transparent 1.4px);background-size:12px 12px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 55%);mask-image:linear-gradient(180deg,#000,transparent 55%)}
.c-bg .c-glow{position:absolute;right:-10%;bottom:0;width:900px;height:min(640px,100%);background:radial-gradient(closest-side,var(--glow),transparent 100%)}
.c-hgrid{position:relative;display:grid;grid-template-columns:1fr 1.02fr;gap:56px;align-items:center}
.c-hero .hv{justify-content:flex-start}
.cpg .kick b{display:inline-block;font-weight:500;padding:3px 8px;border-radius:999px;background:var(--peach);margin-right:8px;letter-spacing:.1em}
.c-hero h1{margin:16px 0 0;font:600 clamp(38px,calc(4.4*var(--vw,1vw)),60px)/1.03 var(--serif);letter-spacing:-.03em;text-wrap:balance}
.c-lead{margin:20px 0 0;font-size:18px;line-height:1.55;color:var(--ink-2);max-width:560px}
.c-chips{margin:22px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.c-chips li{display:flex;align-items:center;gap:7px;font:500 13px var(--sans);padding:7px 12px;border-radius:999px;background:var(--white);box-shadow:0 0 0 1px var(--line)}
.c-chips li:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--proof)}
.c-ctas{margin-top:28px;display:flex;align-items:center;flex-wrap:wrap;gap:12px 22px}
.c-btn{display:inline-flex;align-items:center;height:52px;padding:0 26px;border-radius:999px;background:var(--coral-btn);color:#fff;font:600 15.5px var(--sans);text-decoration:none;box-shadow:inset 0 1px rgba(255,255,255,.25),inset 0 -2px 2px rgba(0,0,0,.18);transition:scale .45s cubic-bezier(.34,1.56,.64,1)}
.c-btn:active{scale:.96}
.c-tlink{font:500 15px var(--sans);color:var(--ink);text-decoration:underline;text-decoration-color:var(--coral);text-underline-offset:5px}

/* example session */
.c-sess{position:relative;margin:0;border-radius:16px;background:var(--term);color:#e9e7e1;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 40px 80px -40px rgba(40,20,10,.55)}
.c-sess .bar{display:flex;align-items:center;gap:7px;padding:12px 14px;border-bottom:1px solid #262624}
.c-sess .bar i{width:10px;height:10px;border-radius:50%;background:#3a3a37}
.c-sess .bar span{margin-left:8px;font:12px var(--mono);color:#8d8a82}
.c-sess .bar .ex{margin-left:auto;white-space:nowrap;font:500 10.5px var(--mono);letter-spacing:.12em;color:#ff9a85;border:1px solid #4a2a22;padding:2px 8px;border-radius:999px}
.c-sess ol{list-style:none;margin:0;padding:16px 18px 18px;font:12.5px/1.65 var(--mono);min-height:440px}
.c-sess.play li{opacity:0;transform:translateY(4px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.c-sess.play li.on{opacity:1;transform:none}
.c-sess .p,.c-sess .dim{color:#8d8a82}
.c-sess .ag{color:#ffb4a5}.c-sess .ag:before{content:"● ";color:#e8432a}
.c-sess .ti{font-weight:500}
.c-sess .diff{margin:6px 0;padding:8px 10px;border-radius:8px;background:#1f1f1d;white-space:pre;overflow-x:auto}
.c-sess .del{color:#ff8f7d}.c-sess .add,.c-sess .ok{color:#8fe0b2}
.c-sess .yes{display:inline-block;margin-left:6px;padding:0 7px;border-radius:5px;background:#e9e7e1;color:#111;font-weight:500}
.c-sess .done{margin-top:8px;display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:8px;background:#163222;color:#bff0d3;font-family:var(--sans);font-size:13px}
.c-sess .done b{width:18px;height:18px;border-radius:50%;background:#2f8f5b;color:#fff;display:grid;place-items:center;font-size:11px}
.c-sess .pen{position:absolute;right:-6px;top:-34px;font:700 21px/1.05 var(--hand);color:var(--coral);transform:rotate(-4deg);pointer-events:none}

/* how */
.cpg .sec{padding-top:110px;padding-bottom:0}
.c-steps{margin:48px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.c-steps li{position:relative;background:var(--white);border-radius:16px;padding:24px 24px 26px;box-shadow:var(--shadow)}
.c-steps .n{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--peach);color:var(--coral-ink);font:600 14px var(--mono)}
.c-steps h3{margin:16px 0 8px;font:600 21px/1.2 var(--serif)}
.c-steps p{margin:0;font-size:15px;color:var(--ink-2)}
.c-steps .vis{margin-top:18px;padding:12px 14px;border-radius:10px;background:var(--sunk);font:12px/1.6 var(--mono);color:var(--ink-2);overflow-wrap:anywhere}
.c-steps .vis b{color:var(--ink);font-weight:500}.c-steps .vis .g{color:var(--proof)}
.c-steps li:not(:last-child):after{content:"";position:absolute;right:-18px;top:41px;width:18px;border-top:2px dashed var(--line)}

/* knows */
.c-tiles{margin:48px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.c-tile{background:var(--white);border-radius:16px;padding:24px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.c-tile .big{font:500 44px/1 var(--mono);letter-spacing:-.04em;color:var(--coral)}
.c-tile h3{margin:14px 0 6px;font:600 20px/1.2 var(--serif)}.c-tile h3.nt{margin-top:0}
.c-tile p{margin:0;font-size:14.5px;color:var(--ink-2)}
.c-tile .tags{margin-top:auto;padding-top:16px;display:flex;flex-wrap:wrap;gap:6px}
.c-tile .tags span{font:11px var(--mono);padding:3px 8px;border-radius:999px;background:var(--sunk);color:var(--ink-2)}
.c-evid{margin:22px 0 0;display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:15px;color:var(--ink-2)}
.c-evid .src{display:flex;gap:6px;flex-wrap:wrap}
.c-evid .src span{font:500 11.5px var(--mono);padding:4px 9px;border-radius:999px;box-shadow:0 0 0 1px var(--line)}
.c-built{margin-top:28px;display:grid;grid-template-columns:auto 1fr;gap:28px;align-items:center;padding:26px 28px;border-radius:16px;background:var(--peach)}
.c-built .num{font:500 54px/1 var(--mono);letter-spacing:-.04em;color:var(--coral-ink)}
.c-built h3{margin:0 0 6px;font:600 21px/1.2 var(--serif)}
.c-built p{margin:0;font-size:15px;color:var(--ink-2);max-width:760px}
html.is-dark .c-built p{color:var(--ink)}
/* agent tracking and Search Console: two mirrored panel + text rows */
.c-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center}
.c-h2{margin:12px 0 0;font:600 clamp(34px,calc(3.7*var(--vw,1vw)),50px)/1.06 var(--serif);letter-spacing:-.02em;text-wrap:balance}
.c-h2 em{color:var(--coral);font-style:normal}
.c-log,.c-gscp{border-radius:16px;background:var(--term);color:#e9e7e1;font:12.5px var(--mono);overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.06),0 40px 80px -40px rgba(40,20,10,.55)}
.c-log .hd,.c-gscp .hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;border-bottom:1px solid #262624;color:#8d8a82}
.c-log .hd span:first-child{display:inline-flex;align-items:center;gap:8px}
.c-log .live{width:7px;height:7px;border-radius:50%;background:#4cc285;box-shadow:0 0 0 0 rgba(76,194,133,.5)}
.c-log .ex,.c-gscp .ro{font:500 10.5px var(--mono);letter-spacing:.12em;color:#ff9a85;border:1px solid #4a2a22;padding:2px 8px;border-radius:999px}
.c-log .row{display:grid;grid-template-columns:44px 86px minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid #20201e}
.c-log .at{color:#6f6c65}
.c-log .lab{text-align:center;padding:3px 8px;border-radius:999px;font-size:11.5px}
.l-verified{background:#163222;color:#bff0d3}.l-declared{background:#16283a;color:#b7d7f5}
.l-inferred{background:#3a2a12;color:#f5d7a0}.l-human{background:#2a2a28;color:#c9c6be}
.c-log .who{color:#e9e7e1;font-family:var(--sans);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.c-log .pth{color:#ff9a85}
.c-log .ft,.c-gscp .ft{display:flex;justify-content:space-between;gap:12px;padding:11px 16px 13px;color:#8d8a82;font-size:11.5px}
.c-gscp .row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:16px 18px;border-bottom:1px solid #20201e;font-family:var(--sans);font-size:15px}
.c-gscp .row .n{font:12px var(--mono);color:#8d8a82}
.c-gscp .row svg{color:#ff9a85;fill:#ff9a85;overflow:visible}.c-gscp .row svg .lo{fill:#5a3a32}

/* safety */
.c-safe{margin-top:110px;background:#141413;color:#f2f0ea;border-radius:28px;padding:64px 56px;position:relative;overflow:hidden}
html.is-dark .c-safe{box-shadow:0 0 0 1px #2d2d2b}
.c-safe .c-glow{position:absolute;left:-10%;bottom:-60%;width:80%;height:120%;background:radial-gradient(closest-side,rgba(232,67,42,.32),transparent);pointer-events:none}
.c-safe .in{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.c-safe .kick{color:#ff9a85}
.c-safe h2{margin:12px 0 0;font:600 clamp(32px,calc(3.5*var(--vw,1vw)),46px)/1.06 var(--serif);letter-spacing:-.02em}
.c-safe h2 em{color:#ff7a62}
.c-safe .rules{margin:0;padding:0;list-style:none}
.c-safe .rules li{display:flex;gap:14px;align-items:flex-start;padding:16px 0;border-top:1px solid #2e2e2c;font-size:16.5px;line-height:1.45}
.c-safe .rules li:last-child{border-bottom:1px solid #2e2e2c}
.c-safe .rules svg{flex:none;margin-top:2px}

/* access */
.c-acc{margin-top:48px;display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:stretch}
.c-acc .where,.c-acc .facts{background:var(--white);border-radius:16px;padding:26px;box-shadow:var(--shadow)}
.c-acc h3{margin:0 0 4px;font:600 20px/1.2 var(--serif)}
.c-acc .wcap{margin:0 0 18px;font-size:14.5px;color:var(--ink-2)}
.lanes{display:grid;grid-template-columns:1fr 78px 1fr;align-items:stretch}
.lane{border-radius:12px;padding:16px;background:var(--sunk)}
.lane.mine{background:var(--proof-wash);box-shadow:0 0 0 1px color-mix(in srgb,var(--proof) 35%,transparent)}
.lane .lt{font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
.lane.mine .lt{color:var(--proof)}
.lane ul{margin:10px 0 0;padding:0;list-style:none;font-size:14px}
.lane li{padding:5px 0;display:flex;gap:8px}
.lane li:before{content:"✓";color:var(--proof);font-weight:700}
.lane li.x{color:var(--ink-3)}.lane li.x:before{content:"✕";color:var(--ink-3)}
.pipe{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font:10.5px/1.25 var(--mono);color:var(--ink-3);text-align:center}
.pipe i{display:block;width:100%;border-top:2px dashed var(--line);position:relative}
.pipe i:after{content:"";position:absolute;left:-2px;top:-6px;border:5px solid transparent;border-right-color:var(--ink-3)}
.c-acc dl{margin:10px 0 0}
.c-acc dt{font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-top:16px}
.c-acc dd{margin:4px 0 0;font-size:15px;color:var(--ink-2)}
.c-acc dd .big{font:500 30px/1.2 var(--mono);color:var(--coral);letter-spacing:-.03em}

/* faq, open text */
.c-faq{margin-top:44px;display:grid;grid-template-columns:1fr 1fr;gap:0 56px;border-top:1px solid var(--line)}
.c-faq>div{padding:22px 0;border-bottom:1px solid var(--line)}
.c-faq h3{margin:0 0 8px;font:500 19px/1.35 var(--serif)}
.c-faq p{margin:0;font-size:15.5px;color:var(--ink-2)}

/* closing band */
.c-final{position:relative;margin-top:110px;padding:100px 0 80px;text-align:center;overflow:hidden}
.c-final .c-glow{left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%);width:1200px;height:100%}
.c-final h2{position:relative;margin:0 auto;font:600 clamp(40px,calc(5*var(--vw,1vw)),70px)/1.02 var(--serif);letter-spacing:-.025em;max-width:900px;text-wrap:balance}
.c-final .c-ctas{position:relative;justify-content:center;margin-top:32px}
.c-final .cfine{position:relative;margin-top:14px;font-size:14px;color:var(--ink-3)}

@media(max-width:980px){
  .c-hgrid{grid-template-columns:1fr;gap:48px}
  .c-sess .pen{right:6px}
  .c-steps,.c-tiles{grid-template-columns:1fr 1fr}
  .c-steps li:after{display:none}
  .c-safe .in,.c-acc{grid-template-columns:1fr}
  .c-safe{padding:48px 32px}
  .c-duo{grid-template-columns:1fr;gap:28px}
  .c-trk .txt{order:-1}
}
@media(max-width:700px){
  .c-hero{padding:96px 0 24px}
  .c-hero h1{font-size:36px}
  .c-steps,.c-tiles,.c-faq{grid-template-columns:1fr}
  .cpg .sec{padding-top:80px}
  .c-built{grid-template-columns:1fr;gap:10px;padding:22px}
  .c-h2{font-size:29px;line-height:1.1}
  .c-log .row{grid-template-columns:40px 78px minmax(0,1fr);gap:10px}
  .c-log .pth{grid-column:3}
  .c-built .num{font-size:40px}
  .c-safe{margin-top:80px;border-radius:20px;padding:40px 22px}
  .c-sess .bar span:not(.ex){display:none}
  .c-sess ol{font-size:11.5px;padding:14px 14px 16px;min-height:0}
  .lanes{grid-template-columns:1fr;gap:0}
  .pipe{flex-direction:row;padding:10px 0}
  .pipe i{width:2px;height:22px;border-top:0;border-left:2px dashed var(--line)}
  .pipe i:after{display:none}
  .c-final{margin-top:80px;padding:72px 0 64px}
  .c-final h2{font-size:40px}
}
@media(prefers-reduced-motion:reduce){.c-btn,.c-sess.play li{transition:none}}

/* ===== motion (Soft, same language as home): every hidden start state sits under html.cm, which
   coach.js sets only when motion is allowed, so without JS or with reduced motion all is shown. */
.c-tile,.c-steps li,.c-acc .where,.c-acc .facts{position:relative;isolation:isolate;transition:opacity .7s var(--ease),transform .7s var(--ease),translate .52s var(--bounce,cubic-bezier(.34,1.56,.64,1)),box-shadow .38s var(--ease)}
.c-tile::before,.c-steps li::before,.c-acc .where::before,.c-acc .facts::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:0;pointer-events:none;transition:opacity .3s;background-image:radial-gradient(circle,rgba(232,67,42,.5) 1.3px,transparent 1.8px);background-size:10px 10px;-webkit-mask-image:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),#000,transparent 70%);mask-image:radial-gradient(180px circle at var(--mx,50%) var(--my,50%),#000,transparent 70%)}
html.is-dark .c-tile::before,html.is-dark .c-steps li::before,html.is-dark .c-acc .where::before,html.is-dark .c-acc .facts::before{background-image:radial-gradient(circle,rgba(255,106,74,.45) 1.3px,transparent 1.8px)}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .c-tile:hover::before,.c-steps li:hover::before,.c-acc .where:hover::before,.c-acc .facts:hover::before{opacity:.55}
  .c-tile:hover,.c-steps li:hover{translate:0 -3px;box-shadow:0 0 0 1px rgba(0,0,0,.09),0 30px 56px -34px rgba(60,40,20,.5)}
  html.is-dark .c-tile:hover,html.is-dark .c-steps li:hover{box-shadow:0 0 0 1px rgba(255,255,255,.1),0 30px 56px -30px rgba(0,0,0,.9)}
  .c-tile .tags span{transition:background-color .25s,color .25s}
  .c-tile:hover .tags span{background:var(--peach);color:var(--coral-ink)}
  .c-btn{transition:scale .52s var(--bounce,cubic-bezier(.34,1.56,.64,1)),translate .52s var(--bounce,cubic-bezier(.34,1.56,.64,1)),box-shadow .38s var(--ease)}
  .c-btn:hover{translate:0 -2px;box-shadow:inset 0 1px rgba(255,255,255,.3),inset 0 -2px 2px rgba(0,0,0,.18),0 14px 26px -12px rgba(212,58,34,.8)}
  .c-log .row,.c-gscp .row{transition:background-color .25s}
  .c-log .row:hover,.c-gscp .row:hover{background:#1d1d1b}
}
.c-btn:active{scale:.94;transition-duration:var(--t-press,120ms)}

/* steps: number pops, then the dashed link to the next step draws */
.cm .c-steps .n{scale:.4;opacity:0;transition:scale .6s var(--bounce,cubic-bezier(.34,1.56,.64,1)),opacity .3s}
.cm .c-steps li:not(:last-child):after{scale:0 1;transform-origin:left;transition:scale .5s var(--ease)}
.cm .c-steps.go .n{scale:1;opacity:1}
.cm .c-steps.go li:not(:last-child):after{scale:1 1}
.cm .c-steps li:nth-child(2) .n{transition-delay:.35s}.cm .c-steps li:nth-child(3) .n{transition-delay:.7s}
.cm .c-steps li:nth-child(1):after{transition-delay:.2s}.cm .c-steps li:nth-child(2):after{transition-delay:.55s}

/* agent log: visits arrive one by one, each label lands a beat later */
.cm .c-log .row{opacity:0;translate:0 8px;transition:opacity .4s var(--ease),translate .5s var(--ease);transition-delay:calc(var(--i)*.55s + .2s)}
.cm .c-log .lab{scale:.6;opacity:0;transition:scale .55s var(--bounce,cubic-bezier(.34,1.56,.64,1)),opacity .25s;transition-delay:calc(var(--i)*.55s + .55s)}
.cm .c-log.go .row{opacity:1;translate:0 0}
.cm .c-log.go .lab{scale:1;opacity:1}
.cm .c-log .live{animation:c-pulse 2s ease-out infinite}
@keyframes c-pulse{0%{box-shadow:0 0 0 0 rgba(76,194,133,.55)}70%,100%{box-shadow:0 0 0 7px rgba(76,194,133,0)}}

/* Search Console panel: the trend line draws, the bars grow */
.cm .c-gscp path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--ease) .3s}
.cm .c-gscp rect{transform-box:fill-box;transform-origin:bottom;scale:1 0;transition:scale .6s var(--bounce,cubic-bezier(.34,1.56,.64,1))}
.cm .c-gscp .row:nth-of-type(2) rect:nth-child(2){transition-delay:.1s}.cm .c-gscp .row:nth-of-type(2) rect:nth-child(3){transition-delay:.2s}.cm .c-gscp .row:nth-of-type(2) rect:nth-child(4){transition-delay:.3s}
.cm .c-gscp .row:nth-of-type(3) rect{transition-delay:.6s}.cm .c-gscp .row:nth-of-type(3) rect:nth-child(2){transition-delay:.9s}
.cm .c-gscp.go path{stroke-dashoffset:0}
.cm .c-gscp.go rect{scale:1 1}

/* safety: each tick draws in turn */
.cm .c-safe .rules path{stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .5s var(--ease)}
.cm .c-safe .rules.go path{stroke-dashoffset:0}
.cm .c-safe .rules li:nth-child(2) path{transition-delay:.15s}.cm .c-safe .rules li:nth-child(3) path{transition-delay:.3s}
.cm .c-safe .rules li:nth-child(4) path{transition-delay:.45s}.cm .c-safe .rules li:nth-child(5) path{transition-delay:.6s}

/* what runs where: the report and playbooks flow from the server to your computer */
.cm .lanes.go .pipe i{border-top-color:transparent;height:2px;background:repeating-linear-gradient(90deg,var(--ink-3) 0 6px,transparent 6px 12px);background-size:12px 2px;animation:c-flow .9s linear infinite}
@keyframes c-flow{to{background-position:-12px 0}}
@media (prefers-reduced-motion:reduce){.c-tile,.c-steps li,.c-acc .where,.c-acc .facts,.c-btn{transition:none}}

/* Proofie Coach's five tracks (_coach_tracks.html), on /coach and /features */
.c-trk5{margin-top:44px}
.c-trk5>h3{margin:0;font:600 26px/1.2 var(--serif);text-wrap:balance}.c-trk5>h3 em{color:var(--coral)}
.c-trk5>p{margin:8px 0 0;max-width:640px;color:var(--ink-2)}
.c-tracks{margin:22px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}
.c-tracks li{display:flex;flex-direction:column;gap:8px;padding:20px;border-radius:16px;background:var(--white);box-shadow:var(--shadow)}
.c-tracks .n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--peach);color:var(--coral-ink);font:600 13px var(--mono)}
.c-tracks b{font:600 18px/1.2 var(--serif)}
.c-tracks .l{font-size:14.5px;line-height:1.5;color:var(--ink-2)}
@media(max-width:1100px){.c-tracks{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.c-tracks{grid-template-columns:1fr}.c-tracks li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:4px 14px;padding:16px}.c-tracks .n{grid-row:span 2}.c-trk5>h3{font-size:22px}}