:root{
  --gold:#C99A55;
  --gold-light:#D9B77E;
  --gold-deep:#A97832;
  --soft:#FCFAF6;
  --ivory:#F7F2E9;
  --cream:#EFE4D2;
  --black:#080807;
  --charcoal:#171613;
  --gray:#756F66;
  --line:rgba(201,154,85,.28);
}

html{background:var(--soft)}
body{
  min-height:100vh;
  margin:0;
  padding:38px 18px 56px;
  color:var(--charcoal);
  font-family:Inter,system-ui,sans-serif;
  background:
    radial-gradient(circle at 12% 0%,rgba(201,154,85,.12),transparent 27%),
    radial-gradient(circle at 88% 4%,rgba(8,8,7,.055),transparent 25%),
    linear-gradient(180deg,var(--soft) 0%,var(--ivory) 58%,#eee2cf 100%);
}

.card{
  max-width:900px;
  margin:0 auto;
  padding:42px 44px 46px;
  overflow:hidden;
  border:1px solid rgba(201,154,85,.30);
  border-radius:24px;
  background:#fff;
  box-shadow:0 28px 78px rgba(63,43,18,.10),0 3px 14px rgba(63,43,18,.04);
}
.card:before{
  height:2px;
  background:linear-gradient(90deg,transparent,var(--gold-light),var(--gold),var(--gold-light),transparent);
}

.premium-kicker{
  margin:0 0 24px;
  color:#6f5d43;
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.68rem;
  font-weight:500;
  letter-spacing:.22em;
  text-transform:uppercase;
}

.brand{
  grid-template-columns:110px 1fr 110px;
  gap:30px;
  margin:-4px -10px 38px;
  padding:18px 10px 34px;
  border-bottom:1px solid rgba(201,154,85,.18);
  background:#fff;
}
.brand-logo{
  width:110px;
  height:110px;
  padding:0;
  border:0;
  border-radius:0;
  background:#fff;
  box-shadow:none;
  object-fit:contain;
  mix-blend-mode:multiply;
}
.brand-copy:after{
  content:"";
  display:block;
  width:54px;
  height:1px;
  margin:15px auto 0;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.brand h1{
  margin:0;
  color:var(--gold-deep);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:clamp(2.35rem,5vw,3.75rem);
  font-weight:500;
  line-height:.95;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.brand p{
  margin:10px 0 0;
  color:#504a43;
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.18em;
  text-transform:uppercase;
}

.grid{gap:20px 18px}
.section-head{
  gap:15px;
  margin:12px 0 1px;
  padding-top:14px;
}
.section-head:not(:first-child){margin-top:20px}
.step{
  width:40px;
  height:40px;
  border:1px solid rgba(201,154,85,.48);
  background:var(--black);
  box-shadow:none;
  color:var(--gold-light);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.68rem;
  font-weight:500;
  letter-spacing:.07em;
}
.section-head strong{
  color:var(--charcoal);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:1rem;
  font-weight:500;
  letter-spacing:.055em;
  text-transform:uppercase;
}
.section-head small{
  margin-top:4px;
  color:var(--gray);
  font-size:.78rem;
  line-height:1.45;
}

label{
  margin-bottom:8px;
  color:#4d443a;
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.68rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}
input,select{
  min-height:50px;
  padding:13px 15px;
  border:1px solid rgba(169,120,50,.28);
  border-radius:12px;
  background:#fffdfa;
  color:var(--charcoal);
  font-family:Inter,system-ui,sans-serif;
  font-size:.98rem;
}
input:hover,select:hover{border-color:rgba(169,120,50,.56)}
input:focus,select:focus{
  border-color:var(--gold-deep);
  background:#fff;
  box-shadow:0 0 0 4px rgba(201,154,85,.12);
}
select:disabled{background:#f3eee6;color:#9a9287}

.hint{
  margin-top:8px;
  color:#81786e;
  font-size:.75rem;
}

.policy{
  padding:18px 20px;
  border:1px solid rgba(201,154,85,.22);
  border-radius:14px;
  background:linear-gradient(180deg,#fbf7ef,var(--soft));
  color:#5d554c;
  font-size:.82rem;
}
.check{gap:12px;padding:4px 1px}
.check input{accent-color:var(--gold-deep)}
.check label{
  color:#5b534a;
  font-family:Inter,system-ui,sans-serif;
  font-size:.83rem;
  font-weight:500;
  letter-spacing:0;
  line-height:1.45;
  text-transform:none;
}

.slots{gap:11px}
.slot{
  padding:14px 15px;
  border:1px solid rgba(169,120,50,.25);
  border-radius:12px;
  background:#fffdfa;
  box-shadow:none;
}
.slot:hover{
  border-color:var(--gold);
  background:#fffaf2;
  box-shadow:0 10px 22px rgba(73,57,36,.07);
}
.slot:has(input:checked){
  border-color:var(--gold-deep);
  background:#fbf1e1;
  box-shadow:0 0 0 3px rgba(201,154,85,.10);
}
.slot input{accent-color:var(--gold-deep)}
.slot strong{color:#40382f;font-family:"Montserrat",Inter,sans-serif;font-weight:500}
.range-time{border-top-color:rgba(201,154,85,.22)}

.empty{
  padding:17px;
  border:1px dashed rgba(169,120,50,.38);
  border-radius:12px;
  background:#fbf7ef;
  color:#705d47;
}
.price-preview{
  padding:13px 15px;
  border:1px solid rgba(201,154,85,.24);
  border-radius:12px;
  background:#fbf7ef;
  color:#655a4d;
}
.price-preview strong{color:var(--gold-deep)}

button{
  min-height:52px;
  border-radius:999px;
  background:var(--gold);
  color:var(--black);
  box-shadow:0 13px 30px rgba(111,71,16,.15);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.76rem;
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
}
button:not(:disabled):hover{
  background:var(--gold-deep);
  color:#fff;
  box-shadow:0 16px 34px rgba(111,71,16,.19);
}
button:disabled{opacity:.46}

.msg{border-radius:14px}
.loading{
  border-color:rgba(201,154,85,.24);
  background:#fbf7ef;
  color:#756959;
}
.ok{
  border-color:#cfded0;
  background:linear-gradient(180deg,#f1f8f1,#e9f4ea);
}
.ok>strong:first-child{
  font-family:"Cormorant Garamond",serif;
  font-size:1.75rem;
  font-weight:600;
}
.err{border-color:#efd0ca}
.wa-btn{
  margin-top:16px;
  border:1px solid rgba(201,154,85,.42);
  border-radius:999px;
  background:var(--black);
  color:var(--gold-light);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.72rem;
  font-weight:500;
  letter-spacing:.10em;
  text-transform:uppercase;
}

/* Próximas opciones: misma superficie editorial */
.next-panel{
  padding:18px 20px;
  border:1px solid rgba(201,154,85,.22);
  border-radius:14px;
  background:linear-gradient(180deg,#fffdfa,#f9f3e8);
}
.next-heading strong{
  color:var(--charcoal);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.92rem;
  font-weight:500;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.next-subtitle,.next-status{color:var(--gray)}
.next-card{
  border:1px solid rgba(169,120,50,.25);
  border-radius:11px;
  background:#fffdfa;
  color:#40372e;
  text-transform:none;
  letter-spacing:0;
}
.next-card:not(:disabled):hover{
  border-color:var(--gold);
  background:#fffaf2;
}
.next-card[aria-pressed="true"]{
  border-color:var(--gold-deep);
  background:#fbf0df;
  box-shadow:0 0 0 3px rgba(201,154,85,.10);
}
.next-card-date{
  color:var(--gold-deep);
  font-family:"Montserrat",Inter,sans-serif;
}
.next-more{
  min-height:42px;
  border:1px solid rgba(169,120,50,.34);
  border-radius:999px;
  background:transparent;
  color:#704e22;
  box-shadow:none;
  font-size:.68rem;
}
.next-more:not(:disabled):hover{
  border-color:var(--gold);
  background:#fffaf2;
  color:#704e22;
}
.next-manual-divider{
  color:#877f75;
  font-family:"Montserrat",Inter,sans-serif;
  font-weight:500;
  letter-spacing:.08em;
}
.next-manual-divider:before,.next-manual-divider:after{background:rgba(201,154,85,.25)}

/* Redes: misma estética SANARTE; no compiten visualmente con la reserva */
.social-links{
  max-width:900px;
  margin:18px auto 0;
  padding:24px 18px;
  border:1px solid rgba(201,154,85,.24);
  border-radius:18px;
  background:rgba(252,250,246,.80);
}
.social-links strong{
  margin-bottom:14px;
  color:#51483e;
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.75rem;
  font-weight:500;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.social-actions{gap:10px}
.social-actions a,
.social-actions a[href*="instagram.com"],
.social-actions a[href*="facebook.com"],
.social-actions a[href*="wa.me"]{
  min-width:138px;
  padding:11px 16px;
  border:1px solid rgba(201,154,85,.38);
  border-radius:999px;
  background:var(--black);
  color:var(--gold-light);
  box-shadow:none;
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.68rem;
  font-weight:500;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.social-actions a:hover,
.social-actions a[href*="instagram.com"]:hover,
.social-actions a[href*="facebook.com"]:hover,
.social-actions a[href*="wa.me"]:hover{
  border-color:var(--gold);
  background:var(--gold);
  color:var(--black);
  filter:none;
  box-shadow:none;
}
.social-actions a[href*="instagram.com"]:before,
.social-actions a[href*="facebook.com"]:before,
.social-actions a[href*="wa.me"]:before{
  width:15px;
  height:15px;
  flex-basis:15px;
}

.glm-footer{
  max-width:900px;
  margin:18px auto 0;
  padding:28px 18px;
  border-top:1px solid rgba(201,154,85,.34);
  background:var(--black);
  color:#aaa196;
  font-family:Inter,system-ui,sans-serif;
  font-size:.68rem;
  letter-spacing:.08em;
}
.glm-footer:before{
  content:"SANARTE ESTÉTICA & SPA";
  display:block;
  margin-bottom:9px;
  color:var(--gold-light);
  font-family:"Montserrat",Inter,sans-serif;
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.14em;
}
.glm-footer strong{
  color:#d8c6ab;
  font-family:"Montserrat",Inter,sans-serif;
  font-weight:500;
}

button:focus-visible,
input:focus-visible,
select:focus-visible,
.slot:focus-within,
.social-actions a:focus-visible,
.wa-btn:focus-visible{
  outline:3px solid var(--gold-deep);
  outline-offset:3px;
}

@media(max-width:650px){
  body{padding:12px 10px 28px}
  .card{padding:26px 18px 30px;border-radius:18px}
  .premium-kicker{margin-bottom:18px;font-size:.62rem}
  .brand{
    grid-template-columns:68px 1fr 68px;
    gap:10px;
    margin-bottom:28px;
    padding-bottom:24px;
  }
  .brand-logo{width:68px;height:68px}
  .brand h1{font-size:clamp(1.65rem,8vw,2.35rem);letter-spacing:.11em}
  .brand p{font-size:.58rem;letter-spacing:.13em}
  .section-head{align-items:flex-start}
  .step{width:36px;height:36px}
  .section-head strong{font-size:.88rem}
  .section-head small{font-size:.72rem}
  .grid{gap:16px}
  .slots{grid-template-columns:1fr}
  .social-links{margin:14px 0 0;padding:20px 14px}
  .social-actions a,
  .social-actions a[href*="instagram.com"],
  .social-actions a[href*="facebook.com"],
  .social-actions a[href*="wa.me"]{min-width:0;flex:1}
  .glm-footer{margin:14px 0 0;border-radius:14px}
}

@media(max-width:430px){
  .brand{grid-template-columns:58px 1fr 58px}
  .brand-logo{width:58px;height:58px}
  .brand h1{font-size:1.55rem;letter-spacing:.09em}
  .brand p{font-size:.54rem}
  input,select{font-size:16px}
}


/* =========================================================
   OPTION B — EDITORIAL BOUTIQUE
   Misma lógica y contenido; segunda dirección visual.
   ========================================================= */
body{
  padding:30px 18px 52px;
  background:
    linear-gradient(90deg,rgba(201,154,85,.045) 1px,transparent 1px) center/220px 100%,
    linear-gradient(180deg,#f5efe6 0%,#fbf8f2 38%,#eee2cf 100%);
}

.card{
  max-width:980px;
  padding:0 54px 56px;
  border:1px solid rgba(201,154,85,.22);
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 70px rgba(53,38,18,.09);
}
.card:before{display:none}

.premium-kicker{
  margin:0 -54px 0;
  padding:15px 20px;
  background:var(--black);
  color:var(--gold-light);
  text-align:center;
  letter-spacing:.25em;
}

.brand{
  grid-template-columns:96px 1fr 96px;
  gap:38px;
  margin:0 -8px 48px;
  padding:34px 8px 38px;
  border-bottom:1px solid rgba(201,154,85,.22);
  background:#fff;
}
.brand-logo{
  width:96px;
  height:96px;
  background:#fff;
  mix-blend-mode:multiply;
}
.brand h1{
  color:var(--black);
  font-size:clamp(2.7rem,5.2vw,4.2rem);
  letter-spacing:.18em;
}
.brand p{
  margin-top:12px;
  color:var(--gold-deep);
  letter-spacing:.20em;
}
.brand-copy:after{
  width:84px;
  margin-top:18px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}

.grid{gap:24px 22px}

.section-head{
  position:relative;
  gap:18px;
  margin:22px 0 4px;
  padding:26px 0 14px;
  border-top:1px solid rgba(201,154,85,.22);
}
.section-head:first-child{
  margin-top:0;
  border-top:0;
  padding-top:0;
}
.section-head:not(:first-child){margin-top:28px}
.step{
  width:auto;
  height:auto;
  min-width:38px;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--gold-deep);
  font-size:.72rem;
  letter-spacing:.16em;
}
.section-head strong{
  font-size:1.04rem;
  letter-spacing:.075em;
}
.section-head small{font-size:.8rem}

label{color:#5b5045}
input,select{
  min-height:52px;
  border-width:0 0 1px;
  border-radius:0;
  padding:13px 2px 11px;
  background:#fff;
  border-color:rgba(169,120,50,.34);
}
input:hover,select:hover{border-color:var(--gold)}
input:focus,select:focus{
  border-color:var(--gold-deep);
  box-shadow:0 3px 0 rgba(201,154,85,.10);
  background:#fff;
}

.next-panel,
.policy,
.price-preview,
.empty{
  border-radius:4px;
  background:#fbf8f2;
}
.next-panel{padding:20px 22px}
.next-card,
.slot{
  border-radius:4px;
  background:#fff;
}
.slot:hover,.next-card:not(:disabled):hover{background:#fbf7ef}
.slot:has(input:checked),
.next-card[aria-pressed="true"]{
  background:#f6ead8;
  box-shadow:inset 3px 0 0 var(--gold-deep);
}

button{
  min-height:54px;
  border-radius:0;
  background:var(--black);
  color:var(--gold-light);
  box-shadow:none;
}
button:not(:disabled):hover{
  background:var(--gold);
  color:var(--black);
  box-shadow:none;
}
.next-more{
  border-radius:0;
  background:transparent;
  color:#704e22;
}

.social-links{
  max-width:980px;
  margin:16px auto 0;
  padding:26px 22px;
  border-radius:0;
  border-color:rgba(201,154,85,.26);
  background:#fff;
}
.social-actions a,
.social-actions a[href*="instagram.com"],
.social-actions a[href*="facebook.com"],
.social-actions a[href*="wa.me"]{
  border-radius:0;
  background:transparent;
  color:var(--charcoal);
  border-color:rgba(201,154,85,.42);
}
.social-actions a:hover,
.social-actions a[href*="instagram.com"]:hover,
.social-actions a[href*="facebook.com"]:hover,
.social-actions a[href*="wa.me"]:hover{
  background:var(--black);
  color:var(--gold-light);
  border-color:var(--black);
}

.glm-footer{
  max-width:980px;
  margin:0 auto;
  padding:34px 22px;
  border-top:1px solid rgba(201,154,85,.38);
  border-radius:0;
}

@media(max-width:650px){
  body{padding:10px 8px 24px}
  .card{padding:0 18px 30px;border-radius:12px}
  .premium-kicker{margin:0 -18px;padding:13px 12px;font-size:.58rem}
  .brand{
    grid-template-columns:62px 1fr 62px;
    gap:10px;
    margin:0 0 30px;
    padding:28px 0 26px;
  }
  .brand-logo{width:62px;height:62px}
  .brand h1{font-size:clamp(1.7rem,8.5vw,2.4rem);letter-spacing:.12em}
  .brand p{font-size:.56rem;letter-spacing:.14em}
  .brand-copy:after{width:52px;margin-top:13px}
  .section-head{gap:12px;padding-top:22px}
  .step{min-width:30px}
  .section-head strong{font-size:.88rem}
  input,select{min-height:50px}
  .social-links{margin:12px 0 0;border-radius:0}
  .glm-footer{margin:0;border-radius:0}
}

@media(max-width:430px){
  .brand{grid-template-columns:54px 1fr 54px}
  .brand-logo{width:54px;height:54px}
  .brand h1{font-size:1.5rem;letter-spacing:.095em}
}


/* Ajuste aprobado — identidad superior en dorado */
.brand h1,
.brand p{
  color:var(--gold-deep);
}


/* Ajuste final aprobado — logos con mayor presencia */
.brand{
  grid-template-columns:132px 1fr 132px;
  gap:34px;
}
.brand-logo{
  width:132px;
  height:132px;
}
@media(max-width:650px){
  .brand{grid-template-columns:76px 1fr 76px}
  .brand-logo{width:76px;height:76px}
}
@media(max-width:430px){
  .brand{grid-template-columns:66px 1fr 66px}
  .brand-logo{width:66px;height:66px}
}

/* Nuevos logos oficiales transparentes: preservar color exacto */
.brand-logo{
  background:transparent;
  mix-blend-mode:normal;
}
