/* ============================================================
   wester-point-site — site.css  (editorial / magazine)
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@400;500;600;700&family=Noto+Sans+JP:wght@300;400;500;700&family=EB+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Inter:wght@400;500;600&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body { overflow-x: hidden; }
img, svg { max-width: 100%; display: block; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
a { color: inherit; text-decoration: none; }

:root {
  --ink-0:#FBFAF7; --ink-50:#F4F2ED; --ink-100:#E8E4DB; --ink-200:#D8D2C4;
  --ink-300:#B8B0A0; --ink-400:#8A8374; --ink-600:#56524A; --ink-800:#2B2824; --ink-900:#1A1815;
  --accent-50:#E8ECF2; --accent-500:#2E4B6E; --accent-700:#1F3550;
  --st-avail-fg:#3F7A4F; --st-avail-bg:#E8F1EA;
  --st-few-fg:#B87B20; --st-few-bg:#F6ECD8;
  --st-full-fg:#A23E36; --st-full-bg:#F4DEDB;
  --st-notyet-fg:#5B6880; --st-notyet-bg:#E8ECF2;
  --st-none-fg:#9A9387; --st-none-bg:#EFEBE3;
  --st-unk-fg:#B8B0A0; --st-unk-bg:#F4F2ED;
  --st-err-fg:#8A6A1F; --st-err-bg:#F6ECD8;
  --brand-jalan:#E8340A; --brand-rakuten:#BF0000; --brand-amazon:#FF9900; --brand-booking:#003580;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px;
  --r-1:2px; --r-2:4px; --r-3:8px;
  --rule-hair:1px solid var(--ink-200);
  --rule-bold:2px solid var(--ink-900);
  --ff-serif:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;
  --ff-sans:"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --ff-en-serif:"EB Garamond","Georgia",serif;
  --ff-num:"Inter","Helvetica Neue",sans-serif;
  --ff-heading:var(--ff-serif);
  --w-container:1280px; --w-sidebar:300px;
  --hero-pattern:none;
}
html[data-theme="sumi"]{--accent-50:#ECEAE6;--accent-500:#3A3633;--accent-700:#22201E;}
html[data-theme="kaki"]{--accent-50:#F3E4D8;--accent-500:#B35C2E;--accent-700:#82411E;}
html[data-density="loose"]{--sp-1:5px;--sp-2:10px;--sp-3:15px;--sp-4:20px;--sp-5:30px;--sp-6:40px;--sp-7:60px;--sp-8:80px;--sp-9:120px;}
html[data-density="compact"]{--sp-1:3px;--sp-2:6px;--sp-3:10px;--sp-4:13px;--sp-5:19px;--sp-6:26px;--sp-7:38px;--sp-8:51px;--sp-9:77px;}
html[data-heading="sans"]{--ff-heading:var(--ff-sans);}
html[data-heading="rounded"]{--ff-heading:"Zen Maru Gothic","Hiragino Maru Gothic ProN",var(--ff-sans);}

body { font-family:var(--ff-sans); background:var(--ink-0); color:var(--ink-800); font-size:15px; line-height:1.8; text-wrap:pretty; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4 { font-family:var(--ff-heading); color:var(--ink-900); font-weight:600; line-height:1.35; text-wrap:balance; letter-spacing:0.01em; }

.overline { font-family:var(--ff-en-serif); font-size:11px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--accent-500); display:inline-flex; align-items:center; gap:var(--sp-2); }
.overline::before,.overline::after { content:""; display:inline-block; width:24px; height:1px; background:var(--accent-500); opacity:.6; }
.overline.single::before { display:none; }
.en-sub { font-family:var(--ff-en-serif); font-variant:small-caps; letter-spacing:0.12em; color:var(--ink-400); }
.section-title { font-family:var(--ff-heading); font-size:22px; font-weight:600; color:var(--ink-900); margin-bottom:var(--sp-4); padding-bottom:var(--sp-3); border-bottom:var(--rule-bold); display:flex; align-items:baseline; gap:var(--sp-3); }
.section-title .en-sub { font-size:12px; }

/* Header */
.site-header { background:var(--ink-0); border-bottom:var(--rule-hair); position:sticky; top:0; z-index:100; }
.site-header-inner { max-width:var(--w-container); margin:0 auto; padding:0 var(--sp-5); height:64px; display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); }
.site-logo { display:flex; flex-direction:column; line-height:1.1; }
.site-logo .logo-jp { font-family:var(--ff-serif); font-weight:600; font-size:16px; color:var(--ink-900); letter-spacing:0.04em; }
.site-logo .logo-en { font-family:var(--ff-en-serif); font-size:10px; letter-spacing:0.24em; color:var(--ink-400); text-transform:uppercase; margin-top:2px; }
.site-nav { display:flex; gap:var(--sp-1); }
.site-nav a { display:inline-flex; align-items:center; gap:4px; padding:8px 12px; font-size:13px; color:var(--ink-600); border-bottom:2px solid transparent; transition:color .15s,border-color .15s; }
.site-nav a:hover { color:var(--ink-900); }
.site-nav a.active { color:var(--ink-900); border-bottom-color:var(--accent-500); }
.site-nav a .wip { font-size:9px; color:var(--ink-400); background:var(--ink-100); padding:1px 5px; border-radius:2px; letter-spacing:0.05em; }

