/* ============================================================
   Sara García · Psicóloga — CSS principal del tema
   Portado 1:1 desde la maqueta (template/Sara García - Home.html
   + colors_and_type.css). Los tokens de color y tipografía se
   mapean a las variables de preset de theme.json para una única
   fuente de verdad.
   ============================================================ */

/* ---------- TOKENS (mapeados a presets de theme.json) ---------- */
:root {
  /* Paleta de marca */
  --petroleo:        var(--wp--preset--color--petroleo);
  --petroleo-deep:   var(--wp--preset--color--petroleo-deep);
  --petroleo-soft:   var(--wp--preset--color--petroleo-soft);
  --petroleo-tint:   var(--wp--preset--color--petroleo-tint);
  --cream:           var(--wp--preset--color--cream);
  --cream-deep:      var(--wp--preset--color--cream-deep);
  --card:            var(--wp--preset--color--card);
  --sand:            var(--wp--preset--color--sand);
  --sand-soft:       var(--wp--preset--color--sand-soft);
  --terracotta:      var(--wp--preset--color--terracotta);
  --terracotta-deep: var(--wp--preset--color--terracotta-deep);
  --terracotta-tint: var(--wp--preset--color--terracotta-tint);
  --sage:            var(--wp--preset--color--sage);
  --sage-tint:       var(--wp--preset--color--sage-tint);
  --ink:             var(--wp--preset--color--ink);
  --ink-soft:        var(--wp--preset--color--ink-soft);
  --ink-faint:       var(--wp--preset--color--ink-faint);
  --on-dark:         var(--wp--preset--color--on-dark);
  --on-dark-soft:    var(--wp--preset--color--on-dark-soft);
  --border:          var(--wp--preset--color--border);
  --border-soft:     var(--wp--preset--color--border-soft);
  --bg:              var(--cream);
  --surface:         var(--card);

  /* Familias tipográficas */
  --serif-display: var(--wp--preset--font-family--cormorant);
  --sans-body:     var(--wp--preset--font-family--mulish);
  --label-caps:    var(--wp--preset--font-family--lato);

  /* Escala tipográfica */
  --fs-display:  clamp(3rem, 6vw, 5rem);
  --fs-h1:       clamp(2.4rem, 4.4vw, 3.6rem);
  --fs-h2:       clamp(1.9rem, 3vw, 2.6rem);
  --fs-h3:       1.6rem;
  --fs-h4:       1.3rem;
  --fs-lead:     1.3rem;
  --fs-body:     1.0625rem;
  --fs-small:    0.9375rem;
  --fs-label:    0.78rem;

  --lh-tight:  1.12;
  --lh-snug:   1.3;
  --lh-body:   1.75;
  --lh-loose:  1.9;
  --tracking-caps: 0.22em;

  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-spring: cubic-bezier(.32,.72,0,1);
}

/* ---------- RESET / BASE ---------- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; }
/* Desplazamiento suave en enlaces ancla (#sobre-mi, #contacto, …) y
   compensación de la cabecera fija para que la sección no quede tapada.
   Se respeta a quien prefiere reducir el movimiento. */
html { scroll-padding-top: clamp(88px, 11vh, 110px); }
body.admin-bar { scroll-padding-top: calc(clamp(88px, 11vh, 110px) + 32px); }
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
body {
  background: var(--cream);
  color: var(--ink);
  font-family: var(--sans-body);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: 400;
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--terracotta-tint); }
img { display: block; max-width: 100%; }
a { color: inherit; }

/* ---------- DEFAULTS DE ELEMENTO (de colors_and_type.css) ---------- */
h1, h2, h3, h4 {
  font-family: var(--serif-display);
  color: var(--petroleo-deep);
  font-weight: 500;
  line-height: var(--lh-tight);
  letter-spacing: 0.005em;
  text-wrap: balance;
}
h1 { font-size: var(--fs-h1); font-weight: 500; }
h2 { font-size: var(--fs-h2); }
h3 { font-size: var(--fs-h3); font-weight: 600; }
h4 { font-size: var(--fs-h4); font-family: var(--sans-body); font-weight: 700; color: var(--petroleo); }

.display {
  font-family: var(--serif-display);
  font-size: var(--fs-display);
  font-weight: 500;
  line-height: var(--lh-tight);
  color: var(--petroleo-deep);
}

.lead {
  font-size: var(--fs-lead);
  line-height: var(--lh-loose);
  color: var(--ink-soft);
  font-weight: 400;
}
p { line-height: var(--lh-body); }

.serif-quote {
  font-family: var(--serif-display);
  font-style: italic;
  font-weight: 400;
  color: var(--petroleo);
  line-height: var(--lh-snug);
}
small, .small { font-size: var(--fs-small); color: var(--ink-soft); }

/* ---------- LAYOUT ---------- */
/* position:relative + z-index:1 mantienen el contenido SIEMPRE por encima de los
   círculos decorativos (.blob es position:absolute;z-index:0, que de lo contrario
   se pinta por encima del contenido no posicionado y lo tapa). */
.wrap { max-width: 1180px; margin: 0 auto; padding: 0 28px; position: relative; z-index: 1; }
.wrap-narrow { max-width: 920px; margin: 0 auto; padding: 0 28px; position: relative; z-index: 1; }
.section { padding: clamp(76px, 11vw, 140px) 0; position: relative; }

/* ---------- Elevación suave (Soft UI) ---------- */
.soft { box-shadow: 0 2px 6px -2px rgba(52,86,95,.10), 0 24px 60px -36px rgba(52,86,95,.40); }
.soft-sm { box-shadow: 0 1px 3px -1px rgba(52,86,95,.10), 0 14px 34px -26px rgba(52,86,95,.38); }

/* ---------- Eyebrow / labels ---------- */
.eyebrow { font-family: var(--label-caps); font-size: 12.5px; font-weight: 700; letter-spacing: .22em;
  text-transform: uppercase; color: var(--terracotta); }
.eyebrow-line { display: inline-flex; align-items: center; gap: 13px; }
.eyebrow-line::before { content: ""; width: 28px; height: 1.5px; background: var(--terracotta); }
.center-head { text-align: center; max-width: 660px; margin: 0 auto clamp(48px, 6vw, 64px); }
.center-head .eyebrow { display: inline-block; }
.center-head h2 { margin: 18px 0 0; }
.center-head .lead { margin: 16px 0 0; }

/* ---------- Iconos inline ---------- */
.sg-icon { display: inline-block; vertical-align: middle; }

/* ---------- Botones ---------- */
.btn { font-family: var(--sans-body); font-weight: 700; border: 0; cursor: pointer; border-radius: 999px;
  display: inline-flex; align-items: center; gap: 10px; text-decoration: none; line-height: 1;
  font-size: 15px; padding: 15px 28px;
  transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .15s ease; }
