/* ==========================================================
   COCOCURE HAUS PAGES — Master Stylesheet
   Matches the existing Haus design system:
   - Background: #0D0D0D / #1A1A1A
   - Accent: #C9A227 (Haus Gold)
   - Text: #FAF7F0 / #F5F0E1
   - Display font: Playfair Display
   - Body font: Sora / Montserrat
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;500;600;700&family=Sora:wght@300;400;500;600&family=Montserrat:wght@400;500&display=swap');

/* ── CSS Custom Properties ─────────────────────────────── */

.coco-haus-page {
    --haus-gold: #C9A227;
    --haus-gold-muted: #B8960C;
    --haus-gold-dim: rgba(201, 162, 39, 0.3);
    --haus-gold-border: rgba(201, 162, 39, 0.5);
    --haus-gold-glow: rgba(201, 162, 39, 0.15);
    --haus-bg: #0D0D0D;
    --haus-bg2: #1A1A1A;
    --haus-bg3: #111111;
    --haus-text: #FAF7F0;
    --haus-text2: #F5F0E1;
    --haus-text-dim: rgba(250, 247, 240, 0.7);
    --haus-border: rgba(255, 255, 255, 0.08);
    --haus-font-display: 'Playfair Display', Georgia, serif;
    --haus-font-body: 'Sora', 'Montserrat', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
    --haus-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --haus-radius: 20px;
    --haus-radius-sm: 12px;

    /* TWNTY7 accent override */
    --twnty7-pink: #ff2d55;
    --twnty7-pink-dim: rgba(255, 45, 85, 0.3);
}

/* ── Page wrapper ──────────────────────────────────────── */

.coco-haus-page {
    position: relative;
    background: var(--haus-bg);
    color: var(--haus-text);
    font-family: var(--haus-font-body);
    line-height: 1.6;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    width: 100vw;
    overflow: hidden;
}

.coco-haus-page *,
.coco-haus-page *::before,
.coco-haus-page *::after {
    box-sizing: border-box;
}

.coco-haus-page a {
    color: var(--haus-gold);
    text-decoration: none;
    transition: opacity 0.3s var(--haus-ease);
}

.coco-haus-page a:hover {
    opacity: 0.8;
}

/* ── Hero Section ──────────────────────────────────────── */

.chp-hero {
    position: relative;
    min-height: 70vh;
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    background: #000 center/cover no-repeat;
    overflow: hidden;
}

.chp-hero--short {
    min-height: 50vh;
}

.chp-hero-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(
        ellipse at 30% 20%,
        rgba(201, 162, 39, 0.04) 0%,
        transparent 50%
    ),
    linear-gradient(to top, #0D0D0D 0%, rgba(0, 0, 0, 0.7) 40%, rgba(0, 0, 0, 0.3) 100%);
    z-index: 1;
}

.chp-hero-overlay--extra {
    background: linear-gradient(to top, #0D0D0D 0%, rgba(0, 0, 0, 0.85) 40%, rgba(0, 0, 0, 0.5) 100%);
}

.chp-hero-overlay--pink {
    background: linear-gradient(to top, #0D0D0D 0%, rgba(255, 45, 85, 0.1) 40%, rgba(0, 0, 0, 0.5) 100%);
}

.chp-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 80px 80px;
    max-width: 900px;
}

.chp-hero-tag {
    display: inline-block;
    font-size: 11px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--haus-gold);
    margin-bottom: 16px;
    font-family: var(--haus-font-body);
}

.chp-hero-tag--twnty7 {
    color: var(--twnty7-pink);
}

.chp-hero h1 {
    font-family: var(--haus-font-display);
    font-size: clamp(32px, 7vw, 56px);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    margin: 0 0 12px;
    color: var(--haus-text);
    line-height: 1.1;
}

.chp-hero-sub {
    font-family: var(--haus-font-display);
    font-size: clamp(16px, 2.5vw, 22px);
    font-style: italic;
    opacity: 0.8;
    margin: 0;
    letter-spacing: 0.05em;
}

/* ── Intro Section ─────────────────────────────────────── */

.chp-intro {
    max-width: 780px;
    margin: 0 auto;
    padding: 60px 80px;
    text-align: center;
}

.chp-intro--wide {
    max-width: 900px;
}

.chp-intro p {
    font-size: 17px;
    line-height: 1.8;
    opacity: 0.85;
    font-style: italic;
    font-family: var(--haus-font-display);
}

.chp-intro--twnty7 p {
    font-style: normal;
    font-family: var(--haus-font-body);
}

/* ── Tabs Navigation ───────────────────────────────────── */

.chp-tabs {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 0 40px;
    margin: 0 auto 40px;
    max-width: 1200px;
    flex-wrap: wrap;
}

.chp-tab {
    background: transparent;
    border: 1px solid var(--haus-border);
    color: var(--haus-text-dim);
    padding: 10px 24px;
    border-radius: 999px;
    font-family: var(--haus-font-body);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
    transition: all 0.3s var(--haus-ease);
    white-space: nowrap;
}

.chp-tab:hover {
    border-color: var(--haus-gold-dim);
    color: var(--haus-text);
}

.chp-tab.active {
    background: linear-gradient(135deg, var(--haus-gold), var(--haus-gold-muted));
    border-color: var(--haus-gold);
    color: #0D0D0D;
    font-weight: 600;
}

/* ── Tab Panels ────────────────────────────────────────── */

.chp-tab-panel {
    display: none;
    padding: 0 80px;
    max-width: 1200px;
    margin: 0 auto;
}

.chp-tab-panel.active {
    display: block;
}

/* ── Menu Items Grid ───────────────────────────────────── */

.chp-menu-grid {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.chp-menu-item {
    display: flex;
    gap: 20px;
    padding: 20px 24px;
    background: var(--haus-bg2);
    border-radius: var(--haus-radius-sm);
    transition: all 0.3s var(--haus-ease);
    border: 1px solid transparent;
}

.chp-menu-item:hover {
    border-color: rgba(201, 162, 39, 0.1);
    background: var(--haus-bg3);
}

.chp-menu-item.has-badge {
    border-color: var(--haus-gold-dim);
    background: linear-gradient(145deg, rgba(201, 162, 39, 0.05), var(--haus-bg2));
}

.chp-menu-item-img {
    width: 80px;
    height: 80px;
    border-radius: 12px;
    background-size: cover;
    background-position: center;
    flex-shrink: 0;
}

.chp-menu-item-body {
    flex: 1;
    min-width: 0;
}

.chp-menu-item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

.chp-menu-item-header h3 {
    font-family: var(--haus-font-body);
    font-size: 16px;
    font-weight: 600;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.chp-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    background: linear-gradient(135deg, var(--haus-gold), var(--haus-gold-muted));
    color: #0D0D0D;
    padding: 3px 10px;
    border-radius: 999px;
}

.chp-price {
    font-family: var(--haus-font-body);
    font-size: 16px;
    font-weight: 600;
    color: var(--haus-gold);
    white-space: nowrap;
    flex-shrink: 0;
}

.chp-price small {
    font-size: 11px;
    font-weight: 400;
    opacity: 0.6;
    text-transform: lowercase;
}

.chp-price-group {
    display: flex;
    gap: 16px;
    align-items: center;
    flex-shrink: 0;
}

.chp-price--glass {
    color: var(--haus-text-dim);
}

.chp-bottle-size {
    font-size: 13px;
    opacity: 0.6;
}

.chp-menu-item-desc {
    font-size: 14px;
    opacity: 0.65;
    margin: 6px 0 0;
    line-height: 1.5;
}

.chp-menu-sub-heading {
    font-family: var(--haus-font-display);
    font-size: 18px;
    font-weight: 500;
    margin: 24px 0 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--haus-gold-dim);
    color: var(--haus-gold);
    letter-spacing: 0.08em;
}

.chp-menu-sub-heading:first-child {
    margin-top: 0;
}

/* Non-alcoholic drinks — equal visual weight */
.chp-nonalc-highlight .chp-menu-item {
    border: 1px solid rgba(201, 162, 39, 0.15);
}

/* Shisha sections */
.chp-shisha-section {
    margin-bottom: 30px;
}

.chp-shisha-note {
    font-size: 13px;
    font-style: italic;
    opacity: 0.6;
    margin: 4px 0 16px;
}

/* Bottle grid */
.chp-bottle-grid .chp-menu-item {
    padding: 16px 24px;
}

/* Bottle service banners (peak / off-peak extras) */
.chp-bottle-banners {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    gap: 12px;
}
.chp-bottle-banner {
    flex: 1;
    padding: 14px 20px;
    text-align: center;
    border: 1px solid var(--haus-gold-dim);
    border-radius: 8px;
    font-family: var(--haus-font-body);
    font-size: 12px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--haus-gold);
    position: relative;
}
.chp-bottle-banner--offpeak {
    border-color: rgba(255,255,255,.15);
    color: rgba(255,255,255,.7);
}
.chp-bottle-banner-label {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.18em;
    margin-bottom: 6px;
    opacity: .6;
}
.chp-bottle-banner--peak .chp-bottle-banner-label {
    color: var(--haus-gold);
    opacity: 1;
}
.chp-bottle-banner p {
    margin: 0;
}
@media (max-width: 600px) {
    .chp-bottle-banners {
        flex-direction: column;
    }
}

/* Peak / Off-peak column headers */
.chp-bottle-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 24px;
    border-bottom: 1px solid var(--haus-gold-dim);
}

.chp-bottle-header-row span:first-child {
    flex: 1;
}

.chp-bottle-col-label {
    width: 80px;
    text-align: right;
    font-family: var(--haus-font-body);
    font-size: 10px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--haus-gold);
    opacity: 0.7;
}

/* Dual-price layout for bottles with off-peak */
.chp-bottle-item.has-offpeak .chp-menu-item-header {
    display: flex;
    align-items: center;
}

.chp-bottle-item.has-offpeak .chp-price-group {
    display: flex;
    gap: 0;
}

.chp-bottle-item.has-offpeak .chp-price {
    width: 80px;
    text-align: right;
}

.chp-price--offpeak {
    opacity: 0.55;
}

/* ── Feature Block (Dine & Stay, etc.) ─────────────────── */

.chp-feature-block {
    padding: 60px 80px;
    background: linear-gradient(180deg, var(--haus-bg2) 0%, var(--haus-bg) 100%);
    border-top: 1px solid rgba(201, 162, 39, 0.1);
    border-bottom: 1px solid rgba(201, 162, 39, 0.1);
}

.chp-feature-block-inner {
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
}

.chp-feature-tag {
    display: inline-block;
    font-size: 10px;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--haus-gold);
    background: var(--haus-gold-dim);
    padding: 5px 16px;
    border-radius: 999px;
    margin-bottom: 20px;
}

.chp-feature-block h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 36px);
    font-weight: 500;
    margin: 0 0 20px;
    letter-spacing: 0.1em;
}

.chp-feature-block p {
    font-size: 16px;
    line-height: 1.8;
    opacity: 0.8;
}

.chp-feature--twnty7 {
    border-color: var(--twnty7-pink-dim);
}

.chp-feature--twnty7 h2 {
    color: var(--twnty7-pink);
}

/* ── Info Box ──────────────────────────────────────────── */

.chp-info-box {
    max-width: 780px;
    margin: 40px auto;
    padding: 40px;
    background: var(--haus-bg2);
    border: 1px solid rgba(201, 162, 39, 0.12);
    border-radius: var(--haus-radius);
    text-align: center;
}

.chp-info-box h3 {
    font-family: var(--haus-font-display);
    font-size: 22px;
    font-weight: 500;
    margin: 0 0 12px;
    letter-spacing: 0.08em;
}

.chp-info-box p {
    font-size: 15px;
    opacity: 0.8;
    line-height: 1.7;
}

/* ── How to Book ───────────────────────────────────────── */

.chp-how-to-book {
    max-width: 780px;
    margin: 60px auto;
    text-align: center;
    padding: 0 40px;
}

.chp-how-to-book h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.1em;
}

.chp-book-options {
    display: flex;
    gap: 30px;
    justify-content: center;
    margin-bottom: 30px;
}

.chp-book-option {
    flex: 1;
    max-width: 280px;
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 30px;
    text-align: center;
    transition: border-color 0.3s var(--haus-ease);
}

.chp-book-option:hover {
    border-color: var(--haus-gold-dim);
}

.chp-book-icon {
    font-size: 28px;
    display: block;
    margin-bottom: 12px;
}

.chp-book-option h4 {
    font-family: var(--haus-font-body);
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 8px;
}

.chp-book-option a {
    font-size: 14px;
}

.chp-book-details p {
    font-size: 14px;
    opacity: 0.75;
    margin: 8px 0;
}

.chp-book-note {
    font-style: italic;
    font-size: 13px !important;
    opacity: 0.6 !important;
}

/* ── CTA Section ───────────────────────────────────────── */

.chp-cta-section {
    text-align: center;
    padding: 60px 40px 80px;
}

.chp-cta-section h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 500;
    margin: 0 0 24px;
    letter-spacing: 0.08em;
}

.chp-cta-buttons {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
}

/* ── Menu Notices (service charge, prices, allergens) ──── */

.chp-menu-notices {
    max-width: 800px;
    margin: 0 auto;
    padding: 30px 80px 10px;
    border-top: 1px solid var(--haus-gold-dim);
}

.chp-menu-notice {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-family: var(--haus-font-body);
    font-size: 12px;
    color: rgba(250, 247, 240, 0.5);
    letter-spacing: 0.04em;
    line-height: 1.6;
    margin: 0 0 10px;
}

.chp-notice-icon {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid var(--haus-gold-dim);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: var(--haus-gold);
    line-height: 1;
}

/* Reuse existing button styles */
.coco-haus-page .coco-venue-btn-primary {
    background: linear-gradient(135deg, var(--haus-gold) 0%, var(--haus-gold-muted) 100%);
    color: #0D0D0D;
    padding: 14px 32px;
    border-radius: 40px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 14px;
    font-weight: 600;
    font-family: var(--haus-font-body);
    border: none;
    cursor: pointer;
    transition: all 0.3s var(--haus-ease);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.coco-haus-page .coco-venue-btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(201, 162, 39, 0.3);
    opacity: 1;
}

.coco-haus-page .coco-venue-btn-outline {
    background: transparent;
    border: 1.5px solid var(--haus-gold-border);
    color: var(--haus-text);
    padding: 14px 32px;
    border-radius: 40px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    font-size: 14px;
    font-family: var(--haus-font-body);
    cursor: pointer;
    transition: all 0.3s var(--haus-ease);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.coco-haus-page .coco-venue-btn-outline:hover {
    background: rgba(201, 162, 39, 0.1);
    border-color: var(--haus-gold);
    opacity: 1;
}

/* TWNTY7 button variant */
.chp-btn--twnty7 {
    background: var(--twnty7-pink) !important;
    color: #fff !important;
}

.chp-btn--twnty7:hover {
    box-shadow: 0 8px 30px var(--twnty7-pink-dim) !important;
}

/* ── Birthday Packages ─────────────────────────────────── */

.chp-packages {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 80px 60px;
}

.chp-package-card {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 40px 30px;
    text-align: center;
    transition: all 0.4s var(--haus-ease);
    display: flex;
    flex-direction: column;
}

.chp-package-card:hover {
    transform: translateY(-6px);
    border-color: rgba(201, 162, 39, 0.3);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.chp-package-card--featured {
    border-color: var(--haus-gold-dim);
    background: linear-gradient(145deg, rgba(201, 162, 39, 0.06), var(--haus-bg2));
    position: relative;
}

.chp-package-card--featured::before {
    content: "MOST POPULAR";
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--haus-gold);
    color: #0D0D0D;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.15em;
    padding: 4px 16px;
    border-radius: 0 0 8px 8px;
}

.chp-package-icon {
    font-size: 36px;
    margin-bottom: 16px;
}

.chp-package-card h3 {
    font-family: var(--haus-font-display);
    font-size: 24px;
    font-weight: 500;
    margin: 0 0 16px;
    letter-spacing: 0.08em;
}

.chp-package-card > p {
    font-size: 14px;
    line-height: 1.7;
    opacity: 0.75;
    margin: 0 0 20px;
    flex: 1;
}

.chp-package-details {
    list-style: none;
    padding: 0;
    margin: 0 0 24px;
    text-align: left;
}

.chp-package-details li {
    font-size: 13px;
    padding: 8px 0;
    border-bottom: 1px solid var(--haus-border);
    opacity: 0.7;
    padding-left: 16px;
    position: relative;
}

.chp-package-details li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 14px;
    width: 6px;
    height: 6px;
    background: var(--haus-gold);
    border-radius: 50%;
}

.chp-package-details li:last-child {
    border-bottom: none;
}

/* ── Mini Gallery ──────────────────────────────────────── */

.chp-mini-gallery {
    padding: 60px 80px;
    text-align: center;
}

.chp-mini-gallery h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-mini-gallery-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

.chp-mini-gallery-item {
    height: 220px;
    border-radius: var(--haus-radius);
    background-size: cover;
    background-position: center;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
    transition: transform 0.3s var(--haus-ease);
}

.chp-mini-gallery-item:hover {
    transform: scale(1.03);
}

.chp-gallery-caption {
    font-size: 13px;
    opacity: 0.5;
    margin-top: 16px;
}

/* ── Full Gallery Page ─────────────────────────────────── */

.chp-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    padding: 0 80px;
    max-width: 1400px;
    margin: 0 auto 60px;
}

.chp-gallery-item {
    height: 280px;
    border-radius: var(--haus-radius);
    background-size: cover;
    background-position: center;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
    transition: transform 0.3s var(--haus-ease);
    cursor: pointer;
}

.chp-gallery-item:hover {
    transform: scale(1.03);
    box-shadow: 0 20px 60px rgba(201, 162, 39, 0.1);
}

.chp-gallery-placeholder {
    text-align: center;
    opacity: 0.6;
    padding: 40px;
    grid-column: 1 / -1;
}

.chp-instagram-feed {
    text-align: center;
    padding: 40px 80px 60px;
}

.chp-instagram-feed h2 {
    font-family: var(--haus-font-display);
    font-size: 28px;
    font-weight: 500;
    margin: 0 0 8px;
}

.chp-ig-link {
    font-size: 18px;
    color: var(--haus-gold) !important;
    letter-spacing: 0.04em;
}

/* ── Spaces (Private Events) ──────────────────────────── */

.chp-spaces {
    padding: 60px 80px;
    text-align: center;
}

.chp-spaces h2,
.chp-offerings-list h2,
.chp-ideal-for h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.1em;
}

.chp-spaces-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    max-width: 1200px;
    margin: 0 auto;
}

.chp-space-card {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 30px 24px;
    text-align: center;
    transition: all 0.3s var(--haus-ease);
}

