/* ═══════════════════════════════════════════════════════════════
   Run for Future /run/ — 頁面專屬樣式（pages/run.py）
   只用 site.css 的代幣，不重定義共用元件。手機優先：375 → 640 → 900。
   橘色只給「報名資訊待公布」標記與行動按鈕；歷屆資料一律藍。
   ═══════════════════════════════════════════════════════════════ */

/* ── 進場：site.js 進視窗時加 .in；<html class="js"> 由本頁 head_extra 加上，沒有 JS 直接顯示 ── */
.js .reveal{ opacity:0; transform:translateY(12px); transition:opacity .5s ease, transform .5s ease; }
.js .reveal.in{ opacity:1; transform:none; }
.js .ed-list > .reveal:nth-child(2){ transition-delay:.08s; }
.js .ed-list > .reveal:nth-child(3){ transition-delay:.16s; }
@media (prefers-reduced-motion:reduce){ .js .reveal{ opacity:1; transform:none; transition:none; } }

.sec-link{ font-weight:700; white-space:nowrap; }
.page-run section[id]{ scroll-margin-top:calc(var(--topbar-h) + 16px); }

/* ── 1. 開場 ── */
.rn-hero{ padding-top:clamp(28px,5vw,64px); padding-bottom:clamp(20px,3vw,40px); overflow:hidden; }
.rn-hero-in{ position:relative; z-index:1; display:grid; gap:32px; align-items:center; }
.rn-h1{ font-size:var(--fs-h1); font-weight:900; margin:4px 0 12px; }
.rn-h1 b{ color:var(--blue); font-weight:900; }
.rn-name{ font-size:var(--fs-small); font-weight:700; color:var(--blue); margin-bottom:12px; }
.rn-stats{ list-style:none; padding:0; margin:24px 0 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; max-width:520px; }
.rn-stats li{ background:var(--card); border-radius:var(--r-sm); box-shadow:var(--shadow); padding:12px 14px; display:grid; gap:2px; }
.rn-stats span{ font-size:var(--fs-xs); font-weight:700; color:var(--ink-dim); }
.rn-stats b{ font-size:clamp(20px,2.6vw,28px); font-weight:900; color:var(--blue); line-height:1.1; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.rn-stats b small{ font-size:.55em; font-weight:900; margin-left:.1em; }
.rn-hero-fig{ margin:0; max-width:520px; }
.rn-hero-fig picture{ border-radius:var(--r); overflow:hidden; box-shadow:var(--shadow-lg); background:var(--card); transform:rotate(-1.5deg); aspect-ratio:4 / 3; }
.rn-hero-fig picture img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos,50% 50%); }
.rn-hero-fig figcaption{ margin-top:14px; font-size:var(--fs-xs); color:var(--ink-dim); line-height:1.7; }
@media (min-width:900px){
  .rn-hero-in{ grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:56px; }
  .rn-hero-fig{ justify-self:end; width:100%; }
}

/* ── 2. 下一屆：報名資訊待公布 ── */
.nx{ padding:22px; display:grid; gap:12px; border:1px solid var(--line); max-width:720px; }
.nx-head{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; }
.nx-title{ font-size:var(--fs-h3); font-weight:900; display:flex; align-items:baseline; gap:10px; }
.nx-year{ font-size:var(--fs-small); font-weight:700; color:var(--blue); }
.nx-text{ font-size:var(--fs-small); color:var(--ink-dim); line-height:1.75; }
.nx-rows{ list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:var(--fs-small); }
.nx-rows li{ display:grid; grid-template-columns:6em minmax(0,1fr); gap:10px; padding:10px 12px; background:var(--page); border-radius:var(--r-sm); }
.nx-rows b{ color:var(--ink-dim); font-weight:700; font-size:var(--fs-xs); padding-top:2px; }
.nx-pending span{ color:var(--ink-dim); }
.nx-link{ font-weight:900; font-size:var(--fs-small); width:max-content; }

/* ── 3. 歷屆場次：一屆一張卡，由近到遠 ── */
.ed-list{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.ed{ padding:20px 22px 22px; display:grid; gap:10px; align-content:start; background:var(--page); box-shadow:none; border:1px solid var(--line); }
.ed-head{ display:flex; align-items:baseline; gap:12px; }
.ed-year{ font-size:clamp(24px,3vw,30px); font-weight:900; color:var(--blue); line-height:1; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.ed-title{ font-size:var(--fs-body); font-weight:900; color:var(--ink); }
.ed-rows{ list-style:none; margin:0; padding:0; display:grid; gap:6px; font-size:var(--fs-small); }
.ed-rows li{ display:grid; grid-template-columns:5.5em minmax(0,1fr); gap:8px; line-height:1.6; }
.ed-rows b{ color:var(--ink-dim); font-weight:700; font-size:var(--fs-xs); padding-top:2px; }
.ed-num{ font-weight:900; color:var(--blue); font-variant-numeric:tabular-nums; }
.ed-note{ font-size:var(--fs-xs); color:var(--ink-dim); line-height:1.7; }
.ed-link{ font-weight:900; font-size:var(--fs-xs); width:max-content; }
@media (min-width:640px){ .ed-list{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } }
@media (min-width:1000px){ .ed-list{ grid-template-columns:repeat(3,minmax(0,1fr)); } }

/* ── 4. 結餘款去哪裡 ── */
.rn-impact-in{ max-width:66ch; }

/* ── 5. CTA ── */
.rn-cta .wrap{ position:relative; }
.rn-cta-in{ position:relative; z-index:1; max-width:62ch; margin:0 auto; text-align:center; display:grid; gap:14px; justify-items:center; }
.rn-cta .sec-sub{ margin-top:0; }
.rn-cta-actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:4px; }
@media (max-width:639px){ .rn-cta .deco{ display:none; } }