.btn i, .btn svg { width: 18px; height: 18px; }
.btn--lg { font-size: 17px; padding: 18px 36px; }
.btn--primary { background: var(--terracotta); color: #fff; box-shadow: 0 10px 24px -14px rgba(165,100,70,.85); }
.btn--primary:hover { background: var(--terracotta-deep); box-shadow: 0 16px 30px -14px rgba(165,100,70,.9); }
.btn--primary:active { transform: translateY(1px); }
.btn--ghost { background: transparent; color: var(--petroleo); box-shadow: inset 0 0 0 1.5px var(--petroleo-tint); }
.btn--ghost:hover { background: var(--petroleo); color: var(--cream); box-shadow: inset 0 0 0 1.5px var(--petroleo); }
.btn--ghost:active { transform: translateY(1px); }
.btn--cream { background: var(--cream); color: var(--petroleo-deep); box-shadow: 0 10px 24px -14px rgba(0,0,0,.4); }
.btn--cream:hover { background: #fff; }
.btn--cream:active { transform: translateY(1px); }

/* ---------- Blobs orgánicos ---------- */
.blob { position: absolute; border-radius: 42% 58% 60% 40% / 50% 45% 55% 50%; z-index: 0; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
  [data-breathing="on"] .breathe { animation: breathe 9s ease-in-out infinite; transform-origin: center; }
  [data-breathing="on"] .breathe-slow { animation: breathe 12s ease-in-out infinite; transform-origin: center; }
  [data-breathing="on"] .breathe-rings .breathe-core { animation: breatheCore 10s cubic-bezier(.37,0,.63,1) infinite; transform-origin: center; }
  [data-breathing="on"] .breathe-rings .r2 { animation: breatheRing2 10s cubic-bezier(.37,0,.63,1) infinite; transform-origin: center; }
  [data-breathing="on"] .breathe-rings .r1 { animation: breatheRing1 10s cubic-bezier(.37,0,.63,1) infinite; transform-origin: center; }
}
@keyframes breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@keyframes breatheCore {
  0%, 100% { transform: scale(1); box-shadow: 0 0 40px -14px rgba(189,122,88,.42); }
  44%, 60% { transform: scale(1.14); box-shadow: 0 0 72px -8px rgba(189,122,88,.8); }
}
@keyframes breatheRing2 {
  0%, 100% { transform: scale(1); opacity: .5; }
  44%, 60% { transform: scale(1.16); opacity: .85; }
}
@keyframes breatheRing1 {
  0%, 100% { transform: scale(1); opacity: .3; }
  44%, 60% { transform: scale(1.24); opacity: .62; }
}

/* =================== NAV (isla flotante) =================== */
/* El sticky vive en el wrapper del template-part (hijo directo de
   .wp-site-blocks, que abarca toda la página); así la isla queda fija
   durante todo el scroll. .nav-wrap sólo centra y espacia. */
.site-header { position: sticky; top: 0; z-index: 60; display: block; }
.nav-wrap { display: flex; justify-content: center; padding: 18px 18px 0; transition: padding .4s var(--ease-out); }
.nav-wrap.scrolled { padding-top: 12px; }
.nav-island { width: 100%; max-width: 1120px; display: flex; align-items: center; justify-content: space-between; gap: 24px;
  padding: 11px 11px 11px 28px; border-radius: 999px; border: 1px solid transparent;
  transition: background .45s var(--ease-out), box-shadow .45s var(--ease-out), border-color .45s var(--ease-out), backdrop-filter .45s var(--ease-out); }
.nav-wrap.scrolled .nav-island { background: rgba(252,250,246,.82); -webkit-backdrop-filter: saturate(140%) blur(14px); backdrop-filter: saturate(140%) blur(14px);
  border-color: var(--border-soft); box-shadow: inset 0 1px 0 rgba(255,255,255,.4), 0 18px 44px -30px rgba(52,86,95,.55); }
.nav-logo-link { display: flex; flex: none; }
.nav-logo-link img { height: 40px; width: 123px; object-fit: cover; transition: height .4s var(--ease-out), width .4s var(--ease-out); }
.nav-wrap.scrolled .nav-logo-link img { height: 30px; width: 92px; }
.nav-desktop { display: flex; gap: 28px; align-items: center; }
.nav-link { position: relative; font-family: var(--label-caps); font-size: 12px; font-weight: 700; letter-spacing: .13em;
  text-transform: uppercase; color: var(--petroleo); text-decoration: none; padding: 4px 0; opacity: .82; transition: opacity .25s var(--ease-out); }
.nav-link::after { content: ""; position: absolute; left: 0; right: 0; bottom: -3px; height: 1.5px; background: var(--terracotta);
  transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease-out); }
.nav-link:hover { opacity: 1; }
.nav-link:hover::after { transform: scaleX(1); }
/* Submenú desplegable de Terapias */
.nav-item.has-sub { position: relative; display: flex; align-items: center; }
.nav-link--sub { display: inline-flex; align-items: center; gap: 5px; }
.nav-caret { opacity: .7; transition: transform .3s var(--ease-out); }
.nav-item.has-sub:hover .nav-caret, .nav-item.has-sub:focus-within .nav-caret { transform: rotate(180deg); }
.nav-sub { position: absolute; top: calc(100% + 16px); left: 50%; transform: translateX(-50%) translateY(8px);
  min-width: 268px; padding: 10px; background: rgba(252,250,246,.94);
  -webkit-backdrop-filter: saturate(140%) blur(16px); backdrop-filter: saturate(140%) blur(16px);
  border: 1px solid var(--border-soft); border-radius: 20px; box-shadow: 0 26px 52px -24px rgba(60,40,25,.42);
  display: flex; flex-direction: column; gap: 2px; z-index: 70;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .3s var(--ease-out), transform .35s var(--ease-out), visibility .3s var(--ease-out); }
.nav-sub::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; } /* puente de hover */
.nav-item.has-sub:hover .nav-sub, .nav-item.has-sub:focus-within .nav-sub {
  opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.nav-sub-link { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 13px;
  font-family: var(--sans-body); font-size: 14.5px; font-weight: 600; letter-spacing: 0; text-transform: none;
  color: var(--petroleo); text-decoration: none; white-space: nowrap;
  transition: background .25s var(--ease-out), color .25s var(--ease-out); }
.nav-sub-link:hover { background: var(--sand-soft); color: var(--petroleo-deep); }
.nav-sub-ic { width: 34px; height: 34px; flex: none; border-radius: 11px; background: var(--petroleo-tint);
  color: var(--petroleo); display: flex; align-items: center; justify-content: center; }
.nav-sub-all { margin-top: 4px; padding-top: 13px; border-top: 1px solid var(--border-soft);
  justify-content: space-between; gap: 8px; font-size: 12px; font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; color: var(--terracotta); }
.nav-sub-all:hover { background: transparent; color: var(--terracotta-deep); }
/* Sublista de terapias en el menú móvil */
.ov-sub { display: flex; flex-direction: column; gap: 12px; margin: 4px 0 8px; }
.ov-sub-link { position: relative; padding-left: 20px; font-family: var(--sans-body); font-size: 17px; font-weight: 600;
  color: var(--petroleo); opacity: .82; text-decoration: none; }
.ov-sub-link::before { content: ""; position: absolute; left: 0; top: 50%; width: 9px; height: 1.5px;
  background: var(--terracotta); transform: translateY(-50%); }
.ov-sub-link:hover { opacity: 1; }
.mag-btn { display: inline-flex; align-items: center; gap: 10px; font-family: var(--sans-body); font-weight: 700; font-size: 14.5px;
  line-height: 1; white-space: nowrap; text-decoration: none; border: 0; cursor: pointer; border-radius: 999px; padding: 7px 7px 7px 24px;
  color: #fff; background: var(--terracotta); box-shadow: 0 12px 26px -16px rgba(165,100,70,.8);
  transition: transform .4s var(--ease-spring), background .35s var(--ease-out), box-shadow .45s var(--ease-out); }
.mag-btn:hover { transform: translateY(-1px); background: var(--terracotta-deep); box-shadow: 0 20px 40px -18px rgba(165,100,70,.92); }
.mag-btn:active { transform: scale(.975); }
.mag-chip { width: 32px; height: 32px; border-radius: 999px; flex: none; display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.22); color: #fff; transition: transform .4s var(--ease-spring), background .3s var(--ease-out); }
.mag-chip i, .mag-chip svg { width: 16px; height: 16px; }
.mag-btn:hover .mag-chip { transform: translate(2px,-1px) scale(1.06); }
/* hamburguesa */
.burger { display: none; background: none; border: 0; cursor: pointer; padding: 10px; }
.burger-lines { position: relative; width: 22px; height: 14px; display: block; }
.burger-lines span { position: absolute; left: 0; height: 2px; width: 100%; border-radius: 2px; background: var(--petroleo);
  transition: transform .45s var(--ease-spring), opacity .3s ease, top .3s ease; }
.burger-lines span:nth-child(1) { top: 0; }
.burger-lines span:nth-child(2) { top: 6px; }
.burger-lines span:nth-child(3) { top: 12px; }
.burger.open .burger-lines span:nth-child(1) { top: 6px; transform: rotate(45deg); }
.burger.open .burger-lines span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.burger.open .burger-lines span:nth-child(3) { top: 6px; transform: rotate(-45deg); }
/* overlay móvil */
.menu-overlay { position: fixed; inset: 0; z-index: 55; background: rgba(246,241,234,.9); -webkit-backdrop-filter: saturate(130%) blur(16px); backdrop-filter: saturate(130%) blur(16px);
  display: flex; flex-direction: column; justify-content: center; padding: 40px 32px; opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .4s var(--ease-out), visibility .4s var(--ease-out); }
.menu-overlay.show { opacity: 1; visibility: visible; pointer-events: auto; }
.menu-overlay .ov-link { font-family: var(--serif-display); font-size: 34px; font-weight: 500; color: var(--petroleo-deep); text-decoration: none;
  padding: 12px 0; opacity: 0; transform: translateY(18px); transition: opacity .5s var(--ease-out), transform .5s var(--ease-out); }
.menu-overlay.show .ov-link { opacity: 1; transform: none; }
.menu-overlay.show .ov-link:nth-child(1) { transition-delay: .08s; }
.menu-overlay.show .ov-link:nth-child(2) { transition-delay: .14s; }
.menu-overlay.show .ov-link:nth-child(3) { transition-delay: .20s; }
.menu-overlay.show .ov-link:nth-child(4) { transition-delay: .26s; }
.menu-overlay.show .ov-link:nth-child(5) { transition-delay: .32s; }
.menu-overlay.show .ov-link:nth-child(6) { transition-delay: .38s; }
.menu-overlay .mag-btn { align-self: flex-start; margin-top: 28px; }

/* =================== HERO =================== */
.hero { position: relative; padding-top: 36px; padding-bottom: clamp(64px, 9vw, 104px); overflow: hidden; }
.hero .blob-a { width: 620px; height: 560px; background: var(--sand-soft); top: -120px; right: -160px; }
.hero .blob-b { width: 360px; height: 340px; background: var(--sage-tint); bottom: -120px; left: -130px;
  border-radius: 55% 45% 42% 58% / 48% 52% 48% 52%; opacity: .7; }
.hero-inner { position: relative; z-index: 1; display: grid; align-items: center; gap: clamp(40px, 6vw, 76px); }
.hero-copy .eyebrow { display: inline-flex; }
.hero-copy h1 { font-size: clamp(2.7rem, 5.3vw, 4.6rem); line-height: 1.05; letter-spacing: -0.02em; margin: 22px 0 0; }
.hero-copy h1 em { font-style: italic; font-weight: 500; color: var(--terracotta); }
.hero-copy .lead { margin-top: 24px; max-width: 48ch; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.hero-proof { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 30px; }
.stars { display: inline-flex; gap: 3px; }
.stars svg, .stars i { width: 17px; height: 17px; color: var(--terracotta); fill: var(--terracotta); stroke: var(--terracotta); }
.proof-txt { font-size: 14.5px; color: var(--ink-soft); }
.proof-txt strong { color: var(--petroleo-deep); font-weight: 700; }
.proof-sep { width: 1px; height: 26px; background: var(--border); }
.privacy-chip { display: inline-flex; align-items: center; gap: 8px; font-family: var(--label-caps);
  font-size: 11.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--petroleo-soft); }
.privacy-chip i, .privacy-chip svg { width: 15px; height: 15px; color: var(--sage); }

.hero-media { position: relative; }
.hero-arch-wrap { position: relative; z-index: 1; }
.hero-blob-back { position: absolute; inset: -26px -20px 30px -10px; background: var(--sand);
  border-radius: 48% 52% 46% 54% / 58% 56% 44% 42%; z-index: 0; }
[data-breathing="off"] .hero-blob-back { animation: none !important; }
.hero-portrait { position: relative; z-index: 1; width: 100%; height: auto; object-fit: cover; aspect-ratio: 4/5;
  border-radius: 30px; }
.hero-swoosh { position: absolute; z-index: 2; bottom: -16px; left: 50%; transform: translateX(-50%);
  width: 78%; height: 40px; color: var(--terracotta); opacity: .9; }
.hero-badge { position: absolute; z-index: 3; left: -26px; bottom: 54px; border-radius: 18px; padding: 14px 18px; display: flex; align-items: center; gap: 12px;
  background: rgba(252,250,246,.74); -webkit-backdrop-filter: saturate(140%) blur(14px); backdrop-filter: saturate(140%) blur(14px);
  border: 1px solid rgba(246,241,234,.5); box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 18px 44px -30px rgba(52,86,95,.55); }
.hero-badge .hb-ic { width: 42px; height: 42px; border-radius: 12px; background: var(--sage-tint);
  display: flex; align-items: center; justify-content: center; flex: none; }
.hero-badge .hb-ic i, .hero-badge .hb-ic svg { width: 22px; height: 22px; color: var(--petroleo); }
.hero-badge .hb-t { font-family: var(--serif-display); font-size: 20px; font-weight: 600; color: var(--petroleo-deep); line-height: 1; }
.hero-badge .hb-s { font-size: 12px; color: var(--ink-soft); margin-top: 3px; }

/* Hero variante A — texto izquierda / arco derecha */
html[data-hero="a"] .hero-inner { grid-template-columns: 1.04fr .96fr; }
/* Hero variante B — centrado */
html[data-hero="b"] .hero-inner { grid-template-columns: 1fr; text-align: center; gap: 0; }
html[data-hero="b"] .hero-copy { max-width: 780px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; }
html[data-hero="b"] .hero-copy .lead { max-width: 58ch; }
html[data-hero="b"] .hero-actions, html[data-hero="b"] .hero-proof { justify-content: center; }
html[data-hero="b"] .hero-media { margin: clamp(44px,6vw,60px) auto 0; width: 100%; max-width: 1080px; }
html[data-hero="b"] .hero-portrait { aspect-ratio: 16/8; border-radius: 300px 300px 34px 34px; }
html[data-hero="b"] .hero-blob-back { inset: -22px 40px 24px 40px; }
html[data-hero="b"] .hero-badge { left: 24px; }
/* Hero variante C — dividido */
html[data-hero="c"] .hero { padding-top: 0; }
html[data-hero="c"] .hero-inner { grid-template-columns: 1.02fr 1.06fr; gap: 0; align-items: stretch; }
html[data-hero="c"] .hero-media { order: -1; }
html[data-hero="c"] .hero-arch-wrap { height: 100%; }
html[data-hero="c"] .hero-portrait { height: 100%; min-height: 560px; aspect-ratio: auto; border-radius: 0 0 220px 0; }
html[data-hero="c"] .hero-blob-back, html[data-hero="c"] .hero-swoosh { display: none; }
html[data-hero="c"] .hero-copy { background: var(--sand-soft); align-self: stretch; display: flex; flex-direction: column;
  justify-content: center; padding: clamp(40px,5vw,72px); border-radius: 0 0 0 30px; }
html[data-hero="c"] .hero-copy .lead { max-width: 42ch; }
html[data-hero="c"] .hero-badge { display: none; }

/* =================== AUTHORITY STRIP =================== */
.authority { background: var(--petroleo); padding: 30px 0; }
.authority-inner { display: flex; flex-wrap: wrap; gap: 18px 40px; justify-content: center; align-items: center; }
.auth-item { display: inline-flex; align-items: center; gap: 10px; font-family: var(--label-caps); font-size: 13px;
  font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--cream); }
