/* Fuentes propias del sitio.

   Antes venian de fonts.googleapis.com, que anadia dos conexiones nuevas y
   bloqueaba el pintado hasta resolverlas. Van como fuente variable: un archivo
   por familia cubre todos los pesos, contra tres archivos por familia de las
   estaticas. Solo el subconjunto latin, que es el que cubre el espanol.

   No llevan ?v= a proposito: el preload del head tiene que pedir exactamente
   esta misma URL o el navegador se baja el archivo dos veces. */
@font-face{
  font-family:'Inter';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url('../fonts/inter-var.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face{
  font-family:'Playfair Display';
  font-style:normal;
  font-weight:500 700;
  font-display:swap;
  src:url('../fonts/playfair-var.woff2') format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,figure,blockquote{margin:0}
ul,ol{margin:0;padding:0;list-style:none}

:root{
  /* Marca Alejandro Novoa (tomados del vector del logotipo) */
  --rojo:#ED1C24;
  --rojo-deep:#C21419;
  --carmin:#EF0A46;
  --azul:#27AAE1;
  --azul-deep:#1A83B4;
  --verde:#39B54A;
  --naranja:#F7941E;
  --morado:#92278F;
  --morado-deep:#711D6F;

  --ink:#232326;
  --ink-soft:#5C5C5C;
  --ink-mute:#8C8C90;
  --cream:#F7F5F2;
  --cream-deep:#EFECE6;
  --paper:#FFFFFF;
  --line:#E2DED7;
  --oscuro:#232326;
  --oscuro-2:#1B1B1E;
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
  --wrap:1180px;
  --r:14px;
  --shadow:0 18px 50px -28px rgba(35,35,38,.35);
  --accent:var(--rojo);
  --accent-deep:var(--rojo-deep);
  --cta:var(--rojo);
  --cta-deep:var(--rojo-deep);
}
body.theme-terapia{--accent:var(--azul);--accent-deep:var(--azul-deep)}
body.theme-empresas{--accent:var(--morado);--accent-deep:var(--morado-deep)}

body{
  font-family:var(--sans);
  font-size:17px;
  line-height:1.7;
  color:var(--ink-soft);
  background:var(--cream);
  -webkit-font-smoothing:antialiased;
}

/* Tipografía */
h1,h2,h3,h4{font-family:var(--serif);color:var(--ink);font-weight:600;line-height:1.15;letter-spacing:-.01em}
h1{font-size:clamp(2.4rem,5.2vw,4rem)}
h2{font-size:clamp(1.9rem,3.6vw,2.9rem)}
h3{font-size:clamp(1.25rem,2vw,1.5rem);line-height:1.25}
h4{font-size:1.05rem;line-height:1.35}
p+p{margin-top:1em}
.lead{font-size:clamp(1.05rem,1.5vw,1.22rem);line-height:1.65;color:var(--ink-soft)}
.eyebrow{
  font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--accent);margin-bottom:1rem;display:block
}
.eyebrow--light{color:var(--naranja)}

/* Layout */
.wrap{width:min(100% - 2.5rem,var(--wrap));margin-inline:auto}
.wrap--narrow{width:min(100% - 2.5rem,860px);margin-inline:auto}
section{padding:clamp(4rem,8vw,7rem) 0}
.sec-head{max-width:660px;margin-bottom:clamp(2.5rem,5vw,3.5rem)}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head p{margin-top:1.1rem}
.bg-paper{background:var(--paper)}
.bg-cream{background:var(--cream-deep)}
.bg-ink{background:var(--oscuro);color:#CFCFD2}
.bg-ink h1,.bg-ink h2,.bg-ink h3,.bg-ink h4{color:#fff}

/* Botones */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  padding:.95rem 1.9rem;border-radius:999px;border:1px solid transparent;
  font-size:.95rem;font-weight:600;letter-spacing:.01em;text-decoration:none;cursor:pointer;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
  white-space:nowrap
}
.btn:hover{transform:translateY(-1px)}
.btn--primary{background:var(--cta);color:#fff}
.btn--primary:hover{background:var(--cta-deep)}
.btn--ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--accent);color:var(--accent)}
.btn--light{background:#fff;color:var(--oscuro)}
.btn--light:hover{background:var(--cream-deep)}
.btn--outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn--outline-light:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn .ico{width:18px;height:18px;flex:none}
.btn-row{display:flex;flex-wrap:wrap;gap:.85rem;margin-top:2rem}

/* Encabezado */
.site-head{
  position:sticky;top:0;z-index:60;background:rgba(248,245,239,.92);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line)
}
.site-head .bar{display:flex;align-items:center;gap:1.5rem;min-height:78px}
.brand{display:flex;flex-direction:column;text-decoration:none;line-height:1.1;margin-right:auto}
.brand strong{font-family:var(--serif);font-size:1.32rem;font-weight:600;color:var(--ink);letter-spacing:-.01em}
.brand span{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-mute);margin-top:.28rem}
.nav{display:flex;align-items:center;gap:clamp(1rem,1.7vw,1.9rem)}
.nav a{
  text-decoration:none;font-size:.92rem;font-weight:500;color:var(--ink-soft);
  white-space:nowrap;
  padding:.4rem 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s
}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--accent)}
.head-cta{display:flex;align-items:center;gap:.8rem}
.head-cta .btn{padding:.7rem 1.35rem;font-size:.87rem}
.nav-toggle{
  display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:10px;
  background:transparent;align-items:center;justify-content:center;cursor:pointer
}
.nav-toggle span{display:block;width:19px;height:1.6px;background:var(--ink);position:relative}
.nav-toggle span::before,.nav-toggle span::after{content:"";position:absolute;left:0;width:19px;height:1.6px;background:var(--ink)}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}

