/* ============================================================
   Inner page styles — Dining, Specials, Events, Contact
   ============================================================ */

/* --- Dining menu --- */
.vlj-menu__inner { max-width: 920px; margin: 0 auto; }

/* TOC for the long Vulajio's menu */
.vlj-menu__toc {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    justify-content: center;
    padding: 18px 22px;
    margin: 0 auto clamp(40px, 5vw, 60px);
    background: var(--vlj-bg-2);
    border: 1px solid var(--vlj-line);
    border-radius: var(--vlj-radius);
    max-width: 920px;
}
.vlj-menu__toc a {
    color: var(--vlj-cream-3);
    font-family: var(--vlj-body);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 4px 0;
    border-bottom: 1px solid transparent;
    transition: color .2s ease, border-color .2s ease;
}
.vlj-menu__toc a:hover {
    color: var(--vlj-gold-2);
    border-bottom-color: var(--vlj-gold-2);
}

.vlj-menu__note {
    text-align: center;
    color: var(--vlj-mute) !important;
    font-size: 13px;
    margin-top: 28px;
}
.vlj-menu__section {
    margin-bottom: clamp(40px, 5vw, 64px);
    padding-bottom: clamp(36px, 5vw, 56px);
    border-bottom: 1px solid var(--vlj-line);
}
.vlj-menu__section:last-of-type { border-bottom: 0; }
.vlj-menu__heading {
    font-family: var(--vlj-display);
    color: var(--vlj-gold-2);
    font-size: clamp(26px, 3vw, 36px);
    text-align: center;
    margin: 0 0 28px;
    letter-spacing: .01em;
    font-style: italic;
}
.vlj-menu__items { display: grid; gap: 22px; }

/* Menu item with optional thumbnail (photo + text side-by-side) */
.vlj-menu__item--has-photo {
    display: grid;
    grid-template-columns: 100px 1fr;
    gap: 18px;
    align-items: start;
}
.vlj-menu__thumb {
    width: 100px;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: var(--vlj-radius);
    border: 1px solid var(--vlj-line);
    background: var(--vlj-bg-3);
}
.vlj-menu__thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .8s cubic-bezier(.2,.65,.25,1);
}
.vlj-menu__item--has-photo:hover .vlj-menu__thumb img { transform: scale(1.04); }
.vlj-menu__body { min-width: 0; }

@media (min-width: 768px) {
    .vlj-menu__item--has-photo { grid-template-columns: 120px 1fr; gap: 22px; }
    .vlj-menu__thumb { width: 120px; }
}

.vlj-menu__row {
    display: grid;
    grid-template-columns: max-content 1fr max-content;
    align-items: baseline;
    gap: 14px;
}
.vlj-menu__name {
    font-family: var(--vlj-display);
    color: var(--vlj-cream);
    font-size: 19px;
    font-weight: 500;
}
.vlj-menu__lead {
    border-bottom: 1px dotted var(--vlj-line-2);
    margin-bottom: 6px;
}
.vlj-menu__price {
    font-family: var(--vlj-body);
    color: var(--vlj-gold-2);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .04em;
}
.vlj-menu__desc {
    color: var(--vlj-mute);
    font-size: 15px;
    margin: 4px 0 0;
}
.vlj-menu__cta {
    display: flex;
    gap: 14px;
    justify-content: center;
    margin-top: clamp(40px, 5vw, 60px);
    flex-wrap: wrap;
}

/* --- Specials --- */
.vlj-specials__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(20px, 3vw, 36px);
    max-width: 1100px;
    margin: 0 auto;
}
.vlj-special {
    background: var(--vlj-bg-2);
    border: 1px solid var(--vlj-line);
    padding: 32px 26px;
    transition: transform .3s ease, border-color .3s ease;
}
.vlj-special:hover {
    transform: translateY(-4px);
    border-color: var(--vlj-gold);
}
.vlj-special__num {
    display: block;
    font-family: var(--vlj-display);
    color: var(--vlj-gold);
    font-size: 24px;
    margin-bottom: 8px;
}
.vlj-special h3 { margin: 4px 0 12px; font-size: 24px; }
.vlj-special p { color: var(--vlj-mute); font-size: 15px; margin: 0; }
.vlj-specials__cta { text-align: center; margin-top: clamp(40px, 5vw, 60px); }

@media (max-width: 899px) { .vlj-specials__grid { grid-template-columns: 1fr; } }

/* --- Events packages --- */
.vlj-packages__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: clamp(20px, 3vw, 36px);
    max-width: 1100px;
    margin: 0 auto;
}
.vlj-package {
    background: var(--vlj-bg-2);
    border: 1px solid var(--vlj-line);
    padding: 36px 28px;
    text-align: center;
}
.vlj-package h3 { margin: 8px 0 4px; }
.vlj-package__price {
    font-family: var(--vlj-display);
    color: var(--vlj-gold-2);
    font-size: 48px;
    line-height: 1;
    margin: 12px 0 16px;
}
.vlj-package p { color: var(--vlj-mute); font-size: 15px; }
.vlj-package__meta { color: var(--vlj-gold-2) !important; font-size: 12px; margin-top: 18px; opacity: .8; }

