/* ========================================================================== 
   CONSTRUCTOR GUTENBERG · BLOQUES EDITORIALES ALEXANDRA
   El contenido cambia; el ritmo, la marca y la legibilidad permanecen.
   ========================================================================== */

.pagina-constructor {
  min-height: 70svh;
  background: var(--marfil);
}

/* Este respiro es para las páginas que empiezan con un bloque suelto, que si
   no quedaría pegado a la cabecera. Los dos heroes —el de portada y el de
   página interior— ya calculan el suyo, y sumarle este dejaba la portada en
   inglés 35 px más abajo que la española, con la foto y los frenos fuera de
   la primera pantalla. */
.pagina-constructor > :first-child:not(.apb-content-hero):not(.hero) {
  padding-top: clamp(130px, 16vh, 190px);
}
.pagina-constructor__titulo { max-width: var(--ancho); margin-inline: auto; padding: clamp(132px, 16vh, 190px) var(--marco) clamp(48px, 7vw, 86px); }
.pagina-constructor__titulo .rotulo { margin-bottom: 22px; }
.pagina-constructor__titulo + * { padding-top: clamp(60px, 8vw, 100px); }

/*
 * Bloques nativos colocados directamente en la pagina. Esto permite construir
 * una pagina desde cero sin obligar a envolver cada elemento y mantiene el
 * mismo marco, ritmo y legibilidad que las secciones prediseñadas.
 */
.pagina-constructor > :where(
  .wp-block-heading,
  .wp-block-paragraph,
  .wp-block-list,
  .wp-block-quote,
  .wp-block-image,
  .wp-block-gallery,
  .wp-block-buttons,
  .wp-block-columns,
  .wp-block-group,
  .wp-block-separator,
  .wp-block-details,
  .wp-block-table,
  .wp-block-video,
  .wp-block-embed
) {
  box-sizing: border-box;
  width: calc(100% - var(--marco) - var(--marco));
  max-width: 920px;
  margin-inline: auto;
}
.pagina-constructor > :where(.alignwide) { max-width: 1280px; }
.pagina-constructor > :where(.alignfull) { width: 100%; max-width: none; }
.pagina-constructor > :where(.wp-block-heading, .wp-block-paragraph, .wp-block-list, .wp-block-quote, .wp-block-details, .wp-block-table) + :where(.wp-block-heading, .wp-block-paragraph, .wp-block-list, .wp-block-quote, .wp-block-image, .wp-block-gallery, .wp-block-buttons, .wp-block-columns, .wp-block-group, .wp-block-separator, .wp-block-details, .wp-block-table, .wp-block-video, .wp-block-embed) { margin-top: 1.35em; }
.pagina-constructor > :where(.wp-block-paragraph, .wp-block-list, .wp-block-details, .wp-block-table) { color: var(--tinta-suave); font-size: clamp(15px, 1.2vw, 17px); line-height: 1.82; }
.pagina-constructor > .wp-block-heading { color: var(--tinta); line-height: 1.08; letter-spacing: -.025em; }
.pagina-constructor > h2.wp-block-heading { font-size: clamp(34px, 4.1vw, 58px); }
.pagina-constructor > h3.wp-block-heading { font-size: clamp(25px, 2.8vw, 36px); }
.pagina-constructor > h4.wp-block-heading { font-size: clamp(20px, 2vw, 27px); }
.pagina-constructor > :where(ul.wp-block-list, ol.wp-block-list) { padding-left: 1.3em; }
.pagina-constructor > ul.wp-block-list { list-style: disc; }
.pagina-constructor > ol.wp-block-list { list-style: decimal; }
.pagina-constructor > .wp-block-list li { margin-top: .62em; padding-left: .3em; }
.pagina-constructor > .wp-block-list li::marker { color: var(--magenta); font-weight: 600; }
.pagina-constructor > .wp-block-quote { border-left: 3px solid var(--naranja); padding: .25em 0 .25em 1.4em; color: var(--tinta); font-family: var(--display); font-size: clamp(22px, 2.3vw, 31px); font-style: italic; line-height: 1.42; }
.pagina-constructor > .wp-block-image img { width: auto; max-width: 100%; height: auto; }
.pagina-constructor > .wp-block-image figcaption { margin-top: 10px; color: var(--gris); font-size: 11px; letter-spacing: .05em; }
.pagina-constructor > .wp-block-columns { gap: clamp(24px, 4vw, 60px); }
.pagina-constructor > .wp-block-buttons .wp-block-button__link { border-radius: var(--radio, 2px); padding: 17px 26px; background: var(--magenta); color: var(--blanco); font: 600 11px/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; }

.apb-seccion,
.apb-content-hero,
.apb-respuesta,
.apb-imagen-texto,
.apb-tarjetas,
.apb-faq,
.apb-oferta,
.apb-autoria,
.apb-frontera,
.apb-cta {
  position: relative;
  width: 100%;
}

.apb-seccion--paper,
.apb-content-hero--paper,
.apb-imagen-texto--paper,
.apb-tarjetas--paper { background: var(--papel); }
.apb-seccion--marfil,
.apb-seccion--light,
.apb-content-hero--marfil,
.apb-content-hero--light,
.apb-imagen-texto--marfil,
.apb-imagen-texto--light,
.apb-tarjetas--marfil,
.apb-tarjetas--light { background: var(--marfil); }
.apb-seccion--cream,
.apb-content-hero--cream,
.apb-imagen-texto--cream,
.apb-tarjetas--cream { background: color-mix(in srgb, var(--crema-marca) 57%, var(--marfil)); }
.apb-seccion--white,
.apb-content-hero--white,
.apb-imagen-texto--white,
.apb-tarjetas--white { background: var(--blanco); }
.apb-seccion--magenta,
.apb-content-hero--magenta,
.apb-imagen-texto--magenta,
.apb-tarjetas--magenta { background: var(--magenta); color: var(--blanco); }
.apb-tarjetas--related { background: var(--marfil-2); }
.apb-seccion--ink,
.apb-seccion--dark,
.apb-content-hero--ink,
.apb-content-hero--dark,
.apb-imagen-texto--ink,
.apb-imagen-texto--dark,
.apb-tarjetas--ink,
.apb-tarjetas--dark { background: var(--tinta); color: var(--blanco); }

.apb-seccion {
  padding: clamp(80px, 11vw, 150px) var(--marco);
}

.apb-seccion__interior,
.apb-content-hero__interior,
.apb-imagen-texto__interior,
.apb-tarjetas,
.apb-faq,
.apb-oferta,
.apb-autoria,
.apb-frontera,
.apb-cta__interior {
  max-width: var(--ancho);
  margin-inline: auto;
}

.apb-seccion__interior--narrow { max-width: 720px; }
.apb-seccion__interior--content { max-width: 920px; }
.apb-seccion__interior--wide { max-width: 1280px; }
.apb-seccion__interior--full { max-width: none; }
.apb-seccion--ancho-full { padding-inline: 0; }