/* Redes en el menú */
.nav-redes{display:flex;align-items:center;gap:.9rem;margin-left:.4rem}

/* Acceso a la plataforma. Va contorneado y no como enlace de menú para que se
   lea como una puerta y no como una sección más del sitio, y no lleva el rojo
   de marca porque ese color es del botón principal de cada página. */
.nav a.nav-entrar{
  display:inline-flex;align-items:center;gap:.45rem;padding:.48rem .85rem;
  border:1px solid var(--line-strong,#d8d2c8);border-radius:9px;color:var(--ink-soft);
  font-size:.85rem;font-weight:600
}
.nav a.nav-entrar:hover{border-color:var(--ink);color:var(--ink);background:rgba(0,0,0,.03)}
.nav a.nav-entrar[aria-current="page"]{border-bottom-color:var(--line-strong,#d8d2c8)}
.nav a.nav-entrar svg{flex:0 0 15px}
.nav-red{
  display:inline-flex;align-items:center;justify-content:center;
  width:34px;height:34px;border-radius:50%;color:var(--ink-soft);
  border:1px solid transparent;transition:color .2s,border-color .2s,background .2s
}
.nav-red:hover{color:var(--accent);border-color:var(--line);background:var(--paper)}
.nav-red-txt{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Hero */
/* El padding vertical lo pone .hero-grid; sin este 0 se suma al de section y sobra aire */
.hero{position:relative;overflow:hidden;background:var(--cream);padding:0}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,5vw,4.5rem);align-items:center;padding:clamp(2rem,4.5vh + 1rem,4rem) 0}
.hero-copy h1{margin-bottom:1.4rem}
.hero-copy .lead{max-width:34rem}
.hero-media{position:relative}
.hero-media img{
  width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 22%;
  border-radius:var(--r);box-shadow:var(--shadow)
}
.hero-media::after{
  content:"";position:absolute;inset:auto -22px -22px auto;width:58%;height:58%;
  border:1px solid var(--azul);border-radius:var(--r);z-index:-1
}
.hero-badge{
  position:absolute;left:-18px;bottom:34px;background:var(--paper);border:1px solid var(--line);
  border-radius:12px;padding:1rem 1.3rem;box-shadow:var(--shadow);max-width:230px
}
.hero-badge strong{display:block;font-family:var(--serif);font-size:1.8rem;color:var(--ink);line-height:1}
.hero-badge span{font-size:.82rem;color:var(--ink-mute);display:block;margin-top:.25rem}

/* Franja de credibilidad */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.trust ul{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.trust li{padding:2rem 1.6rem;border-right:1px solid var(--line);display:flex;gap:.9rem;align-items:flex-start}
.trust li:last-child{border-right:0}
.trust .ico{width:22px;height:22px;flex:none;color:var(--accent);margin-top:.15rem}
.trust h4{font-family:var(--sans);font-size:.95rem;font-weight:600;color:var(--ink);margin-bottom:.15rem}
.trust p{font-size:.86rem;line-height:1.5;color:var(--ink-mute)}

/* Rutas (dos públicos) */
.paths{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.4rem,3vw,2.2rem)}
.path{
  position:relative;display:flex;flex-direction:column;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;text-decoration:none
}
.path:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--path-accent,var(--accent))}
.path--terapia{--path-accent:var(--azul)}
.path--empresas{--path-accent:var(--morado)}
.path figure{margin:0;overflow:hidden}
.path figure img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:50% 30%}
.path .body{padding:clamp(1.8rem,3vw,2.4rem);display:flex;flex-direction:column;flex:1}
.path .tag{
  font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
  color:var(--path-accent);margin-bottom:.9rem
}
.path h3{margin-bottom:.9rem}
.path ul{margin:1.4rem 0 0;display:grid;gap:.55rem}
.path li{position:relative;padding-left:1.5rem;font-size:.94rem}
.path li::before{
  content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border-radius:50%;
  background:var(--path-accent)
}
.path .go{
  margin-top:auto;padding-top:1.8rem;display:inline-flex;align-items:center;gap:.55rem;
  font-weight:600;font-size:.93rem;color:var(--path-accent)
}
.path .go .ico{width:17px;height:17px;transition:transform .2s ease}
.path:hover .go .ico{transform:translateX(4px)}

