body{
    background:
        radial-gradient(circle at top left, var(--theme-page-glow-a), transparent 28%),
        radial-gradient(circle at top right, var(--theme-page-glow-b), transparent 26%),
        linear-gradient(180deg, var(--theme-page-bg-start) 0%, var(--theme-page-bg-mid) 45%, var(--theme-page-bg-end) 100%);
    color:var(--theme-text-main);
}

html{
    scroll-behavior:smooth;
}

.truck-hero{
    position:relative;
    overflow:hidden;
    background:
        linear-gradient(155deg, rgba(0,20,10,.86) 0%, rgba(0,80,40,.55) 52%, rgba(140,10,25,.45) 100%),
        url("../img/hero-bg.jpg") center/cover no-repeat;
    color:#fff;
}

.truck-hero::before,
.truck-hero::after{
    content:"";
    position:absolute;
    border-radius:999px;
    opacity:.18;
}

.truck-hero::before{
    width:320px;
    height:320px;
    background:#006847;
    top:-80px;
    right:-90px;
}

.truck-hero::after{
    width:240px;
    height:240px;
    background:#C41230;
    bottom:-100px;
    left:-80px;
}

.truck-shell{
    position:relative;
    z-index:3;
}

.truck-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.2);
    font-size:.92rem;
    text-transform:uppercase;
    letter-spacing:.08em;
}

.truck-eyebrow{
    color:#4db87a;
    font-size:.95rem;
    font-weight:800;
    letter-spacing:.34em;
    text-transform:uppercase;
}

.truck-hero h1{
    color:#ffffff;
    font-size:clamp(2.4rem, 6vw, 4.9rem);
    line-height:.95;
    max-width:11ch;
}

.truck-slogan{
    color:#ffffff;
    font-size:clamp(1.15rem, 2vw, 1.45rem);
    font-weight:700;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.truck-hero-copy{
    color:rgba(255,255,255,.84);
    font-size:1.08rem;
    max-width:560px;
}

.truck-hero-copy-col{
    position:relative;
}

.truck-hero-brand-art{
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%, -50%);
    z-index:5;
    pointer-events:none;
}

.truck-hero-brand-frame{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transform:rotate(-7deg);
}

.truck-hero-brand-logo{
    width:clamp(260px, 27vw, 410px);
    height:auto;
    object-fit:contain;
    filter:drop-shadow(0 22px 38px rgba(0,0,0,.28));
}

.truck-hero-stage{
    position:relative;
    min-height:430px;
    border-radius:36px;
    background:
        radial-gradient(circle at center, rgba(0,104,71,.18) 0%, rgba(0,104,71,.04) 38%, transparent 66%),
        linear-gradient(180deg, rgba(0,20,10,.22) 0%, rgba(0,10,5,.32) 100%);
    border:1px solid rgba(0,104,71,.28);
    overflow:hidden;
}

.truck-hero-glow{
    position:absolute;
    border-radius:999px;
    filter:blur(28px);
    opacity:.62;
}

.truck-hero-glow-a{
    width:180px;
    height:180px;
    top:18px;
    left:42px;
    background:rgba(0,180,90,.3);
}

.truck-hero-glow-b{
    width:220px;
    height:220px;
    right:20px;
    bottom:34px;
    background:rgba(196,18,48,.2);
}

.hero-product{
    position:absolute;
    object-fit:contain;
    object-position:center;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.32));
    transition:transform .28s ease;
    pointer-events:none;
}

.truck-hero:hover .hero-product-main{
    transform:translateY(-6px) rotate(-2deg);
}

.truck-hero:hover .hero-product-right{
    transform:translateY(-4px) rotate(6deg);
}

.truck-hero:hover .hero-product-left{
    transform:translateY(-4px) rotate(-8deg);
}

.hero-product-main{
    width:clamp(230px, 26vw, 430px);
    right:-4vw;
    top:13%;
    z-index:2;
    opacity:.96;
}

.hero-product-right{
    width:clamp(170px, 16vw, 280px);
    left:-4vw;
    bottom:10%;
    z-index:4;
}

.hero-product-left{
    display:none;
}

.section-showcase{
    position:relative;
    overflow:hidden;
}

.section-showcase-grid{
    position:relative;
    min-height:420px;
    border-radius:34px;
    background:
        radial-gradient(circle at 30% 30%, rgba(255,215,138,.16), transparent 32%),
        linear-gradient(180deg, rgba(11,7,4,.08) 0%, rgba(11,7,4,.18) 100%);
    border:1px solid var(--theme-border-soft);
}

.section-product{
    position:absolute;
    object-fit:contain;
    object-position:center;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.24));
}

.section-product-about-main{
    width:min(56%, 290px);
    right:8%;
    top:8%;
    z-index:3;
}