.site-main { max-width:var(--w-container); margin:0 auto; padding:var(--sp-6) var(--sp-5) var(--sp-8); }
.layout-2col { display:grid; grid-template-columns:minmax(0,1fr) var(--w-sidebar); gap:var(--sp-7); align-items:start; }
.layout-2col > * { min-width:0; }
.sidebar { display:flex; flex-direction:column; gap:var(--sp-5); position:sticky; top:80px; }

/* Hero */
.hero { position:relative; padding:var(--sp-8) var(--sp-5); background:var(--accent-50); border-bottom:var(--rule-hair); overflow:hidden; }
.hero::before { content:""; position:absolute; inset:0; background-image:var(--hero-pattern); opacity:.5; pointer-events:none; }
.hero-inner { position:relative; max-width:var(--w-container); margin:0 auto; }
.hero .overline { margin-bottom:var(--sp-4); }
.hero h1 { font-family:var(--ff-heading); font-size:clamp(32px,5.5vw,56px); font-weight:600; line-height:1.25; letter-spacing:0.02em; color:var(--ink-900); margin-bottom:var(--sp-4); max-width:18ch; }
.hero p.lede { font-size:15px; line-height:1.9; color:var(--ink-600); max-width:52ch; }
.hero-meta { margin-top:var(--sp-6); padding-top:var(--sp-4); border-top:var(--rule-hair); display:flex; gap:var(--sp-6); flex-wrap:wrap; font-size:12px; color:var(--ink-600); }
.hero-meta strong { font-family:var(--ff-num); font-weight:600; color:var(--ink-900); font-size:18px; margin-right:6px; }

/* Vacancy */
.vacancy { background:var(--ink-0); border:var(--rule-hair); border-radius:var(--r-3); margin-bottom:var(--sp-7); overflow:hidden; }
.vacancy-head { padding:var(--sp-4) var(--sp-5); border-bottom:var(--rule-hair); display:flex; align-items:baseline; justify-content:space-between; gap:var(--sp-3); flex-wrap:wrap; }
.vacancy-head h2 { font-family:var(--ff-heading); font-size:20px; font-weight:600; }
.vacancy-head .meta { font-size:12px; color:var(--ink-600); display:flex; align-items:center; gap:var(--sp-3); flex-wrap:wrap; }
.vacancy-head .meta .dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--st-avail-fg); margin-right:4px; }
.vacancy-summary { display:grid; grid-template-columns:repeat(4,1fr); border-bottom:var(--rule-hair); background:var(--ink-50); }
.vacancy-summary .stat { padding:var(--sp-3) var(--sp-4); border-right:var(--rule-hair); font-size:12px; color:var(--ink-600); }
.vacancy-summary .stat:last-child { border-right:0; }
.vacancy-summary .stat strong { display:block; font-family:var(--ff-num); font-weight:600; font-size:24px; color:var(--ink-900); line-height:1.2; }
.vacancy-legend { display:flex; flex-wrap:wrap; gap:var(--sp-3); padding:var(--sp-3) var(--sp-5); border-bottom:var(--rule-hair); font-size:11px; color:var(--ink-600); }
.vacancy-legend .item { display:inline-flex; align-items:center; gap:6px; }
.vacancy-legend .sym { width:20px; height:20px; display:inline-flex; align-items:center; justify-content:center; font-family:var(--ff-num); font-weight:600; font-size:12px; border-radius:var(--r-1); }