/* Tarjetas de servicio */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(272px,1fr));gap:clamp(1.2rem,2.4vw,1.8rem)}
.card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(1.7rem,3vw,2.1rem);transition:border-color .2s ease,transform .2s ease
}
.card:hover{border-color:var(--accent);transform:translateY(-3px)}
.card .ico-wrap{
  width:48px;height:48px;border-radius:12px;background:var(--cream-deep);
  display:flex;align-items:center;justify-content:center;margin-bottom:1.3rem;color:var(--accent)
}
.card .ico{width:24px;height:24px}
.card h3{font-size:1.18rem;margin-bottom:.7rem}
.card p{font-size:.95rem}
.card ul{margin-top:1.1rem;display:grid;gap:.45rem}
.card li{position:relative;padding-left:1.35rem;font-size:.9rem;color:var(--ink-soft)}
.card li::before{
  content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;border-radius:50%;background:var(--accent)
}

/* Bloque foto + texto */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4.5rem);align-items:center}
.split--flip .split-media{order:2}
.split-media img{
  width:100%;aspect-ratio:1/1;object-fit:cover;object-position:50% 25%;
  border-radius:var(--r);box-shadow:var(--shadow)
}
.split-copy h2{margin-bottom:1.3rem}

/* Proceso */
.steps{counter-reset:step;display:grid;gap:0;border-top:1px solid var(--line)}
.step{
  counter-increment:step;display:grid;grid-template-columns:auto 1fr;gap:1.6rem;
  padding:1.9rem 0;border-bottom:1px solid var(--line);align-items:start
}
.step::before{
  content:counter(step,decimal-leading-zero);font-family:var(--serif);font-size:1.35rem;
  color:var(--accent);line-height:1.2;min-width:2.4rem
}
.step h3{font-size:1.12rem;margin-bottom:.45rem}
.step p{font-size:.95rem}

/* FAQ */
.faq{display:grid;gap:.8rem}
.faq details{
  background:var(--paper);border:1px solid var(--line);border-radius:12px;
  padding:1.15rem 1.5rem;transition:border-color .2s
}
.faq details[open]{border-color:var(--accent)}
.faq summary{
  list-style:none;cursor:pointer;font-weight:600;color:var(--ink);font-size:1rem;
  display:flex;justify-content:space-between;align-items:center;gap:1.2rem
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";width:11px;height:11px;flex:none;border-right:1.8px solid var(--accent);
  border-bottom:1.8px solid var(--accent);transform:rotate(45deg);transition:transform .2s ease;margin-top:-4px
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:2px}
.faq .answer{padding-top:.9rem;font-size:.96rem}

/* Cita */
.quote{
  background:var(--paper);border-left:3px solid var(--carmin);border-radius:0 var(--r) var(--r) 0;
  padding:clamp(1.8rem,4vw,2.6rem)
}
.quote p{font-family:var(--serif);font-size:clamp(1.2rem,2.2vw,1.55rem);line-height:1.45;color:var(--ink)}
.quote cite{display:block;margin-top:1.1rem;font-style:normal;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}

