@charset "UTF-8";
/* ==========================================================
   en.css — 英語版トップ（en.html）だけの上書き
   index.html の日本語組版（縦組みコンセプト・168px の和文コピー）は
   英文では成立しないため、その2点だけを横組み・英文サイズに置き換える。
   レイアウト座標は index と同一（写真の位置は一切動かさない）。
   作成: 2026-09-04（D-1 担当A）
   ========================================================== */

/* ---- FV コピー（和文168px → 英文ディスプレイ） ---- */
.hero__copy {
  font-family: var(--font-en, "Bebas Kai", "Bebas Neue", sans-serif);
  font-feature-settings: normal;
  font-size: 122px;
  letter-spacing: 0.015em;
}
.hero__en-copy { font-size: 38px; letter-spacing: 0.08em; }

/* ---- CONCEPT（縦組み → 横組み・右揃え） ---- */
.concept__vtext {
  writing-mode: horizontal-tb;
  font-feature-settings: normal;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 0.01em;
  text-align: right;
}
.concept__vtext--1 { top: 1477px; right: 60px;  width: 360px; }   /* 横組みは幅を持つ＝panorama(右端x969)を避けて右へ寄せる */
.concept__vtext--2 { top: 2078px; right: 1020px; width: 400px; }
.concept__vtext--3 { top: 2700px; right: 60px;  width: 400px; }   /* beer(y2368-2688)の下へ落として重なりを回避 */

@media (max-width: 768px) {
  /* 和文の +2.9px（句読点半角の版面合わせ）は英文では不要＝素の中央寄せに戻す */
  .hero__copy { font-size: 43px; letter-spacing: 0.015em; --intro-tx: -50%; }
  .hero__en-copy { font-size: 17px; }
  .concept__vtext { font-size: 13px; line-height: 21px; }
  /* 【2026-09-09 EN再構築】幅220/170/160 では <br> の行が途中で折れて 5行/7行/7行になっていた
     （実測 concept_need.js: 必要幅 243/238/318px）。<br> どおり 3行/4行/4行になる幅を確保し、
     写真と重ならない空き（gondola上・sled上・food下＝器1452.5の内側）へ置く。
     --1: panorama下端193.5〜gondola上端289 の帯（3行63px）
     --2: gondola右(x118)〜sled上端424 の帯（4行84px・x130-374、--1 との間39px・sled上端まで28px）
     --3: food下端1300.5〜器下端1452.5 の帯（4行84px） */
  .concept__vtext--1 { top: 210px; right: 20px; width: 250px; }
  .concept__vtext--2 { top: 312px; right: 20px; width: 244px; }
  .concept__vtext--3 { top: 1322px; right: 20px; width: 340px; }
}

/* ---- STATUS パネル（2026-09-09 EN 再構築時に実測で発見・追加） ----
   「Courses」は和文用ピル（円43.9px・Shippori 13.68px）に収まらない（ink 45px＝円からはみ出し）。
   隣の数値「12/13」と同じ英字書体（--font-en）に切り替え、円を48pxに拡大して収める。
   実測（status_try.js・fontsOK）: COURSES ink 39.2px／円の弦との余白 3.2px、
   運行状況セル右端まで PC 11.8px・SP 8.3px の余裕。 */
.status__pill {
  width: 48px;
  height: 48px;
  font-family: var(--font-en);
  font-feature-settings: normal;
  font-size: 13px;
  letter-spacing: 0.03em;
}
.status__ops-item:nth-child(2) .status__pill { letter-spacing: 0.03em; }
/* 「Temp.」（17px・0.11em）が数値「12.5」（left:60px）に 10.7px 食い込む → 字送り0・左2pxで 5.7px のアキを確保 */
.status__cell--temp .status__metric-label { letter-spacing: 0; left: 2px; }
@media (max-width: 768px) {
  .status__cell--temp .status__metric-label { left: 6px; }   /* SPは数値 left:66px → アキ 7.7px */
}

/* ---- EXPERIENCE カード「Learn more」（2026-09-09 EN 再構築時に実測で発見・追加） ----
   PCの白ボタン（165.3px・padding 26/15・アイコン24px＝テキスト幅 100.3px）に
   「Learn more」17px・0.11em（実測 110px）が収まらず2行に折れていた。
   16px・0.02em・nowrap で1行に収める（実測 btn_fit.js: textW 93.6px／アイコンとのアキ 6.7px）。
   SP（13px・0.05em）は元から1行に収まるため触らない。 */
@media (min-width: 769px) {
  .experience__more { white-space: nowrap; font-size: 16px; letter-spacing: 0.02em; }
}

/* ---- ACCESS カードの所要時間（2026-09-09 EN 再構築時に実測で発見・追加） ----
   「Approx. 2 hr 30 min – 3 hr by car」は和文用の 17px・0.07em（PC）／14.33px（SP）だと
   カード右端まで使い切って「car」だけ2行目に落ち、line-height:1 のため行間も詰まっていた。
   PC 15px・0.01em／SP 14px・0 で和文と同じ1行に収める
   （実測 access_fit.js: PC 1行・右余白 27px／SP 1行・右余白 12.8px、3カードとも）。 */
.access__time { font-size: 15px; letter-spacing: 0.01em; line-height: 1.4; padding-right: 16px; }
@media (max-width: 768px) {
  .access__time { font-size: 14px; letter-spacing: 0; line-height: 1.35; padding-right: 10px; }
}

/* ---- HOW TO ENJOY カード本文・見出し（2026-09-09 EN 再構築時に実測で発見・追加） ----
   英文は和文（約120字）より長く（約300字）、和文用の字送り 0.07em だと
   PC 9行（card1 の本文下端がカード下端まで16px）・SP 7〜8行（写真枠に 37〜59px 食い込み）になっていた。
   PC: 字送り 0.03em で8行（card1 本文下端 499 ／カード529）。
   SP: 12.5px・行送り19px・字送り0・上マージン12px で6行（本文下端 238.6 ／写真枠上端 246、3枚とも）。
   SP card1 見出し: SP用CSSが .line 2,3 を1行に結合するため「Sheer」「openness.」の間に
   語間（0.25em）を入れる（和文は語間不要だった）。実測 howto_fit.js。 */
@media (min-width: 769px) {
  .howto__card-desc { letter-spacing: 0.03em; }
}
@media (max-width: 768px) {
  .howto__card-desc { font-size: 12.5px; line-height: 19px; letter-spacing: 0; margin-top: 12px; }
  .howto__card:nth-of-type(1) .howto__card-title .line:nth-child(2) { margin-right: 0.25em; }
}
/* SP のリード「What makes Hida Hoonokidaira special」は 19.01px・0.07em だと2行に折れ
   1枚目カードまで 8.5px しかなかった → 17px・0.02em で1行（ink幅 337.8px・カードまで 29.5px。実測 lead_fit.js） */
@media (max-width: 768px) {
  .howto__lead { font-size: 17px; letter-spacing: 0.02em; }
}

/* 【2026-09-09 検査】英文のニュース見出しは2行に収まらず「…」で切れるため、EN だけ3行まで許容 */
html[lang="en"] .news__card-title { -webkit-line-clamp: 3; }

/* 【2026-09-27】ニュースの見出し・HOW TO ENJOY カード本文: 和文カンプの両端揃え（justify）のままだと、
   英文は行ごとに語間が大きく空く（例「Website        renewal notice」）。EN は左揃えにする */
html[lang="en"] .news__card-title,
html[lang="en"] .howto__card-desc { text-align: left; }