.auth-item i, .auth-item svg { width: 17px; height: 17px; color: var(--terracotta); }
.auth-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--on-dark-soft); opacity: .5; }

/* =================== SOCIAL PROOF =================== */
.proofband { background: var(--cream-deep); position: relative; overflow: hidden; }
.proofband .blob-x { width: 420px; height: 380px; background: var(--sand); opacity: .5; top: -120px; left: -120px; }
.proof-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(36px,5vw,60px); align-items: center; }
.rating-card { background: var(--card); border-radius: 26px; padding: 38px 36px; text-align: center; }
.rating-num { font-family: var(--serif-display); font-size: 72px; font-weight: 600; color: var(--petroleo-deep); line-height: .9; }
.rating-card .stars { margin: 14px 0 12px; justify-content: center; }
.rating-card .stars svg, .rating-card .stars i { width: 20px; height: 20px; }
.rating-meta { font-size: 14.5px; color: var(--ink-soft); }
.rating-src { margin-top: 16px; font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .16em;
  text-transform: uppercase; color: var(--terracotta); }
.mini-reviews { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mini-review { background: var(--card); border-radius: 22px; padding: 26px; display: flex; flex-direction: column; }
.mini-review .stars { margin-bottom: 14px; }
.mini-review .mr-q { font-family: var(--serif-display); font-style: italic; font-size: 18.5px; line-height: 1.5; color: var(--petroleo); margin: 0; }
.mini-review .mr-a { margin-top: 16px; font-family: var(--label-caps); font-size: 10.5px; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; color: var(--ink-faint); }

/* =================== SOBRE MÍ =================== */
.about { position: relative; overflow: hidden; }
.about .blob-y { width: 480px; height: 440px; background: var(--sage-tint); opacity: .45; bottom: -160px; right: -160px; }
.about-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(44px,6vw,76px); align-items: center; }
.about-media { position: relative; }
.about-blob-back { position: absolute; inset: 26px -22px -22px 22px; background: var(--sand-soft);
  border-radius: 52% 48% 54% 46% / 44% 56% 44% 56%; z-index: 0; }