.chp-space-card:hover {
    border-color: var(--haus-gold-dim);
    transform: translateY(-4px);
}

.chp-space-icon {
    font-size: 30px;
    display: block;
    margin-bottom: 12px;
}

.chp-space-card h3 {
    font-family: var(--haus-font-display);
    font-size: 18px;
    font-weight: 500;
    margin: 0 0 8px;
}

.chp-space-capacity {
    font-size: 12px;
    font-weight: 600;
    color: var(--haus-gold);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 0 0 8px;
}

.chp-space-card > p:last-child {
    font-size: 13px;
    opacity: 0.7;
    margin: 0;
}

/* ── Offerings List ────────────────────────────────────── */

.chp-offerings-list {
    padding: 60px 80px;
    background: var(--haus-bg2);
    text-align: center;
}

.chp-offerings-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
    max-width: 900px;
    margin: 0 auto;
}

.chp-offer-item {
    background: var(--haus-bg);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius-sm);
    padding: 16px 20px;
    font-size: 14px;
    opacity: 0.8;
}

/* ── Ideal For ─────────────────────────────────────────── */

.chp-ideal-for {
    padding: 60px 80px;
    text-align: center;
}

.chp-ideal-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
    max-width: 1000px;
    margin: 0 auto;
}

.chp-ideal-item {
    background: rgba(201, 162, 39, 0.03);
    border: 1px solid rgba(201, 162, 39, 0.08);
    border-radius: var(--haus-radius-sm);
    padding: 20px 16px;
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s var(--haus-ease);
}

.chp-ideal-item:hover {
    background: rgba(201, 162, 39, 0.08);
    border-color: rgba(201, 162, 39, 0.2);
}

.chp-ideal-item span {
    font-size: 20px;
    flex-shrink: 0;
}

/* ── Enquiry Form ──────────────────────────────────────── */

.chp-enquiry-form-section {
    max-width: 780px;
    margin: 40px auto 60px;
    padding: 0 40px;
}

.chp-enquiry-form-section h2 {
    font-family: var(--haus-font-display);
    font-size: 28px;
    font-weight: 500;
    text-align: center;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-enquiry-form,
.chp-selection-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.chp-form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.chp-form-field {
    display: flex;
    flex-direction: column;
}

.chp-form-field--full {
    grid-column: 1 / -1;
}

.chp-form-field label {
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 8px;
    opacity: 0.7;
}

.chp-form-field input,
.chp-form-field select,
.chp-form-field textarea {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius-sm);
    padding: 14px 16px;
    color: var(--haus-text);
    font-family: var(--haus-font-body);
    font-size: 15px;
    transition: border-color 0.3s var(--haus-ease);
    outline: none;
}

.chp-form-field input:focus,
.chp-form-field select:focus,
.chp-form-field textarea:focus {
    border-color: var(--haus-gold-border);
}

.chp-form-field select {
    appearance: none;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C9A227' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
}

.chp-form-field textarea {
    resize: vertical;
    min-height: 100px;
}

.chp-enquiry-form .coco-venue-btn-primary,
.chp-selection-form .coco-venue-btn-primary {
    align-self: center;
    margin-top: 10px;
}

.chp-enquiry-alt {
    text-align: center;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--haus-border);
}

.chp-enquiry-alt p {
    font-size: 14px;
    opacity: 0.7;
    margin: 6px 0;
}

/* ── FAQ Accordion ─────────────────────────────────────── */

.chp-faq-section {
    max-width: 780px;
    margin: 0 auto;
    padding: 0 40px 80px;
}

.chp-faq-section h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    text-align: center;
    margin: 0 0 40px;
    letter-spacing: 0.08em;
}

.chp-accordion {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.chp-accordion-item {
    background: var(--haus-bg2);
    border-radius: var(--haus-radius-sm);
    overflow: hidden;
    border: 1px solid transparent;
    transition: border-color 0.3s var(--haus-ease);
}

.chp-accordion-item:has(.chp-accordion-trigger[aria-expanded="true"]) {
    border-color: rgba(201, 162, 39, 0.15);
}

.chp-accordion-trigger {
    width: 100%;
    background: none;
    border: none;
    color: var(--haus-text);
    padding: 20px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    font-family: var(--haus-font-body);
    font-size: 15px;
    font-weight: 500;
    text-align: left;
    transition: color 0.3s var(--haus-ease);
}

.chp-accordion-trigger:hover {
    color: var(--haus-gold);
}

.chp-accordion-icon {
    width: 20px;
    height: 20px;
    position: relative;
    flex-shrink: 0;
}

.chp-accordion-icon::before,
.chp-accordion-icon::after {
    content: "";
    position: absolute;
    background: var(--haus-gold);
    transition: transform 0.3s var(--haus-ease);
}

.chp-accordion-icon::before {
    width: 12px;
    height: 1.5px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.chp-accordion-icon::after {
    width: 1.5px;
    height: 12px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.chp-accordion-trigger[aria-expanded="true"] .chp-accordion-icon::after {
    transform: translate(-50%, -50%) rotate(90deg);
}

.chp-accordion-panel {
    padding: 0 24px 20px;
}

.chp-accordion-panel[hidden] {
    display: none;
}

.chp-accordion-panel p {
    font-size: 14px;
    line-height: 1.7;
    opacity: 0.75;
    margin: 0 0 10px;
}

.chp-accordion-panel p:last-child {
    margin-bottom: 0;
}

.chp-inline-link {
    color: var(--haus-gold) !important;
    border-bottom: 1px solid var(--haus-gold-dim);
    padding-bottom: 1px;
}

.chp-inline-link:hover {
    border-color: var(--haus-gold) !important;
}

/* ── Two Column Layout (Catering) ──────────────────────── */

.chp-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 80px 60px;
}

.chp-col-card {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 40px 30px;
    text-align: center;
}

.chp-col-icon {
    font-size: 36px;
    margin-bottom: 16px;
}

.chp-col-card h3 {
    font-family: var(--haus-font-display);
    font-size: 22px;
    font-weight: 500;
    margin: 0 0 12px;
}

.chp-col-card > p {
    font-size: 14px;
    opacity: 0.75;
    line-height: 1.7;
    margin: 0 0 20px;
}

.chp-delivery-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    margin-bottom: 16px;
}

.chp-small-note {
    font-size: 12px;
    opacity: 0.5;
    font-style: italic;
}

/* ── TWNTY7 Key Info ───────────────────────────────────── */

.chp-key-info {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 24px;
    padding: 40px 60px;
    background: var(--haus-bg2);
    border-top: 1px solid var(--haus-border);
    border-bottom: 1px solid var(--haus-border);
}

.chp-key-info--twnty7 {
    border-color: var(--twnty7-pink-dim);
}

.chp-key-item {
    text-align: center;
    min-width: 120px;
}

.chp-key-icon {
    font-size: 24px;
    display: block;
    margin-bottom: 8px;
}

.chp-key-item h4 {
    font-family: var(--haus-font-body);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    margin: 0 0 4px;
    opacity: 0.5;
}

.chp-key-item p {
    font-size: 14px;
    margin: 0;
}

/* ── TWNTY7 Events ────────────────────────────────────── */

.chp-events-section {
    padding: 60px 80px;
    text-align: center;
}

.chp-events-section h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-events--twnty7 h2 {
    color: var(--twnty7-pink);
}

.chp-event-cards {
    display: flex;
    gap: 24px;
    justify-content: center;
    flex-wrap: wrap;
}

.chp-event-card {
    width: calc(33.333% - 16px);
    min-width: 260px;
    max-width: 380px;
    background: var(--haus-bg2);
    border-radius: var(--haus-radius);
    overflow: hidden;
    border: 1px solid var(--haus-border);
    transition: transform 0.3s var(--haus-ease);
}

.chp-event-card:hover {
    transform: translateY(-6px);
}

.chp-event-card--twnty7 {
    border-color: var(--twnty7-pink-dim);
}

.chp-event-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.chp-event-card-body {
    padding: 20px;
}

.chp-event-card-body h3 {
    font-family: var(--haus-font-display);
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 6px;
}

.chp-event-card-body > p {
    font-size: 13px;
    opacity: 0.6;
    margin: 0 0 16px;
}

.chp-no-events {
    opacity: 0.6;
    font-size: 14px;
}

.chp-no-events a {
    color: var(--haus-gold);
}

/* ── Cross-sell ────────────────────────────────────────── */

.chp-cross-sell {
    padding: 60px 80px;
    background: var(--haus-bg2);
    border-top: 1px solid var(--haus-border);
}

.chp-cross-sell-inner {
    max-width: 700px;
    margin: 0 auto;
    text-align: center;
}

.chp-cross-sell h3 {
    font-family: var(--haus-font-display);
    font-size: 24px;
    font-weight: 500;
    margin: 0 0 12px;
}

.chp-cross-sell p {
    font-size: 15px;
    opacity: 0.75;
    line-height: 1.7;
    margin: 0 0 24px;
}

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
   ══════════════════════════════════════════════════════════ */

@media (max-width: 1024px) {
    .chp-packages {
        grid-template-columns: 1fr;
        max-width: 600px;
        padding: 0 40px 60px;
    }

    .chp-spaces-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .chp-offerings-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .chp-ideal-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .chp-mini-gallery-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .chp-gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        padding: 0 40px;
    }

    .chp-two-col {
        grid-template-columns: 1fr;
        padding: 0 40px 60px;
    }

    .chp-event-cards {
        flex-direction: column;
        align-items: center;
    }

    .chp-event-card {
        width: 100%;
        max-width: 400px;
    }
}

@media (max-width: 768px) {
    .chp-hero-content {
        padding: 0 24px 60px;
    }

    .chp-hero h1 {
        letter-spacing: 0.1em;
    }

    .chp-intro {
        padding: 40px 24px;
    }

    .chp-menu-notices {
        padding: 24px 24px 6px;
    }

    .chp-tabs {
        padding: 0 16px;
        gap: 6px;
    }

    .chp-tab {
        padding: 8px 16px;
        font-size: 11px;
    }

    .chp-tab-panel {
        padding: 0 16px;
    }

    .chp-menu-item {
        padding: 16px;
    }

    .chp-menu-item-header {
        flex-direction: column;
        gap: 4px;
    }

    .chp-price-group {
        gap: 12px;
    }

    .chp-feature-block {
        padding: 40px 24px;
    }

    .chp-info-box {
        margin: 30px 16px;
        padding: 30px 24px;
    }

    .chp-how-to-book {
        padding: 0 24px;
    }

    .chp-book-options {
        flex-direction: column;
        align-items: center;
    }

    .chp-book-option {
        width: 100%;
        max-width: none;
    }

    .chp-packages {
        padding: 0 24px 60px;
    }

    .chp-mini-gallery {
        padding: 40px 24px;
    }

    .chp-mini-gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .chp-mini-gallery-item {
        height: 160px;
    }

    .chp-gallery-grid {
        grid-template-columns: 1fr;
        padding: 0 24px;
    }

    .chp-gallery-item {
        height: 220px;
    }

    .chp-spaces {
        padding: 40px 24px;
    }

    .chp-spaces-grid {
        grid-template-columns: 1fr;
    }

    .chp-offerings-list {
        padding: 40px 24px;
    }

    .chp-offerings-grid {
        grid-template-columns: 1fr;
    }

    .chp-ideal-for {
        padding: 40px 24px;
    }

    .chp-ideal-grid {
        grid-template-columns: 1fr 1fr;
    }

    .chp-enquiry-form-section {
        padding: 0 24px;
    }

    .chp-form-row {
        grid-template-columns: 1fr;
    }

    .chp-faq-section {
        padding: 0 24px 60px;
    }

    .chp-two-col {
        padding: 0 24px 60px;
    }

    .chp-key-info {
        padding: 30px 24px;
        gap: 16px;
    }

    .chp-events-section {
        padding: 40px 24px;
    }

    .chp-cross-sell {
        padding: 40px 24px;
    }

    .chp-instagram-feed {
        padding: 30px 24px;
    }

    .chp-cta-section {
        padding: 40px 24px 60px;
    }

    .chp-cta-buttons {
        flex-direction: column;
        align-items: center;
    }

    .coco-haus-page .coco-venue-btn-primary,
    .coco-haus-page .coco-venue-btn-outline {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
}

@media (max-width: 480px) {
    .chp-mini-gallery-grid {
        grid-template-columns: 1fr;
    }

    .chp-ideal-grid {
        grid-template-columns: 1fr;
    }

    .chp-key-info {
        flex-direction: column;
        align-items: center;
    }

    .coco-haus-page .coco-venue-btn-primary,
    .coco-haus-page .coco-venue-btn-outline {
        padding: 12px 24px;
        font-size: 12px;
    }
}

/* ══════════════════════════════════════════════════════════
   LOCATION PAGES (Aldgate / Stratford)
   ══════════════════════════════════════════════════════════ */

/* ── Location toggle (Aldgate / Stratford) ────────────── */

.chp-loc-toggle {
    display: flex;
    justify-content: center;
    gap: 16px;
    padding: 32px 40px 0;
    background: var(--haus-bg);
}

.chp-loc-toggle-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 16px 36px;
    border: 1.5px solid var(--haus-border);
    border-radius: var(--haus-radius);
    background: var(--haus-bg2);
    color: var(--haus-text-dim);
    cursor: pointer;
    transition: all 0.3s var(--haus-ease);
    font-family: var(--haus-font-body);
    min-width: 180px;
}

.chp-loc-toggle-btn strong {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.06em;
}

.chp-loc-toggle-btn small {
    font-size: 12px;
    opacity: 0.6;
}

.chp-loc-toggle-btn:hover {
    border-color: var(--haus-gold-dim);
    color: var(--haus-text);
}

.chp-loc-toggle-btn.active {
    border-color: var(--haus-gold);
    background: linear-gradient(145deg, rgba(201, 162, 39, 0.08), var(--haus-bg2));
    color: var(--haus-text);
    box-shadow: 0 0 20px rgba(201, 162, 39, 0.1);
}

.chp-loc-toggle-btn.active strong {
    color: var(--haus-gold);
}

/* ── Location panels (swapped by JS) ─────────────────── */

.chp-loc-panel {
    display: none;
}

.chp-loc-panel.active {
    display: block;
}

/* ── Venue Gallery Carousel ───────────────────────────── */

.chp-venue-carousel {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    padding: 20px 20px 0;
    background: var(--haus-bg);
}

.chp-venue-carousel-track {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 7;
    border-radius: 14px;
    overflow: hidden;
    background: var(--haus-bg2);
}

.chp-venue-carousel-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.8s ease;
}

.chp-venue-carousel-slide.active {
    opacity: 1;
}

.chp-venue-carousel-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chp-venue-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 14px 0 6px;
}

.chp-venue-carousel-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: background 0.3s, transform 0.3s;
}

.chp-venue-carousel-dot.active {
    background: var(--haus-gold);
    transform: scale(1.3);
}

.chp-venue-carousel-dot:hover {
    background: rgba(255, 255, 255, 0.4);
}

/* ── Quick-nav pills ──────────────────────────────────── */

.chp-loc-pills {
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 24px 40px;
    background: var(--haus-bg);
    border-bottom: 1px solid var(--haus-border);
    flex-wrap: wrap;
}

.chp-loc-pill {
    font-family: var(--haus-font-body);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 8px 20px;
    border: 1px solid var(--haus-border);
    border-radius: 999px;
    color: var(--haus-text-dim);
    text-decoration: none;
    transition: all 0.3s var(--haus-ease);
}

.chp-loc-pill:hover,
.coco-haus-page a.chp-loc-pill:hover {
    border-color: var(--haus-gold-dim);
    color: var(--haus-text);
    opacity: 1;
}

.coco-haus-page a.chp-loc-pill--active:hover {
    color: #0D0D0D;
    opacity: 1;
}

.chp-loc-pill--active,
.coco-haus-page a.chp-loc-pill--active {
    background: linear-gradient(135deg, var(--haus-gold), var(--haus-gold-muted));
    border-color: var(--haus-gold);
    color: #0D0D0D;
}

/* Highlighted pill (special events) */
.chp-loc-pill--highlight,
.coco-haus-page a.chp-loc-pill--highlight {
    border-color: rgba(201,162,39,0.5);
    color: #C9A227;
    position: relative;
}
.chp-loc-pill--highlight::after {
    content: '';
    position: absolute;
    top: -2px;
    right: -2px;
    width: 7px;
    height: 7px;
    background: #C9A227;
    border-radius: 50%;
}
.coco-haus-page a.chp-loc-pill--highlight:hover {
    background: rgba(201,162,39,0.12);
    color: #C9A227;
}

/* ── Booking widget section ───────────────────────────── */

.chp-loc-booking {
    max-width: 700px;
    margin: 0 auto;
    padding: 60px 40px;
    text-align: center;
}

.chp-loc-booking h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 12px;
    letter-spacing: 0.08em;
}

.chp-loc-booking-hint {
    font-size: 14px;
    opacity: 0.6;
    margin: 0 0 28px;
}

.chp-loc-booking-frame {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--haus-border);
    background: #ffffff;
}

.chp-loc-booking-frame iframe {
    display: block;
    color-scheme: light;
    background: #ffffff;
}

.chp-loc-booking-fallback {
    margin: 16px 0 0;
    font-size: 13px;
    opacity: 0.5;
}

.chp-loc-booking-fallback a {
    color: var(--haus-gold);
    text-decoration: underline;
}

/* ── Pre-booking form ─────────────────────────────────── */

.coco-prebooking-form {
    text-align: left;
    max-width: 600px;
    margin: 0 auto;
}

.coco-pb-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
}

.coco-pb-row--single {
    grid-template-columns: 1fr;
}

.coco-pb-field label {
    display: block;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.7;
    margin-bottom: 6px;
    font-weight: 500;
}

