:root{
  --red:#df3035;
  --red-dark:#b9151d;
  --black:#242626;
  --dark:#111111;
  --white:#ffffff;
  --cream:#f7f4ef;
  --paper:#ffffff;
  --gray:#777777;
  --light-gray:#eeeeee;
  --border:#ddd7cf;
  --shadow:0 24px 60px rgba(0,0,0,.18);
  --font-main: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--black);
  background:var(--cream);
}

button,a{font-family:inherit}
button{cursor:pointer}

.topbar{
  height:86px;
  padding:0 5vw;
  background:white;
  display:flex;
  align-items:center;
  gap:30px;
  position:sticky;
  top:0;
  z-index:100;
  box-shadow:0 2px 18px rgba(0,0,0,.08);
}

.brand img{
  width:210px;
  display:block;
}

.nav{
  display:flex;
  align-items:center;
  gap:28px;
  margin-left:auto;
}

.nav a{
  color:var(--black);
  text-decoration:none;
  text-transform:uppercase;
  font-weight:900;
  font-size:14px;
  letter-spacing:.3px;
}

.header-cta{
  background:var(--red);
  color:white;
  text-decoration:none;
  text-transform:uppercase;
  padding:15px 24px;
  border-radius:8px;
  font-weight:900;
  box-shadow:0 10px 22px rgba(223,48,53,.24);
}

.cart-icon{
  position:relative;
  border:0;
  background:white;
  font-size:26px;
}

.cart-icon span{
  position:absolute;
  top:-8px;
  right:-10px;
  background:var(--red);
  color:white;
  width:22px;
  height:22px;
  border-radius:50%;
  font-size:12px;
  display:grid;
  place-items:center;
  font-weight:900;
}

.mobile-menu{
  display:none;
  margin-left:auto;
  background:white;
  border:0;
  font-size:30px;
}

.hero{
  position:relative;
  min-height:640px;
  display:flex;
  align-items:center;
  overflow:hidden;
  background:#111;
}

.hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.9;
}

.hero-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.64) 38%, rgba(0,0,0,.16) 72%),
    radial-gradient(circle at 75% 60%, rgba(223,48,53,.28), transparent 34%);
}

.hero-content{
  position:relative;
  z-index:2;
  color:white;
  padding:70px 5vw;
  max-width:780px;
}

.eyebrow{
  margin:0 0 12px;
  color:white;
  text-transform:uppercase;
  font-size:14px;
  font-weight:900;
  letter-spacing:1.8px;
}

.eyebrow.red{color:var(--red)}

.hero h1{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:clamp(58px,9vw,112px);
  line-height:.88;
  letter-spacing:1px;
  margin:0 0 22px;
}

.hero h1 span{color:var(--red)}

.hero-text{
  font-size:24px;
  line-height:1.45;
  font-weight:700;
  max-width:560px;
  margin:0 0 30px;
}

.hero-actions{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:54px;
  padding:0 26px;
  border-radius:9px;
  border:0;
  text-decoration:none;
  text-transform:uppercase;
  font-weight:900;
  font-size:16px;
}

.btn-red{
  background:var(--red);
  color:white;
  box-shadow:0 12px 26px rgba(223,48,53,.26);
}

.btn-red:hover{background:var(--red-dark)}

.btn-white{
  background:white;
  color:var(--black);
}

.btn-whatsapp{
  background:#25D366;
  color:white;
}

.full{width:100%}

.quick-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  padding:24px 5vw;
  background:white;
  border-bottom:1px solid var(--border);
}

.quick-strip div{
  display:grid;
  gap:5px;
}

.quick-strip strong{
  text-transform:uppercase;
  font-size:15px;
}

.quick-strip span{
  color:var(--gray);
  font-size:14px;
}

.section{
  padding:74px 5vw;
}

.section-title{
  text-align:center;
  max-width:780px;
  margin:0 auto 36px;
}

.section-title h2,
.builder-title h2,
.ingredient-banner h2,
.location-card h2{
  font-family:var(--font-main);
  font-size:clamp(42px,5vw,68px);
  line-height:.95;
  text-transform:uppercase;
  margin:0 0 12px;
  letter-spacing:.6px;
}

.section-title p,
.builder-title p{
  color:var(--gray);
  font-size:18px;
}

.menu-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
}

.pizza-card{
  background:white;
  border:1px solid var(--border);
  border-radius:16px;
  overflow:hidden;
  position:relative;
  box-shadow:0 18px 45px rgba(0,0,0,.09);
  transition:.2s ease;
}

.pizza-card:hover{
  transform:translateY(-6px);
}

.pizza-card.highlighted{
  border:2px solid var(--red);
}

.badge{
  position:absolute;
  top:16px;
  left:16px;
  z-index:2;
  background:var(--red);
  color:white;
  padding:8px 12px;
  border-radius:999px;
  text-transform:uppercase;
  font-size:12px;
  font-weight:900;
}

.pizza-card img{
  width:100%;
  aspect-ratio:1.25/1;
  object-fit:cover;
  display:block;
  background:#f2f2f2;
}

.pizza-card-body{
  padding:24px;
}

.pizza-card h3{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:34px;
  margin:0 0 8px;
  line-height:1;
}

.pizza-card p{
  color:#555;
  line-height:1.45;
  min-height:46px;
}

.card-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:22px;
  gap:14px;
}

.card-footer strong{
  color:var(--red);
  font-size:30px;
  font-weight:900;
}

.card-footer button{
  background:white;
  color:var(--red);
  border:0;
  font-size:28px;
  font-weight:900;
}

.card-footer button::after{
  content:"→";
}

.builder-section{
  position:relative;
  padding:74px 5vw;
  background:
    linear-gradient(rgba(0,0,0,.86), rgba(0,0,0,.86)),
    url("assets/slice-prosciutto.jpeg");
  background-size:cover;
  background-position:center;
  color:white;
  overflow:hidden;
}

.builder-bg-items .floating{
  position:absolute;
  opacity:.32;
  pointer-events:none;
  filter:drop-shadow(0 20px 20px rgba(0,0,0,.4));
}

.floating-tomato{
  width:240px;
  left:-60px;
  bottom:120px;
  transform:rotate(-18deg);
}

.floating-mushroom{
  width:280px;
  right:-80px;
  top:150px;
  transform:rotate(12deg);
}

.builder-title{
  position:relative;
  z-index:2;
  max-width:760px;
  margin-bottom:32px;
}

.builder-title h2{
  color:white;
}

.builder-title p{
  color:#d7d7d7;
}

.builder-layout{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:330px 1fr 350px;
  gap:26px;
  align-items:start;
}

.steps-progress{
  display:flex;
  align-items:center;
  margin-bottom:22px;
}

.progress-step{
  display:grid;
  justify-items:center;
  gap:6px;
  color:#aaa;
  min-width:54px;
}

.progress-step span{
  width:34px;
  height:34px;
  border-radius:50%;
  background:#737373;
  color:white;
  display:grid;
  place-items:center;
  font-weight:900;
}

.progress-step.active span{
  background:var(--red);
}

.progress-step small{
  text-transform:uppercase;
  font-size:11px;
  font-weight:900;
}

.progress-line{
  flex:1;
  height:1px;
  background:#555;
  margin-bottom:20px;
}

.config-card,
.rule-card,
.pizza-workspace,
.summary-card{
  background:rgba(255,255,255,.96);
  color:var(--black);
  border-radius:14px;
  padding:22px;
  margin-bottom:18px;
  box-shadow:0 22px 50px rgba(0,0,0,.25);
}

.config-card h3,
.rule-card strong,
.summary-card h3{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:28px;
  display:block;
  margin:0 0 16px;
  letter-spacing:.4px;
}

.radio-option{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:10px;
  padding:14px 0;
  border-bottom:1px dashed #ccc;
  cursor:pointer;
  font-weight:800;
}

.radio-option input,
.ingredient-option input{
  accent-color:var(--red);
}

.format-switch{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.format-switch button{
  min-height:54px;
  border:0;
  border-radius:9px;
  background:#272727;
  color:white;
  font-weight:900;
  text-transform:uppercase;
}

.format-switch button.active{
  background:var(--red);
}

.rule-card{
  background:var(--red);
  color:white;
}

.rule-card p{
  margin:8px 0 0;
  line-height:1.45;
}

.pizza-workspace{
  padding:26px;
}

.pizza-preview-card{
  display:grid;
  grid-template-columns:260px 1fr;
  gap:24px;
  align-items:center;
  border-bottom:1px solid var(--border);
  padding-bottom:24px;
  margin-bottom:24px;
}

.pizza-visual{
  position:relative;
  width:260px;
  height:220px;
  border-radius:24px;
  overflow:hidden;
  background:#eee;
  box-shadow:0 18px 40px rgba(0,0,0,.16);
}

.pizza-visual img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.half-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(223,48,53,.22) 0 50%, rgba(0,0,0,.16) 50% 100%);
  border-left:3px solid white;
  mix-blend-mode:multiply;
}

.pizza-preview-card h3{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:34px;
  margin:0 0 8px;
}

.pizza-preview-card p{
  color:#666;
  line-height:1.45;
}

.selector-heading{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:end;
  margin-bottom:18px;
}

.selector-heading h3{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:30px;
  margin:0;
}

.selector-heading p{
  color:#666;
  max-width:420px;
  margin:0;
  line-height:1.4;
}

.ingredients-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.ingredients-grid.compact{
  grid-template-columns:repeat(2,1fr);
}

.ingredient-option{
  border:2px solid #e5e5e5;
  background:#fafafa;
  border-radius:12px;
  min-height:78px;
  padding:12px;
  display:flex;
  gap:10px;
  align-items:center;
  cursor:pointer;
  transition:.18s ease;
}

.ingredient-option:hover{
  border-color:var(--red);
  background:#fff5f5;
}

.ingredient-option span{
  font-weight:900;
}

.ingredient-option small{
  display:block;
  color:#777;
  text-transform:uppercase;
  font-size:11px;
  margin-top:4px;
}

.half-columns{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.half-columns h4{
  font-family:var(--font-main);
  font-size:26px;
  text-transform:uppercase;
  margin:0 0 12px;
}

.summary-column{
  position:sticky;
  top:108px;
}

.summary-line{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:10px 0;
  border-bottom:1px dashed #ccc;
}

.summary-line strong{
  text-align:right;
}

.selection-list{
  background:#f5f1eb;
  border-radius:12px;
  padding:12px;
  margin:14px 0;
  color:#504b46;
  line-height:1.45;
  font-size:14px;
}

.total{
  display:flex;
  justify-content:space-between;
  align-items:end;
  margin-top:16px;
  font-weight:900;
}

.total span{
  font-family:var(--font-main);
  font-size:28px;
  text-transform:uppercase;
}

.total strong{
  color:var(--red);
  font-size:38px;
}

.cart-item{
  border:1px solid #e4e4e4;
  border-radius:12px;
  background:#fafafa;
  padding:12px;
  margin-bottom:10px;
  font-size:14px;
  line-height:1.45;
}

.cart-item strong{
  font-size:16px;
}

.cart-item button{
  margin-top:8px;
  background:#222;
  color:white;
  border:0;
  border-radius:7px;
  padding:8px 10px;
  font-weight:800;
}

.empty-cart{
  text-align:center;
  color:#777;
  padding:20px 0;
}

.hidden{display:none!important}

.ingredients-section{
  background:white;
  padding:76px 5vw;
}

.ingredient-banner{
  display:grid;
  grid-template-columns:1fr 420px;
  gap:40px;
  align-items:center;
  max-width:1180px;
  margin:0 auto 34px;
}

.ingredient-banner img{
  width:100%;
  filter:drop-shadow(0 25px 25px rgba(0,0,0,.16));
}

.ingredient-banner p{
  font-size:18px;
  color:#666;
  line-height:1.5;
}

.ingredient-photo-grid{
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:18px;
}

.ingredient-photo-grid img{
  width:100%;
  height:170px;
  object-fit:cover;
  border-radius:16px;
  background:#f6f6f6;
}

.location-section{
  padding:78px 5vw;
  background:
    linear-gradient(90deg, rgba(0,0,0,.82), rgba(0,0,0,.25)),
    url("assets/hero-pizza.jpeg");
  background-size:cover;
  background-position:center;
}

.location-card{
  max-width:560px;
  background:white;
  padding:34px;
  border-radius:18px;
  box-shadow:var(--shadow);
}

.location-card p{
  color:#666;
  line-height:1.5;
}

.footer{
  background:white;
  text-align:center;
  padding:34px 5vw;
  border-top:1px solid var(--border);
}

.footer img{
  width:220px;
  margin-bottom:12px;
}

.footer p{
  font-weight:900;
  margin:8px 0;
}

.footer small{
  color:#777;
}

@media(max-width:1150px){
  .nav,.header-cta{display:none}
  .mobile-menu{display:block}
  .nav.open{
    display:grid;
    position:absolute;
    top:86px;
    left:0;
    right:0;
    background:white;
    padding:22px 5vw;
    border-bottom:1px solid var(--border);
  }
  .menu-grid,
  .builder-layout,
  .ingredient-banner{
    grid-template-columns:1fr;
  }
  .summary-column{position:static}
  .pizza-preview-card{grid-template-columns:220px 1fr}
  .quick-strip{grid-template-columns:1fr}
}

@media(max-width:760px){
  .topbar{height:74px;padding:0 18px}
  .brand img{width:165px}
  .cart-icon{font-size:22px}
  .hero{min-height:560px}
  .hero-content{padding:56px 22px}
  .hero h1{font-size:58px}
  .hero-text{font-size:18px}
  .section,.builder-section,.ingredients-section,.location-section{padding:54px 22px}
  .menu-grid,.ingredient-photo-grid{grid-template-columns:1fr}
  .pizza-preview-card{grid-template-columns:1fr}
  .pizza-visual{width:100%;height:260px}
  .selector-heading{display:block}
  .ingredients-grid,.ingredients-grid.compact,.half-columns{grid-template-columns:1fr}
  .steps-progress{overflow-x:auto}
  .floating{display:none}
}


/* ===============================
   ORDER FORM + RESTRICTIONS
   =============================== */

.small-warning{
  color:var(--red)!important;
  font-weight:900;
  font-size:13px;
  min-height:auto!important;
  margin-top:8px;
}

.disabled-button,
button:disabled{
  opacity:.55;
  cursor:not-allowed!important;
  transform:none!important;
}

.disabled-option{
  opacity:.62;
  cursor:not-allowed;
}

.disabled-option small{
  display:block;
  color:#777;
  font-size:11px;
  text-transform:uppercase;
  margin-top:2px;
}

.customer-form{
  display:grid;
  gap:12px;
}

.customer-form label{
  display:grid;
  gap:6px;
  font-weight:900;
  font-size:14px;
}

.customer-form input,
.customer-form textarea{
  width:100%;
  border:2px solid #e6e6e6;
  border-radius:10px;
  padding:12px;
  font-size:14px;
  font-family:var(--font-body);
  outline:none;
  background:#fafafa;
}

.customer-form input:focus,
.customer-form textarea:focus{
  border-color:var(--red);
  background:white;
}

.field-error{
  border-color:var(--red)!important;
  background:#fff2f2!important;
}

.payment-warning,
.schedule-warning{
  margin-top:14px;
  border-radius:12px;
  padding:12px;
  line-height:1.45;
}

.payment-warning{
  background:#fff2f2;
  border:1px solid #ffd1d1;
}

.schedule-warning{
  background:#f5f1eb;
  border:1px solid #e8ded0;
}

.payment-warning strong,
.schedule-warning strong{
  display:block;
  color:var(--red);
  text-transform:uppercase;
  margin-bottom:4px;
}

.payment-warning p,
.schedule-warning p{
  margin:0;
  color:#4e4e4e;
  font-size:14px;
}

.premium-extra{
  color:var(--red);
  font-weight:900;
}

.option-note{
  display:block;
  color:#777;
  font-size:11px;
  text-transform:uppercase;
  margin-top:3px;
}


/* ===============================
   CALORIES DISPLAY
   =============================== */

.calories-line{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:10px 0;
  border-bottom:1px dashed #ccc;
}

.calories-line strong{
  color:var(--red);
  font-size:20px;
}

.calories-note{
  background:#fff8e6;
  border:1px solid #f1ddad;
  color:#5c4a1f;
  padding:10px 12px;
  border-radius:10px;
  font-size:13px;
  line-height:1.4;
  margin-top:10px;
}


/* ===============================
   ACTUALIZACIÓN: HERO DERECHA + MAPA
   =============================== */

.hero{
  justify-content:flex-end;
}

.hero-content{
  margin-left:auto;
  margin-right:0;
  text-align:right;
  display:flex;
  flex-direction:column;
  align-items:flex-end;
}

.hero-actions{
  justify-content:flex-end;
}

.ingredient-banner{
  grid-template-columns:1fr;
  max-width:900px;
  text-align:center;
}

.ingredient-banner img{
  display:none;
}

.location-section{
  padding:78px 5vw;
  background:
    linear-gradient(90deg, rgba(0,0,0,.86), rgba(0,0,0,.44)),
    url("assets/hero-pizza.jpeg");
  background-size:cover;
  background-position:center;
}

.location-layout{
  max-width:1180px;
  margin:0 auto;
  display:grid;
  grid-template-columns:0.9fr 1.1fr;
  gap:28px;
  align-items:stretch;
}

.location-card{
  max-width:none;
  height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.location-info{
  display:grid;
  gap:14px;
  margin:18px 0 24px;
}

.location-info p{
  margin:0;
  color:#444;
  font-size:17px;
  line-height:1.45;
}

.location-info strong{
  color:var(--black);
  text-transform:uppercase;
  font-size:13px;
  letter-spacing:.5px;
}

.location-info a{
  color:var(--red);
  font-weight:900;
  text-decoration:none;
}

.map-card{
  background:white;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
  min-height:430px;
}

.map-card iframe{
  width:100%;
  height:100%;
  min-height:430px;
  border:0;
  display:block;
}

@media(max-width:1150px){
  .location-layout{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .hero{
    justify-content:center;
  }

  .hero-content{
    text-align:left;
    align-items:flex-start;
    margin-left:0;
  }

  .hero-actions{
    justify-content:flex-start;
  }

  .map-card,
  .map-card iframe{
    min-height:330px;
  }
}


/* ===============================
   ACTUALIZACIÓN: FOTOS MENÚ SIN FONDO
   =============================== */

.pizza-card img.menu-product-img{
  object-fit:contain;
  background:linear-gradient(180deg,#ffffff 0%,#fff8f8 100%);
  padding:18px;
  height:280px;
  aspect-ratio:auto;
}

.rule-card p{
  line-height:1.55;
}

@media(max-width:760px){
  .pizza-card img.menu-product-img{
    height:240px;
  }
}


/* Ajuste fino: imágenes de menú reales sin fondo */
.pizza-card img.menu-product-img{
  object-fit:contain!important;
  background:#ffffff!important;
  padding:12px 18px 0!important;
  height:290px!important;
}
@media(max-width:760px){.pizza-card img.menu-product-img{height:245px!important;}}


/* ===== FIX LOGO HEADER/FOOTER ===== */
.brand{
  display:flex;
  align-items:center;
}
.brand img{
  width:185px !important;
  height:auto !important;
  display:block;
  object-fit:contain;
  background:transparent !important;
}

.footer img{
  width:205px !important;
  height:auto !important;
  display:block;
  margin:0 auto 12px auto;
  object-fit:contain;
  background:transparent !important;
}


/* ===== ENCABEZADOS DE INGREDIENTES ===== */
.ingredient-heading{
  grid-column:1 / -1;
  margin:18px 0 2px;
  padding:10px 12px;
  background:var(--black);
  color:white;
  border-left:5px solid var(--red);
  border-radius:8px;
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:24px;
  letter-spacing:.4px;
}

.ingredient-heading:first-child{
  margin-top:0;
}


/* =====================================
   MOBILE IMPROVEMENTS - FLAME PIZZA
   ===================================== */

/* Better product images */
.menu-product-img{
  object-fit:contain !important;
  background:linear-gradient(180deg,#f8f8f8 0%, #ffffff 100%) !important;
  padding:18px;
}

/* Mobile sticky actions */
.mobile-sticky-bar{
  display:none;
}

@media(max-width:900px){
  .builder-layout{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .builder-steps{order:1;}
  .pizza-workspace{order:2;}
  .summary-column{order:3; position:static !important;}

  .pizza-preview-card{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .pizza-visual{
    width:100% !important;
    max-width:420px;
    margin:0 auto;
    height:260px !important;
  }

  .selector-heading{
    display:block !important;
  }

  .selector-heading p{
    max-width:none !important;
    margin-top:8px !important;
  }

  .ingredients-grid,
  .ingredients-grid.compact{
    grid-template-columns:1fr !important;
  }

  .half-columns{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:760px){
  body{
    padding-bottom:84px;
  }

  .topbar{
    height:72px !important;
    padding:0 14px !important;
    gap:12px !important;
  }

  .brand img{
    width:150px !important;
  }

  .cart-icon{
    margin-left:0;
  }

  .nav.open{
    display:grid !important;
    gap:14px !important;
    position:absolute;
    top:72px;
    left:0;
    right:0;
    background:#ffffff;
    padding:18px 20px;
    box-shadow:0 12px 30px rgba(0,0,0,.10);
    z-index:999;
  }

  .nav.open a{
    padding:10px 0;
    border-bottom:1px solid #efefef;
  }

  .hero{
    min-height:72vh !important;
    justify-content:center !important;
    align-items:flex-end !important;
  }

  .hero-overlay{
    background:
      linear-gradient(180deg, rgba(0,0,0,.24) 0%, rgba(0,0,0,.58) 48%, rgba(0,0,0,.88) 100%) !important;
  }

  .hero-content{
    text-align:left !important;
    align-items:flex-start !important;
    width:100%;
    max-width:none !important;
    margin:0 !important;
    padding:32px 20px 28px !important;
  }

  .hero h1{
    font-size:48px !important;
    line-height:.92 !important;
    margin-bottom:14px !important;
  }

  .hero-text{
    font-size:17px !important;
    line-height:1.45 !important;
    margin-bottom:18px !important;
    max-width:340px !important;
  }

  .hero-actions{
    width:100%;
    gap:10px !important;
    justify-content:flex-start !important;
    flex-direction:column;
  }

  .hero-actions .btn{
    width:100%;
    min-height:52px !important;
    font-size:15px !important;
  }

  .quick-strip{
    padding:16px 20px !important;
    gap:14px !important;
  }

  .section,
  .builder-section,
  .ingredients-section,
  .location-section{
    padding:44px 20px !important;
  }

  .section-title h2,
  .builder-title h2,
  .ingredient-banner h2,
  .location-card h2{
    font-size:38px !important;
  }

  .section-title p,
  .builder-title p,
  .ingredient-banner p,
  .location-card p{
    font-size:16px !important;
  }

  .menu-grid{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .pizza-card{
    border-radius:16px !important;
  }

  .pizza-card img{
    aspect-ratio:1.15/1 !important;
  }

  .pizza-card-body{
    padding:18px !important;
  }

  .pizza-card h3{
    font-size:30px !important;
  }

  .card-footer{
    margin-top:16px !important;
  }

  .card-footer strong{
    font-size:28px !important;
  }

  .builder-section{
    background-position:center !important;
  }

  .builder-title{
    margin-bottom:18px !important;
  }

  .steps-progress{
    margin-bottom:16px !important;
    overflow:auto;
    gap:10px;
  }

  .progress-line{
    min-width:22px;
  }

  .config-card,
  .rule-card,
  .pizza-workspace,
  .summary-card{
    padding:16px !important;
    border-radius:14px !important;
  }

  .config-card h3,
  .rule-card strong,
  .summary-card h3,
  .selector-heading h3,
  .half-columns h4,
  .pizza-preview-card h3{
    font-size:24px !important;
  }

  .rule-card p{
    font-size:14px !important;
  }

  .customer-form input,
  .customer-form textarea{
    font-size:16px !important; /* avoid iOS zoom */
  }

  .location-layout{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .map-card,
  .map-card iframe{
    min-height:280px !important;
  }

  .mobile-sticky-bar{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:9999;
    background:rgba(255,255,255,.98);
    border-top:1px solid #e8e8e8;
    box-shadow:0 -8px 30px rgba(0,0,0,.10);
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    display:grid;
    grid-template-columns:1fr 1.2fr;
    gap:10px;
  }

  .mobile-sticky-link{
    min-height:52px;
    border-radius:12px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    text-decoration:none;
    text-transform:uppercase;
    font-size:14px;
    letter-spacing:.2px;
  }

  .mobile-sticky-link.light{
    background:#f4f4f4;
    color:#1f1f1f;
  }

  .mobile-sticky-link.strong{
    background:var(--red);
    color:#fff;
  }

  .footer{
    padding-bottom:110px !important;
  }
}


/* ===== REGLA DE BASES ===== */
.ingredient-option:has(input[type="checkbox"]) small{
  line-height:1.25;
}

.base-rule-note{
  background:#fff3f3;
  border:1px solid #ffd0d0;
  color:#6b1717;
  padding:10px 12px;
  border-radius:10px;
  font-size:13px;
  line-height:1.35;
  margin-top:10px;
}


/* ===============================
   CLEANUP + HALF/HALF OVERFLOW FIX + TOAST
   =============================== */

html,
body{
  max-width:100%;
  overflow-x:hidden;
}

.builder-layout,
.pizza-workspace,
.builder-steps,
.summary-column,
.selector-panel,
.half-columns,
.ingredients-grid,
.ingredient-option{
  min-width:0;
}

.pizza-workspace{
  overflow:hidden;
}

.half-columns{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  width:100%;
  max-width:100%;
}

.half-columns > div{
  min-width:0;
  max-width:100%;
}

.ingredients-grid{
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
}

.ingredients-grid.compact{
  grid-template-columns:1fr !important;
}

.ingredient-option{
  width:100%;
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}

.ingredient-heading{
  max-width:100%;
  overflow-wrap:anywhere;
}

.selector-heading{
  margin-bottom:14px;
}

.selector-heading h3{
  margin-bottom:0;
}

.cart-toast{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:10000;
  background:#ffffff;
  color:var(--black);
  border-left:6px solid var(--red);
  box-shadow:0 18px 50px rgba(0,0,0,.22);
  border-radius:14px;
  padding:16px 18px;
  min-width:280px;
  transform:translateY(30px);
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}

.cart-toast.show{
  opacity:1;
  transform:translateY(0);
}

.cart-toast strong{
  display:block;
  font-size:16px;
  text-transform:uppercase;
  margin-bottom:4px;
}

.cart-toast span{
  display:block;
  color:#666;
  font-size:14px;
}

@media(max-width:1180px){
  .builder-layout{
    grid-template-columns:1fr !important;
  }

  .summary-column{
    position:static !important;
  }

  .half-columns{
    grid-template-columns:1fr !important;
  }

  .ingredients-grid,
  .ingredients-grid.compact{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:760px){
  .cart-toast{
    left:14px;
    right:14px;
    bottom:92px;
    min-width:0;
  }

  .pizza-workspace{
    padding:14px !important;
  }

  .half-columns{
    gap:16px !important;
  }
}


/* ===== CANTIDAD DE PIZZAS IGUALES EN CARRITO ===== */
.cart-quantity{
  display:inline-block;
  margin-right:6px;
  color:var(--red);
  font-weight:900;
}

.cart-item button + button{
  margin-left:6px;
}

@media(max-width:760px){
  .cart-item button{
    width:100%;
    margin-top:8px;
  }

  .cart-item button + button{
    margin-left:0;
  }
}


/* ===== AVISO GRANDE AL AGREGAR AL CARRITO ===== */
.cart-toast{
  position:fixed !important;
  right:24px !important;
  bottom:24px !important;
  z-index:10000 !important;
  background:#ffffff !important;
  color:var(--black) !important;
  border:2px solid rgba(223,48,53,.18) !important;
  border-left:8px solid var(--red) !important;
  box-shadow:0 22px 60px rgba(0,0,0,.26) !important;
  border-radius:18px !important;
  padding:16px !important;
  min-width:340px !important;
  max-width:420px !important;
  display:grid !important;
  grid-template-columns:46px 1fr auto !important;
  gap:12px !important;
  align-items:center !important;
  transform:translateY(34px) scale(.96) !important;
  opacity:0 !important;
  pointer-events:none !important;
  transition:.24s ease !important;
}

.cart-toast.show{
  opacity:1 !important;
  transform:translateY(0) scale(1) !important;
  pointer-events:auto !important;
}

.cart-toast-icon{
  width:46px;
  height:46px;
  border-radius:50%;
  background:var(--red);
  color:white;
  display:grid;
  place-items:center;
  font-weight:900;
  font-size:26px;
}

.cart-toast-text strong{
  display:block;
  font-size:18px;
  text-transform:uppercase;
  margin-bottom:3px;
}

.cart-toast-text span{
  display:block;
  color:#555;
  font-size:14px;
}

.cart-toast button{
  border:0;
  background:var(--red);
  color:white;
  border-radius:10px;
  padding:11px 13px;
  font-weight:900;
  text-transform:uppercase;
  white-space:nowrap;
}

@media(max-width:760px){
  .cart-toast{
    left:14px !important;
    right:14px !important;
    bottom:92px !important;
    min-width:0 !important;
    max-width:none !important;
    grid-template-columns:42px 1fr !important;
  }

  .cart-toast button{
    grid-column:1 / -1;
    width:100%;
  }
}


/* =====================================
   NAVBAR FIJO + REGLA QUESOS
   ===================================== */

.topbar{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  z-index:10000 !important;
}

body{
  padding-top:86px;
}

.mobile-menu{
  flex-shrink:0;
}

.cart-icon{
  flex-shrink:0;
}

@media(max-width:760px){
  body{
    padding-top:72px;
  }

  .nav.open{
    position:fixed !important;
    top:72px !important;
    left:0 !important;
    right:0 !important;
    z-index:9999 !important;
  }
}

/* Encabezado Quesos y límites */
.ingredient-option small{
  line-height:1.25;
}


/* =====================================
   ASISTENTE PASO A PASO DE INGREDIENTES
   ===================================== */

.selector-heading{
  margin-bottom:16px !important;
}

.selector-heading h3{
  color:var(--black);
}

.half-step-intro{
  background:#fff4f4;
  border:1px solid #ffd5d5;
  color:#5f1f1f;
  padding:12px 14px;
  border-radius:12px;
  font-weight:800;
  margin-bottom:14px;
  line-height:1.35;
}

.premium-step-note{
  grid-column:1 / -1;
  background:#fff4f4;
  border:1px solid #ffd5d5;
  color:#5f1f1f;
  padding:12px 14px;
  border-radius:12px;
  font-size:14px;
  font-weight:800;
  line-height:1.35;
}

.ingredient-wizard-controls{
  margin-top:18px;
  border-top:1px solid #e7e0d8;
  padding-top:16px;
}

.wizard-progress-text{
  font-weight:900;
  text-transform:uppercase;
  color:#555;
  font-size:13px;
  margin-bottom:10px;
  letter-spacing:.4px;
}

.wizard-buttons{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.wizard-btn{
  border:0;
  min-height:52px;
  border-radius:12px;
  text-transform:uppercase;
  font-weight:900;
  font-size:14px;
}

.wizard-btn.primary{
  background:var(--red);
  color:white;
}

.wizard-btn.secondary{
  background:#242626;
  color:white;
}

.wizard-btn:disabled{
  opacity:.35;
  cursor:not-allowed;
}

@media(max-width:760px){
  .wizard-buttons{
    grid-template-columns:1fr;
  }

  .wizard-btn{
    min-height:54px;
  }
}


/* =====================================
   CART PAGE / VISTA CLARA DE CARRITO
   ===================================== */

.sauce-note{
  grid-column:1 / -1;
  margin:12px 0 0;
  background:#f6f1eb;
  border:1px solid #e9ded0;
  color:#4d443b;
  padding:10px 12px;
  border-radius:10px;
  font-size:13px;
  font-weight:800;
  line-height:1.35;
}

.cart-page-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.55);
  z-index:10001;
  opacity:0;
  pointer-events:none;
  transition:.2s ease;
}

.cart-page-overlay.show{
  opacity:1;
  pointer-events:auto;
}

.cart-page{
  position:fixed;
  top:0;
  right:0;
  bottom:0;
  width:min(620px, 94vw);
  background:#fff;
  z-index:10002;
  transform:translateX(105%);
  transition:.24s ease;
  box-shadow:-24px 0 70px rgba(0,0,0,.28);
  padding:28px;
  overflow:auto;
}

.cart-page.show{
  transform:translateX(0);
}

.cart-page-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  border-bottom:1px solid #ececec;
  padding-bottom:18px;
  margin-bottom:18px;
}

.cart-page-header h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:44px;
  line-height:.95;
  margin:0;
}

.cart-page-close{
  width:44px;
  height:44px;
  border-radius:50%;
  border:0;
  background:#111;
  color:#fff;
  font-size:30px;
  line-height:1;
}

.cart-page-items{
  display:grid;
  gap:14px;
}

.cart-page-empty{
  text-align:center;
  padding:34px 20px;
  background:#f8f8f8;
  border-radius:16px;
}

.cart-page-empty strong{
  display:block;
  font-size:22px;
  text-transform:uppercase;
  margin-bottom:8px;
}

.cart-page-item{
  display:grid;
  grid-template-columns:1fr auto;
  gap:18px;
  border:1px solid #e6e6e6;
  border-radius:16px;
  padding:16px;
  background:#fbfbfb;
}

.cart-page-item h3{
  margin:0 0 8px;
  font-size:24px;
  text-transform:uppercase;
}

.cart-page-item p{
  margin:6px 0;
  color:#555;
  line-height:1.4;
}

.cart-page-price{
  display:grid;
  align-content:start;
  justify-items:end;
  gap:8px;
}

.cart-page-price strong{
  color:var(--red);
  font-size:24px;
}

.cart-page-price button{
  border:0;
  background:#111;
  color:#fff;
  padding:9px 11px;
  border-radius:8px;
  font-weight:900;
}

.cart-page-total{
  position:sticky;
  bottom:0;
  background:#fff;
  border-top:2px solid #ececec;
  margin-top:16px;
  padding:18px 0 8px;
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:center;
}

.cart-page-total > strong{
  color:var(--red);
  font-size:28px;
}

.cart-page-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:18px;
  padding-bottom:18px;
}

@media(max-width:760px){
  .cart-page{
    width:100vw;
    padding:20px;
  }

  .cart-page-header h2{
    font-size:36px;
  }

  .cart-page-item{
    grid-template-columns:1fr;
  }

  .cart-page-price{
    justify-items:stretch;
  }

  .cart-page-price strong{
    font-size:26px;
  }

  .cart-page-total{
    display:grid;
    gap:8px;
  }

  .cart-page-actions{
    grid-template-columns:1fr;
    padding-bottom:90px;
  }
}


/* ===== FORMATO TELÉFONO Y COMUNA ===== */
.field-help{
  display:block;
  color:#777;
  font-size:12px;
  font-weight:700;
  line-height:1.3;
  margin-top:-2px;
}


/* =====================================
   MODAL DESPUÉS DE AGREGAR AL CARRITO
   ===================================== */

.next-pizza-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.58);
  z-index:10003;
  opacity:0;
  pointer-events:none;
  transition:.2s ease;
}

.next-pizza-overlay.show{
  opacity:1;
  pointer-events:auto;
}

.next-pizza-modal{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -44%) scale(.96);
  width:min(460px, 92vw);
  background:#fff;
  border-radius:22px;
  z-index:10004;
  padding:30px;
  box-shadow:0 28px 80px rgba(0,0,0,.32);
  text-align:center;
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}

.next-pizza-modal.show{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%, -50%) scale(1);
}

.next-pizza-close{
  position:absolute;
  top:14px;
  right:14px;
  width:36px;
  height:36px;
  border-radius:50%;
  border:0;
  background:#111;
  color:#fff;
  font-size:26px;
  line-height:1;
}

.next-pizza-icon{
  width:70px;
  height:70px;
  border-radius:50%;
  background:#fff1f1;
  display:grid;
  place-items:center;
  font-size:38px;
  margin:0 auto 12px;
}

.next-pizza-modal h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:42px;
  line-height:.95;
  margin:0 0 8px;
}

.next-pizza-modal p{
  margin:0 0 20px;
  color:#555;
  font-weight:800;
}

.next-pizza-actions{
  display:grid;
  gap:10px;
}

.next-action{
  border:0;
  min-height:54px;
  border-radius:13px;
  font-weight:900;
  text-transform:uppercase;
  font-size:15px;
}

.next-action.strong{
  background:var(--red);
  color:#fff;
}

.next-action.dark{
  background:#111;
  color:#fff;
}

.next-action.whatsapp{
  background:#25D366;
  color:#fff;
}

@media(max-width:760px){
  .next-pizza-modal{
    padding:24px 18px;
  }

  .next-pizza-modal h2{
    font-size:36px;
  }
}


/* ===== VALIDACIÓN NOMBRE/APELLIDO Y COMUNA ===== */
.customer-form select{
  width:100%;
  border:2px solid #e6e6e6;
  border-radius:10px;
  padding:12px;
  font-size:14px;
  font-family:var(--font-body);
  outline:none;
  background:#fafafa;
}

.customer-form select:focus{
  border-color:var(--red);
  background:white;
}

@media(max-width:760px){
  .customer-form select{
    font-size:16px;
  }
}


/* =====================================
   MODAL ÉXITO WHATSAPP / CONFIRMACIÓN
   ===================================== */

.order-success-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.58);
  z-index:10005;
  opacity:0;
  pointer-events:none;
  transition:.2s ease;
}