.vlj-packages__lede {
    color: var(--vlj-cream-2);
    font-family: var(--vlj-display);
    font-size: clamp(15px, 1.4vw, 17px);
    line-height: 1.6;
    max-width: 640px;
    margin: 16px auto 0;
}

/* "Choice of three" small-caps brass header inside each card */
.vlj-package__choose {
    font-family: var(--vlj-body);
    font-size: 10px;
    letter-spacing: .26em;
    text-transform: uppercase;
    color: var(--vlj-gold-2);
    margin: 18px 0 12px;
    position: relative;
    padding-top: 14px;
}
.vlj-package__choose::before {
    content: "";
    display: block;
    width: 36px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--vlj-gold-2), transparent);
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
}

/* Entrée list — italic display, centered, with brass hairline between */
.vlj-package__choices {
    list-style: none;
    padding: 0;
    margin: 0;
    text-align: center;
}
.vlj-package__choices li {
    font-family: var(--vlj-display);
    font-style: italic;
    color: var(--vlj-cream);
    font-size: clamp(15px, 1.3vw, 17px);
    line-height: 1.5;
    padding: 7px 0;
}
.vlj-package__choices li + li {
    border-top: 1px dotted rgba(232, 195, 106, .18);
}

@media (max-width: 899px) { .vlj-packages__grid { grid-template-columns: 1fr; max-width: 480px; } }

/* --- Catering trays --- */
.vlj-catering { background: var(--vlj-bg-2); border-top: 1px solid var(--vlj-line); }
.vlj-catering__lede {
    color: var(--vlj-cream-2);
    font-family: var(--vlj-display);
    font-style: italic;
    font-size: clamp(15px, 1.4vw, 18px);
    max-width: 720px;
    margin: 12px auto 0;
}
.vlj-catering__lede a { color: var(--vlj-gold-2); border-bottom: 1px solid var(--vlj-line-2); }
.vlj-catering__lede a:hover { color: var(--vlj-candle); }

.vlj-catering__section {
    max-width: 1080px;
    margin: 0 auto clamp(40px, 5vw, 60px);
}
.vlj-catering__heading {
    font-family: var(--vlj-display);
    font-style: italic;
    font-weight: 500;
    font-size: clamp(24px, 2.6vw, 32px);
    color: var(--vlj-gold-2);
    text-align: center;
    margin: 0 0 clamp(20px, 2.5vw, 32px);
    padding-bottom: 10px;
    position: relative;
}
.vlj-catering__heading::after {
    content: "";
    position: absolute;
    left: 50%; bottom: 0;
    transform: translateX(-50%);
    width: 56px;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--vlj-gold-2), transparent);
}
.vlj-catering__items {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: clamp(28px, 4vw, 56px);
    row-gap: 14px;
}
.vlj-catering__item {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: baseline;
    gap: 10px;
    padding: 4px 0;
}
.vlj-catering__name {
    font-family: var(--vlj-display);
    font-size: clamp(16px, 1.4vw, 19px);
    color: var(--vlj-cream);
}
.vlj-catering__lead {
    border-bottom: 1px dotted rgba(232, 195, 106, .35);
    height: 1px;
    transform: translateY(-4px);
}
.vlj-catering__price {
    color: var(--vlj-gold-2);
    font-family: var(--vlj-display);
    font-style: italic;
    font-size: clamp(16px, 1.4vw, 19px);
    white-space: nowrap;
}
.vlj-catering__note {
    color: var(--vlj-mute);
    text-align: center;
    margin: clamp(40px, 5vw, 60px) auto 0;
    max-width: 720px;
    font-size: 14px;
    line-height: 1.6;
}

@media (max-width: 699px) {
    .vlj-catering__items { grid-template-columns: 1fr; }
}

/* ============================================================
   404 — lost-in-the-kitchen page
   ============================================================ */