.coco-pb-field input,
.coco-pb-field select {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid var(--haus-border, rgba(255,255,255,0.15));
    border-radius: 8px;
    background: var(--haus-bg2, #1a1a1a);
    color: inherit;
    font-size: 15px;
    font-family: inherit;
    transition: border-color 0.2s;
    -webkit-appearance: none;
}

.coco-pb-field input:focus,
.coco-pb-field select:focus {
    outline: none;
    border-color: var(--haus-gold, #c9a96e);
}

.coco-pb-field input::placeholder {
    opacity: 0.4;
}

.coco-pb-field select option {
    background: #1a1a1a;
    color: #fff;
}

.coco-pb-dinestay {
    margin: 20px 0 24px;
    padding: 16px 20px;
    background: rgba(201,169,110,0.08);
    border: 1px solid rgba(201,169,110,0.25);
    border-radius: 10px;
}

.coco-pb-dinestay label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
    font-size: 14px;
    line-height: 1.5;
}

.coco-pb-dinestay input[type="checkbox"] {
    margin-top: 3px;
    accent-color: var(--haus-gold, #c9a96e);
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.coco-pb-dinestay strong {
    color: var(--haus-gold, #c9a96e);
}

.coco-pb-error {
    background: rgba(220,53,69,0.12);
    color: #ff6b6b;
    padding: 12px 16px;
    border-radius: 8px;
    font-size: 14px;
    margin-bottom: 16px;
    text-align: center;
}

.coco-pb-submit {
    width: 100%;
    font-size: 15px;
    padding: 16px;
    letter-spacing: 0.1em;
}

.coco-pb-submit:disabled {
    opacity: 0.6;
    cursor: wait;
}

.coco-pb-confirmed {
    text-align: center;
    margin-bottom: 24px;
}

.coco-pb-confirmed-msg {
    font-size: 16px;
    opacity: 0.85;
}

.coco-pb-confirmed-msg span {
    color: var(--haus-gold, #c9a96e);
    font-weight: 600;
}

.coco-pb-back {
    display: inline-block;
    margin-top: 16px;
    padding: 8px 16px;
    background: none;
    border: 1px solid var(--haus-border, rgba(255,255,255,0.15));
    border-radius: 6px;
    color: inherit;
    font-size: 13px;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.2s;
}

.coco-pb-back:hover {
    opacity: 1;
}

.chp-feature--highlight {
    animation: dinestay-pulse 1s ease-in-out 2;
    border: 2px solid var(--haus-gold, #c9a96e);
}

@keyframes dinestay-pulse {
    0%, 100% { border-color: var(--haus-gold, #c9a96e); }
    50% { border-color: rgba(201,169,110,0.3); }
}

@media (max-width: 600px) {
    .coco-pb-row {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .coco-prebooking-form {
        padding: 0 4px;
    }
}

/* ── Step panels ─────────────────────────────────────── */

.coco-pb-step {
    display: none;
}

.coco-pb-step.active {
    display: block;
    animation: cocoPbFadeIn 0.3s ease;
}

@keyframes cocoPbFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ── Progress dots ───────────────────────────────────── */

.coco-pb-progress {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin: 0 0 28px;
}

.coco-pb-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.15);
    transition: background 0.3s, box-shadow 0.3s;
}

.coco-pb-dot.active {
    background: var(--haus-gold);
    box-shadow: 0 0 6px var(--haus-gold-dim);
}

.coco-pb-dot.completed {
    background: #4CAF50;
}

/* ── Date strip ──────────────────────────────────────── */

.coco-pb-date-strip-label,
.coco-pb-time-grid-label {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    opacity: 0.7;
    margin-bottom: 10px;
    font-weight: 500;
}

.coco-pb-date-strip {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding: 4px 0 12px;
    margin-bottom: 20px;
    scrollbar-width: thin;
    scrollbar-color: var(--haus-gold-dim) transparent;
}

.coco-pb-date-strip::-webkit-scrollbar {
    height: 4px;
}

.coco-pb-date-strip::-webkit-scrollbar-thumb {
    background: var(--haus-gold-dim);
    border-radius: 4px;
}

.coco-pb-party-inline {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    font-size: 14px;
    color: var(--haus-text-dim);
}

.coco-pb-party-inline label {
    font-weight: 600;
    letter-spacing: 0.03em;
}

.coco-pb-party-inline select {
    padding: 8px 14px;
    background: var(--haus-bg3, #111);
    border: 1px solid var(--haus-border);
    border-radius: 8px;
    color: var(--haus-text, #FAF7F0);
    font-size: 14px;
    font-family: inherit;
    cursor: pointer;
}

.coco-pb-party-inline select:focus {
    outline: none;
    border-color: var(--haus-gold);
}

.coco-pb-date-pill {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 10px 14px;
    min-width: 60px;
    background: var(--haus-bg3, #111);
    border: 1px solid var(--haus-border);
    border-radius: 10px;
    color: var(--haus-text, #FAF7F0);
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
    text-align: center;
    user-select: none;
}

.coco-pb-date-pill:hover {
    border-color: var(--haus-gold-dim);
}

.coco-pb-date-pill.active {
    border-color: var(--haus-gold);
    background: rgba(201, 162, 39, 0.1);
}

.coco-pb-date-pill-day {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.6;
}

.coco-pb-date-pill-num {
    font-size: 18px;
    font-weight: 600;
}

.coco-pb-date-pill-month {
    font-size: 10px;
    text-transform: uppercase;
    opacity: 0.5;
}

/* Fully booked date pill */
.coco-pb-date-pill--sold-out {
    opacity: 0.5;
    cursor: pointer;
    position: relative;
    border-color: rgba(239, 68, 68, 0.5);
    background: rgba(239, 68, 68, 0.05);
}

.coco-pb-date-pill--sold-out:hover {
    border-color: rgba(239, 68, 68, 0.5);
    background: rgba(239, 68, 68, 0.05);
}

.coco-pb-date-pill--sold-out .coco-pb-date-pill-month {
    display: none;
}

.coco-pb-date-pill-badge {
    font-size: 8px;
    font-weight: 700;
    letter-spacing: 0.3px;
    color: #ef4444;
    line-height: 1.3;
    text-align: center;
    margin-top: 2px;
}

.coco-pb-loading {
    text-align: center;
    padding: 20px;
    opacity: 0.5;
    font-size: 14px;
}

/* ── Time grid ───────────────────────────────────────── */

.coco-pb-time-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 10px;
    margin-bottom: 24px;
}

.coco-pb-time-btn {
    position: relative;
    padding: 12px 8px;
    border: 1px solid var(--haus-border);
    border-radius: 8px;
    background: var(--haus-bg3, #111);
    color: var(--haus-text);
    font-size: 14px;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.2s, opacity 0.2s;
    text-align: center;
}

.coco-pb-time-btn:hover:not(:disabled) {
    border-color: var(--haus-gold-dim);
}

.coco-pb-time-btn.active {
    border-color: var(--haus-gold);
    background: rgba(201, 162, 39, 0.1);
}

.coco-pb-time-btn:disabled {
    opacity: 0.25;
    cursor: not-allowed;
}

.coco-pb-time-badge {
    position: absolute;
    top: -6px;
    right: -6px;
    background: #e65100;
    color: #fff;
    font-size: 9px;
    font-weight: 600;
    padding: 2px 5px;
    border-radius: 4px;
    letter-spacing: 0.03em;
    line-height: 1;
}

.coco-pb-time-badge--soldout {
    background: #666;
    color: #ccc;
}

.coco-pb-time-btn--has-offer {
    padding-bottom: 26px;
}

.coco-pb-time-offer {
    display: block;
    position: absolute;
    bottom: 4px;
    left: 4px;
    right: 4px;
    font-size: 10px;
    line-height: 1.2;
    color: var(--haus-gold, #c9a227);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    opacity: 0.85;
}

/* ── Deposit info panel (step 2) ─────────────────────── */

.coco-pb-deposit-info {
    margin: 20px 0 24px;
    padding: 16px 20px;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.6;
    animation: cocoPbFadeIn 0.3s ease;
}

.coco-pb-deposit-info--deposit {
    background: rgba(201, 162, 39, 0.08);
    border: 1px solid rgba(201, 162, 39, 0.25);
}

.coco-pb-deposit-info--card {
    background: rgba(59, 130, 246, 0.08);
    border: 1px solid rgba(59, 130, 246, 0.25);
}

.coco-pb-deposit-info--free {
    background: rgba(76, 175, 80, 0.08);
    border: 1px solid rgba(76, 175, 80, 0.25);
}

.coco-pb-deposit-badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 3px 8px;
    border-radius: 4px;
    margin-bottom: 8px;
}

.coco-pb-deposit-info--deposit .coco-pb-deposit-badge {
    background: var(--haus-gold);
    color: #000;
}

.coco-pb-deposit-info--card .coco-pb-deposit-badge {
    background: #3b82f6;
    color: #fff;
}

.coco-pb-deposit-info--free .coco-pb-deposit-badge {
    background: #4CAF50;
    color: #fff;
}

.coco-pb-deposit-amount {
    font-size: 20px;
    font-weight: 700;
    color: var(--haus-text);
    margin: 4px 0;
}

.coco-pb-deposit-breakdown {
    font-size: 13px;
    opacity: 0.7;
    margin-bottom: 6px;
}

.coco-pb-deposit-terms {
    font-size: 12px;
    opacity: 0.6;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--haus-border);
}

.coco-pb-deposit-note {
    font-size: 12px;
    opacity: 0.5;
    margin-top: 6px;
    font-style: italic;
}

/* ── Payment method badges ──────────────────── */

.coco-pb-pay-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

.coco-pb-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.3px;
    white-space: nowrap;
}

/* ── Experience event info (step 2) ──────────────────── */

.coco-pb-deposit-info--experience {
    background: rgba(201, 162, 39, 0.06);
    border: 1px solid rgba(201, 162, 39, 0.2);
}

.coco-pb-deposit-info--experience .coco-pb-deposit-badge {
    background: var(--haus-gold);
    color: #000;
}

.coco-pb-exp-desc {
    font-size: 13px;
    opacity: 0.75;
    margin: 6px 0 12px;
}

/* ── Experience Event Image Carousel ── */
.coco-pb-exp-carousel {
    position: relative;
    margin-bottom: 14px;
    border-radius: 10px;
    overflow: hidden;
}

.coco-pb-exp-carousel-track {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #111;
}

.coco-pb-exp-carousel-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.6s ease;
}

.coco-pb-exp-carousel-slide.active {
    opacity: 1;
}

.coco-pb-exp-carousel-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.coco-pb-exp-carousel-dots {
    display: flex;
    justify-content: center;
    gap: 6px;
    padding: 10px 0 4px;
}

.coco-pb-exp-carousel-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    cursor: pointer;
    transition: background 0.3s, transform 0.3s;
}

.coco-pb-exp-carousel-dot.active {
    background: var(--haus-gold);
    transform: scale(1.3);
}

.coco-pb-exp-carousel-dot:hover {
    background: rgba(255, 255, 255, 0.5);
}

/* ── Single flyer image ── */
.coco-pb-exp-flyer {
    margin-bottom: 12px;
    border-radius: 10px;
    overflow: hidden;
}

.coco-pb-exp-flyer img {
    display: block;
    width: 100%;
    max-height: 220px;
    object-fit: cover;
}

.coco-pb-exp-packages {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.coco-pb-exp-package {
    padding: 10px 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid var(--haus-border);
    border-radius: 8px;
}

.coco-pb-exp-package-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.coco-pb-exp-package-header strong {
    font-size: 14px;
}

.coco-pb-exp-package-price {
    font-size: 15px;
    font-weight: 700;
    color: var(--haus-gold);
    white-space: nowrap;
}

.coco-pb-exp-package-desc {
    font-size: 12px;
    opacity: 0.6;
    margin-top: 4px;
}

/* Selectable package cards */
.coco-pb-exp-package--selectable {
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
}

.coco-pb-exp-package--selectable:hover {
    border-color: rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.06);
}

.coco-pb-exp-package--selected {
    border-color: var(--haus-gold) !important;
    background: rgba(201, 169, 110, 0.08) !important;
}

.coco-pb-exp-pkg-radio {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    min-width: 18px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    margin-right: 8px;
    vertical-align: middle;
}

.coco-pb-exp-package--selected .coco-pb-exp-pkg-radio {
    border-color: var(--haus-gold);
}

.coco-pb-exp-pkg-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: transparent;
}

.coco-pb-exp-package--selected .coco-pb-exp-pkg-dot {
    background: var(--haus-gold);
}

.coco-pb-exp-price-invenue {
    text-decoration: line-through;
    opacity: 0.5;
    font-weight: 400;
    font-size: 13px;
}

.coco-pb-exp-price-savings {
    color: #22c55e;
    font-size: 12px;
    font-weight: 500;
}

/* ── Google Sign-In container ────────────────────────── */

.coco-pb-google-signin {
    text-align: center;
    margin-bottom: 20px;
}

.coco-pb-google-signin:empty {
    display: none;
}

.coco-pb-google-divider {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 16px 0;
    font-size: 12px;
    opacity: 0.5;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.coco-pb-google-divider::before,
.coco-pb-google-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: var(--haus-border);
}

/* ── Step 2 & 3 back buttons ────────────────────────── */

#coco-pb-back-1,
#coco-pb-back-2 {
    margin-top: 8px;
}

/* ── Responsive: date strip + time grid ─────────────── */

@media (max-width: 600px) {
    /* Rolling experiences (First Pour, Drunch, etc) can surface 15-20+
       arrival pills. On mobile a grid of that many pills wraps into 6-7
       rows and pushes the Continue button miles down the page. Switch to
       a single horizontal-scrolling strip — the OpenTable/Resy pattern.
       Customers swipe to find their time; no wall of pills.              */
    .coco-pb-time-grid {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
        gap: 8px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 8px;
        /* Edge fade so the user sees there's more to scroll to */
        mask-image: linear-gradient(to right, transparent 0, black 16px, black calc(100% - 16px), transparent 100%);
    }
    .coco-pb-time-grid::-webkit-scrollbar { height: 4px; }
    .coco-pb-time-grid::-webkit-scrollbar-thumb { background: rgba(188,133,84,0.4); border-radius: 2px; }
    .coco-pb-time-grid .coco-pb-time-btn {
        flex: 0 0 auto;
        min-width: 84px;
        scroll-snap-align: start;
    }

    .coco-pb-date-pill {
        min-width: 54px;
        padding: 8px 10px;
    }
}

/* ── Feature cards ────────────────────────────────────── */

.chp-loc-features {
    padding: 60px 80px;
    background: var(--haus-bg2);
    border-top: 1px solid var(--haus-border);
    text-align: center;
}

.chp-loc-features h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-loc-features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
}

.chp-loc-feature-card {
    background: var(--haus-bg);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 28px 24px;
    text-align: left;
    transition: all 0.3s var(--haus-ease);
}

.chp-loc-feature-card:hover {
    border-color: var(--haus-gold-dim);
    transform: translateY(-3px);
}

.chp-loc-feature-card h3 {
    font-family: var(--haus-font-body);
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 8px;
    letter-spacing: 0.04em;
    color: var(--haus-gold);
}

.chp-loc-feature-card p {
    font-size: 14px;
    line-height: 1.6;
    opacity: 0.75;
    margin: 0;
}

/* ── Dine & Stay feature variant ──────────────────────── */

.chp-feature--dinestay {
    border-color: var(--haus-gold-dim);
    background: linear-gradient(180deg, rgba(201, 162, 39, 0.04) 0%, var(--haus-bg) 100%);
}

/* ── Venue details section ────────────────────────────── */

.chp-loc-details {
    padding: 60px 80px;
    text-align: center;
}

.chp-loc-details h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-loc-details-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    max-width: 1000px;
    margin: 0 auto;
    text-align: left;
}

.chp-loc-detail-item {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius-sm);
    padding: 20px 24px;
}

.chp-loc-detail-item h4 {
    font-family: var(--haus-font-body);
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    margin: 0 0 6px;
    color: var(--haus-gold);
    opacity: 0.7;
}

.chp-loc-detail-item p {
    font-size: 14px;
    margin: 0;
    line-height: 1.5;
}

.chp-loc-detail-item a {
    color: var(--haus-gold);
}

/* ── Location page — events variant ───────────────────── */

.chp-events--location h2 {
    color: var(--haus-gold);
}

/* ── Location page responsive ─────────────────────────── */

@media (max-width: 768px) {
    .chp-loc-toggle {
        padding: 24px 16px 0;
        gap: 10px;
    }

    .chp-loc-toggle-btn {
        min-width: 0;
        flex: 1;
        padding: 12px 16px;
    }

    .chp-loc-toggle-btn strong {
        font-size: 14px;
    }

    .chp-venue-carousel {
        padding: 0 12px;
    }

    .chp-venue-carousel-track {
        aspect-ratio: 16 / 9;
        border-radius: 10px;
    }

    .chp-loc-pills {
        padding: 16px 16px;
        gap: 8px;
    }

    .chp-loc-pill {
        font-size: 11px;
        padding: 6px 14px;
    }

    .chp-loc-booking {
        padding: 40px 16px;
    }

    .chp-loc-booking-frame iframe {
        height: 500px !important;
    }

    .chp-loc-features {
        padding: 40px 24px;
    }

    .chp-loc-features-grid {
        grid-template-columns: 1fr;
    }

    .chp-loc-details {
        padding: 40px 24px;
    }

    .chp-loc-details-grid {
        grid-template-columns: 1fr;
    }
}

/* ── Lightbox ──────────────────────────────────────────── */

.chp-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.92);
    z-index: 99999;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}

.chp-lightbox img {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    display: block;
    margin: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.chp-lightbox-close {
    position: absolute;
    top: 24px;
    right: 32px;
    font-size: 36px;
    color: #fff;
    cursor: pointer;
    z-index: 10;
    opacity: 0.7;
    transition: opacity 0.2s;
    line-height: 1;
}

.chp-lightbox-close:hover {
    opacity: 1;
}

/* ══════════════════════════════════════════════════════════
   GROUPS & PRIVATE DINING PAGE
   ══════════════════════════════════════════════════════════ */

.chp-grp-sub {
    font-size: 15px;
    opacity: 0.6;
    margin: -10px 0 30px;
    text-align: center;
}

/* ── Occasion cards ──────────────────────────────────────── */

.chp-grp-occasions {
    padding: 60px 80px;
    text-align: center;
}

.chp-grp-occasions h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 8px;
    letter-spacing: 0.08em;
}

.chp-grp-occasions-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    max-width: 1100px;
    margin: 0 auto;
}

.chp-grp-occasion-card {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 32px 24px;
    text-align: left;
    transition: all 0.3s var(--haus-ease);
}

.chp-grp-occasion-card:hover {
    border-color: var(--haus-gold-dim);
    transform: translateY(-4px);
    box-shadow: 0 16px 50px rgba(0, 0, 0, 0.4);
}

.chp-grp-occasion-icon {
    font-size: 32px;
    margin-bottom: 14px;
}

.chp-grp-occasion-card h3 {
    font-family: var(--haus-font-body);
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 8px;
    color: var(--haus-gold);
    letter-spacing: 0.04em;
}

.chp-grp-occasion-card p {
    font-size: 14px;
    line-height: 1.6;
    opacity: 0.75;
    margin: 0;
}

/* ── How it works steps ──────────────────────────────────── */

.chp-grp-steps {
    padding: 60px 80px;
    background: var(--haus-bg2);
    border-top: 1px solid var(--haus-border);
    border-bottom: 1px solid var(--haus-border);
    text-align: center;
}