.order-success-overlay.show{
  opacity:1;
  pointer-events:auto;
}

.order-success-modal{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -44%) scale(.96);
  width:min(520px, 92vw);
  background:#fff;
  border-radius:22px;
  z-index:10006;
  padding:32px;
  box-shadow:0 30px 90px rgba(0,0,0,.34);
  text-align:center;
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}

.order-success-modal.show{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%, -50%) scale(1);
}

.order-success-close{
  position:absolute;
  top:14px;
  right:14px;
  width:36px;
  height:36px;
  border-radius:50%;
  border:0;
  background:#111;
  color:#fff;
  font-size:26px;
  line-height:1;
}

.order-success-icon{
  width:72px;
  height:72px;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  display:grid;
  place-items:center;
  font-size:42px;
  font-weight:900;
  margin:0 auto 14px;
}

.order-success-modal h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:44px;
  line-height:.95;
  margin:0 0 10px;
}

.order-success-modal p{
  color:#555;
  font-weight:800;
  line-height:1.45;
  margin:0 0 12px;
}

.order-success-important{
  background:#fff4f4;
  border:1px solid #ffd0d0;
  color:#6b1717!important;
  padding:14px;
  border-radius:12px;
}

@media(max-width:760px){
  .order-success-modal{
    padding:26px 18px;
  }

  .order-success-modal h2{
    font-size:36px;
  }
}


/* ===== FIX FINAL WHATSAPP CONFIRMATION MODAL ===== */
.order-success-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.58);
  z-index:10005;
  opacity:0;
  pointer-events:none;
  transition:.2s ease;
}

.order-success-overlay.show{
  opacity:1;
  pointer-events:auto;
}

.order-success-modal{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -44%) scale(.96);
  width:min(520px, 92vw);
  background:#fff;
  border-radius:22px;
  z-index:10006;
  padding:32px;
  box-shadow:0 30px 90px rgba(0,0,0,.34);
  text-align:center;
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}

.order-success-modal.show{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%, -50%) scale(1);
}

.order-success-close{
  position:absolute;
  top:14px;
  right:14px;
  width:36px;
  height:36px;
  border-radius:50%;
  border:0;
  background:#111;
  color:#fff;
  font-size:26px;
  line-height:1;
}

.order-success-icon{
  width:72px;
  height:72px;
  border-radius:50%;
  background:#25D366;
  color:#fff;
  display:grid;
  place-items:center;
  font-size:42px;
  font-weight:900;
  margin:0 auto 14px;
}

.order-success-modal h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:44px;
  line-height:.95;
  margin:0 0 10px;
}

.order-success-modal p{
  color:#555;
  font-weight:800;
  line-height:1.45;
  margin:0 0 12px;
}

.order-success-important{
  background:#fff4f4;
  border:1px solid #ffd0d0;
  color:#6b1717!important;
  padding:14px;
  border-radius:12px;
}

@media(max-width:760px){
  .order-success-modal{
    padding:26px 18px;
  }

  .order-success-modal h2{
    font-size:36px;
  }
}


/* =====================================
   DELIVERY ZONES / ISOCRONAS
   ===================================== */

.delivery-zone-notice{
  display:none;
  border-radius:10px;
  padding:10px 12px;
  font-size:13px;
  line-height:1.35;
  font-weight:800;
}

.delivery-zone-notice.ok{
  display:block;
  background:#eefcf3;
  border:1px solid #c9f1d8;
  color:#155f2b;
}

.delivery-zone-notice.error{
  display:block;
  background:#fff2f2;
  border:1px solid #ffd0d0;
  color:#7a1717;
}

.delivery-table-card{
  margin-top:14px;
  background:#f8f3ec;
  border:1px solid #e6d8c4;
  border-radius:12px;
  padding:12px;
}

.delivery-table-card > strong{
  display:block;
  color:var(--red);
  text-transform:uppercase;
  font-size:13px;
  margin-bottom:4px;
}

.delivery-table-card p{
  margin:0 0 10px;
  color:#555;
  font-size:13px;
  line-height:1.35;
}

.delivery-rates{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
  background:white;
  border-radius:10px;
  overflow:hidden;
}

.delivery-rates th,
.delivery-rates td{
  border-bottom:1px solid #eee;
  padding:8px;
  text-align:left;
}

.delivery-rates th{
  background:#111;
  color:white;
  text-transform:uppercase;
  font-size:11px;
}

.highlight-customer-card{
  animation:customerPulse 1.3s ease 0s 2;
}

@keyframes customerPulse{
  0%{box-shadow:0 0 0 0 rgba(223,48,53,.45);}
  100%{box-shadow:0 0 0 18px rgba(223,48,53,0);}
}

@media(max-width:760px){
  .delivery-rates{
    font-size:11px;
  }

  .delivery-rates th,
  .delivery-rates td{
    padding:7px 6px;
  }
}


/* ===== MULTIPLES SALSAS Y QUESOS ===== */
.sauce-note{
  display:none;
}


/* =====================================
   ADDONS FLOW: BEBIDAS, PALITOS Y POSTRES
   ===================================== */

.addon-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.62);
  z-index:10007;
  opacity:0;
  pointer-events:none;
  transition:.2s ease;
}

.addon-overlay.show{
  opacity:1;
  pointer-events:auto;
}

.addon-modal{
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -44%) scale(.96);
  width:min(760px, 94vw);
  max-height:88vh;
  overflow:auto;
  background:white;
  border-radius:22px;
  z-index:10008;
  padding:28px;
  box-shadow:0 30px 90px rgba(0,0,0,.34);
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}

.addon-modal.show{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%, -50%) scale(1);
}

.addon-close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border-radius:50%;
  border:0;
  background:#111;
  color:white;
  font-size:26px;
  line-height:1;
}

.addon-modal h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:46px;
  line-height:.95;
  margin:0 0 8px;
}

.addon-subtitle{
  color:#555;
  font-weight:800;
  margin:0 0 18px;
}

.addon-options{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}

.addon-card{
  display:grid;
  grid-template-columns:1fr auto;
  gap:14px;
  align-items:center;
  border:1px solid #e6e6e6;
  background:#fbfbfb;
  border-radius:14px;
  padding:14px;
}

.addon-card strong{
  display:block;
  font-size:17px;
  text-transform:uppercase;
}

.addon-card p{
  margin:6px 0;
  color:#555;
  font-size:13px;
  line-height:1.35;
}

.addon-card span{
  display:block;
  margin-top:5px;
  color:var(--red);
  font-weight:900;
  font-size:18px;
}

.addon-card button{
  border:0;
  background:var(--red);
  color:white;
  border-radius:10px;
  padding:11px 13px;
  font-weight:900;
  text-transform:uppercase;
}

.addon-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:18px;
}

.addon-primary,
.addon-secondary{
  border:0;
  min-height:54px;
  border-radius:12px;
  font-weight:900;
  text-transform:uppercase;
}

.addon-primary{
  background:var(--red);
  color:white;
}

.addon-secondary{
  background:#111;
  color:white;
}

@media(max-width:760px){
  .addon-modal{
    padding:24px 16px;
    width:96vw;
  }

  .addon-modal h2{
    font-size:36px;
  }

  .addon-options{
    grid-template-columns:1fr;
  }

  .addon-card{
    grid-template-columns:1fr;
  }

  .addon-card button{
    width:100%;
    min-height:46px;
  }

  .addon-actions{
    grid-template-columns:1fr;
    padding-bottom:20px;
  }
}


/* ===== FIX ADDONS WITH IMAGES + QUANTITY CONTROLS ===== */
.addon-card{
  display:grid !important;
  grid-template-columns:120px 1fr auto !important;
  gap:14px !important;
  align-items:center !important;
}

.addon-card img{
  width:120px;
  height:96px;
  object-fit:cover;
  border-radius:12px;
  background:#f5f5f5;
  border:1px solid #ededed;
}

.addon-card-content strong{
  display:block;
  font-size:17px;
  text-transform:uppercase;
}

.addon-card-content em{
  display:block;
  color:#555;
  font-style:normal;
  font-weight:900;
  margin-top:2px;
}

.addon-card-content span{
  display:block;
  margin-top:5px;
  color:var(--red);
  font-weight:900;
  font-size:18px;
}

.addon-qty-controls{
  display:grid;
  grid-template-columns:40px 32px 40px;
  align-items:center;
  justify-content:end;
  gap:6px;
}

.addon-qty-controls button{
  width:40px;
  height:40px;
  border:0;
  border-radius:10px;
  background:var(--red);
  color:white;
  font-weight:900;
  font-size:22px;
  line-height:1;
}

.addon-qty-controls button:disabled{
  background:#cccccc;
  color:#777777;
  cursor:not-allowed;
}

.addon-qty-controls b{
  text-align:center;
  font-size:18px;
}

@media(max-width:760px){
  .addon-card{
    grid-template-columns:92px 1fr !important;
  }

  .addon-card img{
    width:92px;
    height:82px;
  }

  .addon-qty-controls{
    grid-column:1 / -1;
    grid-template-columns:1fr 48px 1fr;
    width:100%;
  }

  .addon-qty-controls button{
    width:100%;
    height:46px;
  }
}


/* ===== ADDONS SIMPLE WITHOUT REAL PHOTOS ===== */
.addon-modal{
  width:min(680px, 94vw) !important;
  max-height:86vh !important;
}

.addon-options{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:10px !important;
}

.simple-addon-card,
.addon-card.simple-addon-card{
  display:grid !important;
  grid-template-columns:72px 1fr auto !important;
  gap:12px !important;
  align-items:center !important;
  padding:12px !important;
  min-height:auto !important;
}

