/**
 * ワインクラブ特設ページ（page-wineclub テンプレート）専用スタイル。
 * すべて .wineclub-lp スコープ。
 *
 * - 本文（.wineclub-lp）は align:full ＋ ここで max-width:1256 中央寄せ（フロント／エディタ一致）。
 * - ソムリエ紹介は既存の .chef-block（restaurants.css）を流用し、受賞歴(.award-list)のみ追加。
 * - フォントは本文 UI 系サンセリフ（見出し含む）。配色は --aureate（ブランド）を参照。
 */

/* ===== LP ラッパー（幅・ガター一元管理。フロントは flow、幅は align:full＋この max-width） ===== */
.wineclub-lp {
	max-width: 1256px;
	margin-inline: auto;
	padding-inline: var(--gutter, 32px);
	box-sizing: border-box;
	font-family: var(--wp--custom--brand-ui, var(--wp--custom--brand-body, sans-serif));
	color: #111;
}
/* エディタのルートコンテナは align 無し扱いで contentSize(760) に締めるため、フロント同様 1256 に上書き。 */
.block-editor-block-list__layout.is-root-container > .wineclub-lp { max-width: 1256px; }

.wineclub-lp > * { margin-block: 0; }

/* ===== KV（hilton-kv：最大幅の本体＋背景ぼかしで左右いっぱいに敷く） =====
   .wineclub-lp は max-width:1256＋ガターの箱なので、その中の hilton-kv をビューポート全幅
   （100vw）へブレイクアウトさせる（共通の .single-main > .hilton-kv と同じ手法）。 */
.wineclub-lp > .hilton-kv {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: 56px;
}
@media (max-width: 700px) {
	.wineclub-lp > .hilton-kv { margin-bottom: 40px; }
}