/* Contenido nativo dentro de secciones flexibles. */
/* CLAVES — varios H3 con su párrafo, en rejilla en vez de en columna */
.apb-claves {
  display: grid;
  grid-template-columns: repeat(var(--columnas, 2), minmax(0, 1fr));
  gap: clamp(14px, 1.7vw, 24px);
  margin-block: clamp(30px, 3.6vw, 48px);
}
/* Una clave suelta al final ocupa la fila entera: nunca queda un hueco. */
.apb-claves[style*="--columnas: 2"] .apb-clave:last-child:nth-child(odd) { grid-column: 1 / -1; }
.apb-claves[style*="--columnas: 3"] .apb-clave__titulo { font-size: clamp(17px, 1.3vw, 19px); }
@media (max-width: 47.99rem) { .apb-claves { grid-template-columns: 1fr; } }
.apb-clave {
  position: relative;
  padding: clamp(24px, 2.4vw, 32px) clamp(22px, 2.2vw, 28px);
  border: 1px solid var(--linea);
  background: var(--papel);
}
.apb-clave::before { content: ''; position: absolute; inset: -1px auto auto -1px; width: 46px; height: 2px; background: var(--magenta); }
.apb-clave:nth-child(3n+2)::before { background: var(--naranja-texto); }
.apb-clave:nth-child(3n+3)::before { background: var(--ambar-texto); }
.apb-clave__titulo { margin: 12px 0 12px; font-family: var(--display); font-size: clamp(19px, 1.4vw, 21px); font-weight: 420; line-height: 1.24; letter-spacing: -.018em; }
.apb-clave p { margin: 0; color: var(--tinta-suave); font-size: 15px; line-height: 1.72; }
.apb-seccion--cream .apb-clave, .apb-seccion--marfil .apb-clave { background: var(--marfil); }
.apb-seccion--ink .apb-clave, .apb-seccion--dark .apb-clave { border-color: rgb(255 255 255 / .2); background: rgb(255 255 255 / .04); }
.apb-seccion--ink .apb-clave p, .apb-seccion--dark .apb-clave p { color: rgb(255 255 255 / .86); }

.apb-seccion__interior {
  color: var(--tinta-suave);
  font-size: clamp(15px, 1.2vw, 17px);
  line-height: 1.82;
}
.apb-seccion__interior > * { max-width: 920px; }
.apb-seccion__interior--wide > *,
.apb-seccion__interior--full > *,
.apb-seccion__interior > .alignwide,
.apb-seccion__interior > .alignfull { max-width: none; }
.apb-seccion__interior > * + * { margin-top: 1.35em; }
.apb-seccion__interior :where(h2, h3, h4) { color: var(--tinta); line-height: 1.08; letter-spacing: -.025em; }
.apb-seccion__interior h2 { margin-top: 1.55em; font-size: clamp(34px, 4.1vw, 58px); }
.apb-seccion__interior h2:first-child { margin-top: 0; }
.apb-seccion__interior h3 { margin-top: 1.6em; font-size: clamp(25px, 2.8vw, 36px); }
.apb-seccion__interior h4 { margin-top: 1.5em; font-size: clamp(20px, 2vw, 27px); }
.apb-seccion__interior :where(ul, ol) { margin: 1.5em 0; padding-left: 1.3em; }
.apb-seccion__interior ul { list-style: disc; }
.apb-seccion__interior ol { list-style: decimal; }
.apb-seccion__interior li { margin-top: .62em; padding-left: .3em; }
.apb-seccion__interior li::marker { color: var(--magenta); font-weight: 600; }
.apb-seccion__interior blockquote { margin: 2.3em 0; padding: .25em 0 .25em 1.4em; border-left: 3px solid var(--naranja); color: var(--tinta); font-family: var(--display); font-size: clamp(22px, 2.3vw, 31px); font-style: italic; line-height: 1.42; }
.apb-seccion__interior a:not(.boton):not(.wp-block-button__link) { color: var(--magenta); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.apb-seccion__interior img { width: auto; max-width: 100%; height: auto; }
.apb-seccion__interior figcaption { margin-top: 10px; color: var(--gris); font-size: 11px; letter-spacing: .05em; }
.apb-seccion__interior .wp-block-columns { gap: clamp(24px, 4vw, 60px); }
.apb-seccion__interior .wp-block-button__link {
  border-radius: var(--radio, 2px);
  padding: 17px 26px;
  background: var(--magenta);
  color: var(--blanco);
  font: 600 11px/1.3 var(--sans);
  letter-spacing: .12em;
  text-transform: uppercase;
}

.apb-seccion--magenta .apb-seccion__interior,
.apb-seccion--ink .apb-seccion__interior,
.apb-seccion--dark .apb-seccion__interior { color: rgb(255 255 255 / .82); }
.apb-seccion--magenta .apb-seccion__interior :where(h2, h3, h4),
.apb-seccion--ink .apb-seccion__interior :where(h2, h3, h4),
.apb-seccion--dark .apb-seccion__interior :where(h2, h3, h4) { color: var(--blanco); }
.apb-seccion--magenta .apb-seccion__interior a:not(.wp-block-button__link),
.apb-seccion--ink .apb-seccion__interior a:not(.wp-block-button__link),
.apb-seccion--dark .apb-seccion__interior a:not(.wp-block-button__link),
.apb-seccion--magenta .apb-seccion__interior li::marker,
.apb-seccion--ink .apb-seccion__interior li::marker,
.apb-seccion--dark .apb-seccion__interior li::marker { color: var(--amarillo); }
.apb-seccion--magenta .apb-seccion__interior blockquote,
.apb-seccion--ink .apb-seccion__interior blockquote,
.apb-seccion--dark .apb-seccion__interior blockquote { border-left-color: var(--amarillo); color: var(--blanco); }

/* Hero de páginas interiores. */
.apb-content-hero {
  isolation: isolate;
  overflow: hidden;
  min-height: min(820px, 86svh);
  padding: clamp(126px, 14vh, 174px) var(--marco) clamp(82px, 10vw, 132px);
}
.apb-content-hero::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: -22%;
  right: -9%;
  width: min(48vw, 700px);
  aspect-ratio: 1;
  border: 1px solid rgb(173 9 79 / .1);
  border-radius: 50%;
  box-shadow: 0 0 0 75px rgb(255 238 70 / .045), 0 0 0 150px rgb(173 9 79 / .025);
}
.apb-content-hero__interior { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr); align-items: center; gap: clamp(42px, 7vw, 110px); }
.apb-content-hero--sin-imagen .apb-content-hero__interior { grid-template-columns: minmax(0, 920px); }
.apb-content-hero__contenido { max-width: 860px; }
.apb-content-hero .rotulo { margin-bottom: 28px; }
.apb-content-hero .titulo { max-width: 15ch; font-size: clamp(48px, 6vw, 92px); line-height: 1.02; }
.apb-content-hero__intro { max-width: 660px; margin-top: 30px; color: var(--tinta-suave); font-size: clamp(16px, 1.35vw, 20px); line-height: 1.74; }
.apb-content-hero .boton { margin-top: 34px; }
.apb-content-hero__media { position: relative; min-height: 520px; overflow: hidden; background: var(--marfil-2); box-shadow: var(--sombra); }
.apb-content-hero__media::before { content: ''; position: absolute; z-index: 1; inset: 0 auto 0 0; width: 5px; background: linear-gradient(180deg, var(--magenta), var(--naranja), var(--amarillo)); }
.apb-content-hero__media::after { content: ''; position: absolute; inset: 0; border: 1px solid rgb(255 255 255 / .32); pointer-events: none; }
.apb-content-hero__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--foco, 50% 28%); }
.apb-content-hero--media-portrait .apb-content-hero__media { transform: rotate(.35deg); }
.apb-content-hero--media-portrait .apb-content-hero__media img { object-position: center 26%; }
.apb-content-hero--media-product .apb-content-hero__media { background: radial-gradient(circle at 52% 44%, rgb(255 238 70 / .3), transparent 50%), var(--crema-marca); box-shadow: 0 35px 90px rgb(38 26 34 / .16); }
.apb-content-hero--media-product .apb-content-hero__media img { object-fit: contain; padding: clamp(18px, 3vw, 42px); filter: drop-shadow(0 30px 25px rgb(38 26 34 / .2)); }
.apb-content-hero--magenta .rotulo,
.apb-content-hero--ink .rotulo,
.apb-content-hero--dark .rotulo { color: rgb(255 255 255 / .8); }
.apb-content-hero--magenta .rotulo::before,
.apb-content-hero--ink .rotulo::before,
.apb-content-hero--dark .rotulo::before { background: var(--amarillo); }
.apb-content-hero--magenta .titulo,
.apb-content-hero--ink .titulo,
.apb-content-hero--dark .titulo { color: var(--blanco); }
.apb-content-hero--magenta .titulo em,
.apb-content-hero--ink .titulo em,
.apb-content-hero--dark .titulo em { color: var(--amarillo); }
.apb-content-hero--magenta .apb-content-hero__intro,
.apb-content-hero--ink .apb-content-hero__intro,
.apb-content-hero--dark .apb-content-hero__intro { color: rgb(255 255 255 / .82); }

