/* ============================================================
   GRUPO SINGLEFIN · sistema de cartas — un esqueleto, 5 pieles
   ============================================================ */

/* ---------- base tokens (se sobreescriben por [data-theme]) ---------- */
:root{
  --bg:#f4f0e6; --surface:#fbf8f0; --text:#16303f; --muted:#5f7078;
  --accent:#3f7d9a; --accent-ink:#ffffff; --line:#e2dac9;
  --price:var(--accent);
  --hero-a:#14384c; --hero-b:#0a1f2b; --hero-text:#f2ece0; --hero-muted:#c8b79c;
  --font-display:"Fraunces", Georgia, serif;
  --font-body:"Inter", system-ui, sans-serif;
  --radius:14px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --trans: background-color .55s var(--ease), color .55s var(--ease), border-color .55s var(--ease);
}

/* ================= LOS 5 TEMAS ================= */
[data-theme="brisa"]{
  --bg:#05051a; --surface:#0d0d2b; --text:#f2e8da; --muted:#b8a58e;
  --accent:#73513b; --accent-ink:#fff; --line:#241f3d;
  --price:#c9a077;
  --hero-a:#1a1a52; --hero-b:#030312; --hero-text:#f2e8da; --hero-muted:#c9ae94;
  --font-display:"Fraunces", Georgia, serif; --font-body:"Inter", sans-serif;
}
[data-theme="demar"]{
  --bg:#f7f0e4; --surface:#fcf8f0; --text:#1a3a37; --muted:#7d7262;
  --accent:#63b8b2; --accent-ink:#0b2b28; --line:#e7dcc4;
  --price:#17433f;
  --hero-a:#4a9d97; --hero-b:#0f2b29; --hero-text:#f7ecd8; --hero-muted:#a8d9d4;
  --font-display:"Cormorant Garamond", Georgia, serif; --font-body:"Jost", sans-serif;
}
[data-theme="singlefin"]{
  --bg:#f7f0df; --surface:#fffaec; --text:#123a3a; --muted:#6a6250;
  --accent:#c2892a; --accent-ink:#fff; --line:#e8dcbe;
  --hero-a:#1f5a52; --hero-b:#0e2f2b; --hero-text:#fdf6e3; --hero-muted:#e6c98a;
  --font-display:"Space Grotesk", sans-serif; --font-body:"Inter", sans-serif;
}
[data-theme="twinfin"]{
  --bg:#f2e8d5; --surface:#faf5ea; --text:#122a20; --muted:#5c7268;
  --accent:#1b4332; --accent-ink:#fff; --line:#e3d7ba;
  --hero-a:#1f4d3b; --hero-b:#0a1f17; --hero-text:#f2e8d5; --hero-muted:#a8c4b6;
  --font-display:"Outfit", sans-serif; --font-body:"Inter", sans-serif;
}
[data-theme="manao"]{
  --bg:#0d0710; --surface:#170c1c; --text:#f0dce6; --muted:#a98db0;
  --accent:#ff5a7a; --accent-ink:#1a0510; --line:#271730;
  --hero-a:#3a1030; --hero-b:#0a040d; --hero-text:#f6e2ee; --hero-muted:#e2a0c7;
  --font-display:"Syne", sans-serif; --font-body:"Inter", sans-serif;
}
[data-theme="vaixell"]{
  --bg:#f3ece0; --surface:#fbf6ec; --text:#122c40; --muted:#5a6a76;
  --accent:#1c5372; --accent-ink:#fff; --line:#e4dcc9;
  --hero-a:#1e2d39; --hero-b:#081824; --hero-text:#f3ecdd; --hero-muted:#c9ae84;
  --font-display:"Playfair Display", Georgia, serif; --font-body:"Source Sans 3", "Inter", sans-serif;
}

