/* ============================================================
   Sabor de Miguel — fábrica de empanadas y distribuidora
   Contrato visual: DESIGN.md. Radio máximo 2px.
   Display CC Naked Shape SOLO en mayúsculas (la i minúscula se lee como l).
   ============================================================ */

@font-face{font-family:"Naked";src:url("assets/fonts/NakedShape.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Rota";src:url("assets/fonts/RotaPro-Regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Rota";src:url("assets/fonts/RotaPro-Medium.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Rota";src:url("assets/fonts/RotaPro-Bold.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  /* 60 — fondo */
  --masa:#F4E9D8;
  --papel:#EADCC6;
  /* 30 — texto y bloques densos */
  --horno:#2A1A12;
  /* 10 — acento */
  --aji:#A82812;
  --aji-osc:#8E2010;
  /* apoyos */
  --gris:#6B4E3A;
  --linea:#C9B49A;
  --linea-osc:#4A3225;
  --dorado:#D18E2C;--aji-cl:#F2664A;      /* SOLO sobre --horno. 2.30:1 sobre masa: prohibido ahí */

  --display:"Naked","Archivo Black",Impact,sans-serif;
  --cuerpo:"Rota",system-ui,-apple-system,"Segoe UI",sans-serif;

  --r:2px;
  --gut:clamp(20px,5vw,72px);
  --max:1380px;
}

*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--masa);color:var(--horno);
  font-family:var(--cuerpo);font-weight:400;font-size:clamp(16px,1.05vw,17.5px);line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{margin:0;font-weight:400}
p{margin:0}
ul{margin:0;padding:0;list-style:none}

.oculto-visual{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.saltar{position:absolute;left:-9999px;top:0;z-index:20;background:var(--horno);color:var(--masa);padding:12px 18px;font-weight:500}
.saltar:focus-visible{left:12px;top:12px}

:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--masa);outline-offset:2px;border-radius:var(--r);
  box-shadow:0 0 0 6px var(--aji);
}
/* Sobre superficie clara el anillo se invierte para conservar el contraste. */
.s--hero :focus-visible,.s--planilla :focus-visible,.s--pedido :focus-visible,.s--ig :focus-visible,.cabecera :focus-visible,
.pie :focus-visible,.par__b--casa :focus-visible{
  outline-color:var(--horno);box-shadow:0 0 0 6px var(--aji);
}

/* ---------- tipografía de sistema ---------- */
.titulo{
  font-family:var(--display);text-transform:uppercase;
  font-size:clamp(2.4rem,6.2vw,5.2rem);line-height:.94;letter-spacing:-.015em;
}
.titulo--claro{color:var(--masa)}
.palabra{
  font-family:var(--display);text-transform:uppercase;
  font-size:clamp(2.55rem,10.5vw,9.2rem);line-height:.9;letter-spacing:-.025em;margin:0;
}
.palabra em{font-style:normal;color:var(--aji)}
.cintillo{
  font-size:.72rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--gris);
}
.cintillo--claro{color:var(--dorado)}
.lead{font-size:clamp(1.05rem,1.5vw,1.28rem);line-height:1.5;max-width:46ch}
.nota{margin-top:22px;font-size:.85rem;color:var(--gris);max-width:76ch}
.nota--claro{color:var(--linea)}

/* ---------- botones y enlaces ---------- */
.btn{
  display:inline-block;border:1px solid transparent;border-radius:var(--r);
  padding:13px 22px;font:500 .92rem/1 var(--cuerpo);letter-spacing:.02em;
  text-decoration:none;cursor:pointer;
  transition:background-color .18s ease,color .18s ease,border-color .18s ease,transform .12s ease;
}
.btn--g{padding:17px 30px;font-size:1rem}
.btn--aji{background:var(--aji);color:var(--masa);border-color:var(--aji)}
.btn--masa{background:var(--masa);color:var(--horno);border-color:var(--masa)}
.btn--linea{background:transparent;color:var(--horno);border-color:var(--horno)}
@media (hover:hover){
  .btn--aji:hover{background:var(--aji-osc);border-color:var(--aji-osc)}
  .btn--masa:hover{background:var(--dorado);border-color:var(--dorado);color:var(--horno)}
  .btn--linea:hover{background:var(--horno);color:var(--masa)}
}
.btn:active{transform:translateY(1px)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none}
.enlace-wa{font-size:.9rem;color:var(--gris);text-underline-offset:3px}
@media (hover:hover){.enlace-wa:hover{color:var(--aji)}}

/* ---------- cabecera ---------- */
.cabecera{position:sticky;top:0;z-index:12;background:var(--masa);border-bottom:1px solid var(--linea)}
.cabecera__linea{
  max-width:var(--max);margin:0 auto;padding:14px var(--gut);
  display:flex;align-items:center;gap:clamp(14px,3vw,42px);flex-wrap:wrap;
}
.marca{
  font-family:var(--display);text-transform:uppercase;font-size:1.32rem;letter-spacing:-.01em;
  text-decoration:none;line-height:1;
}
.marca span{color:var(--aji);margin:0 .12em}
.cabecera__nav{display:flex;gap:clamp(12px,2vw,26px);flex-wrap:wrap;margin-right:auto}
.cabecera__nav a{font-size:.9rem;font-weight:500;text-decoration:none;color:var(--gris);padding:4px 0}
@media (hover:hover){.cabecera__nav a:hover{color:var(--aji)}}
.cabecera__contacto{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.tel{font-size:.9rem;font-weight:500;text-decoration:none;color:var(--horno)}

/* ---------- estructura de sección ---------- */
.s{padding:clamp(56px,8vw,116px) var(--gut);max-width:var(--max);margin:0 auto}
.seccion__enc{max-width:64ch;margin-bottom:clamp(30px,4vw,52px)}
.seccion__enc .titulo{margin-top:10px}
.seccion__bajada{margin-top:16px;color:var(--gris);max-width:56ch}
.seccion__enc--fila{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}

/* 1 · HERO — bloque de palabra a sangre sobre video del local */
.s--hero{
  position:relative;isolation:isolate;max-width:none;
  padding:clamp(120px,18vw,210px) 0 clamp(46px,6vw,88px);
  min-height:min(86vh,780px);display:flex;align-items:flex-end;
  background:var(--horno);color:#fff;
}
.hero__fondo{position:absolute;inset:0;z-index:-1;overflow:hidden;
  background:var(--horno) url("assets/img/hero-poster.jpg") center/cover no-repeat}
.hero__video{width:100%;height:100%;object-fit:cover;display:block}
/* Scrim graduado, no velo parejo: opaco solo donde vive el texto. */
.hero__scrim{
  position:absolute;inset:0;
  background:
    linear-gradient(to top,
      rgba(18,10,7,.94) 0%, rgba(18,10,7,.88) 26%, rgba(18,10,7,.72) 50%,
      rgba(18,10,7,.44) 74%, rgba(18,10,7,.26) 100%),
    linear-gradient(to right,
      rgba(18,10,7,.62) 0%, rgba(18,10,7,.34) 46%, rgba(18,10,7,0) 78%);
}
.hero__con{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.s--hero .palabra{color:#fff;font-size:clamp(2.3rem,6.2vw,5.9rem);line-height:.98;letter-spacing:-.02em;
  text-shadow:0 2px 24px rgba(12,7,4,.45)}
.s--hero .palabra em{color:var(--aji-cl)}
.cintillo--hero{color:#F0DCC4;margin-bottom:clamp(16px,2.2vw,26px)}
.lead--hero{color:#F2E7D8;margin-top:clamp(20px,2.6vw,30px);max-width:44ch}
.hero__acciones{display:flex;gap:12px;flex-wrap:wrap;margin-top:clamp(26px,3.4vw,40px)}
.btn--blanco{background:transparent;color:#fff;border-color:rgba(255,255,255,.62)}
@media (hover:hover){.btn--blanco:hover{background:#fff;color:var(--horno);border-color:#fff}}

/* 2 y 9 · PAR BIFURCADO */
.par{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--horno);border-radius:var(--r);overflow:hidden}
.par__b{padding:clamp(26px,3.4vw,48px);display:flex;flex-direction:column;gap:16px}
.par__b--negocio{background:var(--horno);color:var(--masa)}
.par__b--casa{background:var(--papel)}
.par__t{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.6rem,3.1vw,2.5rem);line-height:.98}
.par__b--negocio p{color:#E4D6C0}
.par__datos{display:flex;flex-direction:column;gap:7px;font-size:.92rem;margin-top:2px}
.par__datos li{display:flex;gap:9px;padding-bottom:7px;border-bottom:1px solid var(--linea)}
.par__b--negocio .par__datos li{border-bottom-color:var(--linea-osc)}
.par__datos b{font-weight:500;min-width:88px;color:var(--gris)}
.par__b--negocio .par__datos b{color:var(--dorado)}
.par__acciones{margin-top:auto;padding-top:12px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.par__b--negocio .enlace-wa{color:var(--linea)}
@media (hover:hover){.par__b--negocio .enlace-wa:hover{color:var(--dorado)}}
.canales{display:flex;flex-direction:column;gap:11px;font-size:.95rem;margin-top:4px}
.canales li{display:flex;gap:12px;padding-bottom:11px;border-bottom:1px solid var(--linea)}
.canales span{min-width:82px;color:var(--gris);font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;padding-top:3px}
.canales a{font-weight:500;text-underline-offset:3px}

/* 3 y 6 · PLANILLA — la firma */
.planilla{width:100%;border-collapse:collapse;text-align:left}
.planilla th{
  font:500 .72rem/1 var(--cuerpo);letter-spacing:.16em;text-transform:uppercase;color:var(--gris);
  padding:0 14px 12px 0;border-bottom:1px solid var(--horno);
}
.planilla th.num,.planilla td.c-num{text-align:right;padding-right:0}
.planilla td{padding:clamp(13px,1.5vw,19px) 14px clamp(13px,1.5vw,19px) 0;border-bottom:1px solid var(--linea);vertical-align:baseline}
.planilla tr:last-child td{border-bottom:1px solid var(--horno)}
.c-sabor{
  font-family:var(--display);text-transform:uppercase;
  font-size:clamp(1.15rem,2.3vw,1.85rem);line-height:1;letter-spacing:-.01em;width:34%;
}
.c-dato{color:var(--gris);font-size:.92rem;white-space:nowrap}
.c-num{font-weight:700;font-size:clamp(1rem,1.35vw,1.18rem);font-variant-numeric:tabular-nums;font-feature-settings:"tnum" 1;white-space:nowrap}
.planilla--rep .c-sabor{width:44%}
@media (hover:hover){.planilla tbody tr:hover{background:var(--papel)}}

/* 4 · FORMATOS — bloque de palabra, superficie oscura */
.s--formatos{max-width:none;background:var(--horno);color:var(--masa);padding-left:0;padding-right:0}
.s--formatos>*{max-width:var(--max);margin-left:auto;margin-right:auto;padding-left:var(--gut);padding-right:var(--gut)}
.seccion__bajada--claro{color:#CDBBA3}
.tramos{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;list-style:none;
  background:var(--linea-osc);border:1px solid var(--linea-osc);border-radius:var(--r);
  /* La seccion da padding de gutter a sus hijos; aca el fondo asomaria a los lados.
     Se anula el padding y se descuenta el gutter del ancho para conservar la alineacion. */
  padding:0;max-width:calc(var(--max) - 2*var(--gut));
  margin:0 auto clamp(30px,4vw,54px);
}
.tramo{background:var(--horno);padding:clamp(22px,2.8vw,36px)}
.tramo--eje{background:#3A2318}
.tramo__n{
  font-family:var(--display);font-size:clamp(3.4rem,7.5vw,6.4rem);line-height:.82;
  font-variant-numeric:tabular-nums;color:var(--masa);
}
.tramo--eje .tramo__n{color:var(--aji-cl)}
.tramo__n span{display:block;font-family:var(--cuerpo);font-size:.8rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--dorado);margin-top:12px}
.tramo__t{font-family:var(--display);text-transform:uppercase;font-size:1.15rem;letter-spacing:.04em;margin-top:14px;color:var(--masa)}
.tramo__d{margin-top:7px;font-size:.92rem;line-height:1.5;color:#CDBBA3;max-width:26ch}
.formatos{display:grid;grid-template-columns:1fr}
.formato--eje{border:0;padding:0}
.formato--eje .formato__n{font-size:clamp(7rem,20vw,17rem);line-height:.78}
.formato--eje .formato__t{font-size:clamp(1.4rem,2.6vw,2.1rem);margin-top:4px}
.formato--eje .formato__d{max-width:34ch}
.formatos__resto{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,34px);list-style:none;border-top:1px solid var(--linea-osc);padding-top:18px}
.formatos__resto li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:baseline;font-size:.95rem;color:#CDBBA3}
.formatos__resto b{font-family:var(--display);color:var(--dorado);font-size:1.9rem;line-height:1;font-variant-numeric:tabular-nums;min-width:2.6ch}
.formato{border-top:1px solid var(--linea-osc);padding-top:18px}
.formato__n{
  font-family:var(--display);font-size:clamp(3.4rem,7.6vw,6.4rem);line-height:.86;color:var(--dorado);
  font-variant-numeric:tabular-nums;
}
.formato__t{
  font-family:var(--display);text-transform:uppercase;font-size:clamp(1.05rem,1.7vw,1.4rem);
  margin-top:10px;line-height:1;
}
.formato__d{margin-top:9px;font-size:.9rem;color:#CDBBA3;line-height:1.5}

/* 5 · PEDIDO — formulario a dos columnas */
.s--pedido{max-width:none;background:var(--papel)}
.pedido{
  max-width:var(--max);margin:0 auto;
  display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(30px,4.5vw,72px);align-items:start;
}
.pedido__cond .titulo{margin-top:10px;font-size:clamp(2.1rem,4.1vw,3.7rem)}
.cond{margin-top:26px;display:flex;flex-direction:column;gap:13px}
.cond li{font-size:.95rem;padding-bottom:13px;border-bottom:1px solid var(--linea);color:var(--gris)}
.cond b{color:var(--horno);font-weight:500}
.cond__pie{margin-top:20px;font-size:.9rem;color:var(--gris);max-width:44ch}

.form{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px;background:var(--masa);border:1px solid var(--linea);border-radius:var(--r);padding:clamp(22px,3vw,38px)}
.campo{display:flex;flex-direction:column;gap:7px;min-width:0;border:0;margin:0;padding:0}
.campo--full{grid-column:1/-1}
.campo>label,.campo legend{font-size:.76rem;font-weight:500;letter-spacing:.13em;text-transform:uppercase;color:var(--gris);padding:0}
.opt{text-transform:none;letter-spacing:0;font-weight:400}
.campo__ayuda{font-size:.85rem;color:var(--gris);margin-bottom:4px}
input,select,textarea{
  font:400 1rem/1.4 var(--cuerpo);color:var(--horno);background:var(--masa);
  border:1px solid var(--linea);border-radius:var(--r);padding:12px 13px;width:100%;
  transition:border-color .16s ease,box-shadow .16s ease;
}
select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--gris) 50%),linear-gradient(135deg,var(--gris) 50%,transparent 50%);background-position:calc(100% - 19px) 50%,calc(100% - 13px) 50%;background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:38px}
textarea{resize:vertical;min-height:64px}
@media (hover:hover){input:hover,select:hover,textarea:hover{border-color:var(--gris)}}
input:focus,select:focus,textarea:focus{border-color:var(--horno)}
input[aria-invalid="true"],select[aria-invalid="true"]{border-color:var(--aji);box-shadow:inset 0 0 0 1px var(--aji)}
.cantidades{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.cant{display:flex;flex-direction:column;gap:5px;min-width:0}
.cant label{font-size:.85rem;color:var(--horno);letter-spacing:0;text-transform:none;font-weight:400}
.cant input{padding:10px 11px;font-variant-numeric:tabular-nums}
.error{display:block;font-size:.85rem;color:var(--aji);font-weight:500}
.error[hidden]{display:none}
.form__envio{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:4px}
#btn-enviar[aria-busy="true"]{opacity:.6;cursor:progress}
.exito{border:1px solid var(--horno);border-radius:var(--r);padding:20px;background:var(--papel);display:flex;flex-direction:column;gap:11px}
.exito[hidden]{display:none}
.exito__t{font-family:var(--display);text-transform:uppercase;font-size:1.25rem;line-height:1}
.exito__d{font-size:.9rem;color:var(--gris)}
.exito__txt{
  font:400 .84rem/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;word-break:break-word;
  background:var(--masa);border:1px solid var(--linea);border-radius:var(--r);padding:13px;margin:0;max-height:210px;overflow:auto;
}

/* 7 · LA FÁBRICA — bloque a sangre con reserva fotográfica */
.s--fabrica{max-width:none;padding:0;background:var(--horno);color:var(--masa);display:grid;grid-template-columns:1.05fr .95fr;align-items:stretch}
/* Reserva fotográfica — 4/3 escritorio, 4/5 móvil. Encuadre: plano medio del mesón de armado. */
.fachada{margin:0;min-height:clamp(400px,40vw,580px);background:#1A1008;position:relative}
.fachada picture,.fachada img{display:block;width:100%;height:100%;object-fit:cover}
.fachada img{min-height:clamp(400px,40vw,580px)}

.fabrica__txt{padding:clamp(34px,5vw,80px) var(--gut);display:flex;flex-direction:column;gap:16px;justify-content:center}
.fabrica__txt p{color:#CDBBA3;max-width:50ch}
.fabrica__txt .titulo{margin:8px 0 6px;color:var(--masa)}
.fabrica__firma{
  margin-top:12px;font-size:.75rem;letter-spacing:.18em;text-transform:uppercase;color:var(--dorado)!important;
}

/* 8 · INSTAGRAM — tira horizontal */
.tira{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
.tira__c{
  flex:0 0 clamp(210px,23vw,285px);aspect-ratio:4/5;border-radius:var(--r);scroll-snap-align:start;
  display:flex;flex-direction:column;justify-content:flex-end;gap:3px;padding:20px;color:var(--masa);
}
.tira__c--1{background:linear-gradient(160deg,#7A4A20,#3B2416)}
.tira__c--2{background:linear-gradient(160deg,#B07A2E,#5A3A14)}
.tira__c--3{background:linear-gradient(160deg,#A83A1E,#4A1608)}
.tira__c--4{background:linear-gradient(160deg,#8E5A28,#2E1A0E)}
.tira__c--5{background:linear-gradient(160deg,#6E3A18,#331A0C)}
.tira__c--6{background:linear-gradient(160deg,#4A3225,#1E1008)}
.tira__t{font-family:var(--display);text-transform:uppercase;font-size:1.6rem;line-height:1}
.tira__d{font-size:.82rem;color:#D8C7B0}

/* 9 · CONTACTO */
.s--contacto{padding-bottom:clamp(46px,6vw,84px)}

/* ---------- pie ---------- */
.pie{background:var(--horno);color:var(--masa);padding:clamp(44px,6vw,80px) 0 0}
.pie>*{max-width:var(--max);margin:0 auto;padding:0 var(--gut)}
.pie__grilla{
  display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));
  gap:clamp(26px,3.4vw,52px);align-items:start;
  padding-bottom:clamp(34px,4.4vw,60px);
}
.pie__marca{font-family:var(--display);text-transform:uppercase;font-size:clamp(1.7rem,3vw,2.5rem);line-height:.94;color:var(--masa)}
.pie__marca span{display:block;font-size:.44em;color:var(--dorado);letter-spacing:.16em;margin:.18em 0}
.pie__claim{margin-top:16px;font-size:.92rem;line-height:1.5;color:#CDBBA3;max-width:30ch}
.pie__t{font-family:var(--cuerpo);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--dorado);margin-bottom:14px}
.pie__lista{list-style:none;display:grid;gap:9px;font-size:.93rem}
.pie__lista a{color:var(--masa);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .18s ease,color .18s ease}
@media (hover:hover){.pie__lista a:hover{color:var(--dorado);border-bottom-color:var(--dorado)}}
.pie__lista--datos{color:#CDBBA3}
.pie__base{
  border-top:1px solid var(--linea-osc);
  padding-top:18px;padding-bottom:22px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;
}
.pie__cred{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:#B7A18A}
.pie__demo{font-size:.78rem;color:#9B8770}

/* ---------- flotante único ---------- */
.flota{
  position:fixed;right:clamp(14px,2.5vw,26px);bottom:clamp(14px,2.5vw,26px);z-index:14;
  width:54px;height:54px;border-radius:50%;background:var(--aji);color:var(--masa);
  display:flex;align-items:center;justify-content:center;text-decoration:none;
  box-shadow:0 6px 20px rgba(42,26,18,.3);transition:background-color .18s ease,transform .14s ease;
}
@media (hover:hover){.flota:hover{background:var(--aji-osc);transform:translateY(-2px)}}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .pie__grilla{grid-template-columns:1fr 1fr}
  .pedido{grid-template-columns:1fr;gap:34px}
  .s--fabrica{grid-template-columns:1fr}
  .fachada,.fachada img{min-height:clamp(260px,52vw,420px)}
}
@media (max-width:820px){
  /* En movil el texto cruza todo el ancho: el degradado horizontal no lo cubre
     y el rojo del acento cae bajo 3:1. Se refuerza el vertical. */
  .hero__scrim{
    background:linear-gradient(to top,
      rgba(18,10,7,.96) 0%, rgba(18,10,7,.93) 34%, rgba(18,10,7,.85) 58%,
      rgba(18,10,7,.62) 80%, rgba(18,10,7,.42) 100%);
  }
  .par{grid-template-columns:1fr}
  .tramos{grid-template-columns:1fr}
  .tramo{display:grid;grid-template-columns:auto 1fr;gap:4px 22px;align-items:baseline}
  .tramo__n{grid-row:1/3;font-size:clamp(3rem,13vw,4.6rem)}
  .tramo__n span{margin-top:6px}
  .formatos__resto{grid-template-columns:1fr}
  .pie__grilla{grid-template-columns:1fr;gap:30px}
  .pie__base{flex-direction:column;gap:8px}
  /* Una sola barra. El anti-slop del contrato prohibe apilar barras en movil:
     el modo de falla medido en Empanadas Temuco eran 145px antes del contenido. */
  .cabecera__linea{flex-wrap:nowrap;padding-top:11px;padding-bottom:11px}
  .cabecera__nav{display:none}
  .cabecera__contacto{margin-left:auto;gap:10px}
  .tel{display:none}
}
@media (max-width:640px){
  /* Los cortes de linea del hero estan compuestos para escritorio: en movil sobran. */
  .s--hero .palabra br{display:none}
  .form{grid-template-columns:1fr;padding:20px}
  .cantidades{grid-template-columns:repeat(2,1fr)}
  .fachada,.fachada img{min-height:340px}
  .formatos{gap:22px}

  /* Planilla apilada: cinco columnas no caben en 390px.
     La fila pasa a grilla; sabor arriba, datos a la izquierda, precios alineados a la derecha. */
  .planilla thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .planilla,.planilla tbody,.planilla tr,.planilla td{display:block;width:auto}
  .planilla tr{
    display:grid;grid-template-columns:1fr auto;gap:2px 14px;
    padding:16px 0;border-bottom:1px solid var(--linea);
  }
  .planilla tr:last-child{border-bottom:1px solid var(--horno)}
  .planilla tr:last-child td{border-bottom:0}
  .planilla td{padding:0;border:0}
  .c-sabor{grid-column:1/-1;width:auto;font-size:1.5rem;margin-bottom:6px}
  .c-dato{grid-column:1;font-size:.85rem}
  .c-num{grid-column:2;text-align:right}
  .c-dato::before,.c-num::before{
    content:attr(data-r) " · ";color:var(--gris);font-weight:400;font-size:.78rem;
    letter-spacing:.06em;text-transform:uppercase;
  }
  .c-num::before{font-family:var(--cuerpo)}
}
@media (max-width:420px){
  .cantidades{grid-template-columns:1fr}
  .hero__acciones .btn{width:100%;text-align:center}
}

/* ---------- movimiento reducido ---------- */
@media (prefers-reduced-motion:reduce){
  .hero__video{display:none}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .tira{scroll-snap-type:none}
}
