/* ===========================================================
   DoraSPA — 八王子メンズエステ 高級リラクゼーション
   Dark navy + champagne gold luxury theme
   =========================================================== */

/* ---------- Tokens ---------- */
:root {
  /* Type scale (fluid) */
  --text-xs: clamp(0.75rem, 0.7rem + 0.25vw, 0.85rem);
  --text-sm: clamp(0.85rem, 0.8rem + 0.25vw, 0.95rem);
  --text-base: clamp(1rem, 0.96rem + 0.2vw, 1.075rem);
  --text-lg: clamp(1.125rem, 1rem + 0.6vw, 1.4rem);
  --text-xl: clamp(1.5rem, 1.2rem + 1.25vw, 2.1rem);
  --text-2xl: clamp(2rem, 1.3rem + 2.4vw, 3.2rem);
  --text-3xl: clamp(2.4rem, 1.2rem + 4vw, 4.4rem);

  /* Spacing */
  --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem;
  --space-4: 1rem; --space-5: 1.25rem; --space-6: 1.5rem;
  --space-8: 2rem; --space-10: 2.5rem; --space-12: 3rem;
  --space-16: 4rem; --space-20: 5rem; --space-24: 6rem; --space-32: 8rem;

  /* Surfaces — deep navy */
  --color-bg: #0c1020;
  --color-surface: #11162b;
  --color-surface-2: #161c36;
  --color-surface-offset: #1c2440;
  --color-border: #2a3358;
  --color-divider: #1e2542;

  /* Text */
  --color-text: #ece8df;
  --color-text-muted: #a6a99d;
  --color-text-faint: #6f7589;
  --color-text-inverse: #0c1020;

  /* Gold / champagne accent */
  --color-gold: #c8a45c;
  --color-gold-bright: #e3c585;
  --color-gold-deep: #9c7c3c;
  --color-gold-glow: rgba(200,164,92,0.18);

  /* Bordeaux secondary */
  --color-wine: #7a2438;

  --radius-sm: 4px; --radius-md: 8px; --radius-lg: 14px; --radius-full: 999px;
  --transition: 220ms cubic-bezier(0.16,1,0.3,1);
  --shadow-md: 0 8px 28px rgba(0,0,0,0.45);
  --shadow-lg: 0 18px 48px rgba(0,0,0,0.55);

  --content-narrow: 680px;
  --content-default: 1020px;
  --content-wide: 1240px;

  --font-display: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --font-body: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
}

/* ---------- Base ---------- */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html {
  -webkit-text-size-adjust:none; text-size-adjust:none;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility; scroll-behavior:smooth;
  scroll-padding-top:84px;
}
body {
  min-height:100dvh; line-height:1.75;
  font-family:var(--font-body); font-size:var(--text-base);
  color:var(--color-text); background:var(--color-bg);
  overflow-x:hidden;
}
img,picture,video,svg { display:block; max-width:100%; height:auto; }
ul[role=list],ol[role=list] { list-style:none; }
a { color:inherit; text-decoration:none; }
h1,h2,h3,h4 { line-height:1.3; font-weight:600; font-family:var(--font-display); }
p,li { text-wrap:pretty; }
::selection { background:var(--color-gold-glow); color:var(--color-gold-bright); }
:focus-visible { outline:2px solid var(--color-gold); outline-offset:3px; border-radius:var(--radius-sm); }
button { cursor:pointer; background:none; border:none; color:inherit; font:inherit; }
table { border-collapse:collapse; width:100%; }
a,button { transition:color var(--transition),background var(--transition),border-color var(--transition),box-shadow var(--transition),opacity var(--transition); }
@media (prefers-reduced-motion:reduce){ *{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important;} }
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ---------- Layout helpers ---------- */
.container { width:100%; max-width:var(--content-wide); margin-inline:auto; padding-inline:clamp(1.1rem,4vw,2.5rem); }
.container--default { max-width:var(--content-default); }
.container--narrow { max-width:var(--content-narrow); }
.section { padding-block:clamp(var(--space-16),9vw,var(--space-32)); }
.section--tight { padding-block:clamp(var(--space-12),6vw,var(--space-20)); }