.addon-image-placeholder{
  width:72px;
  height:62px;
  border-radius:12px;
  border:2px dashed #d8d8d8;
  background:#f8f8f8;
  display:grid;
  place-items:center;
  color:#777;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}

.addon-card-content{
  min-width:0;
}

.addon-card-content strong{
  display:block;
  font-size:15px !important;
  line-height:1.15;
  text-transform:uppercase;
}

.addon-card-content em{
  display:block;
  color:#555;
  font-style:normal;
  font-weight:900;
  margin-top:2px;
  font-size:13px;
}

.addon-card-content p{
  margin:4px 0 !important;
  font-size:12px !important;
  line-height:1.25 !important;
  max-height:48px;
  overflow:auto;
}

.addon-card-content span{
  display:block;
  margin-top:4px;
  color:var(--red);
  font-weight:900;
  font-size:16px;
}

.addon-qty-controls{
  display:grid;
  grid-template-columns:34px 26px 34px;
  align-items:center;
  gap:5px;
}

.addon-qty-controls button{
  width:34px;
  height:34px;
  border:0;
  border-radius:9px;
  background:var(--red);
  color:white;
  font-weight:900;
  font-size:20px;
  line-height:1;
}

.addon-qty-controls button:disabled{
  background:#ccc;
  color:#777;
  cursor:not-allowed;
}

.addon-qty-controls b{
  text-align:center;
  font-size:16px;
}

@media(max-width:760px){
  .simple-addon-card,
  .addon-card.simple-addon-card{
    grid-template-columns:58px 1fr !important;
  }

  .addon-image-placeholder{
    width:58px;
    height:54px;
  }

  .addon-qty-controls{
    grid-column:1 / -1;
    grid-template-columns:1fr 42px 1fr;
    width:100%;
  }

  .addon-qty-controls button{
    width:100%;
    height:42px;
  }
}


/* ===== ADDONS GROUPED + COMPACT FIX ===== */
.addon-modal{
  width:min(720px, 94vw) !important;
  max-height:86vh !important;
  padding:22px !important;
}

.addon-options{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:12px !important;
}

.addon-brand-card{
  display:grid;
  grid-template-columns:74px 1fr;
  gap:12px;
  border:1px solid #e7e7e7;
  background:#fbfbfb;
  border-radius:14px;
  padding:12px;
  align-items:start;
}

.addon-photo-slot{
  width:74px;
  height:74px;
  border-radius:12px;
  border:2px dashed #d2d2d2;
  background:#f5f5f5;
  display:grid;
  place-items:center;
  color:#777;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
}

.addon-brand-content{
  min-width:0;
}

.addon-brand-content h3{
  margin:0 0 8px;
  font-size:18px;
  text-transform:uppercase;
  line-height:1.1;
}

.addon-format{
  margin:0 0 8px;
  font-size:13px;
  font-weight:900;
  color:#555;
}

.addon-description{
  margin:0 0 8px;
  font-size:12px;
  line-height:1.3;
  color:#555;
  max-height:48px;
  overflow:auto;
}

.addon-size-list{
  display:grid;
  gap:8px;
}

.addon-size-row{
  display:grid;
  grid-template-columns:1fr auto;
  gap:10px;
  align-items:center;
  background:white;
  border:1px solid #ededed;
  border-radius:10px;
  padding:8px 10px;
}

.addon-size-row.single{
  margin-top:6px;
}

.addon-size-row strong{
  display:block;
  font-size:13px;
  text-transform:uppercase;
  line-height:1.1;
}

.addon-size-row span{
  display:block;
  color:var(--red);
  font-weight:900;
  font-size:14px;
  margin-top:2px;
}

.addon-qty-controls{
  display:grid;
  grid-template-columns:34px 28px 34px;
  gap:5px;
  align-items:center;
}

.addon-qty-controls button{
  width:34px;
  height:34px;
  border:0;
  border-radius:9px;
  background:var(--red);
  color:white;
  font-weight:900;
  font-size:20px;
  line-height:1;
}

.addon-qty-controls button:disabled{
  background:#ccc;
  color:#777;
  cursor:not-allowed;
}

.addon-qty-controls b{
  text-align:center;
  font-size:16px;
}

.addon-modal-subtotal{
  position:sticky;
  bottom:0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-top:8px;
  background:#fff;
  border:2px solid #eeeeee;
  border-radius:12px;
  padding:12px;
  box-shadow:0 -8px 24px rgba(0,0,0,.06);
}

.addon-modal-subtotal span{
  font-weight:900;
  text-transform:uppercase;
  color:#555;
  font-size:13px;
}

.addon-modal-subtotal strong{
  color:var(--red);
  font-size:22px;
}

@media(max-width:760px){
  .addon-modal{
    width:96vw !important;
    padding:18px 14px !important;
  }

  .addon-brand-card{
    grid-template-columns:58px 1fr;
    gap:10px;
    padding:10px;
  }

  .addon-photo-slot{
    width:58px;
    height:58px;
  }

  .addon-size-row{
    grid-template-columns:1fr;
  }

  .addon-qty-controls{
    grid-template-columns:1fr 38px 1fr;
    width:100%;
  }

  .addon-qty-controls button{
    width:100%;
    height:40px;
  }
}


/* ===== VISIBLE ADDON TOTALS / CHECKOUT SUMMARY ===== */
.addon-order-total{
  position:sticky;
  bottom:0;
  z-index:2;
  background:#fff;
  border:2px solid #ededed;
  border-left:6px solid var(--red);
  border-radius:14px;
  padding:12px;
  margin-top:14px;
  box-shadow:0 -8px 24px rgba(0,0,0,.06);
  display:grid;
  gap:4px;
}

.addon-order-total span{
  font-weight:900;
  text-transform:uppercase;
  font-size:12px;
  color:#555;
}

.addon-order-total strong{
  color:var(--red);
  font-size:28px;
  line-height:1;
}

.addon-order-total small{
  color:#666;
  font-weight:800;
}

.checkout-order-summary{
  background:#fff8ed;
  border:1px solid #f0ddbd;
  border-radius:14px;
  padding:14px;
  display:grid;
  gap:8px;
  margin-bottom:14px;
}

.checkout-order-summary > strong{
  color:var(--red);
  text-transform:uppercase;
}

.checkout-order-summary div{
  display:flex;
  justify-content:space-between;
  gap:12px;
}

.checkout-order-summary .checkout-total{
  border-top:1px solid #e8d1ae;
  padding-top:8px;
  font-size:18px;
}

.checkout-order-summary b{
  color:#111;
}


/* ===== ESTÉTICA PIZZA DEL MES ===== */
.pizza-card img[src*="pizza-del-mes-pepperoni-flame"]{
  object-fit:contain !important;
  background:
    radial-gradient(circle at 50% 45%, rgba(223,48,53,.08), rgba(255,255,255,0) 58%),
    #ffffff !important;
  padding:12px !important;
  transform:scale(1.06);
}

@media(max-width:760px){
  .pizza-card img[src*="pizza-del-mes-pepperoni-flame"]{
    padding:8px !important;
    transform:scale(1.03);
  }
}


/* ===== FORMULARIO CLIENTE: EMAIL, PROMOS Y BBDD ===== */
.promo-check{
  display:grid !important;
  grid-template-columns:22px 1fr;
  gap:10px;
  align-items:start;
  background:#fff4f4;
  border:1px solid #ffd0d0;
  border-radius:12px;
  padding:12px;
  font-weight:800;
  line-height:1.35;
}

.promo-check input{
  width:18px;
  height:18px;
  margin-top:2px;
  accent-color:var(--red);
}

.promo-check span{
  color:#4a1c1c;
  font-size:14px;
}

.orders-db-tools{
  background:#f5f5f5;
  border:1px solid #e1e1e1;
  border-radius:14px;
  padding:14px;
  margin-bottom:14px;
}

.orders-db-tools strong{
  display:block;
  text-transform:uppercase;
  color:var(--red);
  margin-bottom:4px;
}

.orders-db-tools p{
  margin:0 0 10px;
  color:#555;
  font-size:13px;
  line-height:1.35;
}

.orders-db-tools button{
  width:100%;
  border:0;
  background:#111;
  color:white;
  border-radius:10px;
  padding:12px;
  font-weight:900;
  text-transform:uppercase;
}


/* ===== GOOGLE SHEETS CONNECTION STATUS ===== */
.database-endpoint-status{
  border-radius:10px;
  padding:10px 12px;
  font-size:12px;
  font-weight:900;
  line-height:1.35;
  margin-bottom:10px;
}

.database-endpoint-status.ok{
  background:#edf8ef;
  border:1px solid #bde5c4;
  color:#1f6b2d;
}

.database-endpoint-status.warning{
  background:#fff5e6;
  border:1px solid #f0d2a3;
  color:#8a5300;
}


/* ===== OCULTAR HERRAMIENTAS INTERNAS EN WEB PÚBLICA ===== */
.orders-db-tools,
.database-endpoint-status{
  display:none !important;
}


/* ===== SEGURIDAD VISUAL: OCULTAR ACCESO BBDD EN WEB PÚBLICA ===== */
.orders-db-tools,
.database-endpoint-status,
#databaseEndpointStatus,
#exportOrdersCsvBtn,
button[onclick*="exportOrdersCSV"],
*[class*="db-tools"],
*[id*="EndpointStatus"]{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}


/* ===== ESTÉTICA PIZZA 5 TOPPINGS ===== */
.pizza-card img[src*="pizza-5-toppings-flame"]{
  object-fit:contain !important;
  background:
    radial-gradient(circle at 50% 45%, rgba(223,48,53,.08), rgba(255,255,255,0) 58%),
    #ffffff !important;
  padding:12px !important;
  transform:scale(1.05);
}

@media(max-width:760px){
  .pizza-card img[src*="pizza-5-toppings-flame"]{
    padding:8px !important;
    transform:scale(1.03);
  }
}


/* ===== ESTÉTICA PIZZA 5 TOPPINGS Y MAKE YOUR OWN ===== */
.pizza-card img[src*="pizza-5-toppings-flame"],
.pizza-card img[src*="pizza-make-your-own-flame"]{
  object-fit:contain !important;
  background:
    radial-gradient(circle at 50% 45%, rgba(223,48,53,.08), rgba(255,255,255,0) 58%),
    #ffffff !important;
  padding:12px !important;
  transform:scale(1.05);
}

@media(max-width:760px){
  .pizza-card img[src*="pizza-5-toppings-flame"],
  .pizza-card img[src*="pizza-make-your-own-flame"]{
    padding:8px !important;
    transform:scale(1.03);
  }
}


/* ===== FIX VISIBILIDAD TABLA DELIVERY / ISOCRONAS ===== */
.delivery-table-card,
.delivery-table-card *{
  color:#222 !important;
}

.delivery-table-card > strong{
  color:#df3035 !important;
}

.delivery-table-card p{
  color:#555 !important;
}

.delivery-rates th{
  background:#111 !important;
  color:#fff !important;
}

.delivery-rates td{
  color:#222 !important;
  background:#fff !important;
}


/* ===== CUSTOMER DATA POPUP FLOW ===== */
.customer-info-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.66);
  z-index:10020;
  opacity:0;
  pointer-events:none;
  transition:.22s ease;
}

.customer-info-overlay.show{
  opacity:1;
  pointer-events:auto;
}

#cart > .customer-info-card:not(.customer-modal-open){
  display:none !important;
}

.customer-info-card.customer-modal-open{
  display:block !important;
  position:fixed !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%, -50%) !important;
  width:min(560px, 94vw) !important;
  max-height:90vh !important;
  overflow:auto !important;
  z-index:10021 !important;
  box-shadow:0 30px 90px rgba(0,0,0,.38) !important;
  border:0 !important;
}

.customer-modal-intro{
  margin:0 0 14px;
  color:#555;
  font-weight:800;
  line-height:1.35;
}

.customer-save-btn{
  margin-top:14px;
}

.customer-edit-btn{
  margin-bottom:10px;
  background:#111 !important;
  color:#fff !important;
}

@media(max-width:760px){
  .customer-info-card.customer-modal-open{
    width:94vw !important;
    max-height:88vh !important;
    padding:20px !important;
  }
}


/* ===== CUSTOMER POPUP CUADRADO + SCROLL BLOQUEADO ===== */
body.flame-modal-lock{
  overflow:hidden !important;
  height:100vh !important;
  touch-action:none !important;
}

.customer-info-overlay{
  background:rgba(0,0,0,.38) !important;
  backdrop-filter:blur(2px);
}

.customer-info-card.customer-modal-open{
  width:min(920px, 94vw) !important;
  max-height:86vh !important;
  border-radius:22px !important;
  padding:28px !important;
  overflow:auto !important;
}

.customer-info-card.customer-modal-open h3{
  font-size:34px !important;
  margin-bottom:6px !important;
}

.customer-info-card.customer-modal-open .customer-modal-intro{
  max-width:720px;
  margin-bottom:18px !important;
}

.customer-info-card.customer-modal-open .customer-form{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px 16px !important;
}

.customer-info-card.customer-modal-open .customer-form label{
  margin:0 !important;
}

.customer-info-card.customer-modal-open .promo-check,
.customer-info-card.customer-modal-open label:has(#customerAddress),
.customer-info-card.customer-modal-open label:has(#customerComments){
  grid-column:1 / -1;
}

.customer-info-card.customer-modal-open #customerComments{
  min-height:78px;
}

.customer-info-card.customer-modal-open .checkout-order-summary{
  margin-top:16px !important;
}

.customer-info-card.customer-modal-open .payment-warning,
.customer-info-card.customer-modal-open .schedule-warning,
.customer-info-card.customer-modal-open .delivery-table-card{
  margin-top:12px !important;
}

.customer-info-card.customer-modal-open .delivery-table-card{
  max-height:190px;
  overflow:auto;
}

.customer-info-card.customer-modal-open .customer-save-btn{
  min-height:54px;
  margin-top:18px !important;
}

@media(max-width:760px){
  .customer-info-overlay{
    background:rgba(0,0,0,.48) !important;
  }

  .customer-info-card.customer-modal-open{
    width:94vw !important;
    max-height:88vh !important;
    padding:20px !important;
    border-radius:18px !important;
  }

  .customer-info-card.customer-modal-open .customer-form{
    grid-template-columns:1fr !important;
  }

  .customer-info-card.customer-modal-open .promo-check,
  .customer-info-card.customer-modal-open label:has(#customerAddress),
  .customer-info-card.customer-modal-open label:has(#customerComments){
    grid-column:auto;
  }

  .customer-info-card.customer-modal-open h3{
    font-size:28px !important;
  }
}


/* ===== FIX DEFINITIVO POPUP DATOS: CLICK, SCROLL Y ESC ===== */
body.flame-modal-lock{
  overflow:hidden !important;
  height:100vh !important;
}

.customer-info-overlay{
  position:fixed !important;
  inset:0 !important;
  z-index:2147483000 !important;
  background:rgba(0,0,0,.42) !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  pointer-events:auto !important;
}

#customerInfoCard:not(.customer-modal-open){
  display:none !important;
}

#customerInfoCard.customer-modal-open{
  display:block !important;
  position:fixed !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%, -50%) !important;
  width:min(940px, 94vw) !important;
  max-height:86vh !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  z-index:2147483001 !important;
  pointer-events:auto !important;
  filter:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  border-radius:22px !important;
  padding:30px !important;
  background:#fff !important;
  box-shadow:0 26px 90px rgba(0,0,0,.45) !important;
  overscroll-behavior:contain !important;
}

#customerInfoCard.customer-modal-open *{
  pointer-events:auto !important;
}

.customer-popup-close{
  position:sticky;
  top:0;
  float:right;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:#111;
  color:#fff;
  font-size:28px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  z-index:2;
  margin-left:12px;
}

.customer-popup-close:hover{
  background:#df3035;
}

#customerInfoCard.customer-modal-open .customer-form{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:14px 16px !important;
}

#customerInfoCard.customer-modal-open label:has(#customerAddress),
#customerInfoCard.customer-modal-open .promo-check,
#customerInfoCard.customer-modal-open label:has(#customerComments){
  grid-column:1 / -1 !important;
}

#customerInfoCard.customer-modal-open .delivery-table-card{
  max-height:170px !important;
  overflow:auto !important;
}

@media(max-width:760px){
  #customerInfoCard.customer-modal-open{
    width:94vw !important;
    max-height:88vh !important;
    padding:22px !important;
    border-radius:18px !important;
  }

  #customerInfoCard.customer-modal-open .customer-form{
    grid-template-columns:1fr !important;
  }

  #customerInfoCard.customer-modal-open label:has(#customerAddress),
  #customerInfoCard.customer-modal-open .promo-check,
  #customerInfoCard.customer-modal-open label:has(#customerComments){
    grid-column:auto !important;
  }
}


/* ===== FIX URGENTE: OVERLAY INVISIBLE NO DEBE BLOQUEAR CLICKS ===== */
#customerInfoOverlay:not(.show){
  display:none !important;
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

#customerInfoOverlay.show{
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  pointer-events:auto !important;
}

/* Si el formulario no está abierto, tampoco puede capturar clicks */
#customerInfoCard:not(.customer-modal-open){
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}

#customerInfoCard.customer-modal-open{
  visibility:visible !important;
  pointer-events:auto !important;
}


/* ===== REGLAS FLAME DESPLEGABLE ===== */
.rules-dropdown{
  padding:0 !important;
  overflow:hidden;
}

.rules-dropdown summary{
  list-style:none;
  cursor:pointer;
  padding:18px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.rules-dropdown summary::-webkit-details-marker{
  display:none;
}

.rules-dropdown summary span{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:28px;
  letter-spacing:.4px;
}

.rules-dropdown summary b{
  background:#fff;
  color:var(--red);
  border-radius:999px;
  padding:8px 10px;
  font-size:11px;
  text-transform:uppercase;
  white-space:nowrap;
}

.rules-dropdown[open] summary b{
  color:#111;
}

.rules-dropdown p{
  padding:0 20px 20px;
}

/* ===== SECCIÓN MIS PEDIDOS ===== */
.my-orders-section{
  padding:80px 44px;
  background:#f5f5f5;
}

.my-orders-layout{
  max-width:1320px;
  margin:0 auto;
  display:grid;
  grid-template-columns:420px 1fr;
  gap:24px;
  align-items:start;
}

.my-orders-login-card,
.my-orders-history-card{
  background:#fff;
  border-radius:20px;
  padding:26px;
  box-shadow:0 18px 50px rgba(0,0,0,.10);
}

.my-orders-login-card h2,
.my-orders-history-card h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:42px;
  line-height:.95;
  margin:0 0 10px;
}

.my-orders-login-card p{
  color:#555;
  font-weight:800;
  line-height:1.4;
}

.my-orders-form{
  display:grid;
  gap:12px;
  margin-top:18px;
}

.my-orders-form label{
  display:grid;
  gap:6px;
  font-weight:900;
  font-size:13px;
}

.my-orders-form input{
  min-height:46px;
  border:1px solid #ddd;
  border-radius:10px;
  padding:10px 12px;
  font-weight:800;
}

.my-orders-actions{
  display:grid;
  gap:10px;
  margin-top:16px;
}

.btn-dark{
  background:#111 !important;
  color:#fff !important;
}

.profile-status{
  margin-top:14px;
  border-radius:12px;
  padding:12px;
  background:#f3f3f3;
  border:1px solid #e2e2e2;
  display:grid;
  gap:4px;
}

.profile-status.active{
  background:#edf8ef;
  border-color:#bee5c6;
}

.profile-status strong{
  color:#111;
  text-transform:uppercase;
}

.profile-status span{
  color:#555;
  font-weight:800;
  line-height:1.35;
}

.my-orders-header{
  display:flex;
  justify-content:space-between;
  gap:14px;
  align-items:start;
  margin-bottom:18px;
}

.my-orders-list{
  display:grid;
  gap:14px;
}

.empty-orders,
.my-order-card{
  border:1px solid #e7e7e7;
  background:#fbfbfb;
  border-radius:16px;
  padding:16px;
}

.empty-orders strong{
  display:block;
  color:var(--red);
  text-transform:uppercase;
  margin-bottom:6px;
}

.empty-orders p{
  margin:0;
  color:#555;
  font-weight:800;
}

.my-order-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:start;
  border-bottom:1px dashed #ddd;
  padding-bottom:10px;
  margin-bottom:10px;
}

.my-order-top strong{
  display:block;
  text-transform:uppercase;
  color:#111;
}

.my-order-top span{
  display:block;
  color:#777;
  font-weight:800;
  font-size:12px;
}

.my-order-top b{
  color:var(--red);
  font-size:22px;
}

.my-order-card p{
  margin:6px 0;
  color:#444;
  line-height:1.35;
}

.my-order-card details{
  margin-top:10px;
  background:#fff;
  border-radius:10px;
  padding:10px;
}

.my-order-card summary{
  cursor:pointer;
  color:var(--red);
  font-weight:900;
  text-transform:uppercase;
}

@media(max-width:900px){
  .my-orders-section{
    padding:60px 20px;
  }

  .my-orders-layout{
    grid-template-columns:1fr;
  }

  .my-orders-login-card h2,
  .my-orders-history-card h2{
    font-size:34px;
  }
}

/* ===== TOAST MÁS BONITO ===== */
.cart-toast{
  border-left-color:var(--red) !important;
}

.cart-toast-text strong{
  color:#111 !important;
}


/* ===== AUTH LOGIN / REGISTER GLOBAL ===== */
.auth-top-btn{
  border:0;
  border-radius:10px;
  background:#111;
  color:#fff;
  font-weight:900;
  text-transform:uppercase;
  padding:13px 16px;
  cursor:pointer;
  letter-spacing:.3px;
}

.auth-top-btn.logged{
  background:#df3035;
}

.auth-overlay,
.login-required-overlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:2147483100;
  background:rgba(0,0,0,.42);
}

.auth-overlay.show,
.login-required-overlay.show{
  display:block;
}

.auth-modal,
.login-required-modal{
  display:none;
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  z-index:2147483101;
  width:min(520px, 94vw);
  max-height:88vh;
  overflow:auto;
  background:#fff;
  border-radius:22px;
  padding:28px;
  box-shadow:0 30px 90px rgba(0,0,0,.42);
}

.auth-modal.show,
.login-required-modal.show{
  display:block;
}

.auth-close{
  position:absolute;
  right:18px;
  top:18px;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:#111;
  color:#fff;
  font-size:26px;
  font-weight:900;
  cursor:pointer;
}

.auth-modal-header h2,
.login-required-modal h2{
  font-family:var(--font-main);
  font-size:42px;
  line-height:.95;
  text-transform:uppercase;
  margin:0 42px 10px 0;
}

.auth-modal-header p,
.login-required-modal p{
  color:#555;
  font-weight:800;
  line-height:1.38;
}

.auth-tabs{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:18px 0;
  background:#f2f2f2;
  border-radius:14px;
  padding:6px;
}

.auth-tabs button{
  border:0;
  border-radius:10px;
  padding:12px;
  font-weight:900;
  text-transform:uppercase;
  background:transparent;
  cursor:pointer;
}

.auth-tabs button.active{
  background:#df3035;
  color:#fff;
}

.auth-panel{
  display:grid;
  gap:12px;
}

.auth-panel.hidden{
  display:none !important;
}

.auth-panel label{
  display:grid;
  gap:6px;
  font-weight:900;
  font-size:13px;
}

.auth-panel input{
  min-height:46px;
  border:1px solid #ddd;
  border-radius:10px;
  padding:10px 12px;
  font-weight:800;
}

.auth-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.auth-message{
  display:none;
  border-radius:12px;
  padding:10px 12px;
  font-weight:900;
  margin-bottom:12px;
  line-height:1.35;
}

.auth-message.error,
.auth-message.warning,
.auth-message.success,
.auth-message.loading{
  display:block;
}

.auth-message.error{
  background:#fff1f1;
  color:#8b1e1e;
  border:1px solid #ffd0d0;
}

.auth-message.warning{
  background:#fff8e8;
  color:#7a4a00;
  border:1px solid #eed19c;
}

.auth-message.success{
  background:#eef9f0;
  color:#17642c;
  border:1px solid #bde7c5;
}

.auth-message.loading{
  background:#f3f3f3;
  color:#333;
  border:1px solid #ddd;
}

.auth-small-note{
  color:#666;
  font-weight:800;
  line-height:1.35;
}

.login-required-modal{
  text-align:center;
  width:min(460px, 92vw);
}

.login-required-icon{
  font-size:48px;
  margin-bottom:10px;
}

.login-required-actions{
  display:grid;
  gap:10px;
  margin-top:18px;
}

.profile-status.warning{
  background:#fff8e8;
  border-color:#eed19c;
}

@media(max-width:760px){
  .auth-grid{
    grid-template-columns:1fr;
  }

  .auth-modal-header h2,
  .login-required-modal h2{
    font-size:34px;
  }

  .auth-top-btn{
    padding:10px 12px;
    font-size:12px;
  }
}


/* ===== FIX BOTÓN LOGIN EN NAVBAR ===== */
.nav .auth-top-btn,
.header .auth-top-btn,
.auth-top-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border:0;
  border-radius:10px;
  background:#111;
  color:#fff;
  font-weight:900;
  text-transform:uppercase;
  padding:11px 14px;
  cursor:pointer;
  letter-spacing:.3px;
  white-space:nowrap;
}

.nav .auth-top-btn.logged,
.header .auth-top-btn.logged,
.auth-top-btn.logged{
  background:#df3035;
}

@media(max-width:760px){
  .auth-top-btn{
    min-height:38px;
    font-size:11px;
    padding:9px 10px;
  }
}


/* ===== MIS PEDIDOS COMO PESTAÑA INTERNA / MODAL ===== */
.my-orders-section{
  display:none !important;
}

.my-orders-top-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  border:0;
  border-radius:10px;
  background:#fff;
  color:#111;
  font-weight:900;
  text-transform:uppercase;
  padding:11px 14px;
  cursor:pointer;
  letter-spacing:.3px;
  white-space:nowrap;
  box-shadow:inset 0 0 0 1px #ddd;
}

.my-orders-top-btn.active{
  background:#111;
  color:#fff;
  box-shadow:none;
}

.my-orders-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.42);
  z-index:2147483200;
}

.my-orders-overlay.show{
  display:block;
}

.my-orders-panel{
  display:none;
  position:fixed;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  width:min(980px, 94vw);
  max-height:88vh;
  overflow:auto;
  z-index:2147483201;
  background:#fff;
  border-radius:24px;
  padding:32px;
  box-shadow:0 30px 90px rgba(0,0,0,.42);
}

.my-orders-panel.show{
  display:block;
}

.my-orders-panel-header{
  display:flex;
  justify-content:space-between;
  gap:20px;
  align-items:flex-start;
  margin-bottom:18px;
}

.my-orders-panel-header h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:52px;
  line-height:.9;
  margin:0 0 8px;
}

.my-orders-panel-header p{
  margin:0;
  color:#555;
  font-weight:800;
}

.my-orders-panel-close{
  width:46px;
  height:46px;
  border:0;
  border-radius:50%;
  background:#111;
  color:#fff;
  font-size:30px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  flex:0 0 auto;
}

.my-orders-panel-close:hover{
  background:#df3035;
}

.my-orders-account-prompt{
  display:grid;
  gap:10px;
  background:#fff5f5;
  border:1px solid #ffd1d1;
  border-radius:16px;
  padding:18px;
  margin-bottom:16px;
}

.my-orders-account-prompt strong{
  color:#9d1d1d;
  text-transform:uppercase;
  font-size:18px;
}

.my-orders-account-prompt p{
  margin:0;
  color:#555;
  font-weight:800;
}

.my-orders-logged-header{
  display:none;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  border:1px solid #bee5c6;
  background:#edf8ef;
  border-radius:16px;
  padding:14px 16px;
  margin-bottom:16px;
}

.my-orders-logged-header strong{
  display:block;
  color:#111;
  text-transform:uppercase;
  font-size:18px;
}

.my-orders-logged-header span{
  display:block;
  color:#43634a;
  font-weight:800;
  margin-top:3px;
}

.my-orders-panel-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-bottom:14px;
}

.compact-status{
  display:none !important;
}

.my-orders-panel .my-orders-list{
  display:grid;
  gap:14px;
}

.my-orders-panel .my-order-card,
.my-orders-panel .empty-orders{
  box-shadow:none;
}

@media(max-width:760px){
  .my-orders-panel{
    width:94vw;
    max-height:88vh;
    padding:22px;
    border-radius:18px;
  }

  .my-orders-panel-header h2{
    font-size:38px;
  }

  .my-orders-panel-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .my-orders-top-btn{
    min-height:38px;
    font-size:11px;
    padding:9px 10px;
  }
}


/* ===== MIS PEDIDOS COMO VISTA INTERNA, NO POPUP ===== */
body.show-my-orders-page main,
body.show-my-orders-page footer,
body.show-my-orders-page .mobile-sticky-bar{
  display:none !important;
}

body.show-my-orders-page{
  background:#f5f5f5;
  overflow:auto !important;
  height:auto !important;
}

.my-orders-overlay,
.my-orders-overlay.show{
  display:none !important;
  pointer-events:none !important;
  visibility:hidden !important;
}

.my-orders-page-view,
.my-orders-panel.my-orders-page-view{
  display:none !important;
  position:static !important;
  transform:none !important;
  width:100% !important;
  max-width:none !important;
  max-height:none !important;
  min-height:calc(100vh - 74px) !important;
  overflow:visible !important;
  z-index:auto !important;
  background:#f5f5f5 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:120px 44px 80px !important;
  margin:0 !important;
}

.my-orders-page-view.show,
.my-orders-panel.my-orders-page-view.show{
  display:block !important;
}

.my-orders-page-view .my-orders-panel-header,
.my-orders-page-view .my-orders-account-prompt,
.my-orders-page-view .my-orders-logged-header,
.my-orders-page-view .my-orders-panel-actions,
.my-orders-page-view .my-orders-list{
  max-width:1120px;
  margin-left:auto;
  margin-right:auto;
}

.my-orders-page-view .my-orders-panel-header{
  background:#fff;
  border-radius:24px;
  padding:28px;
  box-shadow:0 18px 50px rgba(0,0,0,.08);
  margin-bottom:20px;
}

.my-orders-page-view .my-orders-panel-header h2{
  font-size:64px;
}

.my-orders-panel-close.back-style{
  width:auto !important;
  height:44px !important;
  border-radius:12px !important;
  padding:0 16px !important;
  font-size:14px !important;
  text-transform:uppercase;
  line-height:1 !important;
}

.my-orders-page-view .my-orders-list{
  display:grid;
  gap:14px;
}

.my-orders-page-view .my-order-card,
.my-orders-page-view .empty-orders{
  background:#fff;
  box-shadow:0 10px 28px rgba(0,0,0,.06);
}

/* Botón Mis pedidos realmente en navbar */
.nav #myOrdersTopButton{
  order:10;
}

.nav #authTopButtonNav{
  order:9;
}

@media(max-width:900px){
  .my-orders-page-view,
  .my-orders-panel.my-orders-page-view{
    padding:100px 20px 60px !important;
  }

  .my-orders-page-view .my-orders-panel-header{
    display:grid;
    gap:16px;
    padding:22px;
  }

  .my-orders-page-view .my-orders-panel-header h2{
    font-size:42px;
  }

  .my-orders-panel-close.back-style{
    justify-self:start;
  }
}


