/* CRK Restaurant Menu – front end. Uses the Colonial Residence theme tokens with fallbacks. */
.crk-menu {
	--m-gold: var(--gold, #c6a15b);
	--m-gold-dark: var(--gold-dark, #9c7a3a);
	--m-ink: var(--ink, #14120f);
	--m-text: var(--text, #2a2622);
	--m-muted: var(--muted, #6f675b);
	--m-paper: var(--white, #fffdf8);
	--m-line: var(--line, rgba(198, 161, 91, 0.32));
	--m-display: var(--display, "Cormorant Garamond", Georgia, serif);
	--m-serif: var(--serif, "EB Garamond", Georgia, serif);
	--m-sans: var(--sans, "Jost", Arial, sans-serif);
	max-width: 1100px;
	margin: 0 auto;
	color: var(--m-text);
}

.crk-menu__head { text-align: center; margin-bottom: 28px; }
.crk-menu__title { font-family: var(--m-display); font-weight: 500; font-size: clamp(34px, 4vw, 48px); color: var(--m-ink); margin: 0 0 8px; }
.crk-menu__intro { font-family: var(--m-serif); font-style: italic; color: var(--m-muted); margin: 0 auto; max-width: 620px; }

/* Tabs */
.crk-menu__tabs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 28px; }
.crk-menu__tabs button {
	font-family: var(--m-sans); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase;
	padding: 10px 18px; border: 1px solid var(--m-line); background: transparent; color: var(--m-ink);
	cursor: pointer; transition: background .25s, color .25s, border-color .25s;
}
.crk-menu__tabs button:hover { border-color: var(--m-gold); }
.crk-menu__tabs button.is-active { background: var(--m-ink); border-color: var(--m-ink); color: var(--m-gold); }
.crk-menu__tabs button:focus-visible { outline: 2px solid var(--m-gold); outline-offset: 2px; }

/* Card */
.crk-menu__card {
	display: grid; grid-template-columns: 1fr 1fr; gap: 8px 64px; align-items: start;
	padding: clamp(28px, 5vw, 56px); background: var(--m-paper);
	border: 1px solid var(--m-line); outline: 1px solid var(--m-line); outline-offset: -10px;
}
.crk-menu__card.is-single { grid-template-columns: 1fr; max-width: 720px; margin: 0 auto; }
.crk-menu__section { margin-bottom: 36px; }
.crk-menu__section[hidden] { display: none; }

.crk-menu__section-title { display: flex; align-items: center; gap: 16px; margin: 0 0 18px; font-family: var(--m-sans); font-weight: 500; font-size: 15px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--m-gold-dark); }
.crk-menu__section-title::after { content: ""; flex: 1; height: 1px; background: var(--m-line); }
.crk-menu__section-desc { font-style: italic; color: var(--m-muted); margin: -8px 0 16px; }

.crk-menu__items { list-style: none; margin: 0; padding: 0; }
.crk-menu__item { padding: 12px 0; }
.crk-menu__item + .crk-menu__item { border-top: 1px dashed rgba(156, 122, 58, 0.22); }
.crk-menu__line { display: flex; align-items: baseline; gap: 10px; }
.crk-menu__name { font-family: var(--m-display); font-size: 22px; font-weight: 600; line-height: 1.2; color: var(--m-ink); }
.crk-menu__dots { flex: 1; min-width: 16px; border-bottom: 1px dotted rgba(156, 122, 58, 0.55); transform: translateY(-4px); }
.crk-menu__price { font-family: var(--m-sans); font-size: 14px; font-weight: 500; letter-spacing: 0.06em; color: var(--m-gold-dark); white-space: nowrap; }
.crk-menu__desc { margin: 4px 0 0; font-family: var(--m-serif); font-style: italic; font-size: 16px; line-height: 1.55; color: var(--m-muted); }

.crk-menu__section--compact .crk-menu__item { padding: 7px 0; }
.crk-menu__section--compact .crk-menu__item + .crk-menu__item { border-top: 0; }
.crk-menu__section--compact .crk-menu__name { font-size: 20px; font-weight: 500; }

.crk-menu__note { margin: 20px 0 0; text-align: center; font-family: var(--m-sans); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--m-muted); }

@media (max-width: 820px) {
	.crk-menu__card { grid-template-columns: 1fr; }
	.crk-menu__name { font-size: 20px; }
	.crk-menu__tabs { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; -webkit-overflow-scrolling: touch; }
	.crk-menu__tabs button { flex: none; }
}