.eyebrow {
  font-family:var(--font-body); font-size:var(--text-xs); letter-spacing:.32em;
  text-transform:uppercase; color:var(--color-gold);
  display:inline-flex; align-items:center; gap:.6rem; font-weight:600;
}
.eyebrow::before { content:""; width:28px; height:1px; background:var(--color-gold); display:inline-block; }
.section-title { font-size:var(--text-xl); margin-top:var(--space-3); letter-spacing:.04em; }
.section-lead { color:var(--color-text-muted); margin-top:var(--space-4); max-width:60ch; }
.gold { color:var(--color-gold-bright); }
.muted { color:var(--color-text-muted); }

/* ---------- Buttons ---------- */
.btn {
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--font-body); font-size:var(--text-sm); font-weight:600;
  letter-spacing:.05em; padding:.9rem 1.8rem; border-radius:var(--radius-full);
  border:1px solid transparent; white-space:nowrap;
}
.btn--gold {
  background:linear-gradient(135deg,var(--color-gold-bright),var(--color-gold-deep));
  color:#1a1407;
}
.btn--gold:hover { filter:brightness(1.08); box-shadow:0 0 24px var(--color-gold-glow); transform:translateY(-1px); }
.btn--ghost { border-color:var(--color-border); color:var(--color-text); }
.btn--ghost:hover { border-color:var(--color-gold); color:var(--color-gold-bright); }
.btn--lg { padding:1.05rem 2.4rem; font-size:var(--text-base); }

/* ---------- Header ---------- */
.site-header {
  position:sticky; top:0; z-index:60;
  background:rgba(12,16,32,0.82); backdrop-filter:blur(14px);
  border-bottom:1px solid var(--color-divider);
}
.nav { display:flex; align-items:center; justify-content:space-between; height:72px; gap:var(--space-4); }
.brand { display:flex; align-items:center; gap:.7rem; color:var(--color-text); }
.brand svg { color:var(--color-gold); }
.brand-name { font-family:var(--font-display); font-size:1.2rem; letter-spacing:.18em; font-weight:600; }
.brand-name small { display:block; font-family:var(--font-body); font-size:.55rem; letter-spacing:.3em; color:var(--color-text-faint); text-transform:uppercase; }
.nav-links { display:flex; align-items:center; gap:var(--space-4); list-style:none; }
.nav-links a { white-space:nowrap; }
.nav-links a { font-size:var(--text-sm); color:var(--color-text-muted); letter-spacing:.06em; position:relative; padding-block:.4rem; }
.nav-links a:hover,.nav-links a[aria-current=page] { color:var(--color-gold-bright); }
.nav-links a[aria-current=page]::after { content:""; position:absolute; left:0; bottom:0; width:100%; height:1px; background:var(--color-gold); }
.nav-cta { display:flex; align-items:center; gap:var(--space-4); }
.nav-tel { display:inline-flex; flex-direction:column; line-height:1.2; text-align:right; }
.nav-tel span { font-size:.6rem; letter-spacing:.25em; color:var(--color-text-faint); text-transform:uppercase; }
.nav-tel strong { font-family:var(--font-display); font-size:1.05rem; color:var(--color-gold-bright); letter-spacing:.04em; white-space:nowrap; }
.nav-tel span { white-space:nowrap; }
.nav-toggle { display:none; width:42px; height:42px; align-items:center; justify-content:center; border:1px solid var(--color-border); border-radius:var(--radius-sm); color:var(--color-text); }

@media (max-width:1100px){
  .nav-links,.nav-tel { display:none; }
  .nav-toggle { display:inline-flex; }
  .nav-links.open {
    display:flex; position:absolute; top:72px; left:0; right:0; flex-direction:column;
    background:var(--color-surface); border-bottom:1px solid var(--color-divider);
    padding:var(--space-4) var(--space-6) var(--space-8); gap:var(--space-4); align-items:flex-start;
  }
  .nav-links.open a { font-size:var(--text-base); }
}

