@charset "utf-8";
/* CSS Document */

        :root {
            --red: #C61613;
            --green-dark: #21522B;
            --green-light: #99B549;
            --cream: #FDF6EC;
            --gold: #D4A017;
        }
        * { margin: 0; padding: 0; box-sizing: border-box; }
        html { scroll-behavior: smooth; }
        body { font-family: 'Nunito', sans-serif; background: var(--cream); color: #1a1a1a; }

        /* ===== NAVBAR ===== */
        .navbar {
            background: var(--green-dark) !important;
            padding: 10px 0;
            position: sticky;
            top: 0;
            z-index: 1000;
            box-shadow: 0 2px 20px rgba(0,0,0,0.4);
        }
        .navbar-brand img { height: 60px; border-radius: 50%; border: 2px solid var(--green-light); }
        .navbar-nav .nav-link {
            color: #fff !important;
            font-weight: 600;
            font-size: 0.95rem;
            letter-spacing: 0.5px;
            padding: 8px 16px !important;
            transition: color 0.3s;
        }
        .navbar-nav .nav-link:hover { color: var(--green-light) !important; }
        .navbar-toggler { border-color: var(--green-light); }
        .navbar-toggler-icon { filter: invert(1); }

        /* ===== HERO CAROUSEL ===== */
        #heroCarousel { position: relative; }
        .hero-slide {
            height: 92vh;
            background-size: cover;
            background-position: center;
            position: relative;
        }
        .hero-slide::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(to bottom, rgba(33,82,43,0.55) 0%, rgba(0,0,0,0.65) 100%);
        }
        .hero-content {
            position: absolute;
            bottom: 0;
            left: 0; right: 0;
            padding: 60px 40px;
            text-align: center;
            color: #fff;
        }
        .hero-content h1 {
            font-family: 'Playfair Display', serif;
            font-size: clamp(2.4rem, 7vw, 5rem);
            font-weight: 900;
            text-shadow: 2px 4px 12px rgba(0,0,0,0.6);
            line-height: 1.1;
        }
        .hero-content h1 span { color: var(--green-light); }
        .hero-content p {
            font-size: 1.25rem;
            margin-top: 12px;
            opacity: 0.92;
            text-shadow: 1px 2px 6px rgba(0,0,0,0.5);
        }
        .hero-cta {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            margin-top: 28px;
            background: var(--red);
            color: #fff;
            padding: 14px 36px;
            border-radius: 50px;
            font-size: 1.1rem;
            font-weight: 700;
            text-decoration: none;
            letter-spacing: 0.5px;
            transition: background 0.3s, transform 0.2s;
            box-shadow: 0 4px 20px rgba(198,22,19,0.5);
        }
        .hero-cta:hover { background: #a00f0e; color: #fff; transform: translateY(-2px); }
        .carousel-indicators [data-bs-target] {
            background-color: var(--green-light);
            width: 12px; height: 12px;
            border-radius: 50%;
            border: none;
        }
        .carousel-control-prev-icon, .carousel-control-next-icon { filter: none; }
        .carousel-control-prev, .carousel-control-next {
            width: 50px; height: 50px;
            background: rgba(153,181,73,0.7);
            border-radius: 50%;
            top: 50%;
            transform: translateY(-50%);
        }

        /* ===== SECTION STYLES ===== */
        .section-title {
            font-family: 'Playfair Display', serif;
            font-size: 2.5rem;
            font-weight: 900;
            color: var(--green-dark);
            position: relative;
            display: inline-block;
            margin-bottom: 8px;
        }
        .section-title::after {
            content: '';
            display: block;
            height: 4px;
            width: 60%;
            background: var(--red);
            margin: 8px auto 0;
            border-radius: 4px;
        }
        .section-subtitle {
            color: #666;
            font-size: 1.05rem;
            max-width: 600px;
            margin: 0 auto 40px;
        }
        section { padding: 80px 0; }

        /* ===== A PROPOS ===== */
        #apropos { background: var(--green-dark); color: #fff; }
        #apropos .section-title { color: var(--green-light); }
        #apropos .section-title::after { background: var(--red); }
        .apropos-text { font-size: 1.1rem; line-height: 1.85; opacity: 0.93; }
        .apropos-badge {
            display: inline-block;
            background: var(--red);
            color: #fff;
            padding: 6px 18px;
            border-radius: 50px;
            font-size: 0.88rem;
            font-weight: 700;
            letter-spacing: 1px;
            margin-bottom: 16px;
            text-transform: uppercase;
        }
        .feature-icon {
            width: 52px; height: 52px;
            background: rgba(153,181,73,0.15);
            border: 2px solid var(--green-light);
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            font-size: 1.3rem;
            color: var(--green-light);
            margin-bottom: 12px;
        }

        /* ===== MENU GALLERY ===== */
        #menu { background: var(--cream); }
        .gallery-card { border-radius: 14px; overflow: hidden; box-shadow: 0 4px 18px rgba(0,0,0,0.12); }
        .gallery-img-wrap { position: relative; overflow: hidden; aspect-ratio: 1; }
        .gallery-img-wrap img {
            width: 100%; height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        .gallery-card:hover .gallery-img-wrap img { transform: scale(1.08); }
        .gallery-overlay {
            position: absolute;
            inset: 0;
            background: linear-gradient(to top, rgba(33,82,43,0.92) 0%, transparent 60%);
            display: flex; flex-direction: column;
            align-items: center; justify-content: flex-end;
            padding: 20px 16px;
            opacity: 0;
            transition: opacity 0.35s ease;
        }
        .gallery-card:hover .gallery-overlay { opacity: 1; }
        .dish-name { color: #fff; font-weight: 700; font-size: 1rem; margin-bottom: 10px; text-align: center; }
        .btn-order-gallery {
            background: #25D366;
            color: #fff !important;
            border: none;
            padding: 8px 20px;
            border-radius: 50px;
            font-weight: 700;
            font-size: 0.9rem;
            display: inline-flex; align-items: center; gap: 7px;
            text-decoration: none;
            transition: background 0.3s, transform 0.2s;
        }
        .btn-order-gallery:hover { background: #1ebe5a; transform: scale(1.05); }

        /* ===== CHEF ===== */
        #chef { background: #fff; }
        .chef-img-wrap {
            position: relative;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 12px 40px rgba(33,82,43,0.25);
            max-width: 420px;
            margin: 0 auto;
        }
        .chef-img-wrap img { width: 100%; display: block; }
        .chef-badge {
            position: absolute;
            bottom: 24px; left: 50%; transform: translateX(-50%);
            background: var(--red);
            color: #fff;
            padding: 10px 28px;
            border-radius: 50px;
            font-weight: 800;
            font-family: 'Playfair Display', serif;
            font-size: 1.15rem;
            white-space: nowrap;
            box-shadow: 0 4px 16px rgba(0,0,0,0.3);
        }
        .chef-quote {
            font-family: 'Playfair Display', serif;
            font-size: 1.35rem;
            color: var(--green-dark);
            font-style: italic;
            line-height: 1.6;
            border-left: 4px solid var(--red);
            padding-left: 20px;
            margin: 24px 0;
        }

        /* ===== COMMANDER ===== */
        #commander { background: var(--green-dark); color: #fff; }
        #commander .section-title { color: var(--green-light); }
        #commander .section-title::after { background: var(--red); }
        .contact-form {
            background: rgba(255,255,255,0.06);
            border-radius: 20px;
            padding: 40px;
            border: 1px solid rgba(153,181,73,0.25);
        }
        .form-control, .form-select {
            background: rgba(255,255,255,0.08);
            border: 1px solid rgba(153,181,73,0.3);
            color: #fff;
            border-radius: 10px;
            padding: 12px 16px;
        }
        .form-control:focus, .form-select:focus {
            background: rgba(255,255,255,0.12);
            border-color: var(--green-light);
            box-shadow: 0 0 0 3px rgba(153,181,73,0.2);
            color: #fff;
        }
        .form-control::placeholder { color: rgba(255,255,255,0.4); }
        .form-label { color: rgba(255,255,255,0.85); font-weight: 600; margin-bottom: 6px; }
        .form-select option { background: var(--green-dark); color: #fff; }
        .btn-submit {
            background: var(--red);
            color: #fff;
            border: none;
            padding: 14px 40px;
            border-radius: 50px;
            font-weight: 700;
            font-size: 1.05rem;
            transition: background 0.3s, transform 0.2s;
            width: 100%;
        }
        .btn-submit:hover { background: #a00f0e; transform: translateY(-2px); color: #fff; }

        /* ===== FLOATING WA BUTTON ===== */
        .wa-float {
            position: fixed;
            bottom: 28px; right: 28px;
            background: var(--green-light);
            color: #fff;
            width: 60px; height: 60px;
            border-radius: 50%;
            display: flex; align-items: center; justify-content: center;
            font-size: 1.7rem;
            text-decoration: none;
            box-shadow: 0 6px 24px rgba(153,181,73,0.55);
            z-index: 9999;
            transition: transform 0.3s, box-shadow 0.3s;
            animation: pulse-wa 2.5s infinite;
        }
        .wa-float:hover { transform: scale(1.12); box-shadow: 0 8px 30px rgba(153,181,73,0.7); color: #fff; }
        @keyframes pulse-wa {
            0%, 100% { box-shadow: 0 6px 24px rgba(153,181,73,0.55); }
            50% { box-shadow: 0 6px 32px rgba(153,181,73,0.85), 0 0 0 12px rgba(153,181,73,0.15); }
        }
        .wa-float-label {
            position: fixed;
            bottom: 36px; right: 96px;
            background: var(--green-dark);
            color: #fff;
            padding: 7px 16px;
            border-radius: 50px;
            font-size: 0.85rem;
            font-weight: 600;
            z-index: 9998;
            white-space: nowrap;
            box-shadow: 0 4px 16px rgba(0,0,0,0.25);
        }

        /* ===== FOOTER ===== */
        footer {
            background: #0d1f11;
            color: rgba(255,255,255,0.7);
            text-align: center;
            padding: 30px 20px;
            font-size: 0.9rem;
        }
        footer strong { color: var(--green-light); }

        /* ===== ALERTS ===== */
        .alert-success-custom {
            background: var(--green-light);
            color: var(--green-dark);
            border-radius: 10px;
            padding: 14px 20px;
            font-weight: 700;
            display: none;
            margin-top: 16px;
        }

        /* ===== RESPONSIVE ===== */
        @media (max-width: 768px) {
            .hero-content { padding: 30px 20px; }
            .contact-form { padding: 24px 18px; }
            .wa-float-label { display: none; }
        }
    
/* Menu and application */
section { scroll-margin-top: 95px; }
.menu-item { height:100%; background:#fff; padding:24px; border-radius:14px; border:1px solid #ddd8cf; display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center; }
.menu-item h3 { font-size:1.12rem; font-weight:800; margin:0; color:var(--green-dark); overflow-wrap:anywhere; }
.menu-item strong { color:var(--red); font-size:1.3rem; white-space:nowrap; }
.menu-order { grid-column:1 / -1; justify-self:start; color:var(--green-dark); font-weight:800; }
#application { background:#fff; }
#installApp { border:0; max-width:100%; font-size:1rem; justify-content:center; }
.install-help { max-width:620px; margin:24px auto 0; padding:20px; background:var(--cream); border-radius:14px; line-height:1.7; }
[hidden] { display:none !important; }
:focus-visible { outline:3px solid var(--gold); outline-offset:4px; }

/* App download button in the navigation, matching Commander. */
.navbar .nav-app-button {
    margin-top: 0;
    background: var(--red);
    border-radius: 50px;
    color: #fff !important;
    font-size: 0.95rem;
    padding: 12px 22px !important;
    justify-content: center;
    text-align: center;
    line-height: 1.5;
}
.navbar .nav-app-button:hover,
.navbar .nav-app-button:focus-visible {
    background: #a00f0e;
    color: #fff !important;
}
.navbar-nav { align-items: center; }
@media (max-width: 1199.98px) {
    .navbar-nav { align-items: stretch; }
    .navbar > .container { gap: 8px; }
    .navbar-brand { margin-right: 0; flex-shrink: 0; }
    .navbar-toggler { flex-shrink: 0; }
    .navbar .mobile-app-button {
        display: inline-flex;
        align-items: center;
        flex: 0 1 auto;
        min-width: 0;
        max-width: calc(100% - 138px);
        margin: 0 0 0 auto;
        padding: 10px 12px !important;
        font-size: 0.8rem;
        font-weight: 800;
        letter-spacing: 0;
        line-height: 1.25;
        text-decoration: none;
    }
}

.navbar-nav .nav-link.active:not(.nav-app-button) { color: #d3e6a2 !important; text-decoration: underline; text-underline-offset: 6px; }

/* Illustrated dish cards */
.menu-item { grid-template-columns:88px minmax(0,1fr) auto; gap:10px 14px; padding:18px; }
.dish-icon { width:88px; height:88px; border-radius:50%; object-fit:cover; grid-column:1; grid-row:1 / 3; background:var(--cream); }
.menu-item h3 { grid-column:2; grid-row:1; font-size:1.02rem; }
.menu-item strong { grid-column:3; grid-row:1; font-size:1.15rem; }
.menu-item .menu-order { grid-column:2 / -1; grid-row:2; background:var(--red); color:#fff; padding:7px 15px; font-size:.83rem; border-radius:50px; text-decoration:none; font-weight:700; }
.menu-item .menu-order:hover { background:#a00f0e; }
.menu-image-note { font-size:.8rem; color:#777; margin-top:-20px; }
#galerie { background:var(--cream); }
.gallery-photo { width:100%; padding:0; border:0; border-radius:14px; overflow:hidden; background:#fff; box-shadow:0 4px 18px #0002; cursor:zoom-in; }
.gallery-photo img { width:100%; height:auto; aspect-ratio:1; object-fit:cover; transition:transform .25s; }
.gallery-photo:hover img { transform:scale(1.04); }
.gallery-dialog { position:fixed; margin:auto; padding:46px 45px 16px; border:0; border-radius:16px; background:#102719; color:#fff; max-width:95vw; max-height:95dvh; text-align:center; }
.gallery-dialog::backdrop { background:#000c; }
#galleryFullImage { max-width:78vw; max-height:70dvh; object-fit:contain; display:block; }
.gallery-dialog button { position:absolute; border:0; background:#fff; color:#21522b; border-radius:50%; width:36px; height:36px; font-size:1.6rem; line-height:1; }
.gallery-close { top:6px; right:8px; }
.gallery-prev { top:50%; left:4px; }
.gallery-next { top:50%; right:4px; }
#galleryCounter { margin:12px 0 0; }
@media (max-width: 400px) { .menu-item { grid-template-columns:68px minmax(0,1fr) auto; padding:14px; gap:10px; } .dish-icon { width:68px; height:68px; } }

/* Combined story and Chef page: natural height prevents text overlap. */
.about-combined .about-chef-card { display:grid; grid-template-columns:38% minmax(0,1fr); background:#fff; color:#333; border-radius:18px; overflow:hidden; }
.about-chef-portrait { min-width:0; }
.about-chef-portrait img { display:block; width:100%; height:100%; min-height:300px; object-fit:cover; object-position:center top; }
.about-chef-intro { padding:22px 20px; min-width:0; overflow-wrap:anywhere; }
.about-chef-intro h1 { font-family:'Playfair Display',serif; font-size:1.7rem; font-weight:900; color:var(--green-dark); margin:0 0 20px; }
.about-chef-label { display:inline-block; background:var(--green-dark); color:#fff; padding:4px 9px; border-radius:20px; font-size:.62rem; font-weight:800; text-transform:uppercase; letter-spacing:.5px; }
.about-chef-intro h2 { font-family:'Playfair Display',serif; font-size:1.2rem; font-weight:900; line-height:1.3; color:var(--green-dark); margin:14px 0; }
.about-chef-intro blockquote { border-left:3px solid var(--red); padding-left:10px; font-family:'Playfair Display',serif; font-style:italic; color:var(--green-dark); font-size:.95rem; line-height:1.5; margin:0 0 14px; }
.about-chef-intro p { font-size:.88rem; line-height:1.65; margin:0; }
.about-read-more { margin-top:16px; }
.about-read-more summary { display:inline-flex; align-items:center; gap:10px; cursor:pointer; list-style:none; background:var(--red); border-radius:50px; color:#fff; padding:9px 22px; font-weight:800; }
.about-read-more summary::-webkit-details-marker { display:none; }
.about-read-more summary::after { content:'+'; font-size:1.2rem; }
.about-read-more[open] summary::after { content:'−'; }
.about-read-more .about-less, .about-read-more[open] .about-more { display:none; }
.about-read-more[open] .about-less { display:inline; }
.about-story { margin-top:20px; font-size:1rem; line-height:1.85; }
.about-story p { margin-bottom:16px; }
.about-story strong { color:#d3e6a2; }
.about-order { display:inline-flex; margin-top:4px; padding:10px 20px; border-radius:50px; background:var(--red); color:#fff; font-weight:700; text-decoration:none; }
.about-order:hover { background:#a00f0e; color:#fff; }
.about-feature { height:100%; }
.about-combined > .container > .row > .col-lg-6:last-child { padding-top:42px; }
@media (max-width:991.98px) { .about-combined > .container > .row > .col-lg-6:last-child { padding-top:0; } }
@media (max-width:575.98px) {
.about-combined .about-chef-card { grid-template-columns:1fr; }
.about-chef-portrait img { height:330px; min-height:0; object-fit:contain; background:#eee8e2; }
.about-chef-intro { padding:24px; }
}

/* Multiple dish ordering */
.quantity-control { display:inline-flex; align-items:center; gap:5px; }
.quantity-control button { width:32px; height:32px; border:1px solid #99b549; border-radius:50%; background:#fff; color:#21522b; font-size:1.15rem; font-weight:800; line-height:1; }
.quantity-control input { width:46px; min-width:0; height:34px; border:1px solid #99b549; border-radius:8px; text-align:center; background:#fff; color:#21522b; font-weight:800; appearance:textfield; -moz-appearance:textfield; }
.quantity-control input::-webkit-inner-spin-button { -webkit-appearance:none; }
.menu-item .quantity-control { grid-column:2 / -1; grid-row:2; }
.menu-item .menu-order { grid-row:3; }
.menu-item .dish-icon { grid-row:1 / 4; }
.menu-cart-bar { margin-top:30px; padding:24px; border:1px solid #99b549; border-radius:16px; background:#fff; text-align:center; }
.menu-cart-bar .hero-cta { margin-top:8px; font-size:.95rem; }
.menu-cart-bar [data-cart-feedback] { margin-top:12px; font-size:.9rem; }
.order-picker { border:0; padding:0; margin:0; min-width:0; }
.order-picker legend { float:none; width:auto; font-size:1.05rem; }
.order-picker > p { font-size:.88rem; color:#fff; }
.order-dish { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 0; border-bottom:1px solid #ffffff30; }
.order-dish > span { min-width:0; overflow-wrap:anywhere; font-size:.92rem; }
.order-dish small { display:block; font-size:.8rem; color:#d3e6a2; }
.order-dish .quantity-control { flex-shrink:0; }
.order-review { margin-top:24px; background:#ffffff12; border:1px solid #99b549; padding:18px; border-radius:12px; }
.order-review h3 { font-size:1.15rem; }
.order-review ul { padding-left:20px; margin:12px 0; line-height:1.8; }
.order-review p { margin:12px 0 4px; }
.order-review small { color:#e2e8dc; }
.cart-error { margin-top:16px; color:#fff; border:1px solid #ffb6b6; padding:12px; border-radius:10px; background:#7b1818; }
#whatsappRetry { color:#21522b; text-decoration:underline; font-weight:800; }