/* =========================================================
   Uzbek Friends — main.css
   トークンはデザインシステム（tokens.json）と同じ名前・同じ値。
   ========================================================= */

:root {
	/* 色 */
	--ground: #fbfaf7;
	--surface: #ffffff;
	--surface-blue: #eef1f7;
	--ink: #1e2230;
	--ink-muted: #4a4f5e;
	--ink-subtle: #6b6f7d;
	--line: #e4e1d8;
	--line-soft: #ecebe6;
	--lapis: #1c3f95;
	--lapis-deep: #122b69;
	--turquoise: #2aa3a8;
	--stamp: #b0562e;
	--board: #111420;
	--board-amber: #f2c14e;
	--on-night: #e9eaee;
	--on-night-muted: #b9bcc8;

	/* 文字 */
	--font-display: "Shippori Antique B1", "Hiragino Mincho ProN", serif;
	--font-sans: "BIZ UDPGothic", "Hiragino Sans", "Yu Gothic", sans-serif;
	--font-voice: "Zen Old Mincho", "Hiragino Mincho ProN", serif;
	--font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;

	/* 余白 */
	--space-1: 8px;
	--space-2: 16px;
	--space-3: 24px;
	--space-4: 32px;
	--gutter: 64px;
	--section: 96px;
	--max: 1312px;
}

@media (max-width: 767px) {
	:root {
		--gutter: 16px;
		--section: 48px;
	}
}