/* ---------- reset ---------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001ms!important; transition-duration:.001ms!important; }
}
body{
  font-family:var(--font-body); background:var(--bg); color:var(--text);
  line-height:1.6; font-size:16px; -webkit-font-smoothing:antialiased;
  overflow-x:hidden; transition:var(--trans);
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; cursor:pointer; background:none; border:none; appearance:none; -webkit-appearance:none; }
:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:4px; }

.display{ font-family:var(--font-display); line-height:1.02; }
.eyebrow{ font-family:var(--font-body); text-transform:uppercase; letter-spacing:.26em; font-size:.68rem; font-weight:600; }

/* ============================================================ HERO */
.hero{
  position:relative; min-height:100svh; display:grid; place-items:center; text-align:center;
  color:var(--hero-text); padding:5rem 1.4rem 4rem; overflow:hidden; isolation:isolate;
  background:linear-gradient(165deg, var(--hero-a) 0%, var(--hero-b) 78%);
  transition:var(--trans);
}
/* foto de fondo del local (la pone app.js) */
.hero__photo{
  position:absolute; inset:0; z-index:-3; background-size:cover; background-position:center 42%;
  transform:scale(1.05); animation:heroKb 20s var(--ease) infinite alternate; transition:opacity .5s var(--ease);
}
@keyframes heroKb{ from{ transform:scale(1.05) } to{ transform:scale(1.14) translateY(-1.5%) } }
/* velo de color de marca sobre la foto */
.hero__wash{
  position:absolute; inset:0; z-index:-2; transition:var(--trans);
  background:
    radial-gradient(80% 55% at 50% 24%, color-mix(in srgb, var(--hero-a) 42%, transparent) 0%, transparent 70%),
    linear-gradient(172deg, color-mix(in srgb, var(--hero-a) 70%, transparent) 0%, color-mix(in srgb, var(--hero-b) 78%, transparent) 52%, color-mix(in srgb, var(--hero-b) 95%, transparent) 100%);
}
.hero__glow{
  position:absolute; inset:0; z-index:-1; opacity:.72;
  background:
    radial-gradient(60% 42% at 74% 16%, color-mix(in srgb, var(--accent) 34%, transparent) 0%, transparent 60%),
    radial-gradient(60% 45% at 20% 88%, color-mix(in srgb, var(--accent) 22%, transparent) 0%, transparent 62%);
  transition:opacity .55s var(--ease);
}
.hero__grain{
  position:absolute; inset:0; z-index:-1; opacity:.05; pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero__inner{ max-width:640px; display:grid; gap:1.4rem; justify-items:center; }
.hero__eyebrow{ color:var(--hero-muted); }
.hero__name{
  font-family:var(--font-display); font-weight:600;
  font-size:clamp(3.2rem, 17vw, 6.5rem); line-height:.94; letter-spacing:-.01em;
}
[data-theme="manao"] .hero__name{ font-weight:700; letter-spacing:.02em; }
[data-theme="demar"] .hero__name{ font-weight:600; font-style:italic; }
.hero__tagline{
  font-family:var(--font-display); font-style:italic; font-weight:400;
  font-size:clamp(1.15rem, 4.6vw, 1.7rem); line-height:1.25; max-width:20ch; color:var(--hero-text);
}
[data-theme="singlefin"] .hero__tagline,[data-theme="twinfin"] .hero__tagline{ font-style:normal; font-weight:400; }
.hero__actions{ display:flex; gap:.7rem; flex-wrap:wrap; justify-content:center; margin-top:.6rem; }

.btn{
  display:inline-flex; align-items:center; gap:.5rem; min-height:48px;
  padding:.8rem 1.5rem; border-radius:999px; font-size:.82rem; font-weight:600;
  letter-spacing:.02em; transition:transform .2s var(--ease), background .2s, border-color .2s, color .2s;
}
.btn:active{ transform:scale(.98); }
.btn--solid{ background:var(--hero-text); color:var(--hero-b); }
.btn--ghost{ border:1.5px solid color-mix(in srgb, var(--hero-text) 55%, transparent); color:var(--hero-text); }
.btn--ghost:hover{ border-color:var(--hero-text); }
.btn svg{ width:17px; height:17px; }

.hero__scroll{ position:absolute; bottom:1.3rem; left:50%; transform:translateX(-50%);
  display:grid; gap:.35rem; justify-items:center; color:var(--hero-muted);
  text-transform:uppercase; letter-spacing:.28em; font-size:.6rem; }
.hero__scroll .ln{ width:1px; height:32px; background:linear-gradient(var(--hero-muted),transparent); animation:pulse 2.2s ease-in-out infinite; }
@keyframes pulse{ 0%,100%{ transform:scaleY(.5); opacity:.4; transform-origin:top; } 50%{ transform:scaleY(1); opacity:1; } }

/* ============================================================ NAV CATEGORÍAS */
.catnav{ position:sticky; top:0; z-index:30; background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line); transition:var(--trans); }
.catnav__row{ display:flex; gap:.4rem; overflow-x:auto; scrollbar-width:none; max-width:720px; margin:0 auto; padding:.7rem 1.1rem; }
.catnav__row::-webkit-scrollbar{ display:none; }
.chip{ white-space:nowrap; flex:0 0 auto; font-size:.74rem; font-weight:600; letter-spacing:.04em;
  padding:.5rem .85rem; border-radius:999px; border:1px solid var(--line); color:var(--muted); min-height:40px; transition:.2s var(--ease); }
