/* =========================================================
   Ana González — Psicóloga sanitaria
   Boceto / mockup · HTML + CSS + JS
   Paleta y tipografías según Manual de Marca
   ========================================================= */

/* ---------- Tipografías ---------- */
@import url('https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400;1,500;1,600&display=swap');

/* ---------- Tokens ---------- */
:root{
  /* Colores de marca */
  --teal:        #008B8D;
  --teal-dark:   #006e70;
  --teal-deep:   #00585a;
  --sage:        #86BFBF;
  --sage-soft:   #b9dada;
  --salmon:      #EACFBD;
  --salmon-soft: #f4e3d7;
  --charcoal:    #2C3333;
  --charcoal-2:  #3d4444;

  /* Neutros cálidos */
  --cream:       #FBF7F3;
  --cream-2:     #F5ECE4;
  --cream-3:     #efe3d8;
  --white:       #ffffff;
  --line:        #e7ddd3;

  /* Texto */
  --text:        #2C3333;
  --text-soft:   #5d6363;
  --text-mut:    #8a8f8f;

  /* Tipografía */
  --serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --sans:  'Mulish', system-ui, -apple-system, sans-serif;

  /* Medidas */
  --container: 1400px;
  --container-narrow: 880px;
  --radius:    18px;
  --radius-lg: 32px;
  --radius-xl: 48px;

  /* Sombras suaves */
  --shadow-sm: 0 6px 20px rgba(44,51,51,.06);
  --shadow:    0 18px 50px rgba(44,51,51,.10);
  --shadow-lg: 0 30px 70px rgba(44,51,51,.14);

  --ease: cubic-bezier(.22,.61,.36,1);
  --header-h: 84px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:hidden; }
body{
  font-family:var(--sans);
  font-weight:400;
  color:var(--text);
  background:var(--cream);
  line-height:1.7;
  font-size:1.0625rem;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
ul{ list-style:none; }

/* ---------- Tipografía base ---------- */
h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:600;
  line-height:1.1;
  color:var(--charcoal);
  letter-spacing:-.02em;
}
h1{ font-size:clamp(2.5rem, 5.4vw, 4.1rem); line-height:1.04; letter-spacing:-.028em; }
h2{ font-size:clamp(2rem, 3.8vw, 3rem); }
h3{ font-size:clamp(1.35rem, 2.2vw, 1.7rem); }
h4{ font-size:1.2rem; }
p{ color:var(--text-soft); }
strong{ color:var(--charcoal); font-weight:600; }

/* ---------- Layout helpers ---------- */
.container{ width:100%; max-width:var(--container); margin:0 auto; padding:0 clamp(1.5rem,5vw,3.5rem); }
.narrow{ max-width:var(--container-narrow); }
.section{ padding:clamp(4rem,9vw,7rem) 0; position:relative; }
.section--tight{ padding:clamp(3rem,6vw,4.5rem) 0; }
.bg-cream2{ background:var(--cream-2); }
.bg-white{ background:var(--white); }
.bg-salmon{ background:linear-gradient(160deg,var(--salmon-soft),var(--salmon)); }
.text-center{ text-align:center; }

.eyebrow{
  font-family:var(--sans);
  font-weight:500;
  font-size:.82rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--teal);
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  margin-bottom:1rem;
}
.eyebrow::before{
  content:""; width:30px; height:1.5px; background:var(--sage);
}
.eyebrow.center::after{ content:""; width:30px; height:1.5px; background:var(--sage); }
.eyebrow.center{ justify-content:center; }