.cal-scroll-top { overflow-x:auto; overflow-y:hidden; height:14px; border-bottom:var(--rule-hair); background:var(--ink-50); }
.cal-scroll-top-inner { height:1px; }
.cal-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
.cal-table { border-collapse:separate; border-spacing:0; min-width:max-content; width:100%; font-family:var(--ff-num); font-size:13px; }
.cal-table th,.cal-table td { border-right:1px solid var(--ink-100); border-bottom:1px solid var(--ink-100); padding:0; text-align:center; vertical-align:middle; }
.cal-corner,.cal-month-corner { background:var(--ink-50); }
.cal-month-row th { background:var(--ink-50); color:var(--ink-600); font-family:var(--ff-en-serif); font-weight:500; font-size:11px; letter-spacing:0.15em; padding:6px 4px; text-align:center; border-bottom:var(--rule-hair); }
.cal-date-header { background:var(--ink-0); color:var(--ink-800); font-family:var(--ff-num); font-weight:500; font-size:12px; padding:6px 2px; min-width:38px; border-bottom:var(--rule-hair); }
.cal-date-header .dow { display:block; font-size:9px; font-weight:400; color:var(--ink-400); margin-top:2px; letter-spacing:0.05em; }
.cal-date-header.is-sat { background:#F2F4F8; color:#3F5782; }
.cal-date-header.is-sat .dow { color:#6B82A8; }
.cal-date-header.is-sun { background:#F7EFEE; color:#8F3E3A; }
.cal-date-header.is-sun .dow { color:#B07673; }

.col-train { position:sticky; left:0; z-index:2; background:var(--ink-0); min-width:180px; max-width:200px; text-align:left; padding:var(--sp-3) var(--sp-4); border-right:2px solid var(--ink-100) !important; }
thead .col-train { background:var(--ink-50); color:var(--ink-600); font-family:var(--ff-en-serif); font-weight:500; font-size:11px; letter-spacing:0.15em; z-index:3; border-bottom:var(--rule-hair); }
.col-route { position:sticky; left:180px; z-index:2; background:var(--ink-0); min-width:160px; max-width:210px; text-align:left; padding:var(--sp-2) var(--sp-3); border-right:2px solid var(--ink-100) !important; }
thead .col-route { background:var(--ink-50); color:var(--ink-600); font-family:var(--ff-en-serif); font-weight:500; font-size:11px; letter-spacing:0.15em; border-bottom:var(--rule-hair); z-index:3; }
.cal-route-direction { display:inline-block; color:var(--accent-500); border:1px solid var(--accent-500); border-radius:var(--r-1); padding:1px 6px; font-size:10px; line-height:1.35; margin-bottom:4px; }
.cal-route-label { font-family:var(--ff-sans); font-size:11px; color:var(--ink-700); line-height:1.45; white-space:normal; overflow-wrap:anywhere; }
.cal-train-name { font-family:var(--ff-heading); font-size:14px; font-weight:600; color:var(--ink-900); line-height:1.35; display:block; }
.cal-train-name:hover { color:var(--accent-500); }
.cal-train-route { font-family:var(--ff-sans); font-size:10px; color:var(--ink-400); margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cal-train-book { display:inline-block; margin-top:5px; margin-right:4px; font-family:var(--ff-sans); font-size:10px; color:var(--accent-500); border:1px solid var(--accent-500); border-radius:var(--r-1); padding:1px 7px; letter-spacing:0.05em; transition:background .15s,color .15s; }
.cal-train-book:hover { background:var(--accent-500); color:white; }

.cal-cell { min-width:38px; height:40px; font-family:var(--ff-num); font-weight:600; font-size:14px; user-select:none; transition:filter .1s; position:relative; }
.cal-cell.clickable { cursor:pointer; }
.cal-cell.clickable:hover { filter:brightness(.96); }
.cal-cell.is-active::after { content:""; position:absolute; left:6px; right:6px; bottom:3px; height:2px; background:var(--accent-500); }

.cell-available { background:var(--st-avail-bg); color:var(--st-avail-fg); }
.cell-few { background:var(--st-few-bg); color:var(--st-few-fg); }
.cell-full { background:var(--st-full-bg); color:var(--st-full-fg); }
.cell-not_yet { background:var(--st-notyet-bg); color:var(--st-notyet-fg); font-size:11px; }
.cell-no_service { background:var(--st-none-bg); color:var(--st-none-fg); font-size:11px; background-image:repeating-linear-gradient(135deg,transparent,transparent 3px,rgba(0,0,0,.04) 3px,rgba(0,0,0,.04) 6px); }
.cell-unknown,.cell-no_data { background:var(--st-unk-bg); color:var(--st-unk-fg); font-size:11px; }
.cell-error { background:var(--st-err-bg); color:var(--st-err-fg); font-size:11px; }
.cell-manual { background:var(--accent-50); color:var(--accent-500); font-size:10px; padding:6px 10px; text-align:left; }
.cell-manual a { color:var(--accent-500); text-decoration:underline; }

.cal-group-head td { background:var(--ink-50); color:var(--ink-900); padding:8px var(--sp-4); font-family:var(--ff-heading); font-weight:600; font-size:13px; cursor:pointer; user-select:none; letter-spacing:0.04em; text-align:left; border-top:1px solid var(--ink-100); border-bottom:1px solid var(--ink-100); }
.cal-group-head .cal-group-label { position:sticky; left:0; z-index:4; min-width:340px; max-width:410px; border-right:2px solid var(--ink-100) !important; }
.cal-group-head .cal-group-fill { cursor:pointer; padding:0; }
.cal-group-head .chev { display:inline-block; font-family:var(--ff-num); font-size:10px; color:var(--ink-400); margin-right:8px; transition:transform .2s; }
.cal-group-head.collapsed .chev { transform:rotate(-90deg); }
.cal-group-head .en { font-family:var(--ff-en-serif); font-weight:500; font-size:11px; color:var(--ink-400); letter-spacing:0.2em; margin-left:8px; text-transform:uppercase; }
.train-direction-head td { cursor:default; background:var(--accent-50); }
.train-direction-title { display:flex; align-items:center; gap:8px; flex-wrap:wrap; font-family:var(--ff-heading); font-size:13px; color:var(--ink-900); }
.train-direction-route { margin-top:2px; font-family:var(--ff-sans); font-size:11px; font-weight:400; color:var(--ink-600); letter-spacing:0; }
.train-seat-row .col-train { background:var(--ink-0); }

.cal-detail { border-top:var(--rule-hair); padding:var(--sp-4) var(--sp-5); background:var(--ink-50); font-size:13px; }
.cal-detail-head { display:flex; align-items:baseline; gap:var(--sp-3); margin-bottom:var(--sp-3); }
.cal-detail-head strong { font-family:var(--ff-heading); font-size:15px; color:var(--ink-900); }
.cal-detail-head .date { color:var(--ink-600); font-size:12px; }
.cal-detail-close { margin-left:auto; color:var(--ink-400); padding:4px 8px; font-size:16px; }
.cal-detail-close:hover { color:var(--ink-900); }
.cal-detail-row { display:flex; justify-content:space-between; gap:var(--sp-4); padding:6px 0; font-size:12px; border-bottom:1px dotted var(--ink-200); }
.cal-detail-row:last-child { border-bottom:none; }
.cal-detail-row .type { color:var(--ink-800); }
.cal-detail-row .st { font-family:var(--ff-num); font-weight:600; padding:2px 8px; border-radius:2px; }
.cal-detail-actions { margin-top:var(--sp-4); padding-top:var(--sp-3); border-top:var(--rule-hair); display:flex; gap:var(--sp-2); flex-wrap:wrap; }

.vacancy-foot { padding:var(--sp-3) var(--sp-5); border-top:var(--rule-hair); font-size:11px; color:var(--ink-400); background:var(--ink-0); }

/* Train cards */
.train-intro { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:var(--sp-4); gap:var(--sp-4); flex-wrap:wrap; }
.train-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-5); margin-bottom:var(--sp-7); }
.sub-head { font-family:var(--ff-heading); font-size:14px; font-weight:600; margin-bottom:var(--sp-3); padding-bottom:6px; border-bottom:var(--rule-hair); display:flex; align-items:baseline; gap:var(--sp-3); }
.sub-head .en-sub { font-size:10px; letter-spacing:0.2em; }

.train-card { border:var(--rule-hair); border-radius:var(--r-3); overflow:hidden; background:var(--ink-0); transition:transform .2s,border-color .2s; display:flex; flex-direction:column; color:inherit; position:relative; }
.train-card:hover { transform:translateY(-2px); border-color:var(--ink-300); }
.train-card-cover { aspect-ratio:16/10; position:relative; display:flex; flex-direction:column; justify-content:center; align-items:center; padding:var(--sp-4); text-align:center; overflow:hidden; }
.train-card-cover::before { content:""; position:absolute; inset:0; background-image:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.04) 100%),repeating-linear-gradient(90deg,transparent 0 2px,rgba(255,255,255,.4) 2px 3px); opacity:.4; pointer-events:none; }
.train-card-cover .jp { font-family:var(--ff-heading); font-weight:600; font-size:22px; color:var(--ink-900); letter-spacing:0.08em; line-height:1.3; z-index:1; text-wrap:balance; }
.train-card-cover .en { font-family:var(--ff-en-serif); font-variant:small-caps; letter-spacing:0.22em; font-size:12px; color:var(--ink-600); margin-top:var(--sp-2); z-index:1; }
.train-card-cover .bar { width:40px; height:2px; margin-top:var(--sp-3); z-index:1; }
.train-card-cover .genre { position:absolute; right:var(--sp-3); bottom:var(--sp-3); font-size:10px; color:var(--ink-600); background:rgba(251,250,247,.85); padding:2px 8px; border-radius:2px; letter-spacing:0.1em; z-index:2; }
.train-card-body { padding:var(--sp-4); flex:1; display:flex; flex-direction:column; gap:var(--sp-2); }
.train-card-body .overline { margin-bottom:0; font-size:10px; }
.train-card-body .overline::before,.train-card-body .overline::after { width:12px; }
.train-card-body .route { font-family:var(--ff-sans); font-size:13px; color:var(--ink-600); line-height:1.5; }
.train-card-status { margin-top:auto; padding-top:var(--sp-3); border-top:var(--rule-hair); display:flex; justify-content:space-between; align-items:center; font-size:12px; }
.train-card-status .txt { color:var(--ink-600); }
.train-card-status .st-dot { display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:6px; }
.train-card-status .st-dot.a { background:var(--st-avail-fg); }
.train-card-status .st-dot.u { background:var(--ink-300); }
.train-card-status .arrow { font-family:var(--ff-en-serif); color:var(--accent-500); letter-spacing:0.05em; }
.train-card-tags { display:flex; gap:6px; flex-wrap:wrap; }
.tag { font-size:10px; padding:1px 7px; border:1px solid var(--ink-200); color:var(--ink-600); border-radius:var(--r-1); letter-spacing:0.05em; line-height:1.6; }
.tag.tag-wester { border-color:var(--accent-500); color:var(--accent-500); }
.tag.tag-tabiwa { border-color:var(--brand-jalan); color:var(--brand-jalan); }

/* Features */
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--sp-5); margin-bottom:var(--sp-7); }
.feature-card { border-top:var(--rule-bold); padding-top:var(--sp-4); display:flex; flex-direction:column; gap:var(--sp-2); transition:transform .2s; position:relative; }
.feature-card:hover { transform:translateY(-2px); }
.feature-card .overline { font-size:10px; margin-bottom:var(--sp-2); }
.feature-card h3 { font-family:var(--ff-heading); font-weight:600; font-size:17px; line-height:1.5; color:var(--ink-900); }
.feature-card .excerpt { font-size:12px; color:var(--ink-600); line-height:1.7; }
.feature-card.wip { opacity:.55; }
.feature-card.wip::after { content:"準備中"; position:absolute; top:8px; right:0; font-family:var(--ff-en-serif); font-size:10px; letter-spacing:0.15em; color:var(--ink-400); background:var(--ink-100); padding:2px 8px; }

