/* =========================================================
   Ana Pastor · Psicóloga — Hoja de estilos principal
   Paleta cálida y cercana, tipografía humanista, mobile-first
   ========================================================= */

:root{
  /* Paleta */
  --verde-profundo:#4b6358;
  --verde-medio:#6f8b7c;
  --verde-suave:#a9c0b1;
  --verde-fondo:#eef3ee;
  --terracota:#c97d5d;
  --terracota-oscuro:#a8613f;
  --crema:#faf7f2;
  --crema-oscuro:#f1ebe1;
  --tinta:#2c332e;
  --tinta-suave:#5c665f;
  --blanco:#ffffff;
  --borde:#e2ddd0;

  /* Tipografía */
  --font-titulares:"Fraunces", Georgia, "Times New Roman", serif;
  --font-cuerpo:"Mulish", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-logo:"Playfair Display", Georgia, serif;

  /* Espaciado */
  --radio:14px;
  --radio-sm:8px;
  --sombra: 0 10px 30px -12px rgba(44,51,46,0.18);
  --sombra-sm: 0 4px 14px -6px rgba(44,51,46,0.15);
  --contenedor: 1140px;
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }

body{
  margin:0;
  font-family:var(--font-cuerpo);
  color:var(--tinta);
  background:var(--crema);
  line-height:1.65;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; display:block; }

h1,h2,h3,h4{
  font-family:var(--font-titulares);
  color:var(--verde-profundo);
  line-height:1.2;
  margin:0 0 .6em;
  font-weight:600;
}
h1{ font-size:clamp(2.1rem, 4.5vw, 3.4rem); }
h2{ font-size:clamp(1.6rem, 3.2vw, 2.3rem); }
h3{ font-size:clamp(1.2rem, 2.2vw, 1.45rem); }

p{ margin:0 0 1.1em; color:var(--tinta-suave); }

a{ color:var(--terracota-oscuro); text-decoration:none; }
a:hover{ text-decoration:underline; }

.contenedor{
  max-width:var(--contenedor);
  margin:0 auto;
  padding:0 24px;
}

.visually-hidden{
  position:absolute !important;
  width:1px;height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
}

.skip-link{
  position:absolute;
  left:-999px;
  top:0;
  background:var(--verde-profundo);
  color:#fff;
  padding:10px 18px;
  border-radius:0 0 8px 0;
  z-index:1000;
}
.skip-link:focus{ left:0; }

/* ---------- Botones ---------- */
.boton{
  display:inline-flex;
  align-items:center;
  gap:.5em;
  padding:14px 30px;
  border-radius:999px;
  font-family:var(--font-cuerpo);
  font-weight:700;
  font-size:.98rem;
  letter-spacing:.02em;
  border:2px solid transparent;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, background .2s ease, color .2s ease;
  text-decoration:none;
}
.boton:hover{ transform:translateY(-2px); text-decoration:none; }