.vlj-404-shell { background: var(--vlj-bg); }
.vlj-404 {
    position: relative;
    min-height: calc(100svh - 80px);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
    padding: clamp(80px, 12vw, 160px) clamp(20px, 5vw, 64px);
    isolation: isolate;
    background:
        radial-gradient(ellipse 60% 50% at 50% 40%, rgba(40, 22, 12, .55), transparent 70%),
        var(--vlj-bg);
}
.vlj-404__veil {
    position: absolute; inset: 0;
    z-index: 1;
    background:
        radial-gradient(ellipse 60% 50% at 50% 50%, transparent 0%, transparent 40%, rgba(0,0,0,.55) 85%, rgba(0,0,0,.85) 100%);
    pointer-events: none;
}
.vlj-404__sconces {
    position: absolute; inset: 0;
    z-index: 1;
    background:
        radial-gradient(ellipse 30% 24% at 10% 12%,  rgba(232, 195, 106, .22) 0%, transparent 65%),
        radial-gradient(ellipse 32% 26% at 90% 16%,  rgba(255, 231, 168, .14) 0%, transparent 65%),
        radial-gradient(ellipse 40% 30% at 50% 100%, rgba(194, 69, 30, .18)   0%, transparent 70%);
    mix-blend-mode: screen;
    pointer-events: none;
}
.vlj-404__inner {
    position: relative;
    z-index: 3;
    max-width: 760px;
    margin: 0 auto;
}
.vlj-404__eyebrow {
    color: var(--vlj-gold-2);
    margin-bottom: 22px;
}
.vlj-404__title {
    font-family: var(--vlj-display);
    font-weight: 400;
    font-size: clamp(40px, 7vw, 84px);
    line-height: 1.1;
    color: var(--vlj-cream);
    margin: 0 0 22px;
}
.vlj-404__lede {
    font-family: var(--vlj-display);
    font-style: italic;
    font-size: clamp(17px, 1.8vw, 22px);
    color: var(--vlj-cream-2);
    margin: 0 auto 36px;
    max-width: 540px;
    line-height: 1.55;
}
.vlj-404__ctas {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 14px;
    justify-content: center;
    margin-bottom: 36px;
}
.vlj-404__phone {
    color: var(--vlj-mute);
    font-size: 15px;
}
.vlj-404__phone a {
    color: var(--vlj-gold-2);
    border-bottom: 1px solid var(--vlj-line-2);
    padding-bottom: 1px;
}
.vlj-404__phone a:hover { color: var(--vlj-candle); }

@media (max-width: 599px) {
    .vlj-404__ctas { flex-direction: column; width: 100%; max-width: 320px; }
    .vlj-404__ctas .vlj-btn { width: 100%; text-align: center; }
}

/* ============================================================
   PRINT — beautiful one-page menu card (focused on /dining/)
   When someone hits Cmd+P / Ctrl+P, render the menu as a tight
   editorial print piece — black on cream paper, two columns,
   no chrome.
   ============================================================ */