.chip.on{ color:var(--accent-ink); background:var(--accent); border-color:var(--accent); }

/* ============================================================ CARTA */
.menu{ max-width:720px; margin:0 auto; padding:0 1.3rem 5rem; }
.section{ padding:2.8rem 0 .5rem; scroll-margin-top:64px; }
.section__title{ font-family:var(--font-display); font-weight:600; color:var(--text);
  font-size:clamp(1.7rem, 6.5vw, 2.4rem); text-align:center; }
[data-theme="demar"] .section__title,[data-theme="vaixell"] .section__title{ font-style:italic; }
.section__rule{ width:38px; height:2px; background:var(--accent); margin:.7rem auto 1.6rem; transition:var(--trans); }

.dish{ padding:.95rem 0; border-bottom:1px solid var(--line); transition:var(--trans); }
.dish:last-child{ border-bottom:0; }
.dish__row{ display:flex; align-items:baseline; gap:.6rem; }
.dish__name{ font-weight:600; font-size:1.02rem; }
.dish__lead{ flex:1; min-width:14px; }
.dish__price{ font-variant-numeric:tabular-nums; font-weight:600; color:var(--price); white-space:nowrap; }
.dish__desc{ color:var(--muted); font-size:.9rem; margin-top:.15rem; max-width:52ch; }

/* Galería editorial: fotos bonitas de plato, al final de la sección (no ligadas a una fila) */
.section__gallery{ display:grid; grid-template-columns:1fr; gap:1.6rem;
  margin:2.2rem 0 .6rem; }
.section__gallery:has(.section__photo:nth-child(2)){ grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); }
.section__photo{ margin:0; border-radius:24px; overflow:hidden; background:var(--surface);
  box-shadow:0 18px 40px -22px rgba(0,0,0,.35); }
.section__photo img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.section__photo figcaption{ padding:.9rem 1.1rem 1.1rem; font-family:var(--font-display); font-style:italic;
  font-size:1rem; color:var(--text); text-align:center; }

/* Alérgenos por plato (iconos monoline) */
.dish__algs{ display:flex; flex-wrap:wrap; gap:.35rem; margin-top:.45rem; }
.alg{ position:relative; width:26px; height:26px; flex:0 0 auto; display:inline-grid; place-items:center;
  color:var(--muted); border:1px solid var(--line); border-radius:50%;
  cursor:help; transition:var(--trans); }
.alg svg{ width:15px; height:15px; display:block; }
.alg:hover{ color:var(--accent); border-color:var(--accent); }
.alg--big{ width:32px; height:32px; cursor:default; }
.alg--big svg{ width:18px; height:18px; }

/* Tooltip táctil: al tocar el icono en móvil (sin hover) muestra el nombre */
.alg__tip{ position:absolute; bottom:calc(100% + 9px); left:50%; z-index:6;
  transform:translateX(-50%) translateY(4px); background:var(--text); color:var(--surface);
  font-family:var(--font-body); font-size:.72rem; font-weight:600; line-height:1.3;
  white-space:normal; max-width:150px; width:max-content; text-align:center;
  padding:.4rem .65rem; border-radius:9px; opacity:0; pointer-events:none;
  box-shadow:0 8px 20px rgba(0,0,0,.18); transition:opacity .15s ease, transform .15s ease; }