.section-product-about-side{
    width:min(48%, 250px);
    left:2%;
    bottom:2%;
    z-index:2;
    transform:rotate(-10deg);
}

.section-product-contact-main{
    width:min(48%, 220px);
    right:6%;
    top:10%;
    z-index:3;
}

.section-product-contact-accent{
    width:min(42%, 180px);
    left:5%;
    top:7%;
    z-index:2;
    transform:rotate(-8deg);
}

.section-product-contact-wide{
    width:min(72%, 340px);
    left:12%;
    bottom:4%;
    z-index:1;
}

.truck-hero-card,
.truck-panel,
.menu-card,
.day-card{
    border:0;
    border-radius:28px;
    box-shadow:var(--theme-shadow);
}

.truck-hero-card{
    background:var(--theme-surface-glass);
    color:var(--theme-panel-text);
    backdrop-filter:blur(12px);
}

.truck-stat{
    background:var(--theme-stat-bg);
    border-radius:22px;
    padding:18px;
    height:100%;
}

.truck-stat small{
    display:block;
    color:var(--theme-stat-small);
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:8px;
}

.truck-stat strong{
    color:var(--theme-stat-strong);
    font-size:1.1rem;
}

.truck-section{
    padding:72px 0;
}

.truck-kicker{
    display:inline-block;
    color:var(--theme-kicker);
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.08em;
    margin-bottom:14px;
}

.truck-divider-art{
    position:relative;
    height:148px;
    margin:-52px auto 20px;
    pointer-events:none;
}

.truck-divider-product{
    position:absolute;
    left:50%;
    top:50%;
    width:min(62vw, 560px);
    transform:translate(-50%, -50%) rotate(-3deg);
    object-fit:contain;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.28));
    opacity:.96;
}

.truck-panel{
    background:var(--theme-surface);
    color:var(--theme-panel-text);
    padding:28px;
}

.truck-location-box{
    background:
        linear-gradient(180deg, var(--theme-surface-overlay-top) 0%, var(--theme-surface-overlay-bottom) 100%);
    border:1px solid var(--theme-border-soft);
}

.location-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border-radius:999px;
    background:var(--theme-pill-bg);
    color:var(--theme-pill-text);
    font-weight:700;
}

.day-card{
    background:var(--theme-surface-2);
    padding:22px;
    height:100%;
    color:var(--theme-panel-text);
    border:1px solid var(--theme-border-soft);
}

.day-card.is-today{
    background:var(--theme-day-today-bg);
    color:var(--theme-day-today-text);
}

.day-card.is-today h3,
.day-card.is-today p,
.day-card.is-today small{
    color:var(--theme-day-today-text);
}

.menu-card{
    background:var(--theme-surface-2);
    color:var(--theme-panel-text);
    padding:28px;
    height:100%;
    position:relative;
    z-index:1;
}

.menu-stage{
    position:relative;
}

.menu-decor{
    position:absolute;
    object-fit:contain;
    pointer-events:none;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.24));
    z-index:0;
}

.menu-decor-left{
    width:min(20vw, 240px);
    left:-180px;
    top:96px;
    transform:rotate(-16deg);
}

.menu-decor-right{
    width:min(18vw, 210px);
    right:-140px;
    top:210px;
    transform:rotate(12deg);
}

.menu-card-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:14px;
    margin-bottom:18px;
}

.menu-card h3{
    margin-bottom:4px;
}

.menu-list{
    list-style:none;
    margin:0;
    padding:0;
}

.menu-list li{
    padding:16px 0;
    border-top:1px solid var(--theme-border-soft);
}

.menu-list li:first-child{
    border-top:0;
    padding-top:0;
}

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

.menu-item-price{
    flex:0 0 auto;
    padding:5px 10px;
    border-radius:999px;
    background:var(--theme-price-bg);
    color:var(--theme-price-text);
    font-weight:800;
}

.menu-note{
    margin-top:18px;
    padding-top:18px;
    border-top:1px dashed var(--theme-note-border);
    color:var(--theme-note-text);
}

.truck-cta{
    background:var(--theme-surface-3);
    color:var(--theme-panel-text);
}

.truck-cta h2,
.truck-cta p{
    color:var(--theme-panel-text);
}

.truck-link{
    color:var(--theme-link);
    text-decoration:none;
}

.truck-link:hover{
    color:var(--theme-link-hover);
}

.text-muted{
    color:var(--theme-text-muted)!important;
}

h1{
    color:var(--theme-heading);
}

h2,h3,h4,h5{
    color:var(--theme-heading);
}