/* ---------- Hero ---------- */
.hero { position:relative; min-height:clamp(560px,82vh,760px); display:flex; align-items:center; overflow:hidden; }
.hero-bg { position:absolute; inset:0; z-index:0; }
.hero-bg img { width:100%; height:100%; object-fit:cover; }
.hero-bg::after {
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(8,11,24,.92) 0%,rgba(8,11,24,.7) 45%,rgba(8,11,24,.4) 100%);
}
.hero-inner { position:relative; z-index:1; max-width:720px; }
.hero h1 { font-size:clamp(1.9rem,1.0rem+2.7vw,3rem); letter-spacing:.03em; line-height:1.45; word-break:keep-all; overflow-wrap:break-word; }
.hero h1 .accent { color:var(--color-gold-bright); }
.hero-sub { margin-top:var(--space-5); font-size:var(--text-lg); color:var(--color-text); font-family:var(--font-display); letter-spacing:.05em; }
.hero-desc { margin-top:var(--space-5); color:var(--color-text-muted); max-width:46ch; }
.hero-actions { margin-top:var(--space-8); display:flex; flex-wrap:wrap; gap:var(--space-4); }
.hero-meta { margin-top:var(--space-8); display:flex; flex-wrap:wrap; gap:var(--space-6); font-size:var(--text-sm); color:var(--color-text-muted); }
.hero-meta div { display:flex; flex-direction:column; }
.hero-meta strong { color:var(--color-gold-bright); font-family:var(--font-display); font-size:var(--text-base); }

/* ---------- Page hero (interior) ---------- */
.page-hero { position:relative; padding-block:clamp(var(--space-16),12vw,var(--space-32)) clamp(var(--space-12),8vw,var(--space-20)); overflow:hidden; border-bottom:1px solid var(--color-divider); }
.page-hero::before { content:""; position:absolute; inset:0; background:radial-gradient(120% 100% at 80% 0%,var(--color-gold-glow),transparent 60%); z-index:0; }
.page-hero .container { position:relative; z-index:1; }
.page-hero h1 { font-size:var(--text-2xl); margin-top:var(--space-3); letter-spacing:.04em; }
.page-hero p { margin-top:var(--space-4); color:var(--color-text-muted); max-width:62ch; }

/* ---------- Breadcrumb ---------- */
.breadcrumb { font-size:var(--text-xs); color:var(--color-text-faint); padding-block:var(--space-4); letter-spacing:.05em; }
.breadcrumb a:hover { color:var(--color-gold); }
.breadcrumb span { margin-inline:.5rem; }

/* ---------- Cards / grid ---------- */
.grid { display:grid; gap:var(--space-6); }
.grid-2 { grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.grid-3 { grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.grid-4 { grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); }

.card { background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg); padding:var(--space-8); }
.card--feature { position:relative; overflow:hidden; }
.card h3 { font-size:var(--text-lg); color:var(--color-gold-bright); margin-bottom:var(--space-3); }
.card p { color:var(--color-text-muted); font-size:var(--text-sm); }

/* concept split */
.split { display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(var(--space-8),5vw,var(--space-20)); align-items:center; }
.split.reverse .split-media { order:-1; }
.split-media img { border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); border:1px solid var(--color-border); }
@media (max-width:780px){ .split { grid-template-columns:1fr; } .split.reverse .split-media{ order:0; } }

/* ---------- Therapist cards ---------- */
.therapist-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:var(--space-6); }
.t-card { background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg); overflow:hidden; display:flex; flex-direction:column; }
.t-card:hover { border-color:var(--color-gold-deep); transform:translateY(-3px); box-shadow:var(--shadow-md); }
.t-photo { position:relative; aspect-ratio:3/4; overflow:hidden; background:var(--color-surface-2); }
.t-photo img { width:100%; height:100%; object-fit:cover; opacity:.92; }
.t-area { position:absolute; top:.7rem; left:.7rem; font-size:var(--text-xs); background:rgba(12,16,32,.78); color:var(--color-gold-bright); padding:.25rem .6rem; border-radius:var(--radius-full); letter-spacing:.08em; border:1px solid var(--color-gold-deep); }
.t-body { padding:var(--space-5); display:flex; flex-direction:column; gap:.5rem; flex:1; }
.t-name { font-family:var(--font-display); font-size:var(--text-lg); color:var(--color-text); }
.t-name small { font-family:var(--font-body); font-size:var(--text-xs); color:var(--color-text-faint); margin-left:.4rem; letter-spacing:.08em; }
.t-spec { font-size:var(--text-xs); color:var(--color-gold); letter-spacing:.06em; }
.t-catch { font-size:var(--text-sm); color:var(--color-text-muted); line-height:1.6; }