.section-head{ max-width:680px; margin-bottom:3rem; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head p{ margin-top:1rem; font-size:1.12rem; }

.lead{ font-size:1.2rem; color:var(--text-soft); }

/* ---------- Botones ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--sans); font-weight:500; font-size:1rem;
  padding:.95rem 1.9rem; border-radius:50px;
  transition:transform .35s var(--ease), box-shadow .35s var(--ease), background .3s, color .3s;
  will-change:transform; line-height:1; text-align:center;
}
.btn svg{ width:18px; height:18px; }
.btn-primary{ background:var(--teal); color:#fff; box-shadow:0 10px 26px rgba(0,139,141,.30); }
.btn-primary:hover{ background:var(--teal-dark); transform:translateY(-3px); box-shadow:0 16px 34px rgba(0,139,141,.40); }
.btn-secondary{ background:transparent; color:var(--teal); box-shadow:inset 0 0 0 1.6px var(--teal); }
.btn-secondary:hover{ background:var(--teal); color:#fff; transform:translateY(-3px); }
.btn-light{ background:#fff; color:var(--teal); box-shadow:var(--shadow-sm); }
.btn-light:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
.btn-ghost-light{ background:transparent; color:#fff; box-shadow:inset 0 0 0 1.6px rgba(255,255,255,.55); }
.btn-ghost-light:hover{ background:#fff; color:var(--teal); transform:translateY(-3px); }
.btn-row{ display:flex; flex-wrap:wrap; gap:1rem; }
.btn-row.center{ justify-content:center; }

.text-link{ color:var(--teal); font-weight:500; display:inline-flex; align-items:center; gap:.4rem; transition:gap .3s var(--ease); }
.text-link:hover{ gap:.75rem; }
.text-link::after{ content:"→"; transition:transform .3s var(--ease); }

/* =========================================================
   HEADER
   ========================================================= */
.site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  height:var(--header-h);
  display:flex; align-items:center;
  transition:background .4s var(--ease), height .4s var(--ease), box-shadow .4s var(--ease);
}
.site-header .container{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.site-header.scrolled{
  background:rgba(251,247,243,.92);
  backdrop-filter:blur(12px);
  box-shadow:0 6px 24px rgba(44,51,51,.07);
  height:70px;
}
.brand{ display:flex; align-items:center; flex-shrink:0; }
.brand img{ height:48px; width:auto; transition:height .4s var(--ease); }
.site-header.scrolled .brand img{ height:42px; }
/* logo blanco solo cuando el header es transparente sobre hero oscuro: usamos color por defecto */

.main-nav{ display:flex; align-items:center; gap:.35rem; }
.main-nav > li > a,
.nav-toggle-link{
  display:inline-flex; align-items:center; gap:.35rem;
  padding:.6rem .9rem; border-radius:30px;
  font-size:.97rem; font-weight:500; color:var(--charcoal);
  transition:color .25s, background .25s;
  position:relative;
}
.main-nav > li > a:hover,
.nav-toggle-link:hover{ color:var(--teal); }
.main-nav > li > a.active{ color:var(--teal); }
.main-nav > li > a.active::after{
  content:""; position:absolute; left:.9rem; right:.9rem; bottom:.35rem; height:2px;
  background:var(--sage); border-radius:2px;
}

/* Dropdown */
.has-dropdown{ position:relative; }
.dropdown-toggle .chev{ width:14px; height:14px; transition:transform .3s var(--ease); }
.has-dropdown:hover .dropdown-toggle .chev{ transform:rotate(180deg); }
.dropdown{
  position:absolute; top:calc(100% + 6px); left:50%; transform:translateX(-50%) translateY(10px);
  background:#fff; border-radius:18px; padding:.6rem;
  min-width:300px; box-shadow:var(--shadow); border:1px solid var(--line);
  opacity:0; visibility:hidden; transition:opacity .3s var(--ease), transform .3s var(--ease);
}
.has-dropdown:hover .dropdown{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dropdown a{
  display:flex; gap:.85rem; align-items:flex-start;
  padding:.7rem .8rem; border-radius:12px; transition:background .2s;
}
.dropdown a:hover{ background:var(--cream-2); }
.dropdown a .d-ico{
  flex-shrink:0; width:38px; height:38px; border-radius:50%;
  background:var(--cream-2); display:grid; place-items:center; font-size:1.1rem;
}
.dropdown a strong{ display:block; font-size:.96rem; color:var(--charcoal); font-weight:600; }
.dropdown a span{ display:block; font-size:.82rem; color:var(--text-mut); line-height:1.4; }

.header-cta{ display:flex; align-items:center; gap:.75rem; flex-shrink:0; }
.header-cta .btn{ padding:.7rem 1.4rem; font-size:.95rem; }

/* Hamburger */
.hamburger{ display:none; width:46px; height:46px; border-radius:50%; background:var(--cream-2); position:relative; flex-shrink:0; }
.hamburger span{ position:absolute; left:13px; right:13px; height:2px; background:var(--charcoal); border-radius:2px; transition:.3s var(--ease); }
.hamburger span:nth-child(1){ top:17px; }
.hamburger span:nth-child(2){ top:22px; }
.hamburger span:nth-child(3){ top:27px; }
body.nav-open .hamburger span:nth-child(1){ top:22px; transform:rotate(45deg); }
body.nav-open .hamburger span:nth-child(2){ opacity:0; }
body.nav-open .hamburger span:nth-child(3){ top:22px; transform:rotate(-45deg); }

/* =========================================================
   HERO (home)
   ========================================================= */
.hero{
  position:relative; padding-top:calc(var(--header-h) + clamp(2rem,5vw,4rem));
  padding-bottom:clamp(3rem,7vw,6rem);
  overflow:hidden;
  background:var(--cream);
}
.hero-grid{ display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:clamp(2rem,5vw,4.5rem); }
.hero-text h1{ margin-bottom:1.4rem; }
.hero-text h1 .accent{ color:var(--teal); font-style:italic; }
.hero-text .lead{ margin-bottom:1.6rem; max-width:34ch; }
.hero-sub{ font-size:1rem; color:var(--text-mut); margin-bottom:2rem; max-width:42ch; }
.hero-badges{ display:flex; flex-wrap:wrap; gap:1.4rem; margin-top:2.5rem; }
.hero-badge{ display:flex; align-items:center; gap:.6rem; font-size:.9rem; color:var(--text-soft); }
.hero-badge svg{ width:20px; height:20px; color:var(--teal); flex-shrink:0; }

.hero-visual{ position:relative; width:100%; max-width:520px; margin-inline:auto; }
.hero-photo{
  position:relative; z-index:2;
  border-radius:50%;
  overflow:hidden; aspect-ratio:1/1;
  box-shadow:var(--shadow-lg);
}
.hero-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 18%; }
@keyframes morph{
  0%,100%{ border-radius:46% 46% 46% 46% / 52% 52% 48% 48%; }
  50%{ border-radius:52% 48% 50% 50% / 48% 50% 50% 52%; }
}
.hero-blob{ display:none; }
.hero-blob.b1{ width:280px; top:-40px; right:-50px; }
.hero-blob.b2{ width:230px; bottom:-50px; left:-60px; transform:scaleX(-1); }
.hero-chip{
  position:absolute; z-index:3; background:#fff; border-radius:16px;
  padding:.85rem 1.1rem; box-shadow:var(--shadow); display:flex; align-items:center; gap:.7rem;
}
.hero-chip .ico{ width:40px; height:40px; border-radius:50%; background:var(--cream-2); display:grid; place-items:center; }
.hero-chip strong{ display:block; font-family:var(--serif); font-size:1.05rem; }
.hero-chip span{ font-size:.78rem; color:var(--text-mut); }
.hero-chip.c1{ bottom:42px; left:-30px; animation:float 6s ease-in-out infinite; }
.hero-chip.c2{ top:60px; right:-26px; animation:float 6s ease-in-out infinite .8s; }
@keyframes float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-12px);} }

/* Marquee de especialidades */
.trust-band{ background:var(--charcoal); color:#fff; padding:1.1rem 0; overflow:hidden; }
.marquee{ display:flex; gap:3.5rem; white-space:nowrap; width:max-content; animation:scroll-x 32s linear infinite; }
.marquee span{ font-family:var(--serif); font-style:italic; font-size:1.15rem; opacity:.9; display:inline-flex; align-items:center; gap:1.2rem; }
.marquee span::after{ content:"✿"; color:var(--sage); font-style:normal; font-size:.8rem; }
@keyframes scroll-x{ to{ transform:translateX(-50%); } }

/* =========================================================
   SERVICIOS / cards "¿En qué puedo ayudarte?"
   ========================================================= */
.cards-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.5rem; }
.card{
  background:#fff; border-radius:var(--radius-lg); padding:2.2rem;
  box-shadow:var(--shadow-sm); border:1px solid rgba(231,221,211,.6);
  transition:transform .45s var(--ease), box-shadow .45s var(--ease);
  position:relative; overflow:hidden; display:flex; flex-direction:column;
}
.card::after{
  content:""; position:absolute; right:-40px; top:-40px; width:120px; height:120px;
  background:var(--cream-2); border-radius:50%; transition:transform .5s var(--ease); z-index:0;
}
.card:hover{ transform:translateY(-8px); box-shadow:var(--shadow); }
.card:hover::after{ transform:scale(2.4); background:var(--cream); }
.card > *{ position:relative; z-index:1; }
.card-ico{
  width:62px; height:62px; border-radius:20px; display:grid; place-items:center;
  background:linear-gradient(150deg,var(--sage-soft),var(--salmon-soft));
  margin-bottom:1.4rem; font-size:1.7rem;
}
.card h3{ margin-bottom:.7rem; }
.card p{ font-size:.97rem; margin-bottom:1.3rem; flex-grow:1; }
.card .text-link{ font-size:.95rem; }
.card--featured{ background:linear-gradient(160deg,var(--teal),var(--teal-deep)); }
.card--featured h3,.card--featured p{ color:#fff; }
.card--featured p{ opacity:.9; }
.card--featured .card-ico{ background:rgba(255,255,255,.16); }
.card--featured .text-link{ color:#fff; }
.card--featured::after{ background:rgba(255,255,255,.08); }
.card--featured:hover::after{ background:rgba(255,255,255,.12); }

/* =========================================================
   SPLIT (texto + imagen) — "Cómo trabajo" / about
   ========================================================= */
.split{ display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:clamp(2rem,5vw,4.5rem); }
.split.rev .split-media{ order:2; }
.split-media{ position:relative; }
.split-media img{ width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow); object-fit:cover; }
.split-media .deco-dot{ position:absolute; z-index:-1; width:60%; aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle,var(--sage-soft),transparent 70%); opacity:.6; }
.split-media.b-tl .deco-dot{ top:-30px; left:-30px; }
.split-media.b-br .deco-dot{ bottom:-30px; right:-30px; background:radial-gradient(circle,var(--salmon),transparent 70%); }