.chp-grp-steps h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-grp-steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
}

.chp-grp-step {
    text-align: center;
    padding: 20px 16px;
}

.chp-grp-step-num {
    width: 44px;
    height: 44px;
    margin: 0 auto 16px;
    border-radius: 50%;
    border: 2px solid var(--haus-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--haus-font-display);
    font-size: 18px;
    font-weight: 600;
    color: var(--haus-gold);
}

.chp-grp-step h3 {
    font-family: var(--haus-font-body);
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 8px;
    letter-spacing: 0.04em;
}

.chp-grp-step p {
    font-size: 13px;
    line-height: 1.6;
    opacity: 0.7;
    margin: 0;
}

/* ── Set menus ───────────────────────────────────────────── */

.chp-grp-set-menus {
    padding: 60px 80px;
    text-align: center;
}

.chp-grp-set-menus h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 8px;
    letter-spacing: 0.08em;
}

.chp-grp-menus-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto 24px;
}

.chp-grp-menu-card {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 36px 28px;
    text-align: left;
    transition: all 0.3s var(--haus-ease);
    display: flex;
    flex-direction: column;
}

.chp-grp-menu-card:hover {
    border-color: rgba(201, 162, 39, 0.2);
    transform: translateY(-4px);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

.chp-grp-menu-card--featured {
    border-color: var(--haus-gold-dim);
    background: linear-gradient(145deg, rgba(201, 162, 39, 0.06), var(--haus-bg2));
    position: relative;
}

.chp-grp-menu-card--featured::before {
    content: "RECOMMENDED";
    position: absolute;
    top: -1px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--haus-gold);
    color: #0D0D0D;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.15em;
    padding: 4px 16px;
    border-radius: 0 0 8px 8px;
}

.chp-grp-menu-card h3 {
    font-family: var(--haus-font-display);
    font-size: 22px;
    font-weight: 500;
    margin: 0 0 8px;
    letter-spacing: 0.06em;
}

.chp-grp-menu-price {
    font-family: var(--haus-font-body);
    font-size: 18px;
    font-weight: 600;
    color: var(--haus-gold);
    margin-bottom: 12px;
}

.chp-grp-menu-desc {
    font-size: 14px;
    opacity: 0.7;
    line-height: 1.6;
    margin: 0 0 16px;
}

.chp-grp-menu-items {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
    flex: 1;
}

.chp-grp-menu-items li {
    font-size: 13px;
    padding: 7px 0;
    border-bottom: 1px solid var(--haus-border);
    opacity: 0.75;
    padding-left: 16px;
    position: relative;
    line-height: 1.4;
}

.chp-grp-menu-items li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 13px;
    width: 6px;
    height: 6px;
    background: var(--haus-gold);
    border-radius: 50%;
}

.chp-grp-menu-items li:last-child {
    border-bottom: none;
}

.chp-grp-menu-note {
    font-size: 12px;
    font-style: italic;
    opacity: 0.5;
    margin: 0;
}

.chp-grp-menu-disclaimer {
    font-size: 12px;
    opacity: 0.45;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

/* ── Group enquiry form ──────────────────────────────────── */

.chp-grp-enquiry {
    max-width: 780px;
    margin: 0 auto;
    padding: 60px 40px;
    text-align: center;
}

.chp-grp-enquiry h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 8px;
    letter-spacing: 0.08em;
}

.chp-grp-form {
    text-align: left;
}

.chp-grp-booking-form {
    max-width: 560px;
    margin: 0 auto;
    text-align: left;
}

.chp-grp-booking-form .coco-venue-btn-primary {
    width: 100%;
    margin-top: 8px;
}

.chp-grp-alt-contact {
    text-align: center;
    font-size: 13px;
    color: rgba(255,255,255,0.5);
    margin-top: 16px;
}

.chp-grp-alt-contact a {
    color: var(--haus-gold);
    text-decoration: none;
}

.chp-grp-alt-contact a:hover {
    text-decoration: underline;
}

/* ── Good to know cards ──────────────────────────────────── */

.chp-grp-info {
    padding: 60px 80px;
    background: var(--haus-bg2);
    border-top: 1px solid var(--haus-border);
    text-align: center;
}

.chp-grp-info h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(24px, 4vw, 32px);
    font-weight: 500;
    margin: 0 0 30px;
    letter-spacing: 0.08em;
}

.chp-grp-info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    max-width: 1100px;
    margin: 0 auto;
}

.chp-grp-info-card {
    background: var(--haus-bg);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius);
    padding: 32px 24px;
    text-align: left;
}

.chp-grp-info-card h3 {
    font-family: var(--haus-font-display);
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 4px;
    letter-spacing: 0.06em;
}

.chp-grp-info-sub {
    font-size: 13px;
    color: var(--haus-gold);
    opacity: 0.8;
    margin: 0 0 16px;
}

.chp-grp-info-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.chp-grp-info-list li {
    font-size: 13px;
    padding: 7px 0;
    border-bottom: 1px solid var(--haus-border);
    opacity: 0.7;
    padding-left: 16px;
    position: relative;
    line-height: 1.5;
}

.chp-grp-info-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--haus-gold);
    font-size: 11px;
}

.chp-grp-info-list li:last-child {
    border-bottom: none;
}

/* ── Groups page responsive ──────────────────────────────── */

@media (max-width: 1024px) {
    .chp-grp-occasions-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .chp-grp-menus-grid {
        grid-template-columns: 1fr;
        max-width: 500px;
    }

    .chp-grp-info-grid {
        grid-template-columns: 1fr;
        max-width: 500px;
    }
}

@media (max-width: 768px) {
    .chp-grp-occasions {
        padding: 40px 24px;
    }

    .chp-grp-occasions-grid {
        grid-template-columns: 1fr;
    }

    .chp-grp-steps {
        padding: 40px 24px;
    }

    .chp-grp-steps-grid {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .chp-grp-set-menus {
        padding: 40px 24px;
    }

    .chp-grp-enquiry {
        padding: 40px 16px;
    }

    .chp-grp-info {
        padding: 40px 24px;
    }
}

@media (max-width: 480px) {
    .chp-grp-steps-grid {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════════════════
   CAREERS PAGE
   ═══════════════════════════════════════════════════════════ */

/* ── Benefits ────────────────────────────────────────────── */

.chp-careers-benefits {
    padding: 60px 40px;
    text-align: center;
}

.chp-careers-benefits h2 {
    font-family: var(--haus-font-display);
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 36px;
}

.chp-careers-benefits-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
    max-width: 800px;
    margin: 0 auto;
    text-align: left;
}

.chp-careers-benefit-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    background: var(--haus-surface);
    border: 1px solid var(--haus-border);
    border-radius: 12px;
    font-size: 14px;
    line-height: 1.5;
}

.chp-careers-benefit-check {
    color: var(--haus-gold);
    font-size: 16px;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 1px;
}

/* ── Job Openings Grid ───────────────────────────────────── */

.chp-careers-jobs {
    padding: 60px 40px;
    text-align: center;
}

.chp-careers-jobs h2 {
    font-family: var(--haus-font-display);
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 36px;
}

.chp-careers-jobs-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 900px;
    margin: 0 auto;
    text-align: left;
}

.chp-careers-job-card {
    background: var(--haus-surface);
    border: 1px solid var(--haus-border);
    border-radius: 16px;
    padding: 28px;
    display: flex;
    flex-direction: column;
    transition: border-color 0.25s ease;
}

.chp-careers-job-card:hover {
    border-color: var(--haus-gold-dim);
}

.chp-careers-job-card h3 {
    font-family: var(--haus-font-display);
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 12px;
    letter-spacing: 0.06em;
}

.chp-careers-job-meta {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.chp-careers-job-tag {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(201, 169, 110, 0.12);
    color: var(--haus-gold);
    border: 1px solid rgba(201, 169, 110, 0.2);
}

.chp-careers-job-card p {
    font-size: 13px;
    line-height: 1.6;
    opacity: 0.7;
    margin: 0 0 20px;
    flex: 1;
}

.chp-careers-apply-btn {
    align-self: flex-start;
    font-size: 12px !important;
    padding: 10px 24px !important;
}

/* ── No openings box ─────────────────────────────────────── */

.chp-info-box {
    max-width: 600px;
    margin: 0 auto;
    padding: 40px;
    background: var(--haus-surface);
    border: 1px solid var(--haus-border);
    border-radius: 16px;
    text-align: center;
}

.chp-info-box h3 {
    font-family: var(--haus-font-display);
    font-size: 20px;
    margin: 0 0 12px;
    letter-spacing: 0.06em;
}

.chp-info-box p {
    font-size: 14px;
    line-height: 1.6;
    opacity: 0.7;
    margin: 0;
}

/* ── Application form ────────────────────────────────────── */

.chp-careers-apply {
    padding: 60px 40px;
    max-width: 780px;
    margin: 0 auto;
    text-align: center;
}

.chp-careers-apply h2 {
    font-family: var(--haus-font-display);
    font-size: 28px;
    font-weight: 400;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin: 0 0 8px;
}

.chp-careers-form .chp-form-field input[type="file"] {
    background: var(--haus-surface);
    border: 1px dashed var(--haus-border);
    border-radius: 10px;
    padding: 14px;
    color: var(--haus-text);
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
}

.chp-careers-form .chp-form-field input[type="file"]:hover {
    border-color: var(--haus-gold-dim);
}

.chp-careers-photo-note {
    font-size: 11px;
    color: var(--haus-gold);
    opacity: 0.7;
    margin: 8px 0 0;
    line-height: 1.4;
}

.chp-careers-submit {
    margin-top: 8px;
}

/* ── Application success ─────────────────────────────────── */

.chp-careers-success {
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.25);
    border-radius: 12px;
    padding: 24px;
    margin: 16px 0;
    text-align: center;
}

.chp-careers-success h3 {
    font-family: var(--haus-font-display);
    font-size: 18px;
    color: #22c55e;
    margin: 0 0 8px;
}

.chp-careers-success p {
    font-size: 14px;
    opacity: 0.7;
    margin: 0;
}

/* ── Careers responsive ──────────────────────────────────── */

@media (max-width: 768px) {
    .chp-careers-benefits {
        padding: 40px 24px;
    }

    .chp-careers-benefits-grid {
        grid-template-columns: 1fr;
    }

    .chp-careers-jobs {
        padding: 40px 24px;
    }

    .chp-careers-jobs-grid {
        grid-template-columns: 1fr;
    }

    .chp-careers-apply {
        padding: 40px 16px;
    }
}

/* ═══════════════════════════════════════════════════════════
   DOWNLOAD SECTION
   ═══════════════════════════════════════════════════════════ */

.chp-download-section {
    padding: 48px 32px;
    text-align: center;
    border-top: 1px solid var(--haus-border);
    border-bottom: 1px solid var(--haus-border);
    margin: 32px auto;
    max-width: 800px;
}

.chp-download-section h2 {
    font-family: var(--haus-font-display);
    font-size: 22px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--haus-gold);
    margin: 0 0 12px;
}

.chp-download-desc {
    font-size: 14px;
    opacity: 0.65;
    margin: 0 0 24px;
    line-height: 1.6;
}

.chp-download-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

.chp-download-btn {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    padding: 10px 20px;
    letter-spacing: 0.06em;
}

.chp-download-btn svg {
    flex-shrink: 0;
}

@media (max-width: 600px) {
    .chp-download-section {
        padding: 32px 20px;
    }

    .chp-download-buttons {
        flex-direction: column;
        align-items: center;
    }

    .chp-download-btn {
        width: 100%;
        max-width: 280px;
        justify-content: center;
    }
}

/* ═══════════════════════════════════════════════════════════
   GROUPS — SHISHA NOTE
   ═══════════════════════════════════════════════════════════ */

.chp-grp-shisha-note {
    background: rgba(201, 169, 110, 0.08);
    border: 1px solid rgba(201, 169, 110, 0.2);
    border-radius: 12px;
    padding: 16px 24px;
    margin: 24px auto;
    max-width: 640px;
    text-align: center;
}

.chp-grp-shisha-note p {
    margin: 0;
    font-size: 14px;
    color: var(--haus-gold);
    line-height: 1.5;
}

.chp-grp-shisha-note strong {
    color: var(--haus-gold);
}

/* ═══════════════════════════════════════════════════════════
   SET MENU SELECTION PAGE
   ═══════════════════════════════════════════════════════════ */

.chp-selection-summary {
    max-width: 700px;
    margin: 0 auto;
    padding: 40px 32px;
}

.chp-selection-details {
    background: var(--haus-surface);
    border: 1px solid var(--haus-border);
    border-radius: 16px;
    padding: 24px 28px;
}

.chp-selection-detail {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,0.06);
}

.chp-selection-detail:last-child {
    border-bottom: none;
}

.chp-selection-label {
    font-size: 13px;
    opacity: 0.55;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.chp-selection-value {
    font-size: 14px;
    font-weight: 500;
    text-align: right;
}

.chp-selection-value small {
    font-size: 11px;
    opacity: 0.5;
    margin-left: 4px;
}

.chp-selection-detail--highlight {
    margin-top: 8px;
    padding-top: 16px;
    border-top: 2px solid var(--haus-gold-dim);
    border-bottom: none;
}

.chp-selection-detail--highlight .chp-selection-label,
.chp-selection-detail--highlight .chp-selection-value {
    color: var(--haus-gold);
    font-size: 15px;
    font-weight: 600;
}

.chp-selection-form-section {
    max-width: 700px;
    margin: 0 auto;
    padding: 40px 32px;
    text-align: center;
}

.chp-selection-form-section h2 {
    font-family: var(--haus-font-display);
    font-size: 24px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--haus-gold);
    margin: 0 0 8px;
}

.chp-selection-form {
    text-align: left;
    margin-top: 24px;
}

.chp-selection-options {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 10px;
    margin-top: 8px;
}

.chp-selection-option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 16px;
    background: var(--haus-surface);
    border: 1px solid var(--haus-border);
    border-radius: 10px;
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s;
    font-size: 14px;
}

.chp-selection-option:hover {
    border-color: var(--haus-gold-dim);
}

.chp-selection-option input[type="radio"],
.chp-selection-option input[type="checkbox"] {
    accent-color: var(--haus-gold);
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.chp-selection-option input[type="radio"]:checked + span,
.chp-selection-option input[type="checkbox"]:checked + span {
    color: var(--haus-gold);
    font-weight: 600;
}

.chp-form-hint {
    font-size: 12px;
    opacity: 0.5;
    margin: 4px 0 8px;
}

.chp-selection-msg {
    margin-top: 20px;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
}

.chp-selection-msg.is-success {
    background: rgba(34, 197, 94, 0.08);
    border: 1px solid rgba(34, 197, 94, 0.25);
}

.chp-selection-msg.is-success h3 {
    color: #22c55e;
    font-family: var(--haus-font-display);
    font-size: 18px;
    margin: 0 0 8px;
}

.chp-selection-msg.is-success p {
    font-size: 14px;
    opacity: 0.7;
    margin: 0;
}

.chp-selection-msg.is-error {
    background: rgba(239, 68, 68, 0.08);
    border: 1px solid rgba(239, 68, 68, 0.25);
    color: #ef4444;
}

.chp-selection-full {
    background: rgba(34, 197, 94, 0.05);
    border: 1px solid rgba(34, 197, 94, 0.2);
    border-radius: 16px;
    padding: 32px;
    text-align: center;
}

.chp-selection-full h2 {
    color: #22c55e;
    font-family: var(--haus-font-display);
    margin: 0 0 8px;
}

.chp-selection-full p {
    opacity: 0.65;
    margin: 0;
}

.chp-selection-allergen-note {
    max-width: 700px;
    margin: 0 auto;
    padding: 24px 32px 48px;
    text-align: center;
}

.chp-selection-allergen-note p {
    font-size: 12px;
    opacity: 0.45;
    margin: 0 0 6px;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .chp-selection-summary {
        padding: 28px 20px;
    }

    .chp-selection-details {
        padding: 18px;
        border-radius: 12px;
    }

    .chp-selection-detail {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
        padding: 10px 0;
    }

    .chp-selection-label {
        font-size: 11px;
    }

    .chp-selection-value {
        font-size: 14px;
    }

    .chp-selection-sharing-banner {
        margin: 0 16px 24px;
        padding: 24px 20px;
        border-radius: 12px;
    }

    .chp-selection-sharing-banner h2 {
        font-size: 17px;
    }

    .chp-selection-sharing-banner p {
        font-size: 13px;
    }

    .chp-selection-inclusions {
        padding: 0 16px;
        margin-bottom: 24px;
    }

    .chp-selection-inclusions h2 {
        font-size: 17px;
    }

    .chp-selection-inclusions-content {
        padding: 18px 16px;
        border-radius: 10px;
    }

    .chp-selection-inclusions-content li {
        font-size: 13px;
        padding-left: 16px;
    }

    .chp-selection-form-section {
        padding: 28px 16px;
    }

    .chp-selection-form-section h2 {
        font-size: 20px;
    }

    .chp-selection-form-section .chp-form-row {
        grid-template-columns: 1fr;
    }

    .chp-selection-options {
        grid-template-columns: 1fr;
    }

    .chp-selection-option {
        padding: 12px 14px;
    }

    .chp-selection-full {
        padding: 24px 16px;
        border-radius: 12px;
    }

    .chp-selection-allergen-note {
        padding: 16px 16px 40px;
    }
}

@media (max-width: 480px) {
    .coco-haus-page--selection .chp-hero--short .chp-hero-content {
        padding: 0 16px 40px;
    }

    .coco-haus-page--selection .chp-hero h1 {
        font-size: 22px;
        letter-spacing: 0.08em;
    }

    .coco-haus-page--selection .chp-hero-sub {
        font-size: 12px;
    }

    .chp-selection-summary {
        padding: 20px 12px;
    }

    .chp-selection-details {
        padding: 14px;
    }

    .chp-selection-sharing-banner {
        margin: 0 12px 20px;
        padding: 20px 16px;
    }

    .chp-sharing-icon {
        font-size: 28px;
    }

    .chp-selection-inclusions {
        padding: 0 12px;
    }

    .chp-selection-form-section {
        padding: 24px 12px;
    }

    .chp-selection-form-section h2 {
        font-size: 18px;
        letter-spacing: 0.08em;
    }

    .chp-selection-form-section .chp-grp-sub {
        font-size: 13px;
        margin-bottom: 20px;
    }
}

/* Prevent iOS zoom on focus — selection page inputs must be >= 16px */
@media (max-width: 768px) {
    .coco-haus-page--selection .chp-form-field input,
    .coco-haus-page--selection .chp-form-field select,
    .coco-haus-page--selection .chp-form-field textarea {
        font-size: 16px;
    }
}

/* Enquiry form results */
.chp-enquiry-success {
    background: rgba(201, 169, 110, 0.08);
    border: 1px solid rgba(201, 169, 110, 0.25);
    border-radius: 12px;
    padding: 24px;
    margin-top: 20px;
    text-align: center;
}

.chp-enquiry-success p {
    margin: 0;
    color: #FAF7F0;
    font-size: 14px;
    line-height: 1.6;
}

.chp-enquiry-success strong {
    color: #C9A96E;
}

/* Selection page — Sharing concept banner */
.chp-selection-sharing-banner {
    max-width: 700px;
    margin: 0 auto 28px;
    padding: 32px 28px;
    text-align: center;
    background: rgba(201, 169, 110, 0.06);
    border: 1px solid rgba(201, 169, 110, 0.18);
    border-radius: 16px;
}

.chp-sharing-icon {
    font-size: 36px;
    margin-bottom: 12px;
    line-height: 1;
}

.chp-selection-sharing-banner h2 {
    font-size: 20px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #C9A96E;
    margin: 0 0 12px;
}

.chp-selection-sharing-banner p {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(250, 247, 240, 0.7);
    margin: 0;
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
}

.chp-selection-sharing-banner strong {
    color: #FAF7F0;
}

/* Selection page — What's Included */
.chp-selection-inclusions {
    max-width: 700px;
    margin: 0 auto 32px;
    padding: 0 24px;
}

.chp-selection-inclusions h2 {
    font-size: 20px;
    letter-spacing: 0.08em;
    margin: 0 0 16px;
    color: #C9A96E;
}

.chp-selection-inclusions-content {
    background: rgba(201, 169, 110, 0.06);
    border: 1px solid rgba(201, 169, 110, 0.15);
    border-radius: 12px;
    padding: 24px 28px;
}

.chp-selection-inclusions-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.chp-selection-inclusions-content li {
    font-size: 14px;
    line-height: 1.7;
    color: rgba(250, 247, 240, 0.75);
    padding: 4px 0 4px 20px;
    position: relative;
}

.chp-selection-inclusions-content li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 11px;
    width: 6px;
    height: 6px;
    background: #C9A96E;
    border-radius: 50%;
}