/* ---------- Price table ---------- */
.price-table { width:100%; margin-top:var(--space-6); border:1px solid var(--color-divider); border-radius:var(--radius-lg); overflow:hidden; }
.price-table caption { text-align:left; font-family:var(--font-display); color:var(--color-gold-bright); font-size:var(--text-lg); padding:var(--space-5) var(--space-6); background:var(--color-surface-offset); }
.price-table th,.price-table td { padding:var(--space-4) var(--space-6); text-align:left; border-bottom:1px solid var(--color-divider); font-size:var(--text-sm); }
.price-table thead th { background:var(--color-surface-2); color:var(--color-gold); font-weight:600; letter-spacing:.06em; }
.price-table tbody tr:nth-child(even) { background:var(--color-surface); }
.price-table td.price { color:var(--color-gold-bright); font-family:var(--font-display); font-size:var(--text-base); text-align:right; white-space:nowrap; }
.price-table tr:last-child td { border-bottom:none; }
.option-list { list-style:none; display:grid; gap:var(--space-3); margin-top:var(--space-6); }
.option-list li { display:flex; justify-content:space-between; gap:var(--space-4); padding:var(--space-4) var(--space-5); background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-md); font-size:var(--text-sm); }
.option-list .opt-name { color:var(--color-text); }
.option-list .opt-name b { color:var(--color-gold-bright); font-family:var(--font-display); display:block; }
.option-list .opt-price { color:var(--color-gold-bright); font-family:var(--font-display); white-space:nowrap; }

/* ---------- News ---------- */
.news-list { list-style:none; display:grid; gap:var(--space-2); }
.news-list li { display:flex; gap:var(--space-5); padding:var(--space-4) 0; border-bottom:1px solid var(--color-divider); align-items:baseline; flex-wrap:wrap; }
.news-date { font-size:var(--text-xs); color:var(--color-gold); letter-spacing:.06em; min-width:120px; }
.news-title { font-size:var(--text-sm); color:var(--color-text); }

/* ---------- Info table (店舗概要) ---------- */
.info-table th,.info-table td { padding:var(--space-4) var(--space-5); text-align:left; border-bottom:1px solid var(--color-divider); font-size:var(--text-sm); vertical-align:top; }
.info-table th { color:var(--color-gold); width:34%; font-weight:600; white-space:nowrap; }
.info-table td { color:var(--color-text-muted); }

/* ---------- FAQ ---------- */
.faq-list { display:grid; gap:var(--space-4); }
.faq-item { border:1px solid var(--color-divider); border-radius:var(--radius-md); background:var(--color-surface); overflow:hidden; }
.faq-item summary { list-style:none; cursor:pointer; padding:var(--space-5) var(--space-6); display:flex; gap:var(--space-4); align-items:flex-start; font-family:var(--font-display); color:var(--color-text); font-size:var(--text-base); }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::before { content:"Q"; color:var(--color-gold-bright); font-weight:700; font-size:var(--text-lg); flex-shrink:0; }
.faq-item summary::after { content:"+"; margin-left:auto; color:var(--color-gold); font-size:1.4rem; transition:transform var(--transition); }
.faq-item[open] summary::after { transform:rotate(45deg); }
.faq-answer { padding:0 var(--space-6) var(--space-5) calc(var(--space-6) + 1.5rem); color:var(--color-text-muted); font-size:var(--text-sm); }