/* ===== セクション共通（上罫線＋上下余白。先頭の導入だけ罫線なし） ===== */
.wineclub-lp .wc-intro { padding: 56px 0; }
.wineclub-lp .wc-sommelier,
.wineclub-lp .wc-list-sec,
.wineclub-lp .wc-benefit {
	padding: 56px 0;
	position: relative;
}
/* 区切り罫線はビューポート全幅（左右いっぱい）。コンテナ（1256＋ガター）を越えて 100vw で引く。 */
.wineclub-lp .wc-sommelier::before,
.wineclub-lp .wc-list-sec::before,
.wineclub-lp .wc-benefit::before {
	content: "";
	position: absolute;
	top: 0;
	left: calc(50% - 50vw);
	width: 100vw;
	height: 1px;
	background: #ececec;
}
/* セクション区切り見出し（ソムリエ／特典）。 */
.wineclub-lp .wc-sechead {
	font-weight: 700;
	font-size: clamp(17px, 1.8vw, 21px);
	letter-spacing: 0.06em;
	line-height: 1.4;
	color: var(--aureate, #b89766);
	margin: 0 0 48px;
	text-align: center;
}
/* 下余白だけ共通のセクション区切り見出し（28px）に揃える。汎用 h2 ルール（mb:12px）を上書きする
   が、上余白（先頭は 0、それ以外は 32px）は触らないよう margin-bottom 単独で指定する。 */
.wineclub-lp h2.wc-sechead.wp-block-heading {
	margin-bottom: 28px;
}

/* ===== 導入（ロゴ＋WINE CLUB＋リード） ===== */
.wineclub-lp .wineclub-title { display: flex; align-items: center; gap: 32px; flex-wrap: wrap; }
.wineclub-lp .wc-logo { margin: 0; max-width: 120px; flex-shrink: 0; }
.wineclub-lp .wc-logo img { width: 100%; height: auto; display: block; }
.wineclub-lp .wc-txt { flex: 1; min-width: 280px; }
.wineclub-lp .wc-h1 {
	font-weight: 700;
	font-size: clamp(22px, 2.6vw, 32px);
	line-height: 1.3;
	letter-spacing: 0.08em;
	color: #111;
	margin: 0 0 14px;
}
.wineclub-lp .wc-lead { font-weight: 400; font-size: 14px; line-height: 1.9; color: #000; margin: 0; }

/* ===== ソムリエ受賞歴（.chef-block は restaurants.css を流用） ===== */
.wineclub-lp .chef-text .award-list { list-style: none; padding: 0; margin: 18px 0 0; }
.wineclub-lp .chef-text .award-list li {
	display: grid;
	grid-template-columns: 64px 1fr;
	gap: 16px;
	padding: 9px 0;
	border-bottom: 1px solid color-mix(in srgb, var(--aureate, #b89766) 18%, transparent);
	font-size: 13px;
	line-height: 1.7;
}
.wineclub-lp .chef-text .award-list li:first-child {
	border-top: 1px solid color-mix(in srgb, var(--aureate, #b89766) 18%, transparent);
}
.wineclub-lp .chef-text .award-list .year { font-weight: 700; letter-spacing: 0.04em; color: var(--aureate, #b89766); white-space: nowrap; }
.wineclub-lp .chef-text .award-list .award { color: #333; }
/* エディタの core/list-item は内容を rich-text ラッパー（.block-editor-rich-text__editable）で
   包むため、year|award の 2 カラム grid が「1 アイテム」扱いになり崩れる。ラッパーを
   display:contents にして year/award span を直接 li の grid 項目にする（フロントにはこの
   ラッパーが無いため影響なし＝エディタ専用の整合）。 */
.wineclub-lp .chef-text .award-list li > .block-editor-rich-text__editable { display: contents; }

/* ===== ワインクラブ一覧（横並びカードを縦に積む） ===== */
.wineclub-lp .wineclub-list { display: grid; gap: 40px; }
.wineclub-lp .wc-card {
	display: grid;
	grid-template-columns: 320px 1fr;
	gap: 28px;
	align-items: center;
	max-width: 880px;
	margin: 0 auto;
	width: 100%;
}
.wineclub-lp .wc-card__ph { margin: 0; overflow: hidden; background: var(--snow, #F4F2F3); }
.wineclub-lp .wc-card__ph img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 8 / 5;
	object-fit: cover;
	transition: transform 0.6s ease;
}
.wineclub-lp .wc-card:hover .wc-card__ph img { transform: scale(1.04); }
.wineclub-lp .wc-card__body { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.wineclub-lp .wc-card__body h4 { font-weight: 700; font-size: 15px; line-height: 1.55; letter-spacing: 0.04em; color: #111; margin: 0; }
.wineclub-lp .wc-card__body p { font-size: 13px; line-height: 1.9; color: #333; margin: 0; }
.wineclub-lp .wc-card__btn { margin: 6px 0 0; }
.wineclub-lp .wc-card__btn a {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--aureate, #b89766);
	text-decoration: none;
	padding: 10px 24px;
	border: 1px solid var(--aureate, #b89766);
	transition: background 0.2s, color 0.2s;
}
.wineclub-lp .wc-card:hover .wc-card__btn a { background: var(--aureate, #b89766); color: #fff; }

/* ===== 特典＆入会案内（info-box） ===== */
.wineclub-lp .wc-info-box { max-width: 880px; margin: 0 auto; }
/* ボックス内側の縦余白は内容ブロックの margin に任せつつ、上下端だけ詰める
   （最初の要素は margin-top なし／最後の要素は margin-bottom なし）。 */
.wineclub-lp .wc-info-box > :first-child { margin-top: 0; }
.wineclub-lp .wc-info-box > :last-child { margin-bottom: 0; }
.wineclub-lp .wc-benefit-lead { display: flex; align-items: flex-start; gap: 24px; }
.wineclub-lp .wc-benefit-logo { margin: 0; max-width: 120px; flex-shrink: 0; }
.wineclub-lp .wc-benefit-logo img { width: 100%; height: auto; display: block; }
.wineclub-lp .wc-benefit-lead p { font-size: 15px; line-height: 1.95; color: #000; letter-spacing: 0.02em; margin: 0; }
.wineclub-lp .wc-benefit-lead .wc-closed { color: #ff0000; margin-top: 1em; }
.wineclub-lp .wc-info { margin-top: 28px; }
.wineclub-lp .wc-info h4 { font-weight: 700; font-size: 15px; letter-spacing: 0.06em; color: var(--aureate, #b89766); margin: 0 0 8px; }
.wineclub-lp .wc-info p { font-size: 14px; line-height: 1.85; color: #000; margin: 0; }
.wineclub-lp .wc-info .is-style-note { font-size: 13px; color: #555; }

/* ===== タブレット／スマホ ===== */
@media (max-width: 700px) {
	.wineclub-lp .wc-card { grid-template-columns: 1fr; gap: 14px; max-width: 480px; }
}
@media (max-width: 600px) {
	.wineclub-lp .wc-intro,
	.wineclub-lp .wc-sommelier,
	.wineclub-lp .wc-list-sec,
	.wineclub-lp .wc-benefit { padding: 40px 0; }
	.wineclub-lp .wc-benefit-lead { flex-direction: column; gap: 14px; }
	.wineclub-lp .chef-text .award-list li { grid-template-columns: 56px 1fr; gap: 10px; }
}