.chp-selection-inclusions-content li:empty {
    padding: 8px 0;
}

.chp-selection-inclusions-content li:empty::before {
    display: none;
}

.chp-enquiry-error {
    background: rgba(255, 59, 48, 0.08);
    border: 1px solid rgba(255, 59, 48, 0.25);
    border-radius: 12px;
    padding: 16px 24px;
    margin-top: 20px;
    text-align: center;
    color: #FF6B6B;
    font-size: 14px;
}

/* ─── Party Size Control ───────────────────── */

.chp-qty-control--party {
    display: inline-flex;
    border: 1px solid rgba(201, 169, 110, 0.3);
    border-radius: 10px;
    overflow: hidden;
}

.chp-qty-control--party input[type="number"] {
    width: 56px;
    height: 44px;
    text-align: center;
    background: rgba(201, 169, 110, 0.06);
    color: #C9A96E;
    border: none;
    border-left: 1px solid rgba(201, 169, 110, 0.2);
    border-right: 1px solid rgba(201, 169, 110, 0.2);
    font-size: 18px;
    font-weight: 700;
    -moz-appearance: textfield;
    padding: 0;
}

.chp-qty-control--party input[type="number"]::-webkit-outer-spin-button,
.chp-qty-control--party input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.chp-qty-control--party .chp-qty-btn {
    width: 44px;
    height: 44px;
    font-size: 20px;
}

/* ─── Upgrades Section ─────────────────────── */

.chp-upgrade-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: rgba(250, 247, 240, 0.03);
    border: 1px solid rgba(250, 247, 240, 0.08);
    border-radius: 12px;
    margin-bottom: 10px;
}

.chp-upgrade-info strong {
    display: block;
    font-size: 15px;
    color: #FAF7F0;
    margin-bottom: 2px;
}

.chp-upgrade-price {
    font-size: 13px;
    color: #C9A96E;
    opacity: 0.85;
}

.chp-upgrade-control label {
    font-size: 13px;
    color: rgba(250, 247, 240, 0.6);
    margin-bottom: 4px;
    display: block;
}

.chp-qty-control {
    display: flex;
    align-items: center;
    gap: 0;
    border: 1px solid rgba(250, 247, 240, 0.15);
    border-radius: 8px;
    overflow: hidden;
}

.chp-qty-btn {
    width: 36px;
    height: 36px;
    background: rgba(250, 247, 240, 0.06);
    color: #C9A96E;
    border: none;
    font-size: 18px;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}

.chp-qty-btn:hover {
    background: rgba(201, 169, 110, 0.15);
}

.chp-qty-control input[type="number"] {
    width: 44px;
    height: 36px;
    text-align: center;
    background: transparent;
    color: #FAF7F0;
    border: none;
    border-left: 1px solid rgba(250, 247, 240, 0.1);
    border-right: 1px solid rgba(250, 247, 240, 0.1);
    font-size: 15px;
    font-weight: 600;
    -moz-appearance: textfield;
    padding: 0;
}

.chp-qty-control input[type="number"]::-webkit-outer-spin-button,
.chp-qty-control input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.chp-toggle-label {
    display: flex !important;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    font-size: 14px;
}

.chp-toggle-label input[type="checkbox"] {
    width: 20px;
    height: 20px;
    accent-color: #C9A96E;
    cursor: pointer;
}

.chp-toggle-text {
    color: #FAF7F0;
    font-weight: 500;
}

/* ─── Price Breakdown ──────────────────────── */

.chp-price-breakdown {
    background: rgba(201, 169, 110, 0.06);
    border: 1px solid rgba(201, 169, 110, 0.18);
    border-radius: 16px;
    padding: 24px 28px;
    margin: 24px 0;
}

.chp-price-breakdown h3 {
    color: #C9A96E;
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 16px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.chp-price-line {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0;
    font-size: 14px;
    color: rgba(250, 247, 240, 0.75);
    border-bottom: 1px solid rgba(250, 247, 240, 0.05);
}

.chp-price-line:last-child {
    border-bottom: none;
}

.chp-price-line strong {
    color: #FAF7F0;
}

.chp-price-line--upgrade {
    font-size: 13px;
    color: rgba(250, 247, 240, 0.6);
}

.chp-price-line--total {
    border-top: 2px solid rgba(201, 169, 110, 0.3);
    border-bottom: 2px solid rgba(201, 169, 110, 0.3);
    margin-top: 4px;
    padding: 12px 0;
    font-size: 16px;
    color: #FAF7F0;
}

.chp-price-line--deposit {
    font-size: 13px;
}

.chp-price-line--remaining {
    font-size: 15px;
    color: #C9A96E;
}

.chp-price-line--remaining strong {
    color: #C9A96E;
    font-size: 18px;
}

.chp-price-line--note {
    border-bottom: none;
    padding-bottom: 0;
}

@media (max-width: 768px) {
    .chp-upgrade-row {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 14px 16px;
        border-radius: 10px;
    }

    .chp-upgrade-info strong {
        font-size: 14px;
    }

    .chp-upgrade-price {
        font-size: 12px;
    }

    .chp-price-breakdown {
        padding: 20px 16px;
        border-radius: 12px;
        margin: 20px 0;
    }

    .chp-price-breakdown h3 {
        font-size: 14px;
        margin-bottom: 12px;
    }

    .chp-price-line {
        font-size: 13px;
        padding: 7px 0;
    }

    .chp-price-line--total {
        font-size: 15px;
        padding: 10px 0;
    }

    .chp-price-line--remaining strong {
        font-size: 16px;
    }

    .chp-qty-control--party {
        border-radius: 8px;
    }

    .chp-qty-control--party input[type="number"] {
        width: 50px;
        height: 40px;
        font-size: 16px;
    }

    .chp-qty-control--party .chp-qty-btn {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }
}

@media (max-width: 480px) {
    .chp-upgrade-row {
        padding: 12px 14px;
    }

    .chp-price-breakdown {
        padding: 16px 14px;
    }

    .chp-price-line--total {
        font-size: 14px;
    }

    .chp-price-line--remaining strong {
        font-size: 15px;
    }
}

/* ── Groups & Large Party Banner (Reserve Page) ── */

/* Special Events Banner */
.chp-special-events-banner {
    max-width: 860px;
    margin: 0 auto 36px;
    padding: 0 24px;
}
.chp-special-events-banner__inner {
    background: linear-gradient(135deg, rgba(201,162,39,0.08) 0%, rgba(13,13,13,0.95) 60%);
    border: 1px solid rgba(201,162,39,0.35);
    border-radius: 16px;
    padding: 28px 32px;
    position: relative;
    overflow: hidden;
}
.chp-special-events-banner__inner::before {
    content: '';
    position: absolute;
    top: -40%;
    right: -10%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(201,162,39,0.08) 0%, transparent 70%);
    pointer-events: none;
}
.chp-special-events-banner__tag {
    display: inline-block;
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #C9A227;
    background: rgba(201,162,39,0.12);
    border: 1px solid rgba(201,162,39,0.3);
    border-radius: 4px;
    padding: 4px 10px;
    margin-bottom: 14px;
    font-weight: 600;
}
.chp-special-events-banner__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.chp-special-events-banner__text h3 {
    font-family: var(--haus-font-display);
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: #fff;
    margin: 0 0 8px;
}
.chp-special-events-banner__text p {
    font-size: 14px;
    line-height: 1.6;
    color: rgba(255,255,255,0.6);
    margin: 0;
}
.chp-special-events-banner__cta {
    flex-shrink: 0;
    display: inline-block;
    padding: 12px 24px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #0D0D0D !important;
    background: #C9A227;
    border-radius: 8px;
    text-decoration: none !important;
    transition: background 0.2s ease, transform 0.15s ease;
    white-space: nowrap;
}
.chp-special-events-banner__cta:hover {
    background: #d4ad2e;
    transform: translateY(-1px);
}
@media (max-width: 639px) {
    .chp-special-events-banner__content {
        flex-direction: column;
        align-items: flex-start;
    }
    .chp-special-events-banner__cta {
        width: 100%;
        text-align: center;
    }
}

.chp-groups-banner {
    max-width: 860px;
    margin: 0 auto 40px;
    padding: 0 24px;
    transition: opacity 0.3s ease;
}

.chp-groups-banner__inner {
    display: flex;
    gap: 24px;
    align-items: flex-start;
    background: var(--haus-bg2);
    border: 1px solid var(--haus-gold-dim);
    border-radius: 16px;
    padding: 32px 36px;
    transition: border-color 0.35s ease, box-shadow 0.35s ease;
}

.chp-groups-banner.is-highlighted .chp-groups-banner__inner {
    border-color: var(--haus-gold);
    box-shadow: 0 0 24px var(--haus-gold-glow), inset 0 0 12px var(--haus-gold-glow);
}

.chp-groups-banner__icon {
    font-size: 36px;
    line-height: 1;
    flex-shrink: 0;
    margin-top: 2px;
}

.chp-groups-banner__content h3 {
    font-family: var(--haus-font-display);
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0.06em;
    color: var(--haus-gold);
    margin: 0 0 10px;
}

.chp-groups-banner__content p {
    font-size: 15px;
    line-height: 1.7;
    color: var(--haus-text-dim);
    margin: 0 0 20px;
}

.chp-groups-banner__content p strong {
    color: var(--haus-text);
}

.chp-groups-banner__ctas {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.chp-groups-banner__ctas .coco-venue-btn-primary,
.chp-groups-banner__ctas .coco-venue-btn-outline {
    font-size: 12px;
    padding: 10px 20px;
}

/* Inline party-size notice inside booking form */

.coco-pb-group-notice {
    background: rgba(201, 162, 39, 0.12);
    border: 1px solid var(--haus-gold);
    border-radius: 10px;
    padding: 14px 18px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--haus-text);
    margin-bottom: 20px;
}

.coco-pb-group-notice--soft {
    border-color: var(--haus-gold-dim);
    background: rgba(201, 162, 39, 0.06);
}

.coco-pb-group-notice a {
    color: var(--haus-gold);
    text-decoration: underline;
}

.coco-pb-group-notice a:hover {
    opacity: 0.8;
}

/* ── Set Menu Preview Overlay ── */

.chp-setmenu-overlay {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.chp-setmenu-overlay__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.75);
    backdrop-filter: blur(4px);
}

.chp-setmenu-overlay__panel {
    position: relative;
    background: var(--haus-bg2);
    border: 1px solid var(--haus-gold-dim);
    border-radius: 20px;
    max-width: 920px;
    width: 92%;
    max-height: 88vh;
    overflow-y: auto;
    padding: 40px 36px 32px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}

.chp-setmenu-overlay__close {
    position: absolute;
    top: 16px;
    right: 20px;
    background: none;
    border: none;
    color: var(--haus-text-dim);
    font-size: 28px;
    cursor: pointer;
    line-height: 1;
    padding: 4px 8px;
    transition: color 0.2s;
}

.chp-setmenu-overlay__close:hover {
    color: var(--haus-gold);
}

.chp-setmenu-overlay__header {
    text-align: center;
    margin-bottom: 32px;
}

.chp-setmenu-overlay__header h2 {
    font-family: var(--haus-font-display);
    font-size: clamp(22px, 3.5vw, 32px);
    font-weight: 500;
    letter-spacing: 0.1em;
    margin: 12px 0 10px;
}

.chp-setmenu-overlay__header p {
    font-size: 15px;
    color: var(--haus-text-dim);
    line-height: 1.6;
}

.chp-setmenu-overlay__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-bottom: 28px;
}

/* Set Menu Card */

.chp-setmenu-card {
    background: var(--haus-bg3);
    border: 1px solid rgba(255,255,255,0.06);
    border-radius: 14px;
    padding: 28px 22px;
    position: relative;
    transition: border-color 0.2s;
}

.chp-setmenu-card--featured {
    border-color: var(--haus-gold-dim);
    box-shadow: 0 0 20px var(--haus-gold-glow);
}

.chp-setmenu-card__badge {
    position: absolute;
    top: -10px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--haus-gold);
    color: #000;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    padding: 4px 14px;
    border-radius: 999px;
    white-space: nowrap;
}

.chp-setmenu-card h3 {
    font-family: var(--haus-font-display);
    font-size: 20px;
    font-weight: 500;
    letter-spacing: 0.06em;
    margin: 0 0 6px;
    color: var(--haus-text);
}

.chp-setmenu-card__price {
    font-size: 18px;
    font-weight: 600;
    color: var(--haus-gold);
    margin-bottom: 10px;
}

.chp-setmenu-card__desc {
    font-size: 13px;
    line-height: 1.6;
    color: var(--haus-text-dim);
    margin-bottom: 16px;
}

.chp-setmenu-card__list {
    list-style: none;
    padding: 0;
    margin: 0 0 16px;
}

.chp-setmenu-card__list li {
    font-size: 13px;
    line-height: 1.7;
    color: var(--haus-text-dim);
    padding: 4px 0 4px 18px;
    position: relative;
}

.chp-setmenu-card__list li::before {
    content: '✦';
    position: absolute;
    left: 0;
    color: var(--haus-gold);
    font-size: 9px;
    top: 7px;
}

.chp-setmenu-card__note {
    font-size: 11px;
    color: var(--haus-gold-muted);
    border-top: 1px solid rgba(255,255,255,0.06);
    padding-top: 12px;
    line-height: 1.5;
}

.chp-setmenu-overlay__footer {
    text-align: center;
    padding-top: 8px;
}

.chp-setmenu-overlay__close-btn {
    font-size: 13px;
    padding: 12px 36px;
}

@media (max-width: 768px) {
    .chp-groups-banner__inner {
        flex-direction: column;
        padding: 24px 20px;
        gap: 12px;
    }

    .chp-groups-banner__icon {
        font-size: 28px;
    }

    .chp-groups-banner__content h3 {
        font-size: 18px;
    }

    .chp-groups-banner__content p {
        font-size: 14px;
    }

    .chp-groups-banner__ctas {
        flex-direction: column;
    }

    .chp-groups-banner__ctas .coco-venue-btn-primary,
    .chp-groups-banner__ctas .coco-venue-btn-outline {
        text-align: center;
        width: 100%;
    }

    .chp-setmenu-overlay__panel {
        width: 96%;
        padding: 28px 18px 24px;
        max-height: 92vh;
        border-radius: 14px;
    }

    .chp-setmenu-overlay__grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .chp-setmenu-card {
        padding: 22px 18px;
    }

    .chp-setmenu-overlay__header h2 {
        font-size: 22px;
    }
}

/* ── Mother's Day Takeover Banner (Reserve Page) ─────────── */

.mt-mothersday-banner {
    background: linear-gradient(135deg, #2D0A1F 0%, #1A0A14 50%, #0D0D0D 100%);
    border: 1px solid rgba(201, 162, 39, 0.3);
    border-radius: 16px;
    padding: 40px 32px;
    margin: 0 auto 32px;
    max-width: 720px;
    text-align: center;
}

.mt-mothersday-banner-inner .mt-section-label {
    font-family: 'Outfit', sans-serif;
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #C9A227;
    margin-bottom: 12px;
}

.mt-mothersday-banner-inner h2 {
    font-family: 'Playfair Display', serif;
    font-size: 32px;
    font-weight: 700;
    color: #FAF7F0;
    margin: 0 0 12px;
}

.mt-mothersday-banner-inner p {
    font-family: 'Outfit', sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: #F5F0E1;
    margin: 0 0 20px;
    opacity: 0.9;
}

.mt-dismiss-section {
    text-align: center;
    padding: 32px 16px 40px;
    border-top: 1px solid rgba(201, 162, 39, 0.15);
    margin-top: 32px;
}

.mt-dismiss-text {
    font-family: 'Outfit', sans-serif;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5);
    margin: 0 0 12px;
}

.mt-dismiss-banner {
    background: rgba(201, 162, 39, 0.1);
    border: 1px solid rgba(201, 162, 39, 0.3);
    border-radius: 8px;
    color: #C9A227;
    font-family: 'Outfit', sans-serif;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    padding: 12px 28px;
    transition: all 0.25s;
}

.mt-dismiss-banner:hover {
    background: rgba(201, 162, 39, 0.18);
    border-color: #C9A227;
    color: #E8D5A0;
}

/* When the takeover is active on the reserve page, scope MT styles */

/* Disable the full-width breakout — reserve page is already full-width */
#mt-mothers-day-takeover.mt-page {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#mt-mothers-day-takeover #mt-booking {
    max-width: 720px;
    margin: 0 auto;
}

/* Center step content within the reserve page booking widget */
#mt-mothers-day-takeover .mt-step {
    text-align: center;
}

