/* ══════════════════════════════════════════════
   CORTEZA · fiel al menú impreso
   Blanco, centrado, Poppins, logo manuscrito
   ══════════════════════════════════════════════ */
:root{
  /* Papel cálido. Para blanco puro estilo PDF: --paper:#fff, --wood:#e4e4e4 y .watermark{display:none} */
  --paper:#FBF7EF; --ink:#1D1813; --muted:#5C544A; --soft:#94897B; --line:#E7DFD2;
  --wood:#7A4A2B;
  --sans:'Poppins',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0}
body{
  /* bandas laterales en tono kraft; la columna central lleva el papel */
  background:#EFE7D6; color:var(--ink); font-family:var(--sans); font-size:16px;
  min-height:100vh; -webkit-font-smoothing:antialiased; text-align:center;
  border-top:3px solid var(--wood);
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *{animation:none!important;transition:none!important}
}

.wrap{
  position:relative;z-index:1;
  max-width:680px;margin:0 auto;padding:34px 26px 40px;min-height:100vh;
  background:
    url('img/marca-corteza-suave.png') no-repeat fixed center 42% / min(430px,80vw),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.42 0 0 0 0 0.31 0 0 0 0 0.18 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E") repeat 0 0 / 180px 180px,
    var(--paper);
  box-shadow:0 0 34px rgba(70,45,20,.07);
}
/* filo irregular de papel hecho a mano (deckle) en ambos lados */
.wrap::before,.wrap::after{
  content:"";position:absolute;top:0;bottom:0;width:16px;z-index:50;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='200'%3E%3Cpath d='M0 0 L10 0 C6 22 13 44 8 66 C4 88 12 110 7 132 C3 154 13 176 10 200 L0 200 Z' fill='%23EFE7D6'/%3E%3Cpath d='M10 0 C6 22 13 44 8 66 C4 88 12 110 7 132 C3 154 13 176 10 200' fill='none' stroke='%23DACFB9' stroke-width='1'/%3E%3C/svg%3E") repeat-y;
}
.wrap::before{left:0}
.wrap::after{right:0;transform:scaleX(-1)}
/* pantalla ancha: columna central del 50%, bandas del 25% a cada lado */
@media(min-width:1080px){
  .wrap{max-width:max(660px,50vw)}
}

/* ── header ── */
.logo{width:min(240px,60%);height:auto;margin:6px auto 22px;display:block}
.story{
  font-size:13.5px;font-weight:300;font-style:italic;color:var(--muted);
  line-height:1.75;letter-spacing:.06em;max-width:480px;margin:0 auto 8px;
}

/* ── barra fija ── */
#topbar{
  position:sticky;top:0;z-index:40;margin:14px -26px 0;padding:10px 26px 2px;
  background:rgba(251,247,239,.96);backdrop-filter:blur(4px);
  border-bottom:1px solid var(--line);
}
.controls{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.controls select{
  min-height:38px;border-radius:8px;border:1px solid var(--line);background:#FFFDF9;color:var(--ink);
  font-family:var(--sans);font-size:13px;font-weight:500;padding:0 12px;cursor:pointer;
}
.pills{display:flex;gap:2px;overflow-x:auto;padding:8px 2px 8px;scrollbar-width:none;justify-content:flex-start}
.pills::-webkit-scrollbar{display:none}
.pills button{
  white-space:nowrap;border:none;background:none;color:var(--ink);
  padding:8px 11px;min-height:38px;font-family:var(--sans);
  font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;
  border-bottom:2px solid transparent;
}
.pills button:hover{border-bottom-color:var(--wood);color:var(--wood)}
@media(min-width:560px){.pills{justify-content:center}}

.status-msg{color:var(--soft);font-size:13px;padding:18px 10px;line-height:1.5}
.status-msg.err{color:#8a3d1b;font-weight:500}

/* ── secciones ── */
section.category{margin:44px 0 0;scroll-margin-top:112px}
section.category h2{
  font-size:17px;font-weight:600;letter-spacing:.42em;text-transform:uppercase;
  margin:0 0 6px;padding-inline-start:.42em;
}
.sec-subtitle{font-size:12.5px;font-weight:300;letter-spacing:.22em;color:var(--muted);margin:0 0 8px}

.subsection{
  font-size:12.5px;font-weight:300;font-style:italic;letter-spacing:.3em;
  color:var(--muted);margin:24px 0 4px;padding-inline-start:.3em;
}

/* ── platos ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.dish{margin:19px 0 0;animation:fadeUp .35s ease both}
.dish .dline{font-size:15.5px;line-height:1.4}
.dish .dname{font-weight:600}
.dish .dprice{font-weight:400;color:var(--ink);white-space:nowrap}
.dish .conv{font-size:12px;color:var(--soft);font-weight:400}
.dish .desc{font-size:13.5px;font-weight:300;font-style:italic;color:var(--muted);line-height:1.5;margin-top:1px}
.dish.sold .dname,.dish.sold .desc{color:var(--soft);text-decoration:line-through}
.dish.sold .dprice{color:var(--soft);text-decoration:none;font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.diet{display:inline-block;vertical-align:-3px;margin-inline-end:5px;width:15px;height:15px}
.diet circle{stroke:var(--ink);fill:none;stroke-width:1.3}
.diet path{stroke:var(--ink);fill:none;stroke-width:1.2;stroke-linecap:round}
.diet.vegano path{stroke-width:1.5}

/* ── footer ── */
footer.bottom{margin-top:52px;padding-top:22px;border-top:1px solid var(--line)}
.notes{font-size:11.5px;letter-spacing:.08em;color:var(--muted);line-height:1.8;max-width:460px;margin:0 auto 8px;text-transform:uppercase}
.footer-text{color:var(--soft);font-size:11.5px;letter-spacing:.05em;line-height:1.7;max-width:420px;margin:0 auto}
.qr{border:1px solid var(--line);border-radius:10px;background:#fff;padding:6px;margin:14px auto 0;display:block}
.marca{width:54px;height:auto;opacity:.9;margin:20px auto 0;display:block}

/* ── RTL ── */
body[dir="rtl"]{direction:rtl}