/* ==========================================================================
   Bloques nativos de WordPress con el estilo de RkVoiceLab.
   Hace que el contenido editable (grupos, párrafos, botones, detalles, columnas)
   se vea como el diseño original, reutilizando las clases de style.css.
   ========================================================================== */

/* El contenido de la página fluye a todo el ancho; las secciones (grupos con
   tagName section) ya llevan su padding vía la regla `section` de style.css. */
.entry-content > *{ margin-block:0; }

/* Menú superior en UNA sola línea. A 1080px de ancho los 9 enlaces se partían en
   dos líneas (también en la web original), lo que desalinea y engorda la barra.
   Enlaces sin cortar + separación algo menor para que quepan en una línea. */
.nav-links{ gap:18px; flex-shrink:0; }
.nav-links a{ white-space:nowrap; }

/* Barra de navegación fija al hacer scroll. El sticky debe ir en el ENVOLTORIO
   del template-part (hijo de .wp-site-blocks, de altura completa); si se deja
   solo en <header class="nav">, su padre (el wrapper) mide ~64px y el sticky se
   agota. WordPress ignora el className del template-part, así que seleccionamos
   el wrapper por su contenido con :has(). */
.wp-block-template-part:has(> header.nav){ position:sticky; top:0; z-index:60; }

/* --- Ritmo vertical ---
   El original usaba *{margin:0} y espaciaba a mano; con blockGap 0 (theme.json)
   replicamos esa base para que las estructuras internas queden tan compactas
   como el original. Aquí devolvemos SOLO los márgenes de intro de sección que en
   el original iban en estilos inline (título, lead, párrafos sueltos a nivel de
   .wrap). Las rejillas/botones/columnas conservan el margen de su clase. */
.wrap > :first-child{ margin-top:0; }
.wrap > .eyebrow{ margin-top:0; }
.wrap > .wp-block-heading{ margin-top:18px; }
.wrap > .lead{ margin-top:16px; }
.wrap > p:not(.lead):not(.eyebrow){ margin-top:14px; }

/* --- Eyebrow: el punto verde se pinta solo (sin <span class="dot">) --- */
.eyebrow:not(:has(.dot))::before{
  content:""; width:7px; height:7px; border-radius:50%;
  background:var(--accent); flex:0 0 auto;
}

/* --- Botones nativos (core/button) con aspecto .btn --- */
.wp-block-button__link{
  font-family:var(--body); font-size:16px; font-weight:600;
  padding:15px 26px; border-radius:14px; border:1.5px solid transparent;
  transition:transform .15s,background .2s,border-color .2s,box-shadow .2s;
}
.wp-block-button.btn-primary .wp-block-button__link,
.wp-block-button.is-style-primary .wp-block-button__link{
  background:var(--accent); color:#fff; box-shadow:0 6px 18px rgba(94,140,121,.22);
}
.wp-block-button.btn-primary .wp-block-button__link:hover,
.wp-block-button.is-style-primary .wp-block-button__link:hover{
  background:var(--accent-d); transform:translateY(-2px); box-shadow:0 10px 24px rgba(94,140,121,.30);
}
.wp-block-button.btn-ghost .wp-block-button__link,
.wp-block-button.is-style-ghost .wp-block-button__link{
  background:transparent; border-color:var(--line); color:var(--ink);
}
.wp-block-button.btn-ghost .wp-block-button__link:hover,
.wp-block-button.is-style-ghost .wp-block-button__link:hover{
  border-color:var(--accent); color:var(--accent-ink);
}
.wp-block-button__link:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }

/* Botones dentro de la banda oscura (CTA final): texto en blanco */
.band .wp-block-button.btn-ghost .wp-block-button__link{ border-color:rgba(255,255,255,.35); color:#fff; }
.band .wp-block-button.btn-ghost .wp-block-button__link:hover{ border-color:#fff; color:#fff; }
.band .wp-block-button.btn-primary .wp-block-button__link{ background:var(--accent); color:#fff; }
.band .wp-block-button.btn-primary .wp-block-button__link:hover{ background:#6fa38f; }

/* Fila de botones: separación como en el original */
.wp-block-buttons.cta-row,.wp-block-buttons.band-ctas{ gap:14px; margin-top:34px; }

/* --- Grupos de tarjetas: usan las clases existentes (.grid-stats, .cards, .plans,
   .steps, .options). Los grupos internos (.stat, .plan, .step, .opt-card) también.
   Solo hace falta neutralizar el gap por defecto del bloque group. --- */
.wp-block-group.grid-stats,.wp-block-group.cards,.wp-block-group.plans,
.wp-block-group.steps,.wp-block-group.options{ display:grid; }

/* Párrafos dentro de las tarjetas de stat: reutilizan .stat .n/.t/.d */
.stat .n,.stat .t,.stat .d,.plan .price,.step p{ margin:0; }

/* --- Acordeón: bloque nativo Detalles (core/details) con aspecto FAQ --- */
.faq .wp-block-details{ border-bottom:1px solid var(--line); }
.faq .wp-block-details summary{
  list-style:none; cursor:pointer; padding:22px 0;
  font-family:var(--body); font-size:18px; font-weight:600; color:var(--ink);
  display:flex; justify-content:space-between; gap:16px; align-items:center;
}
.faq .wp-block-details summary::-webkit-details-marker{ display:none; }
.faq .wp-block-details summary::after{
  content:"+"; color:var(--accent); font-size:22px; line-height:1; transition:transform .25s; flex-shrink:0;
}
.faq .wp-block-details[open] summary::after{ transform:rotate(45deg); }
.faq .wp-block-details > *:not(summary){ color:var(--muted); font-size:16px; padding:0 0 22px; margin:0; }

/* --- Tarjetas de desequilibrio: cara visible (chip + título + quote) y un
   desplegable dentro con "la ciencia" (diag + equilibrio + enlace). --- */
.card{ display:flex; flex-direction:column; }
.card > .wp-block-heading{ margin-bottom:6px; }
.card .say{ margin:0; }
/* Chips de color por desequilibrio (el número es editable; el color es diseño) */
.card .chip{ margin-bottom:14px; }
.chip-1{ background:#D9A441; }
.chip-2{ background:#D98841; }
.chip-3{ background:#5A93C4; }
.chip-4{ background:#8E79C4; }
/* El desplegable "la ciencia de esto" dentro de la tarjeta */
.card .wp-block-details{ margin-top:14px; }
.card .wp-block-details summary{
  list-style:none; cursor:pointer; font-size:13px; font-weight:600; color:var(--muted);
}
.card .wp-block-details[open] summary{ color:var(--accent-ink); }
.card .wp-block-details summary::-webkit-details-marker{ display:none; }
.card .wp-block-details summary::after{ content:"  +"; color:var(--accent); font-weight:700; }
.card .wp-block-details[open] summary::after{ content:"  −"; }
.card .wp-block-details > *:not(summary){ margin-top:9px; font-size:14.5px; color:var(--accent-ink); font-weight:500; }
.card .wp-block-details .eq{ color:var(--accent-ink); }
.card .wp-block-details a{ color:var(--accent-ink); border-bottom:1.5px solid var(--soft); }
.card .wp-block-details a:hover{ border-color:var(--accent); }

/* --- Retrato de Raquel: columnas nativas + imagen --- */
.founder .wp-block-columns{ gap:40px; align-items:center; }
.founder .wp-block-image img{ border-radius:24px; }

/* --- Auxiliares --- */
/* Banda con fondo de superficie (secciones que en el original iban con estilo inline) */
.band-surface{ background:var(--surface); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
/* FAQ más estrecha, como el original */
.faq-narrow{ max-width:760px; }
/* Línea de confianza del hero con párrafos en vez de spans */
.trust p{ margin:0; display:inline-flex; align-items:center; gap:8px; }
.trust p b{ color:var(--ink); font-weight:600; }
/* Chip de color de las tarjetas de desequilibrio (opcional, dentro del summary) */
.cards .wp-block-details summary .chip{ margin-bottom:0; }
/* Nota pequeña bajo los planes */
.nota-plazas{ margin-top:18px; font-size:13px; color:var(--muted); }

/* Laboratorio: eyebrow blanco sobre la banda oscura del CTA "prueba" */
.band .eyebrow{ background:rgba(255,255,255,.12); color:#fff; }
.band .eyebrow::before{ background:#fff; }

/* ===== Laboratorio: mapa y Óyelo como bloques nativos ===== */
/* Color de acento por desequilibrio (--ec), reutilizable en tarjetas y audios. */
.acc-warm{ --ec:var(--c-warm); } .acc-light{ --ec:var(--c-light); }
.acc-pressed{ --ec:var(--c-pressed); } .acc-shout{ --ec:var(--c-shout); } .acc-flip{ --ec:var(--c-flip); }

/* Mapa: la clase .lab-card ya la estila style.css (borde superior --ec, chip, etc.).
   El desplegable pasa a ser un <details> nativo. */
.wp-block-group.lab-cards{ display:grid; }
.lab-card .chip{ margin-bottom:12px; }
.lab-card .say{ margin:0; }
.lab-card .wp-block-details{ margin-top:12px; }
.lab-card .wp-block-details summary{ list-style:none; cursor:pointer; font-size:13px; font-weight:600; color:var(--muted); }
.lab-card .wp-block-details[open] summary{ color:var(--ec); }
.lab-card .wp-block-details summary::-webkit-details-marker{ display:none; }
.lab-card .wp-block-details summary::after{ content:"  +"; color:var(--ec); font-weight:700; }
.lab-card .wp-block-details[open] summary::after{ content:"  −"; }
.lab-card .wp-block-details .lbl{ display:block; font-weight:600; color:var(--ink); font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; margin:12px 0 2px; }
.lab-card .wp-block-details .lbl:first-child{ margin-top:9px; }
.lab-card .wp-block-details p{ color:var(--muted); font-size:14.5px; margin:0; }
.lab-card .wp-block-details .eq{ color:var(--accent-ink); font-weight:500; }

/* Óyelo: el <audio> nativo (editable) queda OCULTO; el tema le pone un botón con
   icono play/pause (look original) y un script lo reproduce/pausa (ver app.js). */
.wp-block-group.hear-grid{ display:grid; }
.hear-item{ position:relative; background:var(--bg); border:1.5px solid var(--line); border-radius:14px; padding:16px 18px 16px 68px; border-left:5px solid var(--ec,var(--accent)); cursor:pointer; transition:border-color .18s,transform .18s,box-shadow .18s; }
.hear-item:hover{ border-color:var(--ec,var(--accent)); transform:translateY(-2px); }
.hear-item.playing{ box-shadow:0 0 0 2px var(--ec,var(--accent)) inset; }
.hear-item .wp-block-audio, .hear-item audio{ display:none; }
.hear-item .ico{ position:absolute; left:16px; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:50%; background:var(--ec,var(--accent)); color:#fff; display:grid; place-items:center; }
.hear-item .ico svg{ width:16px; height:16px; display:block; }
.hear-item .wp-block-heading{ font-size:15.5px; margin:0; color:var(--ink); }
.hear-item p{ font-size:13px; color:var(--muted); margin:2px 0 0; }
.hear-item.free{ background:var(--soft); border-left-color:var(--accent); }
.hear-item.free .ico{ background:var(--accent); }
.hear-item.free .wp-block-heading{ color:var(--accent-ink); }
.hear > .hear-item.free{ margin-bottom:14px; }

/* ===== Página: Teoría (compartido con Prácticos: .gallery, .topics) =====
   Mismo motivo que .grid-stats/.cards/.plans/.steps/.options arriba: la clase
   ya trae su display:grid en style.css, pero se refuerza sobre el grupo nativo
   para que el layout por defecto del bloque (core/group) no lo tape. */
.wp-block-group.gallery,.wp-block-group.topics{ display:grid; }
/* "split" (Teoría vs Prácticas) usa bloque nativo de columnas, no de grupo */
.wp-block-columns.split{ display:grid; }

/* ===== Página: Prácticos ===== */
.wp-block-group.vfeatured{ display:grid; }

/* ===== Página: Diagnóstico ===== */
.wp-block-group.say-grid,.wp-block-group.proof,.wp-block-group.form-wrap{ display:grid; }

/* ===== Blog / Diario =====
   Portado del Diario original (web estatica). Reutiliza los tokens --c-* y las
   variables del tema. Las clases que chocan con estilos ya existentes del tema
   (.tag pill dorada, .vframe 9/16 de Practicos, .band tarjeta oscura, .grid)
   se scopan bajo .dcard / .dsingle / .dhero / .diario para no romperlos. */

/* --- Cabecera del Diario (dhero): eyebrow plano en mayusculas, no la pill --- */
.dhero{ padding:64px 0 12px; }
.dhero .eyebrow{
  background:none; padding:0; border-radius:0;
  font-size:13px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--accent-ink); font-weight:600; margin-bottom:14px;
}
.dhero h1{ font-size:clamp(32px,5vw,48px); margin-bottom:14px; }
.dhero .lead{ font-size:18px; color:var(--muted); max-width:640px; margin:0; }
.dhero .lead a{ text-decoration:underline; color:var(--accent-ink); }

/* --- Filtros Todo / Reels / Clases --- */
.diario .filters{ display:flex; flex-wrap:wrap; gap:10px; margin:0 0 34px; }
.diario .fbtn{
  padding:8px 16px; border-radius:999px; border:1.5px solid var(--line);
  background:var(--surface); font-size:14px; font-weight:500; color:var(--muted);
  cursor:pointer; transition:border-color .2s,color .2s;
}
.diario .fbtn:hover{ border-color:var(--accent); }
.diario .fbtn.active{ border-color:var(--accent); color:var(--accent-ink); font-weight:600; }

/* --- Rejilla de tarjetas --- */
.diary{ padding-top:12px; }
.diario .grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:26px;
}

/* --- Tarjeta de entrada --- */
.dcard{
  background:var(--surface); border:1px solid var(--line); border-radius:20px;
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform .18s,box-shadow .18s;
}
.dcard:hover{ transform:translateY(-3px); box-shadow:0 14px 34px rgba(36,48,41,.10); }
.dcard .bar{ height:5px; background:var(--c); }
.dcard .vframe{ position:relative; background:#111; aspect-ratio:16/9; overflow:hidden; }
.dcard .vframe::before{ content:none; }
.dcard .vframe.vertical{ aspect-ratio:9/16; max-height:520px; }
.dcard .vframe video{
  position:absolute; inset:0; z-index:1; width:100%; height:100%;
  object-fit:contain; background:#111; display:block;
}
.dcard .verclase{ text-decoration:none; }
.dbody{ padding:20px 22px 24px; display:flex; flex-direction:column; gap:8px; flex:1; }
.dmeta{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.dcard .tag,.dsingle .tag{
  display:inline-block; padding:4px 12px; border-radius:999px;
  font-size:12px; font-weight:700; letter-spacing:.04em; color:#fff;
  background:var(--c);
}
.kind{
  font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted);
}
.dfecha{ font-size:12.5px; color:var(--muted); margin-left:auto; }
.dbody h2{ font-size:22px; }
.dbody h2 a{ color:inherit; }
.dbody h2 a:hover{ color:var(--accent-ink); }
.dsub{ font-size:14px; font-weight:600; color:var(--accent-ink); margin:0; }
.dtexto{ font-size:15px; color:var(--muted); flex:1; margin:0; }
.empty{ padding:40px; text-align:center; color:var(--muted); display:none; }

/* --- CTA final del Diario (banda verde a ancho completo) --- */
.band-diario{ background:var(--accent); color:#fff; text-align:center; }
.band-diario .wrap{ max-width:720px; }
.band-diario h2{ color:#fff; font-size:clamp(24px,3.6vw,32px); margin-bottom:10px; }
.band-diario p{ opacity:.92; max-width:560px; margin:0 auto 22px; }
.band-diario .wp-block-buttons{ justify-content:center; }
.band-diario .wp-block-button.btn-primary .wp-block-button__link{
  background:#fff; color:var(--accent-ink);
}
.band-diario .wp-block-button.btn-primary .wp-block-button__link:hover{
  background:#fff; color:var(--accent-d);
}

/* --- Entrada individual (single) --- */
.single-post{ padding:56px 0 72px; }
.single-post .wrap{ max-width:760px; }
.dsingle{
  background:var(--surface); border:1px solid var(--line); border-radius:20px;
  overflow:hidden; margin-bottom:28px;
}
.dsingle .bar{ height:5px; background:var(--c); }
.dsingle .vframe{ position:relative; background:#111; aspect-ratio:9/16; max-height:560px; overflow:hidden; }
.dsingle .vframe::before{ content:none; }
.dsingle .vframe video{
  position:absolute; inset:0; z-index:1; width:100%; height:100%;
  object-fit:contain; background:#111; display:block;
}
.dsingle .dmeta{ padding:22px 24px 0; }
.dsingle .dfecha{ margin-left:auto; }
.dsingle .dtitle{ padding:12px 24px 0; font-size:clamp(26px,4vw,36px); }
.dsingle .dsub{ padding:8px 24px 0; font-size:16px; }
.dsingle .verclase-wrap{ padding:18px 24px 24px; }
/* Post individual: columna centrada y cómoda (el reel vertical no queda pegado a
   la izquierda con hueco a la derecha). */
.dsingle{ max-width:620px; margin-inline:auto; }
.dsingle .vframe.vertical{ margin-inline:auto; }
body.single .entry-content{ max-width:620px; margin-inline:auto; }
.single-post .dcontent{ font-size:17px; color:var(--ink); }
.single-post .dcontent p{ margin-top:16px; }
.single-post .dvolver{ margin-top:32px; }
.single-post .dvolver a{ color:var(--accent-ink); text-decoration:underline; font-weight:500; }