/* Sidebar cards */
.side-card { border:var(--rule-hair); background:var(--ink-0); }
.side-card-head { padding:var(--sp-3) var(--sp-4); border-bottom:var(--rule-hair); display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.side-card-head h3 { font-family:var(--ff-heading); font-size:15px; font-weight:600; color:var(--ink-900); }
.side-card-head .en { font-family:var(--ff-en-serif); font-size:10px; letter-spacing:0.2em; color:var(--ink-400); text-transform:uppercase; }
.side-card-body { padding:var(--sp-4); font-size:13px; }

.article-list { list-style:none; display:flex; flex-direction:column; }
.article-list li { padding:var(--sp-3) 0; border-bottom:var(--rule-hair); }
.article-list li:last-child { border-bottom:0; }
.article-list a { display:flex; flex-direction:column; gap:4px; color:var(--ink-800); }
.article-list a:hover .title { color:var(--accent-500); }
.article-list .cat { font-family:var(--ff-en-serif); font-size:10px; letter-spacing:0.18em; color:var(--accent-500); text-transform:uppercase; }
.article-list .title { font-family:var(--ff-heading); font-size:13px; font-weight:500; line-height:1.5; }
.article-list .date { font-family:var(--ff-num); font-size:10px; color:var(--ink-400); }

.book-card { display:flex; gap:var(--sp-3); padding:var(--sp-3) 0; border-bottom:var(--rule-hair); }
.book-card:last-child { border-bottom:0; }
.book-thumb { width:56px; height:76px; background:var(--ink-100); display:flex; align-items:center; justify-content:center; font-family:var(--ff-en-serif); font-size:18px; color:var(--ink-600); flex-shrink:0; border:1px solid var(--ink-200); }
.book-info { display:flex; flex-direction:column; gap:3px; min-width:0; }
.book-title { font-family:var(--ff-heading); font-size:12px; font-weight:500; line-height:1.5; color:var(--ink-900); }
.book-price { font-family:var(--ff-num); font-size:12px; color:var(--ink-600); }
.book-link { font-family:var(--ff-en-serif); font-size:11px; letter-spacing:0.1em; color:var(--brand-amazon); text-transform:uppercase; margin-top:2px; }

.travel-links { display:grid; grid-template-columns:1fr 1fr; gap:var(--sp-2); }
.btn-travel { display:flex; flex-direction:column; align-items:flex-start; padding:var(--sp-3) var(--sp-4); color:white; font-size:13px; font-weight:500; border-radius:var(--r-1); line-height:1.3; transition:opacity .15s; }
.btn-travel:hover { opacity:.88; }
.btn-travel .en { font-family:var(--ff-en-serif); font-size:9px; letter-spacing:0.2em; opacity:.75; text-transform:uppercase; }
.btn-jalan { background:var(--brand-jalan); }
.btn-rakuten { background:var(--brand-rakuten); }
.btn-booking { background:var(--brand-booking); }

.ad-slot { background:var(--ink-50); border:1px dashed var(--ink-200); display:flex; align-items:center; justify-content:center; min-height:250px; color:var(--ink-400); font-family:var(--ff-en-serif); letter-spacing:0.2em; font-size:11px; text-transform:uppercase; position:relative; }
.ad-slot::before { content:"広告"; position:absolute; top:6px; left:8px; font-family:var(--ff-sans); letter-spacing:0.1em; font-size:10px; color:var(--ink-400); }
.ad-slot.responsive { min-height:90px; margin:var(--sp-5) 0; }

.wester-card { background:var(--accent-500); color:white; padding:var(--sp-5); border-radius:var(--r-3); position:relative; overflow:hidden; }
.wester-card::before { content:""; position:absolute; right:-30px; bottom:-30px; width:140px; height:140px; border:30px solid rgba(255,255,255,.08); border-radius:50%; }
.wester-card .overline { color:rgba(255,255,255,.7); }
.wester-card .overline::before,.wester-card .overline::after { background:rgba(255,255,255,.4); }
.wester-card h3 { font-family:var(--ff-heading); font-size:18px; color:white; margin:var(--sp-2) 0 var(--sp-3); }
.wester-card p { font-size:13px; color:rgba(255,255,255,.85); line-height:1.7; }
.wester-card .btn { display:inline-block; margin-top:var(--sp-3); padding:8px 16px; background:white; color:var(--accent-500); font-size:12px; font-weight:600; letter-spacing:0.05em; border-radius:var(--r-1); }


/* Static content pages */
.page-hero { position:relative; padding:var(--sp-8) var(--sp-5) var(--sp-7); background:var(--accent-50); border-bottom:var(--rule-hair); overflow:hidden; }
.page-hero::before { content:""; position:absolute; inset:0; background-image:var(--hero-pattern); opacity:.45; pointer-events:none; }
.page-hero-inner { position:relative; max-width:var(--w-container); margin:0 auto; }
.page-hero h1 { font-family:var(--ff-heading); font-size:clamp(32px,5vw,52px); font-weight:600; line-height:1.25; margin-top:var(--sp-3); max-width:18ch; }
.page-hero .page-desc, .page-hero .page-date { color:var(--ink-600); font-size:14px; margin-top:var(--sp-4); line-height:1.9; max-width:58ch; }
.page-wrap { max-width:var(--w-container); margin:0 auto; padding:var(--sp-7) var(--sp-5) var(--sp-8); }
.page-wrap .section { background:var(--ink-0); border-top:var(--rule-bold); padding:var(--sp-5) 0; margin-bottom:var(--sp-5); }
.page-wrap .section h2 { font-family:var(--ff-heading); font-size:18px; font-weight:600; margin-bottom:var(--sp-3); color:var(--ink-900); }
.page-wrap .section p { font-size:14px; color:var(--ink-700); line-height:1.9; margin-bottom:var(--sp-3); }
.page-wrap .section p:last-child { margin-bottom:0; }
.page-wrap .section ul { padding-left:1.3em; font-size:14px; color:var(--ink-700); line-height:1.9; margin-bottom:var(--sp-3); }
.page-wrap .section li { margin-bottom:6px; }
.page-wrap .section a { color:var(--accent-500); text-decoration:underline; text-underline-offset:3px; }
.contact-table { width:100%; border-collapse:collapse; font-size:14px; }
.contact-table th { width:132px; text-align:left; padding:10px 12px 10px 0; color:var(--ink-600); font-family:var(--ff-heading); font-weight:500; border-bottom:var(--rule-hair); vertical-align:top; }
.contact-table td { padding:10px 0 10px 12px; border-bottom:var(--rule-hair); color:var(--ink-800); }
.notice-box { background:var(--st-few-bg); color:var(--ink-800); border-left:3px solid var(--st-few-fg); padding:var(--sp-4); font-size:14px; line-height:1.8; margin-bottom:var(--sp-5); }
.form-btn { display:inline-block; padding:12px 22px; background:var(--accent-500); color:var(--ink-0) !important; text-decoration:none !important; border-radius:var(--r-1); font-size:14px; font-weight:600; letter-spacing:0.04em; }
.form-btn:hover { background:var(--accent-700); }
.note { font-size:13px; color:var(--ink-500); margin-top:var(--sp-3); }
@media (max-width:600px) {
  .page-hero { padding:var(--sp-6) var(--sp-4); }
  .page-wrap { padding:var(--sp-6) var(--sp-4) var(--sp-7); }
}

/* Train detail */
.train-hero { padding:var(--sp-8) var(--sp-5) var(--sp-7); background:var(--train-tint,var(--accent-50)); border-bottom:var(--rule-hair); position:relative; overflow:hidden; }
.train-hero::before { content:""; position:absolute; inset:0; background-image:repeating-linear-gradient(90deg,transparent 0 3px,rgba(255,255,255,.25) 3px 4px); opacity:.4; pointer-events:none; }
.train-hero-inner { position:relative; max-width:var(--w-container); margin:0 auto; }
.breadcrumb { font-size:12px; color:var(--ink-600); margin-bottom:var(--sp-5); }
.breadcrumb a:hover { color:var(--ink-900); }
.breadcrumb .sep { margin:0 8px; color:var(--ink-300); }
.train-hero .overline { margin-bottom:var(--sp-3); color:var(--train-accent,var(--accent-500)); }
.train-hero .overline::before,.train-hero .overline::after { background:var(--train-accent,var(--accent-500)); }
.train-hero h1 { font-family:var(--ff-heading); font-weight:600; font-size:clamp(32px,5vw,48px); color:var(--ink-900); line-height:1.2; margin-bottom:var(--sp-2); letter-spacing:0.04em; }
.train-hero .en-title { font-family:var(--ff-en-serif); font-variant:small-caps; font-size:18px; letter-spacing:0.22em; color:var(--ink-600); margin-bottom:var(--sp-4); }
.train-hero .bar { width:56px; height:2px; background:var(--train-accent,var(--accent-500)); margin-bottom:var(--sp-4); }
.train-hero .route { font-size:15px; color:var(--ink-800); margin-bottom:var(--sp-5); }
.train-hero .tags { display:flex; flex-wrap:wrap; gap:8px; }
.train-hero .tags .tag { background:var(--ink-0); border-color:var(--ink-200); }

.section { margin-bottom:var(--sp-7); }
.section > h2 { font-family:var(--ff-heading); font-size:22px; font-weight:600; margin-bottom:var(--sp-4); padding-bottom:var(--sp-3); border-bottom:var(--rule-bold); display:flex; align-items:baseline; gap:var(--sp-3); }
.section > h2 .en-sub { font-size:11px; letter-spacing:0.2em; }

.info-table { width:100%; border-collapse:collapse; font-size:14px; }
.info-table th { width:128px; text-align:left; font-family:var(--ff-heading); font-weight:500; color:var(--ink-600); padding:var(--sp-3) 0; border-bottom:var(--rule-hair); vertical-align:top; }
.info-table td { padding:var(--sp-3) 0 var(--sp-3) var(--sp-3); border-bottom:var(--rule-hair); }
.info-table tr:last-child th,.info-table tr:last-child td { border-bottom:0; }

.seat-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:var(--sp-3); }
.seat-card { border:var(--rule-hair); padding:var(--sp-4); border-radius:var(--r-3); background:var(--ink-0); }
.seat-card .name { font-family:var(--ff-heading); font-weight:600; font-size:15px; color:var(--ink-900); margin-bottom:6px; }
.seat-card .desc { font-size:13px; color:var(--ink-600); line-height:1.7; }