@media print {
    /* Reset palette to paper */
    html, body {
        background: #fffaf0 !important;
        color: #1a1208 !important;
        font-size: 11pt;
        line-height: 1.45;
    }
    @page {
        size: letter;
        margin: 0.5in;
    }

    /* Strip every piece of site chrome */
    .vlj-header,
    .vlj-drawer,
    .vlj-skip,
    .vlj-footer,
    .vlj-cta-stack,
    .vlj-popup,
    .vlj-hero,
    .vlj-acclaim-bar,
    .vlj-marquee,
    .vlj-welcome,
    .vlj-cucina,
    .vlj-kitchen,
    .vlj-events-teaser,
    .vlj-reserve,
    .vlj-grain,
    .vlj-vignette,
    .vlj-menu__toc,
    .vlj-menu__cta,
    .vlj-page-hero {
        display: none !important;
    }

    /* Reveal anything hidden by the fade-up that hasn't fired */
    .vlj-section-fade {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    /* Print masthead — show wordmark + address/phone */
    .vlj-menu__inner::before {
        content: "Vulajio\2019s";
        display: block;
        font-family: Georgia, "Times New Roman", serif;
        font-style: italic;
        font-size: 28pt;
        font-weight: 500;
        text-align: center;
        color: #6b4a14 !important;
        margin-bottom: 4pt;
    }
    .vlj-menu__inner::after {
        content: "2593 NY-52 \00B7  Hopewell Junction, NY 12533 \00B7  (845) 447-2800 \00B7  vulajiosrestaurant.com";
        display: block;
        text-align: center;
        font-size: 9pt;
        letter-spacing: .08em;
        color: #6b4a14 !important;
        margin: 12pt 0 18pt;
        padding-bottom: 12pt;
        border-bottom: 0.75pt solid #6b4a14;
    }

    /* Menu container */
    .vlj-menu, .vlj-menu__inner { padding: 0 !important; background: none !important; }

    /* Two-column flow for the whole menu */
    .vlj-menu__inner > .vlj-menu__section,
    .vlj-menu__section {
        break-inside: avoid;
        page-break-inside: avoid;
        margin-bottom: 14pt;
    }
    .vlj-menu__items {
        column-count: 2;
        column-gap: 28pt;
        column-rule: 0.5pt solid rgba(107, 74, 20, .25);
    }

    /* Section heading */
    .vlj-menu__heading {
        font-family: Georgia, serif;
        font-style: italic;
        font-weight: 500;
        font-size: 16pt;
        color: #6b4a14 !important;
        margin: 0 0 8pt;
        text-align: center;
        column-span: all;
        position: relative;
        padding-bottom: 6pt;
    }
    .vlj-menu__heading::after {
        content: "";
        display: block;
        width: 28pt;
        height: 0.5pt;
        background: #6b4a14;
        margin: 5pt auto 0;
    }

    /* Item row */
    .vlj-menu__item {
        break-inside: avoid;
        page-break-inside: avoid;
        margin-bottom: 6pt;
        padding: 0;
        background: none !important;
        border: 0 !important;
    }
    .vlj-menu__item--has-photo .vlj-menu__thumb { display: none; }
    .vlj-menu__body { width: 100%; }
    .vlj-menu__row {
        display: flex;
        align-items: baseline;
        gap: 6pt;
    }
    .vlj-menu__name {
        font-family: Georgia, serif;
        font-style: italic;
        font-weight: 500;
        font-size: 10pt;
        color: #1a1208 !important;
    }
    .vlj-menu__lead {
        flex: 1;
        border-bottom: 0.5pt dotted rgba(107, 74, 20, .4);
        margin: 0 2pt;
        height: 1px;
        transform: translateY(-3px);
    }
    .vlj-menu__price {
        font-family: Georgia, serif;
        font-size: 10pt;
        font-weight: 500;
        color: #6b4a14 !important;
        white-space: nowrap;
    }
    .vlj-menu__desc {
        font-family: Georgia, serif;
        font-size: 8.5pt;
        font-style: italic;
        color: rgba(26, 18, 8, .65) !important;
        margin: 1pt 0 0;
        line-height: 1.35;
    }

    /* Foot note */
    .vlj-menu__note {
        column-span: all;
        text-align: center;
        font-size: 8pt;
        color: rgba(107, 74, 20, .8) !important;
        margin-top: 18pt;
        padding-top: 10pt;
        border-top: 0.5pt solid rgba(107, 74, 20, .3);
        font-style: italic;
    }

    /* Hide pizza personal section since dine-in only — actually keep it,
       customers will want it on the print menu too */

    a { color: inherit !important; text-decoration: none !important; }
}

/* --- Inquiry / contact form --- */
.vlj-inquiry__inner {
    display: grid;
    grid-template-columns: .8fr 1fr;
    gap: clamp(32px, 5vw, 64px);
    align-items: start;
}
.vlj-contact__inner {
    display: grid;
    grid-template-columns: .6fr 1fr;
    gap: clamp(32px, 5vw, 64px);
    align-items: start;
}
.vlj-contact__block { margin-bottom: 28px; }
.vlj-contact__block h4 { margin-bottom: 8px; }

@media (max-width: 899px) {
    .vlj-inquiry__inner,
    .vlj-contact__inner { grid-template-columns: 1fr; }
}

/* --- Reserve section reuse for inner pages --- */
.vlj-reserve { background: var(--vlj-bg-2); text-align: center; border-top: 1px solid var(--vlj-line); }
.vlj-reserve__head { max-width: 720px; margin: 0 auto clamp(28px, 4vw, 44px); }
.vlj-reserve__widget { display: flex; justify-content: center; min-height: 80px; align-items: center; }

/* --- Find us / map --- */
.vlj-map { background: var(--vlj-bg-2); border-top: 1px solid var(--vlj-line); }
.vlj-map__head { text-align: center; max-width: 640px; margin: 0 auto clamp(28px, 4vw, 44px); }
.vlj-map__head h2 { margin: 8px 0 12px; }
.vlj-map__lede { color: var(--vlj-mute); font-family: var(--vlj-display); font-style: italic; font-size: 1.05rem; }
.vlj-map__frame {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    border: 1px solid var(--vlj-line-2);
    border-radius: var(--vlj-radius-lg);
    overflow: hidden;
    box-shadow: var(--vlj-shadow-2);
    background: var(--vlj-bg-3);
}
.vlj-map__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    /* warm the cool Google tiles to match the room */
    filter: grayscale(.35) sepia(.25) saturate(.85) brightness(.92);
}
.vlj-map__cta { text-align: center; margin-top: 22px; font-family: var(--vlj-display); font-style: italic; font-size: 1.05rem; }
.vlj-link-gold {
    color: var(--vlj-gold-2);
    text-decoration: none;
    border-bottom: 1px solid var(--vlj-line-2);
    padding-bottom: 2px;
    transition: color .25s ease, border-color .25s ease;
}
.vlj-link-gold:hover { color: var(--vlj-candle); border-color: var(--vlj-gold-2); }
@media (max-width: 599px) {
    .vlj-map__frame { aspect-ratio: 4 / 5; }
}
