/* Identidad Barbershop Javi Spa: negro premium con acento dorado. Tema oscuro único a propósito. */
:root{
  --bg:#0C0C0D; --bg2:#121214; --card:#17171A; --card2:#1E1E22; --line:#2A2A2F;
  --fg:#EDEBE6; --muted:#9A97A1; --gold:#C9A85C; --gold2:#E3C98A; --gold-ink:#111;
  --ok:#2FB57A; --ok-bg:#13261D; --warn:#E0A21B; --warn-bg:#2B2210; --info:#6E93FF; --info-bg:#141C33; --bad:#E5534B; --bad-bg:#2D1514;
  --display:"Playfair Display",Georgia,serif; --body:"Poppins","Avenir Next","Segoe UI",system-ui,sans-serif;
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{background:var(--bg);color:var(--fg)}
body{margin:0;font-family:var(--body);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
input,select,textarea{font:inherit;color:var(--fg);background:var(--card2);border:1px solid var(--line);border-radius:10px;padding:11px 12px;width:100%}
input::placeholder{color:#6E6B75}
.hidden{display:none!important}

/* Logo tipográfico */
.logo{display:inline-flex;flex-direction:column;align-items:center;line-height:1;color:#fff;text-decoration:none}
.logo .bs{font-family:"Oswald",Impact,sans-serif;font-weight:700;letter-spacing:.05em;font-size:18px}
.logo .jv{font-family:"Great Vibes",cursive;font-size:20px;margin-top:-3px;display:flex;align-items:center;gap:6px}
.logo .jv::before,.logo .jv::after{content:"";width:18px;height:1px;background:#fff;opacity:.6}
.logo .spa{font-size:7px;letter-spacing:.3em;margin-top:1px}
.logo.lg .bs{font-size:34px}.logo.lg .jv{font-size:34px}.logo.lg .spa{font-size:11px}
.logo.lg .jv::before,.logo.lg .jv::after{width:40px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--card2);border-radius:999px;padding:10px 18px;font-weight:600;font-size:14px;text-decoration:none;transition:transform .12s,background .15s}
.btn:active{transform:scale(.97)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--gold-ink)}
.btn.gold:hover{background:var(--gold2)}
.btn.ghost{background:transparent}
.btn.sm{padding:6px 12px;font-size:12.5px}
.btn[disabled]{opacity:.4;pointer-events:none}
.eyebrow{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.muted{color:var(--muted)}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 14px;font-size:13.5px}
.chip.on{background:rgba(201,168,92,.14);border-color:var(--gold);color:var(--gold2);font-weight:600}

.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%) translateY(20px);background:var(--card2);border:1px solid var(--gold);color:var(--fg);padding:12px 18px;border-radius:14px;font-size:14px;opacity:0;transition:all .3s;z-index:90;max-width:min(92vw,440px);box-shadow:0 12px 40px rgba(0,0,0,.5)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}