.boton-primario{
  background:var(--terracota);
  color:#fff;
  box-shadow:var(--sombra-sm);
}
.boton-primario:hover{ background:var(--terracota-oscuro); color:#fff; }

.boton-secundario{
  background:transparent;
  color:var(--verde-profundo);
  border-color:var(--verde-profundo);
}
.boton-secundario:hover{ background:var(--verde-profundo); color:#fff; }

.boton-claro{
  background:#fff;
  color:var(--verde-profundo);
}
.boton-claro:hover{ background:var(--verde-fondo); color:var(--verde-profundo); }

/* ---------- Header ---------- */
.cabecera{
  position:sticky;
  top:0;
  z-index:500;
  background:rgba(250,247,242,.92);
  backdrop-filter:saturate(160%) blur(10px);
  border-bottom:1px solid var(--borde);
}
.cabecera .contenedor{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding-top:14px;
  padding-bottom:14px;
  gap:20px;
}

.logo{
  display:flex;
  flex-direction:column;
  line-height:1;
  color:var(--verde-profundo);
}
.logo:hover{ text-decoration:none; }
.logo .logo-nombre{
  font-family:var(--font-logo);
  font-style:italic;
  font-weight:600;
  font-size:1.9rem;
  color:var(--verde-profundo);
}
.logo .logo-sub{
  margin-top:4px;
  font-size:.62rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--tinta-suave);
  font-family:var(--font-cuerpo);
  font-weight:700;
}

.nav-principal{ display:flex; align-items:center; }
.nav-principal ul{
  display:flex;
  gap:28px;
  list-style:none;
  margin:0;
  padding:0;
}
.nav-principal a{
  color:var(--tinta);
  font-weight:600;
  font-size:.96rem;
  padding:6px 2px;
  position:relative;
}
.nav-principal a:hover{ color:var(--verde-profundo); text-decoration:none; }
.nav-principal a::after{
  content:"";
  position:absolute;
  left:0; bottom:-4px;
  width:0; height:2px;
  background:var(--terracota);
  transition:width .2s ease;
}
.nav-principal a:hover::after,
.nav-principal a[aria-current="page"]::after{ width:100%; }
.nav-principal a[aria-current="page"]{ color:var(--terracota-oscuro); }

.nav-cta{ margin-left:8px; }

.nav-toggle{
  display:none;
  background:none;
  border:none;
  cursor:pointer;
  padding:8px;
  color:var(--verde-profundo);
}
.nav-toggle svg{ width:28px; height:28px; }

@media (max-width: 900px){
  .nav-toggle{ display:inline-flex; }
  .nav-principal{
    position:fixed;
    inset:0 0 0 auto;
    width:min(80vw, 340px);
    height:100vh;
    background:var(--crema);
    transform:translateX(100%);
    transition:transform .28s ease;
    box-shadow:-12px 0 30px rgba(0,0,0,.12);
    padding:100px 30px 40px;
  }
  .nav-principal.abierto{ transform:translateX(0); }
  .nav-principal ul{
    flex-direction:column;
    gap:22px;
  }
  .nav-principal .nav-cta{ margin-left:0; margin-top:10px; }
  .nav-overlay{
    display:none;
    position:fixed; inset:0;
    background:rgba(44,51,46,.35);
    z-index:400;
  }
  .nav-overlay.abierto{ display:block; }
}

/* ---------- Hero ---------- */
.hero{
  padding:70px 0 90px;
  background:
    radial-gradient(circle at 85% 0%, var(--verde-fondo) 0%, transparent 55%),
    var(--crema);
  overflow:hidden;
}
.hero .contenedor{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:56px;
  align-items:center;
}
.hero-eyebrow{
  display:inline-block;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.78rem;
  color:var(--terracota-oscuro);
  background:#fbe9e0;
  padding:6px 14px;
  border-radius:999px;
  margin-bottom:18px;
}
.hero h1{ margin-bottom:.35em; }
.hero .subrayo{
  font-family:var(--font-logo);
  font-style:italic;
  color:var(--terracota);
}
.hero-lead{
  font-size:1.12rem;
  max-width:46ch;
}
.hero-cta{ display:flex; gap:16px; flex-wrap:wrap; margin-top:8px; }
.hero-firma{
  margin-top:34px;
  display:flex;
  align-items:center;
  gap:14px;
}
.hero-firma .firma-nombre{
  font-family:var(--font-logo);
  font-style:italic;
  font-size:1.5rem;
  color:var(--verde-profundo);
}
.hero-firma small{ color:var(--tinta-suave); display:block; font-size:.8rem; }

@media (max-width: 860px){
  .hero .contenedor{ grid-template-columns:1fr; }
  .hero{ padding:44px 0 60px; text-align:left; }
}

/* ---------- Placeholder de imagen (para sustituir por fotos reales) ---------- */
.img-placeholder{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  border-radius:var(--radio);
  border:2px dashed var(--verde-suave);
  background:
    repeating-linear-gradient(135deg, var(--verde-fondo), var(--verde-fondo) 10px, #f5f8f5 10px, #f5f8f5 20px);
  color:var(--verde-medio);
  min-height:260px;
  padding:24px;
  overflow:hidden;
}
.img-placeholder .ph-contenido{
  background:rgba(255,255,255,.88);
  border-radius:var(--radio-sm);
  padding:16px 20px;
  max-width:280px;
}
.img-placeholder svg{ width:34px; height:34px; margin:0 auto 10px; color:var(--verde-medio); }
.img-placeholder strong{ display:block; color:var(--verde-profundo); font-size:.92rem; margin-bottom:4px; }
.img-placeholder span{ font-size:.78rem; color:var(--tinta-suave); word-break:break-word; }

.hero-media{ position:relative; }
.hero-media .img-placeholder{ aspect-ratio:4/5; min-height:auto; border-radius:24px; box-shadow:var(--sombra); }
.hero-media::before{
  content:"";
  position:absolute;
  inset:18px -18px -18px 18px;
  background:var(--verde-suave);
  border-radius:24px;
  z-index:-1;
  opacity:.55;
}
.hero-media img{
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
  border-radius:24px;
  box-shadow:var(--sombra);
}

/* ---------- Fotografías reales (fichas cuadradas y de página) ---------- */
.franja-fotos{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
  margin-top:44px;
}
.foto-tarjeta{
  position:relative;
  border-radius:var(--radio);
  overflow:hidden;
  box-shadow:var(--sombra-sm);
  aspect-ratio:1/1;
}
.foto-tarjeta img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.foto-tarjeta:hover img{ transform:scale(1.05); }
.foto-tarjeta figcaption{
  position:absolute; left:0; right:0; bottom:0;
  background:linear-gradient(0deg, rgba(44,51,46,.78), transparent);
  color:#fff;
  padding:16px 18px 14px;
  font-weight:700;
  font-size:.95rem;
}
@media (max-width:760px){
  .franja-fotos{ grid-template-columns:1fr; }
}

.foto-pagina{
  border-radius:var(--radio);
  overflow:hidden;
  box-shadow:var(--sombra);
}
.foto-pagina img{ width:100%; height:100%; object-fit:cover; display:block; }

.foto-nota{
  font-size:.78rem;
  color:var(--tinta-suave);
  margin-top:8px;
  text-align:center;
}

/* ---------- Página Conóceme ---------- */
.conoceme-grid{
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:52px;
  align-items:start;
}
@media (max-width:900px){ .conoceme-grid{ grid-template-columns:1fr; } }
.conoceme-media{ position:sticky; top:110px; }
.conoceme-media .img-placeholder{ aspect-ratio:3/4; min-height:auto; border-radius:22px; margin-bottom:20px; }
.conoceme-media .foto-pagina{ aspect-ratio:4/5; margin-top:0; }
.credencial{
  background:#fff;
  border:1px solid var(--borde);
  border-radius:var(--radio);
  padding:20px 22px;
  box-shadow:var(--sombra-sm);
  margin-top:20px;
}
.credencial dl{ margin:0; display:grid; gap:10px; }
.credencial dt{ font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--terracota-oscuro); font-weight:700; }
.credencial dd{ margin:0 0 0; color:var(--tinta); font-weight:600; font-size:.92rem; }

/* ---------- Secciones generales ---------- */
.seccion{ padding:80px 0; }
.seccion + .seccion{ padding-top:0; }
.seccion-cabecera{ max-width:680px; margin:0 auto 48px; text-align:center; }
.seccion-cabecera.izq{ margin-left:0; text-align:left; }
.eyebrow{
  display:block;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-size:.76rem;
  color:var(--terracota-oscuro);
  margin-bottom:12px;
}

.fondo-suave{ background:var(--verde-fondo); }
.fondo-crema{ background:var(--crema-oscuro); }

/* ---------- Tarjetas de contenido ---------- */
.grid{ display:grid; gap:28px; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:920px){
  .grid-3, .grid-4{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:640px){
  .grid-2, .grid-3, .grid-4{ grid-template-columns:1fr; }
}

.tarjeta{
  background:#fff;
  border:1px solid var(--borde);
  border-radius:var(--radio);
  padding:30px 26px;
  box-shadow:var(--sombra-sm);
  transition:transform .2s ease, box-shadow .2s ease;
}
.tarjeta:hover{ transform:translateY(-4px); box-shadow:var(--sombra); }
.tarjeta .icono{
  width:52px; height:52px;
  border-radius:14px;
  background:var(--verde-fondo);
  color:var(--verde-profundo);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px;
}
.tarjeta .icono svg{ width:26px; height:26px; }
.tarjeta h3{ margin-bottom:.4em; }
.tarjeta ul{ margin:.6em 0 0; padding-left:1.1em; color:var(--tinta-suave); }
.tarjeta ul li{ margin-bottom:.3em; }
.tarjeta p:last-child{ margin-bottom:0; }

/* ---------- Timeline (Cómo trabajo) ---------- */
.timeline{ position:relative; margin-top:20px; }
.timeline::before{
  content:"";
  position:absolute;
  left:27px; top:10px; bottom:10px;
  width:2px;
  background:var(--verde-suave);
}
.paso{
  position:relative;
  display:grid;
  grid-template-columns:56px 1fr;
  gap:24px;
  padding-bottom:44px;
}
.paso:last-child{ padding-bottom:0; }
.paso-num{
  width:56px; height:56px;
  border-radius:50%;
  background:var(--verde-profundo);
  color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-titulares);
  font-size:1.3rem;
  z-index:1;
  box-shadow:0 0 0 6px var(--crema);
}
.paso-cuerpo{ background:#fff; border:1px solid var(--borde); border-radius:var(--radio); padding:22px 24px; box-shadow:var(--sombra-sm); }
.paso-cuerpo h3{ margin-bottom:.35em; }
.paso-cuerpo p:last-child{ margin-bottom:0; }

@media (max-width:600px){
  .timeline::before{ left:23px; }
  .paso{ grid-template-columns:48px 1fr; gap:16px; }
  .paso-num{ width:48px; height:48px; font-size:1.1rem; }
}

/* ---------- Frases / citas destacadas ---------- */
.cita{
  font-family:var(--font-titulares);
  font-style:italic;
  font-size:clamp(1.3rem, 2.6vw, 1.7rem);
  color:var(--verde-profundo);
  text-align:center;
  max-width:820px;
  margin:0 auto;
  line-height:1.45;
}
.cita cite{
  display:block;
  font-family:var(--font-cuerpo);
  font-style:normal;
  font-weight:700;
  font-size:.9rem;
  color:var(--tinta-suave);
  margin-top:14px;
  letter-spacing:.04em;
}

.franja-destacado{
  background:var(--verde-profundo);
  color:#fff;
  padding:60px 0;
}
.franja-destacado .cita{ color:#fff; }
.franja-destacado .cita cite{ color:var(--verde-suave); }

.lema-lista{
  list-style:none;
  margin:0; padding:0;
  display:grid;
  gap:16px;
  max-width:760px;
  margin:40px auto 0;
}
.lema-lista li{
  background:#fff;
  border-left:4px solid var(--terracota);
  padding:16px 20px;
  border-radius:0 var(--radio-sm) var(--radio-sm) 0;
  font-weight:700;
  color:var(--verde-profundo);
  box-shadow:var(--sombra-sm);
}

/* ---------- Testimonios ---------- */
.testimonio{
  background:#fff;
  border-radius:var(--radio);
  padding:30px 26px;
  border:1px solid var(--borde);
  box-shadow:var(--sombra-sm);
  position:relative;
}
.testimonio .comillas{ font-family:var(--font-titulares); font-size:3rem; color:var(--verde-suave); line-height:1; margin-bottom:6px; }
.testimonio p{ font-style:italic; color:var(--tinta); }
.testimonio .autor{ display:flex; align-items:center; gap:12px; margin-top:16px; }
.testimonio .avatar{
  width:44px; height:44px; border-radius:50%;
  background:var(--verde-fondo); color:var(--verde-profundo);
  display:flex; align-items:center; justify-content:center;
  font-weight:700; font-family:var(--font-titulares);
  flex-shrink:0;
}
.testimonio .autor strong{ display:block; font-size:.92rem; color:var(--verde-profundo); }
.testimonio .autor span{ font-size:.8rem; color:var(--tinta-suave); }
.estrellas{ color:var(--terracota); letter-spacing:2px; font-size:.95rem; margin-bottom:8px; }

.aviso-editorial{
  border:1px dashed var(--verde-suave);
  background:var(--verde-fondo);
  color:var(--verde-profundo);
  border-radius:var(--radio-sm);
  padding:16px 20px;
  font-size:.92rem;
  margin-bottom:40px;
}
.aviso-editorial strong{ display:block; margin-bottom:4px; }

/* ---------- Especialidades ---------- */
.especialidad-tag{
  display:inline-block;
  background:var(--verde-fondo);
  color:var(--verde-profundo);
  font-size:.78rem;
  font-weight:700;
  padding:4px 12px;
  border-radius:999px;
  margin:0 6px 6px 0;
}

/* ---------- CTA final ---------- */
.cta-final{
  background:linear-gradient(135deg, var(--verde-profundo), #3b5147);
  color:#fff;
  border-radius:28px;
  padding:60px 48px;
  text-align:center;
  margin:0 auto;
}
.cta-final h2{ color:#fff; }
.cta-final p{ color:var(--verde-suave); max-width:56ch; margin-left:auto; margin-right:auto; }
.cta-final .hero-cta{ justify-content:center; margin-top:24px; }

@media (max-width:640px){
  .cta-final{ padding:44px 24px; }
}

/* ---------- Contacto ---------- */
.contacto-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:44px;
  align-items:start;
}
@media (max-width:900px){ .contacto-grid{ grid-template-columns:1fr; } }

.contacto-datos{
  background:#fff;
  border:1px solid var(--borde);
  border-radius:var(--radio);
  padding:32px 28px;
  box-shadow:var(--sombra-sm);
}
.contacto-item{
  display:flex;
  gap:16px;
  align-items:flex-start;
  margin-bottom:22px;
}
.contacto-item:last-child{ margin-bottom:0; }
.contacto-item .icono{
  width:44px; height:44px; flex-shrink:0;
  border-radius:12px;
  background:var(--verde-fondo);
  color:var(--verde-profundo);
  display:flex; align-items:center; justify-content:center;
}
.contacto-item .icono svg{ width:22px; height:22px; }
.contacto-item h3{ font-size:1rem; margin-bottom:.2em; }
.contacto-item p{ margin:0; }
.contacto-item a{ color:var(--tinta); font-weight:600; }

.mapa-embed{
  border-radius:var(--radio);
  overflow:hidden;
  border:1px solid var(--borde);
  margin-top:24px;
}
.mapa-embed iframe{ width:100%; height:260px; border:0; display:block; }

.formulario{
  background:#fff;
  border:1px solid var(--borde);
  border-radius:var(--radio);
  padding:34px 30px;
  box-shadow:var(--sombra-sm);
}
.campo{ margin-bottom:20px; }
.campo label{
  display:block;
  font-weight:700;
  font-size:.9rem;
  color:var(--verde-profundo);
  margin-bottom:6px;
}
.campo .opcional{ font-weight:400; color:var(--tinta-suave); }
.campo input,
.campo textarea{
  width:100%;
  padding:13px 14px;
  border-radius:var(--radio-sm);
  border:1.5px solid var(--borde);
  font-family:var(--font-cuerpo);
  font-size:1rem;
  background:var(--crema);
  transition:border-color .2s ease, box-shadow .2s ease;
}
.campo input:focus,
.campo textarea:focus{
  outline:none;
  border-color:var(--verde-medio);
  box-shadow:0 0 0 3px rgba(111,139,124,.2);
}
.campo textarea{ min-height:130px; resize:vertical; }
.campo-checkbox{ display:flex; gap:10px; align-items:flex-start; font-size:.86rem; color:var(--tinta-suave); }
.campo-checkbox input{ width:auto; margin-top:3px; }
.campo-checkbox a{ color:var(--terracota-oscuro); }

.form-mensaje{
  display:none;
  margin-top:18px;
  padding:14px 16px;
  border-radius:var(--radio-sm);
  font-weight:600;
  font-size:.92rem;
}
.form-mensaje.ok{ display:block; background:#e6f2ea; color:#2f6b45; }
.form-mensaje.error{ display:block; background:#fbe4e0; color:#a8412a; }

/* ---------- Footer ---------- */
.pie{
  background:var(--verde-profundo);
  color:#eef3ee;
  padding:56px 0 26px;
  margin-top:60px;
}
.pie .contenedor{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr;
  gap:40px;
}
.pie .logo-nombre{ color:#fff; }
.pie .logo-sub{ color:var(--verde-suave); }
.pie p{ color:var(--verde-suave); font-size:.92rem; }
.pie h4{
  color:#fff;
  font-family:var(--font-cuerpo);
  font-size:.85rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:16px;
}
.pie ul{ list-style:none; margin:0; padding:0; }
.pie ul li{ margin-bottom:10px; }
.pie a{ color:var(--verde-suave); }
.pie a:hover{ color:#fff; }
.pie-legal{
  border-top:1px solid rgba(255,255,255,.12);
  margin-top:40px;
  padding-top:20px;
  font-size:.82rem;
  color:var(--verde-suave);
  display:flex;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px;
}
@media (max-width:760px){
  .pie .contenedor{ grid-template-columns:1fr; gap:30px; }
}

/* ---------- Migas de pan ---------- */
.migas{
  font-size:.85rem;
  color:var(--tinta-suave);
  padding:18px 0 0;
}
.migas a{ color:var(--tinta-suave); }
.migas span[aria-current]{ color:var(--verde-profundo); font-weight:700; }

/* ---------- Utilidades ---------- */
.centrado{ text-align:center; }
.mt-0{ margin-top:0; }
.animar{ opacity:1; transform:none; }
html.js .animar{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .6s ease, transform .6s ease;
}
html.js .animar.visible{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  html.js .animar{ opacity:1; transform:none; transition:none; }
}