/* =========================================================
   NORTHCAP 共通スタイル
   ========================================================= */
:root{
  --black:#0c0b09;
  --coal:#161410;
  --panel:#1e1b15;
  --panel-2:#25211a;
  --gold:#b3a269;
  --gold-bright:#d8c68f;
  --line:rgba(179,162,105,.25);
  --line-soft:rgba(179,162,105,.13);
  --white:#f5f1e6;
  --muted:#9b937e;
  --lose:#8d8577;
  --en:"Oswald", sans-serif;
  --jp:"Noto Sans JP", sans-serif;
  --wrap:1120px;
}
*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:72px; }
body{
  background:var(--black); color:var(--white);
  font-family:var(--jp); line-height:1.9; font-size:15px;
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"palt";
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; }
.num-font{ font-family:var(--en); font-variant-numeric:tabular-nums; }

/* ===== ヘッダー ===== */
.site-header{
  position:fixed; inset:0 0 auto; z-index:50;
  background:rgba(12,11,9,.82); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  max-width:var(--wrap); margin:0 auto; padding:0 20px;
  display:flex; align-items:center; justify-content:space-between; height:64px;
}
.wordmark{
  font-family:var(--en); font-style:italic; font-weight:700;
  font-size:24px; letter-spacing:.04em; color:var(--white);
}
.wordmark span{ color:var(--gold); }
.gnav{ display:flex; align-items:center; gap:26px; }
.gnav a{
  position:relative;
  font-family:var(--en); font-weight:500; font-size:14px; letter-spacing:.14em;
  color:var(--muted); transition:color .2s; text-transform:uppercase;
}
.gnav a:hover, .gnav a.is-current{ color:var(--gold-bright); }
.gnav a.is-current::after{
  content:""; position:absolute; left:0; right:.14em; bottom:-6px; height:2px; background:var(--gold);
}
.gnav .nav-cta{
  color:var(--black); background:var(--gold-bright); padding:6px 16px; border-radius:3px;
}
.gnav .nav-cta:hover{ color:var(--black); background:var(--white); }
.menu-button{ display:none; }

/* ===== 共通セクション ===== */
.section{ padding:96px 20px; position:relative; }
.section.is-alt{ background:var(--coal); border-block:1px solid var(--line); }
.section-inner{ max-width:var(--wrap); margin:0 auto; }
.sec-head{ margin-bottom:44px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.sec-en{
  font-family:var(--en); font-style:italic; font-weight:700;
  font-size:clamp(34px,5.5vw,56px); line-height:1; letter-spacing:.02em;
}
.sec-en::after{
  content:""; display:block; width:64px; height:3px; margin-top:14px;
  background:repeating-linear-gradient(115deg, var(--gold) 0 6px, transparent 6px 10px);
}
.sec-jp{ margin-top:12px; font-weight:700; letter-spacing:.18em; color:var(--gold-bright); font-size:13px; }
.more-link{
  font-family:var(--en); font-weight:500; font-size:13px; letter-spacing:.18em; color:var(--gold-bright);
  display:inline-flex; align-items:center; gap:10px; padding-bottom:4px; border-bottom:1px solid var(--line);
  transition:gap .2s, border-color .2s;
}
.more-link::after{ content:"→"; font-family:var(--jp); }
.more-link:hover{ gap:16px; border-color:var(--gold); }
.note{ margin-top:20px; font-size:12px; color:var(--muted); letter-spacing:.06em; }

.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
.reveal.is-in{ opacity:1; transform:none; }

/* ===== 下層ページの見出し ===== */
.page-hero{
  position:relative; min-height:clamp(320px, 52vh, 480px);
  display:flex; align-items:flex-end; overflow:hidden; padding:120px 20px 56px;
}
.page-hero-bg{
  position:absolute; inset:0; background-size:cover; background-repeat:no-repeat;
  animation:heroZoom 14s ease-out forwards;
}
.page-hero::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(12,11,9,.6), rgba(12,11,9,.5) 40%, var(--black) 98%);
}
.page-hero-inner{ position:relative; z-index:2; max-width:var(--wrap); margin:0 auto; width:100%; }
.page-hero .crumb{ font-family:var(--en); font-size:12px; letter-spacing:.2em; color:var(--muted); }
.page-hero .crumb a:hover{ color:var(--gold-bright); }
.page-hero h1{
  font-family:var(--en); font-style:italic; font-weight:700;
  font-size:clamp(52px,9vw,104px); line-height:1; letter-spacing:.01em; margin-top:10px;
  text-shadow:0 6px 40px rgba(0,0,0,.6);
}
.page-hero .lead{ margin-top:12px; font-weight:700; letter-spacing:.2em; color:var(--gold-bright); font-size:14px; }
@keyframes heroZoom{ from{ transform:scale(1.08);} to{ transform:scale(1);} }