#mt-mothers-day-takeover .mt-guest-config {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
}

#mt-mothers-day-takeover .mt-booking-packages {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

#mt-mothers-day-takeover .mt-contact-form {
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

#mt-mothers-day-takeover .mt-guests-container {
    max-width: 520px;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
}

#mt-mothers-day-takeover .mt-summary {
    text-align: left;
}

/* Dismiss section at bottom of takeover */
#mt-mothers-day-takeover > .mt-dismiss-section {
    max-width: 720px;
    margin: 0 auto;
}

/* ── Mother's Day Landing Hero (ad deep-link) ─────────────── */

.mt-landing-hero {
    background: linear-gradient(160deg, #2D0A1F 0%, #1A0A14 40%, #0D0D0D 100%);
    border-radius: 20px;
    padding: 56px 32px 48px;
    margin: 0 auto 40px;
    max-width: 720px;
    text-align: center;
    border: 1px solid rgba(201, 162, 39, 0.2);
    position: relative;
    overflow: hidden;
}

.mt-landing-hero::before {
    content: '';
    position: absolute;
    top: -60%;
    left: -30%;
    width: 160%;
    height: 160%;
    background: radial-gradient(ellipse at 30% 20%, rgba(201, 162, 39, 0.06) 0%, transparent 60%);
    pointer-events: none;
}

.mt-landing-hero-inner {
    position: relative;
    z-index: 1;
}

.mt-landing-eyebrow {
    font-family: 'Outfit', sans-serif;
    font-size: 11px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #C9A227;
    display: block;
    margin-bottom: 16px;
}

.mt-landing-title {
    font-family: 'Playfair Display', serif;
    font-size: 42px;
    font-weight: 900;
    color: #FAF7F0;
    margin: 0 0 8px;
    line-height: 1.1;
}

.mt-landing-subtitle {
    font-family: 'Playfair Display', serif;
    font-size: 18px;
    font-style: italic;
    color: rgba(245, 240, 225, 0.8);
    margin: 0 0 28px;
}

.mt-landing-details {
    display: flex;
    justify-content: center;
    gap: 32px;
    flex-wrap: wrap;
    margin-bottom: 28px;
}

.mt-landing-detail {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mt-landing-detail strong {
    font-family: 'Outfit', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #FAF7F0;
}

.mt-landing-detail span {
    font-family: 'Outfit', sans-serif;
    font-size: 12px;
    color: rgba(245, 240, 225, 0.6);
}

.mt-landing-highlights {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.mt-landing-highlight {
    font-family: 'Outfit', sans-serif;
    font-size: 12px;
    font-weight: 500;
    color: #C9A227;
    background: rgba(201, 162, 39, 0.1);
    border: 1px solid rgba(201, 162, 39, 0.25);
    border-radius: 20px;
    padding: 6px 14px;
    white-space: nowrap;
}

@media (max-width: 600px) {
    .mt-landing-hero {
        padding: 40px 20px 36px;
        margin-bottom: 28px;
    }

    .mt-landing-title {
        font-size: 32px;
    }

    .mt-landing-details {
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }

    .mt-landing-highlights {
        gap: 8px;
    }

    .mt-landing-highlight {
        font-size: 11px;
        padding: 5px 12px;
    }
}

/* =====================================================================
   COCOCURE EDITORIAL DESIGN SYSTEM  (.coco-ed scope)
   Shared across private-hire, birthdays, catering, dinner/drinks/bottle
   menus, dine, groups. Matches /brunch/ landing page.
   ===================================================================== */
.coco-ed{
  --bg: #0a0a0a;
  --gold: #c9a96e;
  --gold-dim: rgba(201,169,110,0.15);
  --cream: #FAF7F0;
  --muted: #888;
  --surface: #141414;
  --surface-2: #1a1a1a;
  --border: #1f1f1f;
  --wine: #7A2E2E;
  --ed-serif: "Fraunces", "Playfair Display", Georgia, serif;
  --ed-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ed-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --ed-radius: 12px;
  --ed-max: 1200px;

  background: var(--bg);
  color: var(--cream);
  font-family: var(--ed-sans);
  font-size: 15px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100vw;
  position: relative;
  overflow-x: hidden;
}
.coco-ed *, .coco-ed *::before, .coco-ed *::after{ box-sizing: border-box; }
.coco-ed a{ color: inherit; text-decoration: none; }
/* Avada and some page builders set `a:hover{color:red}` globally.
   Our brand hover is gold — lock it in at the menu-page wrapper so
   every link inside a Cococure editorial page (nav, tiles, CTAs,
   inline prose) picks up gold on hover, not the theme default.     */
.coco-ed a:hover,
.coco-ed a:focus{ color: var(--haus-gold, var(--gold, #C9A227)); }
.coco-ed img{ max-width: 100%; display: block; }
.coco-ed em{ font-family: var(--ed-serif); font-style: italic; }

.coco-ed .coco-container{ max-width: var(--ed-max); margin: 0 auto; padding: 0 32px; }

.coco-ed .coco-kicker{
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  opacity: 0.6;
  margin-bottom: 16px;
  display: inline-block;
}
.coco-ed .coco-kicker--gold{ color: var(--gold); opacity: 1; }

.coco-ed .coco-h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(36px, 5vw, 64px);
  line-height: 1.02;
  letter-spacing: -0.02em;
  color: var(--cream);
  text-wrap: balance;
  margin: 0 0 24px;
}
.coco-ed .coco-h2 em{ font-style: italic; color: var(--gold); }

.coco-ed .coco-h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 28px;
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--cream);
  margin: 0;
}

.coco-ed .coco-section-head{
  text-align: center;
  max-width: 740px;
  margin: 0 auto 56px;
}
.coco-ed .coco-section-head .coco-kicker{ margin-bottom: 20px; }
.coco-ed .coco-lede{
  font-size: 17px;
  color: rgba(250,247,240,0.72);
  max-width: 620px;
  margin: 8px auto 0;
  line-height: 1.55;
}

/* ── Buttons ─────────────────────────────────────────────────── */
.coco-ed .coco-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 30px;
  font-family: var(--ed-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
  -webkit-appearance: none;
  appearance: none;
  text-decoration: none;
}
.coco-ed .coco-btn:hover{ transform: translateY(-1px); }
.coco-ed .coco-btn--gold{ background: var(--gold); color: var(--bg); border-color: var(--gold); }
.coco-ed .coco-btn--gold:hover{ background: #d9bb80; border-color: #d9bb80; box-shadow: 0 10px 26px rgba(201,169,110,0.22); }
.coco-ed .coco-btn--outline{ background: transparent; color: var(--cream); border-color: rgba(250,247,240,0.35); }
.coco-ed .coco-btn--outline:hover{ border-color: var(--gold); color: var(--gold); }
.coco-ed .coco-btn--cream{ background: var(--cream); color: var(--bg); border-color: var(--cream); }
.coco-ed .coco-btn--cream:hover{ background: #fff; border-color: #fff; }

.coco-ed .coco-cta-row{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 28px;
}

/* ── Facts list ─────────────────────────────────────────────── */
.coco-ed .coco-facts{
  display: flex;
  flex-direction: column;
  gap: 12px;
  border-top: 1px solid var(--border);
  padding-top: 18px;
  margin: 20px 0;
}
.coco-ed .coco-fact{
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 16px;
  align-items: baseline;
}
.coco-ed .coco-fact dt{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}
.coco-ed .coco-fact dd{
  font-size: 14.5px;
  color: rgba(250,247,240,0.85);
  margin: 0;
}

/* ── Hero ───────────────────────────────────────────────────── */
.coco-ed-hero{
  position: relative;
  min-height: 38vh;
  background: #000;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  padding: 100px 0 40px;
}
/* Booking-flow hero is intentionally shorter than the marketing hero —
   the form should be visible without scrolling. The image still anchors
   the page and identifies the brand, just at a smaller footprint. */
.coco-haus-page--reserve .coco-ed-hero{
  min-height: 32vh;
  padding: 90px 0 28px;
}
.coco-haus-page--reserve .coco-ed-hero-title{
  font-size: clamp(40px, 6vw, 80px);
}
.coco-ed-hero-img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
}
.coco-ed-hero-scrim{
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 50% 15%, rgba(0,0,0,0.35), rgba(0,0,0,0.6) 50%, #000 100%),
    linear-gradient(to bottom, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.25) 35%, rgba(0,0,0,0.55) 80%, var(--bg) 100%);
  z-index: 1;
}
.coco-ed-hero-inner{
  position: relative;
  z-index: 2;
  max-width: var(--ed-max);
  margin: 0 auto;
  padding: 0 40px;
  width: 100%;
}
.coco-ed-hero-title{
  font-family: var(--ed-serif);
  font-weight: 300;
  font-size: clamp(56px, 9vw, 128px);
  line-height: 0.92;
  letter-spacing: -0.03em;
  color: var(--cream);
  margin: 8px 0 0;
}
.coco-ed-hero-title em{ font-style: italic; color: var(--gold); font-weight: 300; }
.coco-ed-hero-sub{
  font-size: clamp(16px, 1.4vw, 20px);
  color: rgba(250,247,240,0.82);
  margin: 20px 0 0;
  max-width: 620px;
  line-height: 1.55;
}
.coco-ed-hero-sub em{ color: var(--gold); }

/* ── Generic section ────────────────────────────────────────── */
.coco-ed-section{ padding: 100px 0; }
.coco-ed-section--alt{
  background: #0c0c0c;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

/* ── Intro paragraph ────────────────────────────────────────── */
.coco-ed-intro{
  max-width: 780px;
  margin: 0 auto;
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 300;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.4;
  color: rgba(250,247,240,0.88);
  text-align: center;
  text-wrap: balance;
}

/* ── Ticker ─────────────────────────────────────────────────── */
.coco-ed-ticker{
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  overflow: hidden;
  padding: 18px 0;
}
.coco-ed-ticker-inner{
  display: flex;
  width: max-content;
  animation: coco-ed-marquee 55s linear infinite;
  font-family: var(--ed-mono);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  white-space: nowrap;
}
.coco-ed-ticker-inner span{ padding-right: 4px; }
@keyframes coco-ed-marquee{ from{ transform: translateX(0); } to{ transform: translateX(-33.3333%); } }

/* ── Tier / Package cards ───────────────────────────────────── */
.coco-ed-tiers{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.coco-ed-tier{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 32px 28px 36px;
  display: flex;
  flex-direction: column;
  position: relative;
  transition: border-color .3s ease, transform .3s ease;
}
.coco-ed-tier:hover{ border-color: rgba(201,169,110,0.45); transform: translateY(-3px); }
.coco-ed-tier--feat{ border-color: rgba(201,169,110,0.5); background: linear-gradient(180deg, var(--surface) 0%, rgba(201,169,110,0.04) 100%); }
.coco-ed-tier-badge{
  position: absolute; top: -12px; left: 24px;
  background: var(--gold);
  color: var(--bg);
  font-family: var(--ed-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 4px;
}
.coco-ed-tier-name{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 32px;
  line-height: 1;
  color: var(--cream);
  margin: 0 0 8px;
}
.coco-ed-tier-for{
  font-size: 14px;
  color: rgba(250,247,240,0.65);
  font-style: italic;
  margin: 0 0 20px;
}
.coco-ed-tier-list{
  list-style: none;
  padding: 0;
  margin: 0 0 24px;
  flex: 1;
  border-top: 1px solid var(--border);
  padding-top: 18px;
}
.coco-ed-tier-list li{
  font-size: 14.5px;
  color: rgba(250,247,240,0.82);
  padding: 8px 0;
  line-height: 1.45;
  border-bottom: 1px solid var(--border);
}
.coco-ed-tier-list li:last-child{ border-bottom: none; }
.coco-ed-tier-cta{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 13px 24px;
  background: transparent;
  color: var(--gold);
  border: 1px solid rgba(201,169,110,0.5);
  border-radius: 999px;
  font-family: var(--ed-mono);
  font-size: 11.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: background .25s ease, color .25s ease;
}
.coco-ed-tier-cta:hover{ background: var(--gold); color: var(--bg); }

/* ── Menu lists (dinner / drinks / bottle) ──────────────────── */
.coco-ed-menu-group{
  margin-bottom: 56px;
}
.coco-ed-menu-group-title{
  font-family: var(--ed-mono);
  font-size: 11.5px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 20px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}
.coco-ed-menu-list{
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 40px;
}
.coco-ed-menu-item{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px dotted rgba(250,247,240,0.14);
  align-items: baseline;
}
.coco-ed-menu-item-body strong{
  display: block;
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  color: var(--cream);
  margin-bottom: 4px;
}
.coco-ed-menu-item-body span{
  display: block;
  font-size: 13.5px;
  color: rgba(250,247,240,0.6);
  line-height: 1.45;
}
.coco-ed-menu-price{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  color: var(--gold);
  white-space: nowrap;
}

/* ── Offerings grid (text chips) ────────────────────────────── */
.coco-ed-offerings{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0;
  border-top: 1px solid var(--border);
}
.coco-ed-offering{
  padding: 20px 24px;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  font-family: var(--ed-mono);
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.82);
}
.coco-ed-offering:nth-child(odd){ border-right: 1px solid var(--border); }

/* ── Ideal-for grid ─────────────────────────────────────────── */
.coco-ed-ideal{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}
.coco-ed-ideal-item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 18px 22px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  font-size: 14.5px;
  color: rgba(250,247,240,0.85);
}
.coco-ed-ideal-item .ico{
  font-size: 22px;
  line-height: 1;
}

/* ── Spaces cards (private hire) ────────────────────────────── */
.coco-ed-spaces{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}
.coco-ed-space{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 28px;
}
.coco-ed-space-icon{
  font-size: 28px;
  margin-bottom: 10px;
}
.coco-ed-space-name{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 24px;
  margin: 0 0 6px;
  color: var(--cream);
}
.coco-ed-space-cap{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 14px;
}
.coco-ed-space-desc{
  font-size: 14px;
  color: rgba(250,247,240,0.72);
  margin: 0;
  line-height: 1.55;
}

/* ── Info / notice box ──────────────────────────────────────── */
.coco-ed-notice{
  max-width: 760px;
  margin: 0 auto;
  padding: 28px 32px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
}
.coco-ed-notice h3{
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 12px;
}
.coco-ed-notice p{
  font-size: 15px;
  color: rgba(250,247,240,0.82);
  margin: 0;
  line-height: 1.55;
}

/* ── Enquiry form ───────────────────────────────────────────── */
.coco-ed-form{
  max-width: 720px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.coco-ed-form-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.coco-ed-field{ display: flex; flex-direction: column; gap: 6px; }
.coco-ed-field label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}
.coco-ed-field input,
.coco-ed-field select,
.coco-ed-field textarea{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 13px 14px;
  font-family: var(--ed-sans);
  font-size: 15px;
  color: var(--cream);
  transition: border-color .2s ease;
}
.coco-ed-field input:focus,
.coco-ed-field select:focus,
.coco-ed-field textarea:focus{
  outline: none;
  border-color: var(--gold);
}
.coco-ed-field--full{ grid-column: 1 / -1; }
.coco-ed-form button[type="submit"]{ align-self: center; margin-top: 8px; }
.coco-ed-form-alt{
  text-align: center;
  margin-top: 28px;
  color: rgba(250,247,240,0.7);
  font-size: 14px;
}
.coco-ed-form-alt a{ color: var(--gold); }
.coco-ed-form-alt a:hover{ color: #d9bb80; }

/* ── Gallery ────────────────────────────────────────────────── */
.coco-ed-gallery{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.coco-ed-gallery-item{
  aspect-ratio: 4 / 5;
  background-size: cover;
  background-position: center;
  border-radius: var(--ed-radius);
  overflow: hidden;
}
.coco-ed-gallery-caption{
  text-align: center;
  margin-top: 24px;
  font-size: 13px;
  color: rgba(250,247,240,0.55);
}

/* ── Closing CTA ────────────────────────────────────────────── */
.coco-ed-close{
  padding: 120px 0 100px;
  text-align: center;
  background:
    radial-gradient(ellipse at top, rgba(201,169,110,0.08), transparent 60%),
    var(--bg);
  border-top: 1px solid var(--border);
}
.coco-ed-close-h{
  font-family: var(--ed-serif);
  font-weight: 300;
  font-size: clamp(44px, 6vw, 80px);
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--cream);
  margin: 0 0 24px;
}
.coco-ed-close-h em{ font-style: italic; color: var(--gold); font-weight: 300; }
.coco-ed-close-sub{
  font-size: 17px;
  color: rgba(250,247,240,0.68);
  max-width: 520px;
  margin: 0 auto 36px;
}

/* ── Tabs (reuses existing .chp-tab JS) ─────────────────────── */
.coco-ed .chp-tabs{
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  justify-content: center;
  border-bottom: 1px solid var(--border);
  padding-bottom: 0;
  margin: 0 auto 48px;
  max-width: var(--ed-max);
}
.coco-ed .chp-tab{
  background: transparent;
  color: rgba(250,247,240,0.55);
  border: none;
  border-bottom: 2px solid transparent;
  font-family: var(--ed-mono);
  font-size: 11.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 16px 22px;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease;
  margin-bottom: -1px;
}
.coco-ed .chp-tab:hover{ color: var(--cream); }
.coco-ed .chp-tab.active{
  color: var(--gold);
  border-bottom-color: var(--gold);
}
.coco-ed .chp-tab-panel{ display: none; }
.coco-ed .chp-tab-panel.active{ display: block; }

/* Menu items within tab panels — repurpose existing markup */
.coco-ed .chp-menu-grid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 40px;
  max-width: var(--ed-max);
  margin: 0 auto;
  padding: 0 32px;
}
.coco-ed .chp-menu-item{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  padding: 18px 0;
  border-bottom: 1px dotted rgba(250,247,240,0.14);
  align-items: baseline;
  background: none;
  border-radius: 0;
}
.coco-ed .chp-menu-item-img{
  display: none; /* tighter editorial list — no thumbnails */
}
.coco-ed .chp-menu-item-body{ min-width: 0; }
.coco-ed .chp-menu-item-header{
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: baseline;
  margin-bottom: 4px;
}
.coco-ed .chp-menu-item-header h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  line-height: 1.2;
  color: var(--cream);
  margin: 0;
  letter-spacing: -0.005em;
}
.coco-ed .chp-badge{
  display: inline-block;
  margin-left: 8px;
  font-family: var(--ed-mono);
  font-style: normal;
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  background: rgba(201,169,110,0.12);
  padding: 2px 8px;
  border-radius: 3px;
  vertical-align: middle;
}
.coco-ed .chp-menu-item-desc{
  font-size: 13.5px;
  color: rgba(250,247,240,0.6);
  line-height: 1.45;
  margin: 0;
}
.coco-ed .chp-price-group{
  display: flex;
  gap: 10px;
  align-items: baseline;
  white-space: nowrap;
}
.coco-ed .chp-price{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  color: var(--gold);
}
.coco-ed .chp-price--sm,
.coco-ed .chp-price--lg,
.coco-ed .chp-price--offpeak{
  font-size: 15px;
  color: rgba(250,247,240,0.75);
}
.coco-ed .chp-price small{
  font-family: var(--ed-mono);
  font-style: normal;
  font-size: 9.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.55);
}
.coco-ed .chp-bottle-size{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  font-style: normal;
  letter-spacing: 0.14em;
  color: rgba(250,247,240,0.55);
  margin-left: 6px;
}
.coco-ed .chp-bottle-header-row{
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 18px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
  margin-bottom: 6px;
}
.coco-ed .chp-bottle-col-label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}
.coco-ed .chp-bottle-grid{ grid-template-columns: 1fr; gap: 0 40px; }

/* Banners (happy hour, peak / off-peak notes) */
.coco-ed-banners{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  max-width: 780px;
  margin: 0 auto 56px;
}
.coco-ed-banner{
  padding: 16px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
  display: flex;
  gap: 14px;
  align-items: baseline;
}
.coco-ed-banner-label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  flex-shrink: 0;
}
.coco-ed-banner p{
  margin: 0;
  font-size: 13.5px;
  color: rgba(250,247,240,0.82);
  line-height: 1.4;
}
.coco-ed-banner--single{ grid-column: 1 / -1; max-width: 520px; margin: 0 auto 56px; }

