/* =========================================================
   岐れ道 Wakaremichi — main.css
   昼（和紙と墨）／夜（星の路線図）は html[data-time] で切り替え
   ========================================================= */

:root,
:root[data-time="day"] {
	--bg: #F4EFE4;
	--bg-alt: #EDE6D6;
	--surface: #F8F4EA;
	--ink: #1F1D1A;
	--ink-2: #3A372F;
	--muted: #5B564C;
	--line: #D8CFBA;
	--accent: #4A5D3A;
	--accent-ink: #FFFFFF;
	--eyebrow: #4A5D3A;
	--solid-bg: #1F1D1A;
	--solid-ink: #F4EFE4;
	--band-bg: #1F1D1A;
	--band-ink: #F4EFE4;
	--band-muted: #D8D0BD;
	--band-sub: #C9BFA8;
	--band-line: #5B564C;
	--placeholder: #E2D9C4;
	--map-bg: #EDE6D6;
	--map-ink: #1F1D1A;
	--c-tera: #1F1D1A;
	--c-yato: #4A5D3A;
	--c-umi: #2F4A63;
	--c-shoku: #8A4B2F;
	--hub: #1F1D1A;
	--hub-in: #F4EFE4;
	--fork-yato-bg: #E7EBDD;
	--fork-yato-ink: #3B4A2E;
	--fork-umi-bg: #E3E7EC;
	--fork-umi-ink: #2F4A63;
	--footer-bg: #1F1D1A;
	--footer-ink: #D8D0BD;
	--focus: #2F4A63;
	color-scheme: light;
}

:root[data-time="night"] {
	--bg: #0E1626;
	--bg-alt: #16213A;
	--surface: #16213A;
	--ink: #E8E4D8;
	--ink-2: #C9CDD6;
	--muted: #A9B0C0;
	--line: #2F3D5E;
	--accent: #E9C873;
	--accent-ink: #0E1626;
	--eyebrow: #E9C873;
	--solid-bg: #E9C873;
	--solid-ink: #0E1626;
	--band-bg: #16213A;
	--band-ink: #E8E4D8;
	--band-muted: #C9CDD6;
	--band-sub: #A9B0C0;
	--band-line: #2F3D5E;
	--placeholder: #1B2843;
	--map-bg: #121D33;
	--map-ink: #E8E4D8;
	--c-tera: #E8E4D8;
	--c-yato: #E9C873;
	--c-umi: #8FB4D9;
	--c-shoku: #E0A07A;
	--hub: #E9C873;
	--hub-in: #121D33;
	--fork-yato-bg: #1B2843;
	--fork-yato-ink: #E9C873;
	--fork-umi-bg: #1B2843;
	--fork-umi-ink: #8FB4D9;
	--footer-bg: #0A101C;
	--footer-ink: #A9B0C0;
	--focus: #E9C873;
	color-scheme: dark;
}

/* ---------- base ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
	margin: 0;
	background: var(--bg);
	color: var(--ink);
	font-family: "Zen Kaku Gothic New", "Hiragino Sans", "Yu Gothic", sans-serif;
	font-size: 16px;
	line-height: 1.8;
	transition: background-color .4s ease, color .4s ease;
}

img, svg, video { max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .2em; }
a:hover { color: var(--accent); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }

.wk-skip {
	position: absolute; left: -9999px; top: 8px;
	background: var(--solid-bg); color: var(--solid-ink); padding: 8px 16px; z-index: 100;
}
.wk-skip:focus { left: 8px; }

.screen-reader-text {
	border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
	height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; word-wrap: normal !important;
}

/* 昼／夜だけに出す要素 */
:root[data-time="night"] .only-day,
:root:not([data-time="night"]) .only-night { display: none !important; }

.wk-container { max-width: 1200px; margin: 0 auto; padding-inline: 24px; }
.wk-container--narrow { max-width: 760px; }

.wk-eyebrow {
	margin: 0; font-size: 13px; letter-spacing: .3em; font-weight: 700; color: var(--eyebrow);
}
.wk-eyebrow a { color: inherit; text-decoration: none; }
.wk-muted { color: var(--muted); margin: 0; }