/* Respuesta visible inmediatamente: favorece lectura, snippets y agentes. */
.apb-respuesta {
  max-width: 1040px;
  margin: clamp(54px, 8vw, 100px) auto;
  padding: clamp(30px, 5vw, 58px) clamp(28px, 6vw, 72px);
  border-left: 5px solid var(--naranja);
  background: color-mix(in srgb, var(--crema-marca) 62%, var(--papel));
  box-shadow: 0 24px 70px rgb(38 26 34 / .06);
}
/* El rótulo «RESPUESTA DIRECTA» era jerga de SEO impresa en la cara del
   usuario. Ahora el rótulo es texto editable y humano. */



/* Navegación editorial: cierra cada página dentro del cuerpo, no en el pie. */
.apb-content-links { max-width: 1280px; margin: clamp(72px, 9vw, 128px) auto; padding: clamp(34px, 5vw, 66px); background: var(--marfil-2); border-top: 1px solid var(--linea); }
.apb-content-links--cream { background: var(--crema-marca); }
.apb-content-links--white { background: var(--blanco); }
.apb-content-links h2 { margin: 0 0 clamp(26px, 4vw, 44px); font-size: clamp(32px, 4vw, 58px); line-height: 1.05; }
.apb-content-links__related ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; padding: 0; background: var(--linea); list-style: none; }
.apb-content-links__related li { display: flex; min-width: 0; background: var(--papel); }
.apb-content-links__related a { position: relative; display: flex; width: 100%; min-height: 220px; flex-direction: column; justify-content: space-between; gap: 30px; padding: clamp(25px, 3.2vw, 42px); color: var(--tinta); transition: background-color .35s ease, color .35s ease; }
.apb-content-links__related a::before { content: 'SIGUIENTE LECTURA'; color: var(--magenta); font: 600 9px/1.4 var(--sans); letter-spacing: .15em; }
.apb-content-links__related a::after { content: '↗'; position: absolute; top: 24px; right: 25px; color: var(--naranja); font-size: 18px; }
.apb-content-links__related a:hover { background: var(--tinta); color: var(--blanco); }
.apb-content-links__related strong { display: block; max-width: 20ch; font-family: var(--display); font-size: clamp(23px, 2.4vw, 34px); font-weight: 500; line-height: 1.08; }
.apb-content-links__related span { display: block; max-width: 35ch; color: var(--tinta-suave); font-size: 13px; line-height: 1.65; }
.apb-content-links__related a:hover span { color: rgb(255 255 255 / .74); }

/* Texto e imagen. */
.apb-imagen-texto { padding: clamp(80px, 11vw, 150px) var(--marco); }
.apb-imagen-texto__interior { display: grid; grid-template-columns: minmax(300px, .88fr) minmax(0, 1fr); align-items: center; gap: clamp(44px, 8vw, 130px); }
.apb-imagen-texto--sin-imagen .apb-imagen-texto__interior { grid-template-columns: minmax(0, 760px); }
.apb-imagen-texto--imagen-right .apb-imagen-texto__media { order: 2; }
.apb-imagen-texto__media { position: relative; min-height: 580px; overflow: hidden; background: var(--marfil-2); box-shadow: var(--sombra); }
.apb-imagen-texto__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: var(--foco, 50% 18%); }
.apb-imagen-texto__media figcaption { position: absolute; right: 16px; bottom: 14px; left: 16px; padding: 11px 14px; background: rgb(38 26 34 / .82); color: var(--blanco); font-size: 10px; line-height: 1.45; }
.apb-imagen-texto__contenido { max-width: 700px; }
.apb-imagen-texto__contenido .rotulo { margin-bottom: 24px; }
.apb-imagen-texto__contenido .titulo { margin-bottom: 30px; }
.apb-imagen-texto__texto { color: var(--tinta-suave); font-size: 16px; line-height: 1.82; }
.apb-imagen-texto__texto p + p { margin-top: 1.15em; }
.apb-imagen-texto__contenido .boton { margin-top: 32px; }
.apb-imagen-texto--magenta .apb-imagen-texto__contenido .titulo,
.apb-imagen-texto--ink .apb-imagen-texto__contenido .titulo,
.apb-imagen-texto--dark .apb-imagen-texto__contenido .titulo { color: var(--blanco); }
.apb-imagen-texto--magenta .apb-imagen-texto__contenido .titulo em,
.apb-imagen-texto--ink .apb-imagen-texto__contenido .titulo em,
.apb-imagen-texto--dark .apb-imagen-texto__contenido .titulo em { color: var(--amarillo); }
.apb-imagen-texto--magenta .apb-imagen-texto__contenido .rotulo,
.apb-imagen-texto--ink .apb-imagen-texto__contenido .rotulo,
.apb-imagen-texto--dark .apb-imagen-texto__contenido .rotulo,
.apb-imagen-texto--magenta .apb-imagen-texto__texto,
.apb-imagen-texto--ink .apb-imagen-texto__texto,
.apb-imagen-texto--dark .apb-imagen-texto__texto { color: rgb(255 255 255 / .82); }
.apb-imagen-texto--magenta .apb-imagen-texto__contenido .rotulo::before,
.apb-imagen-texto--ink .apb-imagen-texto__contenido .rotulo::before,
.apb-imagen-texto--dark .apb-imagen-texto__contenido .rotulo::before { background: var(--amarillo); }
.apb-imagen-texto--magenta .boton--linea,
.apb-imagen-texto--ink .boton--linea,
.apb-imagen-texto--dark .boton--linea { color: var(--tinta); box-shadow: none; background: var(--blanco); }