/* ---------- 基本 ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--ground);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: 16px;
	line-height: 1.9;
	font-feature-settings: "palt" 0;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--lapis); text-underline-offset: 3px; }
a:hover { color: var(--lapis-deep); }
:focus-visible { outline: 3px solid var(--lapis); outline-offset: 2px; }
h1, h2, h3 { text-wrap: balance; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip-link:focus { position: fixed; top: 8px; left: 8px; z-index: 100; background: var(--surface); padding: 8px 16px; clip: auto; width: auto; height: auto; }

.uzf-container { width: 100%; max-width: calc(var(--max) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.uzf-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--space-3); }
.uzf-section { padding-block-start: var(--section); }
.uzf-mono { font-family: var(--font-mono); }
.uzf-caption { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
.uzf-ph { display: flex; align-items: flex-end; width: 100%; height: 100%; padding: 12px; font-size: 12px; color: var(--ink-subtle); background: var(--line-soft); }

.uzf-h2 { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(28px, 3vw, 40px); line-height: 1.4; }
.uzf-lead { font-size: 17px; line-height: 2; color: var(--ink-muted); }
.uzf-split__head { grid-column: 1 / span 4; display: flex; flex-direction: column; gap: var(--space-2); }
.uzf-split__body { grid-column: 5 / span 8; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.uzf-split__body--narrow { grid-column: 6 / span 7; }
.uzf-split__head p { margin: 0; color: var(--ink-muted); }
@media (max-width: 960px) {
	.uzf-split__head, .uzf-split__body, .uzf-split__body--narrow { grid-column: 1 / -1; }
	.uzf-split__body { margin-top: var(--space-3); }
}

/* ボタン */
.uzf-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 12px 22px; font-weight: 700; text-decoration: none; border: 1px solid var(--lapis); background: var(--lapis); color: #fff; }
.uzf-btn:hover { background: var(--lapis-deep); border-color: var(--lapis-deep); color: #fff; }
.uzf-btn--ghost { background: transparent; color: var(--lapis); }
.uzf-btn--ghost:hover { background: var(--lapis); color: #fff; }
.uzf-btn--light { background: #fff; color: var(--ink); border-color: #fff; }
.uzf-btn--outline-light { background: transparent; color: #fff; border-color: #fff; }
.uzf-link { font-weight: 700; }

/* ---------- 最上部の帯・ヘッダー ---------- */
.uzf-topbar { background: var(--ink); color: #d9dbe2; font-family: var(--font-mono); font-size: 12.5px; }
.uzf-topbar .uzf-container { display: flex; justify-content: space-between; gap: var(--space-2); padding-block: 8px; flex-wrap: wrap; }

.uzf-header { border-bottom: 1px solid var(--line); background: var(--ground); }
.uzf-header .uzf-container { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding-block: 18px; }
.uzf-logo { display: flex; align-items: center; gap: 14px; color: var(--ink); text-decoration: none; }
.uzf-logo__mark { width: 40px; height: 40px; background: var(--lapis); display: grid; place-items: center; flex: none; }
.uzf-logo__mark::before { content: ""; width: 16px; height: 16px; border: 3px solid var(--turquoise); transform: rotate(45deg); }
.uzf-logo__text { display: flex; flex-direction: column; line-height: 1.3; }
.uzf-logo__name { font-family: var(--font-display); font-size: 22px; }
.uzf-logo__tag { font-size: 11.5px; color: var(--ink-subtle); }

.uzf-nav ul { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 28px; }
.uzf-nav a { color: var(--ink); text-decoration: none; font-weight: 700; font-size: 15px; }
.uzf-nav a:hover, .uzf-nav .current-menu-item > a, .uzf-nav .current-menu-ancestor > a { color: var(--lapis); }
.uzf-nav .menu-item-cta > a { background: var(--lapis); color: #fff; padding: 11px 20px; }
.uzf-nav .sub-menu { display: none; }
.uzf-menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); background: var(--surface); align-items: center; justify-content: center; flex-direction: column; gap: 5px; cursor: pointer; }
.uzf-menu-toggle span { width: 18px; height: 2px; background: var(--ink); }

@media (max-width: 1023px) {
	.uzf-menu-toggle { display: flex; }
	.uzf-nav { position: fixed; inset: 0; top: 0; background: var(--ground); padding: 88px var(--gutter) 40px; transform: translateY(-100%); transition: transform .25s ease; z-index: 50; overflow-y: auto; }
	.uzf-nav.is-open { transform: none; }
	.uzf-nav ul { flex-direction: column; align-items: stretch; gap: 0; }
	.uzf-nav li { border-bottom: 1px solid var(--line); }
	.uzf-nav a { display: block; padding: 16px 0; font-size: 17px; }
	.uzf-nav .menu-item-cta > a { margin-top: 16px; text-align: center; }
	.uzf-menu-toggle { position: relative; z-index: 60; }
	.uzf-logo__tag { display: none; }
}

.uzf-crumbs { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-subtle); padding-block: 14px; }
.uzf-crumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.uzf-crumbs li + li::before { content: "／"; margin-right: 6px; }
.uzf-crumbs a { color: var(--ink-subtle); text-decoration: none; }

/* ---------- ヒーロー（縦書き） ---------- */
.uzf-hero { position: relative; min-height: 640px; background: #35506f; overflow: hidden; color: #fff; }
.uzf-hero__img, .uzf-hero .uzf-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.uzf-hero .uzf-ph { color: #c9d4e3; background: #35506f; align-items: center; justify-content: center; }
.uzf-hero__title { position: absolute; top: 56px; right: max(var(--gutter), calc((100% - var(--max)) / 2)); margin: 0; writing-mode: vertical-rl; font-family: var(--font-display); font-weight: 400; font-size: clamp(36px, 4vw, 54px); line-height: 1.6; letter-spacing: .12em; text-shadow: 0 0 24px rgba(0,0,0,.25); }
.uzf-hero__text { position: absolute; left: max(var(--gutter), calc((100% - var(--max)) / 2)); bottom: 48px; max-width: 560px; display: flex; flex-direction: column; gap: 16px; }
.uzf-hero__text p { margin: 0; font-size: 17px; line-height: 2; }
.uzf-hero__credit { font-family: var(--font-mono); font-size: 12px; color: #c9d4e3; }
/* PC：写真の明るい部分（石畳・空）に乗る説明文を読めるよう、下から暗い幕を敷く。スマホは写真の暗部に乗るため不要 */
.uzf-hero__title, .uzf-hero__text { z-index: 1; }
@media (min-width: 768px) {
	.uzf-hero::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(to top, rgba(12, 18, 32, .82) 0%, rgba(12, 18, 32, .62) 26%, rgba(12, 18, 32, .2) 46%, rgba(12, 18, 32, 0) 62%), linear-gradient(to right, rgba(12, 18, 32, .45) 0%, rgba(12, 18, 32, .15) 38%, rgba(12, 18, 32, 0) 55%); }
	.uzf-hero__text p { text-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 2px 18px rgba(0, 0, 0, .5); }
}
@media (max-width: 767px) {
	.uzf-hero { min-height: 520px; }
	.uzf-hero__title { top: 28px; right: 24px; }
	.uzf-hero__text { left: 16px; right: 16px; bottom: 20px; }
	.uzf-hero__text p { font-size: 14px; }
}

/* ---------- 判子 ---------- */
.uzf-stamp { position: absolute; top: -24px; right: 28px; transform: rotate(-8deg); display: inline-flex; flex-direction: column; align-items: center; line-height: 1.3; padding: 7px 13px; border: 2px solid var(--stamp); color: var(--stamp); background: var(--ground); }
.uzf-stamp b { font-size: 13px; letter-spacing: .2em; }
.uzf-stamp span { font-family: var(--font-mono); font-size: 12px; }

/* ---------- 記帳欄 ---------- */
.uzf-ledger { position: relative; background: var(--surface); border: 1px solid var(--line); padding: 32px 36px; }
.uzf-ledger__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; border-bottom: 2px solid var(--ink); padding-bottom: 10px; font-weight: 700; }
.uzf-ledger__src { font-family: var(--font-mono); font-size: 12px; font-weight: 400; color: var(--ink-subtle); }
.uzf-ledger__rows { margin: 0; }
.uzf-ledger__row { display: grid; grid-template-columns: minmax(0, 1fr) 180px 120px; gap: 8px; padding: 13px 0; border-bottom: 1px solid var(--line-soft); font-size: 15px; }
.uzf-ledger__row dt { margin: 0; }
.uzf-ledger__row dd { margin: 0; }
.uzf-ledger__value { font-family: var(--font-mono); font-weight: 600; }
.uzf-ledger__date { font-family: var(--font-mono); font-size: 13px; color: var(--ink-subtle); }
.uzf-ledger__note { margin: 14px 0 0; font-size: 13px; line-height: 1.8; color: var(--ink-muted); }
@media (max-width: 640px) {
	.uzf-ledger { padding: 24px 18px; }
	.uzf-ledger__row { grid-template-columns: minmax(0, 1fr) auto; }
	.uzf-ledger__date { grid-column: 1 / -1; }
}

/* ---------- 切符 ---------- */
.uzf-ticket { display: grid; grid-template-columns: 220px minmax(0, 1fr) 190px; background: var(--surface); border: 1px solid var(--line); color: var(--ink); text-decoration: none; transition: border-color .15s; }
.uzf-ticket:hover { color: var(--ink); border-color: var(--lapis); }
.uzf-ticket__photo { min-height: 150px; background: var(--line-soft); overflow: hidden; }
.uzf-ticket__photo img { width: 100%; height: 100%; object-fit: cover; }
.uzf-ticket__body { padding: 20px 24px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.uzf-ticket__meta { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
.uzf-ticket.is-accent .uzf-ticket__meta { color: var(--stamp); }
.uzf-ticket__title { font-size: 22px; font-weight: 700; line-height: 1.5; }
.uzf-ticket__desc { font-size: 14px; color: var(--ink-muted); }
.uzf-ticket__stub { border-left: 2px dashed var(--line); padding: 20px; display: flex; flex-direction: column; justify-content: center; gap: 2px; transition: transform .2s ease; }
.uzf-ticket:hover .uzf-ticket__stub { transform: translateX(3px); }
.uzf-ticket__stub small { font-size: 12px; color: var(--ink-subtle); }
.uzf-ticket__price { font-family: var(--font-mono); font-size: 30px; font-weight: 600; line-height: 1.2; }
@media (max-width: 767px) {
	.uzf-ticket { grid-template-columns: 1fr; }
	.uzf-ticket__photo { height: 180px; }
	.uzf-ticket__body { padding: 14px 16px; }
	.uzf-ticket__title { font-size: 19px; }
	.uzf-ticket__stub { border-left: 0; border-top: 2px dashed var(--line); flex-direction: row; justify-content: space-between; align-items: baseline; padding: 12px 16px; }
	.uzf-ticket__price { font-size: 24px; }
}

/* ---------- 旅程の線 ---------- */
.uzf-route { background: var(--surface); border-bottom: 1px solid var(--line); }
.uzf-route__list { position: relative; list-style: none; margin: 0 auto; padding: 0 var(--gutter); max-width: calc(var(--max) + var(--gutter) * 2); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); }
.uzf-route__list::before { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); top: 41px; height: 2px; background: var(--lapis); transform-origin: left; }
.uzf-route__stop a { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 32px 12px 28px 0; color: var(--ink); text-decoration: none; }
.uzf-route__dot { width: 16px; height: 16px; border-radius: 50%; background: var(--surface); border: 3px solid var(--lapis); }
.uzf-route__stop.is-end .uzf-route__dot { background: var(--stamp); border-color: var(--stamp); }
.uzf-route__uz { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
.uzf-route__stop.is-end .uzf-route__uz { color: var(--stamp); }
.uzf-route__jp { font-size: 18px; font-weight: 700; }
.uzf-route__desc { font-size: 13.5px; color: var(--ink-muted); }
.uzf-route__stop a:hover .uzf-route__jp { color: var(--lapis); }
@media (max-width: 960px) {
	.uzf-route__list { display: flex; overflow-x: auto; gap: 28px; scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter); }
	/* 列車・車を追いかけている間は、駅で止まる動き（スナップ）を切ってなめらかに流す */
	.uzf-route__list.is-playing { scroll-snap-type: none; }
	.uzf-route__stop { flex: 0 0 auto; scroll-snap-align: start; }
	.uzf-route__desc { display: none; }
	.uzf-route__list::before { right: auto; width: 1200px; }
}
.js .uzf-route__list::before { animation: uzf-draw .8s ease-out both; }
@keyframes uzf-draw { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- 夜の帯・発車案内板 ---------- */
.uzf-night { background: var(--ink); color: var(--on-night); padding-block: 72px; margin-top: var(--section); }
.uzf-night .uzf-h2 { color: #fff; }
.uzf-night .uzf-split__head p { color: var(--on-night-muted); }
.uzf-night a:not(.uzf-btn) { color: #fff; }
.uzf-board { background: var(--board); font-family: var(--font-mono); font-size: 15px; color: var(--on-night); }
.uzf-board__row { display: grid; grid-template-columns: 140px minmax(0, 1fr) 150px 120px; gap: 8px; padding: 14px 20px; border-bottom: 1px solid #2c3142; }
.uzf-board__row--head { color: var(--board-amber); font-size: 12px; padding-block: 12px; }
.uzf-board__train { color: var(--board-amber); }
.uzf-board__note { margin: 0; padding: 12px 20px; font-size: 12px; color: #9a9eae; }
@media (max-width: 767px) {
	.uzf-board__row { grid-template-columns: 1fr 1fr; font-size: 13px; padding: 12px 14px; }
	.uzf-board__row--head { display: none; }
}

/* ---------- 便り（ブログ導線） ---------- */
.uzf-voice { background: var(--surface-blue); padding-block: 80px; margin-top: var(--section); }
.uzf-voice__quote { grid-column: 1 / span 3; display: flex; justify-content: center; }
.uzf-voice__quote p { margin: 0; writing-mode: vertical-rl; font-family: var(--font-voice); font-size: 26px; line-height: 2; letter-spacing: .08em; }
.uzf-voice__body { grid-column: 4 / span 9; display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.uzf-person { display: flex; align-items: center; gap: 16px; }
.uzf-person__img { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: #b9c4d6; flex: none; }
.uzf-person__img img { width: 100%; height: 100%; object-fit: cover; }
.uzf-person__name { font-size: 18px; font-weight: 700; }
.uzf-person__role { font-size: 13.5px; color: var(--ink-muted); }
.uzf-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.uzf-card { display: flex; flex-direction: column; gap: 10px; color: var(--ink); text-decoration: none; }
.uzf-card__img { aspect-ratio: 3 / 2; background: var(--line); overflow: hidden; }
.uzf-card__img img { width: 100%; height: 100%; object-fit: cover; }
.uzf-card__title { font-weight: 700; line-height: 1.6; }
.uzf-card:hover .uzf-card__title { color: var(--lapis); }
@media (max-width: 960px) {
	.uzf-voice__quote, .uzf-voice__body { grid-column: 1 / -1; }
	.uzf-voice__quote { justify-content: flex-start; margin-bottom: var(--space-3); }
	.uzf-voice__quote { justify-content: center; }
	.uzf-voice__quote p { font-size: 20px; }
	.uzf-cards { grid-template-columns: 1fr; }
}

/* ---------- 記事（ブログ・お知らせ・固定ページの本文） ---------- */
.uzf-article { max-width: 760px; margin-inline: auto; padding-block: 48px var(--section); }
.uzf-article__head { display: flex; flex-direction: column; gap: 12px; margin-bottom: 32px; }
.uzf-article__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(28px, 3.4vw, 40px); line-height: 1.45; }
.uzf-article__meta { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-subtle); display: flex; flex-wrap: wrap; gap: 16px; }
.uzf-article__eyecatch { margin: 0 0 32px; }
.uzf-prose { font-size: 17px; line-height: 2; }
.uzf-prose > * { margin-block: 0 1.4em; }
.uzf-prose h2 { margin-top: 2.6em; font-family: var(--font-display); font-weight: 400; font-size: 28px; line-height: 1.5; padding-bottom: 8px; border-bottom: 2px solid var(--ink); }
.uzf-prose h3 { margin-top: 2em; font-size: 20px; line-height: 1.6; }
.uzf-prose ul, .uzf-prose ol { padding-left: 1.4em; }
.uzf-prose li + li { margin-top: .4em; }
.uzf-prose figure { margin-inline: 0; }
.uzf-prose figcaption { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); margin-top: 6px; }
.uzf-prose blockquote { margin-inline: 0; padding: 4px 0 4px 20px; border-left: 2px solid var(--line); color: var(--ink-muted); }
.uzf-prose table { width: 100%; border-collapse: collapse; font-size: 15px; display: block; overflow-x: auto; }
.uzf-prose th, .uzf-prose td { padding: 10px 12px; border-bottom: 1px solid var(--line-soft); text-align: left; }
.uzf-prose th { border-bottom: 2px solid var(--ink); white-space: nowrap; }
.uzf-author-box { margin-top: 56px; padding: 24px; background: var(--surface-blue); }

/* 一覧 */
.uzf-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px var(--space-3); padding-block: 32px var(--section); }
@media (max-width: 960px) { .uzf-list { grid-template-columns: 1fr; } }
.uzf-pagination { display: flex; gap: 8px; justify-content: center; padding-bottom: var(--section); font-family: var(--font-mono); }
.uzf-pagination .page-numbers { min-width: 44px; min-height: 44px; display: inline-grid; place-items: center; border: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.uzf-pagination .current { background: var(--lapis); border-color: var(--lapis); color: #fff; }

/* ---------- フッター ---------- */
.uzf-footer { margin-top: var(--section); border-top: 1px solid var(--line); padding-block: 56px; font-size: 14px; color: var(--ink-muted); }
.uzf-footer__cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.uzf-footer__cols h2 { font-size: 14px; margin: 0 0 8px; color: var(--ink); }
.uzf-footer__cols ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.uzf-footer__cols a { color: var(--ink-muted); text-decoration: none; }
.uzf-footer__copy { margin-top: 40px; font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
@media (max-width: 767px) {
	.uzf-footer__cols { grid-template-columns: 1fr 1fr; }
	.uzf-footer__cols > div:first-child { grid-column: 1 / -1; }
}
/* トップは「便り」の帯からそのままフッターへつなぐ */
.home .uzf-footer { margin-top: 0; }

/* スマホ下部の固定ボタン */
.uzf-dock { display: none; }
@media (max-width: 767px) {
	.uzf-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); background: var(--surface); border-top: 1px solid var(--line); padding-bottom: env(safe-area-inset-bottom, 0px); }
	.uzf-dock a { min-height: 48px; display: grid; place-items: center; font-size: 13px; font-weight: 700; color: var(--ink); text-decoration: none; border-right: 1px solid var(--line); }
	.uzf-dock a:last-child { background: var(--lapis); color: #fff; border-right: 0; }
	body { padding-bottom: 56px; }
	/* reCAPTCHA の表示が価格表などに重ならないよう、左下へ寄せて小さくする（フォーム内に規約文を出す前提） */
	.grecaptcha-badge { visibility: hidden; }
}

/* 404 */
.uzf-404 { padding-block: var(--section); display: flex; flex-direction: column; gap: 16px; }

/* 動きを減らす設定 */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
}

/* 検索フォーム */
.search-form { display: flex; gap: 8px; max-width: 480px; }
.search-form label { flex: 1; }
.search-form .search-field { width: 100%; min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 2px; font: inherit; background: var(--surface); }
.search-form .search-submit { min-height: 44px; padding: 8px 18px; border: 1px solid var(--lapis); background: var(--lapis); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }

/* =========================================================
   v0.2.0 専用テンプレート（ツアー・口座LP・鉄道）
   ========================================================= */

/* 未確認の穴［…］：淡い朱の下線で、公開前の見落としを防ぐ */
.uzf-pending { color: var(--ink-subtle); background: linear-gradient(transparent 62%, rgba(176, 86, 46, .14) 0); }
.uzf-night .uzf-pending { color: var(--on-night-muted); background: linear-gradient(transparent 62%, rgba(242, 193, 78, .18) 0); }

.uzf-h1 { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.4; }
.uzf-note { margin: 0; font-size: 13px; color: var(--ink-subtle); }
.uzf-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.uzf-pagemeta { display: flex; flex-wrap: wrap; gap: 16px; font-family: var(--font-mono); font-size: 12.5px; color: var(--ink-subtle); margin-top: -6px; }
.uzf-pagemeta--night { margin: 0; color: #9a9eae; }

/* 写真のページヒーロー（ツアー） */
.uzf-pagehero { position: relative; min-height: 600px; display: flex; align-items: flex-end; background: #2b1d14; color: #fff; overflow: hidden; }
.uzf-pagehero__img, .uzf-pagehero .uzf-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.uzf-pagehero .uzf-ph { background: #2b1d14; color: #a98868; align-items: center; justify-content: center; font-size: 14px; }
.uzf-pagehero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(14, 9, 6, .86) 0%, rgba(14, 9, 6, .62) 30%, rgba(14, 9, 6, .15) 58%, rgba(14, 9, 6, 0) 75%), linear-gradient(to right, rgba(14, 9, 6, .5) 0%, rgba(14, 9, 6, .15) 45%, rgba(14, 9, 6, 0) 60%); pointer-events: none; }
.uzf-pagehero__inner { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; padding-block: 56px; }
.uzf-pagehero__text { display: flex; flex-direction: column; gap: 14px; max-width: 720px; }
.uzf-pagehero__kicker { font-family: var(--font-mono); font-size: 13px; color: #ffd9bd; text-shadow: 0 1px 2px rgba(0, 0, 0, .7); }
.uzf-pagehero__title, .uzf-pagehero__text p { text-shadow: 0 1px 2px rgba(0, 0, 0, .55), 0 2px 18px rgba(0, 0, 0, .5); }
.uzf-pagehero__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(36px, 4.2vw, 56px); line-height: 1.35; }
.uzf-pagehero__text p { margin: 0; color: #f1e6dc; font-size: 17px; line-height: 2; }
.uzf-pagehero__credit { font-family: var(--font-mono); font-size: 12px; color: #d8c2ad; white-space: nowrap; }
@media (max-width: 767px) {
	.uzf-pagehero { min-height: 480px; }
	.uzf-pagehero__inner { flex-direction: column; align-items: flex-start; padding-block: 28px; }
	.uzf-pagehero__text p { font-size: 15px; }
}

/* 本文＋右の固定欄 */
.uzf-layout { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--space-3); padding-top: 72px; align-items: start; }
.uzf-layout__main { grid-column: 1 / span 7; display: flex; flex-direction: column; gap: 56px; min-width: 0; }
.uzf-layout__aside { grid-column: 9 / span 4; align-self: stretch; }
.uzf-aside-sticky { position: sticky; top: 24px; display: flex; flex-direction: column; gap: 16px; }
.admin-bar .uzf-aside-sticky { top: 56px; }
.uzf-block { display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 960px) {
	.uzf-layout { display: flex; flex-direction: column; gap: 40px; padding-top: 40px; }
	.uzf-layout__main, .uzf-layout__aside { width: 100%; }
	/* ツアーは料金を先に見せる */
	.uzf-layout--price-first .uzf-layout__aside { order: -1; }
	.uzf-aside-sticky { position: static; }
}

/* 状況の札（判子つき） */
.uzf-note-card { position: relative; background: var(--surface); border: 1px solid var(--line); padding: 28px 32px; display: flex; flex-direction: column; gap: 8px; }
.uzf-note-card__title { margin: 0; font-size: 18px; }
.uzf-note-card p { margin: 0; color: var(--ink-muted); }
@media (max-width: 640px) { .uzf-note-card { padding: 28px 18px 22px; } }

/* 行程 */
.uzf-schedule { margin: 0; border-top: 2px solid var(--ink); }
.uzf-schedule__row { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 12px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.uzf-schedule dt { font-family: var(--font-mono); color: var(--stamp); font-size: 14px; padding-top: 2px; }
.uzf-schedule dd { margin: 0; }
@media (max-width: 640px) { .uzf-schedule__row { grid-template-columns: 1fr; gap: 2px; } }

/* 対比リスト */
.uzf-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.uzf-compare__title { margin: 0; font-size: 16px; padding-bottom: 8px; border-bottom: 2px solid var(--ink); }
.uzf-compare ul { list-style: none; margin: 0; padding: 0; }
.uzf-compare li { padding: 11px 0; border-bottom: 1px solid var(--line-soft); }
@media (max-width: 640px) { .uzf-compare { grid-template-columns: 1fr; gap: 32px; } }

/* よくある質問 */
.uzf-faq { border-top: 2px solid var(--ink); }
.uzf-faq__item { padding: 16px 0; border-bottom: 1px solid var(--line-soft); }
.uzf-faq__q { margin: 0; font-size: 16px; line-height: 1.7; }
.uzf-faq__a { margin: 6px 0 0; color: var(--ink-muted); }

/* 料金の札（ツアー） */
.uzf-price { background: var(--surface); border: 1px solid var(--line); }
.uzf-price__head { padding: 20px 24px; border-bottom: 2px dashed var(--line); display: flex; flex-direction: column; gap: 4px; }
.uzf-price__title { margin: 0; font-size: 16px; }
.uzf-price__rows { margin: 0; }
.uzf-price__rows > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; padding: 14px 24px; border-bottom: 1px solid var(--line-soft); }
.uzf-price__rows dd { margin: 0; font-family: var(--font-mono); font-weight: 600; font-size: 18px; }
.uzf-price__foot { padding: 20px 24px; display: flex; flex-direction: column; gap: 10px; }
.uzf-price__foot p { margin: 0; font-size: 13px; line-height: 1.7; color: var(--ink-muted); }
.uzf-staff { background: var(--surface-blue); padding: 20px 24px; display: flex; gap: 14px; align-items: center; }
.uzf-staff__img { width: 56px; height: 56px; border-radius: 50%; background: #b9c4d6; flex: none; }
.uzf-staff p { margin: 0; font-size: 13.5px; line-height: 1.7; }

/* 一緒に読まれているページ */
.uzf-related { margin-top: var(--section); border-top: 1px solid var(--line); padding-block: 56px 0; }
.uzf-related__head { margin: 0 0 20px; font-size: 18px; }
.uzf-related__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.uzf-related__item { display: flex; flex-direction: column; gap: 4px; padding-top: 12px; border-top: 2px solid var(--lapis); color: var(--ink); text-decoration: none; }
.uzf-related__title { font-weight: 700; }
.uzf-related__item:hover .uzf-related__title { color: var(--lapis); }
@media (max-width: 767px) { .uzf-related__list { grid-template-columns: 1fr; } }

/* LPの1画面目（口座・鉄道代行） */
.uzf-lp-hero { padding-top: 48px; align-items: start; }
.uzf-lp-hero__text { grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 22px; padding-top: 16px; }
.uzf-lp-hero__text .uzf-lead { margin: 0; }
.uzf-lp-hero__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(32px, 3.2vw, 44px); line-height: 1.45; }
.uzf-lp-hero__ledger { grid-column: 7 / span 6; margin-top: 24px; min-width: 0; }
@media (max-width: 960px) {
	.uzf-lp-hero__text, .uzf-lp-hero__ledger { grid-column: 1 / -1; }
	.uzf-lp-hero__ledger { margin-top: 48px; }
}

/* 見出し左・中身右の帯 */
.uzf-band__title { grid-column: 1 / span 4; }
.uzf-band__body { grid-column: 5 / span 8; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
@media (max-width: 960px) {
	.uzf-band__title, .uzf-band__body { grid-column: 1 / -1; }
	.uzf-band__body { margin-top: var(--space-3); }
}

/* 手順 */
.uzf-steps { list-style: none; margin: 0; padding: 0; position: relative; }
.uzf-steps::before { content: ""; position: absolute; left: 7px; top: 12px; bottom: 12px; width: 2px; background: var(--lapis); }
.uzf-steps__item { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); padding-bottom: 24px; }
.uzf-steps__item:last-child { padding-bottom: 0; }
.uzf-steps__dot { width: 16px; height: 16px; margin-top: 6px; border-radius: 50%; background: var(--surface); border: 3px solid var(--lapis); position: relative; }
.uzf-steps__item:last-child .uzf-steps__dot { background: var(--lapis); }
.uzf-steps__title { margin: 0; font-size: 16px; line-height: 1.7; }
.uzf-steps p { margin: 2px 0 0; color: var(--ink-muted); font-size: 15px; }

/* 表（銀行の比較） */
.uzf-table-wrap { margin-top: 20px; overflow-x: auto; background: var(--surface); border: 1px solid var(--line); }
.uzf-table { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 15px; }
.uzf-table th, .uzf-table td { text-align: left; padding: 14px 24px; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
.uzf-table thead th { font-size: 13px; border-bottom: 2px solid var(--ink); white-space: nowrap; }
.uzf-table tbody th { white-space: nowrap; }
.uzf-table tbody tr:last-child > * { border-bottom: 0; }
.uzf-table-wrap + .uzf-caption { margin: 10px 0 0; }
@media (max-width: 767px) { .uzf-table th, .uzf-table td { padding: 12px 14px; } }

/* リスク（夜の帯） */
.uzf-risk__list { margin: 0; }
.uzf-risk__list > div { padding: 18px 0; border-bottom: 1px solid #3a4052; }
.uzf-risk__list dt { font-weight: 700; color: #fff; }
.uzf-risk__list dd { margin: 4px 0 0; color: var(--on-night-muted); font-size: 15px; }
.uzf-risk .uzf-link { margin-top: 18px; }

/* 実績の数字 */
.uzf-stats { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.uzf-stats > div { display: flex; flex-direction: column-reverse; }
.uzf-stats dt { font-size: 13px; color: var(--ink-subtle); }
.uzf-stats dd { margin: 0; font-family: var(--font-mono); font-size: 30px; font-weight: 600; line-height: 1.4; }
.uzf-voices { margin: 0; color: var(--ink-muted); }
@media (max-width: 640px) { .uzf-stats { grid-template-columns: 1fr; gap: 12px; } .uzf-stats dd { font-size: 24px; } }

/* 相談の帯 */
.uzf-cta { padding: 48px; background: var(--surface); border: 1px solid var(--line); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: center; }
.uzf-cta__text p { margin: 0; color: var(--ink-muted); }
.uzf-cta__text .uzf-cta__title { font-family: var(--font-display); font-size: 28px; line-height: 1.5; color: var(--ink); margin-bottom: 6px; }
.uzf-cta__btn { padding-inline: 32px; min-height: 52px; }
@media (max-width: 767px) {
	.uzf-cta { grid-template-columns: 1fr; padding: 28px 20px; gap: 20px; }
	.uzf-cta__text .uzf-cta__title { font-size: 22px; }
}

.uzf-disclaimer { margin: var(--section) 0 0; padding-top: 32px; border-top: 1px solid var(--line); font-size: 13px; color: var(--ink-subtle); }

/* 鉄道：夜の帯から始まるページ */
.uzf-night--top { margin-top: 0; }
.uzf-night--top .uzf-h1 { color: #fff; }

/* 目次・横の導線 */
.uzf-toc { border-top: 2px solid var(--ink); padding-top: 12px; }
.uzf-toc__head { margin: 0 0 8px; font-size: 14px; }
.uzf-toc ol { margin: 0; padding-left: 1.4em; font-size: 14px; line-height: 1.7; }
.uzf-toc li + li { margin-top: 6px; }
.uzf-toc a { color: var(--ink-muted); text-decoration: none; }
.uzf-toc a:hover { color: var(--lapis); }
.uzf-side-cta { background: var(--surface); border: 1px solid var(--line); padding: 20px 24px; display: flex; flex-direction: column; gap: 10px; }
.uzf-side-cta__title { margin: 0; font-size: 16px; }
.uzf-side-cta p { margin: 0; font-size: 14px; line-height: 1.8; color: var(--ink-muted); }
.uzf-prose h2[id] { scroll-margin-top: 24px; }

/* 口座開設への送客（旅行系ページの下） */
.uzf-funnel { display: grid; gap: 6px; padding: 32px 36px; background: var(--surface-blue); color: var(--ink); text-decoration: none; border-left: 0; }
.uzf-funnel__title { font-family: var(--font-display); font-size: 24px; line-height: 1.5; }
.uzf-funnel__text { color: var(--ink-muted); }
.uzf-funnel:hover .uzf-funnel__title { color: var(--lapis); }
@media (max-width: 640px) { .uzf-funnel { padding: 24px 18px; } .uzf-funnel__title { font-size: 20px; } }

.uzf-extra { margin-top: 8px; }

/* 見出しは文節で改行（Chrome/Edge。未対応ブラウザは通常の改行） */
h1, h2, .uzf-h1, .uzf-h2, .uzf-lp-hero__title, .uzf-pagehero__title, .uzf-cta__title, .uzf-funnel__title { word-break: auto-phrase; }

/* 写真待ちの案内は右上に寄せ、見出しと重ねない */
.uzf-pagehero .uzf-ph { align-items: flex-start; justify-content: flex-end; padding: 24px var(--gutter); text-align: right; }

/* 銀行の表：スマホでは1行ずつカードにする */
@media (max-width: 767px) {
	.uzf-table-wrap--cards { overflow: visible; background: none; border: 0; }
	.uzf-table--banks { min-width: 0; }
	.uzf-table--banks thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.uzf-table--banks, .uzf-table--banks tbody, .uzf-table--banks tr, .uzf-table--banks th, .uzf-table--banks td { display: block; }
	.uzf-table--banks tr { background: var(--surface); border: 1px solid var(--line); margin-bottom: 12px; padding: 4px 16px 6px; }
	.uzf-table--banks tbody tr > th, .uzf-table--banks tbody tr:last-child > th { font-size: 16px; padding: 10px 0 8px; border-bottom: 2px solid var(--ink); }
	.uzf-table--banks td { display: grid; grid-template-columns: 5.5em minmax(0, 1fr); gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); }
	.uzf-table--banks td:last-child, .uzf-table--banks tbody tr:last-child > td:last-child { border-bottom: 0; }
	.uzf-table--banks td::before { font-size: 12.5px; color: var(--ink-subtle); padding-top: 2px; }
	.uzf-table--banks td > * { justify-self: start; }
	.uzf-table--banks td:nth-of-type(1)::before { content: "開設日数"; }
	.uzf-table--banks td:nth-of-type(2)::before { content: "カード受取"; }
	.uzf-table--banks td:nth-of-type(3)::before { content: "アプリ"; }
	.uzf-table--banks td:nth-of-type(4)::before { content: "SWIFT／設立"; }
	.uzf-table--banks td:nth-of-type(5)::before { content: "体験記"; }
	.uzf-cta__text .uzf-cta__title { font-size: 20px; }
}


/* ---------- v0.2.1 スマホのヘッダー：固定＋スクロールで低く／時刻とレートはメニュー内へ ---------- */
.uzf-nav__info { display: none; }
@media (max-width: 1023px) {
	.uzf-header { position: sticky; top: 0; z-index: 45; }
	.admin-bar .uzf-header { top: 46px; }
	.uzf-header .uzf-container { transition: padding .2s ease; }
	.uzf-logo__mark, .uzf-logo__name { transition: all .2s ease; }
	.uzf-header.is-compact { box-shadow: 0 1px 0 var(--line), 0 6px 16px rgba(30, 34, 48, .06); }
	.uzf-header.is-compact .uzf-container { padding-block: 8px; }
	.uzf-header.is-compact .uzf-logo__mark { width: 32px; height: 32px; }
	.uzf-header.is-compact .uzf-logo__mark::before { width: 12px; height: 12px; border-width: 2px; }
	.uzf-header.is-compact .uzf-logo__name { font-size: 18px; }
	html { scroll-padding-top: 72px; }
}
@media (max-width: 600px) {
	/* 600px以下では管理バーが固定されないため、ずらさない */
	.admin-bar .uzf-header { top: 0; }
}
@media (min-width: 783px) and (max-width: 1023px) {
	.admin-bar .uzf-header { top: 32px; }
}
@media (max-width: 767px) {
	.uzf-topbar { display: none; }
	.uzf-nav__info { display: flex; flex-direction: column; gap: 4px; margin-top: 32px; padding: 16px; background: var(--ink); color: #d9dbe2; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.8; }
}


/* ---------- 旅程の線：列車（実線）と車（破線）、国境 ---------- */
.uzf-route__fx { position: absolute; inset: 0; pointer-events: none; list-style: none; z-index: 1; }
.uzf-route__road, .uzf-route__border, .uzf-route__vehicle { display: none; }
.uzf-route__list.has-modes::before { left: var(--rail-l); right: auto; width: var(--rail-w); }
.has-modes .uzf-route__road { display: block; position: absolute; top: 41px; left: var(--road-l); width: var(--road-w); border-top: 2px dashed var(--stamp); }
.has-modes .uzf-route__border { display: block; position: absolute; top: 6px; left: var(--border-x); width: 0; height: 44px; }
.uzf-route__border[hidden] { display: none !important; }
.uzf-route__border small { position: absolute; left: 0; top: 0; transform: translateX(-50%); font-family: var(--font-mono); font-size: 11.5px; font-weight: 600; letter-spacing: .04em; color: var(--stamp); white-space: nowrap; }
.uzf-route__post { position: absolute; left: -1px; top: 20px; width: 3px; height: 26px; background: var(--ink); }
.uzf-route__gate { position: absolute; right: 0; top: 24px; width: 26px; height: 4px; background: repeating-linear-gradient(90deg, var(--stamp) 0 4px, #fff 4px 8px); border: 1px solid var(--stamp); transform-origin: right center; transition: transform .35s ease; }
.uzf-route__border.is-open .uzf-route__gate { transform: rotate(72deg); }
.has-modes .uzf-route__vehicle { display: block; position: absolute; left: 0; top: 28px; opacity: 0; transition: opacity .3s ease; will-change: transform; }
.uzf-route__vehicle svg { display: block; }
.uzf-route__vehicle--train { color: var(--lapis); }
.uzf-route__vehicle--car { color: var(--stamp); }
.uzf-route__vehicle.is-on { opacity: 1; }
.uzf-route__stop.is-passed .uzf-route__dot { background: var(--lapis); transition: background .2s; }
.uzf-route__stop.is-arrived .uzf-route__dot { animation: uzf-flame 1.4s ease-out 1; }
@keyframes uzf-flame {
	0% { box-shadow: 0 0 0 0 rgba(232, 112, 40, .7); }
	60% { box-shadow: 0 0 0 12px rgba(232, 112, 40, 0); }
	100% { box-shadow: 0 0 0 0 rgba(232, 112, 40, 0); }
}
@media (max-width: 960px) {
	.uzf-route__list.has-modes::before { right: auto; }
}

/* ---------- ツアー一覧 ---------- */
.uzf-listhead { padding-top: 48px; display: flex; flex-direction: column; gap: 16px; }
.uzf-listhead .uzf-lead { margin: 0; max-width: 46em; }
.uzf-filter { display: flex; flex-wrap: wrap; gap: 8px; }
.uzf-filter[hidden] { display: none; }
.uzf-filter__btn { min-height: 44px; padding: 8px 18px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.uzf-filter__btn[aria-pressed="true"] { background: var(--lapis); border-color: var(--lapis); color: #fff; }
.uzf-tourgroup__uz { font-family: var(--font-mono); font-size: 13px; color: var(--ink-subtle); }
.uzf-tourcard[hidden], .uzf-tourgroup[hidden] { display: none; }
.uzf-filter-empty { padding-block: 32px 0; }
.uzf-filter-empty .uzf-link { background: none; border: 0; padding: 0; font: inherit; font-weight: 700; color: var(--lapis); text-decoration: underline; cursor: pointer; }

/* ---------- リスク説明 ---------- */
.uzf-calc { margin-block: 8px 4px; }
.uzf-calc .uzf-table { min-width: 0; font-family: var(--font-mono); }
.uzf-calc .uzf-table tbody th { font-family: var(--font-sans); }
.uzf-calc tr.is-loss td { color: var(--stamp); font-weight: 600; }
@media (max-width: 640px) {
	.uzf-calc .uzf-table th, .uzf-calc .uzf-table td { white-space: normal; padding: 10px 10px; font-size: 14px; }
	.uzf-calc .uzf-table thead th { font-size: 12px; }
}
.uzf-sources { margin-top: 48px; padding: 20px 24px; background: var(--surface-blue); font-size: 14px; }
.uzf-sources h2 { margin: 0 0 8px; font-size: 15px; }
.uzf-sources ul { margin: 0; padding-left: 1.2em; color: var(--ink-muted); }
.uzf-layout--doc { padding-top: 32px; }
.uzf-layout--doc .uzf-article__head { margin-bottom: 8px; }
.uzf-layout--doc .uzf-lead { margin: 8px 0 0; }

/* ---------- 会社案内・特商法 ---------- */
.uzf-spec { margin: 0; border-top: 2px solid var(--ink); }
.uzf-spec > div { display: grid; grid-template-columns: 11em minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); }
.uzf-spec dt { font-weight: 700; font-size: 15px; }
.uzf-spec dd { margin: 0; color: var(--ink-muted); }
@media (max-width: 640px) { .uzf-spec > div { grid-template-columns: 1fr; gap: 2px; } }
.uzf-article .uzf-block + .uzf-block { margin-top: 56px; }
.uzf-article .uzf-spec + .uzf-extra, .uzf-article > .uzf-spec { margin-bottom: 0; }
.uzf-profile { padding: 24px 0; border-bottom: 1px solid var(--line-soft); }
.uzf-profile:first-of-type { border-top: 2px solid var(--ink); }
.uzf-profile__head { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
.uzf-profile__name { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 24px; }
.uzf-profile__name small { font-family: var(--font-sans); font-size: 13px; color: var(--ink-subtle); margin-left: 6px; }
.uzf-profile__title { font-size: 14px; color: var(--ink-muted); }
.uzf-profile p { margin: 0 0 8px; }
.uzf-linklist { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.uzf-linklist li { border-bottom: 1px solid var(--line-soft); }
.uzf-linklist a { display: block; padding: 13px 0; font-weight: 700; text-decoration: none; }
.uzf-linklist a::after { content: " →"; }

/* 写真の帯（v0.3.1）：1枠目を大きく。写真は固定ページのカスタムフィールド uzf_photos */
.uzf-photos { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-2); }
.uzf-photos--1 { grid-template-columns: minmax(0, 1fr); }
.uzf-photos__item { margin: 0; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.uzf-photos__img { aspect-ratio: 3 / 2; background: var(--line-soft); overflow: hidden; }
.uzf-photos__img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.uzf-photos--3 .uzf-photos__item:first-child { grid-column: 1 / -1; }
.uzf-photos--3 .uzf-photos__item:first-child .uzf-photos__img { aspect-ratio: 2 / 1; }
.uzf-block .uzf-photos { margin-top: var(--space-4); }
.uzf-photos .uzf-caption { line-height: 1.6; overflow-wrap: anywhere; }
@media (min-width: 768px) {
	.uzf-photos--2 { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
	.uzf-photos--2 .uzf-photos__img { aspect-ratio: auto; height: clamp(240px, 30vw, 420px); }
}
@media (max-width: 767px) {
	.uzf-photos { gap: var(--space-1); }
	.uzf-photos--2 { grid-template-columns: minmax(0, 1fr); }
	.uzf-photos--2 .uzf-photos__item + .uzf-photos__item .uzf-photos__img { aspect-ratio: 2 / 1; }
	.uzf-photos .uzf-caption { font-size: 11px; }
}

/* 口座LPの費用（v0.3.2） */
.uzf-fee { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 24px; margin: 0; padding-bottom: var(--space-2); border-bottom: 2px solid var(--ink); }
.uzf-fee__label { font-weight: 700; }
.uzf-fee__value { font-family: var(--font-mono); font-size: 32px; line-height: 1.2; }

/* 日ごとの流れ（v0.3.3）：上に全体の地図、下に日ごとの詳細。動きは JS が .is-anim をつけたときだけ */
.uzf-journey-wrap { display: flex; flex-direction: column; gap: var(--space-3); }
.uzf-jmap { list-style: none; margin: 0; padding: 18px 0 16px; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }
.uzf-jmap__node { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; }
.uzf-jmap__node::before { content: ""; position: absolute; top: 6px; right: 50%; width: 100%; height: 2px; background: var(--lapis); transform-origin: left; }
.uzf-jmap__node:first-child::before { display: none; }
.uzf-jmap__node.is-wait::before, .uzf-jmap__node.is-wait + .uzf-jmap__node::before { background: repeating-linear-gradient(90deg, var(--lapis) 0 5px, transparent 5px 10px); }
.uzf-jmap__dot { position: relative; z-index: 1; width: 14px; height: 14px; border-radius: 50%; background: var(--lapis); border: 2px solid var(--lapis); }
.uzf-jmap__node.is-wait .uzf-jmap__dot { width: 10px; height: 10px; margin-top: 2px; background: var(--ground); border-style: dashed; }
.uzf-jmap__node:last-child .uzf-jmap__dot { box-shadow: 0 0 0 4px var(--ground), 0 0 0 5px var(--lapis); }
.uzf-jmap__label { font-family: var(--font-mono); font-size: 12.5px; color: var(--ink); white-space: nowrap; }
.uzf-jmap__node.is-wait .uzf-jmap__label { color: var(--ink-subtle); }
.uzf-journey__intro { margin: 0; color: var(--ink-muted); }

.uzf-journey { list-style: none; margin: 0; padding: 0; position: relative; }
.uzf-journey::before, .uzf-journey::after { content: ""; position: absolute; left: 23px; top: 24px; bottom: 24px; width: 2px; background: var(--line); }
.uzf-journey::after { background: var(--lapis); transform-origin: top; transform: scaleY(var(--p, 1)); }
.uzf-journey__step { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 24px; padding-bottom: 40px; }
.uzf-journey__step:last-child { padding-bottom: 0; }
.uzf-journey__step.is-wait::before { content: ""; position: absolute; left: 23px; top: -40px; bottom: 0; width: 2px; z-index: 1; background: repeating-linear-gradient(to bottom, var(--ground) 0 6px, transparent 6px 12px); }
.uzf-journey__icon { position: relative; z-index: 2; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; border: 1.5px solid var(--lapis); background: var(--lapis); color: #fff; }
.uzf-journey__step.is-wait .uzf-journey__icon { width: 40px; height: 40px; margin: 4px; border-style: dashed; background: var(--ground); color: var(--lapis); }
.uzf-journey__body { min-width: 0; padding-top: 2px; }
.uzf-journey__day { display: inline-block; padding: 2px 8px; font-family: var(--font-mono); font-size: 12.5px; color: var(--lapis); border: 1px solid var(--lapis); }
.uzf-journey__step.is-wait .uzf-journey__day { color: var(--ink-subtle); border-style: dashed; border-color: var(--ink-subtle); }
.uzf-journey__title { margin: 10px 0 6px; font-size: 19px; line-height: 1.6; word-break: auto-phrase; }
.uzf-journey__body p { margin: 0; color: var(--ink-muted); line-height: 1.9; }
.uzf-journey__meta { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; }
.uzf-journey__meta > div { display: flex; align-items: baseline; gap: 8px; padding: 6px 12px; background: var(--surface); border: 1px solid var(--line); font-size: 14px; }
.uzf-journey__meta dt { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-subtle); }
.uzf-journey__meta dd { margin: 0; font-weight: 700; }
.uzf-journey__wait { display: grid; grid-template-columns: 168px minmax(0, 1fr); gap: 20px; align-items: start; margin-top: 12px; padding: 16px; background: var(--surface-blue); }
.uzf-journey__wait .uzf-journey__title { margin-top: 0; font-size: 17px; }
.uzf-journey__wait .uzf-link { display: inline-block; margin-top: 8px; font-weight: 700; }
.uzf-journey__img { aspect-ratio: 3 / 2; overflow: hidden; background: var(--line-soft); }
.uzf-journey__img img { display: block; width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 767px) {
	.uzf-jmap__label { font-size: 11px; }
	.uzf-journey::before, .uzf-journey::after, .uzf-journey__step.is-wait::before { left: 19px; }
	.uzf-journey__step { grid-template-columns: 40px minmax(0, 1fr); column-gap: 16px; padding-bottom: 32px; }
	.uzf-journey__icon { width: 40px; height: 40px; }
	.uzf-journey__icon .uzf-icon { width: 20px; height: 20px; }
	.uzf-journey__step.is-wait .uzf-journey__icon { width: 32px; height: 32px; }
	.uzf-journey__title { font-size: 17px; }
	.uzf-journey__wait { grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 12px; }
	.uzf-journey__img { aspect-ratio: 2 / 1; }
	.uzf-journey__meta > div { font-size: 13px; padding: 5px 10px; }
}

/* 動き：表示に合わせて地図の線が伸び、日が順に点く。縦の線はスクロールに合わせて伸びる */
.uzf-journey-wrap.is-anim .uzf-jmap__node::before { transform: scaleX(0); transition: transform .35s ease calc(var(--i) * .18s); }
.uzf-journey-wrap.is-anim .uzf-jmap__dot { transform: scale(.4); background: var(--ground); transition: transform .25s ease calc(var(--i) * .18s + .2s), background .25s ease calc(var(--i) * .18s + .2s); }
.uzf-journey-wrap.is-anim .uzf-jmap.is-in .uzf-jmap__node::before { transform: scaleX(1); }
.uzf-journey-wrap.is-anim .uzf-jmap.is-in .uzf-jmap__dot { transform: scale(1); background: var(--lapis); }
.uzf-journey-wrap.is-anim .uzf-jmap.is-in .uzf-jmap__node.is-wait .uzf-jmap__dot { background: var(--ground); }
.uzf-journey-wrap.is-anim .uzf-journey::after { transition: transform .1s linear; }
.uzf-journey-wrap.is-anim .uzf-journey__step:not(.is-wait) .uzf-journey__icon { background: var(--ground); color: var(--lapis); transition: background .3s ease, color .3s ease; }
.uzf-journey-wrap.is-anim .uzf-journey__step.is-in:not(.is-wait) .uzf-journey__icon { background: var(--lapis); color: #fff; animation: uzf-pop .35s ease; }
.uzf-journey-wrap.is-anim .uzf-journey__body { opacity: 0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease; }
.uzf-journey-wrap.is-anim .uzf-journey__step.is-in .uzf-journey__body { opacity: 1; transform: none; }
@keyframes uzf-pop { 0% { transform: scale(1); } 45% { transform: scale(1.12); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) {
	.uzf-journey-wrap.is-anim * { transition: none !important; animation: none !important; }
}

/* 仮置きの印（ステージング用。公開前にすべて外す） */
.uzf-tmp { display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px; font-family: var(--font-mono); font-size: 11px; font-weight: 600; line-height: 1.6; color: #8a5a00; background: #fff6df; border: 1px dashed #c08a1e; vertical-align: middle; max-width: 100%; }
.uzf-tmp::before { content: ""; width: 6px; height: 6px; flex: none; border-radius: 50%; background: #c08a1e; }

/* 旅の準備ハブ（v0.3.4） */
.uzf-ohead { align-items: end; padding-top: 24px; }
.uzf-ohead__text { grid-column: 1 / span 7; display: flex; flex-direction: column; gap: 16px; }
.uzf-ohead__kicker { font-family: var(--font-mono); font-size: 13px; color: var(--ink-subtle); }
.uzf-ohead__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(34px, 4.2vw, 54px); line-height: 1.4; word-break: auto-phrase; }
.uzf-ohead__text .uzf-lead { margin: 0; }
.uzf-ohead__toc { grid-column: 9 / span 4; display: flex; flex-direction: column; border-top: 2px solid var(--ink); }
.uzf-ohead__toc a { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); color: var(--ink); font-weight: 700; text-decoration: none; }
.uzf-ohead__toc a .uzf-icon { color: var(--lapis); flex: none; }
.uzf-ohead__toc a:hover { color: var(--lapis); }
.uzf-ohead__toc a::after { content: "↓"; margin-left: auto; font-family: var(--font-mono); color: var(--ink-subtle); }
.uzf-ohead2 { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 24px; margin-bottom: var(--space-3); }
.uzf-ohead2 p { margin: 0; color: var(--ink-muted); }

.uzf-basics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; border-top: 2px solid var(--ink); border-left: 1px solid var(--line); }
.uzf-basics__item { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 14px; padding: 20px 18px 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.uzf-basics__icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--surface-blue); color: var(--lapis); }
.uzf-basics dt { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
.uzf-basics dd { margin: 2px 0 0; display: flex; flex-direction: column; gap: 6px; align-items: flex-start; }
.uzf-basics dd strong { font-size: 18px; line-height: 1.5; }
.uzf-basics dd span:not(.uzf-tmp) { font-size: 13.5px; line-height: 1.8; color: var(--ink-muted); }

.uzf-months { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 6px; align-items: end; border-bottom: 2px solid var(--ink); }
.uzf-months__m { display: flex; flex-direction: column; align-items: center; gap: 6px; padding-bottom: 10px; min-width: 0; }
.uzf-months__temp { font-family: var(--font-mono); font-size: 11.5px; color: var(--ink-subtle); }
.uzf-months__bar { width: 100%; max-width: 40px; height: calc(var(--t) * 5px + 16px); background: var(--line); transform-origin: bottom; }
.uzf-months__m.is-best .uzf-months__bar { background: var(--lapis); }
.uzf-months__m.is-hot .uzf-months__bar { background: #d9a679; }
.uzf-months__m.is-cold .uzf-months__bar { background: #b9c4d6; }
.uzf-months__name { font-family: var(--font-mono); font-size: 13px; font-weight: 600; }
.uzf-months__tag { font-size: 11.5px; color: var(--ink-muted); white-space: nowrap; }
.uzf-months__m.is-best .uzf-months__tag { color: var(--lapis); font-weight: 700; }
.uzf-months__note { height: 2.7em; font-size: 10.5px; line-height: 1.3; color: var(--ink-subtle); text-align: center; }
.uzf-odetail .uzf-prose td:first-child { white-space: nowrap; }
.uzf-months.is-anim .uzf-months__bar { transform: scaleY(0); transition: transform .6s ease calc(var(--d, 0) * 1s); }
.uzf-months.is-anim.is-in .uzf-months__bar { transform: scaleY(1); }

.uzf-cities { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--space-2); }
.uzf-city { position: relative; grid-column: span 4; display: block; min-height: 300px; overflow: hidden; color: #fff; text-decoration: none; background: var(--ink); }
.uzf-city.is-wide { grid-column: span 8; }
.uzf-city:nth-child(3) { grid-column: span 7; }
.uzf-city:nth-child(4) { grid-column: span 5; }
.uzf-city__img, .uzf-city__img img, .uzf-city__img .uzf-ph { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.uzf-city__img img { transition: transform .6s ease; }
a.uzf-city:hover .uzf-city__img img { transform: scale(1.04); }
.uzf-city::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(14, 17, 26, .82) 0%, rgba(14, 17, 26, .35) 45%, rgba(14, 17, 26, 0) 70%); pointer-events: none; }
.uzf-city__text { position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 22px 24px; }
.uzf-city__no { font-family: var(--font-mono); font-size: 12px; color: rgba(255, 255, 255, .7); }
.uzf-city__uz { font-family: var(--font-mono); font-size: 13px; color: #ffd9bd; }
.uzf-city__jp { font-family: var(--font-display); font-size: 30px; line-height: 1.3; }
.uzf-city__desc { font-size: 14px; color: #eceef3; }
.uzf-city__more { margin-top: 6px; font-size: 13.5px; font-weight: 700; border-bottom: 1px solid rgba(255, 255, 255, .6); }
.uzf-city .uzf-tmp { margin-top: 6px; }
/* 写真の上の白文字は、ホバー・フォーカスでも白のまま（全体の a:hover の色を打ち消す）。代わりに写真を少し暗くし、下線を白くする */
a.uzf-city:hover, a.uzf-city:focus-visible, a.uzf-city:hover .uzf-city__jp, a.uzf-city:hover .uzf-city__more { color: #fff; }
.uzf-city::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(14, 17, 26, .28); opacity: 0; transition: opacity .3s ease; pointer-events: none; }
.uzf-city::after { z-index: 1; }
.uzf-city__text { z-index: 2; }
a.uzf-city:hover::before, a.uzf-city:focus-visible::before { opacity: 1; }
.uzf-city__more { transition: border-color .2s ease; }
a.uzf-city:hover .uzf-city__more { border-bottom-color: #fff; }
a.uzf-city:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
.uzf-regions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin-top: var(--space-2); padding-top: var(--space-2); border-top: 1px solid var(--line); }
.uzf-regions a, .uzf-regions > span:not(.uzf-caption):not(.uzf-tmp) { padding: 4px 12px; border: 1px solid var(--line); background: var(--surface); font-size: 14px; color: var(--ink); text-decoration: none; }
.uzf-regions > span:not(.uzf-caption):not(.uzf-tmp) { color: var(--ink-subtle); }

.uzf-topics { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }
.uzf-topics li { border-bottom: 1px solid var(--line); }
.uzf-topic { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 16px 4px; color: var(--ink); text-decoration: none; }
.uzf-topic__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--lapis); color: var(--lapis); transition: background .2s ease, color .2s ease; }
a.uzf-topic:hover .uzf-topic__icon { background: var(--lapis); color: #fff; }
.uzf-topic__text { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.uzf-topic__title { font-size: 17px; font-weight: 700; }
.uzf-topic__desc { font-size: 14px; color: var(--ink-muted); }
.uzf-topic__arrow { font-family: var(--font-mono); color: var(--lapis); transition: transform .2s ease; }
a.uzf-topic:hover .uzf-topic__arrow { transform: translateX(4px); }
.uzf-topic.is-soon .uzf-topic__icon { border-style: dashed; border-color: var(--ink-subtle); color: var(--ink-subtle); }
.uzf-topic.is-soon .uzf-topic__title { color: var(--ink-muted); }

.uzf-odetail .uzf-extra { max-width: 860px; margin-inline: auto; }
.uzf-band__body > .uzf-tmp { align-self: flex-start; }

@media (max-width: 960px) {
	.uzf-ohead__text, .uzf-ohead__toc { grid-column: 1 / -1; }
	.uzf-ohead__toc { margin-top: var(--space-3); display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
	.uzf-basics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.uzf-topics { margin-top: var(--space-3); }
	.uzf-city, .uzf-city.is-wide, .uzf-city:nth-child(3), .uzf-city:nth-child(4) { grid-column: span 6; }
}
@media (max-width: 767px) {
	.uzf-ohead__toc a { font-size: 14px; padding: 10px 0; }
	.uzf-basics__item { grid-template-columns: 1fr; grid-template-rows: none; align-content: start; padding: 14px 12px; row-gap: 8px; }
	.uzf-basics__icon { grid-row: auto; width: 34px; height: 34px; }
	.uzf-basics__icon .uzf-icon { width: 20px; height: 20px; }
	.uzf-basics dd strong { font-size: 16px; }
	.uzf-basics dd span:not(.uzf-tmp) { font-size: 12.5px; }
	.uzf-months { grid-template-columns: repeat(6, minmax(0, 1fr)); row-gap: 18px; border-bottom: 0; }
	.uzf-months__m { border-bottom: 2px solid var(--ink); }
	.uzf-months__bar { height: calc(var(--t) * 3px + 12px); }
	.uzf-months__note { display: none; }
	.uzf-cities { grid-template-columns: minmax(0, 1fr); gap: var(--space-1); }
	.uzf-city, .uzf-city.is-wide, .uzf-city:nth-child(3), .uzf-city:nth-child(4) { grid-column: 1 / -1; min-height: 220px; }
	.uzf-city__jp { font-size: 24px; }
	.uzf-topic { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 12px; }
	.uzf-topic__icon { width: 40px; height: 40px; }
	.uzf-topic .uzf-tmp { grid-column: 2; justify-self: start; }
}
@media (prefers-reduced-motion: reduce) {
	.uzf-months__bar, .uzf-city__img img, .uzf-topic__arrow { transition: none !important; transform: none !important; }
}

/* 鉄道・移動ハブ（v0.3.6） */
.uzf-pagehero--rail { background: #1b2433; }
.uzf-pagehero--rail .uzf-pagehero__img { object-position: center 60%; }
.uzf-pagehero--rail::after { background: linear-gradient(to top, rgba(10, 14, 24, .86) 0%, rgba(10, 14, 24, .55) 32%, rgba(10, 14, 24, .1) 60%, rgba(10, 14, 24, 0) 75%), linear-gradient(to right, rgba(10, 14, 24, .5) 0%, rgba(10, 14, 24, .12) 45%, rgba(10, 14, 24, 0) 60%); }
.uzf-pagehero--rail .uzf-pagehero__kicker { color: #cfe0ff; }
.uzf-caption--night { color: var(--on-night-muted); }

.uzf-modes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }
.uzf-modes li + li { border-left: 1px solid var(--line); }
.uzf-mode { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; grid-template-rows: auto 1fr; column-gap: 14px; row-gap: 4px; height: 100%; padding: 20px 20px 20px 0; color: var(--ink); text-decoration: none; }
.uzf-modes li + li .uzf-mode { padding-left: 20px; }
.uzf-mode__icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--lapis); color: #fff; }
.uzf-mode__title { font-size: 19px; font-weight: 700; align-self: center; }
.uzf-mode__text { grid-column: 2; font-size: 14px; line-height: 1.8; color: var(--ink-muted); }
.uzf-mode__arrow { grid-column: 3; grid-row: 1; align-self: center; font-family: var(--font-mono); color: var(--lapis); transition: transform .2s ease; }
a.uzf-mode:hover { color: var(--ink); }
a.uzf-mode:hover .uzf-mode__title { color: var(--lapis); }
a.uzf-mode:hover .uzf-mode__arrow { transform: translateY(3px); }

.uzf-board--5 .uzf-board__row { grid-template-columns: 110px minmax(0, 1fr) 120px 96px 90px; }
.uzf-split__head .uzf-tmp { margin-top: 4px; }

.uzf-tr-photo { position: relative; overflow: hidden; background: var(--line-soft); }
.uzf-tr-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.uzf-tr-photo .uzf-ph { position: absolute; inset: 0; }
.uzf-tr-photo__cap { position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 10px 6px; font-family: var(--font-mono); font-size: 10.5px; line-height: 1.4; color: #fff; background: linear-gradient(to top, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0)); }

.uzf-trains { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-3); align-items: start; }
.uzf-train { display: flex; flex-direction: column; background: var(--surface); border: 1px solid var(--line); }
.uzf-train__photo { aspect-ratio: 16 / 9; }
.uzf-train:nth-child(2) .uzf-train__photo { aspect-ratio: 4 / 3; }
.uzf-train__body { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 20px 22px 22px; }
.uzf-train__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 24px; line-height: 1.4; }
.uzf-train__body p { margin: 0; color: var(--ink-muted); line-height: 1.9; }
.uzf-train__facts { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.uzf-train__facts li { padding: 3px 10px; font-size: 13px; font-weight: 700; color: var(--lapis); border: 1px solid var(--lapis); }

.uzf-ways { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); align-items: stretch; }
.uzf-way { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 24px 22px; background: var(--surface); border: 1px solid var(--line); }
.uzf-way.is-ours { border: 2px solid var(--lapis); }
.uzf-way__no { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
.uzf-way__title { margin: 0; font-size: 19px; }
.uzf-way p { margin: 0; color: var(--ink-muted); }
.uzf-way ul { margin: 0; padding-left: 1.2em; font-size: 14.5px; line-height: 1.9; }
.uzf-way .uzf-btn, .uzf-way .uzf-link { margin-top: auto; }

.uzf-carintro { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: var(--space-4); align-items: center; margin-bottom: var(--space-4); }
.uzf-carintro__photo { aspect-ratio: 3 / 2; }
.uzf-carintro__text { display: flex; flex-direction: column; gap: 14px; }
.uzf-carintro__text p { margin: 0; color: var(--ink-muted); line-height: 2; }
.uzf-carintro__lead { font-size: 17px; color: var(--ink) !important; }
.uzf-apps { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.uzf-app { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--surface); border: 1px solid var(--line); }
.uzf-app__icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 8px; background: var(--surface-blue); color: var(--lapis); flex: none; }
.uzf-app strong { display: block; font-size: 15px; }
.uzf-app small { display: block; font-size: 12px; color: var(--ink-subtle); }

.uzf-carcompare th[scope="row"] { white-space: nowrap; font-weight: 700; }
.uzf-carcompare .is-ours { background: #f3f6fc; }
.uzf-carcompare thead .is-ours { color: var(--lapis); }

.uzf-fares > div { grid-template-columns: minmax(0, 1fr) auto; }
.uzf-fares dd { font-family: var(--font-mono); font-weight: 600; color: var(--ink); text-align: right; white-space: nowrap; }
.uzf-plane-photo { aspect-ratio: 3 / 2; margin-top: var(--space-2); }

@media (max-width: 960px) {
	.uzf-modes { grid-template-columns: minmax(0, 1fr); }
	.uzf-modes li + li { border-left: 0; border-top: 1px solid var(--line); }
	.uzf-modes li + li .uzf-mode { padding-left: 0; }
	.uzf-trains, .uzf-carintro { grid-template-columns: minmax(0, 1fr); }
	.uzf-ways { margin-top: var(--space-3); }
}
@media (max-width: 767px) {
	.uzf-mode { padding: 14px 0; }
	.uzf-mode__title { font-size: 17px; }
	.uzf-ways { grid-template-columns: minmax(0, 1fr); }
	.uzf-board--5 .uzf-board__row { grid-template-columns: 1fr 1fr; }
	.uzf-board--5 .uzf-board__row > span:nth-child(2) { grid-column: 1 / -1; order: -1; color: #fff; }
	.uzf-carintro__lead { font-size: 15.5px; }
	.uzf-fares > div { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
	.uzf-fares dd { white-space: normal; }
	/* スマホは写真を上、文字を下に分けて、列車が文字に隠れないようにする */
	.uzf-pagehero--rail { flex-direction: column; align-items: stretch; min-height: 0; }
	.uzf-pagehero--rail .uzf-pagehero__img { position: relative; inset: auto; height: 240px; object-position: 64% 62%; }
	.uzf-pagehero--rail::after { inset: 0 0 auto 0; height: 240px; background: linear-gradient(to top, #1b2433 0%, rgba(27, 36, 51, 0) 35%); }
	.uzf-pagehero--rail .uzf-pagehero__inner { padding-block: 4px 28px; }
	.uzf-pagehero__credit { white-space: normal; font-size: 10.5px; line-height: 1.5; }
	/* 比較表はスマホではカードに組み替える（「弊社の手配」の列が画面外に隠れないように） */
	.uzf-carcompare { overflow: visible; border: 0; background: none; }
	.uzf-carcompare table { min-width: 0; }
	.uzf-carcompare thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.uzf-carcompare table, .uzf-carcompare tbody, .uzf-carcompare tr, .uzf-carcompare th, .uzf-carcompare td { display: block; }
	.uzf-carcompare tr { margin-bottom: 10px; padding: 4px 14px 6px; background: var(--surface); border: 1px solid var(--line); }
	.uzf-carcompare th[scope="row"] { padding: 10px 0 8px; border-bottom: 2px solid var(--ink); white-space: normal; }
	.uzf-carcompare td { display: grid; grid-template-columns: 6.2em minmax(0, 1fr); gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); font-size: 14px; }
	.uzf-carcompare td:last-child { border-bottom: 0; }
	.uzf-carcompare td.is-ours { background: none; }
	.uzf-carcompare td::before { font-size: 12px; color: var(--ink-subtle); padding-top: 2px; }
	.uzf-carcompare td:nth-of-type(1)::before { content: "配車アプリ"; }
	.uzf-carcompare td:nth-of-type(2)::before { content: "弊社の手配"; color: var(--lapis); font-weight: 700; }
}

/* ツアー個別・お問い合わせ・スタッフ・お客様の声（v0.3.7） */
.uzf-checks { list-style: none; margin: 4px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.uzf-checks li { position: relative; padding-left: 26px; line-height: 1.8; }
.uzf-checks li::before { content: ""; position: absolute; left: 2px; top: .55em; width: 12px; height: 7px; border-left: 2px solid var(--lapis); border-bottom: 2px solid var(--lapis); transform: rotate(-45deg); }
.uzf-block .uzf-h2 .uzf-tmp { margin-left: 8px; font-size: 11px; vertical-align: 6px; }
.uzf-price__head .uzf-tmp { margin-top: 6px; }

.uzf-contact-facts { margin: 0; }
.uzf-contact-facts > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.uzf-contact-facts dt { display: flex; align-items: center; gap: 10px; font-weight: 700; }
.uzf-contact-facts dt .uzf-icon { color: var(--lapis); }
.uzf-contact-facts dd { margin: 0; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; color: var(--ink-muted); font-size: 14.5px; }

.uzf-form { display: flex; flex-direction: column; gap: var(--space-4); }
.uzf-form__tmp { margin: 0; }
.uzf-form__step { margin: 0; padding: 0; border: 0; display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.uzf-form__step legend { display: flex; align-items: center; gap: 12px; padding: 0 0 12px; margin-bottom: 4px; width: 100%; font-size: 19px; font-weight: 700; border-bottom: 2px solid var(--ink); }
.uzf-form__step legend span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--lapis); color: #fff; font-family: var(--font-mono); font-size: 14px; }
.uzf-services { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.uzf-service { position: relative; display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 8px; text-align: center; background: var(--surface); border: 1px solid var(--line); cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.uzf-service input { position: absolute; opacity: 0; pointer-events: none; }
.uzf-service__icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid var(--lapis); color: var(--lapis); transition: background .2s ease, color .2s ease; }
.uzf-service__name { font-size: 14px; font-weight: 700; line-height: 1.5; }
.uzf-service:hover { border-color: var(--lapis); }
.uzf-service:has(input:checked) { border: 2px solid var(--lapis); background: #f3f6fc; padding: 15px 7px; }
.uzf-service:has(input:checked) .uzf-service__icon { background: var(--lapis); color: #fff; }
.uzf-service:has(input:focus-visible) { outline: 3px solid var(--lapis); outline-offset: 2px; }
.uzf-form__group { display: flex; flex-direction: column; gap: 18px; }
.uzf-form__group[hidden] { display: none; }
.uzf-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.uzf-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.uzf-field label { display: flex; flex-direction: column; gap: 6px; }
.uzf-field__label { display: flex; align-items: center; gap: 8px; font-size: 14.5px; font-weight: 700; }
.uzf-field__label em, .uzf-form__group > .uzf-field__label em { font-style: normal; font-size: 11px; font-weight: 700; color: #fff; background: var(--stamp); padding: 1px 6px; }
.uzf-field small { font-size: 12.5px; color: var(--ink-subtle); }
.uzf-form input[type="text"], .uzf-form input[type="email"], .uzf-form input[type="tel"], .uzf-form input[type="date"], .uzf-form input[type="time"], .uzf-form select, .uzf-form textarea { width: 100%; min-height: 46px; padding: 10px 12px; font: inherit; font-size: 16px; color: var(--ink); background: var(--surface); border: 1px solid #c9c6bc; border-radius: 4px; }
.uzf-form textarea { min-height: 120px; resize: vertical; }
.uzf-form input:focus, .uzf-form select:focus, .uzf-form textarea:focus { outline: 2px solid var(--lapis); outline-offset: 0; border-color: var(--lapis); }
.uzf-form__check { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.uzf-form__check label { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.uzf-form__check input, .uzf-form__agree input { width: 18px; height: 18px; accent-color: var(--lapis); }
.uzf-form__add { margin: 0; font-size: 14px; font-weight: 700; color: var(--lapis); }
.uzf-form__hint { margin: 0; color: var(--ink-muted); }
.uzf-form__agree { display: flex; align-items: center; gap: 8px; font-size: 15px; }
.uzf-form__submit { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding-top: var(--space-3); border-top: 1px solid var(--line); }
.uzf-form__submit .uzf-btn { min-width: 240px; }
.uzf-form__submit small { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink-subtle); }

.uzf-examples { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 2px solid var(--ink); }
.uzf-example { display: flex; flex-direction: column; gap: 8px; padding: 22px 22px 22px 0; }
.uzf-example + .uzf-example { padding-left: 22px; border-left: 1px solid var(--line); }
.uzf-example__no { font-family: var(--font-mono); font-size: 12px; color: var(--ink-subtle); }
.uzf-example__title { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 22px; }
.uzf-example__route { margin: 0; font-family: var(--font-mono); font-size: 13px; color: var(--lapis); }
.uzf-example p:last-child { margin: 0; color: var(--ink-muted); line-height: 1.9; }

.uzf-people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin-top: var(--space-2); }
.uzf-person-card { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 20px; padding: 20px; background: var(--surface); border: 1px solid var(--line); }
.uzf-person-card.is-lead { grid-column: 1 / -1; grid-template-columns: 240px minmax(0, 1fr); }
.uzf-person-card__photo { position: relative; aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: var(--line-soft); }
.uzf-person-card__photo .uzf-ph { position: absolute; inset: 0; align-items: center; justify-content: center; text-align: center; }
.uzf-person-card__body { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.uzf-person-card__name { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: 26px; }
.uzf-person-card__name small { font-family: var(--font-sans); font-size: 13px; color: var(--ink-subtle); }
.uzf-person-card__body p { margin: 0; color: var(--ink-muted); line-height: 1.9; }

.uzf-stats--big { padding-bottom: 28px; }
.uzf-stats--big dd { font-size: 44px; }
.uzf-stats--big dd small { margin-left: 4px; font-size: 16px; }
.uzf-voices-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.uzf-voicecard { margin: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; padding: 24px; background: var(--surface); border: 1px solid var(--line); border-top: 3px solid var(--lapis); }
.uzf-voicecard blockquote { margin: 0; font-family: var(--font-voice); font-size: 16px; line-height: 2; }
.uzf-voicecard blockquote p { margin: 0; }
.uzf-voicecard figcaption { display: flex; flex-direction: column; gap: 2px; padding-top: 12px; border-top: 1px solid var(--line-soft); }
.uzf-voicecard__who { font-weight: 700; }
.uzf-voicecard__meta { font-size: 13px; color: var(--ink-subtle); }

@media (max-width: 960px) {
	.uzf-services { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.uzf-examples, .uzf-voices-list { grid-template-columns: minmax(0, 1fr); }
	.uzf-example, .uzf-example + .uzf-example { padding: 18px 0; border-left: 0; }
	.uzf-example + .uzf-example { border-top: 1px solid var(--line); }
	.uzf-people { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
	.uzf-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.uzf-form__row { grid-template-columns: minmax(0, 1fr); }
	.uzf-form__row > span:empty { display: none; }
	.uzf-person-card, .uzf-person-card.is-lead { grid-template-columns: 96px minmax(0, 1fr); gap: 14px; padding: 16px; }
	.uzf-person-card__name { font-size: 21px; }
	.uzf-stats--big dd { font-size: 32px; }
	.uzf-form__submit .uzf-btn { width: 100%; }
}

/* 海外口座ガイドの入口（v0.3.8） */
.uzf-pagehero--money { background: #15233f; }
.uzf-pagehero--money::after { background: linear-gradient(to top, rgba(9, 16, 32, .88) 0%, rgba(9, 16, 32, .6) 32%, rgba(9, 16, 32, .12) 60%, rgba(9, 16, 32, 0) 78%), linear-gradient(to right, rgba(9, 16, 32, .55) 0%, rgba(9, 16, 32, .15) 45%, rgba(9, 16, 32, 0) 60%); }
.uzf-pagehero--money .uzf-pagehero__kicker { color: #cfe0ff; }
.uzf-pagemeta--money { align-items: center; margin-top: 18px; }

.uzf-countries .uzf-table { min-width: 860px; }
.uzf-countries tbody th { white-space: nowrap; font-weight: 700; }
.uzf-countries tr.is-ours > * { background: #f3f6fc; }
.uzf-countries tr.is-ours th { color: var(--lapis); border-left: 3px solid var(--lapis); }
.uzf-countries__badge { display: inline-block; margin-left: 8px; padding: 1px 6px; font-size: 11px; color: #fff; background: var(--lapis); vertical-align: 2px; }
.uzf-countries + .uzf-caption { margin-top: 12px; }

.uzf-night .uzf-ohead2 p { color: var(--on-night-muted); }
.uzf-ohead2--stack { flex-direction: column; align-items: flex-start; justify-content: flex-start; }
.uzf-risks { list-style: none; margin: 8px 0 32px; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid rgba(255, 255, 255, .22); }
.uzf-risk { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 24px 22px 8px 0; }
.uzf-risk + .uzf-risk { padding-left: 22px; border-left: 1px solid rgba(255, 255, 255, .14); }
.uzf-risk__no { font-family: var(--font-mono); font-size: 12px; color: var(--on-night-muted); }
.uzf-risk__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid #f2c14e; color: #f2c14e; }
.uzf-risk__title { margin: 0; font-size: 18px; color: #fff; }
.uzf-risk p { margin: 0; color: var(--on-night-muted); line-height: 1.9; font-size: 14.5px; }
.uzf-btn--onnight { background: #fff; color: var(--ink); border-color: #fff; }
.uzf-btn--onnight:hover { background: transparent; color: #fff; }

.uzf-mguide { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4) var(--space-5, 48px); }
.uzf-mguide__group { min-width: 0; }
.uzf-mguide__head { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 4px 12px; padding-bottom: 12px; border-bottom: 2px solid var(--ink); }
.uzf-mguide__no { font-family: var(--font-mono); font-size: 13px; color: var(--lapis); }
.uzf-mguide__head h3 { margin: 0; font-size: 20px; }
.uzf-mguide__head p { grid-column: 2; margin: 0; font-size: 13.5px; color: var(--ink-subtle); }
.uzf-mguide ul { list-style: none; margin: 0; padding: 0; }
.uzf-marticle { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; padding: 14px 0; border-bottom: 1px solid var(--line); text-decoration: none; color: var(--ink); }
.uzf-marticle__title { font-weight: 700; line-height: 1.6; }
.uzf-marticle__desc { grid-column: 1; font-size: 13.5px; color: var(--ink-muted); line-height: 1.7; }
.uzf-marticle__arrow, .uzf-marticle__soon { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
.uzf-marticle__arrow { color: var(--lapis); transition: transform .2s ease; }
.uzf-marticle__soon { font-size: 11px; font-weight: 700; color: #8a6a1f; border: 1px dashed #d9a53a; background: #fff8e6; padding: 2px 8px; white-space: nowrap; }
a.uzf-marticle:hover { color: var(--ink); }
a.uzf-marticle:hover .uzf-marticle__title { color: var(--lapis); text-decoration: underline; text-underline-offset: 3px; }
a.uzf-marticle:hover .uzf-marticle__arrow { transform: translateX(4px); }
.uzf-marticle.is-soon .uzf-marticle__title { color: var(--ink-muted); }

.uzf-mnote { margin-top: var(--space-4); }
.uzf-mnote p { margin: 0; padding: 16px 20px; font-size: 13.5px; color: var(--ink-muted); background: var(--surface); border-left: 3px solid var(--line); line-height: 1.9; }

@media (max-width: 960px) {
	.uzf-risks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.uzf-risk:nth-child(3) { padding-left: 0; border-left: 0; }
	.uzf-risk:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .14); }
	.uzf-mguide { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 767px) {
	.uzf-pagehero--money { min-height: 520px; }
	.uzf-risks { grid-template-columns: minmax(0, 1fr); }
	.uzf-risk, .uzf-risk + .uzf-risk { padding: 20px 0 16px; border-left: 0; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 6px 14px; }
	.uzf-risk + .uzf-risk { border-top: 1px solid rgba(255, 255, 255, .14); }
	.uzf-risk__no { grid-column: 1 / -1; }
	.uzf-risk__icon { grid-row: span 2; }
	.uzf-risk__title { align-self: center; }
	.uzf-risk p { grid-column: 2; }
	/* 国の比較表はスマホではカードに組み替える */
	.uzf-countries { overflow: visible; border: 0; background: none; }
	.uzf-countries .uzf-table { min-width: 0; }
	.uzf-countries thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
	.uzf-countries table, .uzf-countries tbody, .uzf-countries tr, .uzf-countries th, .uzf-countries td { display: block; }
	.uzf-countries tr { margin-bottom: 10px; padding: 4px 14px 6px; background: var(--surface); border: 1px solid var(--line); }
	.uzf-countries tr.is-ours { border: 2px solid var(--lapis); }
	.uzf-countries tr.is-ours > * { background: none; }
	.uzf-countries tr.is-ours th { border-left: 0; }
	.uzf-countries tbody th { padding: 10px 0 8px; border-bottom: 2px solid var(--ink); white-space: normal; }
	.uzf-countries td { display: grid; grid-template-columns: 5.5em minmax(0, 1fr); gap: 8px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); font-size: 14px; }
	.uzf-countries td:last-child { border-bottom: 0; }
	.uzf-countries td::before { content: attr(data-label); font-size: 12px; color: var(--ink-subtle); padding-top: 2px; }
}
.uzf-voices-list--narrow { grid-template-columns: minmax(0, 1fr); margin: 14px 0 18px; }