.steps { display:flex; flex-direction:column; gap:var(--sp-5); }
.step { display:grid; grid-template-columns:64px 1fr; gap:var(--sp-4); align-items:start; }
.step .num { font-family:var(--ff-en-serif); font-weight:500; font-size:44px; color:var(--train-accent,var(--accent-500)); line-height:1; padding-top:4px; }
.step .body strong { display:block; font-family:var(--ff-heading); font-weight:600; font-size:15px; color:var(--ink-900); margin-bottom:4px; }
.step .body p { font-size:14px; color:var(--ink-600); line-height:1.8; }

.btn-primary { display:inline-block; padding:12px 24px; background:var(--train-accent,var(--accent-500)); color:white; font-size:14px; font-weight:600; border-radius:var(--r-1); margin-top:var(--sp-3); letter-spacing:0.05em; }
.btn-primary:hover { filter:brightness(.92); }

.notice { background:var(--ink-50); padding:var(--sp-4); border-left:3px solid var(--accent-500); font-size:13px; color:var(--ink-800); }
.notice strong { display:block; font-family:var(--ff-heading); margin-bottom:6px; }

/* Footer */
.site-footer { background:var(--ink-900); color:rgba(255,255,255,.7); margin-top:var(--sp-8); padding:var(--sp-7) var(--sp-5) var(--sp-5); }
.site-footer-inner { max-width:var(--w-container); margin:0 auto; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:var(--sp-6); padding-bottom:var(--sp-6); border-bottom:1px solid rgba(255,255,255,.1); }
.footer-brand .jp { font-family:var(--ff-serif); font-weight:600; font-size:18px; color:white; letter-spacing:0.04em; }
.footer-brand .en { font-family:var(--ff-en-serif); font-size:11px; letter-spacing:0.22em; color:rgba(255,255,255,.5); text-transform:uppercase; margin-top:4px; display:block; }
.footer-brand p { font-size:12px; line-height:1.8; margin-top:var(--sp-3); color:rgba(255,255,255,.5); max-width:40ch; }
.footer-nav h4 { font-family:var(--ff-en-serif); font-size:11px; letter-spacing:0.22em; color:rgba(255,255,255,.5); text-transform:uppercase; margin-bottom:var(--sp-3); font-weight:500; }
.footer-nav ul { list-style:none; display:flex; flex-direction:column; gap:8px; }
.footer-nav ul a { font-size:13px; color:rgba(255,255,255,.7); }
.footer-nav ul a:hover { color:white; }
.footer-bottom { padding-top:var(--sp-4); font-size:11px; color:rgba(255,255,255,.35); text-align:center; line-height:1.8; }

