/* =========================================================
   KIT DE MARCA · Tu Salud en Equilibrio · Carolina Risopatrón
   Se carga al final de cada página y reemplaza colores y tipografías.
   Color principal #C8A47A · Secundario #A7B49A · Acento #E5B1A9 · Fondo #F7F4EF · Texto #3B3A36
   Playfair Display (títulos) · Montserrat SemiBold (subtítulos) · Lato (textos) · Great Vibes (frases)
   ========================================================= */
:root{
  --gold:#C8A47A;          /* color principal */
  --bronze:#A27A4E;        /* principal oscurecido: textos y enlaces legibles */
  --ink:#3B3A36;
  --ink-2:#68655E;
  --steel:#9A968D;
  --mist:#E4E0D8;
  --line:#E9E1D5;
  --paper:#F7F4EF;         /* fondo */
  --sand:#F1E8DC;
  --white:#FFFFFF;
  --sage:#A7B49A;          /* secundario */
  --sage-d:#7F8E73;
  --sage-deep:#66755B;
  --sage-l:#E9EEE4;
  --rose:#E5B1A9;          /* acento */
  --rose-d:#C77F74;
  --rose-l:#F9EAE7;
  --display:"Playfair Display",Georgia,serif;
  --sans:"Lato",system-ui,sans-serif;
  --sub:"Montserrat",system-ui,sans-serif;
  --script:"Great Vibes","Snell Roundhand",cursive;
}

/* ---------- texto base ---------- */
body{font-weight:400;background:var(--paper)}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.16;letter-spacing:0}
h2{font-size:clamp(31px,4vw,50px)}
h2 em,h1 em{font-family:var(--display);font-style:italic;font-weight:400;color:var(--bronze)}
.label,.eyebrow{font-family:var(--sub);font-weight:600;font-size:11.5px;letter-spacing:.22em;color:var(--bronze)}
.btn,header nav,header nav a,.top .tabs button,.seg button,.filters button{font-family:var(--sub)}
.btn{font-weight:600;font-size:13px;letter-spacing:.06em;text-transform:uppercase}
header nav,header nav a{font-weight:500;font-size:13px;letter-spacing:.05em}
.btn-solid{background:var(--ink)}
.btn-solid:hover{background:var(--bronze)}
.btn-line{border-bottom-color:var(--rose)}
header.scrolled{background:var(--header-bg,rgba(247,244,239,.92))}
header .logo img{height:62px;width:auto}
footer .logo img{height:58px;width:auto}
::selection{background:var(--rose);color:var(--ink)}
:focus-visible{outline:2px solid var(--sage-d);outline-offset:3px}

/* cifras y números con serif de la marca */
.facts b,.trio .n,.steps li::before,.steps b,.cred b,.review q,.sec-head .big{font-family:var(--display)}
.facts b{font-size:25px}
.trio .n,.steps4 .n{font-style:normal;font-weight:400;color:var(--rose-d);font-size:19px}
.steps li::before{font-style:normal;color:var(--rose-d);font-size:20px}
.steps b{font-size:20px;font-weight:500}
.trio h3{font-size:23px}
.help h3{font-size:19px}
.sec-head .big{font-size:clamp(18px,1.9vw,23px);line-height:1.6;font-weight:400}
.review q{font-size:18.5px;line-height:1.6;font-style:italic}
.cred b{font-size:18px}

/* ---------- frase en caligrafía ---------- */
.slogan,.script{font-family:var(--script);font-weight:400;color:var(--bronze);letter-spacing:0;line-height:1.25}
.slogan{font-size:clamp(28px,3.1vw,38px);margin:0 0 26px;max-width:520px}
.slogan svg{display:inline-block;width:24px;height:24px;color:var(--rose);vertical-align:-3px;margin-left:6px}

/* ---------- hero ---------- */
.hero{background:linear-gradient(180deg,var(--paper) 0%,var(--paper) 100%)}
.hero h1{font-size:clamp(38px,5.2vw,70px);line-height:1.08;letter-spacing:-.005em;font-weight:500}
.hero .lead{font-size:18px}
.arch{isolation:isolate}
.arch::before{inset:22px -22px -22px 22px;border:0;background:var(--sage-l);opacity:1;z-index:-1}
.arch::after{content:"";position:absolute;width:112px;height:112px;border-radius:50%;background:var(--rose);opacity:.55;left:-34px;bottom:64px;z-index:-1}
.arch .ramita{position:absolute;right:-48px;bottom:-34px;width:96px;height:176px;color:var(--sage-d);z-index:2;pointer-events:none}
@media(max-width:900px){
  .hero{background:radial-gradient(120% 60% at 50% 38%,var(--sage-l) 0%,rgba(233,238,228,0) 70%)}
  .hero h1{font-size:clamp(34px,9.4vw,46px);line-height:1.12}
  .slogan{justify-content:center;text-align:center;margin:0 auto 22px;order:4}
  .slogan svg{display:none}
  .hero .lead{order:5}.hero .actions{order:6}.facts{order:7}
  h2{font-size:clamp(29px,8vw,38px)}
  .arch::before{inset:12px -10px -12px 12px}
  .arch::after{width:70px;height:70px;left:-14px;bottom:30px}
  .arch .ramita{right:-18px;bottom:-22px;width:64px;height:118px}
  header .logo img{height:46px}
  footer .logo img{height:54px}
}