@media (max-width:768px){
    .truck-section{
        padding:56px 0;
    }

    .truck-hero{
        background:
            linear-gradient(180deg, rgba(0,20,10,.88) 0%, rgba(0,60,30,.6) 52%, rgba(120,8,20,.45) 100%),
            url("../img/hero-bg.jpg") center/cover no-repeat;
        text-align:center;
    }

    .truck-eyebrow{
        letter-spacing:.24em;
    }

    .truck-hero h1{
        margin-left:auto;
        margin-right:auto;
    }

    .truck-hero-copy{
        margin-left:auto;
        margin-right:auto;
    }

    .truck-hero-stage{
        min-height:330px;
        margin-top:8px;
    }

    .hero-product-main{
        width:min(44vw, 190px);
        right:-16vw;
        top:16%;
    }

    .hero-product-right{
        width:min(34vw, 150px);
        left:-15vw;
        bottom:17%;
    }

    .hero-product-left{
        display:none;
    }

    .truck-hero-brand-art{
        left:50%;
        top:50%;
        transform:translate(-50%, -50%);
    }

    .truck-hero-brand-frame{
        transform:rotate(-5deg);
    }

    .truck-hero-brand-logo{
        width:min(66vw, 270px);
    }

    .section-showcase-grid{
        min-height:320px;
        margin-top:6px;
    }

    .truck-divider-art{
        height:96px;
        margin:-28px auto 18px;
    }

    .truck-divider-product{
        width:min(72vw, 320px);
    }

    .section-product-about-main{
        width:min(52%, 190px);
        right:6%;
        top:8%;
    }

    .section-product-about-side{
        width:min(46%, 180px);
        left:3%;
        bottom:3%;
    }

    .section-product-contact-main{
        width:min(44%, 170px);
        right:6%;
        top:10%;
    }

    .section-product-contact-accent{
        width:min(38%, 130px);
        left:6%;
        top:8%;
    }

    .section-product-contact-wide{
        width:min(74%, 260px);
        left:13%;
        bottom:4%;
    }

    .menu-decor{
        opacity:.88;
    }

    .menu-decor-left{
        width:120px;
        left:-14px;
        top:-30px;
        transform:rotate(-18deg);
    }

    .menu-decor-right{
        width:112px;
        right:-8px;
        top:100px;
        transform:rotate(10deg);
    }

    .menu-item-row{
        flex-direction:column;
        gap:8px;
    }
}

/* ==============================
   HOVER ANIMATIONS (interactividad)
============================== */