.alg__tip::after{ content:""; position:absolute; top:100%; left:50%; transform:translateX(-50%);
  border:5px solid transparent; border-top-color:var(--text); }
.alg--show .alg__tip, .alg:focus-visible .alg__tip{ opacity:1; transform:translateX(-50%) translateY(0); }

/* Bloque legal de alérgenos (fin de carta) */
.algnote{ margin:3.2rem 0 0; padding:1.8rem 1.4rem; background:var(--surface);
  border:1px solid var(--line); border-radius:22px;
  text-align:center; display:grid; gap:.95rem; justify-items:center; transition:var(--trans); }
.algnote__txt{ color:var(--text); font-size:.92rem; max-width:40ch; line-height:1.5; }
.algnote__btn{ display:inline-flex; align-items:center; gap:.55rem; font-family:var(--font-body);
  font-size:.88rem; font-weight:600; color:var(--accent-ink); background:var(--accent);
  border:0; border-radius:99px; padding:.78rem 1.5rem; cursor:pointer;
  box-shadow:0 6px 18px color-mix(in srgb, var(--accent) 28%, transparent); transition:var(--trans); }
.algnote__btn:hover{ transform:translateY(-1px); box-shadow:0 9px 24px color-mix(in srgb, var(--accent) 38%, transparent); }
.algnote__btn:active{ transform:translateY(0) scale(.98); }
.algnote__btn svg{ width:17px; height:17px; }
.algnote__legal{ color:var(--muted); font-size:.68rem; opacity:.8; max-width:46ch; }

