/* KTMS Racing Team — 共通スタイル */
:root{
  --ink:#0D1117;--ink2:#161B22;--ink3:#1C2530;
  --paper:#F4F5F7;--white:#fff;
  --blue:#2563EB;--blue-d:#1a4fc4;--blue-l:#93B4F4;
  --red:#E5331C;
  --line:#D2D6DD;--line-d:#252E3A;
  --muted:#5B626E;--muted-d:#8A93A0;
  --ph:#E3E6EA;--ph-d:#1C2435;
  --display:'Anton','Hiragino Kaku Gothic ProN',sans-serif;
  --jp:-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,Menlo,Consolas,monospace;
  --wrap:1180px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--jp);color:var(--ink);background:var(--paper);line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.wfbar{background:#111;color:#cfd3da;font:600 11px/1 var(--jp);letter-spacing:.08em;text-align:center;padding:7px 12px;border-bottom:1px solid #2a2f37}
.wfbar b{color:#fff}

/* type */
.eyebrow{font:700 11px/1 var(--jp);letter-spacing:.18em;text-transform:uppercase;color:var(--blue);display:inline-flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:20px;height:9px;background:var(--blue);transform:skewX(-18deg);display:inline-block}
.eyebrow.od{color:var(--blue-l)}
.eyebrow.od::before{background:var(--blue)}
.disp{font-family:var(--display);font-weight:400;line-height:1.02;letter-spacing:.01em}
.note{font:500 12px/1.6 var(--jp);color:var(--muted)}
.breadcrumb{display:flex;align-items:center;gap:8px;font:600 11px/1 var(--mono);letter-spacing:.1em;color:var(--muted);padding:20px 0 0}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--blue)}
.breadcrumb .sep{color:var(--line)}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:8px;font:700 13px/1 var(--jp);letter-spacing:.02em;padding:13px 20px;border:2px solid var(--blue);background:var(--blue);color:#fff;transition:.16s;cursor:pointer}
.btn:hover{background:var(--blue-d);border-color:var(--blue-d)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink);color:#fff}
.btn.od{background:#fff;border-color:#fff;color:var(--ink)}
.btn.od:hover{background:var(--blue-l);border-color:var(--blue-l)}
.btn.ghost-od{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.btn.ghost-od:hover{background:#fff;color:var(--ink);border-color:#fff}
.lnk{display:inline-flex;align-items:center;gap:6px;font:700 12px/1 var(--jp);border-bottom:2px solid var(--blue);padding-bottom:2px}
.lnk .ar{color:var(--blue)}
.lnk.od{border-color:var(--blue-l);color:#fff}
.lnk.od .ar{color:var(--blue-l)}
.extlnk{display:inline-flex;gap:5px;align-items:center;font:700 11px/1 var(--jp);color:var(--blue)}

/* media placeholder */
.media{position:relative;background:var(--ph);background-image:repeating-linear-gradient(135deg,rgba(0,0,0,.04) 0 12px,transparent 12px 24px);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-direction:column;gap:6px}
.media.dark{background:var(--ph-d);background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.04) 0 12px,transparent 12px 24px);border-color:var(--line-d)}
.media .ml{font:700 11px/1.4 var(--jp);letter-spacing:.08em;color:var(--muted);text-align:center;padding:10px}
.media.dark .ml{color:var(--muted-d)}
.media .tag{position:absolute;top:10px;left:10px;font:700 9px/1 var(--mono);letter-spacing:.12em;background:var(--ink);color:#fff;padding:4px 7px}
.media .playi{width:46px;height:46px;border-radius:50%;border:2px solid var(--blue);color:var(--blue);display:flex;align-items:center;justify-content:center;flex:none}
.media .playi::after{content:"";border-left:12px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:4px}
.ratio-219{aspect-ratio:21/9}
.ratio-169{aspect-ratio:16/9}
.ratio-43{aspect-ratio:4/3}
.ratio-34{aspect-ratio:3/4}
.ratio-11{aspect-ratio:1/1}

/* timing strip */
.timing{display:inline-flex;align-items:stretch;font-family:var(--mono);border:1px solid rgba(255,255,255,.2);color:#fff}
.timing .lead{background:var(--blue);color:#fff;font:700 10px/1 var(--mono);letter-spacing:.14em;display:flex;align-items:center;padding:0 11px;white-space:nowrap}
.timing .cell{display:flex;flex-direction:column;justify-content:center;padding:7px 13px;border-left:1px solid rgba(128,128,128,.3)}
.timing .cell .k{font:600 9px/1 var(--mono);letter-spacing:.14em;opacity:.55;margin-bottom:4px}
.timing .cell .v{font:700 14px/1 var(--mono)}
.timing.light{border-color:var(--line);color:var(--ink)}
.timing.light .cell{border-left-color:var(--line)}
.timing.light .cell .k{color:var(--muted)}
.timing.light .cell .v{color:var(--ink)}

/* sections */
section.band{padding:120px 0}
section.dark{background:var(--ink);color:#fff}
section.ink2{background:var(--ink2);color:#fff}
section.ink3{background:var(--ink3);color:#fff}
.head{display:flex;flex-direction:column;gap:14px;margin-bottom:48px}
.head h2{font-family:var(--display);font-size:clamp(32px,5.2vw,62px);line-height:1.02}
.head .lead{font:500 15.5px/1.9 var(--jp);max-width:40em}
.dark .head .lead,.ink2 .head .lead,.ink3 .head .lead{color:#dfe3ea}

/* page hero */
.page-hero{position:relative;background:var(--ink);color:#fff;overflow:hidden;min-height:52vh;display:flex;align-items:flex-end}
.page-hero .bgmedia{position:absolute;inset:0;background:var(--ph-d);background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 16px,transparent 16px 32px)}
.page-hero .grad{position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,17,23,.2) 0%,rgba(13,17,23,.85) 100%)}
.page-hero .inner{position:relative;width:100%;max-width:var(--wrap);margin:0 auto;padding:80px 24px 56px}
.page-hero h1{font-family:var(--display);font-size:clamp(44px,8vw,110px);line-height:.96;margin:14px 0 16px}
.page-hero .sub{font:500 16px/1.8 var(--jp);max-width:32em;color:#e4e8ef}

/* header */
header.site{position:sticky;top:0;z-index:60;background:rgba(13,17,23,.95);backdrop-filter:blur(10px);border-bottom:1px solid #222831}
.nav{display:flex;align-items:center;gap:20px;height:62px;color:#fff}
.brand{font-family:var(--display);font-size:21px;letter-spacing:.02em;display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.brand small{font:700 9px/1 var(--mono);letter-spacing:.18em;color:var(--muted-d)}
.nav ul{list-style:none;display:flex;gap:16px}
.nav ul a{font:600 12px/1 var(--jp);color:#c9cfd8;transition:.14s}
.nav ul a:hover,.nav ul a.active{color:#fff}
.nav .right{margin-left:auto;display:flex;align-items:center;gap:14px}
.powered{font:600 10px/1.4 var(--jp);color:var(--muted-d);text-align:right}
.nav .gr{font:700 12px/1 var(--jp);background:var(--blue);color:#fff;padding:10px 14px;white-space:nowrap;transition:.14s}
.nav .gr:hover{background:var(--blue-d)}

/* footer */
footer.site{background:#090c10;color:#c9cfd8;padding:52px 0 26px;border-top:1px solid #222831}
.foot-top{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;border-bottom:1px solid #222831;padding-bottom:26px;margin-bottom:18px}
.foot-brand{font-family:var(--display);font-size:24px;color:#fff}
.foot-brand .p{font:600 10px/1.4 var(--jp);color:var(--muted-d);margin-top:7px}
footer .fnav{display:flex;gap:22px;flex-wrap:wrap}
footer .fnav a{font:600 12px/1 var(--jp);color:#c9cfd8}
footer .fnav a:hover{color:#fff}
.foot-bot{display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;align-items:center}
.foot-bot .gr{font:700 11px/1 var(--jp);background:var(--blue);color:#fff;padding:10px 13px;transition:.14s}
.foot-bot .gr:hover{background:var(--blue-d)}
.copy{font:600 10px/1 var(--mono);color:var(--muted-d)}
.sns{display:flex;gap:10px}
.sns a{font:700 10px/1 var(--mono);letter-spacing:.08em;color:#c9cfd8;border:1px solid var(--line-d);padding:7px 9px}

/* reveal animation removed */
.rv{opacity:1;transform:none}

/* top accent + section stripe */
.top-accent{height:3px;background:linear-gradient(90deg,var(--blue) 60%,var(--red) 100%)}
.sec-stripe{height:2px;background:var(--blue);opacity:.55}

/* shared responsive */
@media(max-width:960px){.nav ul,.powered{display:none}}
@media(max-width:560px){section.band{padding:72px 0}}