/* Feature block (Dine & Stay) */
.coco-ed-feature{
  max-width: 820px;
  margin: 0 auto;
  padding: 48px 40px;
  background: linear-gradient(135deg, rgba(201,169,110,0.08), rgba(201,169,110,0.02));
  border: 1px solid rgba(201,169,110,0.28);
  border-radius: var(--ed-radius);
  text-align: center;
}
.coco-ed-feature .coco-h3{ margin-bottom: 16px; font-size: 36px; }
.coco-ed-feature p{
  font-size: 15.5px;
  color: rgba(250,247,240,0.8);
  line-height: 1.6;
  margin: 0 auto;
  max-width: 640px;
}

/* Two-col cards (catering) */
.coco-ed-twocol{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.coco-ed-twocol-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 36px 32px;
  display: flex;
  flex-direction: column;
}
.coco-ed-twocol-icon{
  font-size: 32px;
  margin-bottom: 16px;
}
.coco-ed-twocol-card p{
  font-size: 14.5px;
  color: rgba(250,247,240,0.75);
  line-height: 1.6;
  margin: 12px 0 20px;
}
.coco-ed-twocol-card .coco-cta-row{ margin-top: auto; }
.coco-ed-smallnote{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.5);
  margin-top: 14px;
}

/* Booking options (bottle service) */
.coco-ed-book{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  max-width: 720px;
  margin: 0 auto 24px;
}
.coco-ed-book-opt{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 32px;
  text-align: center;
}
.coco-ed-book-icon{
  font-size: 32px;
  display: block;
  margin-bottom: 12px;
}
.coco-ed-book-opt h4{
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 10px;
}
.coco-ed-book-opt a{
  font-family: var(--ed-serif);
  font-style: italic;
  font-size: 22px;
  color: var(--cream);
}
.coco-ed-book-opt a:hover{ color: var(--gold); }
.coco-ed-book-meta{
  text-align: center;
  max-width: 600px;
  margin: 0 auto;
  font-size: 14px;
  color: rgba(250,247,240,0.72);
}
.coco-ed-book-meta strong{ color: var(--cream); }
.coco-ed-book-meta p{ margin: 6px 0; }
.coco-ed-book-meta p:last-child{
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.5);
}

/* ── Location toggle + quick pills (Dine page) ──────────────── */
.coco-ed .chp-loc-toggle{
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 999px;
  margin: 0 auto 40px;
}
.coco-ed section + .chp-loc-toggle{ margin-top: -40px; }
.coco-ed .chp-loc-toggle{ display: flex; justify-content: center; }
.coco-ed .chp-loc-toggle-btn{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 12px 26px;
  background: transparent;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  color: rgba(250,247,240,0.6);
  transition: background .2s ease, color .2s ease;
}
.coco-ed .chp-loc-toggle-btn strong{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 18px;
  line-height: 1;
}
.coco-ed .chp-loc-toggle-btn small{
  font-family: var(--ed-mono);
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  opacity: 0.8;
}
.coco-ed .chp-loc-toggle-btn:hover{ color: var(--cream); }
.coco-ed .chp-loc-toggle-btn.active{
  background: var(--gold);
  color: var(--bg);
}
.coco-ed .chp-loc-toggle-btn.active strong{ color: var(--bg); }
.coco-ed .chp-loc-toggle-btn.active small{ color: var(--bg); opacity: 0.7; }
.coco-ed .chp-loc-toggle-wrap{ text-align: center; }

.coco-ed .chp-loc-pills{
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 auto 48px;
  max-width: var(--ed-max);
}
.coco-ed .chp-loc-pill{
  padding: 10px 22px;
  border: 1px solid rgba(250,247,240,0.2);
  border-radius: 999px;
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.65);
  transition: border-color .2s ease, color .2s ease;
}
.coco-ed .chp-loc-pill:hover{ border-color: var(--gold); color: var(--gold); }
.coco-ed .chp-loc-pill--active{ border-color: var(--gold); color: var(--gold); }

/* Per-location panels */
.coco-ed .chp-loc-panel{ display: none; }
.coco-ed .chp-loc-panel.active{ display: block; }

/* Prebooking form */
.coco-ed /* Booking-context tile — appears at the top of the reservation flow so
   customers always see which venue they're booking even after the
   header toggle has scrolled out of view. */
.chp-loc-bookhead{
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  margin: 0 auto 24px;
  max-width: 720px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(201,169,110,0.18);
  border-radius: 12px;
}
.chp-loc-bookhead-img{
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 8px;
  background: #1a1a1a;
}
.chp-loc-bookhead-img--placeholder{
  background: linear-gradient(135deg, #1a1a1a, #262626);
}
.chp-loc-bookhead-meta{ flex: 1 1 auto; min-width: 0; }
.chp-loc-bookhead-kicker{
  font-family: var(--ed-mono, 'JetBrains Mono', monospace);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold, #c9a96e);
  margin-bottom: 2px;
}
.chp-loc-bookhead-name{
  font-family: var(--ed-serif, 'Fraunces', serif);
  font-size: 18px;
  color: var(--cream, #FAF7F0);
  line-height: 1.2;
}
.chp-loc-bookhead-sub{
  font-size: 12px;
  color: rgba(250,247,240,0.55);
  margin-top: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.chp-loc-bookhead-change{
  flex: 0 0 auto;
  font-family: var(--ed-mono, 'JetBrains Mono', monospace);
  font-size: 10px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold, #c9a96e);
  text-decoration: none;
  padding: 6px 10px;
  border: 1px solid rgba(201,169,110,0.3);
  border-radius: 6px;
}
.chp-loc-bookhead-change:hover{
  background: rgba(201,169,110,0.1);
}
@media (max-width: 600px){
  .chp-loc-bookhead{ padding: 10px 12px; gap: 12px; }
  .chp-loc-bookhead-img{ flex: 0 0 48px; width: 48px; height: 48px; }
  .chp-loc-bookhead-name{ font-size: 16px; }
  .chp-loc-bookhead-sub{ font-size: 11px; }
  .chp-loc-bookhead-change{ padding: 5px 8px; font-size: 9px; }
}

.chp-loc-booking{ max-width: 760px; margin: 0 auto; padding: 0 32px 80px; }
.coco-ed .chp-loc-booking h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(32px, 4.5vw, 56px);
  line-height: 1;
  text-align: center;
  color: var(--cream);
  margin: 0 0 24px;
}
.coco-ed .chp-loc-booking h2 em{ font-style: italic; color: var(--gold); }
.coco-ed .chp-loc-booking-hint{
  text-align: center;
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 24px;
}
.coco-ed .coco-pb-progress{
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 0 0 32px;
}
.coco-ed .coco-pb-dot{
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--border);
  transition: background .2s ease;
}
.coco-ed .coco-pb-dot.active{ background: var(--gold); }
.coco-ed .coco-pb-step{ display: none; }
.coco-ed .coco-pb-step.active{ display: block; }
.coco-ed .coco-pb-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-bottom: 18px;
}
.coco-ed .coco-pb-row--single{ grid-template-columns: 1fr; max-width: 320px; margin-left: auto; margin-right: auto; }
.coco-ed .coco-pb-field{ display: flex; flex-direction: column; gap: 6px; }
.coco-ed .coco-pb-field label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}
.coco-ed .coco-pb-field input,
.coco-ed .coco-pb-field select{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 13px 14px;
  font-family: var(--ed-sans);
  font-size: 15px;
  color: var(--cream);
}
.coco-ed .coco-pb-field input:focus,
.coco-ed .coco-pb-field select:focus{ outline: none; border-color: var(--gold); }
.coco-ed .coco-pb-error{
  color: #ff6b6b;
  font-size: 13px;
  text-align: center;
  margin: 10px 0;
}
.coco-ed .coco-pb-submit,
.coco-ed .coco-pb-step .coco-venue-btn-primary{
  display: block;
  width: 100%;
  padding: 16px 30px;
  background: var(--gold);
  color: var(--bg);
  border: 1px solid var(--gold);
  border-radius: 999px;
  font-family: var(--ed-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
  margin-top: 20px;
  transition: background .2s ease, transform .2s ease;
}
.coco-ed .coco-pb-submit:hover:not(:disabled){ background: #d9bb80; transform: translateY(-1px); }
.coco-ed .coco-pb-submit:disabled{ opacity: 0.4; cursor: not-allowed; }
.coco-ed .coco-pb-back{
  display: block;
  margin: 14px auto 0;
  padding: 8px 16px;
  background: transparent;
  border: none;
  color: rgba(250,247,240,0.6);
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  cursor: pointer;
}
.coco-ed .coco-pb-back:hover{ color: var(--gold); }

/* Party-size inline on step 2 */
.coco-ed .coco-pb-party-inline{
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: center;
  margin: 0 0 24px;
  padding: 12px 20px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 999px;
  max-width: 220px;
  margin-left: auto;
  margin-right: auto;
}
.coco-ed .coco-pb-party-inline label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
}
.coco-ed .coco-pb-party-inline select{
  background: transparent;
  border: none;
  color: var(--cream);
  font-family: var(--ed-serif);
  font-style: italic;
  font-size: 18px;
  cursor: pointer;
}

/* Date strip + time grid */
.coco-ed .coco-pb-date-strip-label,
.coco-ed .coco-pb-time-grid-label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 12px;
}
.coco-ed .coco-pb-date-strip{
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding: 4px 0 16px;
  margin-bottom: 20px;
  -webkit-overflow-scrolling: touch;
}
.coco-ed .coco-pb-loading{
  padding: 16px;
  color: rgba(250,247,240,0.5);
  font-size: 13.5px;
  font-style: italic;
}
.coco-ed .coco-pb-time-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
  gap: 8px;
  margin-bottom: 20px;
}
.coco-ed .coco-pb-deposit-info{
  padding: 16px 20px;
  margin: 20px 0;
  background: var(--surface);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  border-radius: 4px;
  font-size: 14px;
}

/* Group-size notice (dynamic) */
.coco-ed .coco-pb-group-notice{
  background: rgba(201,169,110,0.08);
  border: 1px solid rgba(201,169,110,0.3);
  border-radius: 8px;
  padding: 16px 20px;
  margin: 0 0 20px;
  font-size: 14px;
  color: rgba(250,247,240,0.85);
  line-height: 1.5;
}
.coco-ed .coco-pb-group-notice--soft{
  background: var(--surface);
  border-color: var(--border);
}
.coco-ed .coco-pb-group-notice strong{ color: var(--cream); }
.coco-ed .coco-pb-group-notice a{ color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }

/* Groups banner (Dine page) */
.coco-ed .chp-groups-banner{
  max-width: 920px;
  margin: 0 auto 80px;
  padding: 0 32px;
}
.coco-ed .chp-groups-banner__inner{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 28px;
  padding: 32px 36px;
  background: linear-gradient(135deg, rgba(201,169,110,0.1), rgba(201,169,110,0.02));
  border: 1px solid rgba(201,169,110,0.28);
  border-radius: var(--ed-radius);
  align-items: center;
}
.coco-ed .chp-groups-banner__icon{ font-size: 48px; }
.coco-ed .chp-groups-banner__content h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 28px;
  color: var(--cream);
  margin: 0 0 10px;
}
.coco-ed .chp-groups-banner__content p{
  font-size: 14.5px;
  color: rgba(250,247,240,0.8);
  line-height: 1.55;
  margin: 0 0 18px;
}
.coco-ed .chp-groups-banner__ctas{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.coco-ed .chp-groups-banner.is-highlighted{
  box-shadow: 0 10px 40px rgba(201,169,110,0.18);
}

/* Set menu overlay (modal) */
.coco-ed .chp-setmenu-overlay{
  position: fixed; inset: 0;
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
}
.coco-ed .chp-setmenu-overlay[style*="block"],
.coco-ed .chp-setmenu-overlay[style*="flex"]{ display: flex; }
.coco-ed .chp-setmenu-overlay__backdrop{
  position: absolute; inset: 0;
  background: rgba(0,0,0,0.85);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.coco-ed .chp-setmenu-overlay__panel{
  position: relative;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  max-width: 1100px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  padding: 48px 40px;
}
.coco-ed .chp-setmenu-overlay__close{
  position: absolute; top: 18px; right: 18px;
  width: 36px; height: 36px;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: 50%;
  color: var(--cream);
  font-size: 22px;
  cursor: pointer;
  line-height: 1;
}
.coco-ed .chp-setmenu-overlay__close:hover{ border-color: var(--gold); color: var(--gold); }
.coco-ed .chp-setmenu-overlay__header{ text-align: center; max-width: 720px; margin: 0 auto 40px; }
.coco-ed .chp-setmenu-overlay__header h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(28px, 3.5vw, 44px);
  line-height: 1.05;
  color: var(--cream);
  margin: 16px 0 12px;
}
.coco-ed .chp-setmenu-overlay__header h2 em{ font-style: italic; color: var(--gold); }
.coco-ed .chp-setmenu-overlay__header p{ color: rgba(250,247,240,0.72); font-size: 15px; line-height: 1.55; }
.coco-ed .chp-setmenu-overlay__grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 36px;
}
.coco-ed .chp-setmenu-card{
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 28px;
  position: relative;
}
.coco-ed .chp-setmenu-card--featured{ border-color: rgba(201,169,110,0.45); }
.coco-ed .chp-setmenu-card__badge{
  position: absolute; top: -12px; left: 24px;
  background: var(--gold);
  color: var(--bg);
  font-family: var(--ed-mono);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 6px 12px;
  border-radius: 4px;
}
.coco-ed .chp-setmenu-card h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 26px;
  color: var(--cream);
  margin: 0 0 6px;
}
.coco-ed .chp-setmenu-card__price{
  font-family: var(--ed-serif);
  font-style: italic;
  font-size: 22px;
  color: var(--gold);
  margin-bottom: 14px;
}
.coco-ed .chp-setmenu-card__desc{
  font-size: 14px;
  color: rgba(250,247,240,0.72);
  line-height: 1.5;
  margin: 0 0 16px;
}
.coco-ed .chp-setmenu-card__list{
  list-style: none;
  padding: 0;
  margin: 0 0 16px;
  border-top: 1px solid var(--border);
  padding-top: 14px;
}
.coco-ed .chp-setmenu-card__list li{
  font-size: 13.5px;
  color: rgba(250,247,240,0.82);
  padding: 6px 0;
}
.coco-ed .chp-setmenu-card__note{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.55);
}
.coco-ed .chp-setmenu-overlay__footer{ text-align: center; }

/* Feature cards (Dine per-location) */
.coco-ed .chp-loc-features{ max-width: var(--ed-max); margin: 0 auto; padding: 80px 32px 0; }
.coco-ed .chp-loc-features h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(28px, 4vw, 48px);
  color: var(--cream);
  text-align: center;
  margin: 0 0 40px;
}
.coco-ed .chp-loc-features-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 0;
  border-top: 1px solid var(--border);
}
.coco-ed .chp-loc-feature-card{
  padding: 28px;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.coco-ed .chp-loc-feature-card:nth-child(4n){ border-right: none; }
.coco-ed .chp-loc-feature-card h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 22px;
  color: var(--cream);
  margin: 0 0 10px;
}
.coco-ed .chp-loc-feature-card p{
  font-size: 14px;
  color: rgba(250,247,240,0.72);
  line-height: 1.55;
  margin: 0;
}

/* Details grid */
.coco-ed .chp-loc-details{ max-width: var(--ed-max); margin: 0 auto; padding: 80px 32px; }
.coco-ed .chp-loc-details h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(28px, 4vw, 48px);
  color: var(--cream);
  text-align: center;
  margin: 0 0 40px;
}
.coco-ed .chp-loc-details-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.coco-ed .chp-loc-detail-item{
  padding: 24px 28px;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.coco-ed .chp-loc-detail-item:last-child{ border-right: none; }
.coco-ed .chp-loc-detail-item h4{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 8px;
}
.coco-ed .chp-loc-detail-item p{
  font-size: 14px;
  color: rgba(250,247,240,0.82);
  margin: 0;
  line-height: 1.5;
}
.coco-ed .chp-loc-detail-item a{ color: var(--gold); }
.coco-ed .chp-loc-detail-item a:hover{ color: #d9bb80; }

/* Event cards within location panel */
.coco-ed .chp-events-section{ max-width: var(--ed-max); margin: 0 auto; padding: 40px 32px 80px; }
.coco-ed .chp-events-section h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(28px, 4vw, 48px);
  color: var(--cream);
  text-align: center;
  margin: 0 0 40px;
}
.coco-ed .chp-event-cards{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}
.coco-ed .chp-event-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  overflow: hidden;
  transition: border-color .2s ease, transform .2s ease;
}
.coco-ed .chp-event-card:hover{ border-color: rgba(201,169,110,0.4); transform: translateY(-2px); }
.coco-ed .chp-event-card img{ width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.coco-ed .chp-event-card-body{ padding: 20px 22px; }
.coco-ed .chp-event-card-body h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 20px;
  color: var(--cream);
  margin: 0 0 8px;
}
.coco-ed .chp-event-card-body p{
  font-family: var(--ed-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 16px;
}

/* Dine & Stay cross-sell feature block */
.coco-ed .chp-feature-block{ max-width: 900px; margin: 40px auto 100px; padding: 0 32px; }
.coco-ed .chp-feature-block-inner{
  padding: 56px 48px;
  background: linear-gradient(135deg, rgba(201,169,110,0.08), rgba(201,169,110,0.02));
  border: 1px solid rgba(201,169,110,0.28);
  border-radius: var(--ed-radius);
  text-align: center;
}
.coco-ed .chp-feature-tag{
  display: inline-block;
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--gold);
  margin-bottom: 18px;
}
.coco-ed .chp-feature-block-inner h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(32px, 4vw, 52px);
  line-height: 1.05;
  color: var(--cream);
  margin: 0 0 18px;
}
.coco-ed .chp-feature-block-inner h2 em{ font-style: italic; color: var(--gold); }
.coco-ed .chp-feature-block-inner p{
  font-size: 16px;
  color: rgba(250,247,240,0.78);
  line-height: 1.6;
  max-width: 640px;
  margin: 0 auto;
}
.coco-ed .chp-cta-buttons{
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 28px;
}