/* Tarjetas. */
.apb-tarjetas { padding: clamp(82px, 11vw, 150px) var(--marco); }
.apb-tarjetas > .rotulo { margin-bottom: 24px; }
.apb-tarjetas > .titulo { margin-bottom: clamp(38px, 6vw, 72px); }
.apb-tarjetas--magenta > .titulo,
.apb-tarjetas--ink > .titulo,
.apb-tarjetas--dark > .titulo { color: var(--blanco); }
.apb-tarjetas--magenta > .titulo em,
.apb-tarjetas--ink > .titulo em,
.apb-tarjetas--dark > .titulo em { color: var(--amarillo); }
.apb-tarjetas--magenta > .rotulo,
.apb-tarjetas--ink > .rotulo,
.apb-tarjetas--dark > .rotulo { color: rgb(255 255 255 / .8); }
.apb-tarjetas--magenta > .rotulo::before,
.apb-tarjetas--ink > .rotulo::before,
.apb-tarjetas--dark > .rotulo::before { background: var(--amarillo); }
.apb-tarjetas__rejilla { display: grid; grid-template-columns: repeat(var(--apb-columnas, 3), minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--linea); background: var(--linea); }
.apb-tarjeta { position: relative; display: flex; min-width: 0; min-height: 350px; flex-direction: column; padding: clamp(28px, 3.5vw, 48px); background: var(--papel); }
.apb-tarjeta::before { content: ''; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, var(--magenta), var(--naranja), var(--ambar)); transform: scaleX(.22); transform-origin: left; transition: transform .55s var(--curva); }
.apb-tarjeta:hover::before { transform: scaleX(1); }
.apb-tarjeta__rotulo { margin-bottom: 30px; color: var(--magenta); font-size: 10px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; }
.apb-tarjeta h3 { margin-bottom: 18px; font-size: clamp(27px, 2.7vw, 39px); line-height: 1.08; }
.apb-tarjeta > p:not(.apb-tarjeta__rotulo) { margin-bottom: auto; color: var(--tinta-suave); font-size: 14px; line-height: 1.72; }
.apb-tarjeta__enlace { align-self: flex-start; margin-top: 34px; padding-bottom: 5px; border-bottom: 1px solid var(--magenta); color: var(--magenta); font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.apb-tarjeta__enlace::after { content: ' →'; }

.apb-tarjetas--related { max-width: none; }
.apb-tarjetas--related > :where(.rotulo, .titulo),
.apb-tarjetas--related > .apb-tarjetas__rejilla { width: min(100%, var(--ancho)); margin-inline: auto; }
.apb-tarjetas--related .apb-tarjetas__rejilla { grid-template-columns: repeat(var(--apb-columnas, 3), minmax(0, 1fr)); }
.apb-tarjetas--related .apb-tarjeta { min-height: 280px; }
.apb-tarjetas--related .apb-tarjeta h3 { max-width: 18ch; }
.apb-tarjetas--related .apb-tarjeta__enlace { margin-top: 28px; }

/* FAQ. */
.apb-faq { padding: clamp(82px, 11vw, 150px) var(--marco); }
.apb-faq > .rotulo { margin-bottom: 22px; }
.apb-faq > .titulo { margin-bottom: clamp(38px, 5vw, 66px); }
.apb-faq__lista { max-width: 1000px; border-top: 1px solid var(--linea); }
.apb-faq__item { border-bottom: 1px solid var(--linea); }
.apb-faq__item summary { position: relative; padding: 26px 58px 26px 0; color: var(--tinta); font-family: var(--display); font-size: clamp(21px, 2.2vw, 29px); line-height: 1.3; cursor: pointer; list-style: none; }
.apb-faq__item summary::-webkit-details-marker { display: none; }
.apb-faq__item summary::after { content: '+'; position: absolute; top: 50%; right: 10px; color: var(--magenta); font: 300 30px/1 var(--sans); transform: translateY(-50%); transition: transform .3s ease; }
.apb-faq__item[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.apb-faq__respuesta { max-width: 760px; padding: 0 58px 28px 0; color: var(--tinta-suave); font-size: 15px; line-height: 1.78; }
.apb-faq__respuesta p + p { margin-top: 1em; }

/* Oferta. */
.apb-oferta { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: clamp(36px, 7vw, 100px); max-width: 1280px; margin: clamp(72px, 10vw, 140px) auto; padding: clamp(38px, 6vw, 76px); border-top: 4px solid var(--naranja); background: var(--tinta); color: var(--blanco); box-shadow: var(--sombra); }
.apb-oferta h2 { max-width: 18ch; margin-bottom: 20px; color: var(--blanco); font-size: clamp(34px, 4vw, 58px); line-height: 1.04; }
.apb-oferta__descripcion { max-width: 650px; color: rgb(255 255 255 / .82); font-size: 16px; line-height: 1.72; }
.apb-oferta__descripcion + .apb-oferta__descripcion { margin-top: 1em; }
.apb-oferta__detalles { margin-top: 18px; color: var(--amarillo); font-size: 11px; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; }
.apb-oferta__accion { display: flex; min-width: 250px; align-items: center; flex-direction: column; gap: 18px; }
.apb-oferta__precio { color: var(--blanco); font-family: var(--display); font-size: clamp(35px, 4vw, 54px); line-height: 1; }

/* Autoría y límite profesional. */
.apb-autoria { display: grid; grid-template-columns: 160px minmax(0, 1fr); align-items: center; gap: clamp(26px, 4vw, 54px); max-width: 1000px; margin: clamp(70px, 9vw, 120px) auto; padding: clamp(28px, 4vw, 48px); border: 1px solid var(--linea); background: var(--papel); }
.apb-autoria__foto { width: 160px; aspect-ratio: 1; overflow: hidden; border-radius: 50%; background: var(--marfil-2); }
.apb-autoria__foto img { width: 100%; height: 100%; object-fit: cover; object-position: var(--foco, 50% 25%); }
.apb-autoria .rotulo { margin-bottom: 12px; }
.apb-autoria h2 { font-size: clamp(29px, 3vw, 42px); line-height: 1.08; }
.apb-autoria__rol { margin-top: 6px; color: var(--magenta); font-size: 11px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; }
.apb-autoria__bio { max-width: 650px; margin-top: 15px; color: var(--tinta-suave); font-size: 14px; line-height: 1.7; }
.apb-autoria__enlace { display: inline-block; margin-top: 18px; padding-bottom: 4px; border-bottom: 1px solid var(--magenta); color: var(--magenta); font-size: 10px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.apb-autoria__enlace::after { content: ' →'; }
.apb-frontera { display: flex; align-items: center; justify-content: space-between; gap: 28px; max-width: 1100px; margin: 36px auto; padding: 24px 28px; border-left: 3px solid var(--ambar); background: color-mix(in srgb, var(--crema-marca) 42%, var(--papel)); }
.apb-frontera p { max-width: 780px; color: var(--tinta-suave); font-size: 12px; line-height: 1.65; }
.apb-frontera__enlace { flex: none; color: var(--magenta); font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; }

/* CTA. */
.apb-cta { margin-top: clamp(72px, 10vw, 140px); padding: clamp(80px, 10vw, 140px) var(--marco); background: var(--magenta); color: var(--blanco); }
.apb-cta--ink,
.apb-cta--dark { background: var(--tinta); }
.apb-cta--cream { background: var(--crema-marca); color: var(--tinta); }
/* La CTA de media página respira menos que la del final: es un alto en el
   camino, no el cierre, y estirarla dejaba el hueco vacío que sobra. */
.apb-cta--cream,
.apb-cta--paper,
.apb-cta--marfil,
.apb-cta--light,
.apb-cta--white { margin-top: clamp(48px, 6vw, 86px); padding-block: clamp(52px, 6vw, 88px); }
.apb-cta--cream .apb-cta__interior,
.apb-cta--paper .apb-cta__interior,
.apb-cta--marfil .apb-cta__interior,
.apb-cta--light .apb-cta__interior,
.apb-cta--white .apb-cta__interior { align-items: center; gap: clamp(32px, 5vw, 72px); }
.apb-cta--cream .titulo,
.apb-cta--paper .titulo,
.apb-cta--marfil .titulo,
.apb-cta--light .titulo,
.apb-cta--white .titulo { max-width: 17ch; font-size: clamp(32px, 4vw, 56px); }
.apb-cta--cream .apb-cta__texto,
.apb-cta--paper .apb-cta__texto,
.apb-cta--marfil .apb-cta__texto,
.apb-cta--light .apb-cta__texto,
.apb-cta--white .apb-cta__texto { margin-top: 18px; font-size: 15px; }
.apb-cta--paper { background: var(--papel); color: var(--tinta); }
.apb-cta--marfil,
.apb-cta--light { background: var(--marfil); color: var(--tinta); }
.apb-cta--white { background: var(--blanco); color: var(--tinta); }
.apb-cta__interior { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: clamp(42px, 7vw, 100px); }
.apb-cta .rotulo { margin-bottom: 24px; color: rgb(255 255 255 / .78); }
.apb-cta .rotulo::before { background: var(--amarillo); }
.apb-cta .titulo { max-width: 15ch; color: var(--blanco); font-size: clamp(42px, 5.7vw, 82px); line-height: 1.02; }
.apb-cta .titulo em { color: var(--amarillo); }
.apb-cta__texto { max-width: 700px; margin-top: 27px; color: rgb(255 255 255 / .82); font-size: 16px; line-height: 1.72; }
.apb-cta__accion { display: flex; min-width: 290px; align-items: center; flex-direction: column; gap: 13px; }
.apb-cta__micro { color: rgb(255 255 255 / .75); font-size: 10px; line-height: 1.5; text-align: center; }
.apb-cta--cream .rotulo,
.apb-cta--paper .rotulo,
.apb-cta--marfil .rotulo,
.apb-cta--light .rotulo,
.apb-cta--white .rotulo { color: var(--gris); }
.apb-cta--cream .rotulo::before,
.apb-cta--paper .rotulo::before,
.apb-cta--marfil .rotulo::before,
.apb-cta--light .rotulo::before,
.apb-cta--white .rotulo::before { background: var(--magenta); }
.apb-cta--cream .titulo,
.apb-cta--paper .titulo,
.apb-cta--marfil .titulo,
.apb-cta--light .titulo,
.apb-cta--white .titulo { color: var(--tinta); }
.apb-cta--cream .titulo em,
.apb-cta--paper .titulo em,
.apb-cta--marfil .titulo em,
.apb-cta--light .titulo em,
.apb-cta--white .titulo em { color: var(--magenta); }
.apb-cta--cream .apb-cta__texto,
.apb-cta--paper .apb-cta__texto,
.apb-cta--marfil .apb-cta__texto,
.apb-cta--light .apb-cta__texto,
.apb-cta--white .apb-cta__texto { color: var(--tinta-suave); }
.apb-cta--cream .apb-cta__micro,
.apb-cta--paper .apb-cta__micro,
.apb-cta--marfil .apb-cta__micro,
.apb-cta--light .apb-cta__micro,
.apb-cta--white .apb-cta__micro { color: var(--gris); }

@media (max-width: 74rem) {
  .apb-content-hero__interior { grid-template-columns: minmax(0, 1fr) 40%; gap: 46px; }
  .apb-content-hero__media { min-height: 480px; }
  .apb-tarjetas__rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.apb-tarjetas--related .apb-tarjetas__rejilla { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.apb-content-links__related ul { grid-template-columns: 1fr; }
	.apb-content-links__related a { min-height: 0; }
}

@media (max-width: 47.99rem) {
  .apb-content-hero { min-height: auto; padding: 112px var(--marco) 72px; }
  .apb-content-hero__interior,
  .apb-imagen-texto__interior,
  .apb-oferta,
  .apb-cta__interior { grid-template-columns: 1fr; }
  .apb-content-hero .titulo { font-size: clamp(42px, 12vw, 60px); }
  .apb-content-hero__intro { margin-top: 22px; font-size: 15px; }
  .apb-content-hero__media { min-height: 390px; }
	.apb-content-links { width: calc(100% - var(--marco) - var(--marco)); padding: 28px 22px; }
  .apb-respuesta { width: calc(100% - var(--marco) - var(--marco)); margin-inline: auto; padding: 27px 25px; }
  .apb-imagen-texto { padding-block: 76px; }
  .apb-imagen-texto--imagen-right .apb-imagen-texto__media { order: 0; }
  .apb-imagen-texto__media { min-height: 430px; }
  .apb-tarjetas { padding-block: 76px; }
  .apb-tarjetas__rejilla { grid-template-columns: 1fr; }
	.apb-tarjetas--related .apb-tarjetas__rejilla { grid-template-columns: 1fr; }
	.apb-tarjetas--related .apb-tarjeta { min-height: 0; }
  .apb-tarjeta { min-height: 0; }
  .apb-faq { padding-block: 76px; }
  .apb-oferta { width: calc(100% - var(--marco) - var(--marco)); margin-inline: auto; padding: 34px 26px; }
  .apb-oferta__accion { min-width: 0; align-items: flex-start; }
  .apb-autoria { width: calc(100% - var(--marco) - var(--marco)); grid-template-columns: 86px minmax(0, 1fr); margin-inline: auto; padding: 24px; }
  .apb-autoria__foto { width: 86px; align-self: start; }
  .apb-autoria__bio,
  .apb-autoria__enlace { grid-column: 1 / -1; }
  .apb-frontera { width: calc(100% - var(--marco) - var(--marco)); align-items: flex-start; flex-direction: column; margin-inline: auto; }
  .apb-cta { padding-block: 76px; }
  .apb-cta .titulo { font-size: clamp(40px, 11vw, 56px); }
  .apb-cta__accion { min-width: 0; align-items: flex-start; }
  .apb-cta__micro { text-align: left; }
}

@supports not (background: color-mix(in srgb, white 50%, black)) {
  .apb-seccion--cream,
  .apb-content-hero--cream,
  .apb-imagen-texto--cream,
  .apb-tarjetas--cream,
  .apb-respuesta,
  .apb-frontera { background: #f3f0d6; }
}

/* =========================================================================
   BLOQUES DE ENLAZADO VISUALES
   Una lista de enlaces de texto no la lee nadie. Estas tarjetas llevan foto,
   rótulo, titular-ancla y una frase de contexto. Un único enlace por tarjeta:
   el destino no se repite dentro de la página y el reparto de relevancia no
   se diluye. El ::after extiende la zona pulsable a toda la tarjeta sin
   añadir un segundo enlace al mismo sitio.
   ========================================================================= */
.apb-tarjeta--foto {
  /* blocks.css da 48px de relleno a toda tarjeta; la de foto va a sangre */
  padding: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--papel);
  border: 1px solid var(--linea);
  transition: transform .5s var(--curva), box-shadow .5s var(--curva), border-color .5s var(--curva);
}
.apb-tarjeta--foto:hover {
  transform: translateY(-5px);
  border-color: color-mix(in oklch, var(--magenta) 30%, var(--linea));
  box-shadow: var(--sombra);
}

.apb-tarjeta__foto { position: relative; overflow: hidden; aspect-ratio: 4 / 3; background: var(--marfil-2); }
.apb-tarjeta__foto img {
  width: 100%; height: 100%; object-fit: cover;
  object-position: var(--foco, 50% 30%);
  transition: transform 1.1s var(--curva);
}
.apb-tarjeta--foto:hover .apb-tarjeta__foto img { transform: scale(1.05); }
/* Velo inferior para que el rótulo respire sobre cualquier foto */
.apb-tarjeta__foto::after {
  content: ''; position: absolute; inset: auto 0 0 0; height: 42%;
  background: linear-gradient(transparent, rgb(38 26 34 / .28));
  pointer-events: none;
}

.apb-tarjeta__cuerpo { display: flex; flex-direction: column; gap: 9px; padding: 26px 26px 28px; flex: 1; }
.apb-tarjeta--foto .apb-tarjeta__rotulo {
  margin: 0; color: var(--magenta);
  font-size: 10px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
}
.apb-tarjeta--foto h3 {
  margin: 0;
  font-family: var(--display); font-size: clamp(21px, 1.55vw, 26px);
  line-height: 1.16; letter-spacing: -.018em;
}
.apb-tarjeta--foto h3 a { color: inherit; text-decoration: none; border: 0; background: none; }
.apb-tarjeta--foto h3 a:hover { color: var(--magenta); }
/* La superficie entera es pulsable, pero el enlace sigue siendo uno solo */
.apb-tarjeta--foto h3 a::after { content: ''; position: absolute; inset: 0; z-index: 2; }
.apb-tarjeta--foto p { color: var(--tinta-suave); font-size: 14.5px; line-height: 1.62; }
.apb-tarjeta__pista {
  margin-top: auto; padding-top: 6px;
  color: var(--magenta); font-size: 11px; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase;
  display: flex; align-items: center; gap: 8px;
}
.apb-tarjeta__pista span { transition: transform .45s var(--curva); }
.apb-tarjeta--foto:hover .apb-tarjeta__pista span { transform: translateX(5px); }

.apb-tarjeta--foto:focus-within { outline: 2px solid var(--magenta); outline-offset: 3px; }
.apb-tarjeta--foto h3 a:focus-visible { outline: none; }

@media (max-width: 47.99rem) {
  .apb-tarjeta__cuerpo { padding: 20px 20px 22px; }
  .apb-tarjeta--foto h3 { font-size: 20px; }
  .apb-tarjeta--foto p { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .apb-tarjeta--foto, .apb-tarjeta__foto img, .apb-tarjeta__pista span { transition: none; }
  .apb-tarjeta--foto:hover { transform: none; }
  .apb-tarjeta--foto:hover .apb-tarjeta__foto img { transform: none; }
}

/* =========================================================================
   MEGA-MENÚ
   Seis elementos visibles arriba; los dos que abren rama despliegan un panel
   con todas sus páginas, con miniatura y una línea de contexto. Sin
   JavaScript: se abre con :hover y con :focus-within, así que funciona con
   teclado. El enlace padre sigue llevando a su hub.
   ========================================================================= */
.cabecera__grupo--mega { position: static; }

.cabecera__mega {
  position: absolute;
  top: 100%; left: 50%;
  z-index: 6;
  width: min(1120px, calc(100vw - 2 * var(--marco)));
  margin-top: 0;
  padding: 26px;
  background: var(--papel);
  border: 1px solid var(--linea);
  box-shadow: 0 34px 80px rgb(55 23 38 / .17);
  opacity: 0; visibility: hidden;
  transform: translate(-50%, -8px);
  transition: opacity .3s var(--curva), transform .3s var(--curva), visibility .3s;
}
/* Puente invisible para bajar el ratón sin que se cierre */
.cabecera__mega::before { content: ''; position: absolute; top: -18px; left: 0; right: 0; height: 18px; }

.cabecera__grupo--mega:hover .cabecera__mega,
.cabecera__grupo--mega:focus-within .cabecera__mega {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
}

.cabecera__mega-rejilla { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }

.cabecera__mega-item {
  display: flex; flex-direction: column; gap: 9px;
  padding: 10px 10px 13px;
  border-radius: var(--radio, 2px);
  text-transform: none; letter-spacing: normal;
  transition: background-color .22s ease;
}
.cabecera__mega-item:hover { background: var(--marfil-2); }
.cabecera__mega-item::after { display: none; }

.cabecera__mega-foto { display: block; overflow: hidden; aspect-ratio: 16 / 10; background: var(--marfil-2); }
.cabecera__mega-foto img { width: 100%; height: 100%; object-fit: cover; object-position: var(--foco, 50% 30%); transition: transform .7s var(--curva); }
.cabecera__mega-item:hover .cabecera__mega-foto img { transform: scale(1.06); }

.cabecera__mega-texto { display: flex; flex-direction: column; gap: 3px; }
.cabecera__mega-texto strong {
  color: var(--tinta); font-family: var(--sans);
  font-size: 12.5px; font-weight: 600; line-height: 1.3; letter-spacing: .01em;
}
.cabecera__mega-item:hover .cabecera__mega-texto strong { color: var(--magenta); }
.cabecera__mega-texto small { color: var(--gris); font-size: 11.5px; line-height: 1.4; }

@media (max-width: 68rem) { .cabecera__mega { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .cabecera__mega, .cabecera__mega-foto img, .cabecera__mega-item { transition: none; }
  .cabecera__mega-item:hover .cabecera__mega-foto img { transform: none; }
}

/* ---- Menú a pantalla completa: jerarquía real, no una lista plana ---- */
.menu__lista .menu__sub {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2px 18px;
  margin: 6px 0 14px 0;
  padding-left: 16px;
  border-left: 1px solid color-mix(in oklch, var(--blanco) 24%, transparent);
}
.menu__lista .menu__sub a { font-size: 14px; opacity: .72; }
.menu__lista .menu__sub a:hover { opacity: 1; }
@media (max-width: 30rem) { .menu__lista .menu__sub { grid-template-columns: 1fr; } }

/* La máscara de SplitText se comía la primera letra del titular. blocks.css
   carga después de site.css, así que el ajuste tiene que vivir aquí. */
.hero h1 { padding-left: .07em; margin-left: -.07em; }
.hero h1 > div { padding-left: .07em; margin-left: -.07em; }

/* El eslogan flotante chocaba con la navegación al crecer la cabecera. */
@media (min-width: 1025px) {
  .hero { padding-top: calc(var(--alto-cab) + 30px); }
  .hero__slogan { top: 6px; }
}

/* El titular partía dejando «madre» sola y el punto huérfano al inicio de la
   línea siguiente. Un poco más de ancho y reparto equilibrado lo resuelve. */
@media (min-width: 1025px) {
  .hero h1 { max-width: 19ch; text-wrap: balance; }
}



/* =========================================================================
   LA TESIS · «Encendamos la luz que ilumina el sentido»
   ---------------------------------------------------------------------
   Es la frase que sostiene la página. Corta el papel crema con un plano en
   tinta y la enciende conforme se lee: cada palabra pasa de brasa apagada a
   luz, y un halo ámbar sigue a la lectura. La metáfora de la marca hecha
   interacción.

   El texto se sirve legible. El apagado lo aplica GSAP, nunca el CSS: si el
   JavaScript falla, la frase se lee entera. Eso es innegociable.
   ========================================================================= */
.apb-tesis {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(96px, 15vh, 190px) var(--marco);
  background: var(--tinta);
  color: var(--blanco);
}
/* Bordes que funden con el papel de las secciones vecinas */
.apb-tesis::before,
.apb-tesis::after {
  content: ''; position: absolute; left: 0; right: 0; height: 92px; z-index: 1;
  pointer-events: none;
}
.apb-tesis::before { top: 0;    background: linear-gradient(var(--tinta), transparent); }
.apb-tesis::after  { bottom: 0; background: linear-gradient(transparent, var(--tinta)); }

/* El halo. Se mueve con la lectura desde GSAP mediante --lx / --ly */
.apb-tesis__luz {
  position: absolute; inset: -30%;
  z-index: 0;
  background:
    radial-gradient(38% 46% at var(--lx, 30%) var(--ly, 38%),
      color-mix(in srgb, var(--ambar) 46%, transparent) 0%,
      color-mix(in srgb, var(--naranja) 26%, transparent) 34%,
      transparent 68%),
    radial-gradient(52% 60% at 82% 84%,
      color-mix(in srgb, var(--magenta) 30%, transparent) 0%,
      transparent 62%);
  filter: blur(38px);
  opacity: .5;
  pointer-events: none;
  will-change: transform;
}
/* Grano finísimo: sin él, un degradado tan grande se ve bandeado */
.apb-tesis__grano {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  opacity: .05; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

.apb-tesis__interior { position: relative; z-index: 2; max-width: var(--ancho); margin-inline: auto; }

.apb-tesis__frase {
  max-width: 21ch;
  margin: 0;
  font-family: var(--display);
  /* Mira ancho y alto: en una ventana baja la frase cede antes que salirse. */
  font-size: clamp(34px, min(5.6vw, 8.6svh), 82px);
  font-weight: 400;
  line-height: 1.03;
  letter-spacing: -.03em;
  text-wrap: balance;
}
/* Palabra a palabra. La sombra ámbar es el rescoldo de la que se enciende. */
.apb-tesis__frase .palabra { display: inline-block; will-change: opacity, transform, filter; }
.apb-tesis__frase .palabra--viva { text-shadow: 0 0 42px color-mix(in srgb, var(--ambar) 34%, transparent); }

.apb-tesis__pie {
  display: grid;
  grid-template-columns: 78px minmax(0, 1fr);
  align-items: start;
  gap: clamp(20px, 3vw, 44px);
  margin-top: clamp(40px, 6vh, 76px);
  max-width: 700px;
}
.apb-tesis__filo {
  display: block; height: 2px; margin-top: 15px;
  background: linear-gradient(90deg, var(--naranja), var(--ambar));
  transform-origin: left; /* GSAP lo dibuja al entrar */
}
.apb-tesis__cuerpo p {
  margin: 0 0 15px;
  /* 74 % sobre este fondo se quedaba corto de contraste, y encima compite con
     el halo ámbar que pasa por detrás. */
  color: color-mix(in srgb, var(--blanco) 90%, transparent);
  font-size: clamp(15.5px, 1.18vw, 18px);
  line-height: 1.8;
}
.apb-tesis__cuerpo p:last-child { margin-bottom: 0; }

/* La frase que resume la tesis: mismo peso que un subtitular, en ámbar. */
.apb-tesis__destacado {
  margin: clamp(22px, 3vh, 34px) 0 0;
  padding-left: 18px;
  border-left: 2px solid var(--ambar);
  color: var(--blanco);
  font-family: var(--display);
  font-size: clamp(19px, 1.7vw, 25px);
  font-style: italic;
  line-height: 1.35;
}

/* El paso siguiente. Antes la sección se leía y no llevaba a ninguna parte. */
.apb-tesis__accion {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 22px;
  margin-top: clamp(26px, 3.6vh, 40px);
}
.apb-tesis__micro {
  margin: 0;
  color: color-mix(in srgb, var(--blanco) 72%, transparent);
  font-size: 12px;
  letter-spacing: .04em;
}
.apb-tesis__cuerpo a { color: var(--ambar); text-decoration: underline; text-underline-offset: 3px; }
.apb-tesis__cuerpo a:hover { color: var(--blanco); }

@media (max-width: 47.99rem) {
  .apb-tesis { padding: 74px var(--marco); }
  .apb-tesis__frase { max-width: none; }
  .apb-tesis__pie { grid-template-columns: 46px minmax(0, 1fr); gap: 16px; margin-top: 32px; }
  .apb-tesis__luz { filter: blur(30px); opacity: .42; }
}

/* Sin movimiento: se ve encendida desde el principio y el halo se queda quieto */
@media (prefers-reduced-motion: reduce) {
  .apb-tesis__frase .palabra { opacity: 1 !important; transform: none !important; filter: none !important; }
  .apb-tesis__luz { transition: none; }
}

/* Las reglas globales de h2 pintan tinta sobre tinta. Sobre el plano oscuro
   el titular es blanco, sin discusión. */
.apb-tesis .apb-tesis__frase,
.apb-tesis h2.apb-tesis__frase { color: var(--blanco); }
.apb-tesis .apb-tesis__frase em { color: var(--ambar); font-style: italic; }

/* =========================================================================
   EL ÉNFASIS SOBRE PLANO OSCURO
   Estaba en --amarillo (#FFEE46). Ese amarillo funciona como acento diminuto
   —un punto, una línea de 2 px— pero en un titular de 60 px sobre tinta pasa
   de acento a subrayador flúor: satura, vibra contra el fondo y parece un
   fallo de render, no una decisión. El ámbar de marca dice lo mismo en tono
   de oro cálido y sostiene el peso tipográfico sin gritar.
   ========================================================================= */
.cierre .titulo em,
.plan .titulo em { color: var(--ambar); }

/* Los rótulos pequeños en mayúsculas también bajan de flúor a oro */
.plan__r,
.plan .rotulo { color: color-mix(in srgb, var(--ambar) 88%, var(--blanco)); }
.plan .rotulo::before { background: var(--ambar); }
.cierre .rotulo::before { background: var(--ambar); }

/* En el menú a pantalla completa el amarillo sí funciona: es un solo enlace
   sobre magenta, no un titular sobre tinta. Se queda. */

/* No era el tono de amarillo: era el amarillo. En esa sección la foto ya lleva
   una chaqueta amarilla, así que el titular competía con ella, y a 60 px en
   cursiva sobre ciruela oscura cualquier amarillo vibra. La crema de marca
   distingue el énfasis del blanco de la primera línea, tiene contraste de
   sobra y no pelea con la fotografía. */
.cierre .titulo em,
.plan .titulo em { color: var(--crema-marca); }
.plan__r,
.plan .rotulo { color: color-mix(in srgb, var(--crema-marca) 92%, var(--blanco)); }
.plan .rotulo::before,
.cierre .rotulo::before { background: linear-gradient(90deg, var(--naranja), var(--crema-marca)); }

/* =========================================================================
   TITULARES SOBRE FONDO OSCURO
   ---------------------------------------------------------------------
   WordPress genera desde theme.json una hoja «global-styles-inline-css» que
   se imprime DESPUÉS de las del tema y contiene:

       h1, h2, h3, h4, h5, h6 { color: #261A22; }

   Es un selector de elemento, así que pierde contra cualquier clase — pero
   solo si esa clase declara color. Las secciones oscuras daban el color al
   contenedor y dejaban que el titular lo heredara, y ahí la regla global de
   WordPress ganaba: titular en tinta sobre tinta, contraste 1, invisible.

   Por eso el énfasis en cursiva sí se veía (tenía color propio) y el resto
   del titular no. Aquí se declara el color en el propio titular.
   ========================================================================= */
.cierre .titulo,
.plan .titulo,
.seccion--oscura .titulo,
.apb-tesis .apb-tesis__frase { color: var(--blanco); }

/* La llamada a la acción solo va en blanco cuando su fondo es oscuro. En las
   variantes claras —la CTA intermedia de las páginas largas va en crema— el
   titular tiene que ir en tinta o se queda en blanco sobre blanco. */
.apb-cta:not(.apb-cta--cream):not(.apb-cta--paper):not(.apb-cta--marfil):not(.apb-cta--light):not(.apb-cta--white) .titulo { color: var(--blanco); }

/* El resto de textos de esas secciones, por si algún día heredan de más arriba */
.cierre h1, .cierre h2, .cierre h3,
.plan h1, .plan h2, .plan h3,
.apb-tesis h1, .apb-tesis h2, .apb-tesis h3 { color: var(--blanco); }

/* Y el énfasis mantiene su crema */
.cierre .titulo em,
.plan .titulo em { color: var(--crema-marca); }

/* ENTREGA DEL RECURSO — la audioguía o la descarga en la página de gracias */
.apb-entrega {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(30px, 4.5vw, 66px);
  max-width: var(--ancho);
  margin: clamp(48px, 6vw, 84px) auto;
  padding-inline: var(--marco);
}
.apb-entrega__titulo { margin: 14px 0 18px; font-family: var(--display); font-size: clamp(28px, 3.2vw, 46px); font-weight: 420; line-height: 1.1; letter-spacing: -.028em; }
.apb-entrega__texto p { color: var(--tinta-suave); font-size: 16px; line-height: 1.72; }
.apb-entrega__pasos { margin-top: 20px; display: grid; gap: 9px; }
.apb-entrega__pasos li { position: relative; padding-left: 26px; color: var(--tinta-suave); font-size: 15px; line-height: 1.6; }
.apb-entrega__pasos li::before { content: ''; position: absolute; left: 0; top: .55em; width: 12px; height: 1px; background: var(--magenta); }
.apb-entrega__caja { display: grid; gap: 16px; }
.apb-entrega__puerta {
  display: grid;
  place-items: center;
  gap: 14px;
  padding: clamp(36px, 5vw, 62px) clamp(24px, 3vw, 38px);
  border: 1px solid var(--linea);
  background: var(--marfil-2);
  text-align: center;
}
.apb-entrega__aviso { max-width: 34ch; color: var(--gris); font-size: 11px; line-height: 1.55; }
.apb-entrega__marco { position: relative; aspect-ratio: 16 / 9; border: 1px solid var(--linea); background: var(--tinta); }
.apb-entrega__marco iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.apb-entrega__descarga { display: grid; justify-items: center; gap: 9px; }
.apb-entrega__descarga .boton { width: 100%; }
.apb-entrega__nota { color: var(--gris); font-size: 11px; line-height: 1.5; text-align: center; }
@media (max-width: 47.99rem) {
  .apb-entrega { grid-template-columns: 1fr; gap: 28px; }
}

/* AGENDA — el calendario de TidyCal, que hasta ahora no tenía estilos */
.apb-agenda {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  align-items: start;
  gap: clamp(30px, 4.5vw, 70px);
  max-width: var(--ancho);
  margin: clamp(48px, 6vw, 90px) auto;
  padding-inline: var(--marco);
}
.apb-agenda__intro h2 { margin: 14px 0 18px; font-family: var(--display); font-size: clamp(28px, 3.2vw, 46px); font-weight: 420; line-height: 1.1; letter-spacing: -.028em; }
.apb-agenda__intro p { color: var(--tinta-suave); font-size: 16px; line-height: 1.72; }
.apb-agenda__panel { display: grid; gap: 14px; }
.apb-agenda__gate {
  display: grid;
  place-items: center;
  gap: 15px;
  min-height: min(var(--apb-agenda-height, 720px), 62svh);
  padding: clamp(32px, 4.5vw, 58px) clamp(22px, 3vw, 36px);
  border: 1px solid var(--linea);
  background: var(--marfil-2);
  text-align: center;
}
.apb-agenda__gate p { max-width: 38ch; color: var(--gris); font-size: 12px; line-height: 1.6; }
.apb-agenda__iframe { width: 100%; height: min(var(--apb-agenda-height, 720px), 82svh); border: 1px solid var(--linea); background: var(--papel); }
.apb-agenda__unavailable { padding: 30px; border: 1px solid var(--linea); background: var(--marfil-2); color: var(--tinta-suave); font-size: 15px; line-height: 1.65; }
.apb-agenda__fallback { font-size: 13px; }
.apb-agenda__fallback a { color: var(--magenta); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 61.99rem) {
  .apb-agenda { grid-template-columns: 1fr; gap: 26px; }
}

/* =========================================================================
   Títulos y certificados (bloque alexandra/diplomas)
   Cada documento, entero y sin recortar, con su institución y su año.
   ========================================================================= */
.apb-diplomas { max-width: 1280px; margin: clamp(72px, 9vw, 128px) auto; padding: 0 var(--marco); }
.apb-diplomas > p:not(.rotulo) { max-width: 62ch; color: var(--tinta-suave); font-size: 16px; line-height: 1.72; }
.apb-diplomas__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 42px 32px; margin: clamp(32px, 4vw, 52px) 0 0; padding: 0; list-style: none; }
.apb-diploma__figura { margin: 0; }
.apb-diploma__imagen { display: flex; align-items: flex-end; justify-content: center; aspect-ratio: 5 / 4; padding: 16px; border: 1px solid var(--linea); background: var(--marfil-2); }
.apb-diploma__imagen img { width: auto; height: auto; max-width: 100%; max-height: 100%; box-shadow: 0 16px 30px -20px rgb(38 26 34 / 55%); }
.apb-diploma__pie { margin-top: 16px; }
.apb-diploma__titulo { margin: 0 0 6px; font-family: var(--display); font-size: 19px; font-weight: 400; line-height: 1.25; }
.apb-diploma__original,
.apb-diploma__datos,
.apb-diploma__detalle { margin: 5px 0 0; color: var(--tinta-suave); font-size: 13px; line-height: 1.55; }
.apb-diploma__original { font-style: italic; }
.apb-diploma__emisor { margin: 6px 0 0; font-size: 14px; line-height: 1.5; }
.apb-diploma__emisor a { color: var(--magenta); text-decoration: underline; text-underline-offset: 3px; }