/* Tweaks Panel */
.tweaks-panel { position:fixed; right:24px; bottom:24px; width:280px; background:var(--ink-0); border:var(--rule-hair); border-radius:var(--r-3); box-shadow:0 20px 40px rgba(0,0,0,.12); z-index:200; padding:var(--sp-4); font-size:13px; display:none; max-height:calc(100vh - 48px); overflow-y:auto; }
.tweaks-panel.on { display:block; }
.tweaks-panel h4 { font-family:var(--ff-heading); font-size:14px; font-weight:600; margin-bottom:var(--sp-3); display:flex; justify-content:space-between; align-items:center; }
.tweaks-panel h4 .en { font-family:var(--ff-en-serif); font-size:10px; letter-spacing:0.2em; color:var(--ink-400); font-weight:400; }
.tweaks-panel .field { margin-bottom:var(--sp-3); }
.tweaks-panel .field > label { display:block; font-family:var(--ff-en-serif); font-size:10px; letter-spacing:0.18em; color:var(--ink-400); text-transform:uppercase; margin-bottom:6px; }
.tweaks-seg { display:grid; grid-auto-flow:column; grid-auto-columns:1fr; border:var(--rule-hair); border-radius:var(--r-1); overflow:hidden; }
.tweaks-seg button { padding:7px 6px; font-size:12px; color:var(--ink-600); border-right:var(--rule-hair); background:var(--ink-0); transition:background .15s,color .15s; }
.tweaks-seg button:last-child { border-right:0; }
.tweaks-seg button:hover { background:var(--ink-50); }
.tweaks-seg button.on { background:var(--ink-900); color:var(--ink-0); }

/* Responsive */
@media (max-width:900px) {
  .layout-2col { grid-template-columns:1fr; }
  .sidebar { position:static; }
  .train-grid { grid-template-columns:repeat(2,1fr); }
  .feature-grid { grid-template-columns:1fr 1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .vacancy-summary { grid-template-columns:repeat(2,1fr); }
  .vacancy-summary .stat:nth-child(2n) { border-right:0; }
  .vacancy-summary .stat:nth-child(-n+2) { border-bottom:var(--rule-hair); }
}
@media (max-width:600px) {
  .site-main { padding:var(--sp-5) var(--sp-4) var(--sp-7); }
  .hero { padding:var(--sp-6) var(--sp-4); }
  .hero h1 { font-size:32px; }
  .train-grid { grid-template-columns:1fr; }
  .feature-grid { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .col-train { min-width:148px; max-width:160px; padding:var(--sp-2) var(--sp-3); }
  .col-route { left:148px; min-width:140px; max-width:180px; padding:var(--sp-2); }
  .cal-group-head .cal-group-label { min-width:288px; max-width:340px; }
  .cal-route-label { white-space:normal; }
  .cal-cell { min-width:34px; height:36px; font-size:12px; }
}