.check-list{ display:grid; gap:1rem; margin-top:1.6rem; }
.check-list li{ display:flex; gap:.9rem; align-items:flex-start; }
.check-list li .ck{
  flex-shrink:0; width:26px; height:26px; border-radius:50%; background:var(--sage-soft);
  display:grid; place-items:center; margin-top:2px;
}
.check-list li .ck svg{ width:14px; height:14px; color:var(--teal-dark); }
.check-list li span{ color:var(--text-soft); }
.check-list li strong{ color:var(--charcoal); }

/* =========================================================
   Claim / cita destacada
   ========================================================= */
.quote-band{ background:var(--cream-2); position:relative; overflow:hidden; }
.quote-band .container{ position:relative; z-index:1; }
.quote-band blockquote{
  font-family:var(--serif); font-style:italic; font-weight:500;
  font-size:clamp(1.6rem,3.4vw,2.6rem); line-height:1.32; color:var(--charcoal);
  max-width:900px; margin:0 auto; text-align:center;
}
.quote-band .q-mark{ font-size:5rem; color:var(--sage); line-height:.4; font-family:var(--serif); display:block; margin-bottom:.5rem; }
.quote-band cite{ display:block; margin-top:1.6rem; font-style:normal; font-family:var(--sans);
  font-size:.95rem; letter-spacing:.05em; color:var(--teal); font-weight:500; }
.quote-deco{ position:absolute; opacity:.4; width:340px; }
.quote-deco.qd1{ top:-80px; left:-90px; }
.quote-deco.qd2{ bottom:-90px; right:-90px; transform:rotate(180deg); }

/* =========================================================
   Pasos / proceso
   ========================================================= */