.truck-panel{
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.truck-panel:hover{
    transform:translateY(-4px);
    box-shadow:0 28px 56px rgba(0,0,0,.32);
}

.menu-card{
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.menu-card:hover{
    transform:translateY(-6px);
    box-shadow:0 32px 64px rgba(0,0,0,.28);
    border:1px solid rgba(0,104,71,.3);
}

.day-card{
    transition:transform .2s ease, border-color .2s ease;
}
.day-card:hover:not(.is-today){
    transform:translateY(-3px);
    border-color:rgba(0,104,71,.3);
}

.gallery-media-wrapper{
    transition:box-shadow .25s ease;
}
.gallery-item:hover .gallery-media-wrapper{
    box-shadow:0 12px 32px rgba(0,0,0,.3);
}
.gallery-media-wrapper img,
.gallery-media-wrapper video{
    transition:transform .35s ease;
}
.gallery-item:hover .gallery-media-wrapper img,
.gallery-item:hover .gallery-media-wrapper video{
    transform:scale(1.07);
}

/* ==============================
   SLIDER COMO FONDO DE SECCIÓN
============================== */

.lj-section-slider-wrap{
    position:relative;
    overflow:hidden;
}

.lj-slider-overlay{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    z-index:10;
    pointer-events:none;
    background:linear-gradient(0deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.45) 55%, transparent 100%);
    padding:60px 0 40px;
}

.lj-slider-overlay .lj-overlay-content{
    pointer-events:auto;
}

.lj-slider-overlay h2{
    color:#fff;
}

.lj-slider-overlay p{
    color:rgba(255,255,255,.82);
}

.lj-section-slider-wrap .carousel-control-prev,
.lj-section-slider-wrap .carousel-control-next{
    z-index:15;
}

/* ==============================
   EVENTS CARDS
============================== */

.lj-event-card{
    background:var(--theme-surface-2);
    border:1px solid var(--theme-border-soft);
    border-radius:24px;
    padding:32px 24px;
    height:100%;
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.lj-event-card:hover{
    transform:translateY(-6px);
    box-shadow:0 24px 48px rgba(0,0,0,.22);
    border-color:rgba(0,104,71,.35);
}

.lj-event-day{
    display:inline-block;
    padding:4px 14px;
    border-radius:999px;
    font-size:.8rem;
    font-weight:800;
    text-transform:uppercase;
    letter-spacing:.12em;
    background:var(--theme-pill-bg);
    color:var(--theme-pill-text);
    margin-bottom:16px;
}

.lj-event-icon{
    font-size:2.4rem;
    margin-bottom:12px;
    display:block;
}

.lj-event-time{
    font-size:.88rem;
    color:var(--theme-text-muted);
    font-weight:600;
    margin-top:8px;
}

/* ==============================
   HERO PHOTOS (layout restaurante)
============================== */

.lj-hero-photos{
    position:relative;
    padding-bottom:40px;
}

.lj-hero-photo-main{
    width:82%;
    border-radius:22px;
    margin-left:auto;
    display:block;
    object-fit:cover;
    height:320px;
    box-shadow:0 24px 48px rgba(0,0,0,.45);
    border:2px solid rgba(0,104,71,.4);
}

.lj-hero-photo-side{
    width:56%;
    border-radius:18px;
    position:absolute;
    bottom:0;
    left:0;
    object-fit:cover;
    height:200px;
    box-shadow:0 16px 36px rgba(0,0,0,.5);
    border:2px solid rgba(196,18,48,.35);
}

/* ==============================
   PANADERÍA SECTION
============================== */

.lj-panaderia{
    background:var(--theme-surface);
}

.lj-photo-grid .lj-grid-img{
    width:100%;
    height:180px;
    object-fit:cover;
    border-radius:16px;
    display:block;
    transition:transform .25s ease;
}

.lj-photo-grid .lj-grid-img:hover{
    transform:scale(1.03);
}

/* ==============================
   BARRA SECTION
============================== */

.lj-barra{
    background:var(--theme-surface-2);
}

.lj-barra-panel{
    background:linear-gradient(135deg, #060f06 0%, #0d1a0d 50%, #1a0608 100%);
    border-radius:32px;
    padding:48px;
    border:1px solid rgba(196,18,48,.2);
}

.lj-barra .lj-grid-img{
    width:100%;
    object-fit:cover;
    border-radius:14px;
    display:block;
}

.lj-barra-stat{
    background:rgba(255,255,255,.06);
    border:1px solid rgba(255,255,255,.1);
    border-radius:16px;
    padding:16px;
}

.lj-barra-stat small{
    display:block;
    color:rgba(255,255,255,.5);
    text-transform:uppercase;
    letter-spacing:.08em;
    font-size:.78rem;
    margin-bottom:6px;
}

.lj-barra-stat strong{
    color:#ffffff;
    font-size:1rem;
}

/* ==============================
   BOTONES MEXICANOS
============================== */

.lj-btn-green{
    background:#006847;
    color:#fff;
    border:none;
}

.lj-btn-green:hover{
    background:#004d35;
    color:#fff;
}

.lj-btn-red{
    background:#C41230;
    color:#fff;
    border:none;
}

.lj-btn-red:hover{
    background:#9a0e26;
    color:#fff;
}

/* ==============================
   BARRA PAGE HERO
============================== */

.lj-barra-hero{
    position:relative;
    overflow:hidden;
    background:
        linear-gradient(155deg, rgba(80,5,15,.88) 0%, rgba(30,5,5,.7) 52%, rgba(0,20,10,.6) 100%),
        url("../img/barra/gente-sentada-en-la-barra-001.jpg") center/cover no-repeat;
    color:#fff;
}

.lj-barra-hero .truck-eyebrow{
    color:#ff6b6b;
}

@media(max-width:768px){
    .lj-barra-hero{
        text-align:center;
    }
}

@media(max-width:768px){
    .lj-barra-panel{
        padding:28px 20px;
    }

    .lj-hero-photo-main{
        width:100%;
        height:240px;
    }

    .lj-hero-photo-side{
        display:none;
    }
}

/* ==============================
   MENU PAGE CARDS
============================== */

.lj-menu-card{
    display:block;
    text-decoration:none;
    border-radius:20px;
    overflow:hidden;
    background:var(--theme-surface);
    border:1px solid var(--theme-border-soft);
    box-shadow:var(--theme-shadow);
    transition:transform .22s ease, box-shadow .22s ease;
    height:100%;
}

.lj-menu-card:hover{
    transform:translateY(-5px);
    box-shadow:0 24px 48px rgba(0,0,0,.28);
}

.lj-menu-card-img{
    aspect-ratio:4/3;
    overflow:hidden;
}

.lj-menu-card-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .35s ease;
}

.lj-menu-card:hover .lj-menu-card-img img{
    transform:scale(1.06);
}

.lj-menu-card-body{
    padding:14px 16px 16px;
}

.lj-menu-card-name{
    font-weight:700;
    font-size:.97rem;
    color:var(--theme-heading);
    margin-bottom:4px;
}

.lj-menu-card-desc{
    font-size:.82rem;
    color:var(--theme-text-muted);
    line-height:1.4;
    margin-bottom:10px;
}

.lj-menu-card-cta{
    display:inline-block;
    font-size:.82rem;
    font-weight:700;
    color:#006847;
    transition:color .18s;
}

.lj-menu-card:hover .lj-menu-card-cta{
    color:#004d35;
}