.about-portrait { position: relative; z-index: 1; width: 100%; height: auto; aspect-ratio: 4/5; object-fit: cover;
  border-radius: 200px 30px 30px; }
.about-grid h2 { margin: 18px 0 0; }
.about-lead { font-size: 1.22rem; line-height: 1.7; color: var(--ink); margin-top: 22px; max-width: 56ch; }
.about-grid p:not(.about-lead):not(.eyebrow) { margin-top: 16px; color: var(--ink-soft); max-width: 56ch; }
.about-sign { margin-top: 26px; display: flex; align-items: center; gap: 16px; }
.about-sign .sig { font-family: var(--serif-display); font-style: italic; font-size: 30px; color: var(--petroleo); }
.about-sign .sig-s { font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--ink-faint); }
.about-cred { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.chip { font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase;
  color: var(--petroleo); background: var(--card); border-radius: 999px; padding: 10px 17px; box-shadow: inset 0 0 0 1px var(--border); }

/* =================== BREATHING MOMENT =================== */
.breathe-sec { background: var(--petroleo); position: relative; overflow: hidden; text-align: center; }
.breathe-stage { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.breathe-rings { position: relative; width: 280px; height: 280px; display: flex; align-items: center; justify-content: center; margin-bottom: 40px; }
.breathe-ring { position: absolute; border-radius: 50%; border: 1.5px solid rgba(246,241,234,.3); }
.breathe-ring.r1 { width: 280px; height: 280px; }
.breathe-ring.r2 { width: 210px; height: 210px; border-color: rgba(246,241,234,.45); }
.breathe-core { width: 150px; height: 150px; border-radius: 50%; background: var(--terracotta-tint);
  display: flex; align-items: center; justify-content: center; box-shadow: 0 0 60px -10px rgba(189,122,88,.6); }
.breathe-core span { font-family: var(--label-caps); font-size: 12px; font-weight: 700; letter-spacing: .24em;
  text-transform: uppercase; color: var(--petroleo-deep); }
.breathe-sec h2 { color: var(--cream); margin: 0; }
.breathe-sec p { color: var(--on-dark-soft); max-width: 48ch; margin: 16px auto 0; font-size: 1.15rem; }
.breathe-cue { margin-top: 22px; display: inline-flex; gap: 22px; font-family: var(--label-caps); font-size: 11px;
  font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--terracotta); }

/* =================== TERAPIAS =================== */
.therapies { position: relative; }
.therapy-list { display: flex; flex-direction: column; gap: 0; }
.therapy-row { display: grid; grid-template-columns: 56px 1fr auto; gap: 28px; align-items: center;
  padding: 30px 8px; border-top: 1px solid var(--border); text-decoration: none;
  transition: padding-left .3s cubic-bezier(.22,1,.36,1), background .3s ease; border-radius: 18px; }
.therapy-row:last-child { border-bottom: 1px solid var(--border); }
.therapy-row:hover { background: var(--sand-soft); padding-left: 22px; }
.therapy-ic { width: 56px; height: 56px; border-radius: 16px; background: var(--petroleo-tint);
  display: flex; align-items: center; justify-content: center; transition: background .3s ease; }
.therapy-ic i, .therapy-ic svg { width: 26px; height: 26px; color: var(--petroleo); }
.therapy-row:hover .therapy-ic { background: var(--terracotta-tint); }
.therapy-row:hover .therapy-ic i, .therapy-row:hover .therapy-ic svg { color: var(--terracotta-deep); }
.therapy-main h3 { font-size: 25px; margin: 0; }
.therapy-main p { margin: 6px 0 0; color: var(--ink-soft); font-size: 15.5px; max-width: 64ch; }
.therapy-go { display: inline-flex; align-items: center; gap: 9px; font-family: var(--label-caps); font-size: 11px;
  font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--terracotta); white-space: nowrap; }