.wk-h1, .wk-h2, .wk-hero__title, .wk-branch__name, .wk-card__title, .wk-table__title, .wk-brand__name {
	font-family: "Shippori Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
}
.wk-h1 { margin: 12px 0 0; font-size: clamp(30px, 5vw, 48px); font-weight: 800; line-height: 1.4; }
.wk-h2 { margin: 0; font-size: clamp(28px, 4vw, 40px); font-weight: 800; line-height: 1.4; }
.wk-h2--sm { font-size: clamp(24px, 3vw, 34px); font-weight: 700; letter-spacing: .06em; }

/* ---------- buttons ---------- */
.wk-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }
.wk-actions--center { justify-content: center; }
.wk-btn {
	display: inline-flex; align-items: center; justify-content: center;
	min-height: 48px; padding: 0 28px; border-radius: 2px;
	font-weight: 700; text-decoration: none; transition: opacity .2s ease;
}
.wk-btn:hover { opacity: .85; }
.wk-btn--solid { background: var(--solid-bg); color: var(--solid-ink); }
.wk-btn--solid:hover { color: var(--solid-ink); }
.wk-btn--accent { background: var(--accent); color: var(--accent-ink); }
.wk-btn--accent:hover { color: var(--accent-ink); }
.wk-btn--line { border: 1.5px solid var(--ink); color: var(--ink); }
.wk-more { display: inline-flex; align-items: center; min-height: 44px; margin-top: 16px; font-weight: 700; }

/* ---------- header ---------- */
.wk-header__inner {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
	gap: 16px; padding-block: 24px;
}
.wk-brand { display: flex; align-items: center; gap: 14px; text-decoration: none; color: var(--ink); }
.wk-brand:hover { color: var(--ink); }
.wk-brand__logo { width: 40px; height: auto; }
.wk-brand__text { display: flex; flex-direction: column; line-height: 1.2; }
.wk-brand__name { font-weight: 800; font-size: 26px; letter-spacing: .08em; }
.wk-brand__sub { font-size: 12px; letter-spacing: .3em; color: var(--muted); }
.wk-mark { color: currentColor; flex: none; }
.wk-mark__dot { fill: var(--accent); }

.wk-header__right { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
.wk-menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 24px; font-size: 15px; }
.wk-menu a { display: inline-block; padding: 10px 0; text-decoration: none; }
.wk-menu .current-menu-item > a { text-decoration: underline; }

.wk-time-toggle {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 50%;
	border: 1px solid var(--line); background: transparent; color: var(--ink); cursor: pointer;
}
.wk-time-toggle:hover { border-color: var(--ink); }
:root[data-time="night"] .wk-time-toggle__moon,
:root:not([data-time="night"]) .wk-time-toggle__sun { display: none; }

/* ---------- hero ---------- */
.wk-hero__inner {
	display: flex; flex-wrap: wrap; align-items: center; gap: 48px;
	padding-block: 48px 88px;
}
.wk-hero__text { flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 24px; }
.wk-hero__title {
	margin: 0; font-weight: 800; font-size: clamp(40px, 6vw, 64px);
	line-height: 1.3; letter-spacing: .04em;
}
.wk-hero__lead { margin: 0; font-size: 18px; color: var(--ink-2); max-width: 30em; }
.wk-hero__map { flex: 1 1 460px; min-width: 0; }

