:root{
    --char:#0a0a0a;
    --char-2:#141414;
    --ember:#ff6a1f;
    --ember-dark:#cc4e12;
    --cheese:#ff9142;
    --cream:#f5f2ec;
    --cream-dim:#a8a29b;
    --brown:#121212;
    --brown-line: rgba(255,138,66,0.16);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--char);
    color:var(--cream);
    font-family:'Work Sans', sans-serif;
    line-height:1.5;
    overflow-x:hidden;
  }
  .grain{
    position:fixed; inset:0; pointer-events:none; z-index:999;
    opacity:0.05; mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }
  h1,h2,h3, .display{
    font-family:'Anton', sans-serif;
    font-weight:400;
    text-transform:uppercase;
    letter-spacing:0.01em;
    line-height:0.95;
  }
  .mono{font-family:'Space Mono', monospace;}
  a{color:inherit; text-decoration:none;}
  .wrap{max-width:1180px; margin:0 auto; padding:0 24px;}

  /* NAV */
  nav{
    position:sticky; top:0; z-index:100;
    background:rgba(26,21,18,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--brown-line);
  }
  nav .wrap{
    display:flex; align-items:center; justify-content:space-between;
    padding-top:8px; padding-bottom:8px;
  }
  .brand{
    display:flex; align-items:center; gap:10px;
    font-family:'Anton', sans-serif; font-size:22px; letter-spacing:0.02em;
    text-transform:uppercase;
  }
  .brand-logo{display:flex; align-items:center;}
  .brand-logo img{height:64px; width:auto; display:block;}
  .brand .dot{width:9px; height:9px; border-radius:50%; background:var(--ember); box-shadow:0 0 10px var(--ember);}
  .navlinks{display:flex; gap:32px; font-size:14px; font-weight:600; text-transform:uppercase; letter-spacing:0.06em;}
  .navlinks a{opacity:0.75; transition:opacity .2s, color .2s;}
  .navlinks a.active{opacity:1; color:var(--ember);}
  .navlinks a:hover{opacity:1; color:var(--cheese);}
  .navcta{
    background:var(--ember); color:var(--char); font-weight:700;
    padding:10px 18px; border-radius:2px; font-size:13px;
    text-transform:uppercase; letter-spacing:0.05em;
  }
  .navcta:hover{background:var(--cheese);}
  .menu-toggle{display:none; background:none; border:none; color:var(--cream); font-size:26px; cursor:pointer;}

  /* HERO */
  .hero{
    position:relative;
    padding:120px 0 100px;
    background:
      radial-gradient(ellipse 900px 500px at 15% -10%, rgba(255,106,31,0.35), transparent 60%),
      radial-gradient(ellipse 700px 500px at 100% 10%, rgba(244,185,66,0.12), transparent 60%);
    border-bottom:1px solid var(--brown-line);
  }
  .hero .wrap{position:relative; z-index:1; display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center;}

  /* GALLERY (cinta continua automática) */
  .gallery{padding:56px 0; background:var(--char); border-bottom:1px solid var(--brown-line);}
  .gallery .gallery-head{padding:0 24px; margin-bottom:24px;}
  .gallery .gallery-head .eyebrow{margin-bottom:6px;}
  .gallery .gallery-head h2{font-size:clamp(26px, 3.4vw, 36px); color:var(--cream);}
  .gallery-viewport{
    overflow:hidden; width:100%;
    -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
    mask-image:linear-gradient(90deg, transparent 0, #000 40px, #000 calc(100% - 40px), transparent 100%);
  }
  .gallery-track{
    display:flex; gap:16px; width:max-content;
    animation:galleryScroll 28s linear infinite;
  }
  .gallery-viewport:hover .gallery-track{animation-play-state:paused;}
  @keyframes galleryScroll{
    from{ transform:translateX(0); }
    to{ transform:translateX(calc(-50% - 8px)); }
  }
  .gallery-item{
    flex:0 0 auto; width:300px; height:220px; border-radius:16px; overflow:hidden;
    border:1px solid var(--brown-line);
  }
  .gallery-item img{width:100%; height:100%; object-fit:cover; display:block; pointer-events:none;}
  @media (max-width:640px){
    .gallery-item{width:210px; height:154px;}
  }
  @media (prefers-reduced-motion: reduce){
    .gallery-track{animation:none;}
  }
  .eyebrow{
    font-family:'Space Mono', monospace; font-size:13px; color:var(--cheese);
    text-transform:uppercase; letter-spacing:0.18em; margin-bottom:18px;
    display:flex; align-items:center; gap:10px;
  }
  .eyebrow::before{content:''; width:22px; height:2px; background:var(--cheese);}
  .hero h1{font-size:clamp(48px, 7vw, 84px); color:var(--cream);}
  .hero h1 .accent{color:var(--ember);}
  .hero p.lead{
    margin-top:22px; font-size:18px; color:var(--cream-dim); max-width:480px;
  }
  .hero-ctas{margin-top:36px; display:flex; gap:14px; flex-wrap:wrap;}
  .btn-primary{
    background:var(--ember); color:var(--char); font-weight:700;
    padding:16px 28px; border-radius:2px; font-size:15px;
    text-transform:uppercase; letter-spacing:0.04em;
    box-shadow:0 8px 24px rgba(255,106,31,0.35);
    transition:transform .15s, background .15s;
  }
  .btn-primary:hover{background:var(--cheese); transform:translateY(-2px);}
  .btn-ghost{
    border:1px solid var(--brown-line); color:var(--cream);
    padding:16px 28px; border-radius:2px; font-size:15px; font-weight:600;
    text-transform:uppercase; letter-spacing:0.04em;
    transition:border-color .15s, background .15s;
  }
  .btn-ghost:hover{border-color:var(--ember); background:rgba(255,106,31,0.08);}

  /* hero visual: the "ticket" signature element */
  .ticket{
    background:var(--cream); color:var(--char);
    padding:28px 26px; border-radius:2px; position:relative;
    transform:rotate(2.5deg);
    box-shadow:0 30px 60px rgba(0,0,0,0.45);
  }
  .ticket::before, .ticket::after{
    content:''; position:absolute; left:0; right:0; height:14px;
    background:
      radial-gradient(circle at 10px 7px, var(--char) 6px, transparent 7px) repeat-x;
    background-size:20px 14px;
  }
  .ticket::before{top:-7px;}
  .ticket::after{bottom:-7px; transform:scaleY(-1);}
  .ticket-head{
    display:flex; justify-content:space-between; align-items:baseline;
    border-bottom:2px dashed var(--brown); padding-bottom:12px; margin-bottom:14px;
    font-family:'Space Mono', monospace;
  }
  .ticket-head .no{font-size:12px; opacity:0.6;}
  .ticket-head .title{font-family:'Anton', sans-serif; font-size:20px; text-transform:uppercase;}
  .ticket-row{
    display:flex; justify-content:space-between; font-family:'Space Mono', monospace;
    font-size:14px; padding:7px 0; border-bottom:1px dotted rgba(61,43,31,0.3);
  }
  .ticket-row span:first-child{max-width:70%;}
  .ticket-total{
    display:flex; justify-content:space-between; margin-top:14px; padding-top:14px;
    border-top:2px dashed var(--brown); font-family:'Space Mono', monospace;
    font-weight:700; font-size:16px;
  }
  .ticket-total .amt{color:var(--ember-dark);}
  .ticket-stamp{
    position:absolute; right:18px; bottom:44px;
    border:2px solid var(--ember); color:var(--ember);
    border-radius:50%; width:64px; height:64px;
    display:flex; align-items:center; justify-content:center;
    transform:rotate(-14deg); font-family:'Anton', sans-serif; font-size:10px;
    text-align:center; line-height:1.1; letter-spacing:0.03em;
    opacity:0.85;
  }

  section{padding:100px 0;}
  .section-head{margin-bottom:56px; max-width:640px;}
  .section-head .eyebrow{color:var(--ember);}
  .section-head .eyebrow::before{background:var(--ember);}
  .section-head h2{font-size:clamp(34px, 4.5vw, 52px); color:var(--cream);}
  .section-head p{margin-top:14px; color:var(--cream-dim); font-size:16px;}

  /* MENU */
  .menu{background:var(--char-2); border-top:1px solid var(--brown-line); border-bottom:1px solid var(--brown-line);}

  /* Filter bar */
  .filter-bar{display:flex; flex-wrap:wrap; gap:10px; margin-bottom:36px;}
  .filter-btn{
    font-family:'Space Mono', monospace; font-size:12px; text-transform:uppercase; letter-spacing:0.05em;
    padding:9px 16px; border-radius:20px; border:1px solid var(--brown-line); background:transparent;
    color:var(--cream-dim); cursor:pointer; transition:all .15s;
  }
  .filter-btn:hover{border-color:var(--ember); color:var(--cream);}
  .filter-btn.active{background:var(--ember); border-color:var(--ember); color:var(--char); font-weight:700;}

  .menu-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:22px;}
  .menu-section-title{
    grid-column:1/-1; display:flex; align-items:center; gap:16px;
    margin:8px 0 -2px; padding-top:24px; border-top:1px solid var(--brown-line);
  }
  .menu-section-title:first-child{padding-top:0; border-top:none; margin-top:0;}
  .menu-section-title span{
    font-family:'Anton', sans-serif; font-size:26px; text-transform:uppercase; letter-spacing:0.02em; color:var(--ember);
    white-space:nowrap;
  }
  .menu-section-title::after{content:''; flex:1; height:1px; background:var(--brown-line);}
  .menu-section-title.hidden{display:none;}
  .menu-card{
    background:#0a0805; border:1px solid var(--brown-line); border-radius:3px;
    overflow:hidden; position:relative; transition:transform .2s, border-color .2s, opacity .2s;
  }
  .menu-card:hover{transform:translateY(-6px); border-color:var(--ember);}
  .menu-card.hidden{display:none;}
  .menu-photo{
    aspect-ratio:4/3; display:flex; align-items:center; justify-content:center;
    background:
      radial-gradient(ellipse at 30% 20%, rgba(255,106,31,0.25), transparent 60%),
      var(--char);
    border-bottom:1px solid var(--brown-line);
  }
  .menu-photo svg{width:64%; height:64%;}
  .menu-photo img{width:100%; height:100%; object-fit:cover; display:block;}
  .menu-photo img.photo-contain{object-fit:contain;}
  .menu-card-body{padding:22px 24px 24px;}
  .menu-card .tag{
    font-family:'Space Mono', monospace; font-size:11px; color:var(--cheese);
    text-transform:uppercase; letter-spacing:0.1em; margin-bottom:10px; display:block;
  }
  .menu-card h3{font-size:24px; color:var(--cream); margin-bottom:10px;}
  .menu-card p{color:var(--cream-dim); font-size:14px; margin-bottom:18px; min-height:42px;}
  .menu-card .price-row{
    display:flex; justify-content:space-between; align-items:center;
    border-top:1px dashed var(--brown-line); padding-top:16px;
  }
  .menu-card .price{font-family:'Space Mono', monospace; font-weight:700; font-size:20px; color:var(--ember);}
  .add-btn{
    width:36px; height:36px; border-radius:50%; background:var(--ember); color:var(--char);
    font-size:20px; font-weight:700; display:flex; align-items:center; justify-content:center;
    border:none; cursor:pointer; transition:background .15s, transform .15s;
  }
  .add-btn:hover{background:var(--cheese); transform:scale(1.08);}

  /* Papas Fundidas: Personal / Familiar */
  .size-price-row{display:flex; gap:10px; border-top:1px dashed var(--brown-line); padding-top:16px;}
  .size-btn{
    flex:1; background:transparent; border:1px solid var(--brown-line); color:var(--cream);
    border-radius:3px; padding:10px 8px; font-family:'Work Sans', sans-serif; font-size:13px;
    cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:4px; transition:all .15s;
  }
  .size-btn span{font-family:'Space Mono', monospace; font-weight:700; color:var(--ember); font-size:14px;}
  .size-btn:hover{border-color:var(--ember); background:rgba(255,106,31,0.08);}

  /* Alitas: agregar papas */
  .papas-addon-label{
    display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--cream-dim);
    margin-bottom:14px; cursor:pointer; user-select:none;
  }
  .papas-addon-label input{accent-color:var(--ember); width:15px; height:15px; cursor:pointer;}

  /* Cart button (nav) */
  .cart-btn{
    position:relative; background:transparent; border:1px solid var(--brown-line);
    color:var(--cream); width:42px; height:42px; border-radius:2px; cursor:pointer;
    display:flex; align-items:center; justify-content:center; margin-left:12px; flex-shrink:0;
    transition:border-color .15s;
  }
  .cart-btn:hover{border-color:var(--ember);}
  .cart-btn svg{width:20px; height:20px;}
  .cart-count{
    position:absolute; top:-7px; right:-7px; background:var(--ember); color:var(--char);
    font-family:'Space Mono', monospace; font-size:11px; font-weight:700;
    width:19px; height:19px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  }

  /* Cart drawer */
  .cart-overlay{
    position:fixed; inset:0; background:rgba(0,0,0,0.55); z-index:200;
    opacity:0; pointer-events:none; transition:opacity .25s;
  }
  .cart-overlay.open{opacity:1; pointer-events:auto;}
  .cart-drawer{
    position:fixed; top:0; right:0; height:100%; width:400px; max-width:92vw;
    background:var(--char-2); border-left:1px solid var(--brown-line); z-index:201;
    transform:translateX(100%); transition:transform .3s ease; display:flex; flex-direction:column;
  }
  .cart-drawer.open{transform:translateX(0);}
  .cart-head{
    padding:22px 24px; border-bottom:1px solid var(--brown-line);
    display:flex; justify-content:space-between; align-items:center;
  }
  .cart-head h3{font-size:22px; color:var(--cream);}
  .cart-close{background:none; border:none; color:var(--cream-dim); font-size:22px; cursor:pointer;}
  .cart-scroll{flex:1; overflow-y:auto;}
  .cart-items{padding:12px 24px 0;}
  .cart-empty{color:var(--cream-dim); font-size:14px; text-align:center; padding:60px 0; font-family:'Space Mono', monospace;}
  .cart-item{
    display:flex; justify-content:space-between; align-items:center;
    padding:16px 0; border-bottom:1px solid var(--brown-line); gap:12px;
  }
  .cart-item-name{font-size:14px; color:var(--cream); font-weight:600;}
  .cart-item-price{font-family:'Space Mono', monospace; font-size:12px; color:var(--cream-dim); margin-top:3px;}
  .qty-stepper{display:flex; align-items:center; gap:10px; flex-shrink:0;}
  .qty-stepper button{
    width:26px; height:26px; border-radius:50%; border:1px solid var(--brown-line); background:transparent;
    color:var(--cream); font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center;
  }
  .qty-stepper button:hover{border-color:var(--ember); color:var(--ember);}
  .qty-stepper span{font-family:'Space Mono', monospace; font-size:14px; min-width:16px; text-align:center;}
  .cart-foot{padding:22px 24px; border-top:1px solid var(--brown-line);}
  .cart-total-row{display:flex; justify-content:space-between; font-family:'Space Mono', monospace; font-size:18px; font-weight:700; margin-bottom:16px;}
  .cart-delivery-row{font-size:13px; font-weight:600; color:var(--cream-dim); margin-bottom:8px;}
  .cart-delivery-row.hidden{display:none;}
  .cart-total-row .amt{color:var(--ember);}
  .whatsapp-btn{
    width:100%; background:#25D366; color:#0b3d20; font-weight:700; border:none; border-radius:2px;
    padding:16px; font-size:14px; text-transform:uppercase; letter-spacing:0.04em; cursor:pointer;
    display:flex; align-items:center; justify-content:center; gap:10px; transition:filter .15s;
    font-family:'Work Sans', sans-serif;
  }
  .whatsapp-btn:hover{filter:brightness(1.08);}
  .whatsapp-btn svg{width:18px; height:18px;}
  .cart-note{font-size:12px; color:var(--cream-dim); text-align:center; margin-top:12px;}

  /* Order form */
  .order-form{padding:4px 24px 0;}
  .field{margin-bottom:16px;}
  .field label{
    display:block; font-family:'Space Mono', monospace; font-size:11px; color:var(--cheese);
    text-transform:uppercase; letter-spacing:0.08em; margin-bottom:8px;
  }
  .field input[type="text"]{
    width:100%; background:var(--char); border:1px solid var(--brown-line); color:var(--cream);
    padding:12px 14px; border-radius:2px; font-family:'Work Sans', sans-serif; font-size:14px;
    transition:border-color .15s;
  }
  .field input[type="text"]::placeholder{color:var(--cream-dim); opacity:0.5;}
  .field input[type="text"]:focus{outline:none; border-color:var(--ember);}
  .field input.invalid{border-color:#e05252;}
  .radio-group{display:flex; gap:10px;}
  .radio-option{
    flex:1; border:1px solid var(--brown-line); border-radius:2px; padding:12px;
    text-align:center; cursor:pointer; font-size:13px; color:var(--cream-dim);
    transition:border-color .15s, background .15s, color .15s;
  }
  .radio-option input{position:absolute; opacity:0; width:1px; height:1px; pointer-events:none;}
  .radio-option.selected{border-color:var(--ember); background:rgba(255,106,31,0.1); color:var(--cream); font-weight:600;}
  .field-error{color:#e05252; font-size:12px; margin-top:6px; display:none;}
  .field-error.show{display:block;}
  .field.hidden{display:none;}

  /* CUSTOMIZE MODAL */
  .modal-overlay{position:fixed; inset:0; background:rgba(0,0,0,0.6); z-index:300; opacity:0; pointer-events:none; transition:opacity .2s;}
  .modal-overlay.open{opacity:1; pointer-events:auto;}
  .modal-box{
    position:fixed; top:50%; left:50%; transform:translate(-50%,-50%) scale(0.96);
    width:640px; max-width:95vw; max-height:88vh; overflow-y:auto;
    background:var(--char-2); border:1px solid var(--brown-line); border-radius:4px;
    z-index:301; opacity:0; pointer-events:none; transition:opacity .2s, transform .2s;
  }
  .modal-overlay.open .modal-box{opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1);}
  .modal-head{display:flex; gap:14px; padding:20px 22px; border-bottom:1px solid var(--brown-line); align-items:center;}
  .modal-head img{width:64px; height:64px; object-fit:cover; border-radius:3px; flex-shrink:0;}
  .modal-head h3{font-size:20px; color:var(--cream);}
  .modal-head .price{font-family:'Space Mono',monospace; color:var(--ember); font-size:15px; margin-top:4px;}
  .modal-close{margin-left:auto; background:none; border:none; color:var(--cream-dim); font-size:22px; cursor:pointer;}
  .modal-body{padding:18px 22px;}
  .modal-section{padding-top:18px; border-top:1px solid var(--brown-line);}
  .modal-section:first-child{padding-top:0; border-top:none;}
  .modal-section{margin-bottom:22px;}
  .modal-section-title{
    display:flex; align-items:center; gap:9px;
    font-family:'Space Mono',monospace; font-size:11px; color:var(--cheese);
    text-transform:uppercase; letter-spacing:0.1em; margin-bottom:12px;
  }
  .modal-section-title::before{content:''; width:14px; height:2px; border-radius:2px; background:var(--cheese); flex-shrink:0;}
  .modal-section-title--main{
    font-family:'Anton', sans-serif; font-size:22px; color:var(--cream);
    text-transform:none; letter-spacing:0.01em; font-weight:400; margin-bottom:16px;
  }
  .modal-section-title--main::before{width:20px; height:3px; background:var(--ember);}
  .opt-grid{display:flex; flex-direction:column; gap:8px;}
  .opt-chip{
    display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--brown-line);
    border-radius:6px; cursor:pointer; font-size:13px; color:var(--cream-dim); transition:all .15s; user-select:none;
  }
  .opt-chip:hover{border-color:rgba(255,255,255,0.25);}

  /* Lista de ingredientes con foto + contador — tarjetas en grilla (estilo app de comida rápida) */
  .ingredient-list{
    display:grid; grid-template-columns:repeat(3, 1fr); gap:14px;
  }
  @keyframes cardIn{
    from{ opacity:0; transform:scale(0.85) translateY(8px); }
    to{ opacity:1; transform:scale(1) translateY(0); }
  }
  .ingredient-row{
    aspect-ratio:0.86/1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:0;
    padding:0; border:1px solid var(--brown-line); border-radius:14px;
    background:var(--char-2); transition:border-color .18s, transform .18s, box-shadow .18s;
    position:relative; overflow:hidden;
    animation:cardIn .38s cubic-bezier(.2,.8,.3,1) backwards;
  }
  .ingredient-row:hover{border-color:rgba(255,255,255,0.28); transform:translateY(-3px); box-shadow:0 10px 24px rgba(0,0,0,0.35);}
  .ingredient-row.is-extra{border-color:var(--cheese); box-shadow:0 6px 18px rgba(244,185,66,0.15);}
  .ingredient-row.is-extra .icon-badge.ingredient-photo{box-shadow:inset 0 -2px 0 var(--cheese);}
  .ingredient-row.is-removed{opacity:0.42;}
  .ingredient-row.is-removed:hover{transform:none; box-shadow:none;}
  .ingredient-row.is-removed .icon-badge.ingredient-photo img{filter:grayscale(0.7);}
  .ingredient-row .icon-badge.ingredient-photo{
    flex:1 1 auto; width:100%; min-height:0; border-radius:0; background:rgba(255,255,255,0.04);
    display:flex; align-items:center; justify-content:center; position:relative;
  }
  .ingredient-row .icon-badge.ingredient-photo::after{
    content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(20,20,20,0.55) 100%);
    pointer-events:none;
  }
  .ingredient-row .icon-badge.ingredient-photo svg{width:52%; height:52%; flex-shrink:0; position:relative; z-index:1;}
  .ingredient-row .icon-badge.ingredient-photo img{
    width:100%; height:100%; object-fit:cover; border-radius:0; display:block; transition:transform .3s ease;
  }
  .ingredient-row:hover .icon-badge.ingredient-photo img{transform:scale(1.06);}
  .ingredient-info{width:100%; flex-shrink:0; padding:8px 8px 6px;}
  .ingredient-name{display:block; font-size:12px; color:var(--cream); font-weight:700; line-height:1.2;}
  .ingredient-note{display:block; font-family:'Space Mono',monospace; font-size:10px; color:var(--cream-dim); margin-top:3px; letter-spacing:0.01em;}
  .ingredient-row.is-extra .ingredient-note{color:var(--cheese); font-weight:600;}
  .ingredient-row.is-removed .ingredient-note{color:#e05252;}
  .stepper{
    display:flex; align-items:center; justify-content:space-between; gap:0; flex-shrink:0;
    background:rgba(255,255,255,0.06); border-radius:999px; padding:3px; width:calc(100% - 16px); max-width:112px;
    margin:0 auto 10px;
  }
  .step-btn{
    width:24px; height:24px; border-radius:50%; border:none; background:transparent;
    color:var(--cream); font-size:15px; cursor:pointer; display:flex; align-items:center; justify-content:center;
    transition:all .15s; flex-shrink:0;
  }
  .step-btn:hover:not(:disabled){background:var(--ember); color:var(--char);}
  .step-btn:disabled{opacity:0.25; cursor:default;}
  .step-qty{font-family:'Space Mono',monospace; font-size:14px; font-weight:700; min-width:18px; text-align:center; color:var(--cream);}
  @media (max-width:560px){
    .ingredient-list{grid-template-columns:repeat(2, 1fr);}
  }
  @media (prefers-reduced-motion: reduce){
    .ingredient-row{animation:none;}
  }
  .icon-badge{
    width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
    flex-shrink:0; background:rgba(255,255,255,0.07); box-shadow:0 0 0 2px transparent; transition:all .15s;
    color:var(--cream-dim);
  }
  .icon-badge svg{width:24px; height:24px;}
  .opt-chip .opt-price{margin-left:auto; font-family:'Space Mono',monospace; font-size:11px; opacity:0.7;}
  .opt-chip.remove-chip.active{border-color:#e05252; background:rgba(224,82,82,0.08); color:var(--cream);}
  .opt-chip.remove-chip.active .icon-badge{box-shadow:0 0 0 2px #e05252; background:rgba(224,82,82,0.15);}
  .opt-chip.remove-chip.active::after{content:'✕'; margin-left:auto; color:#e05252; font-weight:700; font-size:15px;}
  .opt-chip.extra-chip.active{border-color:var(--cheese); background:rgba(244,185,66,0.08); color:var(--cream);}
  .opt-chip.extra-chip.active .icon-badge{box-shadow:0 0 0 2px var(--cheese); background:rgba(244,185,66,0.15);}
  .sauce-list{display:flex; flex-direction:column; gap:8px;}
  .sauce-chip{
    display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid var(--brown-line);
    border-radius:6px; cursor:pointer; font-size:13px; color:var(--cream-dim); transition:all .15s;
  }
  .sauce-chip:hover{border-color:rgba(255,255,255,0.25);}
  .sauce-chip.active{border-color:var(--ember); background:rgba(255,106,31,0.08); color:var(--cream);}
  .sauce-chip.active .icon-badge{box-shadow:0 0 0 2px var(--ember); background:rgba(255,106,31,0.15);}
  .sauce-chip.active::after{content:'✓'; margin-left:auto; color:var(--ember); font-weight:700;}
  .modal-foot{padding:18px 22px; border-top:1px solid var(--brown-line); display:flex; align-items:center; gap:14px;}
  .modal-qty{display:flex; align-items:center; gap:12px;}
  .modal-qty button{
    width:30px; height:30px; border-radius:50%; border:1px solid var(--brown-line); background:transparent;
    color:var(--cream); font-size:16px; cursor:pointer;
  }
  .modal-qty span{font-family:'Space Mono',monospace; font-size:15px; min-width:18px; text-align:center;}
  .modal-add-btn{
    flex:1; background:var(--ember); color:var(--char); font-weight:700; border:none; border-radius:2px;
    padding:14px; font-size:13px; text-transform:uppercase; letter-spacing:0.05em; cursor:pointer; transition:background .15s;
  }
  .modal-add-btn:hover{background:var(--cheese);}
  .modal-notes{
    width:100%; background:var(--char); border:1px solid var(--brown-line); color:var(--cream);
    padding:10px 12px; border-radius:3px; font-family:'Work Sans', sans-serif; font-size:13px;
    resize:none; min-height:60px;
  }
  .modal-notes::placeholder{color:var(--cream-dim); opacity:0.5;}
  .modal-notes:focus{outline:none; border-color:var(--ember);}
  .bun-chip.active{border-color:var(--ember); background:rgba(255,106,31,0.08); color:var(--cream);}
  .bun-chip.active .icon-badge{box-shadow:0 0 0 2px var(--ember); background:rgba(255,106,31,0.15);}
  .bun-chip.active::after{content:'✓'; margin-left:auto; color:var(--ember); font-weight:700;}
  .point-select{display:flex; gap:10px;}
  .point-chip{
    flex:1; text-align:center; padding:12px 8px; border:1px solid var(--brown-line); border-radius:6px;
    cursor:pointer; color:var(--cream-dim); font-size:13px; transition:all .15s;
  }
  .point-chip .point-note{display:block; font-family:'Space Mono',monospace; font-size:11px; margin-top:3px; opacity:0.75;}
  .point-chip:hover{border-color:rgba(255,255,255,0.25);}
  .point-chip.active{border-color:var(--ember); background:rgba(255,106,31,0.1); color:var(--cream); font-weight:600;}

  .drink-select{display:grid; grid-template-columns:repeat(3, 1fr); gap:12px;}
  .drink-chip{
    aspect-ratio:0.86/1; display:flex; flex-direction:column; align-items:center; text-align:center; gap:0;
    padding:0; border:1px solid var(--brown-line); border-radius:14px; overflow:hidden;
    background:var(--char-2); cursor:pointer; color:var(--cream-dim);
    transition:border-color .18s, transform .18s, box-shadow .18s;
  }
  .drink-chip:hover{border-color:rgba(255,255,255,0.28); transform:translateY(-3px); box-shadow:0 10px 24px rgba(0,0,0,0.35);}
  .drink-chip.active{border-color:var(--ember); box-shadow:0 6px 18px rgba(255,106,31,0.18);}
  .drink-chip.active .drink-photo{box-shadow:inset 0 -2px 0 var(--ember);}
  .drink-photo{
    flex:1 1 auto; width:100%; min-height:0; background:rgba(255,255,255,0.04);
    display:flex; align-items:center; justify-content:center; position:relative;
  }
  .drink-photo::after{
    content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 55%, rgba(20,20,20,0.55) 100%);
    pointer-events:none;
  }
  .drink-chip svg{width:44%; height:44%; flex-shrink:0; position:relative; z-index:1;}
  .drink-chip img{
    width:78%; height:78%; object-fit:contain; position:relative; z-index:1; transition:transform .3s ease;
  }
  .drink-chip:hover img{transform:scale(1.08);}
  .drink-info{width:100%; flex-shrink:0; padding:7px 6px 8px;}
  .drink-name{display:block; font-size:11px; color:var(--cream); font-weight:700; line-height:1.2;}
  .drink-price{display:block; font-family:'Space Mono',monospace; font-size:10px; color:var(--cream-dim); margin-top:2px;}
  .drink-chip.active .drink-price{color:var(--ember); font-weight:600;}
  @media (max-width:560px){
    .drink-select{grid-template-columns:repeat(2, 1fr);}
  }

  /* PROCESS */
  .process{padding-top:100px;}
  .process-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:2px; background:var(--brown-line); border:1px solid var(--brown-line);}
  .process-step{background:var(--char); padding:34px 26px;}
  .process-step .num{font-family:'Space Mono', monospace; color:var(--ember); font-size:13px; margin-bottom:14px;}
  .process-step h3{font-size:20px; color:var(--cream); margin-bottom:10px; text-transform:none; font-family:'Work Sans'; font-weight:700;}
  .process-step p{color:var(--cream-dim); font-size:14px;}

  /* MENU TEASER (home) */
  .menu-teaser{background:var(--char); padding-top:100px;}
  .menu-teaser-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; margin-bottom:40px;}
  .menu-teaser-card{background:var(--char-2); border:1px solid var(--brown-line); border-radius:14px; overflow:hidden; transition:transform .2s, box-shadow .2s;}
  .menu-teaser-card:hover{transform:translateY(-4px); box-shadow:0 12px 28px rgba(0,0,0,0.35);}
  .menu-teaser-photo{aspect-ratio:4/3; overflow:hidden;}
  .menu-teaser-photo img{width:100%; height:100%; object-fit:cover; display:block;}
  .menu-teaser-body{padding:16px;}
  .menu-teaser-body h3{font-size:16px; color:var(--cream); margin-bottom:4px;}
  .menu-teaser-body .price{font-family:'Space Mono', monospace; color:var(--ember); font-size:14px; font-weight:700;}
  .menu-teaser-cta{text-align:center;}
  @media (max-width:900px){ .menu-teaser-grid{grid-template-columns:repeat(2, 1fr);} }

  /* NOSOTROS TEASER (home) */
  .about-teaser{padding:100px 0; border-bottom:1px solid var(--brown-line);}
  .about-teaser .wrap{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center;}
  .about-teaser p{color:var(--cream-dim); font-size:16px; line-height:1.7; margin-bottom:24px;}
  .about-teaser-photo{border-radius:16px; overflow:hidden; aspect-ratio:4/3;}
  .about-teaser-photo img{width:100%; height:100%; object-fit:cover; display:block;}
  @media (max-width:820px){ .about-teaser .wrap{grid-template-columns:1fr;} }

  /* PAGE HEADER (menu.html / nosotros.html) */
  .page-header{
    position:relative; padding:150px 0 60px; text-align:center; overflow:hidden;
    background:
      radial-gradient(ellipse 900px 500px at 50% -10%, rgba(255,106,31,0.28), transparent 60%),
      var(--char);
    border-bottom:1px solid var(--brown-line);
  }
  .page-header .eyebrow{justify-content:center;}
  .page-header h1{font-size:clamp(40px, 6vw, 64px); color:var(--cream);}
  .page-header p{color:var(--cream-dim); max-width:520px; margin:14px auto 0; font-size:16px;}

  /* LOCATION */
  .location{background:var(--char-2); border-top:1px solid var(--brown-line);}
  .loc-grid{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center;}
  .loc-map{
    aspect-ratio:4/3; border-radius:3px; border:1px solid var(--brown-line);
    background:
      linear-gradient(135deg, var(--brown) 25%, transparent 25%) -10px 0/ 20px 20px,
      linear-gradient(225deg, var(--brown) 25%, transparent 25%) -10px 0/ 20px 20px,
      var(--char);
    display:flex; align-items:center; justify-content:center;
    position:relative; overflow:hidden;
  }
  .loc-map .pin{
    width:18px; height:18px; background:var(--ember); border-radius:50% 50% 50% 0;
    transform:rotate(-45deg); box-shadow:0 0 0 6px rgba(255,106,31,0.2);
  }
  .info-list{display:flex; flex-direction:column; gap:22px;}
  .info-item{display:flex; gap:16px; align-items:flex-start; border-bottom:1px solid var(--brown-line); padding-bottom:20px;}
  .info-item .label{
    font-family:'Space Mono', monospace; font-size:12px; color:var(--cheese);
    text-transform:uppercase; letter-spacing:0.08em; width:110px; flex-shrink:0; padding-top:2px;
  }
  .info-item .val{color:var(--cream); font-size:16px; font-weight:500;}
  .info-item .val small{display:block; color:var(--cream-dim); font-size:13px; font-weight:400; margin-top:2px;}

  /* FOOTER */
  footer{padding:48px 0; border-top:1px solid var(--brown-line);}
  footer .wrap{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
  footer .brand{font-size:16px;}
  .foot-links{display:flex; gap:24px; font-size:13px; color:var(--cream-dim); text-transform:uppercase; letter-spacing:0.05em;}
  .foot-links a:hover{color:var(--ember);}

  @media (max-width: 860px){
    .navlinks{display:none;}
    .menu-toggle{display:block;}
    .hero .wrap{grid-template-columns:1fr; text-align:left;}
    .ticket{transform:rotate(0); max-width:340px;}
    .menu-grid{grid-template-columns:1fr 1fr;}
    .process-grid{grid-template-columns:1fr 1fr;}
    .loc-grid{grid-template-columns:1fr;}
  }
  @media (max-width: 540px){
    .menu-grid{grid-template-columns:1fr;}
    .process-grid{grid-template-columns:1fr;}
    section{padding:64px 0;}
  }
  @media (prefers-reduced-motion: reduce){
    *{transition:none !important;}
  }
/* Botón flotante "Mira tu pedido aquí" */
.floating-order-btn{
  position:fixed; bottom:22px; right:22px; z-index:150;
  width:58px; height:58px; border-radius:50%; background:#25D366;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
  box-shadow:0 6px 20px rgba(0,0,0,0.4); transition:transform .15s;
}
.floating-order-btn:hover{transform:scale(1.08);}
.floating-order-btn svg{width:30px; height:30px; color:#0b3d20;}
.floating-badge{
  position:absolute; top:-4px; right:-4px; background:var(--ember); color:var(--char);
  font-family:'Space Mono', monospace; font-size:12px; font-weight:700;
  width:22px; height:22px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  border:2px solid var(--char);
}
.floating-tooltip{
  position:absolute; right:70px; top:50%; transform:translateY(-50%);
  background:var(--cream); color:var(--char); font-family:'Work Sans', sans-serif; font-size:13px; font-weight:600;
  padding:9px 14px; border-radius:20px; white-space:nowrap; box-shadow:0 4px 14px rgba(0,0,0,0.3);
  animation:tooltipPulse 3s ease-in-out infinite;
}
.floating-tooltip::after{
  content:''; position:absolute; right:-6px; top:50%; transform:translateY(-50%);
  border-width:6px 0 6px 6px; border-style:solid; border-color:transparent transparent transparent var(--cream);
}
@keyframes tooltipPulse{
  0%, 70%, 100%{opacity:1; transform:translateY(-50%) translateX(0);}
  75%{opacity:0; transform:translateY(-50%) translateX(6px);}
  95%{opacity:0;}
}
@media (max-width:640px){
  .floating-order-btn{bottom:16px; right:16px; width:52px; height:52px;}
  .floating-order-btn svg{width:26px; height:26px;}
  .floating-tooltip{display:none;}
}
@media (prefers-reduced-motion: reduce){
  .floating-tooltip{animation:none;}
}