.therapy-go i, .therapy-go svg { width: 16px; height: 16px; transition: transform .3s ease; }
.therapy-row:hover .therapy-go i, .therapy-row:hover .therapy-go svg { transform: translateX(5px); }

/* =================== PROCESO =================== */
.process { background: var(--cream-deep); position: relative; overflow: hidden; }
.process .blob-z { width: 380px; height: 360px; background: var(--sand); opacity: .55; top: -130px; right: -120px; }
.process-grid { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.process-step { background: var(--card); border-radius: 24px; padding: 34px 30px; position: relative; }
.process-step .ps-n { font-family: var(--serif-display); font-size: 30px; font-weight: 600; color: var(--terracotta); line-height: 1; }
.process-step .ps-ic { position: absolute; top: 30px; right: 30px; width: 24px; height: 24px; color: var(--sage); }
.process-step h3 { font-size: 21px; margin: 18px 0 10px; }
.process-step p { margin: 0; color: var(--ink-soft); font-size: 15px; line-height: 1.7; }

/* =================== TESTIMONIOS =================== */
.testi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.testi-card { background: var(--card); border-radius: 24px; padding: 34px 32px; display: flex; flex-direction: column; }
.testi-card .stars { margin-bottom: 18px; }
.testi-card .tq { font-family: var(--serif-display); font-style: italic; font-size: 20px; line-height: 1.5; color: var(--petroleo); margin: 0; }
.testi-card .ta { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--border-soft); display: flex; align-items: center; gap: 12px; }
.testi-av { width: 40px; height: 40px; border-radius: 50%; background: var(--sage-tint); display: flex; align-items: center;
  justify-content: center; font-family: var(--serif-display); font-size: 19px; font-weight: 600; color: var(--petroleo); flex: none; }
.testi-av.t2 { background: var(--terracotta-tint); color: var(--terracotta-deep); }
.testi-av.t3 { background: var(--petroleo-tint); }
.ta-name { font-weight: 700; color: var(--petroleo-deep); font-size: 14.5px; }
.ta-meta { font-size: 12.5px; color: var(--ink-faint); }

/* =================== FAQ =================== */
.faq-sec { background: var(--sand-soft); position: relative; overflow: visible; }
.faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(40px,5vw,60px); align-items: start; }
.faq-grid h2 { margin: 18px 0 0; }
.faq-grid .lead { margin-top: 16px; }
.faq-help { margin-top: 26px; display: inline-flex; align-items: center; gap: 10px; color: var(--petroleo);
  text-decoration: none; font-weight: 700; }
.faq-help i, .faq-help svg { width: 18px; height: 18px; color: var(--terracotta); }
@media (min-width: 921px) {
  #faq .faq-intro { align-self: stretch; }
  #faq .faq-intro > .faq-intro-sticky { position: sticky; top: clamp(104px, 15vh, 156px); }
}
details.faq { border-bottom: 1px solid var(--border); }
details.faq summary { list-style: none; cursor: pointer; padding: 26px 0; display: flex; align-items: center;
  justify-content: space-between; gap: 18px;
  font-family: var(--serif-display); font-size: 22px; font-weight: 600; color: var(--petroleo-deep); }
details.faq summary::-webkit-details-marker { display: none; }
/* Icono «+» en CSS (terracota, stroke 1.5) que rota a «×» al abrir */
details.faq summary::after { content: ""; flex: none; width: 24px; height: 24px; transition: transform .3s ease;
  background: no-repeat center / contain
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23BD7A58' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14'/%3E%3Cpath d='M12 5v14'/%3E%3C/svg%3E"); }
details.faq[open] summary::after { transform: rotate(45deg); }
/* compatibilidad con el markup original (span + i.fic), por si se usa core/html */
details.faq summary span { font-family: var(--serif-display); font-size: 22px; font-weight: 600; color: var(--petroleo-deep); }
details.faq summary .fic { display: none; }
details.faq .fbody { margin: 0 0 26px; color: var(--ink-soft); max-width: 64ch; }
/* core/details: el contenido va envuelto; quita márgenes por defecto */
details.faq > :not(summary) { margin-top: 0; }

/* =================== CTA =================== */
.cta-sec { position: relative; padding-top: clamp(60px, 8vw, 104px); padding-bottom: clamp(60px, 8vw, 104px); }
.cta-band { position: relative; overflow: hidden; background: var(--terracotta); border-radius: 34px;
  padding: clamp(50px,6vw,78px); text-align: center; }
.cta-band .blob-c { width: 380px; height: 360px; background: rgba(255,255,255,.12); top: -120px; right: -110px; }
.cta-band .blob-c2 { width: 280px; height: 260px; background: rgba(255,255,255,.10); bottom: -120px; left: -90px; }
.cta-band .cta-inner { position: relative; z-index: 1; }
.cta-band h2 { color: #fff; margin: 0; font-size: clamp(2rem, 3.6vw, 3rem); }
.cta-band p { color: rgba(255,255,255,.9); max-width: 52ch; margin: 16px auto 0; font-size: 1.18rem; }
.cta-band .btn { margin-top: 32px; }

/* =================== CONTACTO =================== */
.contact { background: var(--petroleo); position: relative; overflow: hidden; }
.contact .blob-k { width: 460px; height: 420px; background: rgba(140,157,136,.16); bottom: -180px; right: -160px; }
.contact .blob-j { width: 380px; height: 360px; background: rgba(189,122,88,.10); top: -150px; left: -140px; border-radius: 55% 45% 42% 58% / 48% 52% 48% 52%; }
.contact .eyebrow { color: var(--terracotta); }
.contact h2 { color: var(--cream); margin: 18px 0 0; }
.contact-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .98fr 1.02fr; gap: clamp(40px,5vw,64px); align-items: start; }
.contact-info { display: flex; flex-direction: column; }
.contact-info > p { color: var(--on-dark-soft); margin: 18px 0 0; max-width: 46ch; font-size: 1.05rem; }
.contact-points { margin-top: 28px; display: flex; flex-direction: column; gap: 15px; }
.cpoint { display: flex; align-items: center; gap: 13px; color: var(--on-dark); font-size: 15.5px; }
.cpoint i, .cpoint > svg { width: 19px; height: 19px; color: var(--terracotta); flex: none; }
.cpoint .ibrand { display: inline-flex; }
.cpoint .ibrand svg { width: 19px; height: 19px; color: var(--terracotta); }
.contact-media { position: relative; margin-top: 30px; aspect-ratio: 16/10; border-radius: 24px; overflow: hidden; }
.contact-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.form-card { background: var(--card); border-radius: 28px; padding: clamp(30px,4vw,44px); }
.form-card h3 { font-size: 25px; margin: 0 0 6px; }
.form-card .sub { color: var(--ink-soft); font-size: 15px; margin: 0 0 26px; }
.field { margin-bottom: 18px; }
.field label { display: block; font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--petroleo-soft); margin-bottom: 8px; }
.field input, .field select, .field textarea { width: 100%; font-family: var(--sans-body); font-size: 16px; color: var(--ink);
  background: var(--cream); border: 1px solid var(--border); border-radius: 14px; padding: 14px 16px;
  transition: border-color .2s ease, box-shadow .2s ease; }