/* route map */
.wk-map { display: block; width: 100%; height: auto; }
.wk-map__bg { fill: var(--map-bg); }
.wk-map__stars { fill: #E8E4D8; display: none; }
:root[data-time="night"] .wk-map__stars { display: inline; }
.wk-map__lines path { stroke-width: 5; transition: stroke .4s ease; }
:root[data-time="night"] .wk-map__lines path { stroke-width: 3; }
.wk-map .l-main { stroke: var(--map-ink); }
.wk-map .l-yato { stroke: var(--c-yato); }
.wk-map .l-tera { stroke: var(--c-tera); stroke-dasharray: 2 12; }
.wk-map .l-umi { stroke: var(--c-umi); }
.wk-map .l-shoku { stroke: var(--c-shoku); }
.wk-map__halo { fill: var(--hub); opacity: 0; }
:root[data-time="night"] .wk-map__halo { opacity: .18; }
.wk-map__hub { fill: var(--hub); }
.wk-map__hub-in { fill: var(--hub-in); }
.wk-map__stop { fill: var(--map-bg); stroke-width: 3; }
.wk-map .s-main { stroke: var(--map-ink); }
.wk-map .s-yato { stroke: var(--c-yato); }
.wk-map .s-tera { stroke: var(--c-tera); }
.wk-map .s-umi { stroke: var(--c-umi); }
.wk-map .s-shoku { stroke: var(--c-shoku); }
.wk-map__labels { fill: var(--map-ink); font-family: "Shippori Mincho", serif; font-weight: 700; }

/* ---------- branches band ---------- */
.wk-branches { background: var(--band-bg); color: var(--band-ink); padding-block: 72px; border-block: 1px solid var(--band-line); }
.wk-branches .wk-h2 { margin-bottom: 32px; }
.wk-branches__grid { display: flex; flex-wrap: wrap; gap: 16px; }
.wk-branch {
	flex: 1 1 240px; min-width: 0; display: flex; flex-direction: column; gap: 10px;
	padding: 28px; border: 1px solid var(--band-line); color: var(--band-ink); text-decoration: none;
	transition: border-color .2s ease, transform .2s ease;
}
.wk-branch:hover { color: var(--band-ink); border-color: var(--band-ink); transform: translateY(-2px); }
.wk-branch__en { font-size: 13px; letter-spacing: .3em; color: var(--band-sub); }
.wk-branch__name { font-size: 26px; font-weight: 700; }
.wk-branch__desc { font-size: 15px; color: var(--band-muted); }

/* ---------- sections ---------- */
.wk-section { padding-block: 88px; }
.wk-section--tight { padding-block: 24px 88px; }
.wk-section--alt { background: var(--bg-alt); }
.wk-section__head {
	display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
	gap: 12px; margin-bottom: 32px;
}
.wk-page-head { padding-block: 56px 32px; }
.wk-page-head__desc { margin-top: 12px; }

/* cards */
.wk-cards { display: flex; flex-wrap: wrap; gap: 32px 24px; }
.wk-card { flex: 1 1 320px; min-width: 0; max-width: 100%; }
.wk-cards .wk-card { max-width: calc((100% - 48px) / 3 + 120px); }
.wk-card__link { display: flex; flex-direction: column; gap: 12px; text-decoration: none; color: var(--ink); }
.wk-card__link:hover { color: var(--ink); }
.wk-card__link:hover .wk-card__title { text-decoration: underline; }
.wk-card__img { width: 100%; aspect-ratio: 720 / 440; height: auto; object-fit: cover; display: block; }
.wk-card__label { margin: 4px 0 0; font-size: 13px; letter-spacing: .2em; font-weight: 700; color: var(--eyebrow); }
.wk-card__title { margin: 0; font-size: 24px; line-height: 1.4; }
.wk-card__excerpt { margin: 0; color: var(--ink-2); }

.wk-placeholder {
	background: var(--placeholder); color: var(--muted);
	display: flex; align-items: center; justify-content: center; aspect-ratio: 720 / 440;
}

.wk-admin-hint {
	margin: 0; padding: 16px 20px; border: 1px dashed var(--muted); color: var(--muted); font-size: 14px;
}

/* daytrip */
.wk-daytrip { display: flex; flex-wrap: wrap; gap: 48px; }
.wk-daytrip__intro { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.wk-daytrip__intro p { margin: 0; color: var(--ink-2); }
.wk-route-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.wk-route-list li { border-bottom: 1px solid var(--line); }
.wk-route-list a { display: block; padding: 12px 0; font-weight: 700; text-decoration: none; }

.wk-timeline { flex: 2 1 520px; min-width: 0; list-style: none; margin: 0; padding: 0; }
.wk-timeline__item,
.wk-timeline__fork { margin-left: 10px; padding: 0 0 28px 24px; border-left: 3px solid var(--ink); }
.wk-timeline__item { display: flex; gap: 20px; }
.wk-timeline__item--last { border-left-color: transparent; padding-bottom: 0; }
.wk-timeline__time { font-weight: 700; min-width: 56px; }
.wk-timeline__item > span:last-child { display: flex; flex-direction: column; color: var(--ink-2); }
.wk-timeline__item strong { font-family: "Shippori Mincho", serif; font-size: 20px; color: var(--ink); }
.wk-timeline__fork { display: flex; flex-wrap: wrap; gap: 12px; }
.wk-fork { flex: 1 1 220px; min-width: 0; padding: 20px; }
.wk-fork p { margin: 0; color: var(--ink-2); }
.wk-fork__label { margin-bottom: 4px !important; font-size: 13px; font-weight: 700; }
.wk-fork--yato { background: var(--fork-yato-bg); border-top: 4px solid var(--c-yato); }
.wk-fork--yato .wk-fork__label { color: var(--fork-yato-ink); }
.wk-fork--umi { background: var(--fork-umi-bg); border-top: 4px solid var(--c-umi); }
.wk-fork--umi .wk-fork__label { color: var(--fork-umi-ink); }

/* shokutaku */
.wk-section--alt .wk-h2 { margin-bottom: 32px; }
.wk-tables { display: flex; flex-wrap: wrap; gap: 24px; }
.wk-table { flex: 1 1 400px; min-width: 0; padding: 36px; display: flex; flex-direction: column; gap: 16px; }
.wk-table__en { margin: 0; font-size: 13px; letter-spacing: .3em; font-weight: 700; }
.wk-table__title { margin: 0; font-size: 28px; }
.wk-table__lead { margin: 0; }
.wk-table__list { margin: 0; padding: 0; list-style: none; }
.wk-table__list li { padding: 14px 0; border-top: 1px solid; }
.wk-table__list li:last-child { border-bottom: 1px solid; }
.wk-table__list a { font-weight: 700; }
.wk-table .wk-more { margin-top: 0; }

.wk-table--asa { background: var(--surface); color: var(--ink); }
.wk-table--asa .wk-table__en { color: #8A4B2F; }
.wk-table--asa .wk-table__lead { color: var(--ink-2); }
.wk-table--asa .wk-table__list li { border-color: var(--line); }
.wk-table--yu { background: #1F1D1A; color: #F4EFE4; }
.wk-table--yu a { color: #F4EFE4; }
.wk-table--yu .wk-table__en { color: #E0C276; }
.wk-table--yu .wk-table__lead { color: #D8D0BD; }
.wk-table--yu .wk-table__list li { border-color: #4A463E; }

:root[data-time="night"] .wk-section--alt { background: var(--bg); }
:root[data-time="night"] .wk-table--yu { order: -1; background: var(--surface); color: var(--ink); border-top: 3px solid #E9C873; }
:root[data-time="night"] .wk-table--yu a { color: var(--ink); }
:root[data-time="night"] .wk-table--yu .wk-table__en { color: #E9C873; }
:root[data-time="night"] .wk-table--yu .wk-table__lead { color: var(--ink-2); }
:root[data-time="night"] .wk-table--yu .wk-table__list li { border-color: var(--line); }
:root[data-time="night"] .wk-table--asa { border-top: 3px solid #8FB4D9; }
:root[data-time="night"] .wk-table--asa .wk-table__en { color: #8FB4D9; }
:root[data-time="night"] .wk-table--asa .wk-table__title::before { content: "明日の"; }

/* stay */
.wk-stay { display: flex; flex-wrap: wrap; align-items: center; gap: 48px; }
.wk-stay__media { flex: 1 1 460px; min-width: 0; }
.wk-stay__img { width: 100%; height: auto; display: block; }
.wk-stay__media .wk-placeholder { aspect-ratio: 4 / 3; }
.wk-stay__text { flex: 1 1 380px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.wk-stay__text p { margin: 0; color: var(--ink-2); }
.wk-stay__info strong { color: var(--ink); margin-right: .6em; }

/* about */
.wk-about { border-top: 1px solid var(--line); }
.wk-about__inner {
	max-width: 760px; margin: 0 auto; padding: 96px 24px;
	display: flex; flex-direction: column; align-items: center; gap: 24px; text-align: center;
}
.wk-about__inner p { margin: 0; font-size: 18px; line-height: 2; color: var(--ink-2); }

/* ---------- article ---------- */
.wk-article { padding-bottom: 88px; }
.wk-article__head { padding-block: 56px 32px; }
.wk-article__hero { margin: 0 auto 48px; }
.wk-article__hero img { width: 100%; height: auto; display: block; }
.wk-content { font-size: 17px; line-height: 2; }
.wk-content > * + * { margin-top: 1.4em; }
.wk-content h2, .wk-content h3 {
	font-family: "Shippori Mincho", serif; line-height: 1.5; margin-top: 2.4em;
}
.wk-content h2 { font-size: 28px; padding-bottom: .4em; border-bottom: 1px solid var(--line); }
.wk-content h3 { font-size: 22px; }
.wk-content img { height: auto; }
.wk-content blockquote { margin-inline: 0; padding-left: 20px; border-left: 3px solid var(--accent); color: var(--ink-2); }
.wk-content .alignwide { max-width: 1152px; margin-inline: calc(50% - min(576px, 50vw - 24px)); }
.wk-content .alignfull { margin-inline: calc(50% - 50vw); max-width: 100vw; }
.wk-content table { border-collapse: collapse; width: 100%; }
.wk-content th, .wk-content td { border: 1px solid var(--line); padding: 8px 12px; text-align: left; }
.wp-block-image figcaption, .wp-caption-text { font-size: 14px; color: var(--muted); }

.wk-post-nav { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px; margin-top: 64px; padding-top: 24px; border-top: 1px solid var(--line); }
.wk-post-nav a { text-decoration: none; font-weight: 700; }

.wk-pagination { margin-top: 48px; }
.wk-pagination .nav-links { display: flex; flex-wrap: wrap; gap: 8px; }
.wk-pagination .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 44px; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); text-decoration: none;
}
.wk-pagination .page-numbers.current { background: var(--solid-bg); color: var(--solid-ink); border-color: var(--solid-bg); }

.search-form { display: flex; gap: 8px; margin-top: 20px; max-width: 480px; }
.search-form label { flex: 1; }
.search-field { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; }
.search-submit { min-height: 44px; padding: 0 20px; border: 0; background: var(--solid-bg); color: var(--solid-ink); font: inherit; font-weight: 700; cursor: pointer; }

/* ---------- footer ---------- */
.wk-footer { background: var(--footer-bg); color: var(--footer-ink); font-size: 14px; }
.wk-footer a { color: var(--footer-ink); }
.wk-footer__inner {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
	gap: 16px 24px; padding-block: 48px 16px;
}
.wk-footer__brand { margin: 0; font-family: "Shippori Mincho", serif; font-size: 20px; color: #F4EFE4; }
:root[data-time="night"] .wk-footer__brand { color: #E8E4D8; }
.wk-footer__brand span { margin-left: .6em; font-size: 13px; font-family: "Zen Kaku Gothic New", sans-serif; color: var(--footer-ink); }
.wk-footer__menu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0 20px; }
.wk-footer__menu a { display: inline-block; padding: 10px 0; text-decoration: none; }
.wk-footer__meta { margin: 0; }
.wk-footer__copy { margin: 0 auto; padding-block: 0 32px; font-size: 12px; opacity: .8; }

/* ---------- small screens ---------- */
@media (max-width: 640px) {
	.wk-header__inner { padding-block: 16px; }
	.wk-hero__inner { padding-block: 24px 56px; gap: 32px; }
	.wk-section { padding-block: 64px; }
	.wk-branches { padding-block: 56px; }
	.wk-table { padding: 24px; }
	.wk-timeline__item { gap: 12px; }
	.wk-cards .wk-card { max-width: 100%; }
}