/* ---------- CTA band ---------- */
.cta-band { position:relative; text-align:center; padding-block:clamp(var(--space-16),8vw,var(--space-24)); overflow:hidden; border-block:1px solid var(--color-divider); background:linear-gradient(180deg,var(--color-surface),var(--color-bg)); }
.cta-band::before { content:""; position:absolute; inset:0; background:radial-gradient(60% 100% at 50% 0%,var(--color-gold-glow),transparent 70%); }
.cta-band .container { position:relative; z-index:1; }
.cta-band h2 { font-size:var(--text-2xl); letter-spacing:.05em; }
.cta-band p { color:var(--color-text-muted); margin-top:var(--space-4); }
.cta-tel { display:inline-flex; flex-direction:column; margin-top:var(--space-8); }
.cta-tel span { font-size:var(--text-xs); letter-spacing:.25em; color:var(--color-text-faint); text-transform:uppercase; }
.cta-tel a { font-family:var(--font-display); font-size:var(--text-3xl); color:var(--color-gold-bright); letter-spacing:.06em; }
.cta-tel a:hover { filter:brightness(1.1); }
.cta-hours { margin-top:var(--space-2); font-size:var(--text-sm); color:var(--color-text-muted); }

/* ---------- Map ---------- */
.map-wrap { border-radius:var(--radius-lg); overflow:hidden; border:1px solid var(--color-border); box-shadow:var(--shadow-md); }
.map-wrap iframe { width:100%; height:420px; border:0; display:block; filter:grayscale(.25) contrast(1.05); }

/* access steps */
.steps { list-style:none; counter-reset:step; display:grid; gap:var(--space-4); margin-top:var(--space-5); }
.steps li { counter-increment:step; display:flex; gap:var(--space-4); align-items:flex-start; font-size:var(--text-sm); color:var(--color-text-muted); }
.steps li::before { content:counter(step); flex-shrink:0; width:30px; height:30px; border-radius:var(--radius-full); border:1px solid var(--color-gold-deep); color:var(--color-gold-bright); display:grid; place-items:center; font-family:var(--font-display); font-size:var(--text-sm); }

/* ---------- Footer ---------- */
.site-footer { background:var(--color-surface); border-top:1px solid var(--color-divider); padding-block:var(--space-16) var(--space-8); }
.footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:var(--space-10); }
.footer-brand .brand-name { margin-bottom:var(--space-3); }
.footer-brand p { color:var(--color-text-muted); font-size:var(--text-sm); max-width:36ch; }
.footer-col h4 { font-size:var(--text-sm); color:var(--color-gold); letter-spacing:.1em; margin-bottom:var(--space-4); font-family:var(--font-body); }
.footer-col ul { list-style:none; display:grid; gap:var(--space-3); }
.footer-col a { font-size:var(--text-sm); color:var(--color-text-muted); }
.footer-col a:hover { color:var(--color-gold-bright); }
.footer-group { margin-top:var(--space-2); }
.footer-bottom { margin-top:var(--space-12); padding-top:var(--space-6); border-top:1px solid var(--color-divider); display:flex; justify-content:space-between; flex-wrap:wrap; gap:var(--space-4); font-size:var(--text-xs); color:var(--color-text-faint); }
@media (max-width:980px){ .footer-grid { grid-template-columns:1fr 1fr; } .footer-brand { grid-column:1/-1; } }
@media (max-width:520px){ .footer-grid { grid-template-columns:1fr; } }

/* ---------- Pickup ---------- */
.pickup-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:var(--space-6); }

/* ---------- Reveal animation ---------- */
.reveal { opacity:0; transform:translateY(20px); transition:opacity .7s ease,transform .7s cubic-bezier(0.16,1,0.3,1); }
.reveal.in { opacity:1; transform:none; }

/* ---------- Prose (guide/column long-form) ---------- */
.prose { max-width:74ch; }
.prose h2 { font-size:var(--text-xl); color:var(--color-gold-bright); margin-top:var(--space-12); margin-bottom:var(--space-4); letter-spacing:.03em; scroll-margin-top:90px; }
.prose h3 { font-size:var(--text-lg); color:var(--color-text); margin-top:var(--space-8); margin-bottom:var(--space-3); }
.prose p { color:var(--color-text-muted); margin-bottom:var(--space-5); }
.prose ul,.prose ol { color:var(--color-text-muted); margin:0 0 var(--space-5) 1.3em; display:grid; gap:var(--space-2); }
.prose li { font-size:var(--text-base); }
.prose strong { color:var(--color-text); }
.prose .gold { color:var(--color-gold-bright); }