.field select { -webkit-appearance: none; -moz-appearance: none; appearance: none; cursor: pointer;
  padding-right: 44px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23BD7A58' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 16px center; }
.field select::-ms-expand { display: none; }
.field select option { color: var(--ink); background: var(--card); }
.field textarea { resize: vertical; min-height: 80px; line-height: 1.55; }
.field input:focus, .field select:focus, .field textarea:focus { outline: none; border-color: var(--petroleo);
  box-shadow: 0 0 0 3px var(--petroleo-tint); }
.field select:hover { border-color: var(--petroleo-soft); }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-card .btn { width: 100%; justify-content: center; margin-top: 6px; }
.form-note { font-size: 12.5px; color: var(--ink-faint); text-align: center; margin: 16px 0 0; line-height: 1.55;
  display: flex; align-items: center; justify-content: center; gap: 7px; }
.form-note i, .form-note svg { width: 14px; height: 14px; color: var(--sage); flex: none; }

/* =================== FOOTER =================== */
footer.foot, .foot { background: var(--petroleo-deep); color: var(--on-dark); padding: 78px 0 36px; }
.foot-top { display: flex; flex-wrap: wrap; gap: 48px; justify-content: space-between;
  padding-bottom: 46px; border-bottom: 1px solid rgba(246,241,234,.16); }
.foot-brand { max-width: 310px; }
.foot-brand .foot-logo { height: 82px; width: auto; display: block; }
.foot-brand .name { font-family: var(--serif-display); font-size: 32px; color: var(--cream); font-weight: 500; }
.foot-brand .sub { font-family: var(--label-caps); letter-spacing: .24em; font-size: 11px; color: var(--on-dark-soft); margin-top: 4px; }
.foot-brand p { color: var(--on-dark-soft); font-size: 14.5px; line-height: 1.7; margin-top: 18px; }
.foot-col h4 { font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--cream); margin: 0 0 16px; }
.foot-col a, .foot-line { display: flex; align-items: center; gap: 10px; padding: 6px 0; color: var(--on-dark-soft);
  font-size: 14.5px; text-decoration: none; transition: color .2s ease; }
.foot-col a:hover { color: var(--cream); }
.foot-line i, .foot-line svg { width: 16px; height: 16px; color: var(--on-dark-soft); }
.socials { display: flex; gap: 12px; margin-top: 18px; }
.soc { width: 42px; height: 42px; border-radius: 999px; display: flex; align-items: center; justify-content: center;
  background: rgba(246,241,234,.12); color: var(--cream); transition: background .25s ease, color .25s ease; }
.soc svg { width: 18px; height: 18px; }
.soc:hover { background: var(--cream); color: var(--petroleo); }
.foot-bottom { display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: center;
  padding-top: 26px; font-size: 13px; color: var(--on-dark-soft); }
.foot-bottom a { color: var(--on-dark-soft); text-decoration: none; }
.foot-bottom a:hover { color: var(--cream); }
.foot-bottom .legal { display: flex; gap: 20px; }

/* Kit Digital — distintivo de cofinanciación */
.foot-kit { display: flex; flex-direction: column; align-items: center; gap: 14px;
  margin-top: 44px; padding-top: 40px; border-top: 1px solid rgba(246,241,234,.16); text-align: center; }
.foot-kit__label { font-family: var(--label-caps); letter-spacing: .2em; font-size: 10.5px;
  text-transform: uppercase; color: var(--on-dark-soft); }
.foot-kit__card { display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border-radius: 16px; padding: 14px 30px; max-width: min(620px, 92%);
  box-shadow: 0 1px 2px rgba(20,36,41,.18), 0 22px 50px -30px rgba(0,0,0,.7);
  transition: transform .25s ease, box-shadow .25s ease; }
.foot-kit__card img { display: block; height: 38px; width: auto; max-width: 100%; }
a.foot-kit__card:hover { transform: translateY(-2px);
  box-shadow: 0 1px 2px rgba(20,36,41,.18), 0 26px 56px -28px rgba(0,0,0,.78); }
@media (max-width: 560px) {
  .foot-kit { margin-top: 32px; padding-top: 30px; }
  .foot-kit__card { padding: 12px 18px; }
  .foot-kit__card img { height: auto; width: 100%; }
}

/* =================== GLASS =================== */
.glass {
  background: rgba(252, 250, 246, 0.82);
  -webkit-backdrop-filter: saturate(140%) blur(14px);
  backdrop-filter: saturate(140%) blur(14px);
  border: 1px solid rgba(246, 241, 234, 0.5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4),
              0 18px 44px -30px rgba(52, 86, 95, 0.55);
}
.glass--dark {
  background: rgba(52, 86, 95, 0.55);
  border-color: rgba(255, 255, 255, 0.12);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16),
              0 18px 44px -30px rgba(20, 36, 41, 0.7);
}
.faq-card { background: var(--card); border: 1px solid var(--border-soft); border-radius: 24px; padding: 6px 32px;
  box-shadow: 0 1px 3px -1px rgba(52,86,95,.10), 0 20px 50px -38px rgba(52,86,95,.4); }
.faq-card details.faq:last-child { border-bottom: 0; }

@media (prefers-reduced-transparency: reduce) {
  .glass, .nav-wrap.scrolled .nav-island, .hero-badge, .menu-overlay {
    -webkit-backdrop-filter: none; backdrop-filter: none;
  }
  .glass, .nav-wrap.scrolled .nav-island, .hero-badge { background: #FCFAF6; }
  .glass--dark { background: var(--petroleo); }
  .menu-overlay { background: #F6F1EA; }
}

/* =================== REVEAL =================== */
@media (prefers-reduced-motion: no-preference) {
  body.js-reveal .reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s cubic-bezier(.22,1,.36,1); }
  body.js-reveal .reveal.in { opacity: 1; transform: none; }
}

/* =================== ACCESIBILIDAD =================== */
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--petroleo); color: var(--cream);
  padding: 12px 20px; border-radius: 0 0 12px 0; font-family: var(--label-caps); font-weight: 700; letter-spacing: .1em;
  text-transform: uppercase; font-size: 12px; text-decoration: none; }