/* Modal alérgenos: leyenda (la tarjeta es oscura fija → colores propios) */
.alggrid{ display:grid; grid-template-columns:1fr 1fr; gap:.55rem .9rem; padding:1.1rem 1.5rem .4rem; }
.algrow{ display:flex; align-items:center; gap:.55rem; min-width:0; }
.alggrid .alg{ color:#d5d9e0; border-color:rgba(255,255,255,.22); }
.algrow__nm{ font-size:.85rem; color:#9aa0aa; line-height:1.15; }
@media (max-width:360px){ .alggrid{ grid-template-columns:1fr; } }

/* ============================================================ FOOTER */
.foot{ background:var(--surface); border-top:1px solid var(--line); transition:var(--trans); }
.foot__in{ max-width:720px; margin:0 auto; padding:3rem 1.3rem; text-align:center; display:grid; gap:1.2rem; justify-items:center; }
.foot__group{ font-family:var(--font-display); font-size:1.2rem; color:var(--text); }
[data-theme="demar"] .foot__group{ font-style:italic; }
.foot__label{ text-transform:uppercase; letter-spacing:.2em; font-size:.62rem; color:var(--muted); }
.foot__locales{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; }
.foot__loc{ font-size:.78rem; font-weight:600; padding:.45rem .8rem; border-radius:999px; border:1px solid var(--line); color:var(--muted); transition:.2s; }
.foot__loc:hover{ color:var(--accent); border-color:var(--accent); }
.foot__loc.self{ color:var(--accent-ink); background:var(--accent); border-color:var(--accent); }
.foot__contact{ color:var(--muted); font-size:.86rem; line-height:1.8; }
.foot__contact a:hover{ color:var(--accent); }
.foot__legal{ display:flex; flex-wrap:wrap; justify-content:center; gap:.3rem .9rem; margin-top:1rem; opacity:.55; }
.foot__legal a{ color:var(--muted); font-size:.72rem; text-decoration:none; }
.foot__legal a:hover{ color:var(--accent); text-decoration:underline; }

/* cabecera: título del local + idioma (sin volver al grupo: la carta se abre por QR de mesa) */
.topbar{ }
.topbar__title{ display:none; }
.topRight{ position:fixed; right:1rem; top:1rem; z-index:60; display:flex; align-items:flex-start; gap:.5rem; }

/* móvil: una sola barra fija a todo lo ancho (nombre del local · idioma),
   por encima del nav de categorías (que es sticky) para que no se solapen al hacer scroll */
@media (max-width:640px){
  .topbar{ position:fixed; left:0; right:0; top:0; z-index:60; display:flex; align-items:center; gap:.6rem;
    padding:.5rem .8rem; background:color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line); }
  .topbar .topRight{ position:static; flex:0 0 auto; }
  .topbar__title{ display:block; flex:1 1 auto; min-width:0; text-align:left;
    font-family:var(--font-display); font-weight:600; font-size:1rem; color:var(--text);
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .catnav{ top:3.4rem; }
}

/* selector de idioma */
.langbar{ position:relative; }
.langbar__btn{ display:inline-flex; align-items:center; gap:.32rem; min-height:40px; min-width:40px;
  padding:.5rem .6rem; border-radius:999px; font-size:.72rem; font-weight:700; letter-spacing:.02em;
  background:rgba(16,16,20,.72); color:#fff; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.12); }
.langbar__btn svg{ width:14px; height:14px; flex:0 0 auto; }
.langbar__chev{ width:11px!important; height:11px!important; opacity:.7; transition:transform .2s var(--ease); }
.langbar__menu.open ~ .langbar__btn .langbar__chev,
.langbar__btn[aria-expanded="true"] .langbar__chev{ transform:rotate(180deg); }
.langbar__menu{ position:absolute; top:calc(100% + .5rem); right:0; z-index:65; min-width:168px;
  background:#14141a; border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:.4rem;
  box-shadow:0 20px 50px -16px rgba(0,0,0,.65);
  opacity:0; visibility:hidden; transform:translateY(-6px) scale(.97); transform-origin:top right;
  transition:opacity .2s var(--ease), transform .2s var(--ease), visibility .2s; }
.langbar__menu.open{ opacity:1; visibility:visible; transform:none; }
.langbar__opt{ display:flex; align-items:center; gap:.6rem; width:100%; padding:.55rem .65rem; border-radius:10px;
  color:#d3d6dd; text-align:left; min-height:40px; }
.langbar__opt:hover{ background:rgba(255,255,255,.08); }
.langbar__opt.on{ background:rgba(255,255,255,.1); color:#fff; }
.langbar__optcode{ font-size:.68rem; font-weight:700; letter-spacing:.04em; width:24px; flex:0 0 auto; color:#9aa0aa; }
.langbar__opt.on .langbar__optcode{ color:#e3c877; }
.langbar__optname{ font-size:.86rem; }

/* overlay del sistema (común vs único) */
.sysmodal{ position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:1.3rem;
  background:rgba(8,8,12,.62); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s; }
.sysmodal.open{ opacity:1; visibility:visible; }
.syscard{ width:min(520px, 100%); background:#14141a; color:#f2f2f5; border-radius:20px; overflow:hidden;
  border:1px solid rgba(255,255,255,.09); box-shadow:0 30px 80px -20px rgba(0,0,0,.7);
  transform:translateY(14px) scale(.98); transition:transform .35s var(--ease); }
.sysmodal.open .syscard{ transform:none; }
.syscard__hd{ padding:1.5rem 1.5rem 0; }
.syscard__k{ text-transform:uppercase; letter-spacing:.24em; font-size:.62rem; color:#8b93a3; font-weight:700; }
.syscard__t{ font-family:"Bricolage Grotesque","Outfit",sans-serif; font-weight:700; font-size:1.55rem; margin-top:.4rem; line-height:1.08; letter-spacing:-.01em; }
.syscard__t em{ font-style:normal; color:#e3c877; }
.syscard__body{ padding:1.3rem 1.5rem 1.6rem; display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.syscol h4{ font-size:.72rem; text-transform:uppercase; letter-spacing:.14em; margin-bottom:.6rem; display:flex; align-items:center; gap:.4rem; }
.syscol--shared h4{ color:#6fcf97; }
.syscol--unique h4{ color:#e3c877; }
.syscol ul{ list-style:none; display:grid; gap:.4rem; }
.syscol li{ font-size:.86rem; color:#d3d6dd; padding-left:1.1rem; position:relative; }
.syscol li::before{ content:""; position:absolute; left:0; top:.5em; width:6px; height:6px; border-radius:50%; }
.syscol--shared li::before{ background:#6fcf97; }
.syscol--unique li::before{ background:#e3c877; }
.syscard__ft{ padding:0 1.5rem 1.5rem; }
.syscard__hint{ font-size:.8rem; color:#9aa0aa; line-height:1.5; border-top:1px solid rgba(255,255,255,.08); padding-top:1rem; }
.syscard__hint b{ color:#fff; }
.syscard__link{ display:inline-flex; align-items:center; gap:.5rem; margin-top:.9rem;
  font-size:.82rem; font-weight:600; color:#e3c877; text-decoration:none;
  border:1px solid rgba(227,200,119,.35); border-radius:99px; padding:.55rem 1rem; transition:all .2s ease; }
.syscard__link:hover{ background:rgba(227,200,119,.12); border-color:#e3c877; }
.syscard__link svg{ width:15px; height:15px; }
.syscard__close{ position:absolute; top:1rem; right:1rem; width:34px; height:34px; border-radius:50%;
  background:rgba(255,255,255,.08); display:grid; place-items:center; color:#fff; }
.syscard__close svg{ width:16px; height:16px; }

/* popup de bienvenida (promoción del local, ej. "llegaron las limonadas") */
.promopop{ position:fixed; inset:0; z-index:95; display:grid; place-items:center; padding:1.3rem;
  background:rgba(8,8,12,.72); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease), visibility .3s; }
.promopop.open{ opacity:1; visibility:visible; }
.promopop__card{ position:relative; width:min(420px, 92vw); max-height:88vh; line-height:0;
  border-radius:20px; overflow:hidden; box-shadow:0 30px 80px -20px rgba(0,0,0,.7);
  transform:translateY(14px) scale(.98); transition:transform .35s var(--ease); }
.promopop.open .promopop__card{ transform:none; }
.promopop__img{ display:block; width:100%; height:auto; max-height:88vh; object-fit:contain; }
.promopop__close{ position:absolute; top:.7rem; right:.7rem; width:34px; height:34px; border-radius:50%;
  background:rgba(8,8,12,.6); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px);
  border:1px solid rgba(255,255,255,.18); display:grid; place-items:center; color:#fff; }
.promopop__close svg{ width:16px; height:16px; }

/* intro one-time */
.intro{ position:fixed; inset:0; z-index:90; display:grid; place-items:center; text-align:center; padding:1.5rem;
  background:linear-gradient(165deg,#141018,#0a0710); color:#f2ece0;
  transition:opacity .5s var(--ease), visibility .5s; }
.intro.hide{ opacity:0; visibility:hidden; }
.intro__in{ max-width:440px; display:grid; gap:1.2rem; justify-items:center; }
.intro__k{ text-transform:uppercase; letter-spacing:.3em; font-size:.66rem; color:#e3c877; }
.intro__t{ font-family:"Fraunces",serif; font-size:clamp(1.9rem,7vw,2.7rem); line-height:1.08; }
.intro__t em{ font-style:italic; color:#e3c877; }
.intro__p{ color:#c3cad6; font-size:.98rem; line-height:1.6; }
.intro__dots{ display:flex; gap:.5rem; margin:.2rem 0; }
.intro__dots span{ width:12px; height:12px; border-radius:50%; }
.intro__btn{ margin-top:.4rem; background:#f2ece0; color:#12100a; padding:.85rem 1.8rem; border-radius:999px; font-weight:700; letter-spacing:.02em; min-height:48px; }

/* wash de transición al cambiar de local */
.wash{ position:fixed; inset:0; z-index:70; pointer-events:none; opacity:0; background:var(--accent); }

/* fade del contenido al morph */
.morphing .hero__inner, .morphing .menu, .morphing .foot__in{ opacity:0; transform:translateY(10px); }
.hero__inner,.menu,.foot__in{ transition:opacity .32s var(--ease), transform .32s var(--ease); }

@media (max-width:420px){
  .hero__actions{ flex-direction:column; width:100%; max-width:280px; }
  .btn{ width:100%; justify-content:center; }
}