/* ============================================================
   LA SALA S.D.D. · Tokens de marca
   ============================================================ */
*,*::before,*::after{box-sizing:border-box}
input,select,textarea,button{font-family:inherit}
:root{
  --teal:#7FC8BC; --teal-600:#57ABA0; --teal-050:#E7F3F0; --teal-deep:#2C5B54;
  --cream:#F3EEE2; --paper:#FBF9F3; --paper-2:#F7F2E7;
  --ink:#1B1815; --ink-70:#4B453C; --ink-40:#8A8272;
  --gold:#E3A857; --gold-600:#C98A34; --gold-050:#FBF1DE;
  --rose:#D96A6A; --rose-050:#F8E3E3;
  --line:#E7E0CF; --line-2:#EFE9DA;
  --ok:#3E9E7A; --bad:#C4553F; --warn:#D9922C;
  --radius:16px; --radius-lg:22px; --radius-sm:11px;
  --shadow-sm:0 1px 2px rgba(27,24,21,.06),0 2px 8px rgba(27,24,21,.05);
  --shadow:0 6px 24px rgba(27,24,21,.10);
  --shadow-lg:0 18px 50px rgba(27,24,21,.16);
  --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  --font-head:'Archivo','Inter',sans-serif;
  --font-block:'Anton','Archivo',sans-serif;
  --font-serif:'Playfair Display',Georgia,serif;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;font-family:var(--font-body);color:var(--ink);
  background:var(--cream);line-height:1.5;-webkit-font-smoothing:antialiased;
}
a{color:inherit}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:6px}

/* Logo bloque estilo letrero */
.brand-block{font-family:var(--font-block);line-height:.82;letter-spacing:1px;text-transform:uppercase}
.brand-block .big{display:block;font-size:clamp(38px,7vw,72px);color:var(--gold);
  text-shadow:5px 5px 0 var(--ink);}
.brand-block .sdd{display:block;font-family:var(--font-block);letter-spacing:.42em;
  font-size:clamp(15px,2.4vw,22px);color:var(--gold);text-shadow:2.5px 2.5px 0 var(--ink);
  margin-top:.35em;padding-left:.42em}

/* Logotipo por imagen (PNG con transparencia) */
.brand-logo{display:block;height:auto;width:auto;max-width:100%}
.brand-logo.hero{width:min(320px,72vw);margin:4px auto 0}
.brand-logo.lg{width:230px;margin:0 auto}
.brand-logo.md{width:185px}
.brand-logo.sm{width:160px}

/* Ticker */
.ticker{background:var(--ink);color:var(--cream);overflow:hidden;white-space:nowrap;
  border-top:3px solid var(--gold);border-bottom:3px solid var(--gold)}
.ticker .track{display:inline-block;padding:11px 0;animation:ticker 26s linear infinite;
  font-family:var(--font-head);font-weight:800;letter-spacing:.18em;font-size:13px;text-transform:uppercase}
.ticker .track span{margin:0 26px;color:var(--cream)}
.ticker .track b{color:var(--gold)}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ticker .track{animation:none}}

/* Botones */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:none;border-radius:999px;padding:14px 26px;font-weight:800;font-size:15px;
  transition:transform .12s ease,box-shadow .12s ease,background .12s ease;text-decoration:none}
.btn:active{transform:translateY(1px)}
.btn-gold{background:var(--gold);color:var(--ink);box-shadow:0 4px 0 var(--gold-600)}
.btn-gold:hover{background:#EDB466}
.btn-ink{background:var(--ink);color:var(--cream)}
.btn-ink:hover{background:#2a251f}
.btn-teal{background:var(--teal);color:var(--ink);box-shadow:0 4px 0 var(--teal-600)}
.btn-ghost{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--cream)}
.btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.btn-lg{padding:16px 32px;font-size:16px}
.btn-block{width:100%}

/* Chips */
.chip{border:2px solid var(--line);background:var(--paper);border-radius:999px;
  padding:9px 16px;font-weight:700;font-size:14px;color:var(--ink-70);transition:all .12s}
.chip:hover{border-color:var(--ink-40)}
.chip.on{border-color:var(--ink);background:var(--ink);color:var(--cream)}

/* Toast */
.toast-wrap{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:9999;
  display:flex;flex-direction:column;gap:10px;align-items:center}
.toast{background:var(--ink);color:var(--cream);padding:13px 20px;border-radius:12px;
  font-weight:600;font-size:14px;box-shadow:var(--shadow-lg);max-width:90vw;
  animation:toastIn .25s ease}
.toast.ok{background:var(--ok)} .toast.bad{background:var(--bad)}
@keyframes toastIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