/* ===== 成績バー ===== */
.record-bar{ background:var(--coal); border-block:1px solid var(--line); padding:26px 20px; }
.record-inner{
  max-width:var(--wrap); margin:0 auto;
  display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:14px 56px;
}
.record-season{
  font-family:var(--en); font-weight:500; font-size:12px; letter-spacing:.3em; color:var(--muted);
  writing-mode:horizontal-tb; border-right:1px solid var(--line); padding-right:40px; line-height:1.5;
}
.record-season b{ display:block; font-size:22px; font-style:italic; letter-spacing:.06em; color:var(--white); }
.record-item{ text-align:center; }
.record-item .num{
  font-family:var(--en); font-style:italic; font-weight:700; font-size:46px; line-height:1.1;
  color:var(--gold-bright); font-variant-numeric:tabular-nums;
}
.record-item .label{ font-size:11.5px; font-weight:700; letter-spacing:.2em; color:var(--muted); }

/* ===== 試合行 ===== */
.game-list{ display:grid; gap:10px; }
.sched-month{
  font-family:var(--en); font-style:italic; font-weight:700; font-size:22px;
  color:var(--gold); margin:34px 0 4px; letter-spacing:.04em;
  display:flex; align-items:baseline; gap:14px;
}
.sched-month small{ font-family:var(--jp); font-style:normal; font-size:11.5px; font-weight:700; color:var(--muted); letter-spacing:.1em; }
.sched-month:first-child{ margin-top:0; }
.game-row{
  display:grid; grid-template-columns:86px 1fr auto; gap:6px 22px; align-items:center;
  background:var(--panel); border:1px solid var(--line); border-radius:8px;
  padding:14px 22px; position:relative; overflow:hidden;
  transition:transform .2s, border-color .2s;
}
.game-row::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:transparent; }
.game-row.is-W::before{ background:var(--gold-bright); }
.game-row.is-L::before, .game-row.is-FL::before{ background:#4a453b; }
.game-row.is-D::before{ background:var(--muted); }
.game-row:hover{ transform:translateX(4px); border-color:var(--gold); }
.game-date{ font-family:var(--en); font-weight:700; font-style:italic; font-size:24px; line-height:1.15; }
.game-date small{ display:block; font-family:var(--jp); font-style:normal; font-weight:700; font-size:10.5px; color:var(--muted); letter-spacing:.12em; }
.game-info b{ font-size:16px; letter-spacing:.04em; }
.game-info .meta{ font-size:12px; color:var(--muted); letter-spacing:.06em; display:flex; flex-wrap:wrap; gap:4px 10px; align-items:center; }
.kind-tag{
  font-size:10px; font-weight:700; letter-spacing:.12em; border-radius:3px; padding:0 7px; line-height:1.8;
  border:1px solid var(--gold); color:var(--gold-bright);
}
.kind-tag.is-practice{ border-color:var(--line); color:var(--muted); }
.game-stats{ font-size:11px; color:#7f7866; letter-spacing:.06em; }
.game-result{
  font-family:var(--en); font-style:italic; font-weight:700; font-size:22px; text-align:right;
  letter-spacing:.04em; white-space:nowrap; font-variant-numeric:tabular-nums;
}
.game-result .mark{ font-size:12px; letter-spacing:.2em; margin-right:8px; vertical-align:2px; }
.game-result .W{ color:var(--gold-bright); }
.game-result .L, .game-result .FL{ color:var(--lose); }
.game-result .D, .game-result .NG{ color:var(--white); }
.game-result .text{ font-family:var(--jp); font-style:normal; font-size:13px; letter-spacing:.1em; }
.upcoming{
  font-family:var(--jp); font-style:normal; font-size:11px; font-weight:700; letter-spacing:.16em;
  color:var(--black); background:var(--gold); border-radius:3px; padding:3px 10px;
}

/* ===== タブ（絞り込み） ===== */
.tabs{ display:flex; flex-wrap:wrap; gap:10px; margin-bottom:30px; }
.tabs button{
  font-family:var(--jp); font-weight:700; font-size:12.5px; letter-spacing:.1em;
  color:var(--white); cursor:pointer; transition:all .2s;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.16); border-radius:999px;
  padding:7px 20px; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
}
.tabs button:hover{ border-color:var(--gold-bright); }
.tabs button.is-on{ color:var(--black); background:var(--gold-bright); border-color:var(--gold-bright); }
.tabs button .count{ font-family:var(--en); font-weight:500; margin-left:6px; opacity:.7; }

/* ===== 選手カード（ガラス） ===== */
.glass-stage{ overflow:hidden; }
.glass-stage::before{
  content:""; position:absolute; inset:0; z-index:0;
  background:var(--stage-photo) center/cover no-repeat;
  filter:blur(26px) brightness(.4) saturate(.9);
  transform:scale(1.15);
}
.glass-stage::after{
  content:""; position:absolute; z-index:0; pointer-events:none;
  width:640px; height:640px; left:-180px; top:-120px; border-radius:50%;
  background:radial-gradient(circle, rgba(216,198,143,.22), transparent 65%);
}
.glass-stage .glow-b{
  position:absolute; z-index:0; pointer-events:none;
  width:560px; height:560px; right:-160px; bottom:-140px; border-radius:50%;
  background:radial-gradient(circle, rgba(179,162,105,.18), transparent 65%);
}
.glass-stage .section-inner{ position:relative; z-index:1; }

.player-grid{ display:grid; grid-template-columns:repeat(auto-fill, minmax(210px,1fr)); gap:18px; }
.player-card{
  position:relative; border-radius:18px; overflow:hidden;
  background:linear-gradient(155deg, rgba(255,255,255,.13), rgba(255,255,255,.04) 55%);
  border:1px solid rgba(216,198,143,.32);
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 18px 44px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .25s, border-color .25s, box-shadow .25s;
  animation:cardIn .5s ease both;
}
@keyframes cardIn{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }
.player-card::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:1;
  background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.14) 46%, transparent 60%);
  transform:translateX(-100%); transition:transform .7s ease;
}
.player-card:hover{
  transform:translateY(-8px); border-color:var(--gold-bright);
  box-shadow:0 26px 60px rgba(0,0,0,.55), 0 0 24px rgba(216,198,143,.18), inset 0 1px 0 rgba(255,255,255,.28);
}
.player-card:hover::before{ transform:translateX(100%); }
/* 名前が主役のプレート（写真が入るまで） */
.plate{
  aspect-ratio:5/4; position:relative; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:18px 20px 16px;
  background:radial-gradient(120% 95% at 0% 0%, rgba(216,198,143,.16), transparent 70%);
  border-bottom:1px solid rgba(255,255,255,.1);
}
.plate .stripes{
  position:absolute; inset:0; opacity:.06; pointer-events:none;
  background:repeating-linear-gradient(90deg, #fff 0 1px, transparent 1px 14px);
}
/* 背番号はうしろにうすく */
.plate .plate-num{
  position:absolute; right:-6px; top:-8px; z-index:0;
  font-family:var(--en); font-style:italic; font-weight:700; line-height:1;
  font-size:clamp(110px, 12vw, 150px); letter-spacing:-.03em;
  color:transparent; -webkit-text-stroke:1.2px rgba(216,198,143,.28);
  transition:-webkit-text-stroke-color .3s, transform .5s;
}
.player-card:hover .plate-num{ -webkit-text-stroke-color:rgba(216,198,143,.5); transform:translateX(-4px); }
.plate .role-badge{
  position:absolute; top:14px; left:20px; z-index:2;
  font-size:10.5px; font-weight:900; letter-spacing:.14em; color:var(--black);
  background:var(--gold-bright); border-radius:3px; padding:1px 9px;
}
.plate .plate-name{
  position:relative; z-index:1; line-height:1.2; white-space:nowrap;
  font-size:clamp(24px, 2.3vw, 30px); font-weight:900; letter-spacing:.08em;
}
.plate .fam{ color:var(--white); }
.plate .given{ color:var(--gold-bright); margin-left:.3em; }
.plate .plate-rule{
  position:relative; z-index:1; display:block; width:36px; height:2px; margin-top:12px;
  background:repeating-linear-gradient(115deg, var(--gold) 0 5px, transparent 5px 8px);
  transition:width .4s;
}
.player-card:hover .plate-rule{ width:64px; }
.player-body{ padding:14px 20px 16px; position:relative; z-index:2; }
.player-body .p-pos{ font-size:11px; font-weight:700; letter-spacing:.14em; color:var(--gold-bright); }
.player-body .p-meta{
  display:flex; justify-content:space-between; align-items:center;
  font-size:11.5px; color:#c9c2ae; margin-top:6px; letter-spacing:.04em;
}
.player-body .p-meta .no{ font-family:var(--en); color:var(--gold-bright); letter-spacing:.1em; font-size:13px; }
.player-card.is-staff .plate{ aspect-ratio:16/9; }

/* ===== 表 ===== */
.table-scroll{
  overflow-x:auto; border:1px solid var(--line); border-radius:10px; background:var(--panel);
  -webkit-overflow-scrolling:touch;
}
.data-table{ width:100%; border-collapse:collapse; font-size:13.5px; white-space:nowrap; font-variant-numeric:tabular-nums; }
.data-table th, .data-table td{ padding:12px 14px; text-align:right; border-bottom:1px solid var(--line-soft); }
.data-table thead th{
  font-size:11px; font-weight:700; letter-spacing:.1em; color:var(--gold-bright);
  background:var(--panel-2); border-bottom:1px solid var(--line);
}
.data-table th:first-child, .data-table td:first-child{
  text-align:left; position:sticky; left:0; background:inherit; z-index:1;
}
.data-table tbody tr{ background:var(--panel); }
.data-table tbody td:first-child{ font-family:var(--en); font-weight:700; font-style:italic; font-size:16px; letter-spacing:.04em; }
.data-table tbody tr.is-total{ background:var(--panel-2); }
.data-table tbody tr.is-total td{ border-bottom:none; color:var(--gold-bright); font-weight:700; }
.data-table tbody tr:last-child td{ border-bottom:none; }
.data-table td.hl{ color:var(--gold-bright); font-weight:700; }
.scroll-hint-text{ display:none; font-size:11px; color:var(--muted); margin-top:8px; letter-spacing:.08em; }

/* ===== 募集・CTA ===== */
.join{
  background:
    linear-gradient(rgba(12,11,9,.78), rgba(12,11,9,.86)),
    url("../img/photos/0803.webp") center 35%/cover no-repeat fixed;
  text-align:center;
}
.join h2{ font-family:var(--en); font-style:italic; font-weight:700; font-size:clamp(30px,5vw,48px); letter-spacing:.02em; }
.join p{ margin-top:14px; color:var(--white); font-size:14px; letter-spacing:.08em; }
.join-btn{
  display:inline-block; margin-top:30px;
  font-weight:900; letter-spacing:.16em; font-size:14px; color:var(--black);
  background:linear-gradient(120deg, var(--gold-bright), var(--gold));
  padding:16px 52px; border-radius:4px;
  transition:transform .2s, box-shadow .2s;
  box-shadow:0 8px 26px rgba(179,162,105,.25);
}
.join-btn:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(179,162,105,.4); }