/* ---------- valores: natural · consciente · armonioso · holístico ---------- */
.valores{padding:0!important;background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.valores .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.valores div{display:flex;align-items:center;justify-content:center;gap:14px;padding:26px 12px;font:600 12px var(--sub);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-2)}
.valores div+div{border-left:1px solid var(--line)}
.valores svg{width:34px;height:34px;color:var(--sage-d);flex:0 0 34px}
@media(max-width:700px){
  .valores .wrap{grid-template-columns:1fr 1fr}
  .valores div{flex-direction:column;gap:8px;padding:20px 6px;font-size:10.5px;letter-spacing:.14em}
  .valores div:nth-child(3){border-left:0}
  .valores div:nth-child(n+3){border-top:1px solid var(--line)}
}

/* ---------- secciones con color de la paleta ---------- */
.what{background:var(--sage-l)}
.trio,.trio div+div{border-color:rgba(127,142,115,.35)}
.trio .n{color:var(--sage-deep)}
.help{border-color:var(--line);border-radius:22px;text-align:center}
.help svg{width:52px;height:52px;padding:11px;border-radius:50%;background:var(--sage-l);color:var(--sage-deep);margin:0 auto 18px}
.help:nth-child(even) svg{background:var(--rose-l);color:var(--rose-d)}
.tags span{border-color:var(--sage);background:var(--white)}
.session{background:var(--white)}
.pills span{background:var(--rose-l);color:var(--ink)}
.session .photo,.about .photo{position:relative}
.session .photo img,.about .photo img{border-radius:200px 200px 22px 22px}
.about{background:var(--paper)}
.cred{border-color:var(--sage);background:var(--white)}
.reviews{background:var(--rose-l)}
.review{border:1px solid rgba(229,177,169,.5)}
.stars{color:var(--gold)}
.review q::before{content:"“";display:block;font:400 56px/0.6 var(--display);color:var(--rose);margin-bottom:10px}
.book{background:var(--sage-deep);color:#EEF1EA}
.book::before{border-color:rgba(255,255,255,.22)}
.book::after{content:"";position:absolute;left:-120px;bottom:-160px;width:360px;height:360px;border-radius:50%;background:rgba(255,255,255,.06)}
.book .label,.book h2 em{color:#F3DDD8}
.book p.lead{color:#E3E8DD}
.book .btn-solid{background:#fff;color:var(--ink)}
.book .btn-solid:hover{background:var(--rose);color:var(--ink)}
.info span{color:#F3DDD8}
.info a{border-bottom-color:rgba(243,221,216,.7)}
.info small{color:#CBD3C3}

/* ---------- banda de cierre ---------- */
.cierre{background:var(--sage-d);color:#fff;text-align:center;padding:34px 20px;position:relative;overflow:hidden}
.cierre p{margin:0;display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center;justify-content:center;font:400 clamp(16px,2vw,21px)/1.4 var(--display)}
.cierre .script{font-size:clamp(30px,3.6vw,42px);color:#fff}
.cierre .corazon{width:26px;height:26px;color:var(--rose)}
.cierre .hoja{position:absolute;bottom:-18px;width:86px;height:164px;color:rgba(255,255,255,.34);pointer-events:none}
.cierre .hoja.i{left:max(10px,5%)}
.cierre .hoja.d{right:max(10px,5%);transform:scaleX(-1)}
@media(max-width:700px){.cierre .hoja{width:54px;height:104px}.cierre .hoja.i{left:-6px}.cierre .hoja.d{right:-6px}}

footer .social a{border-color:var(--sage)}
footer .social a:hover{background:var(--sage-deep);border-color:var(--sage-deep)}
footer .links a:hover{color:var(--sage-deep)}

/* ---------- página de agenda ---------- */
.stepper b{font-family:var(--sub)}

/* cifras alineadas (Playfair usa números de texto por defecto) */
h1,h2,h3,.facts b,.trio .n,.steps li::before,.steps4 .n,.num,.badge,.ticket b,.sum b,.kpi b{font-variant-numeric:lining-nums}

/* menú: no partir líneas en anchos medianos */
header nav a{white-space:nowrap}
@media(max-width:1180px){header nav{gap:20px}header nav a{letter-spacing:.03em}header .btn{padding:10px 16px}}

/* pie: enlaces legales a la izquierda y copyright a la derecha */
footer .copy{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 24px;flex:0 0 100%;width:100%;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--steel)}
footer .legal{display:flex;gap:8px 24px;flex-wrap:wrap}
footer .legal a{color:var(--ink-2);text-decoration:none;border-bottom:1px solid transparent}
footer .legal a:hover{color:var(--sage-deep);border-bottom-color:var(--sage)}
@media(max-width:700px){footer .copy{flex-direction:column;justify-content:center;text-align:center;gap:8px}footer .legal{justify-content:center}}
@media(min-width:701px){footer .copy>span{padding-right:70px}}