/* Legacy venue-btn overrides inside .coco-ed */
.coco-ed .coco-venue-btn-primary,
.coco-ed .coco-venue-btn-outline{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 15px 30px;
  font-family: var(--ed-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
  text-decoration: none;
}
.coco-ed .coco-venue-btn-primary{ background: var(--gold); color: var(--bg); border-color: var(--gold); }
.coco-ed .coco-venue-btn-primary:hover{ background: #d9bb80; border-color: #d9bb80; transform: translateY(-1px); }
.coco-ed .coco-venue-btn-outline{ background: transparent; color: var(--cream); border-color: rgba(250,247,240,0.35); }
.coco-ed .coco-venue-btn-outline:hover{ border-color: var(--gold); color: var(--gold); }

/* Toast booking frame wrapper */
.coco-ed .chp-loc-booking-frame{
  margin: 24px 0;
  border-radius: var(--ed-radius);
  overflow: hidden;
  background: #fff;
}
.coco-ed .chp-loc-booking-fallback{
  text-align: center;
  font-size: 13px;
  color: rgba(250,247,240,0.55);
  margin: 12px 0 0;
}
.coco-ed .chp-loc-booking-fallback a{ color: var(--gold); text-decoration: underline; text-underline-offset: 3px; }
.coco-ed .coco-pb-confirmed{
  text-align: center;
  padding: 20px 0;
}
.coco-ed .coco-pb-confirmed-msg{
  font-family: var(--ed-serif);
  font-style: italic;
  font-size: 20px;
  color: var(--cream);
}
.coco-ed .coco-pb-confirmed-msg span{ color: var(--gold); }

/* ── Groups page specific ───────────────────────────────────── */
.coco-ed .chp-grp-occasions,
.coco-ed .chp-grp-steps,
.coco-ed .chp-grp-set-menus,
.coco-ed .chp-grp-enquiry,
.coco-ed .chp-grp-info{
  max-width: var(--ed-max);
  margin: 0 auto;
  padding: 80px 32px;
}
.coco-ed .chp-grp-occasions h2,
.coco-ed .chp-grp-steps h2,
.coco-ed .chp-grp-set-menus h2,
.coco-ed .chp-grp-enquiry h2,
.coco-ed .chp-grp-info h2{
  font-family: var(--ed-serif);
  font-weight: 400;
  font-size: clamp(32px, 4.5vw, 56px);
  line-height: 1.02;
  text-align: center;
  color: var(--cream);
  margin: 0 0 16px;
  letter-spacing: -0.02em;
}
.coco-ed .chp-grp-occasions h2 em,
.coco-ed .chp-grp-steps h2 em,
.coco-ed .chp-grp-set-menus h2 em,
.coco-ed .chp-grp-enquiry h2 em,
.coco-ed .chp-grp-info h2 em{ font-style: italic; color: var(--gold); }
.coco-ed .chp-grp-sub{
  text-align: center;
  font-size: 16px;
  color: rgba(250,247,240,0.7);
  max-width: 620px;
  margin: 0 auto 48px;
  line-height: 1.55;
}
.coco-ed .chp-grp-occasions-grid,
.coco-ed .chp-grp-info-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 20px;
}
.coco-ed .chp-grp-occasion-card,
.coco-ed .chp-grp-info-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 28px 26px;
}
.coco-ed .chp-grp-occasion-icon{ font-size: 32px; margin-bottom: 14px; }
.coco-ed .chp-grp-occasion-card h3,
.coco-ed .chp-grp-info-card h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 22px;
  color: var(--cream);
  margin: 0 0 8px;
}
.coco-ed .chp-grp-occasion-card p{
  font-size: 14px;
  color: rgba(250,247,240,0.72);
  line-height: 1.55;
  margin: 0;
}
.coco-ed .chp-grp-info-sub{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 12px;
}
.coco-ed .chp-grp-info-list{
  list-style: none;
  padding: 0;
  margin: 0;
  border-top: 1px solid var(--border);
  padding-top: 12px;
}
.coco-ed .chp-grp-info-list li{
  font-size: 13.5px;
  color: rgba(250,247,240,0.78);
  padding: 6px 0;
  line-height: 1.45;
}

/* Steps */
.coco-ed .chp-grp-steps-grid{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-top: 1px solid var(--border);
}
.coco-ed .chp-grp-step{
  padding: 32px 28px;
  border-right: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}
.coco-ed .chp-grp-step:nth-child(4n){ border-right: none; }
.coco-ed .chp-grp-step-num{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 42px;
  line-height: 1;
  color: var(--gold);
  margin-bottom: 14px;
}
.coco-ed .chp-grp-step h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 20px;
  color: var(--cream);
  margin: 0 0 8px;
}
.coco-ed .chp-grp-step p{
  font-size: 13.5px;
  color: rgba(250,247,240,0.72);
  line-height: 1.5;
  margin: 0;
}

/* Set menus */
.coco-ed .chp-grp-menus-grid{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 36px;
}
.coco-ed .chp-grp-menu-card{
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
  padding: 32px 28px;
  position: relative;
}
.coco-ed .chp-grp-menu-card--featured{ border-color: rgba(201,169,110,0.45); background: linear-gradient(180deg, var(--surface), rgba(201,169,110,0.04)); }
.coco-ed .chp-grp-menu-card h3{
  font-family: var(--ed-serif);
  font-style: italic;
  font-weight: 400;
  font-size: 30px;
  color: var(--cream);
  margin: 0 0 6px;
}
.coco-ed .chp-grp-menu-price{
  font-family: var(--ed-serif);
  font-style: italic;
  font-size: 22px;
  color: var(--gold);
  margin-bottom: 16px;
}
.coco-ed .chp-grp-menu-desc{
  font-size: 14px;
  color: rgba(250,247,240,0.72);
  line-height: 1.55;
  margin: 0 0 16px;
}
.coco-ed .chp-grp-menu-items{
  list-style: none;
  padding: 14px 0 0;
  margin: 0 0 16px;
  border-top: 1px solid var(--border);
}
.coco-ed .chp-grp-menu-items li{
  font-size: 13.5px;
  color: rgba(250,247,240,0.82);
  padding: 6px 0;
  line-height: 1.5;
}
.coco-ed .chp-grp-menu-note{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.55);
  margin: 12px 0 0;
}
.coco-ed .chp-grp-shisha-note{
  max-width: 680px;
  margin: 0 auto 20px;
  padding: 16px 20px;
  background: rgba(201,169,110,0.06);
  border: 1px solid rgba(201,169,110,0.25);
  border-radius: 6px;
  text-align: center;
  font-size: 13.5px;
  color: rgba(250,247,240,0.82);
}
.coco-ed .chp-grp-shisha-note strong{ color: var(--cream); }
.coco-ed .chp-grp-menu-disclaimer{
  text-align: center;
  max-width: 720px;
  margin: 0 auto;
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(250,247,240,0.45);
  line-height: 1.6;
}

/* Booking form */
.coco-ed .chp-grp-booking-form{
  max-width: 640px;
  margin: 0 auto;
  padding: 36px 32px;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--ed-radius);
}
.coco-ed .chp-grp-booking-form .chp-form-row{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-bottom: 18px;
}
.coco-ed .chp-grp-booking-form .chp-form-field{ display: flex; flex-direction: column; gap: 6px; }
.coco-ed .chp-grp-booking-form .chp-form-field label{
  font-family: var(--ed-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold);
}
.coco-ed .chp-grp-booking-form .chp-form-field select{
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 13px 14px;
  font-family: var(--ed-sans);
  font-size: 15px;
  color: var(--cream);
}
.coco-ed .chp-grp-booking-form .chp-form-field select:focus{ outline: none; border-color: var(--gold); }
.coco-ed .chp-grp-booking-form button{ width: 100%; margin-top: 8px; }
.coco-ed .chp-grp-alt-contact{
  text-align: center;
  font-size: 14px;
  color: rgba(250,247,240,0.65);
  margin: 20px 0 0;
}
.coco-ed .chp-grp-alt-contact a{ color: var(--gold); }

/* Bottom CTA section (legacy class, editorial overrides) */
.coco-ed .chp-cta-section{
  padding: 100px 32px;
  text-align: center;
  background:
    radial-gradient(ellipse at top, rgba(201,169,110,0.08), transparent 60%),
    var(--bg);
  border-top: 1px solid var(--border);
}
.coco-ed .chp-cta-section h2{
  font-family: var(--ed-serif);
  font-weight: 300;
  font-size: clamp(40px, 5.5vw, 72px);
  line-height: 1;
  letter-spacing: -0.025em;
  color: var(--cream);
  margin: 0 0 28px;
}
.coco-ed .chp-cta-section h2 em{ font-style: italic; color: var(--gold); }
.coco-ed .chp-cta-section .chp-cta-buttons{
  display: flex;
  gap: 12px;
  justify-content: center;
  flex-wrap: wrap;
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 900px){
  .coco-ed-tiers{ grid-template-columns: 1fr; }
  .coco-ed-menu-list{ grid-template-columns: 1fr; }
  .coco-ed .chp-menu-grid{ grid-template-columns: 1fr; }
  .coco-ed-form-row{ grid-template-columns: 1fr; }
  .coco-ed-twocol{ grid-template-columns: 1fr; }
  .coco-ed-banners{ grid-template-columns: 1fr; }
  .coco-ed-book{ grid-template-columns: 1fr; }
  .coco-ed-hero{ min-height: 56vh; padding: 120px 0 60px; }
  /* Booking-flow hero stays short on mobile too — form needs to be reachable. */
  .coco-haus-page--reserve .coco-ed-hero{ min-height: 30vh; padding: 80px 0 24px; }
  .coco-ed .chp-setmenu-overlay__grid{ grid-template-columns: 1fr; }
  .coco-ed .chp-groups-banner__inner{ grid-template-columns: 1fr; text-align: center; }
  .coco-ed .coco-pb-row{ grid-template-columns: 1fr; }
  .coco-ed .chp-loc-feature-card{ border-right: none; }
  .coco-ed .chp-loc-detail-item{ border-right: none; }
  .coco-ed .chp-grp-steps-grid{ grid-template-columns: repeat(2, 1fr); }
  .coco-ed .chp-grp-step:nth-child(2n){ border-right: none; }
  .coco-ed .chp-grp-menus-grid{ grid-template-columns: 1fr; }
  .coco-ed .chp-grp-booking-form .chp-form-row{ grid-template-columns: 1fr; }
}
@media (max-width: 640px){
  .coco-ed .coco-container{ padding: 0 20px; }
  .coco-ed-hero-inner{ padding: 0 20px; }
  .coco-ed-section{ padding: 70px 0; }
  .coco-ed-close{ padding: 80px 0 60px; }
  .coco-ed-fact{ grid-template-columns: 100px 1fr; gap: 12px; }
}

/* ── Menu cross-navigation strip ─────────────────────────
   Appears at the top of every menu page. Lets a customer who
   lands on (e.g.) the food menu reach drinks / bottles / set
   menus in one tap — and links out to the Google Business
   Profile menu if configured.                                 */

.coco-ed .chp-menu-nav {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    padding: 14px 32px;
    background: var(--haus-bg);
    border-bottom: 1px solid var(--haus-border);
    font-family: var(--haus-font-body);
}
.coco-ed .chp-menu-nav-hub {
    font-size: 11px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--haus-text-dim);
    margin-right: 8px;
    padding: 6px 10px;
    border-radius: 4px;
    text-decoration: none;
    transition: color 0.2s var(--haus-ease);
}
.coco-ed .chp-menu-nav-hub:hover { color: var(--haus-gold); }
.coco-ed .chp-menu-nav-item {
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 14px;
    color: var(--haus-text);
    text-decoration: none;
    border: 1px solid transparent;
    transition: border-color 0.2s var(--haus-ease), color 0.2s var(--haus-ease), background 0.2s var(--haus-ease);
}
.coco-ed .chp-menu-nav-item:hover {
    border-color: var(--haus-gold-border);
    color: var(--haus-gold);
}
.coco-ed .chp-menu-nav-item.is-active {
    border-color: var(--haus-gold);
    color: var(--haus-gold);
    background: var(--haus-gold-glow);
    cursor: default;
}
.coco-ed .chp-menu-nav-google {
    margin-left: auto;
    font-size: 13px;
    color: var(--haus-text-dim);
}
@media (max-width: 600px) {
    .coco-ed .chp-menu-nav {
        padding: 10px 16px;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
    }
    .coco-ed .chp-menu-nav .chp-menu-nav-item { flex: 0 0 auto; }
    .coco-ed .chp-menu-nav-google { margin-left: 8px; }
}

/* ── Menus hub grid ──────────────────────────────────── */

.coco-ed .chp-menus-hub-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 48px;
}
.coco-ed .chp-menus-hub-tile {
    display: flex;
    flex-direction: column;
    text-decoration: none;
    background: var(--haus-bg2);
    border: 1px solid var(--haus-border);
    border-radius: var(--haus-radius-sm);
    overflow: hidden;
    transition: transform 0.25s var(--haus-ease), border-color 0.25s var(--haus-ease);
    min-height: 320px;
}
.coco-ed .chp-menus-hub-tile:hover {
    transform: translateY(-3px);
    border-color: var(--haus-gold);
}
.coco-ed .chp-menus-hub-img {
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center;
    background-color: var(--haus-bg3);
}
.coco-ed .chp-menus-hub-img--placeholder {
    background: linear-gradient(135deg, var(--haus-bg3) 0%, var(--haus-bg2) 100%);
}
.coco-ed .chp-menus-hub-body {
    padding: 22px 24px 26px;
}
.coco-ed .chp-menus-hub-title {
    font-family: var(--haus-font-display);
    font-weight: 600;
    font-size: 26px;
    margin: 0 0 8px;
    color: var(--haus-text);
}
.coco-ed .chp-menus-hub-desc {
    font-size: 15px;
    color: var(--haus-text-dim);
    line-height: 1.55;
    margin: 0 0 14px;
}
.coco-ed .chp-menus-hub-cta {
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--haus-gold);
}
.coco-ed .chp-menus-hub-extras {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    padding: 24px 0 40px;
    border-top: 1px solid var(--haus-border);
    margin-top: 16px;
}
.coco-ed .chp-menus-hub-extra {
    padding: 12px 20px;
    border: 1px solid var(--haus-border);
    border-radius: 999px;
    color: var(--haus-text);
    text-decoration: none;
    font-size: 14px;
    transition: border-color 0.2s var(--haus-ease), color 0.2s var(--haus-ease);
}
.coco-ed .chp-menus-hub-extra:hover {
    border-color: var(--haus-gold);
    color: var(--haus-gold);
}
@media (max-width: 700px) {
    .coco-ed .chp-menus-hub-grid { grid-template-columns: 1fr; gap: 18px; }
    .coco-ed .chp-menus-hub-tile { min-height: 0; }
}

/* ── Bar menu (Singles & Doubles) ────────────────────────
   Functional price-list layout — two columns on desktop,
   single column on mobile. Uses the existing haus-pages
   editorial tokens, no print-style overrides.              */

.coco-ed .chp-bar-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 64px;
    margin: 40px 0 48px;
}
.coco-ed .chp-bar-section {
    margin-bottom: 36px;
}
.coco-ed .chp-bar-section-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    border-bottom: 1px solid var(--haus-border);
    padding-bottom: 10px;
    margin-bottom: 14px;
}
.coco-ed .chp-bar-section-title {
    font-family: var(--haus-font-display);
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: var(--haus-text);
    margin: 0;
}
.coco-ed .chp-bar-section-measure {
    font-family: var(--haus-font-body);
    font-size: 10px;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--haus-text-dim);
    font-weight: 500;
}
.coco-ed .chp-bar-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.coco-ed .chp-bar-item {
    display: flex;
    align-items: baseline;
    gap: 10px;
    padding: 8px 0;
    font-size: 15px;
    color: var(--haus-text);
}
.coco-ed .chp-bar-item-name {
    flex: 0 1 auto;
}
.coco-ed .chp-bar-item-dots {
    flex: 1 1 auto;
    border-bottom: 1px dotted rgba(255,255,255,0.15);
    transform: translateY(-3px);
}
.coco-ed .chp-bar-item-price {
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
    font-weight: 600;
    color: var(--haus-gold);
    letter-spacing: 0.02em;
}

/* Highlight panel — used on Tequila */
.coco-ed .chp-bar-section--highlight {
    background: var(--haus-bg2);
    border: 1px solid var(--haus-gold-border);
    border-radius: var(--haus-radius-sm);
    padding: 22px 24px;
    margin-bottom: 36px;
}
.coco-ed .chp-bar-section--highlight .chp-bar-section-head {
    border-bottom-color: var(--haus-gold-border);
}
.coco-ed .chp-bar-section--highlight .chp-bar-section-title {
    color: var(--haus-gold);
}

/* Footer strip: address + mixer note */
.coco-ed .chp-bar-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 20px 0 0;
    margin-top: 32px;
    border-top: 1px solid var(--haus-border);
    font-size: 12px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--haus-text-dim);
}
.coco-ed .chp-bar-footer-mixer {
    color: var(--haus-gold);
    font-weight: 600;
}
.coco-ed .chp-bar-service-notice {
    margin: 14px 0 0;
    text-align: center;
    font-size: 12px;
    letter-spacing: 0.08em;
    color: var(--haus-text-dim);
    font-style: italic;
}

@media (max-width: 820px) {
    .coco-ed .chp-bar-grid {
        grid-template-columns: 1fr;
        gap: 0;
    }
}
@media (max-width: 500px) {
    .coco-ed .chp-bar-section-title { font-size: 20px; }
    .coco-ed .chp-bar-item { font-size: 14px; padding: 7px 0; }
    .coco-ed .chp-bar-footer {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }
}