/* ===== フッター ===== */
.site-footer{ border-top:1px solid var(--line); padding:44px 20px 60px; text-align:center; }
.site-footer .wordmark{ font-size:28px; }
.site-footer nav{ display:flex; justify-content:center; gap:24px; margin:20px 0 26px; flex-wrap:wrap; }
.site-footer nav a{ font-family:var(--en); font-size:12px; letter-spacing:.16em; color:var(--muted); text-transform:uppercase; }
.site-footer nav a:hover{ color:var(--gold-bright); }
.site-footer small{ color:var(--muted); font-size:11px; letter-spacing:.1em; }

/* ===== レスポンシブ ===== */
@media (max-width:860px){
  .gnav{
    position:fixed; inset:64px 0 auto; flex-direction:column; align-items:stretch; gap:0;
    background:rgba(12,11,9,.97); border-bottom:1px solid var(--line);
    display:none; padding:10px 0 18px;
  }
  .gnav.is-open{ display:flex; }
  .gnav a{ padding:13px 28px; }
  .gnav a.is-current::after{ left:16px; right:auto; top:50%; bottom:auto; width:4px; height:4px; border-radius:50%; transform:translateY(-50%); }
  .gnav .nav-cta{ margin:10px 28px 0; text-align:center; }
  .menu-button{
    display:block; background:none; border:1px solid var(--line); border-radius:6px;
    color:var(--gold-bright); font-family:var(--en); font-size:11px; letter-spacing:.2em;
    padding:8px 14px; cursor:pointer;
  }
}
@media (max-width:760px){
  .section{ padding:72px 16px; }
  .game-row{ grid-template-columns:64px 1fr; padding:14px 16px; }
  .game-result{ grid-column:2; text-align:left; font-size:20px; }
  .game-date{ font-size:20px; }
  .record-inner{ gap:10px 28px; }
  .record-season{ border-right:none; padding-right:0; width:100%; text-align:center; }
  .record-item .num{ font-size:38px; }
  .player-grid{ grid-template-columns:repeat(2, 1fr); gap:12px; }
  .player-body{ padding:12px 14px 14px; }
  .plate{ padding:14px 14px 12px; aspect-ratio:1/1; }
  .player-card.is-staff .plate{ aspect-ratio:1/1; }
  .plate .plate-num{ font-size:96px; }
  .plate .plate-name{ font-size:clamp(17px, 5.2vw, 21px); letter-spacing:.04em; }
  .plate .role-badge{ top:11px; left:14px; font-size:9.5px; padding:0 7px; }
  .player-body .p-meta{ flex-direction:column; align-items:flex-start; gap:0; }
  .join{ background-attachment:scroll; }
  .scroll-hint-text{ display:block; }
}
@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; }
  .reveal{ opacity:1; transform:none; transition:none; }
}