/* CTA final */
.cta-band{background:var(--oscuro);color:#CFCFD2;text-align:center}
/* Igual que el hero: el padding lo pone el wrap, no se suma al de section */
.cta-band{padding:0}
.cta-band .wrap--narrow{padding-block:clamp(3.5rem,7vw,5.5rem)}
.cta-band h2,.cta-band h3{color:#fff}
.cta-band h2{margin-bottom:1.2rem}
.cta-band p{color:#CFCFD2}
.cta-band .btn-row{justify-content:center}

/* Contacto */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:start}
.contact-list{display:grid;gap:1.4rem;margin-top:2rem}
.contact-list li{display:flex;gap:1rem;align-items:flex-start}
.contact-list .ico{width:20px;height:20px;flex:none;color:var(--accent);margin-top:.28rem}
.contact-list h4{font-family:var(--sans);font-size:.95rem;font-weight:600;color:var(--ink);margin-bottom:.15rem}
.contact-list a{color:var(--ink-soft);text-decoration:none;border-bottom:1px solid var(--line)}
.contact-list a:hover{color:var(--accent);border-color:var(--accent)}
.form{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.7rem,3.5vw,2.4rem)}
.field{margin-bottom:1.15rem}
.field label{display:block;font-size:.85rem;font-weight:600;color:var(--ink);margin-bottom:.45rem}
.field input,.field select,.field textarea{
  width:100%;padding:.85rem 1rem;border:1px solid var(--line);border-radius:10px;
  background:var(--cream);font-size:.96rem;transition:border-color .2s,background .2s
}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none;border-color:var(--accent);background:var(--paper)
}
.field input[aria-invalid="true"],.field select[aria-invalid="true"],.field textarea[aria-invalid="true"]{
  border-color:#B4453C;background:#FCF4F3
}
.field textarea{min-height:130px;resize:vertical}
.field .err{display:none;font-size:.8rem;color:#B4453C;margin-top:.35rem}
.field .err.show{display:block}
.form .note{font-size:.8rem;color:var(--ink-mute);margin-top:1rem;line-height:1.55}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{display:none;margin-top:1rem;padding:.9rem 1.1rem;border-radius:10px;font-size:.92rem}
.form-msg.show{display:block}
.form-msg.ok{background:#EDF7EF;color:#2A8437;border:1px solid #C6E4CB}
.form-msg.bad{background:#FCF4F3;color:#B4453C;border:1px solid #E9CFCC}

/* Pie */
.site-foot{background:var(--oscuro-2);color:#9E9EA3;font-size:.9rem}
.site-foot .wrap{padding-block:clamp(3rem,6vw,4.5rem)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:clamp(2rem,4vw,3.5rem);padding-bottom:2.6rem}
.site-foot .brand strong{color:#fff}
.site-foot .brand span{color:var(--rojo)}
.site-foot h4{color:#fff;font-family:var(--sans);font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:1.1rem}
.site-foot ul{display:grid;gap:.65rem}
.site-foot a{color:#9E9EA3;text-decoration:none;transition:color .2s}
.site-foot a:hover{color:#fff}
.foot-bottom{
  border-top:1px solid rgba(255,255,255,.12);padding-top:1.8rem;
  display:flex;flex-wrap:wrap;gap:.9rem 1.4rem;align-items:center;font-size:.82rem
}
.foot-bottom > p{margin-right:.4rem}
/* Redes al pie, junto al aviso de derechos. Van como iconos y no como lista
   de texto: ahi nadie lee nombres de plataforma, reconoce la forma. */
.foot-redes{display:flex;align-items:center;gap:.55rem;margin-right:auto}
.foot-redes a{
  display:flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:9px;color:#9E9EA3;transition:color .2s,background .2s
}
.foot-redes a:hover{color:#fff;background:rgba(255,255,255,.08)}
.foot-credit{display:flex;align-items:center;gap:.7rem;opacity:.65}
.foot-credit span{font-size:.72rem;letter-spacing:.04em}
.foot-credit img{width:118px}

/* WhatsApp flotante */
.wa{
  position:fixed;right:20px;bottom:20px;z-index:70;width:56px;height:56px;border-radius:50%;
  background:#25D366;display:flex;align-items:center;justify-content:center;
  box-shadow:0 10px 26px -8px rgba(37,211,102,.7);transition:transform .2s ease
}
.wa:hover{transform:scale(1.06)}
.wa svg{width:29px;height:29px;fill:#fff}

/* Aviso legal en línea */
.legal{font-size:.95rem}
.legal h2{margin:2.4rem 0 1rem;font-size:1.5rem}
.legal h3{margin:1.8rem 0 .7rem;font-size:1.12rem}
.legal ul{margin:1rem 0;display:grid;gap:.5rem}
.legal li{position:relative;padding-left:1.35rem}
.legal li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--accent)}

/* Animación de entrada */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
}

/* Responsivo */
@media (max-width:1000px){
  .trust ul{grid-template-columns:1fr 1fr}
  .trust li:nth-child(2){border-right:0}
  .trust li:nth-child(1),.trust li:nth-child(2){border-bottom:1px solid var(--line)}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  body{font-size:16px}
  .nav{
    position:fixed;inset:78px 0 auto;flex-direction:column;align-items:stretch;gap:0;
    background:var(--paper);border-bottom:1px solid var(--line);padding:.5rem 1.25rem 1.25rem;
    box-shadow:var(--shadow);display:none
  }
  .nav.open{display:flex}
  .nav a{padding:.95rem 0;border-bottom:1px solid var(--line)}
  .nav a:hover,.nav a[aria-current="page"]{border-bottom-color:var(--line);color:var(--accent)}
  .nav a.nav-entrar{justify-content:center;margin-top:.9rem;padding:.8rem 1rem;
    border-bottom:1px solid var(--line-strong,#d8d2c8);font-size:.92rem}
  .nav-redes{margin:1.1rem 0 .2rem;gap:.6rem;flex-wrap:wrap}
  .nav a.nav-red{
    width:auto;height:auto;gap:.55rem;padding:.65rem 1.05rem;border-radius:999px;
    border:1px solid var(--line);border-bottom-color:var(--line);
    font-size:.9rem;font-weight:500;color:var(--ink-soft)
  }
  .nav-red-txt{position:static;width:auto;height:auto;clip-path:none}
  .nav-toggle{display:flex;order:3}
  .head-cta .btn{padding:.62rem 1.05rem;font-size:.8rem;white-space:nowrap}
  .hero-grid{grid-template-columns:1fr;padding-block:2.5rem 3.5rem}
  .hero-media{order:-1}
  .hero-media img{aspect-ratio:1/1}
  .hero-media::after{display:none}
  .hero-badge{left:auto;right:14px;bottom:14px;max-width:190px;padding:.85rem 1rem}
  .paths{grid-template-columns:1fr}
  .split,.contact-grid{grid-template-columns:1fr}
  .split--flip .split-media{order:0}
  .split-media img{aspect-ratio:4/3}
  /* El retrato se queda cuadrado en movil: en 4/3 el recorte le come la cabeza */
  .split-media--retrato img{aspect-ratio:1/1}
}
@media (max-width:560px){
  .trust ul{grid-template-columns:1fr}
  .trust li{border-right:0;border-bottom:1px solid var(--line);padding:1.5rem 0}
  .trust li:last-child{border-bottom:0}
  .foot-grid{grid-template-columns:1fr}
  .btn{width:100%}
  .head-cta .btn{width:auto}
  .foot-bottom{flex-direction:column;align-items:flex-start}
}

/* Marcador de dato pendiente (solo en borrador) */
.ph{background:#FFF3C4;box-shadow:0 0 0 2px #FFF3C4;border-radius:3px;color:#7A5B00}
.bg-ink .ph,.site-foot .ph,.cta-band .ph{background:#4A431F;box-shadow:0 0 0 2px #4A431F;color:#FFE9A8}

/* Precios */
.precios{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,2.5vw,1.8rem)}
.precio{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(1.8rem,3.2vw,2.4rem);display:flex;flex-direction:column;text-align:left
}
.precio--destacado{border-color:var(--accent);box-shadow:var(--shadow)}
.precio h3{font-size:1.22rem;margin-bottom:1rem}
.precio .monto{font-family:var(--serif);font-size:clamp(2.4rem,4.5vw,3rem);color:var(--ink);line-height:1}
.precio .monto span{font-family:var(--sans);font-size:.9rem;font-weight:600;color:var(--ink-mute);margin-left:.35rem;letter-spacing:.04em}
.precio .dur{font-size:.88rem;color:var(--ink-mute);margin-top:.5rem}
.precio ul{margin:1.5rem 0 1.9rem;display:grid;gap:.55rem}
.precio li{position:relative;padding-left:1.5rem;font-size:.93rem}
.precio li::before{
  content:"";position:absolute;left:0;top:.42em;width:11px;height:6px;
  border-left:1.8px solid var(--accent);border-bottom:1.8px solid var(--accent);transform:rotate(-45deg)
}
.precio .btn{margin-top:auto;width:100%}
.nota-precio{margin-top:2rem;text-align:center;font-size:.92rem;color:var(--ink-mute)}
.nota-precio a{color:var(--accent);text-decoration:none;border-bottom:1px solid currentColor}
@media (max-width:860px){.precios{grid-template-columns:1fr}}

/* Agendar */
.paso{border-left:3px solid var(--accent);padding-left:1.6rem}
.paso-num{
  display:block;font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  color:var(--accent);margin-bottom:.7rem
}
.paso h2{margin-bottom:.9rem}
.paso p{max-width:46rem}
.cal-wrap{
  margin-top:2.4rem;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);overflow:hidden
}
.cal-falta{padding:clamp(2.5rem,6vw,4rem);text-align:center}
.cal-falta p{max-width:34rem;margin-inline:auto}
.cal-falta p+p{margin-top:1rem;font-size:.93rem;color:var(--ink-mute)}

/* Encabezado en pantallas angostas: la marca no se parte */
@media (max-width:430px){
  .site-head .brand strong{font-size:1.08rem;white-space:nowrap}
  .site-head .brand span{display:none}
  .site-head .bar{gap:.8rem;min-height:68px}
  .head-cta{gap:.5rem}
  .head-cta .btn{padding:.58rem .95rem;font-size:.78rem}
  .nav-toggle{width:40px;height:40px}
  .nav{inset:68px 0 auto}
}

/* Logotipo en encabezado y pie */
.site-head .brand{display:block;margin-right:auto}
.site-head .brand img{width:232px;max-width:52vw}
.foot-logo{width:210px;margin-bottom:1.2rem}
@media (max-width:430px){
  .site-head .brand img{width:170px}
}

/* Párrafos justificados con partición de palabra, para que no se abran ríos */
.hero-copy p,
.split-copy p,
.sec-head:not(.center) p,
.legal p,
.faq .answer,
.step p,
.paso p,
.path .body > p,
.card > p,
.site-foot .foot-grid > div > p,
main .wrap--narrow > .reveal > p{
  text-align:justify;
  text-justify:inter-word;
  hyphens:auto;
  -webkit-hyphens:auto;
}
/* La última línea de un párrafo justificado nunca se estira */
.quote p{text-align:left}

/* Recuadro del dato en el hero: más discreto en móvil */
@media (max-width:560px){
  .hero-badge{max-width:158px;padding:.7rem .85rem;right:12px;bottom:12px}
  .hero-badge strong{font-size:1.32rem}
  .hero-badge span{font-size:.72rem;line-height:1.35}
}

/* Justificado: solo por encima de los 560 px.
   En una columna más angosta caben tan pocas palabras que la justificación abre
   huecos enormes entre ellas. Para forzarla también en teléfono, borrar este bloque. */
@media (max-width:560px){
  .hero-copy p,
  .split-copy p,
  .sec-head:not(.center) p,
  .legal p,
  .faq .answer,
  .step p,
  .paso p,
  .path .body > p,
  .card > p,
  .site-foot .foot-grid > div > p,
  main .wrap--narrow > .reveal > p{
    text-align:left;
  }
}

/* Pie: cuatro columnas, marca con datos y tres menús */
.foot-grid{grid-template-columns:1.6fr 1fr 1fr 1fr}
.foot-datos{margin-top:1.4rem;display:grid;gap:.5rem;font-size:.86rem;line-height:1.5}
.foot-datos li{color:#9E9EA3}
@media (max-width:1000px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid > div:first-child{grid-column:1 / -1}
}
@media (max-width:560px){
  .foot-grid{grid-template-columns:1fr}
  .foot-grid > div:first-child{grid-column:auto}
  .foot-bottom{flex-direction:column;align-items:flex-start;gap:1.2rem}
  /* En pantalla tactil el icono tiene que medir los 44 px del dedo. */
  .foot-redes{margin-right:0;gap:.35rem;margin-left:-.5rem}
  .foot-redes a{width:44px;height:44px}
}

/* Botón de WhatsApp con ondas */
.wa::before,.wa::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:#25D366;opacity:.55;z-index:-1;
  animation:wa-onda 2.6s cubic-bezier(.22,.61,.36,1) infinite
}
.wa::after{animation-delay:1.3s}
@keyframes wa-onda{
  0%{transform:scale(1);opacity:.5}
  70%{transform:scale(1.85);opacity:0}
  100%{transform:scale(1.85);opacity:0}
}
.wa{isolation:isolate}
@media (prefers-reduced-motion:reduce){
  .wa::before,.wa::after{animation:none;opacity:0}
}

/* A quién atiendo */
.publicos{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.6rem,3.5vw,3rem)}
.publicos h4{
  font-family:var(--sans);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin-bottom:1.1rem
}
.chips{display:flex;flex-wrap:wrap;gap:.55rem}
.chips li{
  background:var(--paper);border:1px solid var(--line);border-radius:999px;
  padding:.5rem 1rem;font-size:.88rem;line-height:1.3;color:var(--ink-soft)
}
@media (max-width:700px){.publicos{grid-template-columns:1fr}}

/* Cotizador por pasos */
.cotizador{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.6rem,4vw,2.8rem)}
.pasos-barra{margin-bottom:2.2rem}
.pasos-linea{height:4px;background:var(--cream-deep);border-radius:99px;overflow:hidden}
.pasos-linea span{display:block;height:100%;width:20%;background:var(--accent);border-radius:99px;transition:width .35s ease}
.pasos-texto{margin-top:.7rem;font-size:.82rem;color:var(--ink-mute)}
.pasos-texto b{color:var(--ink)}
.paso-form{border:0;padding:0;margin:0;display:none}
.paso-form.activo{display:block;animation:paso-entra .3s ease}
@keyframes paso-entra{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.paso-form legend{
  font-family:var(--serif);font-size:clamp(1.4rem,2.6vw,1.9rem);color:var(--ink);
  font-weight:600;padding:0;margin-bottom:.7rem;line-height:1.2
}
.paso-form .ayuda{font-size:.9rem;color:var(--ink-mute);margin-bottom:1.6rem;line-height:1.55}
.paso-form .field .ayuda{margin:.6rem 0 0}
.campo2{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.opts{display:flex;flex-wrap:wrap;gap:.6rem}
.opts--grande{flex-direction:column;gap:.75rem}
.opt{position:relative;cursor:pointer}
.opt input{position:absolute;opacity:0;width:0;height:0}
.opt > span{
  display:block;border:1px solid var(--line);border-radius:12px;padding:.7rem 1.15rem;
  font-size:.92rem;color:var(--ink-soft);background:var(--cream);transition:all .18s ease;line-height:1.4
}
.opts--grande .opt > span{padding:1.05rem 1.35rem}
.opt > span b{display:block;font-size:1rem;color:var(--ink);margin-bottom:.2rem;font-weight:600}
.opt:hover > span{border-color:var(--accent)}
.opt input:checked + span{border-color:var(--accent);background:var(--paper);box-shadow:inset 0 0 0 1px var(--accent);color:var(--ink)}
.opt input:focus-visible + span{outline:2px solid var(--accent);outline-offset:2px}
.cotizador-nav{display:flex;gap:.8rem;justify-content:space-between;margin-top:2.4rem;padding-top:1.8rem;border-top:1px solid var(--line)}
.cotizador-nav .btn{min-width:150px}
.resumen{display:grid;gap:.6rem;margin-bottom:1.8rem}
.resumen div{display:flex;gap:1rem;justify-content:space-between;padding:.7rem 0;border-bottom:1px dashed var(--line);font-size:.93rem}
.resumen dt{color:var(--ink-mute);flex:none}
.resumen dd{margin:0;color:var(--ink);text-align:right;font-weight:500}
@media (max-width:700px){
  .campo2{grid-template-columns:1fr}
  .cotizador-nav{flex-direction:column-reverse}
  .cotizador-nav .btn{width:100%}
}

/* `hidden` lo pisa el display de .btn: hay que declararlo explícito */
.btn[hidden],.cotizador-nav[hidden]{display:none}

/* Fondo de marca: el imagotipo repetido, muy tenue */
.bg-cream{
  background-color:var(--cream-deep);
  background-image:url("../img/patron-marca.png");
  background-repeat:repeat;
  background-size:300px 300px;
}
.bg-cream > *{position:relative}

/* Etiquetas de "A quién atiendo": ahora son enlaces a WhatsApp */
.ayuda-chips{font-size:.9rem;color:var(--ink-mute);margin-top:.9rem}
.chips li{padding:0;background:none;border:0}
.chips li a{
  display:inline-flex;align-items:center;gap:.5rem;
  background:var(--paper);border:1px solid var(--line);border-radius:999px;
  padding:.5rem .85rem .5rem 1rem;font-size:.88rem;line-height:1.3;color:var(--ink-soft);
  text-decoration:none;transition:border-color .18s ease,color .18s ease,background .18s ease,transform .18s ease
}
.chips li a:hover,.chips li a:focus-visible{
  border-color:#25D366;color:var(--ink);background:#F3FDF6;transform:translateY(-1px)
}
.chips li a:focus-visible{outline:2px solid #25D366;outline-offset:2px}
.chip-wa{width:15px;height:15px;flex:none;fill:#25D366;opacity:.75}
.chips li a:hover .chip-wa{opacity:1}

/* Barra inferior de navegación (solo teléfono) */
.barra-movil{display:none}
@media (max-width:860px){
  .barra-movil{
    display:grid;grid-template-columns:repeat(5,1fr);
    position:fixed;left:0;right:0;bottom:0;z-index:80;
    background:rgba(255,255,255,.96);backdrop-filter:saturate(180%) blur(14px);
    border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -6px 22px -14px rgba(35,35,38,.4)
  }
  .barra-movil a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.22rem;
    padding:.6rem .2rem .55rem;text-decoration:none;color:var(--ink-mute);
    font-size:.64rem;letter-spacing:.02em;line-height:1.1;text-align:center;
    transition:color .18s ease;position:relative
  }
  .barra-movil a .ico,.barra-movil a svg{width:21px;height:21px;flex:none}
  .barra-movil a[aria-current="page"]{color:var(--accent)}
  .barra-movil a[aria-current="page"]::before{
    content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
    width:26px;height:3px;border-radius:0 0 3px 3px;background:var(--accent)
  }
  .barra-movil a:active{color:var(--ink)}
  .barra-movil .bm-wa{color:#1FA855}
  .barra-movil .bm-wa svg{fill:#25D366}
  /* el flotante estorbaría sobre la barra */
  .wa{display:none}
  /* que la barra no tape el final del contenido */
  body{padding-bottom:74px}
  .site-foot .wrap{padding-bottom:calc(clamp(3rem,6vw,4.5rem) + 8px)}
}

/* Páginas de ciudad y de estado */
.hero--corto{padding-block:clamp(2.6rem,6vw,4.4rem) clamp(2rem,4vw,3rem)}
.hero--corto .hero-txt{max-width:56rem}
/* El h1 del hero no trae margen inferior propio: en la portada lo separa el
   retrato, y aqui no hay retrato. */
.hero--corto h1{margin-bottom:1.1rem}
.hero--corto .lead{margin-bottom:1.1rem}
.hero--corto .btn-row{margin-top:1.9rem}
/* La seccion que sigue al hero corto no necesita su padding completo: con el
   del hero ya suman demasiado y se lee como un hueco. */
.hero--corto + section{padding-top:clamp(2.4rem,5vw,3.6rem)}
.lead-suave{font-size:1.06rem;line-height:1.75;color:var(--ink-soft)}

.datos-lugar{list-style:none;margin:0 0 1.8rem;padding:0;display:grid;gap:1rem;
  grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.datos-lugar li{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:1.3rem 1.4rem}
.datos-lugar strong{display:block;font-family:var(--serif);font-size:1.32rem;line-height:1.25;
  color:var(--ink);margin-bottom:.45rem;font-weight:600}
.datos-lugar span{display:block;font-size:.93rem;line-height:1.6;color:var(--ink-soft)}
.bg-paper .datos-lugar li{background:var(--cream)}

.aviso-legal{background:var(--cream);border-left:4px solid var(--rojo);border-radius:0 14px 14px 0;
  padding:1.6rem 1.7rem}
.aviso-legal h2{margin-top:0}
.aviso-legal p{color:var(--ink-soft);line-height:1.7}
.aviso-legal p:last-child{margin-bottom:0}

/* Rejilla del índice de cobertura */
.lista-lugares{list-style:none;margin:0;padding:0;display:grid;gap:.7rem;
  grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}
.lista-lugares a{display:block;background:var(--paper);border:1px solid var(--line);border-radius:12px;
  padding:.95rem 1.1rem;text-decoration:none;transition:border-color .18s,transform .18s}
.lista-lugares a:hover{border-color:var(--rojo);transform:translateY(-2px)}
.lista-lugares strong{display:block;color:var(--ink);font-weight:600;font-size:1rem;margin-bottom:.15rem}
.lista-lugares span{display:block;color:var(--ink-mute);font-size:.85rem;line-height:1.4}
.bg-cream .lista-lugares a{background:var(--paper)}

/* Enlaces a otros lugares, en línea */
.enlaces-lugares{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.9rem}
.enlaces-lugares a{display:inline-block;background:var(--paper);border:1px solid var(--line);
  border-radius:999px;padding:.4rem .95rem;font-size:.9rem;color:var(--ink-soft);text-decoration:none;
  transition:border-color .18s,color .18s}
.enlaces-lugares a:hover{border-color:var(--rojo);color:var(--rojo)}
.bg-paper .enlaces-lugares a{background:var(--cream)}
.enlace-mas{display:inline-block;margin-top:1.1rem;font-weight:600;color:var(--cta,var(--rojo))}

@media (max-width:640px){
  .datos-lugar{grid-template-columns:1fr}
  .lista-lugares{grid-template-columns:1fr 1fr}
  .lista-lugares a{padding:.8rem .9rem}
  .lista-lugares span{font-size:.8rem}
}

/* Planes */
.planes-familia{margin-bottom:54px}
.planes-familia:last-of-type{margin-bottom:0}
.planes-titulo{font-family:var(--serif);font-size:clamp(25px,3vw,32px);margin:0 0 6px;color:var(--ink)}
.planes-titulo+.planes-rejilla{margin-top:22px}
.planes-rejilla{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(288px,1fr))}
.plan{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
  border-radius:var(--r);padding:28px 26px 26px}
.plan h3{font-family:var(--serif);font-size:21px;line-height:1.28;margin:0 0 8px;color:var(--ink)}
.plan-gancho{font-size:14.5px;line-height:1.55;color:var(--ink-soft);margin:0 0 18px}
.plan-precio{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:7px;
  padding-top:16px;border-top:1px solid var(--line)}
.plan-precio strong{font-family:var(--serif);font-size:33px;line-height:1;color:var(--ink)}
.plan-desde{font-size:13.5px;color:var(--ink-soft)}
.plan-unidad{font-size:14.5px;color:var(--ink-soft)}
.plan-iva{font-size:13px;color:var(--ink-soft);margin:7px 0 0}
.plan-incluye{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:9px}
.plan-incluye li{position:relative;padding-left:23px;font-size:14.5px;line-height:1.5;color:var(--ink-soft)}
.plan-incluye li::before{content:"";position:absolute;left:0;top:7px;width:11px;height:6px;
  border-left:2px solid var(--verde);border-bottom:2px solid var(--verde);transform:rotate(-45deg)}
.plan-garantia{margin:18px 0 0;padding:11px 13px;border-radius:9px;background:#F1F8F1;
  border:1px solid #D6E9D6;color:#2C5F33;font-size:13.5px;line-height:1.5}
.plan-leyenda{margin:12px 0 0;font-size:13.4px;line-height:1.5;color:var(--ink-soft)}
.plan-pie{margin-top:auto;padding-top:22px}
.planes-nota{margin:44px auto 0;max-width:74ch;text-align:center;font-size:14px;
  line-height:1.6;color:var(--ink-soft)}

@media (max-width:640px){
  .planes-rejilla{grid-template-columns:1fr}
  .plan{padding:24px 20px}
  .plan-precio strong{font-size:29px}
}