.skip-link:focus { left: 0; }
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2.5px solid var(--terracotta-deep); outline-offset: 2px; border-radius: 4px;
}
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; width: 1px;
  margin: -1px; overflow: hidden; padding: 0; position: absolute; word-wrap: normal !important; }
/* Offset del sticky nav cuando hay barra de admin */
body.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { body.admin-bar .site-header { top: 46px; } }

/* =================== INTEGRACIÓN CON BLOQUES WP =================== */
/* blockGap está en 0 (theme.json): todo el espaciado proviene de los
   márgenes explícitos portados de la maqueta, como en el original.
   Aquí sólo restauramos los gaps de los bloques core del blog y limpiamos
   algún resto de envoltorio de bloque. */

/* Secciones a sangre, sin margen entre bandas (guard) */
#sg-main > * { margin-block: 0; }

/* Botón core con aspecto .btn */
.wp-block-button.btn-wrap { margin: 0; }
.wp-block-button__link.btn { text-decoration: none; }

/* Imágenes de bloque dentro de marcos a medida */
figure.wp-block-image { margin: 0; }
/* Centrado de imágenes con "Alinear: centro" fuera de un contenedor restringido */
figure.wp-block-image.aligncenter { margin-left: auto; margin-right: auto; }
.hero-media figure, .about-media figure, .contact-media figure { margin: 0; width: 100%; }

/* Rejilla y paginación del blog (gaps explícitos al estar blockGap a 0) */
.wp-block-post-template.posts-grid { gap: 28px; }
.wp-block-query-pagination { gap: 8px 14px; margin-top: 8px; }
.wp-block-query-pagination .wp-block-query-pagination-numbers,
.wp-block-query-pagination a, .wp-block-query-pagination .current { font-family: var(--label-caps); font-weight: 700; letter-spacing: .06em; }
.wp-block-comments .wp-block-columns { gap: 16px; }
.wp-block-comment-template li { margin-bottom: 26px; }

/* =================== CONTACT FORM 7 =================== */
.wpcf7 { font-family: var(--sans-body); }
.wpcf7-form p { margin: 0; }
.wpcf7 .field input, .wpcf7 .field select, .wpcf7 .field textarea { width: 100%; }
.wpcf7-form .wpcf7-form-control-wrap { display: block; }
.wpcf7 .consent { display: flex; align-items: flex-start; gap: 10px; margin: 4px 0 8px; font-size: 13px; color: var(--ink-soft); line-height: 1.5; }
.wpcf7 .consent input[type="checkbox"] { width: 18px; height: 18px; margin-top: 2px; flex: none; accent-color: var(--terracotta); }
.wpcf7 .consent a { color: var(--petroleo); text-decoration: underline; }
.wpcf7-not-valid-tip { color: var(--terracotta-deep); font-size: 12.5px; margin-top: 6px; display: block; }
.wpcf7 .wpcf7-not-valid { border-color: var(--terracotta-deep) !important; box-shadow: 0 0 0 3px var(--terracotta-tint) !important; }
.wpcf7-response-output { margin: 14px 0 0 !important; border-radius: 12px; padding: 12px 16px !important; font-size: 14px; border-width: 1px !important; }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output { border-color: var(--terracotta) !important; background: var(--terracotta-tint); color: var(--terracotta-deep); }
.wpcf7 form.sent .wpcf7-response-output { border-color: var(--sage) !important; background: var(--sage-tint); color: var(--petroleo-deep); }
.wpcf7-spinner { margin: 0 auto; }
/* Honeypot oculto */
.wpcf7 .hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* =================== BANNER DE COOKIES =================== */
.cookie-banner { position: fixed; left: 0; right: 0; bottom: 0; z-index: 80; padding: 16px; display: flex; justify-content: center; }
.cookie-banner[hidden] { display: none; }
.cookie-banner__inner { width: 100%; max-width: 1120px; background: var(--card); border: 1px solid var(--border-soft);
  border-radius: 18px; box-shadow: 0 18px 44px -28px rgba(52,86,95,.55); padding: 18px 22px;
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px 24px; justify-content: space-between; }
.cookie-banner__text { margin: 0; font-size: 14px; color: var(--ink-soft); max-width: 70ch; }
.cookie-banner__text a { color: var(--petroleo); text-decoration: underline; }
.cookie-banner__actions { display: flex; gap: 10px; flex: none; }
.cookie-banner__actions .btn { font-size: 14px; padding: 11px 22px; }

/* =================== CONTENIDO DE PÁGINA/BLOG =================== */
.page-hero { background: var(--cream-deep); position: relative; overflow: hidden; }
.page-hero .wrap { position: relative; z-index: 1; text-align: center; padding-top: clamp(120px,16vh,180px); padding-bottom: clamp(48px,7vw,80px); }
.page-hero .eyebrow { display: inline-block; }
.page-hero h1 { margin: 16px 0 0; }
.page-hero .lead { margin: 16px auto 0; max-width: 60ch; }
.prose { max-width: 760px; margin: 0 auto; }
.prose > * { margin-top: 0; }
.prose h2 { font-size: var(--fs-h2); margin: 1.6em 0 .5em; }
.prose h3 { margin: 1.4em 0 .4em; }
.prose p { margin: 0 0 1.1em; color: var(--ink-soft); }
.prose ul, .prose ol { color: var(--ink-soft); margin: 0 0 1.1em; padding-left: 1.3em; }
.prose li { margin-bottom: .5em; }
.prose a { color: var(--petroleo); text-decoration: underline; text-underline-offset: 3px; }
.prose strong { color: var(--ink); }
.draft-note { background: var(--sand-soft); border: 1px dashed var(--border); border-radius: 14px; padding: 14px 18px;
  font-size: 13.5px; color: var(--ink-soft); margin: 0 0 28px; }

/* Tarjetas de entrada (blog) */
.posts-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.post-card { background: var(--card); border-radius: 22px; overflow: hidden; display: flex; flex-direction: column;
  box-shadow: 0 1px 3px -1px rgba(52,86,95,.10), 0 14px 34px -26px rgba(52,86,95,.38); }
.post-card .pc-media { aspect-ratio: 16/10; overflow: hidden; background: var(--sand-soft); }
.post-card .pc-media img { width: 100%; height: 100%; object-fit: cover; }
.post-card .pc-body { padding: 24px 26px 28px; display: flex; flex-direction: column; flex: 1; }
.post-card .pc-meta { font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--terracotta); }
.post-card h3 { font-size: 21px; margin: 10px 0 8px; }
.post-card p { color: var(--ink-soft); font-size: 15px; margin: 0 0 16px; }