/* ===== MIS PEDIDOS: ELIMINAR BANNER DE ESTADO DUPLICADO ===== */
#firebaseAccountStatus,
.compact-status{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}

/* Links del navbar se mantienen activos sobre la vista interna */
body.show-my-orders-page .topbar{
  z-index:1000;
}


/* ===== REDISEÑO RESUMEN LATERAL TU PIZZA ===== */
.builder-summary{
  position:sticky;
  top:92px;
  align-self:start;
  background:#fff;
  border-radius:22px;
  padding:20px 18px 18px;
  box-shadow:0 12px 28px rgba(0,0,0,.08);
  display:grid;
  gap:14px;
}

.summary-title{
  margin:0;
  font-family:var(--font-main);
  font-size:34px;
  line-height:.95;
  text-transform:uppercase;
  color:#111;
}

.summary-basic,
.summary-calories{
  border-top:1px dashed #d9d9d9;
  padding-top:12px;
}

.summary-row{
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:flex-start;
  padding:7px 0;
  border-bottom:1px dashed #e4e4e4;
}

.summary-row:last-child{
  border-bottom:0;
}

.summary-row span{
  color:#444;
  font-size:15px;
}

.summary-row strong{
  color:#222;
  text-align:right;
  font-size:15px;
}

.summary-live{
  background:#faf8f4;
  border:1px solid #efe7d9;
  border-radius:16px;
  padding:14px;
  display:grid;
  gap:12px;
}

.summary-live-head{
  display:grid;
  gap:3px;
}

.summary-live-head span{
  font-weight:900;
  text-transform:uppercase;
  color:#111;
}

.summary-live-head small{
  color:#6a6a6a;
  font-size:12px;
  line-height:1.35;
}

.summary-groups{
  display:grid;
  gap:10px;
}

.summary-group{
  display:grid;
  gap:6px;
}

.summary-group label{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.4px;
  font-weight:900;
  color:#df3035;
}

.summary-pill-list{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  min-height:18px;
}

.summary-pill-list.empty{
  display:block;
  color:#8a8a8a;
  font-size:13px;
  font-style:italic;
}

.summary-pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#fff;
  border:1px solid #e4e4e4;
  border-radius:999px;
  padding:7px 10px;
  color:#222;
  font-size:12px;
  font-weight:800;
  line-height:1.15;
}

.summary-pill small{
  color:#888;
  font-size:11px;
  font-weight:800;
}

.summary-calories #summaryCalories{
  color:#ef3a3a;
  font-size:17px;
}

.summary-selection-calories{
  margin-top:10px;
  background:#f6efe3;
  border-radius:14px;
  padding:12px;
  color:#5d5647;
  font-size:13px;
  line-height:1.5;
}

.summary-note{
  margin-top:10px;
  background:#fff7e6;
  border:1px solid #eed5a0;
  border-radius:14px;
  padding:11px 12px;
  color:#755b2b;
  font-size:12px;
  line-height:1.45;
}

.summary-footer{
  border-top:1px dashed #d9d9d9;
  padding-top:14px;
  display:grid;
  gap:12px;
}

.summary-total{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
}

.summary-total span{
  font-family:var(--font-main);
  font-size:36px;
  line-height:.95;
  text-transform:uppercase;
  color:#111;
}

.summary-total strong{
  color:#ef3a3a;
  font-size:28px;
  line-height:1;
  font-weight:900;
}

.summary-add-button{
  width:100%;
  min-height:50px;
  border:0;
  border-radius:12px;
  background:#ef343a;
  color:#fff;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.3px;
  cursor:pointer;
  font-size:14px;
}

.summary-add-button:hover{
  filter:brightness(.98);
}

@media(max-width:980px){
  .builder-summary{
    position:static;
    top:auto;
  }
}


/* ===== RESUMEN TU PIZZA: SOLO INGREDIENTES AGREGADOS ===== */
.summary-card #summary{
  display:grid;
  gap:12px;
}

.summary-card #summary .summary-line.clean-basic{
  display:flex !important;
  justify-content:space-between;
  gap:14px;
  align-items:flex-start;
  padding:8px 0;
  border-bottom:1px dashed #d7d7d7;
}

.summary-card #summary .summary-line.clean-basic span{
  color:#444;
  font-weight:500;
}

.summary-card #summary .summary-line.clean-basic strong{
  color:#222;
  text-align:right;
  font-weight:900;
}

.live-ingredients-box{
  background:#faf8f3;
  border:1px solid #eee3d2;
  border-radius:16px;
  padding:14px;
  display:grid;
  gap:11px;
}

.live-ingredients-head{
  display:grid;
  gap:3px;
  padding-bottom:8px;
  border-bottom:1px dashed #e1d7c8;
}

.live-ingredients-head strong{
  color:#111;
  text-transform:uppercase;
  font-weight:900;
}

.live-ingredients-head small{
  color:#6e6e6e;
  font-weight:800;
  line-height:1.35;
}

.live-ingredient-group{
  display:grid;
  gap:7px;
}

.live-ingredient-group > span{
  color:#df3035;
  text-transform:uppercase;
  letter-spacing:.35px;
  font-weight:900;
  font-size:12px;
}

.live-ingredient-group.is-empty p{
  margin:0;
  color:#8a8a8a;
  font-size:13px;
  font-style:italic;
  font-weight:700;
}

.live-ingredient-pills{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.live-ingredient-pills b{
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#fff;
  border:1px solid #e2e2e2;
  border-radius:999px;
  padding:7px 10px;
  color:#222;
  font-size:12px;
  font-weight:900;
  line-height:1.15;
}

.live-ingredient-pills small{
  color:#777;
  font-weight:800;
  font-size:11px;
}

.compact-selection{
  margin-top:0 !important;
  font-size:13px !important;
  line-height:1.5 !important;
}

/* Por seguridad, si alguna métrica antigua queda renderizada, se oculta */
#summary .summary-line:not(.clean-basic){
  display:none !important;
}

#summary .summary-line.clean-basic{
  display:flex !important;
}

#summary .total{
  display:flex !important;
}


/* ===== RESUMEN LATERAL: ELIMINAR BLOQUES SELECCIÓN Y NOTA ===== */
#summary .selection-list,
#summary .compact-selection,
#summary .calories-note{
  display:none !important;
}


/* ===== BLOQUEO PEDIDOS SIN SESIÓN ===== */
.login-required-modal h2{
  color:#111;
}

.login-required-modal p{
  font-size:15px;
  line-height:1.45;
}

.auth-message.error{
  font-weight:900;
}


/* ===== DELIVERY AUTOMÁTICO GOOGLE MAPS ===== */
.auto-delivery-field{
  display:grid;
  gap:8px;
}

.auto-delivery-field > label{
  font-weight:900;
  color:#111;
}

.delivery-auto-notice{
  border-radius:14px;
  border:1px solid #e2e2e2;
  background:#f8f8f8;
  padding:13px 14px;
  display:grid;
  gap:3px;
  color:#444;
  font-weight:800;
  line-height:1.35;
}

.delivery-auto-notice strong{
  display:block;
  color:#111;
  font-size:16px;
}

.delivery-auto-notice span{
  color:#444;
}

.delivery-auto-notice small{
  color:#666;
}

.delivery-auto-notice.pending{
  background:#f7f7f7;
  border-color:#dedede;
}

.delivery-auto-notice.loading{
  background:#fff8e8;
  border-color:#eed19c;
  color:#7a4a00;
}

.delivery-auto-notice.ok{
  background:#edf8ef;
  border-color:#bde7c5;
}

.delivery-auto-notice.ok strong{
  color:#17642c;
}

.delivery-auto-notice.error{
  background:#fff1f1;
  border-color:#ffd0d0;
}

.delivery-auto-notice.error strong,
.delivery-auto-notice.error{
  color:#8b1e1e;
}

.delivery-table-card,
#deliveryRatesTable{
  display:none !important;
}


/* ===== GOOGLE MAPS DELIVERY DEBUG ===== */
.delivery-auto-notice.error small{
  display:block;
  margin-top:4px;
  color:#8b1e1e;
  font-weight:800;
}


/* ===== MODAL FINAL LISTO PARA PEDIR ===== */
.final-order-overlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:2147483300;
  background:rgba(0,0,0,.52);
}

.final-order-overlay.show{
  display:block;
}

.final-order-modal{
  display:none;
  position:fixed;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
  width:min(520px, 94vw);
  max-height:88vh;
  overflow:auto;
  z-index:2147483301;
  background:#fff;
  border-radius:24px;
  padding:30px;
  box-shadow:0 30px 90px rgba(0,0,0,.42);
  text-align:left;
}

.final-order-modal.show{
  display:block;
}

.final-order-close{
  position:absolute;
  right:18px;
  top:18px;
  width:42px;
  height:42px;
  border:0;
  border-radius:50%;
  background:#111;
  color:#fff;
  font-size:28px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
}

.final-order-icon{
  width:58px;
  height:58px;
  border-radius:18px;
  background:#fff1f1;
  display:grid;
  place-items:center;
  font-size:34px;
  margin-bottom:12px;
}

.final-order-modal h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  font-size:46px;
  line-height:.92;
  margin:0 52px 10px 0;
  color:#111;
}

.final-order-subtitle{
  color:#555;
  font-weight:800;
  line-height:1.4;
  margin:0 0 16px;
}

.final-order-summary{
  display:grid;
  gap:8px;
  background:#faf8f3;
  border:1px solid #eee3d2;
  border-radius:16px;
  padding:14px;
  margin-bottom:18px;
}

.final-order-summary div{
  display:flex;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px dashed #ddd2c4;
  padding-bottom:8px;
}

.final-order-summary div:last-child{
  border-bottom:0;
  padding-bottom:0;
}

.final-order-summary span{
  color:#555;
  font-weight:800;
}

.final-order-summary strong{
  color:#111;
  font-weight:900;
}

.final-order-summary .final-total strong{
  color:#ef343a;
  font-size:22px;
}

.final-order-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.final-order-actions .addon-primary,
.final-order-actions .addon-secondary{
  min-height:52px;
}

@media(max-width:640px){
  .final-order-actions{
    grid-template-columns:1fr;
  }

  .final-order-modal h2{
    font-size:38px;
  }
}


/* ===== DESACTIVAR POPUP "PIZZA AGREGADA" ===== */
#nextPizzaOverlay,
#nextPizzaModal,
.next-pizza-overlay,
.next-pizza-modal{
  display:none !important;
  visibility:hidden !important;
  pointer-events:none !important;
}


/* ===== REGLAS FLAME / REGLAS POR MITAD ===== */
.rules-stack{
  display:grid;
  gap:12px;
  margin:18px 0 22px;
}

.flame-rules-collapse{
  border:1px solid rgba(239,52,58,.24);
  border-radius:18px;
  background:linear-gradient(180deg, #fff, #fff8f8);
  box-shadow:0 14px 36px rgba(20,20,20,.08);
  overflow:hidden;
}

.flame-rules-collapse summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:12px;
  padding:16px 18px;
  user-select:none;
}

.flame-rules-collapse summary::-webkit-details-marker{
  display:none;
}

.flame-rules-collapse summary::after{
  content:"+";
  margin-left:auto;
  width:30px;
  height:30px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#111;
  color:#fff;
  font-weight:900;
  font-size:22px;
  line-height:1;
}

.flame-rules-collapse[open] summary::after{
  content:"−";
}

.rules-summary-icon{
  width:42px;
  height:42px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:#fff0f0;
  color:#ef343a;
  font-size:24px;
  flex:0 0 auto;
}

.flame-rules-collapse summary strong{
  display:block;
  font-family:var(--font-main);
  text-transform:uppercase;
  letter-spacing:.02em;
  font-size:30px;
  line-height:.9;
  color:#111;
}

.flame-rules-collapse summary small{
  display:block;
  margin-top:5px;
  color:#6f6f6f;
  font-weight:800;
}

.rules-collapse-body{
  padding:0 18px 18px 72px;
  color:#333;
}

.rules-collapse-body p{
  margin:0 0 10px;
  font-weight:800;
  line-height:1.45;
}

.rules-collapse-body ul{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:8px;
}

.rules-collapse-body li{
  line-height:1.42;
  font-weight:650;
}

.rules-collapse-body strong{
  color:#111;
  font-weight:950;
}

