/**
 * Dining page styles.
 *
 * Component CSS for /dining/ /ja/dining/ only. Hero (.as-page-hero),
 * Journal (.as-journal), and Menus (.as-feature-list, .as-feature--card)
 * inherit defaults from common.css / journal.css. This file owns the
 * page shell (force full width on flex layout) and the
 * dining-specific intro section.
 *
 * @package azumi-setoda
 * @since   1.0.0
 */

/* --------------------------------------------------
 * Page shell
 *
 * <main id="primary" class="site-main as-dining"> sits inside
 * GeneratePress' flex layout, which leaves flex-basis:auto on the
 * primary element. Combined with .as-feature--card's percentage
 * widths on desktop, this triggers a runaway layout where
 * <main>.offsetWidth grows to INT max on viewport widths 769–1024.
 * Force full width to break the feedback loop.
 * (Same pattern as theme/assets/css/accommodation.css)
 * -------------------------------------------------- */

.as-dining {
	width: 100%;
	background: var(--as-color-surface-blue-100);
}

/* --------------------------------------------------
 * Dining intro
 *
 * Hero 直下の本文セクション。max-width 800 で中央寄せ。
 * Figma: desktop 459:5299 / mobile 459:6639。
 * -------------------------------------------------- */

.as-dining-intro {
	padding-block: 60px 40px;
	margin-bottom: 0 !important;

	.as-dining-intro__inner {
		max-width: 800px;
		margin-inline: auto;
		padding-inline: var(--as-gutter);
	}

	.as-dining-intro__body {
		font-family: var(--as-font-ja-serif);
		font-size: var(--as-font-size-lg);
		line-height: 2;
		letter-spacing: 0.1em;
		text-align: justify;
	}

	@media (min-width: 769px) {
		padding-block: 85px 65px;
	}
}