/* =================== RESPONSIVE =================== */
@media (max-width: 1000px) {
  .nav-desktop, .nav-cta { display: none !important; }
  .burger { display: inline-flex !important; }
}
@media (max-width: 920px) {
  html[data-hero] .hero-inner { grid-template-columns: 1fr !important; justify-items: center; }
  /* Hero apilado en tablet: copy + retrato centrados y equilibrados */
  html[data-hero="a"] .hero-copy, html[data-hero="b"] .hero-copy { display: flex; flex-direction: column; align-items: center; text-align: center; max-width: 640px; }
  html[data-hero="a"] .hero-copy .lead, html[data-hero="b"] .hero-copy .lead { margin-left: auto; margin-right: auto; }
  html[data-hero="a"] .hero-actions, html[data-hero="b"] .hero-actions,
  html[data-hero="a"] .hero-proof, html[data-hero="b"] .hero-proof { justify-content: center; }
  html[data-hero="c"] .hero-copy { border-radius: 0 0 30px 30px; }
  html[data-hero="c"] .hero-portrait { min-height: 400px; border-radius: 0; }
  .proof-grid, .about-grid, .faq-grid, .contact-grid { grid-template-columns: 1fr; }
  .process-grid { grid-template-columns: 1fr; }
  .testi-grid { grid-template-columns: 1fr; }
  .posts-grid { grid-template-columns: 1fr 1fr; }
  .about-media { max-width: 460px; margin-inline: auto; }
  .about-grid { justify-items: center; }
  .about-grid > :not(.about-media) { width: 100%; max-width: 640px; }
  .hero-media { max-width: 440px; margin-inline: auto; }
  html[data-hero="a"] .hero-badge, html[data-hero="b"] .hero-badge { left: 12px; }
  html[data-hero="c"] .hero-media { max-width: none; }
}
@media (max-width: 600px) {
  .mini-reviews { grid-template-columns: 1fr; }
  .field-row { grid-template-columns: 1fr; }
  .therapy-row { grid-template-columns: 48px 1fr; }
  .therapy-go { display: none; }
  .wrap, .wrap-narrow { padding: 0 20px; }
  .hero-badge { display: none; }
  .proof-sep { display: none; }
  .posts-grid { grid-template-columns: 1fr; }
  .cookie-banner__inner { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   COMPONENTES DE PÁGINAS INTERNAS (aditivos, on-brand)
   ============================================================ */

/* ---------- Señales / check-list ---------- */
.signals-card { background: var(--card); border-radius: 26px; padding: clamp(30px,4vw,46px);
  max-width: 940px; margin: 0 auto; box-shadow: 0 2px 6px -2px rgba(52,86,95,.10), 0 24px 60px -36px rgba(52,86,95,.40); }
.check-list { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 34px; margin: 0; padding: 0; list-style: none; }
.check-item { display: flex; align-items: flex-start; gap: 13px; color: var(--ink); font-size: 1.04rem; line-height: 1.5; margin: 0; }
.check-item .ck { flex: none; width: 28px; height: 28px; border-radius: 999px; margin-top: 2px;
  background: var(--sage-tint) no-repeat center / 16px 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%232A464E' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-4-4'/%3E%3C/svg%3E"); }
.check-note { margin: 28px 0 0; text-align: center; color: var(--ink-soft); font-size: 15px; }
.check-note a { color: var(--petroleo); font-weight: 700; text-decoration: none; }
.check-note a:hover { color: var(--terracotta); }
@media (max-width: 720px) { .check-list { grid-template-columns: 1fr; gap: 14px; } }

/* ---------- Tarjetas de enfoque (EMDR / IFS / Parcuve) y valores ---------- */
.method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.method-grid.cols-2 { grid-template-columns: repeat(2, 1fr); max-width: 820px; margin: 0 auto; }
.method-card { background: var(--card); border-radius: 24px; padding: 34px 32px; display: flex; flex-direction: column;
  box-shadow: 0 1px 3px -1px rgba(52,86,95,.10), 0 14px 34px -26px rgba(52,86,95,.38); }
.method-card .m-ic { width: 52px; height: 52px; border-radius: 15px; background: var(--petroleo-tint);
  display: flex; align-items: center; justify-content: center; margin-bottom: 20px; }
.method-card .m-ic svg { width: 25px; height: 25px; color: var(--petroleo); }
.method-card .m-tag { font-family: var(--label-caps); font-size: 10.5px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--terracotta); margin-bottom: 8px; }
.method-card h3 { font-size: 22px; margin: 0 0 10px; }
.method-card p { margin: 0; color: var(--ink-soft); font-size: 15px; line-height: 1.7; }
@media (max-width: 920px) { .method-grid, .method-grid.cols-2 { grid-template-columns: 1fr; } }

/* ---------- Trayectoria / formación ---------- */
.timeline { max-width: 760px; margin: 0 auto; }
.tl-step { position: relative; padding: 0 0 34px 40px; border-left: 1.5px solid var(--border); }
.tl-step:last-child { padding-bottom: 0; border-left-color: transparent; }
.tl-step::before { content: ""; position: absolute; left: -8px; top: 3px; width: 15px; height: 15px;
  border-radius: 999px; background: var(--terracotta); box-shadow: 0 0 0 5px var(--cream); }
.tl-step .tl-when { font-family: var(--label-caps); font-size: 11px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--terracotta); }
.tl-step h3 { font-size: 21px; margin: 6px 0 7px; }
.tl-step p { margin: 0; color: var(--ink-soft); font-size: 15.5px; line-height: 1.7; }

/* ---------- Nube de motivos de consulta ---------- */
.topic-cloud { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; max-width: 860px; margin: 0 auto; }
.topic-cloud .chip { font-size: 13px; padding: 12px 20px; }

/* ---------- Nota destacada (cita serif) ---------- */
.note-card { max-width: 820px; margin: 0 auto; text-align: center; }
.note-card .serif-quote { font-size: clamp(1.5rem, 2.6vw, 2rem); display: block; }
.note-card .nc-sign { margin-top: 22px; font-family: var(--label-caps); font-size: 11px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--ink-faint); }

/* ---------- Acciones de opiniones ---------- */
.review-cta { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; margin-top: 32px; }

/* ---------- Imagen + texto invertido y checklist dentro de about-grid ---------- */
.about-grid.media-right { grid-template-columns: 1.1fr .9fr; }
.about-grid .check-list { grid-template-columns: 1fr; gap: 13px; margin-top: 24px; }
.about-grid .check-note { text-align: left; margin-top: 22px; }
.about-grid .hero-actions { margin-top: 28px; }
@media (max-width: 920px) { .about-grid.media-right { grid-template-columns: 1fr; } }

/* =================== ALTERNANCIA DE FONDO (páginas internas reordenadas) ===================
   Sobrescriben el fondo que trae cada sección por su clase semántica (.process, .proofband,
   .faq-sec…) para mantener el ritmo claro→oscuro→claro cuando se reordenan las secciones.
   Especificidad .section.tone-* (0,2,0) > .process/.proofband/.faq-sec (0,1,0). */
.section.tone-light { background: var(--cream); }
.section.tone-deep  { background: var(--cream-deep); }