.half-rules-collapse{
  border-color:rgba(255,91,36,.30);
  background:linear-gradient(180deg, #fff, #fff5ed);
}

.half-rules-collapse .rules-summary-icon{
  background:#fff0e5;
  color:#f05a24;
}

.half-rules-collapse summary::after{
  background:#f05a24;
}

.half-rules-collapse[open]{
  box-shadow:0 16px 42px rgba(240,90,36,.16);
}

@media(max-width:640px){
  .flame-rules-collapse summary{
    padding:14px;
  }

  .rules-summary-icon{
    width:38px;
    height:38px;
    border-radius:12px;
    font-size:22px;
  }

  .flame-rules-collapse summary strong{
    font-size:25px;
  }

  .rules-collapse-body{
    padding:0 14px 16px 14px;
  }
}


/* ===== MODO PREAPERTURA: PEDIDOS BLOQUEADOS ===== */
.preopening-banner{
  display:none;
  position:sticky;
  top:72px;
  z-index:900;
  background:#111;
  color:#fff;
  padding:12px 24px;
  text-align:center;
  box-shadow:0 10px 24px rgba(0,0,0,.18);
}

.preopening-banner.show,
.orders-closed-mode .preopening-banner{
  display:grid;
  gap:3px;
}

.preopening-banner strong{
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.preopening-banner span{
  color:#f2f2f2;
  font-weight:700;
}

.orders-closed-button{
  cursor:not-allowed !important;
  filter:saturate(.85);
}

.orders-closed-mode #addToCartButton,
.orders-closed-mode .summary-add-button{
  background:#111 !important;
  color:#fff !important;
}

@media(max-width:700px){
  .preopening-banner{
    top:64px;
    padding:11px 14px;
    font-size:13px;
  }
}


/* ===== LEGAL / PRIVACIDAD / RECUPERACIÓN CLAVE ===== */
.footer-legal-links{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex-wrap:wrap;
  margin:8px 0 4px;
  font-weight:800;
}

.footer-legal-links a{
  color:inherit;
  text-decoration:underline;
  text-underline-offset:3px;
}

.legal-check{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  margin:10px 0;
  padding:12px;
  border:1px solid rgba(0,0,0,.10);
  border-radius:14px;
  background:#fffaf5;
  line-height:1.35;
}

.legal-check.optional{
  background:#fff;
}

.legal-check input{
  margin-top:3px;
  width:18px;
  height:18px;
  flex:0 0 auto;
  accent-color:#ef343a;
}

.legal-check span{
  font-weight:800;
  color:#242424;
}

.legal-check a{
  color:#ef343a;
  font-weight:950;
}

.auth-link-button{
  appearance:none;
  border:0;
  background:transparent;
  color:#ef343a;
  font-weight:950;
  text-decoration:underline;
  text-underline-offset:3px;
  cursor:pointer;
  margin:10px auto 0;
  display:block;
}

.warning-help{
  color:#8a4a00 !important;
  font-weight:800;
}

.legal-page{
  background:#fff8f3;
  color:#161616;
  min-height:100vh;
}

.legal-page .legal-shell{
  width:min(920px, calc(100% - 32px));
  margin:0 auto;
  padding:38px 0 64px;
}

.legal-page .legal-card{
  background:#fff;
  border-radius:24px;
  box-shadow:0 18px 44px rgba(0,0,0,.10);
  padding:34px;
}

.legal-page h1,
.legal-page h2{
  font-family:var(--font-main);
  text-transform:uppercase;
  line-height:.95;
}

.legal-page h1{
  font-size:52px;
  margin:0 0 10px;
}

.legal-page h2{
  font-size:30px;
  margin:28px 0 10px;
}

.legal-page p,
.legal-page li{
  line-height:1.58;
  font-weight:650;
}

.legal-page .legal-back{
  display:inline-flex;
  margin-bottom:18px;
  color:#ef343a;
  font-weight:950;
}

@media(max-width:640px){
  .legal-page .legal-card{
    padding:24px 18px;
  }

  .legal-page h1{
    font-size:40px;
  }
}

/* =========================================================
   PRUEBA LOCAL 015 — AJUSTES SOLICITADOS
   No subir directamente a CPanel.
   ========================================================= */

/* La hero queda pegada visualmente debajo de la barra fija.
   El aviso de preapertura, cuando exista, queda inmediatamente bajo el header. */
body{
  padding-top:0 !important;
}

.preopening-banner{
  margin-top:86px !important;
  top:86px !important;
}

.hero{
  scroll-margin-top:86px;
}

@media(max-width:760px){
  .preopening-banner{
    margin-top:72px !important;
    top:72px !important;
  }

  .hero{
    scroll-margin-top:72px;
  }
}

/* Tarjetas completas clickeables, manteniendo el botón Elegir visible. */
.selectable-pizza-card{
  cursor:pointer;
}

.selectable-pizza-card:focus-visible{
  outline:4px solid rgba(223,48,53,.42);
  outline-offset:4px;
}

.selectable-pizza-card .pizza-card-body,
.selectable-pizza-card .menu-product-img{
  cursor:pointer;
}

/* Repetir pedido en el historial. */
.repeat-order-button{
  width:100%;
  margin-top:14px;
  min-height:48px;
  border:0;
  border-radius:10px;
  background:var(--red);
  color:#fff;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.02em;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(223,48,53,.18);
}

.repeat-order-button:hover{
  background:var(--red-dark);
}

/* Reafirma que el badge del carro nunca se oculte por el icono. */
.cart-icon #cartCount{
  z-index:2;
}



/* =========================================================
   PRUEBA LOCAL 016 — RESPONSIVE PARA ZOOM 125% / 150% / 200%
   =========================================================
   Idea:
   - Desktop ancho: tres columnas normales.
   - Laptop / Windows 150%: constructor en dos columnas y
     resumen abajo, en dos tarjetas legibles.
   - Pantallas chicas / Windows 200%: una sola columna.
*/

/* Este punto intermedio evita el layout apretado que aparece
   cuando Windows escala a 150%: el navbar no se parte y el
   constructor deja de tener tres columnas estrechas. */
@media (max-width: 1420px) and (min-width: 1181px){
  .topbar{
    gap:18px !important;
  }

  .nav,
  .header-cta{
    display:none !important;
  }

  .mobile-menu{
    display:block !important;
    margin-left:auto !important;
  }

  .nav.open{
    display:grid !important;
    position:fixed !important;
    top:86px !important;
    left:0 !important;
    right:0 !important;
    z-index:10001 !important;
    background:#fff !important;
    padding:20px 5vw !important;
    gap:12px !important;
    box-shadow:0 12px 30px rgba(0,0,0,.12) !important;
  }

  .nav.open a,
  .nav.open button{
    text-align:left;
    padding:11px 0;
    border-bottom:1px solid #ededed;
  }

  .builder-layout{
    grid-template-columns:minmax(260px, 300px) minmax(0, 1fr) !important;
    gap:22px !important;
  }

  .summary-column{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:18px;
    align-items:start;
    position:static !important;
  }

  .summary-column > .summary-card{
    margin-bottom:0 !important;
  }

  /* El formulario solo aparece como modal; no debe ocupar una columna. */
  .summary-column > .customer-info-card{
    grid-column:1 / -1;
  }

  .pizza-preview-card{
    grid-template-columns:190px minmax(0, 1fr) !important;
    gap:18px !important;
  }

  .pizza-visual{
    width:190px !important;
    height:170px !important;
  }

  .pizza-preview-card h3{
    font-size:30px !important;
  }

  .ingredients-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

/* En el salto a una columna se evita dejar tarjetas comprimidas.
   El resumen vuelve a ser vertical y usa el ancho completo. */
@media (max-width: 1180px){
  .summary-column{
    display:block !important;
  }

  .summary-column > .summary-card{
    margin-bottom:18px !important;
  }
}

/* Ajustes adicionales para laptops bajos o con zoom alto. */
@media (max-width: 1420px){
  .brand img{
    width:175px !important;
  }

  .builder-title{
    max-width:680px;
  }

  .config-card,
  .pizza-workspace,
  .summary-card{
    padding:18px !important;
  }
}

@media (max-width: 760px){
  .brand img{
    width:150px !important;
  }
}


/* =========================================================
   PRODUCCIÓN 019 — CARRITO CON SCROLL + ZOOM 200% COMPACTO
   ========================================================= */

/* El detalle de productos queda en un panel independiente.
   Así, cuando hay muchas pizzas o adicionales, sólo se desplaza
   la lista y el total + los botones siguen siempre visibles. */
#cartItems{
  min-width:0;
}

.cart-items-scroll{
  max-height:min(360px, 34vh);
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:6px;
  margin-bottom:12px;
}

.cart-items-scroll .cart-item:last-child{
  margin-bottom:0;
}

.cart-totals{
  border-top:1px solid #e6e0d9;
  padding-top:4px;
}

/* En una pantalla con zoom alto todavía hay suficiente ancho para
   mantener configuración a la izquierda y pizza a la derecha.
   Esto evita que la vista previa se estire a todo el ancho como en
   la captura de la pantalla 2360 × 1640 al 200%. */
@media (max-width:1180px) and (min-width:861px){
  .builder-layout{
    grid-template-columns:minmax(230px, 270px) minmax(0, 1fr) !important;
    gap:20px !important;
  }

  .summary-column{
    grid-column:1 / -1;
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px;
    align-items:start;
    position:static !important;
  }

  .summary-column > .summary-card{
    margin-bottom:0 !important;
  }

  .summary-column > .customer-info-card{
    grid-column:1 / -1;
  }

  .pizza-preview-card{
    grid-template-columns:170px minmax(0, 1fr) !important;
    gap:16px !important;
    padding-bottom:18px !important;
    margin-bottom:18px !important;
  }

  .pizza-visual{
    width:170px !important;
    height:155px !important;
    border-radius:18px !important;
  }

  .pizza-preview-card h3{
    font-size:29px !important;
  }

  .ingredients-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  .ingredients-grid.compact{
    grid-template-columns:1fr !important;
  }

  .half-columns{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  .ingredient-option{
    min-height:70px !important;
    padding:10px !important;
  }

  .cart-items-scroll{
    max-height:min(310px, 34vh);
  }
}

/* Bajo este ancho sí se prioriza una columna, sin dejar que el
   carrito crezca indefinidamente hacia abajo. */
@media (max-width:860px){
  .cart-items-scroll{
    max-height:min(300px, 38vh);
  }
}

@media (max-width:760px){
  .cart-items-scroll{
    max-height:min(280px, 36vh);
    padding-right:4px;
  }
}

/* =========================================================
   PRODUCCIÓN 020 — SCROLL DE RESÚMENES + TARJETAS CLICKEABLES
   ========================================================= */

/* “Tu pizza”: los ingredientes siguen actualizándose en tiempo real,
   pero el detalle no puede estirar indefinidamente la tarjeta. */
.live-ingredients-box{
  max-height:360px;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:8px;
}

.live-ingredients-box::-webkit-scrollbar,
.cart-items-scroll::-webkit-scrollbar{
  width:8px;
}

.live-ingredients-box::-webkit-scrollbar-thumb,
.cart-items-scroll::-webkit-scrollbar-thumb{
  background:#c9c9c9;
  border-radius:999px;
}

/* El menú completo de Pizza 5 ingredientes y Make your Own es clickeable. */
.selectable-pizza-card{
  cursor:pointer;
}

.selectable-pizza-card *{
  cursor:pointer;
}

.selectable-pizza-card button{
  cursor:pointer;
}

.cart-title{
  display:flex !important;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
}

.cart-pizza-count{
  color:#6f6f6f;
  font-family:var(--font-body);
  font-size:12px;
  font-weight:800;
  letter-spacing:0;
  line-height:1.25;
  text-transform:none;
}

.cart-pizza-count:empty{
  display:none;
}

/* El listado lateral muestra como máximo una pizza a la vez.
   Las demás quedan disponibles mediante scroll interno, mientras que
   subtotales, delivery y botones se mantienen a la vista. */
.cart-items-scroll{
  max-height:180px !important;
  overflow-y:auto;
  scroll-snap-type:y proximity;
  overscroll-behavior:contain;
}

.cart-items-scroll .cart-item{
  scroll-snap-align:start;
}

@media(max-width:760px){
  .live-ingredients-box{
    max-height:330px;
  }

  .cart-items-scroll{
    max-height:180px !important;
  }
}



/* =========================================================
   PRODUCCIÓN 021 — CARRITO HORIZONTAL EN DESKTOP GRANDE
   =========================================================
   Sólo en pantallas realmente amplias, “Tu pizza” conserva la tercera
   columna y el carrito ocupa una fila completa bajo las tres columnas.
   Las pizzas se recorren hacia el lado, no agrandan la página hacia abajo.
*/

/* La tarjeta “Más popular” ya no queda marcada por defecto. El borde
   rojo indica exclusivamente la opción que el cliente tiene seleccionada. */
.selectable-pizza-card.highlighted{
  border:1px solid var(--border);
}

.selectable-pizza-card.selected-pizza-card{
  border:2px solid var(--red);
  box-shadow:0 18px 45px rgba(223,48,53,.14);
}

@media (min-width:1421px){
  /* Los hijos de la columna de resumen participan directamente en la
     grilla de tres columnas: configuración, constructor y “Tu pizza”. */
  .summary-column{
    display:contents;
    position:static;
  }

  .summary-column > .summary-card:first-child{
    grid-column:3;
    grid-row:1;
    align-self:start;
    position:sticky;
    top:108px;
  }

  /* El formulario sigue siendo un modal: fuera de él no ocupa espacio. */
  .summary-column > .customer-info-card{
    grid-column:1 / -1;
  }

  /* El carrito se transforma en una franja horizontal bajo el constructor. */
  .summary-column > .cart-summary-card{
    grid-column:1 / -1;
    grid-row:2;
    margin:0 !important;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    gap:12px 18px;
    align-items:stretch;
  }

  .cart-summary-card .cart-title{
    grid-column:1 / -1;
    margin-bottom:0;
  }

  .cart-summary-card #cartItems{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:minmax(0, 1fr) minmax(320px, 390px);
    gap:20px;
    align-items:stretch;
    min-width:0;
  }

  /* Productos en fila: cuando hay más, se recorren horizontalmente. */
  .cart-summary-card .cart-items-scroll{
    height:220px;
    min-width:0;
    max-height:220px !important;
    margin:0;
    padding:0 8px 8px 0;
    display:flex;
    align-items:stretch;
    gap:12px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x proximity;
    overscroll-behavior-inline:contain;
  }

  .cart-summary-card .cart-items-scroll .cart-item{
    flex:0 0 min(330px, 48%);
    min-width:0;
    height:212px;
    margin:0;
    overflow-y:auto;
    scroll-snap-align:start;
    scrollbar-gutter:stable;
  }

  .cart-summary-card .cart-items-scroll .cart-item:only-child{
    flex-basis:100%;
  }

  .cart-summary-card .cart-totals{
    height:220px;
    margin:0;
    padding:8px 16px;
    border:1px solid #e6e0d9;
    border-radius:12px;
    background:#fafafa;
    overflow-y:auto;
  }

  .cart-summary-card .empty-cart{
    grid-column:1 / -1;
    min-height:150px;
    margin:0;
    display:grid;
    place-items:center;
  }

  /* Acciones claras bajo la franja del carrito. */
  .cart-summary-card .customer-edit-btn,
  .cart-summary-card .btn-whatsapp{
    margin:0;
    min-height:54px;
  }

  .cart-summary-card .customer-edit-btn{
    grid-column:1;
  }

  .cart-summary-card .btn-whatsapp{
    grid-column:2;
  }

  .cart-summary-card .cart-items-scroll::-webkit-scrollbar{
    height:8px;
  }

  .cart-summary-card .cart-items-scroll::-webkit-scrollbar-thumb{
    background:#c9c9c9;
    border-radius:999px;
  }
}



/* =========================================================
   PRODUCCIÓN 022 — TOTALES SIEMPRE VISIBLES EN CARRITOS
   ========================================================= */

/* Carrito principal en escritorio ancho: los cuatro subtotales se
   compactan en dos columnas y el total queda abajo. Así no necesita
   scrollbar para mostrar toda la información. */
@media (min-width:1421px){
  .cart-summary-card .cart-totals{
    height:220px;
    overflow:hidden;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    grid-auto-rows:min-content;
    column-gap:18px;
    row-gap:0;
    align-content:start;
  }

  .cart-summary-card .cart-totals .summary-line{
    min-width:0;
    padding:5px 0;
    gap:8px;
    font-size:14px;
  }

  .cart-summary-card .cart-totals .summary-line strong{
    font-size:15px;
    white-space:nowrap;
  }

  .cart-summary-card .cart-totals .total{
    grid-column:1 / -1;
    margin:6px 0 0;
    padding-top:6px;
    border-top:1px solid #e6e0d9;
    min-height:58px;
  }

  .cart-summary-card .cart-totals .total span{
    font-size:24px;
  }

  .cart-summary-card .cart-totals .total strong{
    font-size:34px;
    line-height:1;
    white-space:nowrap;
  }
}

/* El panel grande de “Detalle de tu pedido” se divide en tres zonas:
   cabecera, productos desplazables y un cierre fijo con totales + acciones.
   Sólo se mueve la lista de pizzas; el cierre nunca deja ver elementos detrás. */
.cart-page{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.cart-page-header{
  flex:0 0 auto;
}

.cart-page-items{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:8px;
}

.cart-page-summary{
  flex:0 0 auto;
  background:#fff;
  border-top:1px solid #ececec;
  margin-top:14px;
}

.cart-page-summary:empty{
  display:none;
}

.cart-page-summary .cart-page-total{
  position:static;
  margin:0;
  padding:14px 0 8px;
}

.cart-page-actions{
  flex:0 0 auto;
  margin-top:14px;
}

@media(max-width:760px){
  .cart-page-items{
    padding-right:4px;
  }

  .cart-page-summary .cart-page-total{
    padding-top:12px;
  }
}

/* =========================================================
   PRODUCCIÓN 023 — MÁS AIRE PARA SUBTOTALES EN CARRITO DESKTOP
   =========================================================
   Sólo afecta el carrito horizontal de pantallas grandes. Se reservan
   dos filas más amplias para los subtotales y el total general queda
   visualmente más abajo, sin volver a crear scroll en esta zona. */
@media (min-width:1421px){
  .cart-summary-card .cart-totals{
    height:220px;
    box-sizing:border-box;
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    grid-template-rows:58px 58px minmax(70px, 1fr);
    column-gap:28px;
    row-gap:0;
    align-content:stretch;
    padding:12px 20px 14px;
  }

  .cart-summary-card .cart-totals .summary-line{
    box-sizing:border-box;
    min-width:0;
    align-items:flex-start;
    padding:10px 0 9px;
    gap:12px;
    font-size:15px;
    line-height:1.25;
  }

  .cart-summary-card .cart-totals .summary-line strong{
    flex:0 0 auto;
    font-size:16px;
    line-height:1.25;
  }

  .cart-summary-card .cart-totals .total{
    grid-column:1 / -1;
    grid-row:3;
    align-self:end;
    min-height:70px;
    margin:0;
    padding-top:12px;
    border-top:1px solid #e6e0d9;
  }

  .cart-summary-card .cart-totals .total span{
    font-size:26px;
  }

  .cart-summary-card .cart-totals .total strong{
    font-size:38px;
    line-height:1;
  }
}

/* ========================================================================
   FLAME PIZZA — MINIMALISTA / AESTHETIC PRUEBA 002
   Rediseño visual integral. No cambia reglas, precios, delivery ni datos.
   ======================================================================== */

:root{
  --red:#e9363f;
  --red-dark:#c5242d;
  --red-soft:#fff0f1;
  --black:#17181a;
  --ink:#25272b;
  --muted:#6e747c;
  --muted-soft:#8f969f;
  --line:#e6e3df;
  --line-strong:#d9d4cf;
  --paper:#ffffff;
  --canvas:#f6f5f3;
  --cream:#fbfaf8;
  --success:#20c968;
  --success-dark:#13a953;
  --shadow-soft:0 16px 42px rgba(28, 25, 22, .07);
  --shadow-float:0 24px 64px rgba(28, 25, 22, .13);
  --radius-lg:24px;
  --radius-md:16px;
  --radius-sm:12px;
  --font-main:"Arial Narrow", "Roboto Condensed", Impact, Haettenschweiler, sans-serif;
  --font-body:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

html{background:var(--canvas)}
body{
  background:var(--canvas);
  color:var(--ink);
  font-family:var(--font-body);
  line-height:1.45;
}
body::selection{background:var(--red);color:#fff}
body.flame-modal-lock{overflow:hidden}

button,a,input,textarea,select{font-family:var(--font-body)}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,summary:focus-visible{
  outline:3px solid rgba(233,54,63,.28);
  outline-offset:3px;
}

/* -------- Header / navigation -------- */
.topbar{
  height:76px;
  padding:0 clamp(18px,4vw,66px);
  gap:18px;
  background:rgba(255,255,255,.92);
  border-bottom:1px solid rgba(23,24,26,.08);
  box-shadow:none;
  backdrop-filter:blur(14px);
}
.brand{display:flex;align-items:center;flex:0 0 auto}
.brand img{width:188px;max-height:48px;object-fit:contain}
.nav{gap:22px}
.nav a{
  color:#535860;
  font-size:12px;
  line-height:1;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:none;
}
.nav a:hover{color:var(--red)}
.auth-top-btn,.my-orders-top-btn{
  padding:8px 0!important;
  border:0!important;
  background:transparent!important;
  color:#535860!important;
  font-size:12px!important;
  font-weight:800!important;
  white-space:nowrap;
}
.auth-top-btn:hover,.my-orders-top-btn:hover{color:var(--red)!important}
.header-cta{
  border-radius:999px;
  padding:11px 18px;
  background:var(--black);
  color:#fff;
  box-shadow:none;
  font-size:12px;
  letter-spacing:.02em;
}
.header-cta:hover{background:var(--red)}
.cart-icon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:50%;
  background:#fff;
  color:var(--black);
  font-size:20px;
  transition:.18s ease;
}
.cart-icon:hover{border-color:var(--red);transform:translateY(-1px)}
.cart-icon span{
  top:-5px;right:-4px;
  width:19px;height:19px;
  background:var(--red);
  border:2px solid #fff;
  color:#fff;
  font-size:10px;
}
.mobile-menu{background:transparent;color:var(--black)}

.preopening-banner{
  margin:0;
  padding:10px clamp(18px,4vw,66px);
  background:#17181a;
  color:#fff;
  border:0;
  font-size:13px;
}
.preopening-banner strong{color:#fff}
.preopening-banner span{color:rgba(255,255,255,.72)}

/* -------- Hero -------- */
.hero{min-height:clamp(510px,65vh,650px);background:#131416}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(14,15,17,.88) 0%,rgba(14,15,17,.71) 36%,rgba(14,15,17,.14) 70%,rgba(14,15,17,.05) 100%);
  pointer-events:none;
  z-index:1;
}
.hero-overlay{display:none}
.hero-video{opacity:.78;filter:saturate(.82) contrast(1.04)}
.hero-content{
  padding:72px clamp(22px,7vw,116px);
  max-width:720px;
  z-index:2!important;
}
.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0 0 16px;
  color:inherit;
  font-size:11px;
  font-weight:850;
  letter-spacing:.16em;
  line-height:1;
}
.eyebrow::before{content:"";width:22px;height:2px;background:currentColor;opacity:.8}
.eyebrow.red{color:var(--red)}
.hero h1{
  max-width:650px;
  margin:0 0 22px;
  font-family:var(--font-main);
  font-size:clamp(58px,8vw,104px);
  font-weight:900;
  line-height:.88;
  letter-spacing: .035em;
}
.hero h1 span{color:var(--red)}
.hero-text{
  max-width:500px;
  color:rgba(255,255,255,.82);
  font-size:18px;
  font-weight:500;
  line-height:1.55;
}
.hero-actions{gap:10px}
.btn{
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  border:1px solid transparent;
  font-size:13px;
  font-weight:850;
  letter-spacing:.01em;
  text-transform:none;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn-red{background:var(--red);box-shadow:none;color:#fff}
.btn-red:hover{background:var(--red-dark)}
.btn-white{background:#fff;color:var(--black);border-color:#fff}
.btn-white:hover{background:#f7f7f7}
.btn-dark{background:var(--black);color:#fff}
.btn-whatsapp{background:var(--success);color:#fff}
.btn-whatsapp:hover{background:var(--success-dark)}

/* -------- Feature band -------- */
.quick-strip{
  max-width:1300px;
  margin:-34px auto 0;
  padding:0 clamp(18px,3vw,34px);
  position:relative;
  z-index:3;
  background:transparent;
  border:0;
  gap:10px;
}
.quick-strip div{
  min-height:86px;
  padding:18px 20px;
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:rgba(255,255,255,.97);
  box-shadow:0 12px 35px rgba(20,20,20,.06);
}
.quick-strip strong{font-size:13px;color:var(--black);text-transform:none}
.quick-strip span{font-size:12px;line-height:1.35;color:var(--muted)}

/* -------- General sections -------- */
.section{padding:110px clamp(18px,4vw,66px)}
.menu-section{background:var(--canvas)}
.section-title{max-width:660px;margin:0 auto 42px;text-align:center}
.section-title h2,.builder-title h2,.ingredient-banner h2,.location-card h2{
  color:var(--black);
  font-family:var(--font-main);
  font-size:clamp(42px,5vw,68px);
  font-weight:900;
  line-height:.92;
  letter-spacing:-.04em;
  text-transform:uppercase;
}
.section-title p,.builder-title p{color:var(--muted);font-size:16px;line-height:1.55}

/* -------- Pizza choice cards -------- */
.menu-grid{
  max-width:1370px;
  margin:0 auto;
  gap:16px;
}
.pizza-card{
  min-height:530px;
  display:flex;
  flex-direction:column;
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:var(--paper);
  box-shadow:none;
  overflow:hidden;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.pizza-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-soft)}
.pizza-card.highlighted,.selectable-pizza-card.highlighted{border:1px solid var(--line)}
.selectable-pizza-card.selected-pizza-card{
  border:2px solid var(--red)!important;
  box-shadow:0 18px 50px rgba(233,54,63,.12)!important;
}
.pizza-card::after{
  content:"";
  position:absolute;
  inset:auto 20px 0;
  height:3px;
  border-radius:999px 999px 0 0;
  background:transparent;
}
.selectable-pizza-card.selected-pizza-card::after{background:var(--red)}
.badge{
  top:18px;left:18px;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.8);
  border-radius:999px;
  background:#fff;
  color:var(--black);
  box-shadow:0 8px 18px rgba(16,16,16,.08);
  font-size:10px;
  letter-spacing:.055em;
}
.pizza-card:nth-child(2) .badge{background:var(--red);border-color:var(--red);color:#fff}
.pizza-card img,.pizza-card img.menu-product-img{
  aspect-ratio:1.55/1;
  height:auto;
  object-fit:contain;
  object-position:center;
  background:linear-gradient(145deg,#fffaf6 0%,#f8f7f5 100%);
  padding:22px 28px 6px;
}
.pizza-card-body{display:flex;flex:1;flex-direction:column;padding:22px 24px 24px}
.pizza-card h3{
  color:var(--black);
  font-family:var(--font-main);
  font-size:clamp(30px,3vw,40px);
  line-height:.94;
  letter-spacing:-.04em;
  margin:0 0 12px;
  text-transform:uppercase;
}
.pizza-card p{min-height:0;margin:0;color:var(--muted);font-size:15px;line-height:1.5}
.pizza-card .small-warning{margin-top:auto;padding-top:20px;color:var(--red);font-size:12px;font-weight:800}
.card-footer{margin-top:auto;padding-top:26px;align-items:center}
.card-footer strong{color:var(--black);font-size:28px;letter-spacing:-.04em}
.card-footer button{
  min-height:42px;
  padding:0 14px;
  border:1px solid var(--black);
  border-radius:999px;
  background:var(--black);
  color:#fff;
  font-size:13px;
  font-weight:800;
}
.card-footer button::after{content:" ↗";font-size:15px}
.card-footer .disabled-button{border-color:var(--line);background:#f2f0ed;color:#9d9892}
.card-footer .disabled-button::after{content:""}

/* -------- Builder — visual redesign -------- */
.builder-section{
  padding:100px clamp(18px,4vw,66px) 106px;
  background:var(--cream);
  color:var(--ink);
  overflow:visible;
}
.builder-section::before{
  content:"";
  display:block;
  width:100%;
  height:1px;
  background:var(--line);
  position:absolute;
  top:0;left:0;
}
.builder-bg-items{display:none}
.builder-title{max-width:680px;margin:0 auto 36px;text-align:center}
.builder-title .eyebrow{color:var(--red)}
.builder-title h2{color:var(--black)}
.builder-title p{color:var(--muted)}
.builder-layout{
  max-width:1440px;
  margin:0 auto;
  grid-template-columns:280px minmax(0,1fr) 350px;
  gap:16px;
  align-items:start;
}
.builder-steps{min-width:0}
.steps-progress{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  align-items:start;
  gap:0;
  margin:0 0 14px;
  padding:14px 12px;
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  background:#fff;
  box-shadow:none;
}
.progress-step{gap:5px;color:var(--muted);min-width:0}
.progress-step span{
  width:24px;height:24px;
  background:#e9e7e4;
  color:#7a7772;
  font-size:11px;
}
.progress-step.active span{background:var(--red);color:#fff}
.progress-step.active{color:var(--black)}
.progress-step small{font-size:9px;letter-spacing:.015em;text-transform:none;white-space:nowrap}
.progress-line{display:none}
.config-card,.pizza-workspace,.summary-card{
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:#fff;
  box-shadow:none;
}
.config-card{padding:16px;margin-bottom:12px}
.config-card h3,.summary-card h3{
  margin:0 0 12px;
  color:var(--black);
  font-family:var(--font-main);
  font-size:23px;
  line-height:1;
  letter-spacing:-.025em;
  text-transform:uppercase;
}
.radio-option{
  grid-template-columns:18px minmax(0,1fr) auto;
  gap:10px;
  padding:11px 10px;
  margin:5px 0;
  border:1px solid transparent;
  border-radius:12px;
  background:#faf9f8;
  color:#50555b;
  font-size:13px;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.radio-option:hover{border-color:#f0cacd;background:var(--red-soft)}
.radio-option:has(input:checked){border-color:var(--red);background:var(--red-soft);color:var(--black)}
.radio-option input{width:15px;height:15px;margin:0}
.radio-option span{font-weight:750;line-height:1.25}
.radio-option span small{display:block;color:var(--muted);font-size:10px;font-weight:650;margin-top:2px}
.radio-option b{font-size:13px;color:var(--black)}
.disabled-option{opacity:.58;cursor:not-allowed}
.format-switch{gap:6px;padding:4px;border-radius:14px;background:#f1efec}
.format-switch button{
  min-height:40px;
  padding:0 8px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#6c7177;
  font-size:12px;
  font-weight:800;
  text-transform:none;
}
.format-switch button.active{background:#fff;color:var(--black);box-shadow:0 4px 13px rgba(20,20,20,.08)}
.rules-stack{display:grid;gap:9px}
.flame-rules-collapse{
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.flame-rules-collapse summary{
  display:flex;
  align-items:center;
  gap:10px;
  min-height:56px;
  padding:10px 12px;
  cursor:pointer;
  list-style:none;
}
.flame-rules-collapse summary::-webkit-details-marker{display:none}
.rules-summary-icon{
  display:grid;
  place-items:center;
  width:30px;height:30px;
  border-radius:10px;
  background:var(--red-soft);
  font-size:15px;
}
.flame-rules-collapse summary strong{display:block;color:var(--black);font-size:12px;font-weight:850}
.flame-rules-collapse summary small{display:block;color:var(--muted);font-size:10px;margin-top:1px}
.rules-collapse-body{padding:0 14px 14px;color:var(--muted);font-size:12px;line-height:1.55}
.rules-collapse-body p{margin:0 0 8px}.rules-collapse-body ul{margin:0;padding-left:17px}.rules-collapse-body li+li{margin-top:5px}

/* Workspace */
.pizza-workspace{padding:24px}
.pizza-preview-card{
  grid-template-columns:220px minmax(0,1fr);
  gap:22px;
  margin:0 0 24px;
  padding:0 0 24px;
  border-bottom:1px solid var(--line);
}
.pizza-visual{
  width:220px;height:178px;
  border-radius:18px;
  background:linear-gradient(135deg,#fff0eb 0%,#fff 100%);
  box-shadow:none;
}
.pizza-visual img{object-fit:contain;padding:9px;filter:drop-shadow(0 12px 14px rgba(33,26,22,.13))}
.pizza-preview-card h3{color:var(--black);font-family:var(--font-main);font-size:34px;line-height:.94;letter-spacing:-.04em}
.pizza-preview-card p{color:var(--muted);font-size:14px;line-height:1.55}
.pizza-preview-card .eyebrow{color:var(--red);margin-bottom:9px}
.half-overlay{background:linear-gradient(90deg,rgba(233,54,63,.15) 0 50%,rgba(23,24,26,.08) 50%);border-left:2px dashed rgba(23,24,26,.65)}
.selector-heading{margin-bottom:16px;align-items:center}
.selector-heading h3{color:var(--black);font-family:var(--font-main);font-size:29px;line-height:.98;letter-spacing:-.03em}
.selector-heading p{color:var(--muted);font-size:13px}
.ingredient-heading{
  grid-column:1 / -1;
  display:flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  min-height:26px;
  padding:5px 9px;
  border-radius:999px;
  background:var(--black)!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:850!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.ingredients-grid{gap:9px}
.ingredients-grid.compact{gap:8px}
.ingredient-option{
  position:relative;
  min-height:76px;
  padding:11px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  color:var(--black);
  box-shadow:none;
  transition:transform .15s ease,border-color .15s ease,background .15s ease;
}
.ingredient-option:hover{border-color:#f3adb2;background:#fff8f8;transform:translateY(-1px)}
.ingredient-option:has(input:checked){border-color:var(--red);background:var(--red-soft);box-shadow:inset 0 0 0 1px var(--red)}
.ingredient-option input{width:15px;height:15px;margin:0;accent-color:var(--red)}
.ingredient-option span{color:var(--black);font-size:13px;font-weight:800;line-height:1.22}
.ingredient-option small{color:var(--muted);font-size:10px;font-weight:650;line-height:1.3;text-transform:none}
.ingredient-option-coming-soon{opacity:.54;background:#f6f4f1!important;border-style:dashed!important;cursor:not-allowed!important}
.ingredient-coming-soon-badge{background:#f0ece6!important;color:#756f67!important}
.premium-step-note{
  grid-column:1 / -1;
  padding:10px 12px;
  border-left:3px solid var(--red);
  border-radius:0 10px 10px 0;
  background:var(--red-soft);
  color:#7c3a3e;
  font-size:12px;
  line-height:1.45;
}
.sauce-note{margin:10px 0 0;color:var(--muted);font-size:12px}
.half-columns{gap:12px}
.half-columns>div{padding:13px;border:1px solid var(--line);border-radius:16px;background:#fcfbfa}
.half-columns h4{margin:0 0 9px;color:var(--black);font-family:var(--font-main);font-size:21px;line-height:1;text-transform:uppercase}
.half-step-intro{color:var(--muted);font-size:13px;margin:0 0 12px}
.ingredient-wizard-controls{margin-top:22px}
.wizard-progress-text{margin-bottom:9px;color:var(--muted);font-size:12px;font-weight:750}
.wizard-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.wizard-btn{
  min-height:46px;
  border:1px solid var(--line);
  border-radius:12px;
  font-size:13px;
  font-weight:850;
  text-transform:none;
}
.wizard-btn.secondary{background:#f4f2ef;color:#6c7076}
.wizard-btn.primary{border-color:var(--black);background:var(--black);color:#fff}
.wizard-btn.primary:hover{background:var(--red);border-color:var(--red)}
.wizard-btn:disabled{opacity:.42;cursor:not-allowed}

/* Live order summary */
.summary-column{top:92px}
.summary-card{padding:20px;margin-bottom:12px}
.summary-column>.summary-card:first-child{
  border:0;
  background:var(--black);
  color:#fff;
  box-shadow:0 18px 46px rgba(17,18,20,.16);
}
.summary-column>.summary-card:first-child h3{color:#fff}
.summary-card #summary{gap:10px}
.summary-card #summary .summary-line.clean-basic{
  padding:6px 0;
  border-bottom:1px solid rgba(255,255,255,.16);
}
.summary-card #summary .summary-line.clean-basic span{color:rgba(255,255,255,.67);font-size:12px}
.summary-card #summary .summary-line.clean-basic strong{color:#fff;font-size:13px}
.live-ingredients-box{
  max-height:310px;
  padding:12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:#232528;
  color:#fff;
}
.live-ingredients-box::-webkit-scrollbar{width:6px}
.live-ingredients-box::-webkit-scrollbar-thumb{background:#53565a;border-radius:99px}
.live-ingredients-head{padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.12)}
.live-ingredients-head strong{color:#fff;font-size:12px;letter-spacing:.04em}
.live-ingredients-head small{color:rgba(255,255,255,.6);font-size:10px}
.live-ingredient-group{gap:5px}
.live-ingredient-group>span{color:#ff858b;font-size:10px;letter-spacing:.06em}
.live-ingredient-group.is-empty p{color:rgba(255,255,255,.45);font-size:11px}
.live-ingredient-pills{gap:5px}
.live-ingredient-pills b{
  max-width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:8px;
  background:#2b2e31;
  color:#fff;
  padding:6px 8px;
  font-size:10px;
  font-weight:760;
}
.live-ingredient-pills small{color:rgba(255,255,255,.58);font-size:9px}
.calories-line{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:12px 0 0;
  color:rgba(255,255,255,.7);
  font-size:12px;
}
.calories-line strong{color:#fff;font-size:14px}
.pricing-breakdown{
  display:grid;
  gap:6px;
  margin:0;
  padding:12px 0 0;
  border-top:1px solid rgba(255,255,255,.16);
}
.pricing-breakdown-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.pricing-breakdown-head strong{color:#fff;font-size:12px}
.pricing-breakdown-head small{color:rgba(255,255,255,.54);font-size:10px}
.pricing-breakdown-line{display:flex;justify-content:space-between;gap:10px;color:rgba(255,255,255,.63);font-size:11px}
.pricing-breakdown-line strong{color:#fff;font-size:11px}
.pricing-breakdown-line.is-extra span{color:#ff9ba0}
.pricing-breakdown-line.is-extra strong{color:#ffb1b5}
.pricing-breakdown-empty{color:rgba(255,255,255,.5);font-size:11px}
.summary-column>.summary-card:first-child .total{
  margin-top:14px;
  padding-top:13px;
  border-top:1px solid rgba(255,255,255,.2);
}
.summary-column>.summary-card:first-child .total span{color:#fff;font-size:25px}
.summary-column>.summary-card:first-child .total strong{color:#ff5961;font-size:38px;letter-spacing:-.05em}
.summary-column>.summary-card:first-child .btn-red{margin-top:14px;background:var(--red)}
.summary-column>.summary-card:first-child .btn-red:hover{background:#ff525b}

/* Cart strip / card */
.cart-summary-card{background:#fff!important;color:var(--black)!important}
.cart-summary-card h3{color:var(--black)!important}
.cart-title{display:flex;align-items:baseline;gap:8px}
.cart-pizza-count{color:var(--muted);font-size:11px;font-weight:750}
.cart-items-scroll{scrollbar-color:#cbc8c4 transparent}
.cart-items-scroll::-webkit-scrollbar{width:7px;height:7px}
.cart-items-scroll::-webkit-scrollbar-thumb{background:#d3cfca;border-radius:99px}
.cart-item{
  border:1px solid var(--line);
  border-radius:14px;
  background:#fbfaf9;
  color:#4f555c;
  padding:14px;
  font-size:12px;
  line-height:1.45;
}
.cart-item strong{color:var(--black);font-size:14px}
.cart-item .cart-quantity{display:inline-flex;margin-right:4px;color:var(--red);font-size:11px}
.cart-item button{
  margin-top:8px;
  padding:7px 9px;
  border:1px solid var(--black);
  border-radius:999px;
  background:var(--black);
  color:#fff;
  font-size:10px;
  font-weight:800;
}
.cart-item button+button{border-color:#c8c4bf;background:#fff;color:#575b60}
.cart-totals{border-color:var(--line)!important;background:#faf9f8!important}
.cart-totals .summary-line{border-bottom:1px solid var(--line);color:#565b62}
.cart-totals .summary-line strong{color:var(--black)}
.cart-totals .total{border-color:var(--line)!important}
.cart-totals .total span{color:var(--black)!important}
.cart-totals .total strong{color:var(--red)!important}
.empty-cart{color:var(--muted)}
.customer-edit-btn{background:#f1efec!important;color:var(--black)!important;border-color:#f1efec!important}
.customer-edit-btn:hover{background:#e8e5e0!important}

/* Contact / ingredient / location sections */
.ingredients-section{padding:110px clamp(18px,4vw,66px);background:#fff}
.ingredient-banner{max-width:1230px;gap:78px;margin:0 auto;grid-template-columns:1.1fr .9fr}
.ingredient-banner h2{font-size:clamp(42px,4.8vw,66px);margin-bottom:16px}
.ingredient-banner p{color:var(--muted);font-size:16px;line-height:1.62}
.ingredient-banner img{
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
  filter:none;
}
.location-section{padding:100px clamp(18px,4vw,66px);background:#efeeeb}
.location-layout{max-width:1230px;margin:0 auto;display:grid;grid-template-columns:.88fr 1.12fr;gap:16px}
.location-card{max-width:none;padding:32px;border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:none;background:#fff}
.location-card h2{font-size:45px;margin-bottom:18px}
.location-card p{color:var(--muted);font-size:14px}.location-card strong{color:var(--black)}
.location-card a{color:var(--red);font-weight:750;text-decoration:none}
.map-card{border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;background:#fff}.map-card iframe{display:block;width:100%;height:100%;min-height:400px;border:0}
.footer{padding:42px clamp(18px,4vw,66px);background:#fff;border-top:1px solid var(--line)}
.footer img{width:175px}.footer p{font-size:14px;color:var(--black)}.footer small{color:var(--muted)}.footer-legal-links a{color:var(--muted)}.footer-legal-links a:hover{color:var(--red)}

/* -------- Forms / overlays / pages -------- */
.customer-info-overlay,.cart-page-overlay,.addon-overlay,.auth-overlay,.login-required-overlay,.my-orders-overlay,.final-order-overlay,.next-pizza-overlay,.order-success-overlay{background:rgba(20,21,23,.55)!important;backdrop-filter:blur(4px)}
.customer-info-card.customer-modal-open,.auth-modal,.login-required-modal,.addon-modal,.final-order-modal,.next-pizza-modal,.order-success-modal{
  border:1px solid var(--line)!important;
  border-radius:24px!important;
  background:#fff!important;
  box-shadow:var(--shadow-float)!important;
}
.customer-info-card.customer-modal-open{color:var(--black)!important}
.customer-info-card.customer-modal-open h3{color:var(--black)!important}
.customer-modal-intro,.auth-modal-header p,.addon-subtitle,.final-order-subtitle{color:var(--muted)!important}
.customer-popup-close,.auth-close,.addon-close,.final-order-close,.cart-page-close,.next-pizza-close,.order-success-close{
  display:grid!important;place-items:center!important;
  width:36px!important;height:36px!important;
  border:1px solid var(--line)!important;border-radius:50%!important;
  background:#fff!important;color:var(--black)!important;
  box-shadow:none!important;font-size:22px!important;
}
.customer-form{gap:13px}.customer-form label,.auth-panel label{color:#4e535a;font-size:12px;font-weight:750}
.customer-form input,.customer-form textarea,.customer-form select,.auth-panel input{
  margin-top:6px!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  background:#fff!important;
  color:var(--black)!important;
  box-shadow:none!important;
}
.customer-form input:focus,.customer-form textarea:focus,.customer-form select:focus,.auth-panel input:focus{border-color:var(--red)!important}
.field-help{color:var(--muted)!important;font-size:10px!important}.warning-help{color:#a65c39!important}
.payment-warning,.schedule-warning,.delivery-table-card,.checkout-order-summary,.delivery-auto-notice{border-radius:14px!important;box-shadow:none!important}
.payment-warning,.schedule-warning{background:#fff7ee!important;border:1px solid #f0dfc6!important;color:#765533!important}
.delivery-auto-notice.pending{background:#f5f3f0!important;color:#696d72!important}
.customer-save-btn{margin-top:12px!important}

.cart-page{border-left:1px solid var(--line);background:#fff!important;box-shadow:-28px 0 80px rgba(20,20,20,.15)}
.cart-page-header{padding-bottom:20px;border-bottom:1px solid var(--line)}
.cart-page-header h2,.auth-modal-header h2,.addon-modal h2,.final-order-modal h2,.my-orders-panel-header h2{color:var(--black);font-family:var(--font-main);letter-spacing:-.035em;line-height:.95;text-transform:uppercase}
.cart-page-item{border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important}
.cart-page-item h3{color:var(--black)!important;font-size:21px!important}.cart-page-item p{color:#51565d!important}.cart-page-price strong{color:var(--red)!important}.cart-page-price button{border-radius:999px!important;background:var(--black)!important;color:#fff!important}
.cart-page-summary{background:#fff!important}.cart-page-total{border-top:1px solid var(--line)!important}.cart-page-total strong{color:var(--red)!important}
.cart-page-actions .btn-white{border-color:var(--line);background:#f4f2ef}

.addon-modal{padding:28px!important}.addon-modal h2{font-size:42px!important}.addon-card,.simple-addon-card{border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important}.addon-card-content strong{color:var(--black)!important}.addon-card-content em{color:var(--muted)!important}.addon-card-content span{color:var(--red)!important}.addon-qty-controls button,.addon-primary{background:var(--black)!important;color:#fff!important}.addon-primary:hover,.addon-qty-controls button:hover{background:var(--red)!important}.addon-secondary{border:1px solid var(--line)!important;background:#f3f1ee!important;color:var(--black)!important}

.auth-modal{padding:28px!important}.auth-tabs{padding:4px!important;border-radius:14px!important;background:#f2f0ed!important}.auth-tabs button{border-radius:10px!important;color:var(--muted)!important}.auth-tabs button.active{background:#fff!important;color:var(--black)!important;box-shadow:0 3px 10px rgba(20,20,20,.07)!important}.auth-link-button{color:var(--red)!important}.auth-message{border-radius:12px!important}
.login-required-icon,.next-pizza-icon,.final-order-icon,.order-success-icon{box-shadow:none!important}

.my-orders-panel{background:#fff!important;border-left:1px solid var(--line)!important}.my-orders-panel-header{border-bottom:1px solid var(--line)!important}.my-orders-panel-close{border:1px solid var(--line)!important;background:#fff!important;color:var(--black)!important}.my-orders-panel .my-order-card,.my-orders-panel .empty-orders{border:1px solid var(--line)!important;border-radius:16px!important;background:#fff!important;box-shadow:none!important}

/* -------- Desktop cart layout refinement -------- */
@media (min-width:1421px){
  .summary-column > .summary-card:first-child{top:92px}
  .summary-column > .cart-summary-card{
    grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr)!important;
    gap:14px 18px!important;
    padding:20px!important;
    border:1px solid var(--line)!important;
    border-radius:var(--radius-lg)!important;
  }
  .cart-summary-card .cart-title{margin-bottom:2px!important}
  .cart-summary-card #cartItems{
    grid-template-columns:minmax(0,1fr) minmax(350px,390px)!important;
    gap:18px!important;
  }
  .cart-summary-card .cart-items-scroll{
    height:230px!important;
    max-height:230px!important;
    padding:0 10px 9px 0!important;
    gap:10px!important;
  }
  .cart-summary-card .cart-items-scroll .cart-item{height:220px!important;flex-basis:min(320px,48%)!important}
  .cart-summary-card .cart-totals{
    height:230px!important;
    padding:14px 18px!important;
    grid-template-rows:62px 62px minmax(74px,1fr)!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:#faf9f8!important;
  }
  .cart-summary-card .cart-totals .summary-line{padding:11px 0 10px!important;font-size:14px!important}
  .cart-summary-card .cart-totals .summary-line strong{font-size:15px!important}
  .cart-summary-card .cart-totals .total{padding-top:14px!important;min-height:74px!important}
  .cart-summary-card .cart-totals .total span{font-size:23px!important}.cart-summary-card .cart-totals .total strong{font-size:36px!important}
  .cart-summary-card .customer-edit-btn,.cart-summary-card .btn-whatsapp{min-height:50px!important}
}

/* -------- Tablet / high zoom -------- */
@media (max-width:1420px){
  .builder-layout{grid-template-columns:270px minmax(0,1fr) 330px}
}
@media (max-width:1180px) and (min-width:861px){
  .topbar{padding:0 28px}.nav{gap:13px}.nav a,.auth-top-btn,.my-orders-top-btn{font-size:11px!important}
  .builder-section{padding-left:28px;padding-right:28px}
  .builder-layout{grid-template-columns:minmax(220px,260px) minmax(0,1fr)!important;gap:15px!important}
  .summary-column{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:15px!important}
  .summary-column>.summary-card:first-child{position:static!important}
  .live-ingredients-box{max-height:280px}
  .pizza-preview-card{grid-template-columns:155px minmax(0,1fr)!important}.pizza-visual{width:155px!important;height:145px!important}
}
@media (max-width:860px){
  .topbar{height:70px;padding:0 18px}.brand img{width:165px}.nav.open{top:70px;padding:16px 18px;gap:14px}.nav.open a{font-size:13px}
  .header-cta{display:none}.mobile-menu{font-size:25px}
  .hero{min-height:520px}.hero-content{padding:74px 24px 86px}.hero h1{font-size:clamp(54px,15vw,76px)}.hero-text{font-size:16px}
  .quick-strip{grid-template-columns:1fr;margin:-24px auto 0;padding:0 18px}.quick-strip div{min-height:0;padding:14px 16px}
  .section,.builder-section,.ingredients-section,.location-section{padding:76px 18px}
  .menu-grid{grid-template-columns:1fr;max-width:520px}.pizza-card{min-height:0}.pizza-card img,.pizza-card img.menu-product-img{aspect-ratio:1.7/1;padding:14px 24px 0}.pizza-card-body{padding:20px}.pizza-card h3{font-size:34px}
  .builder-title{text-align:left;margin-bottom:24px}.builder-layout{grid-template-columns:1fr!important}.builder-steps{order:0}.pizza-workspace{order:1}.summary-column{order:2;position:static!important;display:block!important}
  .steps-progress{max-width:100%;margin-bottom:12px}.config-card{padding:15px}.rules-stack{display:none}
  .pizza-workspace{padding:18px;border-radius:20px}.pizza-preview-card{grid-template-columns:115px minmax(0,1fr);gap:14px;margin-bottom:18px;padding-bottom:18px}.pizza-visual{width:115px;height:112px;border-radius:15px}.pizza-preview-card h3{font-size:26px}.pizza-preview-card p{font-size:12px}.pizza-preview-card .eyebrow{font-size:9px;margin-bottom:6px}
  .selector-heading{align-items:flex-start;flex-direction:column;gap:8px}.selector-heading h3{font-size:26px}.ingredients-grid,.ingredients-grid.compact{grid-template-columns:1fr!important}.ingredient-option{min-height:68px}.half-columns{grid-template-columns:1fr!important}.half-columns>div{padding:10px}.wizard-buttons{grid-template-columns:1fr}.wizard-btn{min-height:44px}
  .summary-card{padding:18px;border-radius:20px}.summary-column>.summary-card:first-child{position:static;box-shadow:none}.live-ingredients-box{max-height:255px}.cart-items-scroll{max-height:180px!important}
  .location-layout{grid-template-columns:1fr}.map-card iframe{min-height:280px}.ingredient-banner{grid-template-columns:1fr;gap:28px}.ingredient-banner img{order:-1}
  .mobile-sticky-bar{background:rgba(255,255,255,.96)!important;border-top:1px solid var(--line)!important;box-shadow:0 -8px 30px rgba(20,20,20,.07)!important}.mobile-sticky-link{border-radius:12px!important;text-transform:none!important}.mobile-sticky-link.light{background:#f1efec!important;color:var(--black)!important}.mobile-sticky-link.strong{background:var(--red)!important;color:#fff!important}
}
@media (max-width:480px){
  .brand img{width:150px}.cart-icon{width:38px;height:38px;font-size:18px}.hero h1{font-size:54px}.hero-actions{display:grid;grid-template-columns:1fr}.hero-actions .btn{width:100%}.section-title h2,.builder-title h2,.ingredient-banner h2{font-size:42px}.pizza-card h3{font-size:30px}.card-footer strong{font-size:26px}.card-footer button{font-size:12px}.cart-page{width:100%!important}.addon-modal{padding:22px!important}.addon-modal h2{font-size:36px!important}
}

/* ===== PRUEBA 003 AESTHETIC REFINEMENT ===== */
:root{
  --paper:#f5f1eb;
  --paper-strong:#f0ebe3;
  --ink:#131416;
  --surface-2:#fcfbf9;
  --surface-dark:#111214;
  --surface-dark-2:#17191c;
}
body.flame-minimal-v2{
  background:
    radial-gradient(circle at top right, rgba(233,54,63,.06), transparent 26%),
    linear-gradient(180deg, #f8f4ef 0%, #f3eee7 100%);
  color:var(--ink);
}

.topbar{
  background:rgba(252,250,247,.82);
  border-bottom:1px solid rgba(19,20,22,.08);
  box-shadow:0 10px 28px rgba(16,17,18,.04);
}
.nav a,
.auth-top-btn,
.my-orders-top-btn,
.header-cta{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
}
.nav a{
  padding:0 14px;
  border:1px solid rgba(19,20,22,.08);
  background:rgba(255,255,255,.58);
}
.nav a:hover{
  border-color:rgba(233,54,63,.28);
  background:rgba(233,54,63,.08);
}
.auth-top-btn,
.my-orders-top-btn{
  padding:0 16px!important;
  border:1px solid rgba(19,20,22,.1)!important;
  background:rgba(255,255,255,.88)!important;
  color:var(--ink)!important;
  box-shadow:0 10px 18px rgba(12,13,14,.04);
}
.auth-top-btn:hover,
.my-orders-top-btn:hover{
  border-color:rgba(233,54,63,.28)!important;
  background:rgba(233,54,63,.08)!important;
  color:var(--red)!important;
}
.auth-top-btn.logged,
.my-orders-top-btn.logged{
  background:#fff5f5!important;
  border-color:rgba(233,54,63,.16)!important;
}
.header-cta{
  background:var(--ink);
  border:1px solid transparent;
  box-shadow:0 14px 24px rgba(19,20,22,.12);
}
.cart-icon{
  width:auto;
  min-width:46px;
  padding:0 14px;
  gap:8px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  box-shadow:0 10px 22px rgba(16,17,18,.06);
}

.hero::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:160px;
  background:linear-gradient(180deg, rgba(12,12,12,0) 0%, rgba(12,12,12,.45) 100%);
  z-index:1;
  pointer-events:none;
}
.quick-strip{
  border:1px solid rgba(255,255,255,.3);
  background:rgba(20,21,23,.66);
  backdrop-filter:blur(14px);
  box-shadow:0 26px 42px rgba(16,17,18,.18);
}
.quick-strip strong,
.quick-strip span{color:#fff}
.quick-strip span{opacity:.78}

.menu-section{
  background:linear-gradient(180deg, rgba(255,255,255,.25) 0%, rgba(255,255,255,.7) 100%);
}
.pizza-card{
  border:1px solid rgba(19,20,22,.08)!important;
  background:rgba(255,255,255,.88)!important;
  box-shadow:0 18px 34px rgba(18,19,20,.05)!important;
}
.pizza-card.selectable-pizza-card:hover{
  transform:translateY(-3px);
  box-shadow:0 24px 38px rgba(18,19,20,.08)!important;
}
.pizza-card.highlighted,
.pizza-card.selected,
.pizza-card[data-selected="true"]{
  border-color:rgba(233,54,63,.65)!important;
  box-shadow:0 24px 44px rgba(233,54,63,.12)!important;
}
.badge{
  box-shadow:0 10px 18px rgba(233,54,63,.16);
}

.builder-section,
.ingredients-section{
  position:relative;
  overflow:hidden;
}
.builder-section{
  background:
    radial-gradient(circle at 10% 20%, rgba(233,54,63,.14), transparent 24%),
    radial-gradient(circle at 90% 10%, rgba(255,255,255,.08), transparent 24%),
    linear-gradient(135deg, #0f1012 0%, #17191d 55%, #1d1f23 100%)!important;
}
.builder-section::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url('assets/hero-pizza.jpeg');
  background-size:cover;
  background-position:center right;
  opacity:.12;
  mix-blend-mode:screen;
  pointer-events:none;
}
.builder-title,
.builder-title h2,
.builder-title p,
.builder-title .eyebrow{position:relative;z-index:1}
.builder-title h2,
.builder-title p,
.builder-title .eyebrow{color:#fff!important}
.builder-title p{opacity:.78}
.builder-layout{position:relative;z-index:1}

.builder-steps .config-card,
.pizza-workspace,
.summary-card,
.ingredient-banner,
.location-card,
.map-card{
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:0 24px 50px rgba(0,0,0,.16)!important;
}
.builder-steps .config-card,
.pizza-workspace{
  background:rgba(255,252,248,.94)!important;
  backdrop-filter:blur(14px);
}
.summary-card{
  background:rgba(17,18,20,.92)!important;
  backdrop-filter:blur(16px);
  color:#fff!important;
}
.summary-card h3,
.summary-card .cart-title,
.summary-card .summary-line span,
.summary-card .summary-line strong,
.summary-card .calories-line span,
.summary-card .calories-line strong,
.summary-card .total span,
.summary-card .total strong{
  color:#fff!important;
}
.summary-card .btn-red{
  box-shadow:0 18px 34px rgba(233,54,63,.18);
}

.pizza-preview-card{
  border-bottom:1px solid rgba(19,20,22,.08)!important;
}
.pizza-visual{
  background:linear-gradient(135deg,#fff5f1 0%, #ffffff 55%, #f6f0ea 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8), 0 18px 28px rgba(20,18,17,.07);
}
.selector-panel{
  padding:24px;
  border:1px solid rgba(19,20,22,.08);
  border-radius:26px;
  background:rgba(255,255,255,.9);
  box-shadow:0 18px 34px rgba(14,15,17,.05);
}
.selector-heading{
  margin-bottom:18px;
  padding-bottom:16px;
  border-bottom:1px solid rgba(19,20,22,.08);
}
.ingredient-heading{
  min-height:32px;
  padding:7px 14px;
  border:1px solid rgba(233,54,63,.14);
  border-radius:999px;
  background:#fff6f6!important;
  color:var(--red)!important;
  box-shadow:none!important;
  letter-spacing:.12em!important;
}
.ingredient-option{
  min-height:82px;
  border:1px solid rgba(19,20,22,.08);
  border-radius:18px;
  background:linear-gradient(180deg,#ffffff 0%, #faf7f3 100%);
  box-shadow:0 10px 20px rgba(18,19,20,.04);
}
.ingredient-option:hover{
  border-color:rgba(233,54,63,.22);
  background:#fffafa;
  box-shadow:0 18px 26px rgba(233,54,63,.08);
}
.ingredient-option:has(input:checked){
  border-color:rgba(233,54,63,.72);
  background:linear-gradient(180deg,#fff7f7 0%, #fff0f0 100%);
  box-shadow:0 16px 26px rgba(233,54,63,.12), inset 0 0 0 1px rgba(233,54,63,.35);
}
.ingredient-option span{font-size:14px}
.ingredient-option small{font-size:10.5px;line-height:1.42}
.premium-step-note{
  border-radius:16px;
  background:linear-gradient(180deg,#fff6f6 0%, #ffecec 100%);
}

.live-ingredients-box{
  background:linear-gradient(180deg, rgba(255,255,255,.03) 0%, rgba(255,255,255,.015) 100%);
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
}
.live-ingredient-group span{color:#ffd4d7!important}
.live-ingredient-group p{color:rgba(255,255,255,.62)!important}
.pricing-breakdown{
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.03) 0%, rgba(255,255,255,.01) 100%);
}
.pricing-breakdown-head strong{font-size:13px}
.pricing-breakdown-head small{color:rgba(255,255,255,.72)!important}
.pricing-breakdown-line{
  padding:2px 0;
  color:rgba(255,255,255,.78);
}
.pricing-breakdown-line strong{font-size:12px}
.pricing-breakdown-line.is-zero span,
.pricing-breakdown-line.is-zero strong{color:rgba(255,255,255,.45)!important}
.summary-card .total{
  padding-top:18px!important;
  margin-top:18px!important;
  border-top:1px solid rgba(255,255,255,.1)!important;
}
.summary-card .total span{
  font-size:18px!important;
  letter-spacing:.02em;
}
.summary-card .total strong{
  color:#ff646b!important;
}
.customer-info-card,
.cart-summary-card{
  background:rgba(255,252,248,.96)!important;
  color:var(--ink)!important;
}
.customer-info-card *,
.cart-summary-card *{
  color:inherit;
}
.customer-info-card h3,
.cart-summary-card h3,
.cart-summary-card .summary-line span,
.cart-summary-card .summary-line strong,
.cart-summary-card .total span{
  color:var(--ink)!important;
}
.cart-summary-card .total strong,
.customer-info-card .btn-red strong{color:var(--red)!important}
.cart-summary-card #cartItems .cart-item{
  border:1px solid rgba(19,20,22,.08)!important;
  background:linear-gradient(180deg,#fff 0%, #fbf8f4 100%)!important;
  box-shadow:0 14px 28px rgba(19,20,22,.05)!important;
}
.cart-summary-card .cart-totals{
  background:linear-gradient(180deg,#fff 0%, #fbf8f4 100%)!important;
}
.cart-summary-card .customer-edit-btn{
  background:var(--ink)!important;
  color:#fff!important;
}

.ingredients-section{
  background:
    radial-gradient(circle at 90% 12%, rgba(233,54,63,.08), transparent 22%),
    linear-gradient(180deg,#141518 0%, #101113 100%)!important;
}
.ingredients-section::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url('assets/hero-pizza.jpeg');
  background-size:cover;
  background-position:center;
  opacity:.08;
  pointer-events:none;
}
.ingredient-banner{
  position:relative;
  z-index:1;
  grid-template-columns:minmax(0, .95fr) minmax(280px, 480px);
  gap:28px;
  padding:28px;
  border-radius:30px;
  background:rgba(255,252,248,.08)!important;
  backdrop-filter:blur(18px);
}
.ingredient-banner h2,
.ingredient-banner p,
.ingredient-banner .eyebrow{color:#fff!important}
.ingredient-banner p{opacity:.76}
.ingredient-banner img{
  width:100%;
  max-height:420px;
  object-fit:cover;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 20px 40px rgba(0,0,0,.22);
}

.location-section{
  background:linear-gradient(180deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.5) 100%);
}
.location-card,
.map-card{
  background:rgba(255,255,255,.92)!important;
}
.footer{
  background:#fffaf5;
}

.cart-page{
  background:#fbf7f2!important;
}
.cart-page-items{
  max-height:calc(100vh - 360px)!important;
  overflow:auto!important;
  padding-right:10px!important;
}
.cart-page-summary{
  position:sticky!important;
  bottom:0;
  z-index:2;
  padding-top:20px!important;
  background:linear-gradient(180deg, rgba(251,247,242,.92) 0%, rgba(251,247,242,1) 22%)!important;
  border-top:1px solid var(--line)!important;
}
.cart-page-actions{
  position:sticky!important;
  bottom:0;
  z-index:3;
  background:#fbf7f2!important;
  padding-top:14px!important;
}

@media (max-width:1180px){
  .nav a{padding:0 12px}
  .topbar{gap:12px}
}
@media (max-width:860px){
  .topbar{background:rgba(252,250,247,.92)}
  .nav.open{
    background:rgba(252,250,247,.98);
    border-bottom:1px solid rgba(19,20,22,.08);
  }
  .nav.open a,
  .nav.open .auth-top-btn,
  .nav.open .my-orders-top-btn{
    width:100%;
    justify-content:flex-start;
    padding:0 14px!important;
    border:1px solid rgba(19,20,22,.08)!important;
    background:#fff!important;
  }
  .builder-section::before{opacity:.18;background-position:center}
  .builder-steps .config-card,
  .pizza-workspace,
  .summary-card,
  .ingredient-banner,
  .location-card,
  .map-card{box-shadow:0 18px 32px rgba(0,0,0,.14)!important}
  .selector-panel{padding:18px;border-radius:22px}
  .ingredient-banner{grid-template-columns:1fr;padding:20px}
  .ingredient-banner img{max-height:260px;order:-1}
}


/* ===== PRUEBA 004 background swap fix ===== */
.builder-section{
  background:
    radial-gradient(circle at 12% 18%, rgba(233,54,63,.14), transparent 26%),
    radial-gradient(circle at 88% 8%, rgba(233,54,63,.08), transparent 20%),
    linear-gradient(135deg, #0b0c0e 0%, #111317 52%, #17191d 100%) !important;
}
.builder-section::before{
  background-image:url('assets/hero-pizza.jpeg') !important;
  background-size:cover !important;
  background-position:center center !important;
  opacity:.32 !important;
  mix-blend-mode:screen !important;
}
.builder-section::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(10,10,12,.76) 0%, rgba(12,12,14,.58) 35%, rgba(13,13,15,.62) 100%);
  pointer-events:none;
}
.builder-title, .builder-layout{position:relative; z-index:1;}

.ingredients-section{
  background:
    radial-gradient(circle at 84% 15%, rgba(233,54,63,.10), transparent 20%),
    linear-gradient(135deg, #0c0d10 0%, #15171a 100%) !important;
}
.ingredients-section::before{
  background-image:url('assets/INGREDIENTES.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  opacity:.34 !important;
}
.ingredients-section::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(10,11,12,.74) 0%, rgba(10,11,12,.48) 45%, rgba(10,11,12,.68) 100%);
  pointer-events:none;
}
.ingredient-banner{
  position:relative;
  z-index:1;
  background:rgba(255,252,248,.10) !important;
}
.ingredient-banner img{
  content:url('assets/INGREDIENTES.png');
  object-position:center center;
}
@media (max-width:860px){
  .builder-section::before{opacity:.26 !important; background-position:center center !important;}
  .builder-section::after{background:linear-gradient(180deg, rgba(10,10,12,.72) 0%, rgba(10,10,12,.58) 100%) !important;}
  .ingredients-section::before{opacity:.28 !important;}
  .ingredients-section::after{background:linear-gradient(180deg, rgba(10,11,12,.75) 0%, rgba(10,11,12,.58) 100%) !important;}
}


/* ===== PRUEBA 005 corrections ===== */
.builder-section{
  padding-bottom:130px !important;
  background:
    radial-gradient(circle at 78% 12%, rgba(233,54,63,.14), transparent 20%),
    linear-gradient(135deg, #090a0c 0%, #0f1115 48%, #13161a 100%) !important;
  box-shadow:inset 0 -40px 70px rgba(0,0,0,.45);
}
.builder-section::before{
  background-image:url('assets/hero-pizza.jpeg') !important;
  background-size:cover !important;
  background-position:center right !important;
  opacity:.52 !important;
  mix-blend-mode:screen !important;
}
.builder-section::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(7,8,10,.86) 0%, rgba(9,10,12,.74) 32%, rgba(12,13,15,.56) 100%);
  pointer-events:none;
}
.builder-title, .builder-layout{position:relative;z-index:1;}
.builder-section .summary-card,.builder-section .pizza-workspace,.builder-section .config-card{box-shadow:0 24px 44px rgba(0,0,0,.2)!important;}
.summary-card .summary-line,.summary-card .calories-line{border-color:rgba(255,255,255,.1)!important}
.summary-card .summary-line span,.summary-card .calories-line span{color:rgba(255,255,255,.76)!important}
.summary-card .summary-line strong,.summary-card .calories-line strong{color:#fff!important}
.summary-card .btn-red{color:#fff!important}
.cart-summary-card .empty-cart, .cart-summary-card .empty-cart strong, .cart-summary-card .empty-cart p{color:#626871 !important;}
.cart-summary-card .btn-dark, .cart-summary-card .btn-whatsapp{color:#fff !important;}
.cart-summary-card .cart-title small{color:#666d75 !important;}

.ingredients-section{
  margin-top:0 !important;
  padding-top:96px !important;
  background:
    linear-gradient(180deg, #262524 0%, #1f1f1e 100%) !important;
  border-top:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 28px 60px rgba(0,0,0,.24);
}
.ingredients-section::before{
  background-image:url('assets/INGREDIENTES.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  opacity:.24 !important;
}
.ingredients-section::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, rgba(25,24,24,.72) 0%, rgba(29,28,27,.58) 40%, rgba(23,22,22,.72) 100%);
}
.ingredient-banner{
  max-width:1180px;
  margin:0 auto;
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.1) !important;
}
.ingredient-banner .eyebrow,.ingredient-banner h2,.ingredient-banner p{position:relative;z-index:1;}
.ingredient-banner h2{max-width:600px;}
.ingredient-banner p{max-width:680px;color:rgba(255,255,255,.88)!important}
.ingredient-banner img{
  content:url('assets/INGREDIENTES.png');
  max-height:360px;
}

.location-section{
  position:relative;
  padding-top:110px !important;
  padding-bottom:110px !important;
  background:linear-gradient(180deg, #2e2c29 0%, #272522 100%) !important;
}
.location-layout{
  max-width:1160px;
  overflow:visible !important;
  align-items:stretch;
}
.location-card,.map-card{
  position:relative;
  overflow:visible !important;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  background:rgba(255,252,248,.96) !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 22px 44px rgba(0,0,0,.18) !important;
}
.location-card:hover,.map-card:hover{
  transform:translateY(-6px);
  box-shadow:0 28px 56px rgba(0,0,0,.22) !important;
}
.location-card::before,.map-card::before{
  position:absolute;
  top:50%;
  font-family:var(--font-main);
  font-size:52px;
  line-height:.82;
  letter-spacing:.04em;
  color:rgba(255,255,255,.22);
  text-transform:uppercase;
  transition:transform .22s ease, color .22s ease, opacity .22s ease;
  pointer-events:none;
}
.location-card::before{
  content:"TU VIDA";
  left:-72px;
  writing-mode:vertical-rl;
  transform:translateY(-50%) rotate(180deg);
}
.map-card::before{
  content:"TU PIZZA";
  right:-72px;
  writing-mode:vertical-rl;
  transform:translateY(-50%);
}
.location-card:hover::before,.map-card:hover::before{
  color:rgba(255,255,255,.46);
}
.location-card:hover::before{transform:translateY(-50%) rotate(180deg) translateX(3px);}
.map-card:hover::before{transform:translateY(-50%) translateX(3px);}
.location-card h2,.location-card p,.location-card a{position:relative;z-index:1;}
.map-card iframe{filter:saturate(.94) contrast(.96);}

@media (max-width:1180px){
  .location-card::before,.map-card::before{font-size:42px;left:auto;right:auto}
}
@media (max-width:860px){
  .builder-section{padding-bottom:90px !important;}
  .builder-section::before{background-position:65% center !important;opacity:.34 !important;}
  .builder-section::after{background:linear-gradient(180deg, rgba(8,9,11,.86) 0%, rgba(10,11,13,.72) 100%) !important;}
  .ingredients-section{padding-top:78px !important;}
  .ingredients-section::before{opacity:.18 !important;}
  .ingredient-banner img{max-height:240px;}
  .location-layout{grid-template-columns:1fr !important;gap:18px !important;}
  .location-card::before,.map-card::before{display:none;}
}


/* ===== PRUEBA 006 hero-pizza visibility fix ===== */
.builder-section{
  background:
    radial-gradient(circle at 80% 10%, rgba(233,54,63,.16), transparent 22%),
    linear-gradient(135deg, #090a0c 0%, #0d0f13 46%, #121419 100%) !important;
}
.builder-section::before{
  background-image:url('assets/hero-pizza.jpeg') !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:72% center !important;
  opacity:.78 !important;
  mix-blend-mode:screen !important;
  filter:saturate(1.08) contrast(1.06) brightness(.95);
}
.builder-section::after{
  background:linear-gradient(90deg, rgba(7,8,10,.68) 0%, rgba(9,10,12,.52) 34%, rgba(12,13,15,.34) 100%) !important;
}
@media (max-width:1180px){
  .builder-section::before{background-position:66% center !important; opacity:.72 !important;}
  .builder-section::after{background:linear-gradient(90deg, rgba(7,8,10,.74) 0%, rgba(9,10,12,.58) 40%, rgba(12,13,15,.38) 100%) !important;}
}
@media (max-width:860px){
  .builder-section::before{background-position:62% center !important; opacity:.62 !important; filter:saturate(1.02) contrast(1.02) brightness(.92);} 
  .builder-section::after{background:linear-gradient(180deg, rgba(8,9,11,.76) 0%, rgba(10,11,13,.56) 100%) !important;}
}


/* ===== PRUEBA 007: fixed background layer + readable hero strip ===== */
/* The old builder pseudo-layer was still 1px tall from the original stylesheet. */
.builder-section::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  width:auto !important;
  height:auto !important;
  min-height:100% !important;
  background-image:url('assets/hero-pizza.jpeg') !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  background-position:72% center !important;
  opacity:.78 !important;
  mix-blend-mode:screen !important;
  filter:saturate(1.08) contrast(1.06) brightness(.95) !important;
  pointer-events:none !important;
}
.builder-section::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background:linear-gradient(90deg, rgba(7,8,10,.78) 0%, rgba(9,10,12,.58) 34%, rgba(12,13,15,.28) 100%) !important;
  pointer-events:none !important;
}
.builder-title,.builder-layout{position:relative !important;z-index:1 !important;}

/* Readability: quick value cards are light surfaces with dark text. */
.quick-strip{
  background:rgba(25,25,26,.76) !important;
  border:1px solid rgba(255,255,255,.16) !important;
}
.quick-strip div{
  background:rgba(255,255,255,.97) !important;
  border:1px solid rgba(255,255,255,.45) !important;
  box-shadow:0 12px 22px rgba(0,0,0,.12) !important;
}
.quick-strip strong{color:#17181a !important;opacity:1 !important;}
.quick-strip span{color:#555a60 !important;opacity:1 !important;}

@media (max-width:1180px){
  .builder-section::before{background-position:66% center !important;opacity:.72 !important;}
  .builder-section::after{background:linear-gradient(90deg, rgba(7,8,10,.80) 0%, rgba(9,10,12,.62) 40%, rgba(12,13,15,.36) 100%) !important;}
}
@media (max-width:860px){
  .builder-section::before{background-position:62% center !important;opacity:.55 !important;}
  .builder-section::after{background:linear-gradient(180deg, rgba(8,9,11,.78) 0%, rgba(10,11,13,.50) 100%) !important;}
}


/* ===== PRUEBA 008 requested refinements ===== */
body.flame-minimal-v2{background:#f6f4ef !important;}

.builder-section{
  position:relative;
  padding-bottom:72px !important;
  background:
    radial-gradient(circle at 82% 8%, rgba(233,54,63,.10), transparent 18%),
    linear-gradient(135deg, #0c0d10 0%, #121418 50%, #171a1f 100%) !important;
}
.builder-section::before{
  background-image:url('assets/hero-pizza.jpeg') !important;
  background-size:cover !important;
  background-position:72% center !important;
  opacity:.42 !important;
  filter:saturate(.92) contrast(1.02) brightness(.72) blur(.3px) !important;
  mix-blend-mode:screen !important;
}
.builder-section::after{
  background:linear-gradient(90deg, rgba(10,11,13,.78) 0%, rgba(12,13,16,.66) 34%, rgba(14,15,18,.42) 100%) !important;
}

/* leave a visible image strip, then a white spacer before ingredients */
.ingredients-section{
  margin-top:88px !important;
  padding-top:92px !important;
  background:#f8f7f3 !important;
  box-shadow:none !important;
}
.ingredients-section::before{
  background-image:url('assets/INGREDIENTES.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  opacity:.14 !important;
}
.ingredients-section::after{
  background:linear-gradient(180deg, rgba(248,247,243,.78) 0%, rgba(248,247,243,.92) 34%, rgba(248,247,243,1) 100%) !important;
}
.ingredient-banner{
  background:rgba(255,255,255,.70) !important;
  border:1px solid rgba(19,20,22,.08) !important;
  box-shadow:0 20px 40px rgba(18,19,20,.08) !important;
  backdrop-filter:blur(10px);
}
.ingredient-banner .eyebrow{color:var(--red)!important;}
.ingredient-banner h2{color:var(--black)!important;}
.ingredient-banner p{color:#3f464d !important;opacity:1 !important;}

/* quick-strip cards: remove ugly dark slab, add hover */
.quick-strip{
  background:transparent !important;
  box-shadow:none !important;
  border:none !important;
  backdrop-filter:none !important;
  padding:0 !important;
  gap:14px !important;
}
.quick-strip div{
  background:#fff !important;
  border:1px solid rgba(19,20,22,.08) !important;
  box-shadow:0 16px 28px rgba(18,19,20,.10) !important;
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
.quick-strip div:hover{
  transform:translateY(-5px) !important;
  box-shadow:0 24px 34px rgba(18,19,20,.14) !important;
  border-color:rgba(233,54,63,.18) !important;
}
.quick-strip strong{color:#202328 !important;}
.quick-strip span{color:#60666d !important;}

/* cart area cleaner before ingredients */
.cart-summary-card{box-shadow:0 18px 34px rgba(18,19,20,.10) !important;}

/* pricing box spacing */
.pricing-breakdown{
  padding:16px 16px 14px !important;
  border-radius:18px !important;
}
.pricing-breakdown-head{
  margin-bottom:10px !important;
  gap:16px !important;
}
.pricing-breakdown-head strong,
.pricing-breakdown-head small{
  line-height:1.3 !important;
}
.pricing-breakdown-line{
  padding:6px 0 !important;
  gap:18px !important;
  line-height:1.3 !important;
}
.pricing-breakdown-line span{
  flex:1 1 auto;
}
.pricing-breakdown-line strong{
  flex:0 0 auto;
  min-width:56px;
  text-align:right;
}

@media (max-width:1180px){
  .builder-section::before{opacity:.36 !important; background-position:68% center !important;}
  .builder-section::after{background:linear-gradient(90deg, rgba(10,11,13,.82) 0%, rgba(12,13,16,.68) 42%, rgba(14,15,18,.48) 100%) !important;}
}
@media (max-width:860px){
  .builder-section{padding-bottom:56px !important;}
  .builder-section::before{opacity:.28 !important; background-position:64% center !important;}
  .builder-section::after{background:linear-gradient(180deg, rgba(10,11,13,.82) 0%, rgba(12,13,16,.62) 100%) !important;}
  .ingredients-section{margin-top:56px !important; padding-top:72px !important;}
  .quick-strip{gap:12px !important;}
}


/* ===== PRUEBA 009 final requested fixes ===== */
.builder-section{
  padding-bottom:64px !important;
}
.builder-section::before{
  opacity:.34 !important;
  filter:saturate(.88) contrast(1.0) brightness(.62) blur(.4px) !important;
}
.builder-section::after{
  background:linear-gradient(90deg, rgba(10,11,13,.82) 0%, rgba(12,13,16,.70) 34%, rgba(14,15,18,.50) 100%) !important;
}

.ingredients-section{
  position:relative !important;
  margin-top:0 !important;
  padding-top:148px !important;
  padding-bottom:96px !important;
  background:#f8f7f3 !important;
  overflow:hidden !important;
}
.ingredients-section::before{
  content:"" !important;
  position:absolute !important;
  top:118px !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  background-image:url('assets/INGREDIENTES.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  opacity:.15 !important;
  pointer-events:none !important;
}
.ingredients-section::after{
  content:"" !important;
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  height:118px !important;
  background:#f8f7f3 !important;
  pointer-events:none !important;
}
.ingredient-banner{
  position:relative !important;
  z-index:1 !important;
  background:rgba(255,255,255,.80) !important;
  border:1px solid rgba(19,20,22,.08) !important;
  box-shadow:0 20px 42px rgba(18,19,20,.08) !important;
}
.ingredient-banner .eyebrow{color:var(--red) !important;}
.ingredient-banner h2{color:var(--black) !important;}
.ingredient-banner p{color:#454b52 !important; opacity:1 !important;}

.summary-card .live-ingredient-group>span,
.summary-card .live-ingredient-group span{
  color:var(--red) !important;
}

.location-card .btn-red,
.location-card .btn-red:hover,
.location-card .btn-red:focus{
  color:#fff !important;
}
.location-card .btn-red *,
.location-card .btn-red:hover *,
.location-card .btn-red:focus *{
  color:#fff !important;
}

@media (max-width:860px){
  .ingredients-section{padding-top:124px !important; padding-bottom:72px !important;}
  .ingredients-section::before{top:96px !important; opacity:.12 !important;}
  .ingredients-section::after{height:96px !important;}
}


/* ===== PRUEBA 010 ingredientes section restoration ===== */
.ingredients-section{
  position:relative !important;
  margin-top:0 !important;
  padding-top:118px !important;
  padding-bottom:118px !important;
  background:#f8f7f3 !important;
  overflow:hidden !important;
}
.ingredients-section::before{
  content:"" !important;
  position:absolute !important;
  top:118px !important;
  left:0 !important;
  right:0 !important;
  bottom:118px !important;
  background-image:url('assets/INGREDIENTES.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  opacity:.38 !important;
  pointer-events:none !important;
}
.ingredients-section::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:118px !important;
  bottom:118px !important;
  background:linear-gradient(90deg, rgba(10,11,12,.76) 0%, rgba(12,12,14,.56) 45%, rgba(10,11,12,.72) 100%) !important;
  pointer-events:none !important;
}
.ingredient-banner{
  position:relative !important;
  z-index:1 !important;
  background:rgba(255,252,248,.08) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 24px 44px rgba(0,0,0,.20) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
}
.ingredient-banner .eyebrow,
.ingredient-banner h2,
.ingredient-banner p{color:#fff !important;}
.ingredient-banner .eyebrow{opacity:.95 !important;}
.ingredient-banner p{opacity:.80 !important;}
.ingredient-banner img{
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 20px 40px rgba(0,0,0,.22) !important;
}
@media (max-width:860px){
  .ingredients-section{
    padding-top:96px !important;
    padding-bottom:96px !important;
  }
  .ingredients-section::before,
  .ingredients-section::after{
    top:96px !important;
    bottom:96px !important;
  }
}


/* ===== PRUEBA 011 ingredients dark section fix ===== */
.ingredients-section{
  position:relative !important;
  margin-top:0 !important;
  padding:96px 0 !important;
  background:#f6f4ef !important;
  overflow:hidden !important;
}
.ingredients-section::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:56px !important;
  bottom:56px !important;
  background-image:url('assets/INGREDIENTES.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
  opacity:1 !important;
  filter:brightness(.34) saturate(.92) contrast(1.02) !important;
  pointer-events:none !important;
}
.ingredients-section::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  top:56px !important;
  bottom:56px !important;
  background:
    linear-gradient(90deg, rgba(10,11,12,.80) 0%, rgba(12,12,14,.58) 42%, rgba(10,11,12,.78) 100%),
    linear-gradient(180deg, rgba(12,12,14,.18) 0%, rgba(12,12,14,.18) 100%) !important;
  pointer-events:none !important;
}
.ingredient-banner{
  position:relative !important;
  z-index:2 !important;
  max-width:1140px !important;
  margin:0 auto !important;
  padding:56px 64px !important;
  border-radius:30px !important;
  background:rgba(255,255,255,.08) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 28px 54px rgba(0,0,0,.22) !important;
  backdrop-filter:blur(18px) !important;
  -webkit-backdrop-filter:blur(18px) !important;
}
.ingredient-banner .eyebrow,
.ingredient-banner h2,
.ingredient-banner p{
  color:#fff !important;
}
.ingredient-banner h2{max-width:640px !important;}
.ingredient-banner p{
  max-width:700px !important;
  color:rgba(255,255,255,.84) !important;
  opacity:1 !important;
}
.ingredient-banner img{
  border:1px solid rgba(255,255,255,.12) !important;
  box-shadow:0 20px 42px rgba(0,0,0,.26) !important;
}

@media (max-width:860px){
  .ingredients-section{
    padding:72px 0 !important;
  }
  .ingredients-section::before,
  .ingredients-section::after{
    top:36px !important;
    bottom:36px !important;
  }
  .ingredient-banner{
    padding:30px 24px !important;
    border-radius:24px !important;
  }
}


/* ===== PRUEBA 012 fix dark block on ingredients image ===== */
.ingredients-section::before{
  top:56px !important;
  bottom:56px !important;
  opacity:1 !important;
  filter:brightness(.30) saturate(.94) contrast(1.02) !important;
}
.ingredients-section::after{
  top:56px !important;
  bottom:56px !important;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.03) 0%, rgba(255,255,255,0) 42%),
    linear-gradient(180deg, rgba(11,12,14,.26) 0%, rgba(11,12,14,.26) 100%) !important;
}
.ingredient-banner{
  background:rgba(255,255,255,.07) !important;
}

/* ==================================================================
   AJUSTE FINAL LOCAL — INGREDIENTES + TEXTOS TU VIDA / TU PIZZA
   Este bloque debe quedar al final del archivo.
   ================================================================== */

/* Sección Ingredientes: una sola capa oscura, sin franja/línea extra */
.ingredients-section {
  position: relative !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 56px 0 !important;
  background: #f6f4ef !important;
}

.ingredients-section::before {
  content: "" !important;
  position: absolute !important;
  inset: 56px 0 !important;

  /* Foto + filtro oscuro en la misma capa para que no aparezcan franjas */
  background-image:
    linear-gradient(rgba(8, 9, 10, 0.42), rgba(8, 9, 10, 0.42)),
    linear-gradient(
      90deg,
      rgba(8, 9, 10, 0.72) 0%,
      rgba(8, 9, 10, 0.42) 50%,
      rgba(8, 9, 10, 0.70) 100%
    ),
    url("assets/INGREDIENTES.png") !important;

  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  opacity: 1 !important;
  filter: none !important;
  pointer-events: none !important;
}

/* No usar una segunda capa: era la causa de la franja oscura */
.ingredients-section::after {
  content: none !important;
  display: none !important;
}

/* El cuadro queda dentro de la imagen y con aire arriba/abajo */
.ingredient-banner {
  position: relative !important;
  z-index: 2 !important;
  max-width: 1140px !important;
  margin: 38px auto !important;
  padding: 56px 64px !important;
  border-radius: 30px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 28px 54px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}

.ingredient-banner .eyebrow,
.ingredient-banner h2 {
  color: #fff !important;
}

.ingredient-banner p {
  color: rgba(255, 255, 255, 0.84) !important;
  opacity: 1 !important;
}

/* TU VIDA / TU PIZZA: palabras corridas, grandes, sólidas y verticales */
.location-card::before,
.map-card::before {
  writing-mode: horizontal-tb !important;
  white-space: nowrap !important;
  top: 50% !important;

  /* Ajustes visuales editables */
  font-size: 72px !important;
  font-weight: 900 !important;
  color: rgba(255, 255, 255, 0.80) !important;
  letter-spacing: 0.35em !important;
  line-height: 1 !important;
  text-shadow: 0 4px 18px rgba(0, 0, 0, 0.22) !important;
  opacity: 1 !important;
}

/* TU VIDA: lectura de abajo hacia arriba */
.location-card::before {
  left: -72px !important;
  right: auto !important;
  transform: translate(-50%, -50%) rotate(-90deg) !important;
}

/* TU PIZZA: lectura de arriba hacia abajo */
.map-card::before {
  right: -72px !important;
  left: auto !important;
  transform: translate(50%, -50%) rotate(90deg) !important;
}

/* Mantiene el hover vinculado a cada tarjeta */
.location-card:hover::before {
  color: rgba(255, 255, 255, 0.96) !important;
  transform: translate(-50%, -50%) rotate(-90deg) scale(1.05) !important;
}

.map-card:hover::before {
  color: rgba(255, 255, 255, 0.96) !important;
  transform: translate(50%, -50%) rotate(90deg) scale(1.05) !important;
}

@media (max-width: 860px) {
  .ingredients-section {
    padding: 36px 0 !important;
  }

  .ingredients-section::before {
    inset: 36px 0 !important;
  }

  .ingredient-banner {
    margin: 24px 18px !important;
    padding: 30px 24px !important;
    border-radius: 24px !important;
  }

  .location-card::before,
  .map-card::before {
    display: none !important;
  }
}

/* ================================================================
   NAVBAR AESTHETIC — FLAME PIZZA
   Reemplaza el look de "muchos botones separados" por una barra
   editorial con navegación segmentada, acciones claras y más aire.
   ================================================================ */

.topbar {
  height: 82px !important;
  padding: 0 clamp(22px, 4vw, 68px) !important;
  gap: 14px !important;
  background: rgba(251, 249, 245, 0.92) !important;
  border-bottom: 1px solid rgba(19, 20, 22, 0.08) !important;
  box-shadow: 0 12px 30px rgba(16, 17, 18, 0.05) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
}

.brand {
  position: relative !important;
  padding-right: 22px !important;
}

.brand::after {
  content: "" !important;
  position: absolute !important;
  right: 0 !important;
  top: 50% !important;
  width: 1px !important;
  height: 30px !important;
  transform: translateY(-50%) !important;
  background: rgba(19, 20, 22, 0.10) !important;
}

.brand img {
  width: 184px !important;
  max-height: 46px !important;
}

/* Grupo central de navegación */
.nav {
  margin-left: auto !important;
  gap: 2px !important;
  padding: 4px !important;
  border: 1px solid rgba(19, 20, 22, 0.08) !important;
  border-radius: 999px !important;
  background: rgba(238, 235, 229, 0.82) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.78), 0 8px 18px rgba(16, 17, 18, 0.035) !important;
}

.nav a,
.nav .auth-top-btn,
.nav .my-orders-top-btn {
  min-height: 36px !important;
  height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 13px !important;
  border: 1px solid transparent !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #5a5f66 !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  box-shadow: none !important;
  transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease !important;
}

.nav a:hover,
.nav .auth-top-btn:hover,
.nav .my-orders-top-btn:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(19, 20, 22, 0.08) !important;
  background: #ffffff !important;
  color: #181a1d !important;
  box-shadow: 0 6px 12px rgba(18, 19, 20, 0.07) !important;
}

/* Acción principal dentro de navegación: Arma tu pizza */
.nav a[href="#builder"] {
  background: rgba(233, 54, 63, 0.10) !important;
  color: var(--red) !important;
}

.nav a[href="#builder"]:hover {
  background: var(--red) !important;
  border-color: var(--red) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 16px rgba(233, 54, 63, 0.20) !important;
}

/* Cuenta conectada: especial pero discreta */
.nav .auth-top-btn.logged {
  border-color: rgba(233, 54, 63, 0.20) !important;
  background: #fff6f6 !important;
  color: #9d3036 !important;
}

.nav .auth-top-btn.logged:hover {
  background: #fff !important;
  color: var(--red) !important;
}

/* Mis pedidos se lee como acción secundaria clara */
.nav .my-orders-top-btn {
  background: rgba(255, 255, 255, 0.72) !important;
  color: #26292d !important;
  border-color: rgba(19, 20, 22, 0.08) !important;
}

/* CTA final */
.header-cta {
  min-height: 42px !important;
  padding: 0 20px !important;
  border: 1px solid #111214 !important;
  border-radius: 999px !important;
  background: #111214 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0.01em !important;
  box-shadow: 0 12px 20px rgba(17, 18, 20, 0.16) !important;
  transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease !important;
}

.header-cta:hover {
  transform: translateY(-2px) !important;
  background: var(--red) !important;
  border-color: var(--red) !important;
  box-shadow: 0 16px 24px rgba(233, 54, 63, 0.24) !important;
}

/* Carrito como botón circular limpio */
.cart-icon {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  border: 1px solid rgba(19, 20, 22, 0.10) !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: #202226 !important;
  box-shadow: 0 10px 18px rgba(16, 17, 18, 0.06) !important;
}

.cart-icon:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(233, 54, 63, 0.38) !important;
  box-shadow: 0 14px 22px rgba(233, 54, 63, 0.14) !important;
}

.cart-icon span {
  top: -5px !important;
  right: -5px !important;
  width: 18px !important;
  height: 18px !important;
  border: 2px solid #fbf9f5 !important;
  background: var(--red) !important;
  color: #ffffff !important;
  font-size: 10px !important;
  box-shadow: none !important;
}

/* Tablet / zoom alto: evita que se rompa antes de abrir menú móvil */
@media (max-width: 1280px) and (min-width: 1151px) {
  .topbar { padding: 0 24px !important; gap: 10px !important; }
  .brand { padding-right: 15px !important; }
  .brand img { width: 165px !important; }
  .nav { gap: 1px !important; padding: 3px !important; }
  .nav a,
  .nav .auth-top-btn,
  .nav .my-orders-top-btn { padding: 0 10px !important; font-size: 10px !important; min-height: 34px !important; height: 34px !important; }
  .header-cta { min-height: 38px !important; padding: 0 14px !important; font-size: 10px !important; }
  .cart-icon { width: 40px !important; min-width: 40px !important; height: 40px !important; }
}

/* Menú móvil / tablet */
@media (max-width: 1150px) {
  .topbar {
    height: 74px !important;
    padding: 0 18px !important;
  }

  .brand { padding-right: 0 !important; }
  .brand::after { display: none !important; }
  .brand img { width: 166px !important; }

  .nav.open {
    top: 74px !important;
    left: 12px !important;
    right: 12px !important;
    display: grid !important;
    gap: 8px !important;
    padding: 12px !important;
    border: 1px solid rgba(19, 20, 22, 0.08) !important;
    border-radius: 20px !important;
    background: rgba(251, 249, 245, 0.98) !important;
    box-shadow: 0 18px 42px rgba(16, 17, 18, 0.14) !important;
  }

  .nav.open a,
  .nav.open .auth-top-btn,
  .nav.open .my-orders-top-btn {
    width: 100% !important;
    min-height: 44px !important;
    justify-content: flex-start !important;
    padding: 0 14px !important;
    border: 1px solid rgba(19, 20, 22, 0.08) !important;
    background: #ffffff !important;
    color: #24272b !important;
  }

  .nav.open a[href="#builder"],
  .nav.open .auth-top-btn.logged {
    background: #fff5f5 !important;
    border-color: rgba(233, 54, 63, 0.18) !important;
    color: var(--red) !important;
  }
}

@media (max-width: 480px) {
  .topbar { gap: 10px !important; }
  .brand img { width: 152px !important; }
  .cart-icon { width: 40px !important; min-width: 40px !important; height: 40px !important; }
}

/* ================================================================
   NAVBAR — INDICADOR ACTIVO DESLIZANTE
   El indicador rojo se mueve por la barra al seleccionar una sección.
   ================================================================ */
@media (min-width: 1151px) {
  .topbar {
    gap: 14px !important;
  }

  /* La navegación usa todo el espacio disponible entre el logo y las acciones finales. */
  .nav {
    position: relative !important;
    isolation: isolate !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-left: clamp(20px, 4vw, 96px) !important;
    margin-right: 0 !important;
    justify-content: space-between !important;
    gap: 0 !important;
    overflow: hidden !important;
  }

  .nav a,
  .nav .auth-top-btn,
  .nav .my-orders-top-btn {
    position: relative !important;
    z-index: 2 !important;
  }

  /* Cápsula que se posiciona con JavaScript debajo del link activo. */
  .nav-active-indicator {
    position: absolute !important;
    z-index: 1 !important;
    top: 4px !important;
    left: 4px !important;
    width: 0 !important;
    height: calc(100% - 8px) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(233, 54, 63, 0.16), rgba(233, 54, 63, 0.09)) !important;
    box-shadow:
      inset 0 0 0 1px rgba(233, 54, 63, 0.10),
      0 7px 16px rgba(233, 54, 63, 0.08) !important;
    pointer-events: none !important;
    will-change: transform, width !important;
    transition:
      transform 540ms cubic-bezier(.22, 1, .36, 1),
      width 540ms cubic-bezier(.22, 1, .36, 1),
      opacity 180ms ease !important;
  }

  /* Ningún link queda rojo fijo: el JS define el estado activo. */
  .nav a[href="#builder"] {
    background: transparent !important;
    color: #5a5f66 !important;
  }

  .nav a.nav-section-link.nav-active,
  .nav a.nav-section-link.nav-passing {
    color: var(--red) !important;
  }

  .nav a.nav-section-link.nav-active {
    font-weight: 900 !important;
  }

  .nav a.nav-section-link.nav-passing {
    transition: color 130ms linear !important;
  }

  .nav a.nav-section-link:hover {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    color: var(--red) !important;
  }
}

@media (max-width: 1280px) and (min-width: 1151px) {
  .nav {
    margin-left: 24px !important;
  }

  .nav a,
  .nav .auth-top-btn,
  .nav .my-orders-top-btn {
    padding: 0 9px !important;
  }
}

@media (max-width: 1150px) {
  .nav-active-indicator {
    display: none !important;
  }
}


/* ================================================================
   NAVBAR — REFINAMIENTO: MÁS RÁPIDO, ROJO DESTACADO Y TIPOGRAFÍA
   ================================================================ */
@media (min-width: 1151px) {
  /* Letras normales: negro total, más grandes y más pesadas. */
  .nav a.nav-section-link {
    min-height: 46px !important;
    padding: 0 clamp(13px, 1.15vw, 23px) !important;
    color: #000000 !important;
    font-size: 14px !important;
    font-weight: 950 !important;
    letter-spacing: -0.015em !important;
    line-height: 1 !important;
    transition: color 110ms linear !important;
  }

  /* Evita que Arma tu pizza quede rojo de forma fija. */
  .nav a[href="#builder"],
  .nav a.nav-section-link:not(.nav-active):not(.nav-passing) {
    color: #000000 !important;
  }

  /* Indicador rojo sólido y más rápido. */
  .nav-active-indicator {
    top: 3px !important;
    height: calc(100% - 6px) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #f33c45 0%, #df3035 62%, #c9252d 100%) !important;
    box-shadow:
      0 10px 20px rgba(223, 48, 53, 0.28),
      inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;
    transition:
      transform 260ms cubic-bezier(.22, 1, .36, 1),
      width 260ms cubic-bezier(.22, 1, .36, 1),
      opacity 120ms ease !important;
  }

  /* La opción activa y las que el indicador está cruzando quedan blancas. */
  .nav a.nav-section-link.nav-active,
  .nav a.nav-section-link.nav-passing {
    color: #ffffff !important;
    font-weight: 950 !important;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.10) !important;
  }

  .nav a.nav-section-link:hover:not(.nav-active):not(.nav-passing) {
    color: var(--red) !important;
  }
}

@media (max-width: 1280px) and (min-width: 1151px) {
  .nav a.nav-section-link {
    padding: 0 11px !important;
    font-size: 12px !important;
  }
}

/* ================================================================
   NAVBAR — CÁPSULA ROJA SUAVE DESLIZANTE + TIPOGRAFÍA MÁS GRANDE
   La cápsula clara se mueve entre Menú / Arma tu pizza / Ingredientes /
   Ubicación. Las letras normales quedan negro total.
   ================================================================ */
@media (min-width: 1151px) {
  .topbar {
    gap: 16px !important;
  }

  .nav {
    min-height: 58px !important;
    padding: 4px !important;
  }

  .nav a.nav-section-link {
    min-height: 50px !important;
    height: 50px !important;
    padding: 0 clamp(15px, 1.25vw, 26px) !important;
    color: #000000 !important;
    font-size: clamp(15px, 0.95vw, 17px) !important;
    font-weight: 950 !important;
    letter-spacing: -0.025em !important;
    line-height: 1 !important;
    transition: color 110ms linear !important;
  }

  /* Esta es exactamente la cápsula que se desliza entre las secciones. */
  .nav-active-indicator {
    top: 4px !important;
    height: calc(100% - 8px) !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #ffe7e8 0%, #ffd9dc 100%) !important;
    box-shadow:
      0 8px 16px rgba(223, 48, 53, 0.12),
      inset 0 0 0 1px rgba(223, 48, 53, 0.08) !important;
    transition:
      transform 200ms cubic-bezier(.22, 1, .36, 1),
      width 200ms cubic-bezier(.22, 1, .36, 1),
      opacity 100ms ease !important;
  }

  /* La sección activa y las secciones que la cápsula cruza se ven rojas. */
  .nav a.nav-section-link.nav-active,
  .nav a.nav-section-link.nav-passing {
    color: var(--red) !important;
    font-weight: 950 !important;
    text-shadow: none !important;
  }

  .nav a.nav-section-link:hover:not(.nav-active):not(.nav-passing) {
    color: var(--red) !important;
  }
}

/* En anchos donde Windows suele aplicar 125% o 150%,
   evita que las letras vuelvan a encogerse a 12px. */
@media (max-width: 1280px) and (min-width: 1151px) {
  .nav a.nav-section-link {
    min-height: 46px !important;
    height: 46px !important;
    padding: 0 11px !important;
    font-size: 14px !important;
  }

  .nav-active-indicator {
    top: 3px !important;
    height: calc(100% - 6px) !important;
  }
}

/* ================================================================
   RESTAURAR TIPOGRAFÍA ORIGINAL — TARJETAS DE PIZZA
   Conserva el diseño actual, pero devuelve la tipografía gruesa,
   condensada y urbana de la versión anterior.
   ================================================================ */
:root{
  --font-main: Impact, Haettenschweiler, "Arial Narrow Bold", "Arial Black", sans-serif !important;
  --font-body: Arial, Helvetica, sans-serif !important;
}

/* Títulos de productos: vuelve el estilo Flame original. */
.pizza-card h3{
  font-family: Impact, Haettenschweiler, "Arial Narrow Bold", "Arial Black", sans-serif !important;
  font-weight: 400 !important;
  font-size: clamp(38px, 2.8vw, 50px) !important;
  line-height: .92 !important;
  letter-spacing: .005em !important;
  text-transform: uppercase !important;
}

/* Texto descriptivo: vuelve a sentirse más amplio y legible. */
.pizza-card p{
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: clamp(16px, 1.18vw, 20px) !important;
  line-height: 1.44 !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
}

/* Mensaje de pizza del mes: recupera la presencia de antes. */
.pizza-card .small-warning{
  font-family: Arial, Helvetica, sans-serif !important;
  font-size: clamp(13px, .96vw, 16px) !important;
  line-height: 1.36 !important;
  font-weight: 800 !important;
  letter-spacing: .01em !important;
}

/* Precio y acción: misma familia sólida de la versión original. */
.card-footer strong{
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: -.035em !important;
}

.card-footer button{
  font-family: Arial, Helvetica, sans-serif !important;
  font-weight: 900 !important;
  letter-spacing: -.015em !important;
}

/* En tablet/móvil la jerarquía se mantiene sin saturar las tarjetas. */
@media (max-width: 760px){
  .pizza-card h3{
    font-size: 36px !important;
  }

  .pizza-card p{
    font-size: 16px !important;
  }
}

/* ================================================================
   PIZZA COMPLETA — PANEL CENTRAL A LA MISMA ALTURA QUE “TU PIZZA”
   Solo escritorio amplio. En mitad/mitad no interviene.
   ================================================================ */
@media (min-width: 1421px) {
  /* Cuando está activa Pizza completa, ambos paneles comparten la misma fila. */
  .builder-layout:has(#wholeSelector:not(.hidden)) {
    align-items: stretch !important;
  }

  .builder-layout:has(#wholeSelector:not(.hidden)) .pizza-workspace,
  .builder-layout:has(#wholeSelector:not(.hidden)) .summary-column > .summary-card:first-child {
    align-self: stretch !important;
    height: auto !important;
  }

  /* Mantiene el contenido del constructor ordenado dentro del panel estirado. */
  .builder-layout:has(#wholeSelector:not(.hidden)) .pizza-workspace {
    display: flex !important;
    flex-direction: column !important;
  }

  .builder-layout:has(#wholeSelector:not(.hidden)) .pizza-workspace #wholeSelector {
    flex: 1 1 auto;
    min-height: 0;
  }
}

/* ================================================================
   PIZZA COMPLETA — CONTROLES SIEMPRE AL FINAL DEL PANEL CENTRAL
   ================================================================ */
@media (min-width: 1421px) {
  .builder-layout:has(#wholeSelector:not(.hidden)) .pizza-workspace {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }

  .builder-layout:has(#wholeSelector:not(.hidden)) #wholeSelector {
    display: flex !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    flex-direction: column !important;
  }

  /* El contenido de ingredientes conserva su altura natural. */
  .builder-layout:has(#wholeSelector:not(.hidden)) #wholeIngredients {
    flex: 0 0 auto !important;
  }

  /* El bloque Paso / Volver / Avanzar se ancla al borde inferior. */
  .builder-layout:has(#wholeSelector:not(.hidden)) #ingredientWizardControlsWhole {
    margin-top: auto !important;
  }
}

/* Ajuste solo texto superior del hero */
.hero .eyebrow{
  letter-spacing: 0.24em;
}

/* Separación de letras: título de Ingredientes */
.ingredient-banner h2{
  letter-spacing: 0.02em;
}


/* Personaje superpuesto en la sección Ingredientes */
.ingredient-banner{
  position:relative !important;
  overflow:visible !important;
}

.ingredient-banner .ingredient-character{
  content:normal !important;
  display:block !important;
  position:absolute !important;
  right:1% !important;
  top:50% !important;
  bottom:auto !important;
  transform:translateY(-50%) !important;
  width:min(50%, 565px) !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  border:0 !important;
  box-shadow:none !important;
  filter:drop-shadow(0 18px 24px rgba(0,0,0,.30)) !important;
  pointer-events:none !important;
  z-index:3 !important;
}

@media(max-width:860px){
  .ingredient-banner .ingredient-character{
    position:relative !important;
    right:auto !important;
    bottom:auto !important;
    width:min(78vw, 330px) !important;
    margin:22px auto -12px !important;
  }
}

/* Mantiene TU VIDA / TU PIZZA afuera, pero redondea el mapa */
.map-card{
  border-radius:24px !important;
}

.map-card iframe{
  border-radius:24px !important;
  clip-path:inset(0 round 24px) !important;
}

/* =========================================================
   AGREGADOS — PRUEBA 001
   Cuarta tarjeta + etapa 7 con cantidades.
   ========================================================= */
@media (min-width: 1021px){
  .menu-grid{
    grid-template-columns:repeat(4, minmax(0,1fr)) !important;
  }
}

.addon-menu-card .addon-menu-visual{
  height:290px;
  display:grid;
  place-items:center;
  gap:10px;
  background:
    radial-gradient(circle at 50% 45%, rgba(233,54,63,.10), rgba(255,255,255,0) 60%),
    #fff;
  color:#17181a;
  text-align:center;
  padding:24px;
}

.addon-menu-card .addon-menu-visual{
    padding:0 !important;
}

.addon-menu-img{
    width:260px !important;
    height:260px !important;
    max-width:none !important;
    max-height:none !important;
    object-fit:contain !important;
    display:block !important;
    margin:0 auto !important;
}

.addon-menu-visual span{
  font-size:76px;
  line-height:1;
  filter:drop-shadow(0 14px 18px rgba(233,54,63,.16));
}

.addon-menu-visual strong{
  font-family:var(--font-main);
  font-size:clamp(34px,3.1vw,48px);
  line-height:.86;
  letter-spacing:-.03em;
  text-transform:uppercase;
}

.addon-builder-card{
  align-items:center !important;
}

.addon-builder-card > span em{
  display:block;
  margin-top:6px;
  color:#6f747c;
  font-size:12px;
  font-style:normal;
  font-weight:750;
  line-height:1.3;
}

.addon-builder-card .addon-qty-controls{
  flex:0 0 auto;
}

.addon-size-row.paused,
.addon-brand-card.paused{
  opacity:.72;
  border-style:dashed;
}

.flame-addons-only .pizza-preview-card,
.flame-addons-only .builder-steps .config-card,
.flame-addons-only .rules-stack,
.flame-addons-only #cart > .summary-card:first-child{
  display:none !important;
}

.flame-addons-only .builder-title h2::after{
  content:" · agregados";
}

.flame-addon-step .half-step-intro{
  display:none !important;
}

@media(max-width:1020px){
  .menu-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:760px){
  .addon-menu-card .addon-menu-visual{
    height:245px;
  }
  .addon-menu-visual span{
    font-size:58px;
  }
}


/* =========================================================
   PRUEBA LOCAL 005 — MARCAR TARJETA AGREGADOS SELECCIONADA
   ========================================================= */
.addon-menu-card.selected-pizza-card,
.selectable-addon-card.selected-pizza-card{
  border:2px solid var(--red) !important;
  box-shadow:0 18px 50px rgba(233,54,63,.12) !important;
}

.addon-menu-card.selected-pizza-card::after,
.selectable-addon-card.selected-pizza-card::after{
  background:var(--red) !important;
}

.addon-menu-card.selected-pizza-card .badge,
.selectable-addon-card.selected-pizza-card .badge{
  background:var(--red) !important;
  border-color:var(--red) !important;
  color:#fff !important;
}

/* =========================================================
   PRUEBA LOCAL 006 — SOLO UNA TARJETA DE MENÚ MARCADA
   =========================================================
   La clase highlighted deja de verse como selección activa.
   El borde rojo queda reservado para .selected-pizza-card.
*/
.pizza-card.highlighted:not(.selected-pizza-card),
.selectable-pizza-card.highlighted:not(.selected-pizza-card){
  border:1px solid rgba(19,20,22,.08) !important;
  box-shadow:0 18px 34px rgba(18,19,20,.05) !important;
}

.selectable-pizza-card.selected-pizza-card{
  border:2px solid var(--red) !important;
  box-shadow:0 18px 50px rgba(233,54,63,.12) !important;
}


/* =========================================================
   PRUEBA XL / AGREGADOS 001 — Tamaño Normal / XL
   ========================================================= */
.menu-price-note{
  display:block;
  margin-top:3px;
  color:#7b8088;
  font-family:var(--font-body);
  font-size:11px;
  line-height:1.2;
  font-weight:850;
  letter-spacing:0;
  text-transform:none;
}

.card-footer{
  align-items:flex-end !important;
}

.card-footer strong + .menu-price-note{
  margin-right:auto;
}

.pizza-size-switch{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.pizza-size-switch button{
  min-height:58px;
  border:1px solid #e6e3df;
  border-radius:14px;
  background:#fff;
  color:#17181a;
  font-weight:950;
  text-transform:uppercase;
  transition:.16s ease;
}

.pizza-size-switch button small{
  display:block;
  margin-top:3px;
  color:#747982;
  font-size:10px;
  line-height:1.2;
  font-weight:850;
  text-transform:none;
}

.pizza-size-switch button.active{
  background:#e9363f;
  border-color:#e9363f;
  color:#fff;
  box-shadow:0 14px 28px rgba(233,54,63,.18);
}

.pizza-size-switch button.active small{
  color:rgba(255,255,255,.84);
}

.size-price-note{
  margin:10px 0 0;
  color:#6e747c;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}

.flame-addons-only .pizza-size-switch,
.flame-addons-only .size-price-note{
  display:none !important;
}

@media(max-width:760px){
  .pizza-size-switch{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   XL + AGREGADOS FIX 001 — BEBIDAS AGRUPADAS POR NOMBRE
   Evita ver Coca Cola / Pepsi / Fanta repetidas sin contexto.
   ========================================================= */
.addon-builder-subheading{
  grid-column:1 / -1;
  margin:14px 0 2px;
  color:#e9363f;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:12px;
}

.addon-builder-brand-card{
  grid-column:1 / -1;
  display:grid;
  gap:10px;
  border:1px solid #e6e3df;
  background:#fff;
  border-radius:18px;
  padding:14px;
  box-shadow:0 12px 28px rgba(28,25,22,.04);
}

.addon-builder-brand-head strong{
  display:block;
  font-size:17px;
  line-height:1.05;
  color:#17181a;
}

.addon-builder-size-list{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:8px;
}

.addon-builder-size-row{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  background:#fbfaf8;
  border:1px solid #eeeae5;
  border-radius:13px;
  padding:10px;
}

.addon-builder-size-row.paused{
  opacity:.68;
  border-style:dashed;
}

.addon-builder-size-row strong{
  display:block;
  color:#17181a;
  font-size:13px;
  line-height:1.1;
}

.addon-builder-size-row small{
  display:block;
  margin-top:3px;
  color:#6e747c;
  font-weight:850;
  font-size:11px;
  line-height:1.2;
}

.addon-builder-size-row .addon-qty-controls{
  flex:0 0 auto;
}

@media(max-width:760px){
  .addon-builder-size-list{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   XL + AGREGADOS FIX 002 — BEBIDAS DESPLEGABLES
   Las bebidas aparecen como botones y sus formatos se despliegan
   para evitar un scroll demasiado largo en el paso 7.
   ========================================================= */
.addon-builder-drink-accordion{
  grid-column:1 / -1;
  border:1px solid #e6e3df;
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 24px rgba(28,25,22,.04);
  overflow:hidden;
}

.addon-builder-drink-accordion + .addon-builder-drink-accordion{
  margin-top:2px;
}

.addon-builder-drink-accordion summary{
  list-style:none;
}

.addon-builder-drink-accordion summary::-webkit-details-marker{
  display:none;
}

.addon-builder-drink-button{
  width:100%;
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:13px 15px;
  cursor:pointer;
  user-select:none;
  background:#fff;
}

.addon-builder-drink-button:hover{
  background:#fff7f7;
}

.addon-builder-drink-button span{
  display:grid;
  gap:3px;
  min-width:0;
}

.addon-builder-drink-button strong{
  color:#17181a;
  font-size:16px;
  line-height:1.1;
  font-weight:950;
}

.addon-builder-drink-button small{
  color:#6e747c;
  font-size:11px;
  line-height:1.2;
  font-weight:850;
}

.addon-builder-drink-button b{
  flex:0 0 auto;
  border-radius:999px;
  background:#17181a;
  color:#fff;
  padding:8px 11px;
  font-size:11px;
  font-weight:950;
  text-transform:uppercase;
  white-space:nowrap;
}

.addon-builder-drink-button::after{
  content:"+";
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#e9363f;
  color:#fff;
  font-size:22px;
  font-weight:950;
  line-height:1;
  flex:0 0 auto;
}

.addon-builder-drink-accordion[open] .addon-builder-drink-button{
  background:#fff0f1;
  border-bottom:1px solid #ffd5d7;
}

.addon-builder-drink-accordion[open] .addon-builder-drink-button::after{
  content:"−";
}

.addon-builder-drink-accordion .addon-builder-size-list{
  padding:12px;
  grid-template-columns:repeat(2, minmax(0,1fr));
  background:#fffaf8;
}

@media(max-width:760px){
  .addon-builder-drink-button{
    min-height:58px;
    padding:12px;
  }

  .addon-builder-drink-button b{
    display:none;
  }

  .addon-builder-drink-accordion .addon-builder-size-list{
    grid-template-columns:1fr;
    padding:10px;
  }
}

/* =========================================================
   XL + AGREGADOS FIX 003 — BEBIDAS MÁS COMPACTAS
   Los botones cerrados ocupan una celda pequeña del grid.
   Al abrir una bebida, se expande a todo el ancho para mostrar formatos.
   ========================================================= */
.addon-builder-drink-accordion{
  grid-column:auto !important;
  border-radius:13px !important;
  box-shadow:none !important;
  margin-top:0 !important;
}

.addon-builder-drink-accordion[open]{
  grid-column:1 / -1 !important;
}

.addon-builder-drink-button{
  min-height:44px !important;
  padding:8px 10px !important;
  gap:8px !important;
}

.addon-builder-drink-button strong{
  font-size:14px !important;
  line-height:1.05 !important;
}

.addon-builder-drink-button small,
.addon-builder-drink-button b{
  display:none !important;
}

.addon-builder-drink-button::after{
  width:24px !important;
  height:24px !important;
  font-size:18px !important;
}

.addon-builder-drink-accordion[open] .addon-builder-drink-button{
  min-height:48px !important;
}

.addon-builder-drink-accordion .addon-builder-size-list{
  padding:10px !important;
  grid-template-columns:repeat(2, minmax(0,1fr)) !important;
}

@media(max-width:760px){
  .addon-builder-drink-accordion{
    grid-column:1 / -1 !important;
  }

  .addon-builder-drink-button{
    min-height:42px !important;
    padding:8px 10px !important;
  }

  .addon-builder-drink-accordion .addon-builder-size-list{
    grid-template-columns:1fr !important;
  }
}


/* =========================================================
   XL PUBLIC FIX 004 — HEADER FIJO SIN CORTAR EL BANNER
   Cuando los pedidos están abiertos, el aviso negro desaparece.
   Esta reserva deja la hero siempre debajo de la barra fija.
   ========================================================= */
body{
  padding-top:82px !important;
}

.preopening-banner{
  margin-top:0 !important;
  top:82px !important;
}

.hero,
#inicio,
#menu,
#builder,
#ingredientes,
#ubicacion{
  scroll-margin-top:82px !important;
}

@media(max-width:1150px){
  body{
    padding-top:74px !important;
  }

  .preopening-banner{
    margin-top:0 !important;
    top:74px !important;
  }

  .hero,
  #inicio,
  #menu,
  #builder,
  #ingredientes,
  #ubicacion{
    scroll-margin-top:74px !important;
  }
}

@media(max-width:760px){
  body{
    padding-top:74px !important;
  }

  .preopening-banner{
    margin-top:0 !important;
    top:74px !important;
  }
}