:root{
    --bg:#1B1611;
    --surface:#241D17;
    --surface-2:#2E2419;
    --flame:#E8542E;
    --mustard:#F4A625;
    --cream:#F5EFE6;
    --muted:#B8A99A;
    --line: rgba(245,239,230,0.12);
  }

  *{ box-sizing:border-box; margin:0; padding:0; }

  html{ scroll-behavior:smooth; }

  body{
    background:var(--bg);
    color:var(--cream);
    font-family:'Work Sans', sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }

  h1,h2,h3, .display{
    font-family:'Anton', sans-serif;
    font-weight:400;
    text-transform:uppercase;
    letter-spacing:0.02em;
    line-height:0.95;
  }

  a{ color:inherit; text-decoration:none; }
  ul{ list-style:none; }
  img{ max-width:100%; display:block; }

  .wrap{
    max-width:1140px;
    margin:0 auto;
    padding:0 28px;
  }

  /* ---------- NAV ---------- */
  .nav{
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(27,22,17,0.85);
    backdrop-filter:blur(8px);
    border-bottom:1px solid transparent;
    transition:border-color .3s ease, box-shadow .3s ease;
  }
  .nav.scrolled{
    border-bottom-color:var(--line);
    box-shadow:0 8px 24px rgba(0,0,0,0.35);
  }
  .nav-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:16px 28px;
    max-width:1140px;
    margin:0 auto;
  }
  .brand{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:'Anton', sans-serif;
    font-size:1.4rem;
    letter-spacing:0.03em;
  }
  .brand-mark{
    width:34px; height:34px;
    border-radius:50%;
    background:var(--flame);
    display:flex; align-items:center; justify-content:center;
    color:var(--bg);
    font-family:'Anton', sans-serif;
    font-size:1.1rem;
    box-shadow:0 0 0 3px var(--mustard);
  }
  .nav-links{
    display:flex;
    gap:32px;
    font-weight:600;
    font-size:0.95rem;
    text-transform:uppercase;
    letter-spacing:0.06em;
  }
  .nav-links a{
    position:relative;
    padding:6px 0;
    color:var(--muted);
    transition:color .2s ease;
  }
  .nav-links a:hover, .nav-links a:focus-visible{ color:var(--cream); }
  .nav-links a.active{ color:var(--flame); }
  .nav-links a::after{
    content:"";
    position:absolute; left:0; bottom:0;
    width:0; height:2px;
    background:var(--flame);
    transition:width .25s ease;
  }
  .nav-links a:hover::after, .nav-links a:focus-visible::after{ width:100%; }
  .nav-links a.active::after{ width:100%; }

  .nav-cta{
    background:var(--mustard);
    color:var(--bg);
    font-weight:700;
    padding:10px 20px;
    border-radius:999px;
    font-size:0.85rem;
    text-transform:uppercase;
    letter-spacing:0.05em;
    transition:transform .2s ease, background .2s ease;
  }
  .nav-cta:hover{ background:var(--flame); color:var(--cream); transform:translateY(-2px); }

  .menu-toggle{ display:none; }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding:96px 0 110px;
    overflow:hidden;
    background:
      radial-gradient(circle at 82% 18%, rgba(232,84,46,0.25), transparent 45%),
      radial-gradient(circle at 10% 85%, rgba(244,166,37,0.16), transparent 40%);
  }
  .hero-inner{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:48px;
    align-items:center;
  }

  /* ---------- MINI HAMBURGUESAS FLOTANTES ---------- */
  .hero-burgers{
    position:absolute;
    inset:0;
    z-index:1;
    overflow:hidden;
    pointer-events:none;
  }
  .floating-burger{
    position:absolute;
    bottom:-80px;
    display:inline-block;
    line-height:1;
    filter:drop-shadow(0 8px 14px rgba(0,0,0,0.45));
    animation-name:burgerFloat;
    animation-timing-function:ease-in-out;
    animation-iteration-count:infinite;
    will-change:transform, opacity;
  }
  @keyframes burgerFloat{
    0%   { transform:translate(0, 0) rotate(0deg) scale(1); opacity:0; }
    8%   { opacity:0.6; }
    30%  { transform:translate(26px, -190px) rotate(90deg) scale(1.05); }
    50%  { transform:translate(-22px, -360px) rotate(180deg) scale(0.95); }
    70%  { transform:translate(30px, -530px) rotate(270deg) scale(1.05); }
    92%  { opacity:0.55; }
    100% { transform:translate(-16px, -700px) rotate(360deg) scale(1); opacity:0; }
  }

  .b1  { left:4%;  font-size:1.6rem; animation-duration:16s; animation-delay:0s; }
  .b2  { left:14%; font-size:1.1rem; animation-duration:12s; animation-delay:2s; }
  .b3  { left:23%; font-size:2rem;   animation-duration:19s; animation-delay:5s; }
  .b4  { left:33%; font-size:1.3rem; animation-duration:14s; animation-delay:1s; }
  .b5  { left:44%; font-size:1.8rem; animation-duration:17s; animation-delay:7s; }
  .b6  { left:54%; font-size:1.2rem; animation-duration:13s; animation-delay:3s; }
  .b7  { left:64%; font-size:2.1rem; animation-duration:20s; animation-delay:6s; }
  .b8  { left:73%; font-size:1.4rem; animation-duration:15s; animation-delay:4s; }
  .b9  { left:82%; font-size:1.7rem; animation-duration:18s; animation-delay:0.5s; }
  .b10 { left:90%; font-size:1.1rem; animation-duration:11s; animation-delay:8s; }
  .b11 { left:58%; font-size:1.5rem; animation-duration:16.5s; animation-delay:9s; }
  .b12 { left:8%;  font-size:1.2rem; animation-duration:14.5s; animation-delay:10s; }

  @media (max-width: 640px){
    .floating-burger{ font-size:1rem !important; }
  }
  .eyebrow{
    
    align-items:center;
    gap:10px;
    color:var(--mustard);
    font-weight:700;
    letter-spacing:0.16em;
    text-transform:uppercase;
    font-size:0.78rem;
    margin-bottom:22px;
  }
  .eyebrow::before{
    content:"";
    width:22px; height:2px;
    background:var(--mustard);
  }
  .hero h1{
    font-size:clamp(3.2rem, 8vw, 6rem);
    color:var(--cream);
  }
  .hero h1 span{
    color:var(--flame);
    position:relative;
    display:inline-block;
  }
  .hero h1 span::after{
    content:"";
    position:absolute;
    left:-2%; right:-2%; bottom:-6px;
    height:10px;
    background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='16' viewBox='0 0 200 16'%3E%3Cpath d='M0 8 Q 10 0, 20 8 T 40 8 T 60 8 T 80 8 T 100 8 T 120 8 T 140 8 T 160 8 T 180 8 T 200 8' fill='none' stroke='%23F4A625' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") repeat-x;
    background-size:40px 10px;
  }
  .hero p.lead{
    margin-top:26px;
    max-width:46ch;
    color:var(--muted);
    font-size:1.08rem;
  }
  .hero-actions{
    margin-top:36px;
    display:flex;
    gap:16px;
    flex-wrap:wrap;
  }
  .btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:15px 28px;
    border-radius:999px;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.05em;
    font-size:0.88rem;
    transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
  }
  .btn-primary{
    background:var(--flame);
    color:var(--cream);
    box-shadow:0 10px 24px rgba(232,84,46,0.35);
  }
  .btn-primary:hover{ transform:translateY(-3px); box-shadow:0 14px 30px rgba(232,84,46,0.45); }
  .btn-ghost{
    border:1.5px solid var(--line);
    color:var(--cream);
  }
  .btn-ghost:hover{ border-color:var(--mustard); color:var(--mustard); }

  .hero-stats{
    display:flex;
    gap:30px;
    margin-top:52px;
    flex-wrap:wrap;
  }
  .stat b{
    font-family:'Anton', sans-serif;
    font-size:1.9rem;
    color:var(--mustard);
    display:block;
  }
  .stat span{
    color:var(--muted);
    font-size:0.82rem;
    text-transform:uppercase;
    letter-spacing:0.06em;
  }

  /* Signature: capas de hamburguesa apiladas en CSS */
  .burger-stack{
    position:relative;
    width:100%;
    max-width:360px;
    margin:0 auto;
    display:flex;
    flex-direction:column;
    align-items:center;
    filter:drop-shadow(0 30px 40px rgba(0,0,0,0.45));
  }
  .layer{
    width:100%;
    height:46px;
    margin-top:-14px;
    position:relative;
    animation:settle .7s ease both;
  }
  .layer:first-child{ margin-top:0; }
  .layer.bun-top{
    height:88px;
    background:linear-gradient(180deg, var(--mustard), #C97E14);
    border-radius:180px 180px 20px 20px;
    z-index:9;
  }
  .layer.bun-top::before{
    content:"";
    position:absolute;
    top:18px; left:20%;
    width:8px; height:8px;
    border-radius:50%;
    background:var(--cream);
    box-shadow:36px 6px 0 var(--cream), 72px -4px 0 var(--cream), 108px 10px 0 var(--cream), -18px 12px 0 var(--cream), 144px 2px 0 var(--cream);
    opacity:0.85;
  }
  .layer.lettuce{ background:#7CA24A; border-radius:6px; z-index:8; clip-path:polygon(0 30%,5% 0,12% 40%,20% 5%,30% 45%,40% 0,50% 40%,60% 5%,70% 45%,80% 0,88% 40%,95% 5%,100% 30%,100% 100%,0 100%); }
  .layer.cheese{ background:linear-gradient(180deg,#F4C94A,#E8A62E); z-index:7; clip-path:polygon(0 0,100% 0,92% 100%,84% 40%,76% 100%,68% 40%,60% 100%,52% 40%,44% 100%,36% 40%,28% 100%,20% 40%,12% 100%,4% 40%,0 60%); height:38px; }
  .layer.patty{ background:linear-gradient(180deg,#5B3A28,#3E271A); border-radius:14px; z-index:6; height:40px; }
  .layer.tomato{ background:repeating-radial-gradient(circle at 50% 50%, #D64B3B 0 6px, #B8392B 6px 8px); border-radius:10px; z-index:5; height:20px; }
  .layer.bun-bottom{
    height:60px;
    background:linear-gradient(180deg,#C97E14,#9C5F0E);
    border-radius:20px 20px 90px 90px;
    z-index:4;
  }
  @keyframes settle{
    from{ opacity:0; transform:translateY(-18px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .layer:nth-child(1){ animation-delay:.05s; }
  .layer:nth-child(2){ animation-delay:.15s; }
  .layer:nth-child(3){ animation-delay:.25s; }
  .layer:nth-child(4){ animation-delay:.35s; }
  .layer:nth-child(5){ animation-delay:.45s; }
  .layer:nth-child(6){ animation-delay:.55s; }

  /* ---------- SECTION generic ---------- */
  section{ padding:100px 0; }
  .section-head{
    max-width:640px;
    margin-bottom:56px;
  }
  .section-head .eyebrow{ margin-bottom:14px; } 
  .section-head h2{
    font-size:clamp(2.2rem, 4.5vw, 3.2rem);
    color:var(--cream);
  }
  .section-head p{
    margin-top:16px;
    color:var(--muted);
    font-size:1.02rem;
    max-width:52ch;
  }

  /* ---------- BANNER QUIENES SOMOS ---------- */
  .somos-banner{
    position:relative;
    width:100%;
    height:clamp(280px, 35vw, 500px);
    overflow:hidden;
  }

  .somos-banner img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center 32%;
    display:block;
    transform:scale(1.01);
  }

  .somos-banner-overlay{
    position:absolute;
    inset:0;
    background:
      linear-gradient(to bottom, rgba(27,22,17,0.08) 0%, rgba(27,22,17,0.25) 45%, rgba(36,29,23,0.85) 82%, var(--surface) 100%),
      linear-gradient(to right, rgba(27,22,17,0.10), transparent 35%, rgba(27,22,17,0.10));
    pointer-events:none;
  }

  /* ---------- QUIENES SOMOS ---------- */
  .somos{
    position:relative;
    padding-top: 0px;
    overflow:hidden;
    background:var(--surface);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .somos-grid{
    position:relative;
    z-index:2;
    display:grid;
    place-items:center;
    text-align:center;
  }
  .somos-copy{ max-width:70ch; }
  .somos-copy p{ color:var(--muted); margin-bottom:18px; max-width:56ch; margin-left:auto; margin-right:auto; }
  .somos-list{ margin-top:28px; display:grid; gap:16px; }
  .somos-list li{
    display:flex;
    gap:14px;
    align-items:flex-start;
    color:var(--cream);
    font-weight:500;
  }
  .somos-list .dot{
    flex:none;
    width:8px; height:8px;
    border-radius:50%;
    background:var(--flame);
    margin-top:8px;
  }

  /* ---------- PAPAS FLOTANTES (QUIENES SOMOS) ---------- */
  .somos-fries{
    position:absolute;
    inset:0;
    z-index:1;
    overflow:hidden;
    pointer-events:none;
  }
  .floating-fries{
    position:absolute;
    bottom:-80px;
    display:inline-block;
    line-height:1;
    filter:drop-shadow(0 8px 14px rgba(0,0,0,0.45));
    animation-name:friesFloat;
    animation-timing-function:ease-in-out;
    animation-iteration-count:infinite;
    will-change:transform, opacity;
  }
  @keyframes friesFloat{
    0%   { transform:translate(0, 0) rotate(0deg) scale(1); opacity:0; }
    8%   { opacity:0.55; }
    30%  { transform:translate(-24px, -160px) rotate(-90deg) scale(1.05); }
    50%  { transform:translate(20px, -310px) rotate(-180deg) scale(0.95); }
    70%  { transform:translate(-28px, -460px) rotate(-270deg) scale(1.05); }
    92%  { opacity:0.5; }
    100% { transform:translate(14px, -610px) rotate(-360deg) scale(1); opacity:0; }
  }

  .f1  { left:6%;  font-size:1.5rem; animation-duration:15s; animation-delay:0.5s; }
  .f2  { left:16%; font-size:1.1rem; animation-duration:12s; animation-delay:3s; }
  .f3  { left:26%; font-size:1.9rem; animation-duration:18s; animation-delay:6s; }
  .f4  { left:37%; font-size:1.2rem; animation-duration:13.5s; animation-delay:1.5s; }
  .f5  { left:48%; font-size:1.7rem; animation-duration:16.5s; animation-delay:8s; }
  .f6  { left:59%; font-size:1.1rem; animation-duration:12.5s; animation-delay:4s; }
  .f7  { left:69%; font-size:2rem;   animation-duration:19s; animation-delay:2s; }
  .f8  { left:79%; font-size:1.3rem; animation-duration:14s; animation-delay:7s; }
  .f9  { left:89%; font-size:1.6rem; animation-duration:17s; animation-delay:9.5s; }
  .f10 { left:94%; font-size:1rem;   animation-duration:11s; animation-delay:5.5s; }

  @media (max-width: 640px){
    .somos-banner{
      height:280px;
    }

    .somos-banner img{
      object-position:center center;
    }

    .floating-fries{ font-size:1rem !important; }
  }

  /* ---------- CATALOGO ---------- */
  .cat-tabs-label{
    display:inline-block;
    font-size:0.78rem;
    font-weight:700;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--mustard);
    border:1px solid rgba(244,166,37,0.4);
    padding:6px 14px;
    border-radius:999px;
    margin-bottom:14px;
  }
  .cat-group{ margin-bottom:64px; }
  .cat-group:last-child{ margin-bottom:0; }
  .cat-group-title{
    font-family:'Anton', sans-serif;
    font-size:1.5rem;
    color:var(--cream);
    margin-bottom:24px;
    display:flex;
    align-items:baseline;
    gap:14px;
  }
  .cat-group-title::after{
    content:"";
    flex:1;
    height:1px;
    background:var(--line);
  }
  .cards{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:24px;
  }
  .card{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:18px;
    padding:26px;
    transition:transform .25s ease, border-color .25s ease, background .25s ease;
    position:relative;
  }
  .card-image{
    aspect-ratio:16/10;
    border-radius:12px;
    overflow:hidden;
    margin-bottom:18px;
    background:var(--surface-2);
  }
  .card-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .35s ease;
  }
  .card:hover .card-image img{
    transform:scale(1.05);
  }
  .card:hover{
    transform:translateY(-6px);
    border-color:rgba(232,84,46,0.5);
    background:var(--surface-2);
  }
  .card-top{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
    margin-bottom:14px;
  }
  .card h3{
    font-family:'Work Sans', sans-serif;
    font-weight:700;
    text-transform:none;
    font-size:1.15rem;
    letter-spacing:0;
    color:var(--cream);
  }
  .price{
    font-family:'Anton', sans-serif;
    color:var(--flame);
    font-size:1.15rem;
    white-space:nowrap;
  }
  .card p{
    color:var(--muted);
    font-size:0.92rem;
  }
  .tag{
    display:inline-block;
    margin-top:14px;
    font-size:0.7rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.06em;
    color:var(--mustard);
  }

  /* ---------- CONTACTO ---------- */
  .contacto{
    background:var(--surface);
    border-top:1px solid var(--line);
  }
  .contact-card{
    background:linear-gradient(160deg, var(--surface-2), #17120E);
    border:1px solid var(--line);
    border-radius:26px;
    padding:52px;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
    position:relative;
    overflow:hidden;
  }
  .contact-card::before{
    content:"";
    position:absolute;
    top:-60px; right:-60px;
    width:220px; height:220px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(232,84,46,0.28), transparent 70%);
  }
  .contact-card h3{
    font-size:1.9rem;
    color:var(--cream);
    margin-bottom:10px;
  }
  .contact-card > div > p{ color:var(--muted); max-width:40ch; margin-bottom:28px; }
  .contact-list{ display:grid; gap:20px; }
  .contact-item{
    display:flex;
    gap:16px;
    align-items:flex-start;
  }
  .icon-circle{
    flex:none;
    width:42px; height:42px;
    border-radius:50%;
    background:rgba(244,166,37,0.14);
    border:1px solid rgba(244,166,37,0.35);
    display:flex; align-items:center; justify-content:center;
    color:var(--mustard);
    font-size:1.05rem;
  }
  .contact-item h4{
    font-family:'Work Sans', sans-serif;
    font-weight:700;
    font-size:0.95rem;
    text-transform:uppercase;
    letter-spacing:0.05em;
    color:var(--cream);
    margin-bottom:4px;
  }
  .contact-item p{ color:var(--muted); font-size:0.92rem; }
  .contact-form{
    background:var(--bg);
    border:1px solid var(--line);
    border-radius:18px;
    padding:28px;
    display:flex;
    flex-direction:column;
    gap:14px;
  }
  .contact-form label{
    font-size:0.75rem;
    text-transform:uppercase;
    letter-spacing:0.08em;
    color:var(--muted);
    margin-bottom:6px;
    display:block;
  }
  .contact-form input, .contact-form textarea{
    width:100%;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:10px;
    padding:12px 14px;
    color:var(--cream);
    font-family:'Work Sans', sans-serif;
    font-size:0.95rem;
  }
  .contact-form input:focus, .contact-form textarea:focus{
    outline:none;
    border-color:var(--flame);
  }
  .contact-form button{
    margin-top:6px;
    border:none;
    cursor:pointer;
    font-family:'Work Sans', sans-serif;
  }

  /* ---------- FOOTER ---------- */
  footer{
    padding:40px 0;
    text-align:center;
    color:var(--muted);
    font-size:0.85rem;
    border-top:1px solid var(--line);
  }
  footer b{ color:var(--mustard); }

  /* ---------- CARRUSEL DE PLATOS ---------- */
  .favoritos{
    background:var(--bg);
    padding-top:0;
  }
  .carousel-wrap{
    position:relative;
  }
  .carousel{
    position:relative;
    z-index:1;
    border-radius:26px;
    border:1px solid var(--line);
    background:linear-gradient(160deg, var(--surface), #17120E);
    overflow:hidden;
  }
  .sauce-splash{
    position:absolute;
    z-index:0;
    pointer-events:none;
    opacity:0.9;
  }
  .sauce-splash svg{
    width:100%;
    height:100%;
    display:block;
    filter:drop-shadow(0 10px 18px rgba(0,0,0,0.35));
  }
  .sauce-splash.ketchup{
    top:-55px;
    left:-60px;
    width:220px;
    height:220px;
    animation:sauceFloat 7s ease-in-out infinite;
  }
  .sauce-splash.mustard{
    bottom:-60px;
    right:-55px;
    width:200px;
    height:200px;
    animation:sauceFloat 8.5s ease-in-out infinite reverse;
  }
  @keyframes sauceFloat{
    0%, 100%{ transform:translate(0,0) rotate(0deg); }
    50%{ transform:translate(8px,-12px) rotate(5deg); }
  }
  @media (max-width: 760px){
    .sauce-splash.ketchup{ width:140px; height:140px; top:-35px; left:-35px; }
    .sauce-splash.mustard{ width:130px; height:130px; bottom:-35px; right:-35px; }
  }

  /* ---------- FONDO DE SALSAS - CATÁLOGO ---------- */
  .catalogo-sauce-bg{
    position:fixed;
    inset:0;
    z-index:0;
    pointer-events:none;
    overflow:hidden;
  }
  .page-splash{
    position:absolute;
    opacity:0.5;
  }
  .page-splash svg{
    width:100%;
    height:100%;
    display:block;
    filter:drop-shadow(0 14px 24px rgba(0,0,0,0.4));
  }
  .page-splash.tl{ top:-70px; left:-90px; width:380px; height:380px; animation:sauceFloat 9s ease-in-out infinite; }
  .page-splash.tr{ top:-60px; right:-100px; width:340px; height:340px; animation:sauceFloat 10s ease-in-out infinite reverse; }
  .page-splash.bl{ bottom:-80px; left:-100px; width:340px; height:340px; animation:sauceFloat 11s ease-in-out infinite; }
  .page-splash.br{ bottom:-90px; right:-90px; width:380px; height:380px; animation:sauceFloat 9.5s ease-in-out infinite reverse; }

  #catalogo{ position:relative; z-index:1; }
  .nav, footer{ position:relative; z-index:1; }

  @media (max-width: 900px){
    .page-splash.tl, .page-splash.tr{ width:200px; height:200px; }
    .page-splash.bl, .page-splash.br{ width:200px; height:200px; }
    .page-splash{ opacity:0.32; }
  }
  @media (max-width: 560px){
    .page-splash.tr, .page-splash.bl{ display:none; }
  }
  .carousel-track{
    display:flex;
    transition:transform .55s cubic-bezier(.65,0,.35,1);
  }
  .carousel-slide{
    flex:0 0 100%;
    display:grid;
    grid-template-columns:0.85fr 1.15fr;
    align-items:center;
    gap:40px;
    padding:56px;
  }
  .dish-visual{
    aspect-ratio:1/1;
    max-width:340px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .dish-visual svg{ width:100%; height:100%; }
  .dish-copy .eyebrow{ margin-bottom:14px; }
  .dish-copy h3{
    font-family:'Anton', sans-serif;
    font-size:clamp(1.8rem, 3.4vw, 2.5rem);
    color:var(--cream);
    margin-bottom:14px;
  }
  .dish-copy p{
    color:var(--muted);
    max-width:44ch;
    margin-bottom:18px;
  }
  .dish-price{
    font-family:'Anton', sans-serif;
    color:var(--flame);
    font-size:1.3rem;
  }
  .carousel-arrow{
    position:absolute;
    top:50%;
    translate:0 -50%;
    width:48px; height:48px;
    border-radius:50%;
    border:1px solid var(--line);
    background:rgba(27,22,17,0.7);
    backdrop-filter:blur(4px);
    color:var(--cream);
    font-size:1.2rem;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    transition:background .2s ease, border-color .2s ease, transform .2s ease;
    z-index:5;
  }
  .carousel-arrow:hover{ background:var(--flame); border-color:var(--flame); }
  .carousel-arrow.prev{ left:18px; }
  .carousel-arrow.next{ right:18px; }
  .carousel-dots{
    display:flex;
    justify-content:center;
    gap:10px;
    padding:0 0 26px;
  }
  .carousel-dot{
    width:9px; height:9px;
    border-radius:50%;
    background:var(--line);
    border:none;
    cursor:pointer;
    padding:0;
    transition:background .2s ease, transform .2s ease;
  }
  .carousel-dot.active{
    background:var(--flame);
    transform:scale(1.3);
  }

  @media (max-width: 760px){
    .carousel-slide{
      grid-template-columns:1fr;
      padding:40px 24px;
      text-align:center;
    }
    .dish-copy p{ margin-left:auto; margin-right:auto; }
    .carousel-arrow{ width:40px; height:40px; font-size:1rem; }
  }

  /* ---------- RESPONSIVE ---------- */
  @media (max-width: 860px){
    .nav-links{
      position:fixed;
      top:68px; left:0; right:0;
      flex-direction:column;
      background:var(--surface);
      padding:22px 28px;
      gap:18px;
      border-bottom:1px solid var(--line);
      transform:translateY(-140%);
      transition:transform .3s ease;
    }
    .nav-links.open{ transform:translateY(0); }
    .menu-toggle{
      display:flex;
      align-items:center;
      justify-content:center;
      width:40px; height:40px;
      border:1px solid var(--line);
      border-radius:10px;
      background:none;
      color:var(--cream);
      font-size:1.2rem;
      cursor:pointer;
    }
    .nav-cta{ display:none; }
    .hero-inner{ grid-template-columns:1fr; }
    .hero-stats{ justify-content:space-between; }
    .cards{ grid-template-columns:repeat(2, 1fr); }
    .contact-card{ grid-template-columns:1fr; padding:32px; }
  }
  @media (max-width: 560px){
    .cards{ grid-template-columns:1fr; }
    .hero{ padding:64px 0 80px; }
    section{ padding:72px 0; }
  }

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    .layer{ animation:none; }
  }

/* ---------- ILUSTRACIONES SVG DE PLATOS ---------- */

/* Hamburguesa */
.hb-bun{ fill:var(--mustard); }
                .hb-seed{ fill:var(--cream); opacity:.85; }
                .hb-lettuce{ fill:#7CA24A; }
                .hb-cheese{ fill:#F4C94A; }
                .hb-patty{ fill:#4A2E1F; }
                .hb-tomato{ fill:#D64B3B; }
                .hb-bunbottom{ fill:#C97E14; }

/* Perro caliente */
.hd-bun{ fill:var(--mustard); }
                .hd-bunshade{ fill:#C97E14; opacity:.5; }
                .hd-sausage{ fill:#B8392B; }
                .hd-onion{ fill:var(--cream); opacity:.8; }

/* Salchipapas */
.sp-boat{ fill:var(--flame); }
                .sp-fry{ fill:#F4C94A; }
                .sp-sausage{ fill:#B8392B; }
                .sp-ketchup{ fill:#D64B3B; }


  /* ---------- CARRITO ---------- */
  .cart-toggle{
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px; height:42px;
    border:1px solid var(--line);
    border-radius:12px;
    background:none;
    color:var(--cream);
    font-size:1.15rem;
    cursor:pointer;
    margin-left:14px;
    transition:border-color .2s ease, background .2s ease;
  }
  .cart-toggle:hover{ border-color:var(--mustard); background:rgba(244,166,37,0.1); }
  .cart-count{
    position:absolute;
    top:-6px; right:-6px;
    min-width:19px; height:19px;
    padding:0 4px;
    border-radius:999px;
    background:var(--flame);
    color:var(--cream);
    font-size:0.68rem;
    font-weight:700;
    display:flex;
    align-items:center;
    justify-content:center;
    line-height:1;
  }

  .add-cart-btn{
    margin-top:16px;
    width:100%;
    padding:11px 16px;
    border-radius:10px;
    border:1.5px solid var(--flame);
    background:transparent;
    color:var(--flame);
    font-family:'Work Sans', sans-serif;
    font-weight:700;
    font-size:0.8rem;
    text-transform:uppercase;
    letter-spacing:0.05em;
    cursor:pointer;
    transition:background .2s ease, color .2s ease, transform .2s ease;
  }
  .add-cart-btn:hover{ background:var(--flame); color:var(--cream); }
  .add-cart-btn.added{ background:var(--mustard); border-color:var(--mustard); color:var(--bg); }

  .cart-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.55);
    opacity:0;
    pointer-events:none;
    transition:opacity .3s ease;
    z-index:199;
  }
  .cart-overlay.open{ opacity:1; pointer-events:auto; }

  .cart-drawer{
    position:fixed;
    top:0; right:0;
    height:100%;
    width:min(400px, 92vw);
    background:var(--surface);
    border-left:1px solid var(--line);
    box-shadow:-20px 0 50px rgba(0,0,0,0.4);
    z-index:200;
    display:flex;
    flex-direction:column;
    transform:translateX(100%);
    transition:transform .35s cubic-bezier(.65,0,.35,1);
  }
  .cart-drawer.open{ transform:translateX(0); }
  .cart-drawer-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:22px 24px;
    border-bottom:1px solid var(--line);
  }
  .cart-drawer-head h3{
    font-size:1.3rem;
    color:var(--cream);
  }
  .cart-close{
    background:none;
    border:none;
    color:var(--muted);
    font-size:1.2rem;
    cursor:pointer;
    line-height:1;
  }
  .cart-close:hover{ color:var(--cream); }

  .cart-items{
    flex:1;
    overflow-y:auto;
    padding:16px 24px;
    display:flex;
    flex-direction:column;
    gap:16px;
  }
  .cart-empty{ color:var(--muted); font-size:0.92rem; margin-top:10px; }

  .cart-item{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:16px;
    border-bottom:1px solid var(--line);
  }
  .cart-item:last-child{ border-bottom:none; padding-bottom:0; }
  .cart-item-name{
    color:var(--cream);
    font-weight:600;
    font-size:0.92rem;
  }
  .cart-item-price{
    color:var(--muted);
    font-size:0.8rem;
    margin-top:2px;
  }
  .cart-item-qty{
    display:flex;
    align-items:center;
    gap:8px;
  }
  .cart-qty-btn{
    width:26px; height:26px;
    border-radius:50%;
    border:1px solid var(--line);
    background:var(--surface-2);
    color:var(--cream);
    cursor:pointer;
    font-size:0.95rem;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .cart-qty-btn:hover{ border-color:var(--flame); color:var(--flame); }
  .cart-item-remove{
    background:none;
    border:none;
    color:var(--muted);
    font-size:0.75rem;
    text-decoration:underline;
    cursor:pointer;
    margin-top:4px;
  }
  .cart-item-remove:hover{ color:var(--flame); }

  .cart-footer{
    padding:20px 24px 26px;
    border-top:1px solid var(--line);
  }
  .cart-total-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
    font-family:'Anton', sans-serif;
    font-size:1.2rem;
    color:var(--cream);
  }
  .cart-total-row span:last-child{ color:var(--flame); }
  .cart-send:disabled{
    opacity:0.5;
    cursor:not-allowed;
    transform:none !important;
    box-shadow:none !important;
  }

  @media (max-width: 860px){
    .cart-toggle{ margin-left:auto; margin-right:8px; }
  }