.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.5rem; counter-reset:step; }
.step{ position:relative; padding:2rem 1.6rem; background:#fff; border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); }
.step::before{
  counter-increment:step; content:"0" counter(step);
  font-family:var(--serif); font-size:2.4rem; font-weight:700; color:var(--sage);
  display:block; margin-bottom:.6rem;
}
.step h4{ margin-bottom:.5rem; color:var(--charcoal); }
.step p{ font-size:.95rem; }

/* =========================================================
   CTA band
   ========================================================= */
.cta-band{
  background:linear-gradient(155deg,var(--teal),var(--teal-deep));
  color:#fff; border-radius:var(--radius-xl); padding:clamp(2.6rem,5vw,4.2rem);
  text-align:center; position:relative; overflow:hidden;
}
.cta-band h2{ color:#fff; max-width:18ch; margin:0 auto 1rem; }
.cta-band p{ color:rgba(255,255,255,.88); max-width:48ch; margin:0 auto 2rem; }
.cta-band .deco{ position:absolute; opacity:.16; width:360px; }
.cta-band .deco.d1{ top:-120px; left:-80px; }
.cta-band .deco.d2{ bottom:-130px; right:-80px; transform:rotate(180deg); }

/* =========================================================
   Inner page hero
   ========================================================= */
.page-hero{
  position:relative; overflow:hidden;
  padding-top:calc(var(--header-h) + clamp(2.5rem,5vw,4rem));
  padding-bottom:clamp(2.5rem,5vw,4rem);
  background:
    radial-gradient(800px 420px at 90% -20%, var(--salmon-soft), transparent 60%),
    var(--cream);
}
.page-hero-grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.breadcrumb{ font-size:.85rem; color:var(--text-mut); margin-bottom:1.2rem; display:flex; gap:.5rem; align-items:center; }
.breadcrumb a:hover{ color:var(--teal); }
.breadcrumb span{ color:var(--sage); }
.page-hero h1{ margin-bottom:1.2rem; }
.page-hero .lead{ max-width:46ch; }
.page-hero-media img{ border-radius:var(--radius-lg); box-shadow:var(--shadow); width:100%; aspect-ratio:4/3.4; object-fit:cover; object-position:center 25%; }
.page-hero--center{ text-align:center; }
.page-hero--center .breadcrumb{ justify-content:center; }
.page-hero--center .lead{ margin:0 auto; }

/* =========================================================
   "Preguntas internas" — empatía
   ========================================================= */
.q-cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:1.1rem; }
.q-card{
  background:#fff; border-radius:var(--radius); padding:1.5rem 1.6rem;
  border-left:3px solid var(--sage); box-shadow:var(--shadow-sm);
  font-family:var(--serif); font-style:italic; font-size:1.12rem; color:var(--charcoal-2);
  transition:transform .4s var(--ease), border-color .4s;
}
.q-card:hover{ transform:translateY(-5px); border-color:var(--teal); }

/* =========================================================
   "Problemas que se trabajan" — chips
   ========================================================= */
.chips{ display:flex; flex-wrap:wrap; gap:.7rem; }
.chip{
  background:#fff; border:1px solid var(--line); border-radius:50px;
  padding:.6rem 1.2rem; font-size:.92rem; color:var(--text-soft);
  display:inline-flex; align-items:center; gap:.5rem; transition:.3s var(--ease);
}
.chip::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--sage); }
.chip:hover{ background:var(--teal); color:#fff; border-color:var(--teal); transform:translateY(-2px); }
.chip:hover::before{ background:#fff; }

/* dos columnas de texto en "cómo ayuda" */
.help-list{ columns:2; column-gap:3rem; }
.help-list li{ break-inside:avoid; display:flex; gap:.7rem; align-items:flex-start; margin-bottom:.9rem; }
.help-list li .ck{ flex-shrink:0; width:22px; height:22px; border-radius:50%; background:var(--salmon); display:grid; place-items:center; margin-top:3px; }
.help-list li .ck svg{ width:12px; height:12px; color:var(--charcoal); }

/* highlight box "enfoque diferencial" */
.highlight{
  background:linear-gradient(150deg,#fff,var(--cream-2));
  border-radius:var(--radius-lg); padding:clamp(1.8rem,4vw,2.8rem);
  box-shadow:var(--shadow-sm); border:1px solid var(--line); position:relative;
}
.highlight .tag{ display:inline-block; font-size:.78rem; letter-spacing:.15em; text-transform:uppercase;
  color:var(--teal); font-weight:600; margin-bottom:.8rem; }
.highlight p{ font-size:1.1rem; color:var(--text); }

/* sub-temas (subpáginas SEO) */
.subtopics{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1rem; }
.subtopic{ display:flex; align-items:center; justify-content:space-between; gap:1rem;
  background:#fff; border:1px solid var(--line); border-radius:16px; padding:1.1rem 1.4rem;
  transition:.3s var(--ease); }
.subtopic:hover{ border-color:var(--teal); transform:translateX(5px); box-shadow:var(--shadow-sm); }
.subtopic span{ font-weight:500; color:var(--charcoal); }
.subtopic .arr{ color:var(--teal); transition:transform .3s var(--ease); }
.subtopic:hover .arr{ transform:translateX(4px); }

/* =========================================================
   Sobre mí
   ========================================================= */
.creds{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1.2rem; }
.cred{ background:#fff; border-radius:var(--radius); padding:1.6rem; box-shadow:var(--shadow-sm); text-align:center; }
.cred .num{ font-family:var(--serif); font-size:2.6rem; font-weight:700; color:var(--teal); line-height:1; }
.cred p{ font-size:.92rem; margin-top:.5rem; }
.formacion{ display:grid; gap:1rem; }
.formacion li{ display:flex; gap:1rem; padding:1.2rem 1.4rem; background:#fff; border-radius:14px; box-shadow:var(--shadow-sm); }
.formacion li .yr{ font-family:var(--serif); font-weight:700; color:var(--sage); flex-shrink:0; min-width:60px; }
.formacion li strong{ display:block; color:var(--charcoal); }
.formacion li span{ font-size:.9rem; color:var(--text-mut); }

/* =========================================================
   Contacto
   ========================================================= */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
.info-list{ display:grid; gap:1.2rem; margin-top:1.5rem; }
.info-item{ display:flex; gap:1rem; align-items:flex-start; }
.info-item .ico{ width:48px; height:48px; border-radius:14px; background:var(--cream-2); display:grid; place-items:center; flex-shrink:0; }
.info-item .ico svg{ width:22px; height:22px; color:var(--teal); }
.info-item strong{ display:block; color:var(--charcoal); }
.info-item span,.info-item a{ font-size:.95rem; color:var(--text-soft); }
.info-item a:hover{ color:var(--teal); }

.price-cards{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:1.5rem; }
.price-card{ background:#fff; border-radius:var(--radius); padding:1.6rem; box-shadow:var(--shadow-sm); border:1px solid var(--line); text-align:center; }
.price-card .p{ font-family:var(--serif); font-size:2.4rem; font-weight:700; color:var(--teal); }
.price-card .p small{ font-size:1rem; color:var(--text-mut); font-weight:400; }
.price-card h4{ margin-bottom:.4rem; }
.price-card span{ font-size:.85rem; color:var(--text-mut); }

.form-card{ background:#fff; border-radius:var(--radius-lg); padding:clamp(1.8rem,4vw,2.6rem); box-shadow:var(--shadow); border:1px solid var(--line); }
.field{ margin-bottom:1.2rem; }
.field label{ display:block; font-size:.9rem; font-weight:500; color:var(--charcoal); margin-bottom:.45rem; }
.field input,.field textarea,.field select{
  width:100%; padding:.85rem 1.1rem; border:1.5px solid var(--line); border-radius:12px;
  font-family:var(--sans); font-size:1rem; color:var(--text); background:var(--cream);
  transition:border-color .25s, box-shadow .25s;
}
.field input:focus,.field textarea:focus,.field select:focus{
  outline:none; border-color:var(--teal); box-shadow:0 0 0 4px rgba(0,139,141,.10); background:#fff;
}
.field textarea{ resize:vertical; min-height:130px; }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-note{ font-size:.82rem; color:var(--text-mut); margin-top:1rem; text-align:center; }
.form-msg{ display:none; background:var(--sage-soft); color:var(--teal-deep); padding:1rem 1.2rem; border-radius:12px; margin-bottom:1.2rem; font-size:.95rem; }
.form-msg.show{ display:block; }

/* =========================================================
   FAQ accordion
   ========================================================= */
.faq{ max-width:780px; margin:0 auto; display:grid; gap:.8rem; }
.faq-item{ background:#fff; border-radius:16px; box-shadow:var(--shadow-sm); border:1px solid var(--line); overflow:hidden; }
.faq-q{ width:100%; text-align:left; padding:1.3rem 1.5rem; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  font-family:var(--serif); font-size:1.15rem; font-weight:600; color:var(--charcoal); }
.faq-q .pm{ flex-shrink:0; width:28px; height:28px; border-radius:50%; background:var(--cream-2); position:relative; transition:background .3s; }
.faq-q .pm::before,.faq-q .pm::after{ content:""; position:absolute; background:var(--teal); border-radius:2px; left:50%; top:50%; transition:.3s var(--ease); }
.faq-q .pm::before{ width:12px; height:2px; transform:translate(-50%,-50%); }
.faq-q .pm::after{ width:2px; height:12px; transform:translate(-50%,-50%); }
.faq-item.open .faq-q .pm{ background:var(--teal); }
.faq-item.open .faq-q .pm::before,.faq-item.open .faq-q .pm::after{ background:#fff; }
.faq-item.open .faq-q .pm::after{ transform:translate(-50%,-50%) rotate(90deg); opacity:0; }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .4s var(--ease); }
.faq-a-inner{ padding:0 1.5rem 1.4rem; color:var(--text-soft); font-size:.98rem; }

/* =========================================================
   FOOTER
   ========================================================= */
.site-footer{ background:var(--charcoal); color:#cfd4d4; padding:clamp(3rem,6vw,4.5rem) 0 2rem; position:relative; overflow:hidden; }
.footer-grid{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:2.5rem; margin-bottom:3rem; }
.footer-brand img{ height:64px; margin-bottom:1.2rem; }
.footer-brand p{ color:#9aa0a0; font-size:.92rem; max-width:32ch; }
.footer-col h5{ font-family:var(--sans); font-size:.8rem; letter-spacing:.15em; text-transform:uppercase; color:var(--sage); margin-bottom:1.1rem; }
.footer-col ul{ display:grid; gap:.65rem; }
.footer-col a{ color:#b6bcbc; font-size:.94rem; transition:color .25s, padding .25s; }
.footer-col a:hover{ color:#fff; padding-left:4px; }
.footer-social{ display:flex; gap:.7rem; margin-top:1.3rem; }
.footer-social a{ width:40px; height:40px; border-radius:50%; background:rgba(255,255,255,.08); display:grid; place-items:center; transition:.3s var(--ease); }
.footer-social a:hover{ background:var(--teal); transform:translateY(-3px); }
.footer-social svg{ width:18px; height:18px; color:#fff; }
.footer-bottom{ border-top:1px solid rgba(255,255,255,.1); padding-top:1.6rem; display:flex; justify-content:space-between; flex-wrap:wrap; gap:1rem; font-size:.85rem; color:#8a9090; }
.footer-bottom a:hover{ color:#fff; }
.footer-deco{ position:absolute; bottom:-120px; right:-60px; width:380px; opacity:.06; }

/* =========================================================
   Animaciones scroll-reveal
   ========================================================= */
.reveal{ opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.08s; }
.reveal.d2{ transition-delay:.16s; }
.reveal.d3{ transition-delay:.24s; }
.reveal.d4{ transition-delay:.32s; }
.reveal-left{ opacity:0; transform:translateX(-34px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal-left.in{ opacity:1; transform:none; }
.reveal-right{ opacity:0; transform:translateX(34px); transition:opacity .8s var(--ease), transform .8s var(--ease); }
.reveal-right.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
  .reveal,.reveal-left,.reveal-right{ opacity:1; transform:none; }
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:980px){
  .hero-grid{ grid-template-columns:1fr; }
  .hero-visual{ max-width:460px; margin:0 auto; order:-1; }
  .hero-text .lead{ max-width:none; }
  .split{ grid-template-columns:1fr; }
  .split.rev .split-media{ order:-1; }
  .page-hero-grid{ grid-template-columns:1fr; }
  .page-hero-media{ order:-1; max-width:520px; }
  .contact-grid{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; gap:2rem; }
  .help-list{ columns:1; }
}
@media (max-width:760px){
  .header-cta .btn-text{ display:none; }
  .main-nav, .header-cta .btn-secondary{ display:none; }
  .hamburger{ display:block; }

  /* Menú móvil */
  .mobile-nav{
    position:fixed; inset:0; z-index:99; background:var(--cream);
    padding:calc(var(--header-h) + 1rem) clamp(1.5rem,6vw,2.5rem) 2rem;
    transform:translateX(100%); transition:transform .45s var(--ease);
    display:flex; flex-direction:column; overflow-y:auto;
  }
  body.nav-open .mobile-nav{ transform:none; }
  .mobile-nav a{ font-family:var(--serif); font-size:1.5rem; padding:.85rem 0; border-bottom:1px solid var(--line); color:var(--charcoal); display:block; }
  .mobile-nav a.sub{ font-family:var(--sans); font-size:1.05rem; padding-left:1rem; color:var(--text-soft); }
  .mobile-nav .m-label{ font-size:.78rem; letter-spacing:.15em; text-transform:uppercase; color:var(--teal); margin-top:1.4rem; }
  .mobile-nav .btn{ margin-top:1.8rem; }
  .field-row{ grid-template-columns:1fr; }
  .price-cards{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .footer-bottom{ flex-direction:column; }
  .quote-band blockquote{ font-size:1.5rem; }
}
@media (min-width:761px){ .mobile-nav{ display:none; } }

.fade-page{ animation:fadeIn .6s var(--ease); }
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }


/* =========================================================
   Mobile fixes y breakpoints adicionales
   ========================================================= */

/* ---- 760px: correcciones específicas para móvil ---- */
@media (max-width:760px){
  /* Ocultar chips flotantes del hero (desbordaban el viewport) */
  .hero-chip{ display:none; }
  /* Contener blobs dentro del visual */
  .hero-visual{ overflow:hidden; }
  .hero-blob.b1{ width:160px; right:0; top:-10px; }
  .hero-blob.b2{ width:140px; bottom:-10px; left:0; }
  /* Círculo perfecto también en móvil, sin sombra */
  .hero-photo{ aspect-ratio:1/1; border-radius:50%; box-shadow:none; }
  /* 2 columnas de cards en tablet/móvil grande */
  .cards-grid{ grid-template-columns:1fr 1fr; }
  /* Radio reducido en CTA band */
  .cta-band{ border-radius:var(--radius-lg); }
  /* Asegurar padding lateral en sección de pasos */
  .steps{ gap:1rem; }
  /* Header: botón CTA más pequeño */
  .header-cta .btn{ padding:.65rem 1.1rem; font-size:.9rem; }
}

/* ---- 480px: teléfonos pequeños ---- */
@media (max-width:480px){
  /* Tipografía */
  h1{ font-size:clamp(2rem, 8vw, 2.5rem); }
  h2{ font-size:clamp(1.65rem, 6.5vw, 2rem); }

  /* Botones en columna */
  .btn-row{ flex-direction:column; align-items:stretch; }
  .btn-row .btn{ width:100%; justify-content:center; }
  .btn-row.center{ align-items:center; }
  .btn-row.center .btn{ max-width:290px; }

  /* Hero */
  .hero-badges{ flex-direction:column; gap:.75rem; }
  .hero-visual{ max-width:100%; }
  .hero-photo{ aspect-ratio:1/1; border-radius:50%; }
  .hero-sub{ font-size:.95rem; }

  /* Grids: 1 columna en móvil pequeño */
  .cards-grid{ grid-template-columns:1fr; }
  .q-cards{ grid-template-columns:1fr; }
  .steps{ grid-template-columns:1fr; }
  .subtopics{ grid-template-columns:1fr; }
  .creds{ grid-template-columns:1fr 1fr; }
  .price-cards{ grid-template-columns:1fr; }

  /* CTA band compacto */
  .cta-band{ border-radius:var(--radius); padding:2rem 1.4rem; }
  .cta-band .deco{ display:none; }
  .cta-band h2{ font-size:1.6rem; }

  /* Cita */
  .quote-band blockquote{ font-size:1.2rem; }
  .quote-band .q-mark{ font-size:3.5rem; }

  /* Sección head */
  .section-head{ margin-bottom:1.8rem; }
  .section-head p{ font-size:1rem; }

  /* Formulario */
  .form-card{ padding:1.5rem 1.2rem; }

  /* Chips de servicios */
  .chip{ font-size:.88rem; padding:.5rem 1rem; }

  /* Footer */
  .footer-brand img{ height:52px; }
  .footer-bottom{ font-size:.82rem; }

  /* Check list en páginas interiores */
  .check-list{ gap:.8rem; }

  /* Formacion */
  .formacion li{ flex-direction:column; gap:.3rem; }
  .formacion li .yr{ min-width:auto; }

  /* Subtopic sin hover transform lateral en touch */
  .subtopic:hover{ transform:none; }
}


/* =========================================================
   Offcanvas nav + chips ocultos (override v2)
   ========================================================= */

/* Chips: ocultos desde tablet (hero en 1 col desde 980px) */
@media (max-width:980px){
  .hero-chip{ display:none !important; }
  .hero-visual{ overflow:hidden; }
}

/* Overlay del offcanvas (siempre en DOM, visible solo en mobile) */
.nav-overlay{
  position:fixed; inset:0; z-index:198;
  background:rgba(44,51,51,.48);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .38s cubic-bezier(.22,.61,.36,1), visibility .38s;
}
body.nav-open .nav-overlay{ opacity:1; visibility:visible; pointer-events:auto; }
@media (min-width:761px){ .nav-overlay{ display:none !important; } }

/* Panel offcanvas lateral */
@media (max-width:760px){
  /* Override del inset:0 del bloque original: panel lateral derecho */
  .mobile-nav{
    inset:0 0 0 auto;
    width:min(84vw, 310px);
    padding:0 0 2.5rem;
    z-index:200;
    transform:translateX(105%);
    border-left:1px solid var(--line);
    box-shadow:-14px 0 60px rgba(44,51,51,.2);
  }
  body.nav-open .mobile-nav{ transform:translateX(0) !important; }

  /* Cabecera interna del panel */
  .nav-panel-header{
    display:flex; align-items:center; justify-content:space-between;
    padding:1.1rem 1.5rem;
    border-bottom:1px solid var(--line);
    flex-shrink:0; margin-bottom:.4rem;
  }
  .nav-panel-header img{ height:36px; width:auto; }

  /* Boton X cerrar */
  .nav-close-btn{
    width:40px; height:40px; border-radius:50%;
    background:var(--cream-2); border:none; cursor:pointer;
    display:grid; place-items:center; flex-shrink:0;
    transition:background .25s, transform .3s;
  }
  .nav-close-btn:hover{ background:var(--line); transform:rotate(90deg); }
  .nav-close-btn svg{ width:18px; height:18px; color:var(--charcoal); pointer-events:none; }

  /* Links con padding lateral */
  .mobile-nav > a{
    padding-left:1.5rem; padding-right:1.5rem;
    font-size:1.28rem;
  }
  .mobile-nav > a.sub{ padding-left:2.4rem; }
  .mobile-nav .m-label{
    padding-left:1.5rem; padding-right:1.5rem;
    margin-top:1rem;
  }
  /* Boton CTA al fondo del panel */
  .mobile-nav > .btn{
    margin:auto 1.5rem 0;
    width:calc(100% - 3rem);
    justify-content:center;
  }
}


/* =========================================================
   Header móvil — fix v3 (logo, botón, overflow)
   ========================================================= */
@media (max-width:760px){
  /* Header más compacto */
  .site-header{ height:64px; }
  .site-header.scrolled{ height:58px; }

  /* Quitar el botón 'Reservar cita' del header en móvil */
  .header-cta .btn-primary{ display:none !important; }

  /* Logo más pequeño para que no domine */
  .brand img{ height:36px !important; }
  .site-header.scrolled .brand img{ height:32px !important; }

  /* El header-cta solo contiene la hamburguesa */
  .header-cta{ gap:0; }

  /* Hamburguesa un poco más pequeña */
  .hamburger{ width:42px; height:42px; }

  /* Evitar cualquier desbordamiento lateral */
  .site-header .container{ gap:1rem; }

  /* Ajustar altura de referencia para el hero (usaba --header-h:84px) */
  .hero{ padding-top:calc(64px + clamp(1.5rem,5vw,3rem)); }
  .page-hero{ padding-top:calc(64px + clamp(2rem,5vw,3rem)); }
  .mobile-nav .nav-panel-header{ padding-top:1rem; }
}


/* =========================================================
   Header + offcanvas — fix DEFINITIVO v4
   ========================================================= */
@media (max-width:760px){

  /* ---------- HEADER ---------- */
  /* Fondo sólido siempre (no transparente) para que se lea limpio */
  .site-header{
    height:62px;
    background:rgba(251,247,243,.95);
    backdrop-filter:blur(10px);
    box-shadow:0 1px 0 var(--line);
  }
  .site-header.scrolled{ height:58px; box-shadow:0 6px 20px rgba(44,51,51,.08); }

  .site-header .container{
    padding-left:1.1rem; padding-right:1.1rem; gap:.75rem;
  }

  /* Logo: limitar por ancho (es horizontal y muy largo) */
  .brand{ min-width:0; overflow:hidden; }
  .brand img{
    height:auto !important;
    width:auto;
    max-height:30px;
    max-width:185px;
  }
  .site-header.scrolled .brand img{ max-height:28px !important; }

  /* Botón del header fuera */
  .header-cta .btn-primary{ display:none !important; }
  .header-cta{ gap:0; }
  .hamburger{ width:42px; height:42px; }

  /* Reajustar el hero al nuevo alto del header */
  .hero{ padding-top:calc(62px + clamp(1.5rem,5vw,2.5rem)); }
  .page-hero{ padding-top:calc(62px + clamp(1.5rem,5vw,2.5rem)); }

  /* ---------- BOTÓN CTA DEL OFFCANVAS ---------- */
  /* Reset total: el <a class='btn'> heredaba estilo de link de menú */
  .mobile-nav a.btn,
  .mobile-nav a.btn.btn-primary{
    display:flex !important;
    align-items:center; justify-content:center;
    box-sizing:border-box;
    width:calc(100% - 3rem) !important;
    margin:auto 1.5rem 0 !important;
    padding:1rem 1.25rem !important;
    border:none !important;
    border-bottom:none !important;
    border-radius:50px !important;
    background:var(--teal) !important;
    color:#fff !important;
    font-family:var(--sans) !important;
    font-size:1rem !important;
    font-weight:500 !important;
    box-shadow:0 10px 24px rgba(0,139,141,.28);
  }
  /* Separación del bloque de links de arriba */
  .mobile-nav a.btn{ margin-top:2rem !important; }
}


/* =========================================================
   FIX v5 — restaurar logo (el SVG solo tiene viewBox y
   colapsaba a 0x0 con height:auto). Altura explícita.
   ========================================================= */
@media (max-width:760px){
  .brand img{
    height:32px !important;
    width:auto !important;
    max-height:32px !important;
    max-width:200px !important;
  }
  .site-header.scrolled .brand img{ height:28px !important; max-height:28px !important; }
}


/* =========================================================
   FIX v6 — botón offcanvas: quitar margin-top:auto que lo
   empujaba fuera del viewport. Margen fijo + panel scrollable.
   ========================================================= */
@media (max-width:760px){
  .mobile-nav{ overflow-y:auto !important; }
  .mobile-nav a.btn.btn-primary{
    margin:1.6rem 1.5rem .5rem !important;
  }
}


/* =========================================================
   FIX v7 — header en móvil pintaba mal al cargar y se
   corregía al hacer scroll. Causa: backdrop-filter sobre
   position:fixed (bug de repintado en navegadores móviles).
   Solución: fondo 100% opaco, sin blur, capa propia.
   ========================================================= */
@media (max-width:760px){
  .site-header,
  .site-header.scrolled{
    background:#fbf7f3 !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
    will-change:auto;
  }
}


/* =========================================================
   FIX v8 — CAUSA REAL del header mal al cargar:
   .fade-page anima la opacidad de TODO el <body> (fadeIn .6s).
   El header (hijo del body) se ve semitransparente durante la
   animación y solo se 'acomoda' al terminar. Se desactiva el
   fade global de página (el header fixed no puede excluirse
   de la opacidad de un ancestro).
   ========================================================= */
body.fade-page{
  animation:none !important;
  opacity:1 !important;
}


/* =========================================================
   FIX v9 — Quitar animaciones de entrada en móvil.
   Las animaciones del home (reveal, morph, marquee, fade)
   forzaban repintados que dejaban el header mal hasta que
   terminaban. En móvil el contenido aparece ya colocado.
   ========================================================= */
@media (max-width:760px){
  /* Contenido visible al instante, sin transición de entrada */
  .reveal,
  .reveal-left,
  .reveal-right{
    opacity:1 !important;
    transform:none !important;
    transition:none !important;
  }
  /* Detener animaciones de keyframes (entrada y decorativas) */
  .fade-page,
  .hero,
  .hero *,
  .hero-photo,
  .hero-chip,
  .hero-blob,
  .marquee{
    animation:none !important;
  }
  /* La foto del hero conserva su forma redonda sin morphing */
  .hero-photo{ border-radius:50%; }
}


/* =========================================================
   FIX v10 — Header 100% estático en móvil: misma altura
   en reposo y al hacer scroll, y SIN transición, para que
   no haya ningún 'acomodo' visible al cargar.
   ========================================================= */
@media (max-width:760px){
  .site-header,
  .site-header.scrolled{
    height:60px !important;
    transition:none !important;
    background:#fbf7f3 !important;
    box-shadow:0 1px 0 var(--line) !important;
  }
  .brand img,
  .site-header.scrolled .brand img{
    height:30px !important;
    max-height:30px !important;
    transition:none !important;
  }
}

/* =========================================================
   FIX v12 — Scroll horizontal en móvil:
   1) Puntos decorativos (.deco-dot, variante b-br) sobresalían
      por la derecha del viewport en páginas con split.
   2) La fila de stats (.creds) forzaba 2 columnas hasta 480px,
      que no caben en teléfonos estrechos (≤400px).
   ========================================================= */
/* El punto decorativo (.deco-dot) es 60% del ancho de la imagen y se posiciona
   con offset negativo (-30px). Cuando el contenedor ocupa casi todo el viewport
   (móvil, tablet y laptops <1260px) sobresalía por el borde y generaba scroll
   horizontal. Es puramente decorativo (z-index:-1, detrás de la imagen), así que
   se oculta para garantizar cero desbordamiento en todos los anchos. */
.split-media .deco-dot{ display:none; }
@media (max-width:400px){
  .creds{ grid-template-columns:1fr; }
}

/* =========================================================
   Variante de tarjetas CON FOTO (sección comparativa)
   ========================================================= */
.card--photo{ padding:0; overflow:hidden; }
.card--photo::after{ display:none; }
.card-photo{ position:relative; width:100%; aspect-ratio:16/11; overflow:hidden; }
.card-photo img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.card--photo:hover .card-photo img{ transform:scale(1.05); }
.card-photo::after{ content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(44,51,51,.22), transparent 55%); }
.card--photo .card-body{ padding:1.9rem 2rem 2.2rem; display:flex; flex-direction:column; flex-grow:1; }
.card--photo .card-body h3{ margin-bottom:.6rem; }
.card--photo .card-body p{ font-size:.97rem; margin-bottom:1.3rem; flex-grow:1; }


/* =========================================================
   Refinamientos tipográficos · Playfair Display + Mulish
   (los titulares en 600 y las itálicas de acentos/citas ya
   están definidos en la base de tipografía, arriba)
   ========================================================= */
.eyebrow{ font-weight:700; }
.btn, .main-nav > li > a, .nav-toggle-link, .chip, .text-link{ font-weight:600; }
strong{ font-weight:700; }

/* ==== inline de index.html ==== */
.testimonials-track{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 80px,#000 calc(100% - 80px),transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 80px,#000 calc(100% - 80px),transparent);}
.testimonials-inner{display:flex;gap:1.5rem;animation:scroll-tests 38s linear infinite;width:max-content;}
.testimonials-inner:hover{animation-play-state:paused;}
@keyframes scroll-tests{to{transform:translateX(-50%);}}
.testi-card{background:var(--white);border-radius:var(--radius);padding:1.8rem;width:310px;flex-shrink:0;border:1px solid var(--line);box-shadow:var(--shadow-sm);}
.testi-text{font-size:.98rem;color:var(--text-soft);font-style:italic;margin-bottom:1.2rem;line-height:1.75;position:relative;padding-left:1.1rem;}
.testi-text::before{content:'"';font-size:2.2rem;color:var(--sage);font-family:var(--serif);position:absolute;left:0;top:-.3rem;line-height:1;}
.testi-author{display:flex;align-items:center;gap:.65rem;}
.testi-init{width:36px;height:36px;border-radius:50%;background:var(--sage-soft);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--teal-dark);font-size:.78rem;flex-shrink:0;}
.testi-meta strong{display:block;font-size:.87rem;color:var(--charcoal);}
.testi-meta span{font-size:.78rem;color:var(--text-mut);}
.certs-grid{display:flex;flex-wrap:wrap;gap:2rem;justify-content:center;align-items:center;padding:1.5rem 0;}
.cert-item{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.5rem;}
.cert-abbr{font-family:var(--serif);font-size:1.2rem;font-weight:700;color:var(--teal);border:2px solid var(--sage-soft);border-radius:10px;padding:.5rem 1rem;min-width:80px;background:var(--white);}
.cert-name{font-size:.74rem;color:var(--text-mut);max-width:120px;line-height:1.35;}
.card-ico svg{display:block;}
.podcast-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.3rem;margin-top:2rem;}
.podcast-grid iframe{width:100%;border:0;border-radius:12px;box-shadow:var(--shadow-sm);}
@media(max-width:720px){.podcast-grid{grid-template-columns:1fr;}}

/* ==== inline de sobre-mi.html ==== */
/* Trayectoria académica — desplegable con tarjetas */
.formacion-details{max-width:920px;margin:1.8rem auto 0;}
.formacion-details summary{
  list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.6rem;
  margin:0 auto;padding:.85rem 1.6rem;border:1px solid var(--line);border-radius:50px;
  background:var(--white);color:var(--teal);font-family:var(--sans);font-weight:600;
  font-size:.95rem;width:max-content;transition:.25s var(--ease);
}
.formacion-details summary::-webkit-details-marker{display:none;}
.formacion-details summary:hover{border-color:var(--teal);box-shadow:0 6px 18px rgba(0,139,141,.12);}
.formacion-details summary .chev{width:18px;height:18px;transition:transform .3s var(--ease);}
.formacion-details[open] summary .chev{transform:rotate(180deg);}
.formacion-summary-wrap{text-align:center;}
.formacion-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.6rem;
}
.form-card{
  background:var(--white);border:1px solid var(--line);border-radius:14px;
  padding:1.15rem 1.35rem;transition:.25s var(--ease);
}
.form-card:hover{border-color:var(--sage);box-shadow:0 8px 22px rgba(44,51,51,.06);transform:translateY(-2px);}
.form-card strong{display:block;font-size:.98rem;color:var(--charcoal);margin-bottom:.25rem;line-height:1.3;}
.form-card span{font-size:.86rem;color:var(--text-mut);line-height:1.45;}
@media(max-width:680px){.formacion-grid{grid-template-columns:1fr;}}
.trayectoria-list{max-width:760px;margin:2rem auto 0;}
.trayectoria-list li{display:flex;gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line);align-items:flex-start;font-size:.95rem;color:var(--text-soft);}
.trayectoria-list li:last-child{border-bottom:none;}
.tray-dot{width:6px;height:6px;border-radius:50%;background:var(--sage);flex-shrink:0;margin-top:.6rem;}

/* ==== inline de adultos.html ==== */
.dificultades-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;margin-top:2rem;}
.dif-grupo{background:var(--white);border-radius:var(--radius);padding:1.6rem;border:1px solid var(--line);}
.dif-grupo h4{font-size:1rem;color:var(--teal);margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;}
.dif-grupo ul{list-style:none;padding:0;margin:0;}
.dif-grupo ul li{font-size:.93rem;color:var(--text-soft);padding:.3rem 0;padding-left:1rem;position:relative;}
.dif-grupo ul li::before{content:"·";position:absolute;left:0;color:var(--sage);}

/* ==== inline de emdr.html ==== */
.emdr-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2rem;}
@media(max-width:640px){.emdr-grid{grid-template-columns:1fr;}}
.emdr-bloque{background:var(--white);border-radius:var(--radius);padding:1.6rem;border:1px solid var(--line);}
.emdr-bloque h4{font-size:1rem;color:var(--teal);margin-bottom:.8rem;}
.emdr-bloque ul{list-style:none;padding:0;margin:0;}
.emdr-bloque ul li{font-size:.93rem;color:var(--text-soft);padding:.3rem 0;padding-left:1rem;position:relative;}
.emdr-bloque ul li::before{content:"·";position:absolute;left:0;color:var(--sage);}

/* ==== inline de crianza.html ==== */
.opciones-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;margin-top:2rem;}
@media(max-width:640px){.opciones-grid{grid-template-columns:1fr;}}
.opcion-card{background:var(--white);border-radius:var(--radius);padding:2rem;border:1px solid var(--line);display:flex;flex-direction:column;}
.opcion-card h4{font-size:1.1rem;color:var(--teal);margin-bottom:.8rem;}
.opcion-card p{font-size:.95rem;color:var(--text-soft);flex:1;}
.opcion-card .btn{margin-top:1.5rem;align-self:flex-start;}
.precios-row{display:flex;gap:1.5rem;flex-wrap:wrap;margin-top:2rem;justify-content:center;}
.precio-badge{background:var(--white);border:2px solid var(--sage-soft);border-radius:var(--radius);padding:1.4rem 2rem;text-align:center;min-width:160px;}
.precio-badge .precio{font-family:var(--serif);font-size:2.2rem;font-weight:700;color:var(--teal);}
.precio-badge span{font-size:.85rem;color:var(--text-mut);display:block;margin-top:.3rem;}

/* ==== inline de circulo-seguridad-parental.html ==== */
.cosp-sesiones{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-top:2rem;}
.cosp-sesion{background:var(--white);border-radius:14px;padding:1.2rem;border:1px solid var(--line);display:flex;gap:.8rem;align-items:flex-start;}
.cosp-num{font-family:var(--serif);font-size:1.3rem;font-weight:700;color:var(--sage);flex-shrink:0;min-width:1.8rem;}
.cosp-sesion p{font-size:.9rem;color:var(--text-soft);margin:0;}
.precio-cosp{background:linear-gradient(135deg,var(--teal),var(--teal-dark));border-radius:var(--radius);padding:2.5rem;text-align:center;color:#fff;margin-top:2rem;}
.precio-cosp .precio-grande{font-family:var(--serif);font-size:3rem;font-weight:700;display:block;}
.precio-cosp p{color:rgba(255,255,255,.85);margin:.5rem 0 0;}
.precio-cosp .descuento{background:rgba(255,255,255,.15);border-radius:30px;padding:.4rem 1rem;display:inline-block;margin-top:.8rem;font-size:.88rem;}

/* ==== inline de contacto.html ==== */
.wa-cta-block{background:var(--teal);border-radius:var(--radius);padding:2rem;color:#fff;display:flex;align-items:center;gap:1.5rem;margin-bottom:2rem;}
.wa-cta-block svg{width:40px;height:40px;flex-shrink:0;fill:#fff;}
.wa-cta-block .wa-text strong{display:block;font-size:1.1rem;margin-bottom:.3rem;}
.wa-cta-block .wa-text p{font-size:.9rem;opacity:.85;margin:0;}
.wa-cta-block .btn{flex-shrink:0;background:#fff;color:var(--teal);white-space:nowrap;}
.wa-cta-block .btn:hover{background:var(--cream);transform:translateY(-2px);}
@media(max-width:600px){.wa-cta-block{flex-direction:column;text-align:center;}.wa-cta-block .btn{align-self:stretch;}}

/* ==== inline de aviso-legal.html ==== */
.legal-content{max-width:780px;margin:0 auto;padding:3rem 0 5rem;}
.legal-content h2{font-size:1.4rem;margin:2.5rem 0 .8rem;}
.legal-content h3{font-size:1.1rem;margin:1.8rem 0 .6rem;color:var(--teal);}
.legal-content p,.legal-content li{font-size:.97rem;color:var(--text-soft);margin-bottom:.6rem;line-height:1.75;}
.legal-content ul{padding-left:1.5rem;margin-bottom:1rem;}
.legal-content a{color:var(--teal);}

/* ==== inline de cookies.html ==== */
.legal-content{max-width:780px;margin:0 auto;padding:3rem 0 5rem;}
.legal-content h2{font-size:1.4rem;margin:2.5rem 0 .8rem;}
.legal-content h3{font-size:1.1rem;margin:1.8rem 0 .6rem;color:var(--teal);}
.legal-content p,.legal-content li{font-size:.97rem;color:var(--text-soft);margin-bottom:.6rem;line-height:1.75;}
.legal-content ul{padding-left:1.5rem;margin-bottom:1rem;}
.legal-content a{color:var(--teal);}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.5rem 0;border-radius:10px;}
.legal-content table{width:100%;border-collapse:collapse;font-size:.9rem;min-width:480px;}
.legal-content table th,.legal-content table td{padding:.7rem 1rem;border:1px solid var(--line);text-align:left;vertical-align:top;}
.legal-content table th{background:var(--cream-2);font-weight:600;color:var(--charcoal);}
@media (max-width:600px){
  .legal-content table{font-size:.82rem;}
  .legal-content table th,.legal-content table td{padding:.55rem .65rem;}
}

/* ==== inline de privacidad.html ==== */
.legal-content{max-width:780px;margin:0 auto;padding:3rem 0 5rem;}
.legal-content h2{font-size:1.4rem;margin:2.5rem 0 .8rem;}
.legal-content h3{font-size:1.1rem;margin:1.8rem 0 .6rem;color:var(--teal);}
.legal-content p,.legal-content li{font-size:.97rem;color:var(--text-soft);margin-bottom:.6rem;line-height:1.75;}
.legal-content ul{padding-left:1.5rem;margin-bottom:1rem;}
.legal-content a{color:var(--teal);}
.legal-content table{width:100%;border-collapse:collapse;margin:1rem 0;}
.legal-content table th,.legal-content table td{padding:.7rem 1rem;border:1px solid var(--line);font-size:.9rem;text-align:left;}
.legal-content table th{background:var(--cream-2);font-weight:600;color:var(--charcoal);}
/* AG root fix (Bricks fuerza 62.5%) */
html{font-size:100% !important;}

/* Editor Bricks: forzar contenido visible (no depende del JS de reveal) */
body[data-builder-mode] .reveal,body[data-builder-mode] .reveal-left,body[data-builder-mode] .reveal-right{opacity:1 !important;transform:none !important;}

/* AG fix wa+precio */
.wa-cta-block .wa-text strong,.wa-cta-block .wa-text p{color:#fff !important;}
.price-card .p span{font-size:2.4rem;color:var(--teal);font-weight:700;line-height:1.1;}
.price-card .p{font-size:2.6rem;}

/* AG fix dropdown apilar (titulo+descripcion apilados como v1) */
.dropdown a{flex-direction:column;gap:.15rem;}