/* ---------- Anchor / table of contents ---------- */
.toc { background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg); padding:var(--space-6) var(--space-8); margin-bottom:var(--space-10); }
.toc h2 { font-size:var(--text-base); color:var(--color-gold); margin:0 0 var(--space-3); font-family:var(--font-body); letter-spacing:.08em; }
.toc ul { list-style:none; display:grid; gap:var(--space-2); margin:0; }
.toc a { font-size:var(--text-sm); color:var(--color-text-muted); }
.toc a:hover { color:var(--color-gold-bright); }
.toc a::before { content:"›"; color:var(--color-gold); margin-right:.5rem; }

/* ---------- Area blocks ---------- */
.area-block { border:1px solid var(--color-divider); border-radius:var(--radius-lg); background:var(--color-surface); padding:var(--space-8); margin-bottom:var(--space-6); scroll-margin-top:90px; }
.area-block h2 { font-size:var(--text-lg); color:var(--color-gold-bright); margin-bottom:var(--space-3); }
.area-block .area-meta { font-size:var(--text-xs); color:var(--color-gold); letter-spacing:.06em; margin-bottom:var(--space-4); }
.area-block p { color:var(--color-text-muted); font-size:var(--text-sm); }
.area-block ul { list-style:none; display:grid; gap:var(--space-2); margin-top:var(--space-4); }
.area-block ul li { font-size:var(--text-sm); color:var(--color-text-muted); padding-left:1.2em; position:relative; }
.area-block ul li::before { content:"◆"; color:var(--color-gold-deep); position:absolute; left:0; font-size:.7em; top:.35em; }

/* ---------- Reasons / numbered list ---------- */
.reason-list { list-style:none; counter-reset:rs; display:grid; gap:var(--space-5); margin-top:var(--space-6); }
.reason-list li { counter-increment:rs; display:flex; gap:var(--space-5); align-items:flex-start; padding:var(--space-6); background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg); }
.reason-list li::before { content:counter(rs,decimal-leading-zero); flex-shrink:0; font-family:var(--font-display); font-size:var(--text-xl); color:var(--color-gold-bright); line-height:1; }
.reason-list h3 { font-size:var(--text-base); color:var(--color-text); margin-bottom:var(--space-2); }
.reason-list p { font-size:var(--text-sm); color:var(--color-text-muted); margin:0; }

/* ---------- Compare table ---------- */
.compare-table th,.compare-table td { padding:var(--space-4) var(--space-5); text-align:left; border-bottom:1px solid var(--color-divider); font-size:var(--text-sm); vertical-align:top; }
.compare-table thead th { background:var(--color-surface-2); color:var(--color-gold); letter-spacing:.05em; }
.compare-table th[scope=row] { color:var(--color-gold); width:32%; }
.compare-table td { color:var(--color-text-muted); }
.compare-table { border:1px solid var(--color-divider); border-radius:var(--radius-lg); overflow:hidden; margin-top:var(--space-6); }

/* ---------- Recruit ---------- */
.recruit-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:var(--space-5); margin-top:var(--space-8); }
.recruit-stat { background:var(--color-surface); border:1px solid var(--color-divider); border-radius:var(--radius-lg); padding:var(--space-6); text-align:center; }
.recruit-stat strong { display:block; font-family:var(--font-display); font-size:var(--text-xl); color:var(--color-gold-bright); letter-spacing:.03em; }
.recruit-stat span { font-size:var(--text-xs); color:var(--color-text-muted); letter-spacing:.06em; }

/* ---------- Misc ---------- */
.note { font-size:var(--text-xs); color:var(--color-text-faint); margin-top:var(--space-4); }
.tag-row { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:var(--space-5); }
.tag { font-size:var(--text-xs); border:1px solid var(--color-border); color:var(--color-text-muted); padding:.35rem .8rem; border-radius:var(--radius-full); letter-spacing:.05em; }