/* Bricks Bistro Menu — CSS Variables (base tokens only)
   Visual styles come from Bricks Builder element controls (CSS mapping)
   and the frontend.css fallback/scaffold. */

.bbm-menu {
    /* === Control Variables (set by Bricks element controls or cascaded) === */
    --bbm-bg: #F8F4EE;
    --bbm-accent: #6B2D2C;
    --bbm-highlight: #5F6A4D;
    --bbm-text: #2E2E2E;
    --bbm-separator: #B8A88A;
    --bbm-accent-gold: #C9A96E;
    --bbm-bg-card: #FAF7F2;

    /* === Layout === */
    --bbm-max-width: 1200px;
    --bbm-radius: 12px;
    --bbm-card-gap: 24px;
    --bbm-masonry-gap: 24px;
    --bbm-pdf-align: center;
    --bbm-shadow: 0 2px 16px rgba(46, 46, 46, 0.05);
    --bbm-shadow-hover: 0 8px 32px rgba(46, 46, 46, 0.1);
    --bbm-transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);

    /* === Font Families (site framework can override) === */
    --bbm-font-body-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --bbm-font-heading-family: 'Noto Serif', 'Georgia', 'Times New Roman', serif;
    --bbm-font-elegant-family: 'Cormorant Garamond', 'Playfair Display', Georgia, 'Times New Roman', serif;

    /* === Font Sizes (set by Bricks element controls) === */
    --bbm-font-heading: 32px;
    --bbm-font-name: 22px;
    --bbm-font-price: 24px;
    --bbm-font-desc: 15px;
    --bbm-font-section: 26px;
    --bbm-font-tab: 20px;
    --bbm-font-badge: 11px;
    --bbm-font-detail: 12px;

    /* === Root block (mobile-safe sizing — mandatory) === */
    width: 100%;
    max-width: var(--bbm-max-width, 1200px);
    min-width: 0;
    margin: 0 auto;
    background-color: var(--bbm-bg, #F8F4EE);
    color: var(--bbm-text, #2E2E2E);
    font-family: var(--bbm-font-body-family, 'Inter', sans-serif);
    font-weight: 400;
    line-height: 1.7;
    position: relative;
    padding: 60px 40px;
}