/*
Theme Name: Huella Digital 2026
Theme URI: https://conhuelladigital.com
Author: Huella Digital
Description: Tema a medida de Huella Digital, oscuro y premium (noviembre de 2026). Tu equipo extendido de marketing e IA.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.1
License: Propietario
Text Domain: huella
*/

/* =====================================================================
   Sitio de Huella Digital, versión 4 (noviembre de 2026).

   Sale de la vista previa que aprobó David el 2026-11-13
   (Marketing/disenos/rediseno-web/): mismos valores, con el prefijo hd-
   en las clases. La primera parte es el kit y la portada tal cual; la
   segunda, al final, viste lo que la vista previa no tenía (la cabecera
   de WordPress, la ventana de la llamada, el chat de Thera y el blog).
   ===================================================================== */

/* Concepto: fondo noche, paneles grandes de esquinas muy redondas apilados como láminas;
   el naranja es la luz (brillos, acentos, tarjetas) y el crema solo da respiro. */
:root {
  color-scheme: dark;
  --noche: #120C08;            /* nuevo: un paso más oscuro que "oscuro", para el fondo de página */
  --oscuro: #1E150F;
  --superficie: #2C231D;
  --naranja: #E8590C;
  --naranja-claro: #F37331;
  --naranja-profundo: #B8430A;
  --ambar: #F2A100;
  --durazno: #FCD8BE;
  --durazno-suave: #FFE9D8;
  --crema: #FCFAF7;
  --tinta: #241C15;
  --tinta-media: #4C4038;
  --blanco: #FFFFFF;
  --texto-medio: #C0B8B1;
  --texto-tenue: #9A918A;
  --borde: rgba(255, 255, 255, 0.12);
  --vidrio-borde: rgba(255, 255, 255, 0.2);
  --desenfoque: blur(18px) saturate(150%);
  --sombra-flota: 0 2px 4px rgba(0, 0, 0, .18), 0 14px 24px -12px rgba(0, 0, 0, .45), 0 36px 60px -30px rgba(0, 0, 0, .7);
  --sombra-flota-naranja: 0 2px 4px rgba(0, 0, 0, .14), 0 16px 28px -12px rgba(184, 67, 10, .55), 0 36px 60px -30px rgba(232, 89, 12, .5);
  --sombra-flota-clara: 0 1px 2px rgba(70, 38, 14, .06), 0 12px 22px -12px rgba(70, 38, 14, .2), 0 30px 50px -30px rgba(70, 38, 14, .3);
  --borde-claro: rgba(36, 28, 21, 0.12);
  --radio-panel: 40px;
  --radio-tarjeta: 28px;
  --radio-pildora: 999px;
  --font-sans: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --curva: cubic-bezier(.2, .7, .1, 1);
}
* { box-sizing: border-box; }
body { background: var(--noche); color: var(--blanco); font-family: var(--font-sans); font-size: 16px; line-height: 1.6; }
.hd-marco { max-width: 1240px; margin: 0 auto; padding-block: 20px 56px; padding-left: max(16px, env(safe-area-inset-left, 0px)); padding-right: max(16px, env(safe-area-inset-right, 0px)); display: flex; flex-direction: column; gap: 20px; }
h1, h2, h3, p { margin: 0; }
h1, h2, h3 { text-wrap: balance; }
img { display: block; }
:focus-visible { outline: 2px solid var(--ambar); outline-offset: 3px; }

.hd-barra-progreso { position: fixed; inset: 0 auto auto 0; height: 3px; width: 100%; background: var(--naranja); transform-origin: 0 50%; transform: scaleX(0); z-index: 20; }

/* Cabecera del kit */
.hd-cabecera { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding-block: 8px; }
.hd-cabecera img { height: 30px; width: auto; }
.hd-cabecera p { font-size: 13px; color: var(--texto-medio); }

/* Paneles */
.hd-panel { position: relative; overflow: hidden; border-radius: var(--radio-panel); background: var(--oscuro); border: 1px solid var(--borde); padding: clamp(24px, 5vw, 64px); display: flex; flex-direction: column; gap: clamp(24px, 4vw, 44px); }
.hd-panel > * { position: relative; }
.hd-panel.hd-crema { background: var(--crema); color: var(--tinta); border-color: transparent; }
.hd-panel.hd-naranja { background: var(--naranja); border-color: transparent; }

/* Rótulo píldora y titulares de dos tonos */
.hd-rotulo { align-self: flex-start; display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: var(--texto-medio); }
.hd-rotulo::before { content: ""; flex: none; width: 26px; height: 20px; background: url(assets/isotipo-huella.png) center / contain no-repeat; }
.hd-crema .hd-rotulo { color: var(--tinta-media); }
.hd-naranja .hd-rotulo { color: var(--blanco); }
.hd-naranja .hd-rotulo::before { filter: brightness(0) invert(1); }

.hd-titular { font-size: clamp(34px, 5.4vw, 68px); line-height: 1.04; font-weight: 600; letter-spacing: -0.04em; }
.hd-titular-seccion { font-size: clamp(28px, 4vw, 48px); line-height: 1.08; font-weight: 600; letter-spacing: -0.035em; max-width: 18ch; }
.hd-tono { color: var(--naranja-claro); font-weight: 300; }
.hd-crema .hd-tono { color: var(--naranja); }
.hd-punto { color: var(--naranja-claro); font-weight: 700; }
.hd-crema .hd-punto { color: var(--naranja); }
.hd-naranja .hd-punto { color: var(--noche); }
.hd-bajada { font-size: clamp(16px, 1.6vw, 18px); color: var(--texto-medio); max-width: 52ch; }
.hd-crema .hd-bajada { color: var(--tinta-media); }
.hd-nota-chica { font-size: 13.5px; color: var(--texto-tenue); max-width: 70ch; }
.hd-crema .hd-nota-chica { color: var(--tinta-media); }
.hd-fila-titulo { display: flex; flex-direction: column; gap: 16px; }

/* Botones */
.hd-boton { display: inline-flex; align-items: center; gap: 12px; font: 600 15px/1.3 var(--font-sans); padding: 8px 8px 8px 22px; border-radius: var(--radio-pildora); border: 1px solid transparent; cursor: pointer; text-decoration: none; white-space: nowrap; background: var(--naranja); color: var(--blanco); transition: background .25s, transform .25s var(--curva); }
.hd-boton .hd-flecha { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--blanco); color: var(--naranja); transition: transform .35s var(--curva); }
.hd-boton:hover { background: var(--naranja-claro); }
.hd-boton:hover .hd-flecha { transform: rotate(45deg); }
.hd-boton.hd-linea { background: transparent; border-color: var(--borde); color: var(--blanco); }
.hd-boton.hd-linea .hd-flecha { background: var(--superficie); color: var(--blanco); }
.hd-boton.hd-linea:hover { border-color: var(--naranja-claro); }
.hd-boton.hd-sobre-crema { background: var(--tinta); }
.hd-boton.hd-sobre-crema .hd-flecha { background: var(--naranja); color: var(--blanco); }
.hd-boton.hd-sobre-naranja { background: var(--noche); }
.hd-boton.hd-simple { padding: 12px 22px; }
.hd-fila { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }

/* ---------- 1. Hero de muestra ---------- */
.hd-hero { background: var(--noche); min-height: 0; }
.hd-hero .hd-luz { position: absolute; inset: -20% -10% -20% 30%; background: radial-gradient(50% 55% at 60% 45%, rgba(232, 89, 12, .75), rgba(184, 67, 10, .35) 45%, transparent 72%); pointer-events: none; }
.hd-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hd-nav img { height: 30px; width: auto; }
.hd-nav ul { list-style: none; margin: 0; padding: 6px; display: flex; gap: 4px; border-radius: var(--radio-pildora); background: rgba(255,255,255,.08); border: 1px solid var(--borde); backdrop-filter: blur(10px); font-size: 14px; }
.hd-nav li { padding: 7px 16px; border-radius: var(--radio-pildora); color: var(--texto-medio); }
.hd-nav li.hd-activo { background: var(--blanco); color: var(--tinta); font-weight: 600; }
.hd-hero-cuerpo { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(24px, 4vw, 56px); align-items: end; }
.hd-hero-texto { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.hd-hero-datos { display: grid; grid-template-columns: repeat(2, minmax(0, 210px)); gap: 12px; margin-top: 12px; }
.hd-dato { border-radius: var(--radio-tarjeta); padding: 20px; background: var(--durazno-suave); color: var(--tinta); display: flex; flex-direction: column; gap: 6px; }
.hd-dato b { font-size: clamp(30px, 3.4vw, 44px); line-height: 1; font-weight: 500; letter-spacing: -0.04em; }
.hd-dato span { font-size: 13px; line-height: 1.4; color: var(--tinta-media); }
.hd-dato.hd-vidrio { background: rgba(255,255,255,.1); color: var(--blanco); border: 1px solid var(--borde); backdrop-filter: blur(12px); }
.hd-dato.hd-vidrio span { color: var(--durazno); }
.hd-dato.hd-fuerte { background: var(--naranja); color: var(--blanco); }
.hd-dato.hd-fuerte span { color: var(--noche); font-weight: 500; }
.hd-dato.hd-osc { background: var(--superficie); color: var(--blanco); }
.hd-dato.hd-osc span { color: var(--texto-medio); }

/* Lugar de foto */
.hd-foto { position: relative; border-radius: var(--radio-tarjeta); overflow: hidden; min-height: 300px; background: radial-gradient(70% 60% at 85% 30%, var(--naranja-claro), var(--naranja-profundo) 45%, #3a1a08 75%, var(--noche)); display: flex; align-items: flex-end; }
.hd-foto.hd-alta { aspect-ratio: 4 / 5; max-width: 100%; }
.hd-foto .hd-aviso { margin: 14px; padding: 10px 14px; border-radius: 16px; font-size: 12.5px; line-height: 1.45; background: rgba(18,12,8,.72); color: var(--durazno); border: 1px dashed rgba(252,216,190,.5); }
.hd-foto .hd-interior { position: absolute; inset: 0; background: inherit; }
.hd-foto .hd-aviso { position: relative; }

/* ---------- 2. Colores ---------- */
.hd-proporcion { display: flex; height: 64px; border-radius: 20px; overflow: hidden; border: 1px solid var(--borde); }
.hd-proporcion span { display: flex; align-items: flex-end; padding: 8px 12px; font-size: 11.5px; font-weight: 600; min-width: 0; white-space: nowrap; }
.hd-muestras { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.hd-muestra { position: relative; overflow: hidden; border-radius: 22px; padding: 14px; min-height: 128px; display: flex; flex-direction: column; justify-content: flex-end; gap: 2px; font-size: 12.5px; border: 1px solid var(--borde); }
.hd-muestra b { font-size: 14px; font-weight: 600; }
.hd-muestra code { font: 500 12px/1.4 ui-monospace, Consolas, monospace; opacity: .85; }
.hd-muestra em { font-style: normal; opacity: .85; }
.hd-nuevo { position: absolute; top: 0; right: 0; font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; padding: 7px 14px 7px 16px; border-radius: 0 0 0 18px; background: var(--naranja); color: var(--blanco); }

/* ---------- 3. Letra ---------- */
.hd-escala { display: flex; flex-direction: column; }
.hd-escala > div { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 20px; align-items: baseline; padding-block: 20px; border-top: 1px solid var(--borde); }
.hd-escala small { font-size: 12.5px; color: var(--texto-tenue); line-height: 1.5; }
.hd-t-cuerpo { font-size: 16px; color: var(--texto-medio); max-width: 60ch; }
.hd-t-tarjeta { font-size: 24px; line-height: 1.2; font-weight: 500; letter-spacing: -0.02em; }

/* ---------- 5. Mosaico ---------- */
.hd-mosaico { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.hd-pieza { border-radius: var(--radio-tarjeta); padding: 24px; min-height: 250px; display: flex; flex-direction: column; justify-content: space-between; gap: 20px; background: var(--durazno-suave); color: var(--tinta); transition: transform .45s var(--curva); }
.hd-pieza { transition: transform .45s var(--curva), box-shadow .45s var(--curva); }
.hd-pieza:hover { transform: translateY(-6px); }
.hd-pieza header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.hd-pieza h3 { font-size: clamp(26px, 2.6vw, 34px); line-height: 1.05; font-weight: 400; letter-spacing: -0.035em; }
.hd-pieza p { font-size: 14px; line-height: 1.5; color: var(--tinta-media); }
.hd-pieza .hd-flecha { flex: none; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--tinta); color: var(--blanco); }
.hd-pieza.hd-n { background: var(--naranja); color: var(--blanco); }
.hd-pieza.hd-n p { color: var(--noche); font-weight: 500; }
.hd-pieza.hd-n .hd-flecha { background: var(--blanco); color: var(--naranja); }
.hd-pieza.hd-o { background: var(--superficie); color: var(--blanco); border: 1px solid var(--borde); }
.hd-pieza.hd-o p { color: var(--texto-medio); }
.hd-pieza.hd-o .hd-flecha { background: var(--naranja); }
.hd-pieza.hd-ancha { grid-column: span 2; }

.hd-datos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.hd-datos .hd-dato { min-height: 150px; justify-content: space-between; }

/* ---------- 7. Pasos (crema) ---------- */
.hd-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hd-paso { border-radius: var(--radio-tarjeta); padding: 24px; background: var(--blanco); border: 1px solid var(--borde-claro); display: flex; flex-direction: column; gap: 12px; }
.hd-paso i { font-style: normal; font-size: 64px; line-height: .9; font-weight: 300; letter-spacing: -0.05em; color: var(--naranja); }
.hd-paso i::after { content: "."; font-weight: 700; }
.hd-paso:last-child i { color: var(--naranja-claro); }
.hd-paso h3 { font-size: 22px; line-height: 1.2; font-weight: 500; letter-spacing: -0.02em; }
.hd-paso p { font-size: 14.5px; color: var(--tinta-media); }
.hd-paso:last-child { background: var(--tinta); color: var(--blanco); border-color: transparent; }
.hd-paso:last-child p { color: var(--texto-medio); }

/* ---------- 8. Movimiento ---------- */
.hd-demos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hd-demo { border-radius: var(--radio-tarjeta); border: 1px solid var(--borde); background: var(--noche); padding: 20px; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.hd-demo .hd-escena { min-height: 210px; display: flex; flex-direction: column; justify-content: center; gap: 10px; }
.hd-demo h3 { font-size: 16px; font-weight: 600; }
.hd-demo p { font-size: 13.5px; color: var(--texto-medio); }
.hd-demo .hd-mini-titular { font-size: clamp(24px, 2.4vw, 32px); line-height: 1.1; font-weight: 600; letter-spacing: -0.035em; }
.hd-demo .hd-mini { border-radius: 16px; padding: 12px 14px; font-size: 13.5px; font-weight: 500; }
.hd-demo .hd-mini:nth-child(1) { background: var(--durazno-suave); color: var(--tinta); }
.hd-demo .hd-mini:nth-child(2) { background: var(--naranja); }
.hd-demo .hd-mini:nth-child(3) { background: var(--superficie); border: 1px solid var(--borde); }
.hd-demo .hd-foto { min-height: 210px; }
.hd-repetir { align-self: flex-start; font: 600 13px/1 var(--font-sans); color: var(--blanco); background: transparent; border: 1px solid var(--borde); border-radius: var(--radio-pildora); padding: 10px 16px; cursor: pointer; }
.hd-repetir:hover { border-color: var(--naranja-claro); }
.hd-reglas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hd-reglas div { border-top: 1px solid var(--borde); padding-top: 16px; display: flex; flex-direction: column; gap: 6px; }
.hd-reglas b { font-weight: 600; }
.hd-reglas span { font-size: 14px; color: var(--texto-medio); }

/* ---------- 9. Fotos y Thera ---------- */
.hd-fotos { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.hd-thera { position: relative; border-radius: var(--radio-tarjeta); overflow: hidden; background: radial-gradient(60% 55% at 50% 62%, var(--naranja), var(--naranja-profundo) 48%, var(--oscuro) 80%); display: flex; flex-direction: column; align-items: center; justify-content: flex-end; min-height: 300px; }
.hd-thera img { width: min(78%, 280px); height: auto; filter: drop-shadow(0 24px 30px rgba(0,0,0,.45)); }

/* ---------- 10. Portal ---------- */
.hd-ventana { border-radius: 28px; border: 1px solid var(--borde); background: var(--noche); display: grid; grid-template-columns: 200px minmax(0, 1fr); overflow: hidden; }
.hd-lateral { padding: 20px 14px; border-right: 1px solid var(--borde); display: flex; flex-direction: column; gap: 6px; }
.hd-lateral img { height: 24px; width: auto; align-self: flex-start; margin: 0 8px 14px; }
.hd-lateral span { font-size: 14px; padding: 9px 14px; border-radius: var(--radio-pildora); color: var(--texto-medio); }
.hd-lateral span.hd-activo { background: var(--naranja); color: var(--blanco); font-weight: 600; }
.hd-tablero { padding: 20px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 14px; }
.hd-tablero h3 { grid-column: 1 / -1; font-size: 26px; font-weight: 600; letter-spacing: -0.03em; }
.hd-caja { border-radius: 22px; padding: 18px; background: var(--superficie); border: 1px solid var(--borde); display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.hd-caja.hd-clara { background: var(--durazno-suave); color: var(--tinta); border-color: transparent; }
.hd-caja small { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-tenue); }
.hd-caja.hd-clara small { color: var(--naranja-profundo); }
.hd-caja b { font-size: 18px; font-weight: 500; letter-spacing: -0.02em; }
.hd-tarea { display: flex; align-items: center; gap: 10px; color: var(--texto-medio); }
.hd-tarea::before { content: ""; flex: none; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--texto-tenue); }
.hd-tarea.hd-hecha { text-decoration: line-through; color: var(--texto-tenue); }
.hd-tarea.hd-hecha::before { background: var(--naranja); border-color: var(--naranja); }

/* ---------- Cierre ---------- */
.hd-cierre { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 56px); align-items: end; }
.hd-cierre ol { margin: 0; padding: 0; list-style: none; counter-reset: c; display: flex; flex-direction: column; gap: 10px; }
.hd-cierre li { counter-increment: c; display: flex; gap: 14px; align-items: baseline; padding: 14px 18px; border-radius: 20px; background: rgba(18,12,8,.16); color: var(--noche); font-weight: 500; }
.hd-cierre li::before { content: counter(c); font-weight: 700; color: var(--blanco); }
.hd-panel > .hd-isotipo { position: absolute; right: -30px; top: -40px; width: 190px; opacity: .22; filter: brightness(0); pointer-events: none; }

/* ---------- Vidrio ----------
   El vidrio solo se nota si hay luz detrás: por eso cada panel oscuro lleva su propio brillo naranja.
   El desenfoque va en las piezas chicas, no en los paneles enteros, para que el celular no se trabe. */
.hd-ambiente { position: fixed; inset: 0; z-index: -1; pointer-events: none; background:
  radial-gradient(42% 36% at 88% 8%, rgba(232, 89, 12, .30), transparent 70%),
  radial-gradient(36% 40% at 4% 62%, rgba(184, 67, 10, .28), transparent 70%),
  radial-gradient(30% 30% at 72% 96%, rgba(242, 161, 0, .10), transparent 70%); }
.hd-panel:not(.hd-crema):not(.hd-naranja) { box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 40px 70px -50px rgba(0, 0, 0, .9); }
.hd-panel:not(.hd-crema):not(.hd-naranja):not(.hd-hero) { background: linear-gradient(160deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .015) 38%), rgba(30, 21, 15, .78); }
.hd-panel:not(.hd-crema):not(.hd-naranja):not(.hd-hero)::before { content: ""; position: absolute; width: 60%; height: 80%; right: -12%; bottom: -30%; border-radius: 50%; background: radial-gradient(closest-side, rgba(232, 89, 12, .42), rgba(184, 67, 10, .16) 55%, transparent); pointer-events: none; }
.hd-panel:not(.hd-crema):not(.hd-naranja):not(.hd-hero):nth-of-type(odd)::before { right: auto; left: -14%; bottom: auto; top: -28%; }
.hd-pieza.hd-o, .hd-dato.hd-osc, .hd-dato.hd-vidrio, .hd-caja:not(.hd-clara), .hd-demo, .hd-ventana, .hd-nav ul, .hd-boton.hd-linea, .hd-flota, .hd-muestra.hd-vidrio {
  background: linear-gradient(145deg, rgba(255, 255, 255, .16), rgba(255, 255, 255, .04) 45%, rgba(255, 255, 255, .07));
  -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque);
  border: 1px solid var(--vidrio-borde);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(255, 255, 255, .04), var(--sombra-flota);
}
.hd-ventana { background: linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(18, 12, 8, .45) 50%); }
.hd-demo { background: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(18, 12, 8, .5) 50%); }
.hd-boton.hd-linea .hd-flecha { background: rgba(255, 255, 255, .16); }
.hd-flota { position: absolute; top: 16px; left: 16px; max-width: 230px; border-radius: 22px; padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; line-height: 1.4; color: var(--blanco); }
.hd-flota b { font-weight: 600; display: flex; align-items: center; gap: 8px; }
.hd-flota b::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--naranja-claro); box-shadow: 0 0 0 4px rgba(243, 115, 49, .25); }
.hd-flota span { color: var(--durazno); }

/* ---------- Tarjetas flotantes ----------
   Tres capas de sombra (contacto, cuerpo y ambiente) en vez de una sola fuerte: así la tarjeta flota sin verse pesada. */
.hd-pieza, .hd-dato, .hd-muestra, .hd-foto, .hd-thera, .hd-boton, .hd-proporcion { box-shadow: var(--sombra-flota); }
.hd-pieza.hd-n, .hd-dato.hd-fuerte, .hd-boton:not(.hd-linea):not(.hd-sobre-crema):not(.hd-sobre-naranja) { box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255, 255, 255, .28); }
.hd-crema .hd-paso, .hd-crema .hd-boton { box-shadow: var(--sombra-flota-clara); }
.hd-pieza, .hd-dato:not(.hd-vidrio):not(.hd-osc):not(.hd-fuerte) { box-shadow: var(--sombra-flota), inset 0 1px 0 rgba(255, 255, 255, .7); }
.hd-pieza.hd-n { box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255, 255, 255, .28); }

/* ---------- Movimiento al bajar ---------- */
.hd-js [data-hd-rv] { opacity: 0; transform: translateY(32px); transition: opacity .7s ease, transform .9s var(--curva); transition-delay: calc(var(--i, 0) * 90ms); }
.hd-js [data-hd-rv].hd-visto { opacity: 1; transform: none; }
.hd-js [data-hd-rv="telon"] { opacity: 1; transform: none; clip-path: inset(0 0 100% 0 round 28px); transition: clip-path 1.1s var(--curva); }
.hd-js [data-hd-rv="telon"].hd-visto { clip-path: inset(0 0 0 0 round 28px); }
.hd-js [data-hd-rv="telon"] .hd-interior { transform: scale(1.25); transition: transform 1.5s var(--curva); }
.hd-js [data-hd-rv="telon"].hd-visto .hd-interior { transform: none; }
.hd-js [data-hd-rv="palabras"] { opacity: 1; transform: none; }
.hd-pal { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .14em; margin-bottom: -.14em; }
.hd-pal > span { display: inline-block; }
.hd-js [data-hd-rv="palabras"] .hd-pal > span { transform: translateY(115%); transition: transform .85s var(--curva); transition-delay: calc(var(--p, 0) * 60ms); }
.hd-js [data-hd-rv="palabras"].hd-visto .hd-pal > span { transform: none; }
.hd-sin-transicion, .hd-sin-transicion * { transition: none !important; }

@media (max-width: 900px) {
  .hd-hero-cuerpo, .hd-cierre { grid-template-columns: 1fr; }
  .hd-nav ul { display: none; }
  .hd-mosaico, .hd-datos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hd-pasos, .hd-demos, .hd-reglas, .hd-fotos { grid-template-columns: 1fr; }
  .hd-ventana { grid-template-columns: 1fr; }
  .hd-lateral { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--borde); }
  .hd-lateral img { display: none; }
  .hd-tablero { grid-template-columns: 1fr; }
  .hd-hero .hd-luz { inset: 30% -30% -10% -10%; }
  .hd-foto.hd-alta { aspect-ratio: 4 / 3; }
  /* En el celular el movimiento es más corto: menos recorrido y menos espera */
  .hd-js [data-hd-rv] { transform: translateY(18px); transition-duration: .5s, .6s; transition-delay: calc(var(--i, 0) * 50ms); }
}
@media (max-width: 560px) {
  :root { --radio-panel: 28px; --radio-tarjeta: 22px; }
  .hd-mosaico, .hd-datos { grid-template-columns: 1fr; }
  .hd-pieza.hd-ancha { grid-column: auto; }
  .hd-pieza { min-height: 190px; }
  .hd-hero-datos { grid-template-columns: 1fr 1fr; }
  .hd-nav img { height: 24px; }
  .hd-nav .hd-boton { font-size: 13px; padding: 10px 14px; }
  .hd-escala > div { grid-template-columns: 1fr; gap: 6px; }
  .hd-proporcion span { font-size: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .hd-js [data-hd-rv], .hd-js [data-hd-rv] .hd-interior, .hd-js [data-hd-rv] .hd-pal > span { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  .hd-barra-progreso { display: none; }
}




/* ================= Solo de la portada ================= */
html { scroll-behavior: smooth; }
section[id] { scroll-margin-top: 96px; }
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 30; background: var(--noche); }

/* Secciones libres: las oscuras van directo sobre el fondo de la página, sin caja.
   Dentro de una caja, cada tarjeta quedaba como tarjeta sobre tarjeta. */
html, body { overflow-x: clip; }
.hd-marco { gap: 0; }
.hd-marco .hd-panel:not(.hd-crema):not(.hd-naranja):not(.hd-hero), .hd-marco .hd-panel.hd-hero { background: none; border: 0; box-shadow: none; border-radius: 0; overflow: visible; padding-inline: 0; padding-block: clamp(48px, 7vw, 104px); }
.hd-panel.hd-hero { padding-top: clamp(40px, 6vw, 88px); }
/* Las claras son una franja de lado a lado: cambia el fondo de la página, no aparece otra caja. */
.hd-panel.hd-crema { border-radius: 0; border: 0; overflow: visible; padding-inline: 0; padding-block: clamp(48px, 7vw, 104px); box-shadow: 0 0 0 100vmax var(--crema); clip-path: inset(0 -100vmax); }
.hd-panel.hd-naranja { margin-block: clamp(32px, 5vw, 72px) 20px; }
.hd-hero .hd-luz { inset: -10% -18% -10% 38%; }

/* Barra: una píldora de vidrio que acompaña al bajar */
.hd-barra { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 10px); z-index: 25; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 10px 10px 10px 22px; border-radius: var(--radio-pildora); background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(30,21,15,.55) 60%); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.25), var(--sombra-flota); }
.hd-barra img { height: 28px; width: auto; }
.hd-barra nav { display: flex; gap: 2px; font-size: 14px; }
.hd-barra nav a { padding: 8px 14px; border-radius: var(--radio-pildora); color: var(--texto-medio); text-decoration: none; transition: color .2s, background .2s; }
.hd-barra nav a:hover { color: var(--blanco); background: rgba(255,255,255,.08); }
.hd-barra .hd-lado { display: flex; align-items: center; gap: 14px; }
.hd-barra .hd-sesion { font-size: 14px; color: var(--texto-medio); text-decoration: none; }
.hd-barra .hd-sesion:hover { color: var(--blanco); }

.hd-hero .hd-nota-chica { color: var(--texto-medio); }
.hd-titular-seccion.hd-ancho { max-width: 24ch; }
.hd-cabeza { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 20px; }

/* Escena del inicio: una luz naranja y tres tarjetas de vidrio con lo que hacemos cada semana.
   Reemplaza a la foto: muestra el trabajo en vez de una persona genérica. */
.hd-escena { position: relative; min-height: 460px; align-self: stretch; }
.hd-carta { position: absolute; width: min(62%, 250px); }
.hd-carta .hd-flotante { border-radius: 24px; padding: 16px 18px; display: flex; flex-direction: column; gap: 10px; font-size: 13px; line-height: 1.4; background: linear-gradient(145deg, rgba(255,255,255,.2), rgba(255,255,255,.05) 45%, rgba(255,255,255,.09)); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.32), var(--sombra-flota); animation: flotar 7s ease-in-out infinite alternate; }
.hd-carta b { font-weight: 600; font-size: 13.5px; display: flex; align-items: center; gap: 8px; }
.hd-carta b::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--naranja-claro); box-shadow: 0 0 0 4px rgba(243,115,49,.25); }
.hd-carta span { color: var(--durazno); }
.hd-carta.hd-c1 { top: 0; left: 0; }
.hd-carta.hd-c2 { top: 36%; right: 0; }
.hd-carta.hd-c2 .hd-flotante { animation-delay: -2.5s; }
.hd-carta.hd-c3 { bottom: 0; left: 8%; }
.hd-carta.hd-c3 .hd-flotante { animation-delay: -5s; }
.hd-piezas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.hd-piezas i { aspect-ratio: 1; border-radius: 10px; background: var(--durazno-suave); color: var(--tinta); display: grid; place-items: center; }
.hd-piezas svg { width: 46%; height: 46%; }
.hd-piezas i:nth-child(n+2) { color: var(--blanco); }
.hd-piezas i:nth-child(2) { background: var(--naranja); }
.hd-piezas i:nth-child(3) { background: rgba(255,255,255,.16); border: 1px solid var(--vidrio-borde); }
.hd-mini-globo { align-self: flex-start; padding: 8px 12px; border-radius: 14px 14px 14px 4px; background: rgba(255,255,255,.14); color: var(--blanco); }
.hd-barras { display: flex; align-items: flex-end; gap: 6px; height: 46px; }
.hd-barras i { flex: 1; border-radius: 6px 6px 2px 2px; background: rgba(255,255,255,.2); }
.hd-barras i:nth-child(1) { height: 35%; } .hd-barras i:nth-child(2) { height: 50%; } .hd-barras i:nth-child(3) { height: 45%; } .hd-barras i:nth-child(4) { height: 72%; }
.hd-barras i:nth-child(5) { height: 100%; background: var(--naranja); box-shadow: 0 0 18px rgba(232,89,12,.8); }
@keyframes flotar { from { transform: translateY(-7px); } to { transform: translateY(7px); } }
@media (prefers-reduced-motion: reduce) { .hd-carta .hd-flotante { animation: none; } }
@media (max-width: 900px) { .hd-escena { min-height: 420px; } .hd-carta { width: min(66%, 240px); } }

/* Tu semana */
.hd-semana { display: flex; flex-direction: column; gap: 10px; }
.hd-semana .hd-renglon { display: grid; grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1.15fr); align-items: center; gap: 14px; padding: 18px 22px; border-radius: 22px; background: var(--blanco); border: 1px solid var(--borde-claro); box-shadow: var(--sombra-flota-clara); }
.hd-semana .hd-antes { color: var(--tinta-media); font-size: 15px; background: linear-gradient(var(--naranja), var(--naranja)) 0 55% / 0 1.5px no-repeat; justify-self: start; transition: background-size .8s var(--curva) .35s; }
.hd-semana .hd-visto .hd-antes { background-size: 100% 1.5px; }
.hd-semana .hd-ahora { font-weight: 500; font-size: 16.5px; letter-spacing: -0.01em; }
.hd-semana .hd-va { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--naranja); color: var(--blanco); transform: rotate(45deg); }
.hd-semana .hd-tuyo { background: var(--tinta); color: var(--blanco); border-color: transparent; }
.hd-semana .hd-tuyo .hd-antes { color: var(--blanco); background: none; font-weight: 500; font-size: 16.5px; }
.hd-semana .hd-tuyo .hd-ahora { color: var(--naranja-claro); }
.hd-semana .hd-tuyo .hd-va { background: rgba(255,255,255,.14); }
.hd-columnas { display: grid; grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1.15fr); gap: 14px; padding-inline: 22px; font-size: 11.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--tinta-media); }
.hd-columnas span:last-child { grid-column: 3; color: var(--naranja); }

/* Pasos sobre oscuro: vidrio */
.hd-panel:not(.hd-crema) .hd-paso { background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.03) 45%, rgba(255,255,255,.06)); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--sombra-flota); color: var(--blanco); }
.hd-panel:not(.hd-crema) .hd-paso p { color: var(--texto-medio); }
.hd-panel:not(.hd-crema) .hd-paso i { color: var(--naranja-claro); }
.hd-panel:not(.hd-crema) .hd-paso:last-child { background: var(--naranja); border-color: transparent; box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255,255,255,.28); }
.hd-panel:not(.hd-crema) .hd-paso:last-child i { color: var(--blanco); }
.hd-panel:not(.hd-crema) .hd-paso:last-child p { color: var(--noche); font-weight: 500; }

/* Paquetes */
.hd-planes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
.hd-plan { position: relative; overflow: hidden; border-radius: var(--radio-tarjeta); padding: 28px 24px 24px; min-height: 230px; display: flex; flex-direction: column; justify-content: space-between; gap: 24px; text-decoration: none; background: var(--durazno-suave); color: var(--tinta); box-shadow: var(--sombra-flota), inset 0 1px 0 rgba(255,255,255,.7); transition: transform .45s var(--curva); }
.hd-plan:hover { transform: translateY(-6px); }
.hd-plan h3 { font-size: clamp(30px, 3.2vw, 42px); line-height: 1; font-weight: 600; letter-spacing: -0.04em; }
.hd-plan p { font-size: 17px; line-height: 1.35; font-weight: 300; }
.hd-plan .hd-pie-plan { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; font-weight: 600; }
.hd-plan .hd-flecha { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--tinta); color: var(--blanco); transition: transform .35s var(--curva); }
.hd-plan:hover .hd-flecha { transform: rotate(45deg); }
.hd-plan.hd-vidrio { background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.04) 45%, rgba(255,255,255,.07)); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); color: var(--blanco); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--sombra-flota); }
.hd-plan.hd-vidrio .hd-flecha { background: var(--naranja); }
.hd-plan.hd-fuerte { background: var(--naranja); color: var(--blanco); box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255,255,255,.28); }
.hd-plan.hd-fuerte .hd-flecha { background: var(--blanco); color: var(--naranja); }
.hd-plan .hd-nuevo { background: var(--noche); }

/* Thera */
.hd-thera-zona { display: grid; grid-template-columns: 1fr .8fr 1fr; gap: clamp(20px, 3vw, 40px); align-items: center; }
.hd-thera-texto { display: flex; flex-direction: column; gap: 22px; min-width: 0; }
.hd-thera-pasos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.hd-thera-pasos li { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: baseline; padding-block: 12px; border-top: 1px solid var(--borde); font-size: 15.5px; }
.hd-thera-pasos i { font-style: normal; font-size: 28px; line-height: 1; font-weight: 300; color: var(--naranja-claro); letter-spacing: -0.04em; }
.hd-thera-pasos i::after { content: "."; font-weight: 700; }
.hd-thera-figura { position: relative; display: grid; place-items: end center; min-height: 320px; }
.hd-thera-figura::before { content: ""; position: absolute; inset: 8% -10% 0; border-radius: 50%; background: radial-gradient(closest-side, rgba(232,89,12,.85), rgba(184,67,10,.4) 55%, transparent); }
.hd-thera-figura canvas { position: relative; display: block; width: min(128%, 460px); max-width: none; height: auto; aspect-ratio: 520 / 432; margin-inline: -14%; filter: drop-shadow(0 26px 30px rgba(0,0,0,.5)); }
.hd-telefono { border-radius: 34px; padding: 14px; display: flex; flex-direction: column; gap: 10px; background: linear-gradient(160deg, rgba(255,255,255,.18), rgba(18,12,8,.55) 55%); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.3), var(--sombra-flota); max-width: 340px; width: 100%; justify-self: end; }
.hd-telefono header { display: flex; align-items: center; gap: 10px; padding: 6px 8px 12px; border-bottom: 1px solid var(--borde); font-size: 14px; }
.hd-telefono header b { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--durazno); color: var(--tinta); font-weight: 600; }
.hd-telefono header span { display: flex; flex-direction: column; line-height: 1.3; font-weight: 600; }
.hd-telefono header small { font-weight: 400; font-size: 12px; color: var(--texto-medio); }
.hd-globo { max-width: 86%; padding: 10px 14px; border-radius: 18px; font-size: 14px; line-height: 1.45; }
.hd-globo.hd-ella { align-self: flex-start; background: rgba(255,255,255,.12); border-bottom-left-radius: 6px; }
.hd-globo.hd-yo { align-self: flex-end; background: var(--naranja); border-bottom-right-radius: 6px; box-shadow: 0 10px 18px -10px rgba(232,89,12,.8); }
.hd-globo small { display: block; font-size: 10.5px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--blanco); opacity: .8; margin-bottom: 2px; }
.hd-telefono .hd-hora { align-self: center; font-size: 11.5px; color: var(--texto-tenue); }

/* Equipo */
.hd-equipo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hd-persona { display: flex; flex-direction: column; gap: 14px; }
.hd-persona .hd-retrato { border-radius: var(--radio-tarjeta); overflow: hidden; aspect-ratio: 4 / 5; box-shadow: var(--sombra-flota-clara); background: var(--durazno-suave); }
.hd-persona .hd-retrato img { width: 100%; height: 100%; object-fit: cover; }
.hd-persona h3 { font-size: 21px; font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; }
.hd-persona p { font-size: 15px; font-weight: 300; color: var(--naranja); }

/* Blog */
.hd-entradas { display: flex; flex-direction: column; }
.hd-entrada { display: grid; grid-template-columns: 168px minmax(0, 1fr) 44px; align-items: center; gap: 24px; padding-block: 18px; border-top: 1px solid var(--borde); color: var(--blanco); text-decoration: none; }
.hd-entrada:last-child { border-bottom: 1px solid var(--borde); }
.hd-entrada time { display: block; font-size: 13px; color: var(--texto-tenue); margin-bottom: 6px; }
.hd-entrada img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; box-shadow: var(--sombra-flota); transition: transform .45s var(--curva); }
.hd-entrada:hover img { transform: scale(1.04); }
.hd-entrada h3 { font-size: clamp(18px, 2vw, 24px); line-height: 1.25; font-weight: 400; letter-spacing: -0.02em; transition: color .25s; }
.hd-entrada:hover h3 { color: var(--naranja-claro); }
.hd-entrada .hd-flecha { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--vidrio-borde); transition: background .25s, transform .35s var(--curva); }
.hd-entrada:hover .hd-flecha { background: var(--naranja); transform: rotate(45deg); }

/* Cierre y pie */
.hd-final { display: flex; flex-direction: column; gap: 22px; align-items: flex-start; }
.hd-final .hd-bajada { color: var(--noche); font-weight: 500; }
.hd-lema { font-size: clamp(30px, 6.6vw, 92px); line-height: 1; font-weight: 300; letter-spacing: -0.045em; color: var(--blanco); padding-top: clamp(20px, 3vw, 36px); border-top: 1px solid rgba(255,255,255,.35); }
.hd-lema b { font-weight: 700; }
.hd-naranja .hd-boton.hd-linea { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.12); box-shadow: none; }
.hd-pie { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 28px; padding: 12px 8px 0; font-size: 13.5px; color: var(--texto-tenue); }
.hd-pie img { height: 30px; width: auto; }
.hd-pie a { color: var(--texto-medio); text-decoration: none; }
.hd-pie a:hover { color: var(--blanco); }
.hd-pie div { display: flex; flex-wrap: wrap; gap: 8px 20px; }

@media (max-width: 1000px) {
  .hd-barra nav { display: none; }
  .hd-thera-zona { grid-template-columns: 1fr 1fr; }
  .hd-thera-texto { grid-column: 1 / -1; }
  .hd-telefono { justify-self: stretch; max-width: none; }
}
@media (max-width: 900px) {
  .hd-planes, .hd-equipo { grid-template-columns: 1fr; }
  .hd-equipo { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
  .hd-persona h3 { font-size: 15px; } .hd-persona p { font-size: 13px; }
  .hd-plan { min-height: 0; }
  .hd-columnas { display: none; }
  .hd-semana .hd-renglon { grid-template-columns: 1fr; gap: 8px; padding: 16px 18px; }
  .hd-semana .hd-va { display: none; }
  .hd-entrada { grid-template-columns: 104px minmax(0, 1fr); gap: 14px; }
  .hd-entrada .hd-flecha { display: none; }
  .hd-entrada img { border-radius: 12px; }
}
@media (max-width: 560px) {
  .hd-barra { padding: 8px 8px 8px 16px; }
  .hd-barra img { height: 24px; }
  .hd-barra .hd-sesion { display: none; }
  .hd-boton { font-size: 14px; padding-left: 18px; gap: 8px; }
  .hd-panel > .hd-isotipo { width: 110px; right: -20px; top: -24px; }
  .hd-barra .hd-boton { font-size: 13px; padding: 10px 14px; }
  .hd-thera-zona { grid-template-columns: 1fr; }
  .hd-thera-figura { min-height: 240px; }
  .hd-thera-figura canvas { width: min(100%, 360px); margin-inline: 0; }
  .hd-hero-texto .hd-fila .hd-boton, .hd-final .hd-fila .hd-boton { width: 100%; justify-content: space-between; }
}

/* ================= Las otras páginas ================= */
.hd-vista { display: flex; flex-direction: column; }
.hd-vista[hidden] { display: none; }
.hd-barra nav a.hd-activo { color: var(--blanco); background: rgba(255,255,255,.12); }
.hd-oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.hd-hero.hd-simple .hd-hero-texto { max-width: 820px; }
.hd-hero.hd-simple .hd-luz { inset: -30% -18% -30% 45%; }
.hd-marco .hd-panel.hd-sin-aire-arriba { padding-top: 0; }
.hd-marco .hd-panel.hd-hero.hd-simple { padding-bottom: clamp(28px, 4vw, 56px); }
.hd-vidrio-c { background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.04) 45%, rgba(255,255,255,.07)); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--sombra-flota); }

/* Servicios: el nombre del grupo queda fijo a la izquierda mientras pasan sus tarjetas */
.hd-grupo { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.7fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.hd-grupo-nombre { position: sticky; top: 112px; display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.hd-grupo-nombre h2 { font-size: clamp(44px, 6vw, 84px); line-height: .95; font-weight: 600; letter-spacing: -0.05em; }
.hd-grupo-nombre p { font-size: clamp(17px, 1.8vw, 21px); line-height: 1.35; font-weight: 300; color: var(--naranja-claro); max-width: 22ch; }
.hd-crema .hd-grupo-nombre p { color: var(--naranja); }
.hd-servs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.hd-servs .hd-nota-chica { grid-column: 1 / -1; }
.hd-serv { border-radius: var(--radio-tarjeta); padding: 26px 24px; display: flex; flex-direction: column; gap: 14px; }
.hd-serv.hd-ancha { grid-column: 1 / -1; }
.hd-serv h3 { font-size: 23px; line-height: 1.2; font-weight: 600; letter-spacing: -0.025em; }
.hd-serv > p { font-size: 15px; line-height: 1.5; color: var(--texto-medio); }
.hd-serv.hd-clara { background: var(--durazno-suave); color: var(--tinta); box-shadow: var(--sombra-flota), inset 0 1px 0 rgba(255,255,255,.7); }
.hd-serv.hd-clara > p, .hd-serv.hd-blanca > p { color: var(--tinta-media); }
.hd-serv.hd-blanca { background: var(--blanco); color: var(--tinta); border: 1px solid var(--borde-claro); box-shadow: var(--sombra-flota-clara); }
.hd-serv.hd-fuerte { background: var(--naranja); box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255,255,255,.28); }
.hd-serv.hd-fuerte > p { color: var(--noche); font-weight: 500; }
.hd-puntos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; font-size: 14.5px; line-height: 1.45; }
.hd-puntos li { display: grid; grid-template-columns: 8px minmax(0, 1fr); gap: 12px; align-items: baseline; }
.hd-puntos li::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--naranja-claro); translate: 0 -2px; }
.hd-fuerte .hd-puntos li::before { background: var(--blanco); }
.hd-clara .hd-puntos li::before, .hd-blanca .hd-puntos li::before, .hd-plan:not(.hd-vidrio):not(.hd-fuerte) .hd-puntos li::before { background: var(--naranja); }

/* Preguntas */
.hd-preguntas { display: flex; flex-direction: column; gap: 10px; max-width: 880px; }
.hd-pregunta { border-radius: 22px; }
.hd-pregunta summary { cursor: pointer; list-style: none; padding: 18px 22px; font-weight: 500; font-size: 16.5px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.hd-pregunta summary::-webkit-details-marker { display: none; }
.hd-pregunta summary::after { content: "+"; flex: none; font-size: 26px; line-height: 1; font-weight: 300; color: var(--naranja-claro); transition: rotate .3s var(--curva); }
.hd-pregunta[open] summary::after { rotate: 45deg; }
.hd-pregunta p { padding: 0 22px 20px; color: var(--texto-medio); font-size: 15px; max-width: 64ch; }

/* Paquetes */
.hd-plan.hd-detalle { min-height: 0; justify-content: flex-start; gap: 18px; }
.hd-plan.hd-detalle .hd-puntos { font-weight: 400; }
.hd-plan.hd-detalle .hd-pie-plan { margin-top: auto; padding-top: 10px; }
.hd-tabla-caja { overflow-x: auto; border-radius: var(--radio-tarjeta); }
.hd-tabla { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 15px; }
.hd-tabla th, .hd-tabla td { padding: 16px 18px; text-align: center; border-bottom: 1px solid var(--borde); }
.hd-tabla th:first-child, .hd-tabla td:first-child { text-align: left; }
.hd-tabla thead th { font-size: 17px; font-weight: 600; letter-spacing: -0.02em; }
.hd-tabla tbody tr:last-child td { border-bottom: 0; }
.hd-tabla .hd-rec { color: var(--naranja-claro); }
.hd-tabla .hd-si::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--naranja-claro); box-shadow: 0 0 0 5px rgba(243,115,49,.2); }
.hd-tabla .hd-no::before { content: ""; display: inline-block; width: 12px; height: 1.5px; background: var(--texto-tenue); vertical-align: middle; }
.hd-saber { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.hd-crema .hd-saber .hd-paso:last-child, .hd-crema .hd-pasos .hd-paso:not(:has(i)):last-child { background: var(--blanco); color: var(--tinta); border: 1px solid var(--borde-claro); }
.hd-crema .hd-saber .hd-paso:last-child p, .hd-crema .hd-pasos .hd-paso:not(:has(i)):last-child p { color: var(--tinta-media); }
.hd-crema .hd-fila .hd-nota-chica { max-width: 46ch; }

/* Thera */
.hd-frase { font-size: clamp(28px, 4.4vw, 60px); line-height: 1.08; font-weight: 300; letter-spacing: -0.04em; color: var(--naranja-claro); max-width: 20ch; }
.hd-frase b { font-weight: 600; color: var(--blanco); }
.hd-dos { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.hd-mosaico .hd-pieza:not(:has(header)) { min-height: 200px; }

/* Contacto */
.hd-contacto { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, .9fr); gap: 20px; align-items: start; }
.hd-formulario { border-radius: var(--radio-tarjeta); padding: clamp(20px, 3vw, 34px); display: grid; grid-template-columns: 1fr 1fr; gap: 16px 14px; }
.hd-formulario h2 { font-size: 24px; font-weight: 600; letter-spacing: -0.025em; }
.hd-formulario .hd-todo { grid-column: 1 / -1; }
.hd-campo { display: flex; flex-direction: column; gap: 7px; font-size: 13px; color: var(--texto-medio); min-width: 0; }
.hd-campo input, .hd-campo select, .hd-campo textarea { font: 400 15px/1.4 var(--font-sans); color: var(--blanco); background: rgba(18, 12, 8, .5); border: 1px solid var(--vidrio-borde); border-radius: 14px; padding: 12px 14px; width: 100%; }
.hd-campo textarea { min-height: 96px; resize: vertical; }
.hd-campo input:focus, .hd-campo select:focus, .hd-campo textarea:focus { outline: none; border-color: var(--naranja-claro); box-shadow: 0 0 0 3px rgba(243,115,49,.25); }
.hd-formulario button.hd-boton { border: 0; }
.hd-datos-contacto { display: flex; flex-direction: column; gap: 14px; }
.hd-dato-c { border-radius: var(--radio-tarjeta); padding: 22px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.hd-dato-c small { font-size: 11.5px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--texto-medio); }
.hd-dato-c b { font-size: clamp(18px, 2vw, 22px); font-weight: 500; letter-spacing: -0.02em; user-select: all; overflow-wrap: anywhere; }
.hd-dato-c span { font-size: 14px; color: var(--texto-medio); }
.hd-dato-c.hd-fuerte { background: var(--naranja); box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255,255,255,.28); }
.hd-dato-c.hd-fuerte small { color: var(--blanco); }

@media (max-width: 900px) {
  .hd-grupo, .hd-dos, .hd-contacto { grid-template-columns: 1fr; }
  .hd-grupo-nombre { position: static; }
  .hd-grupo-nombre p { max-width: none; }
  .hd-saber { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .hd-servs, .hd-saber, .hd-formulario { grid-template-columns: 1fr; }
  .hd-tabla { min-width: 0; font-size: 13px; }
  .hd-tabla th, .hd-tabla td { padding: 13px 6px; }
  .hd-tabla th:first-child, .hd-tabla td:first-child { padding-left: 14px; width: 44%; }
  .hd-tabla thead th { font-size: 13px; }
}

/* =====================================================================
   Lo propio del tema (lo que la vista previa no tenía)
   ===================================================================== */
a { color: inherit; }
img { max-width: 100%; height: auto; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.screen-reader-text:focus { position: fixed; top: 12px; left: 12px; z-index: 100; width: auto; height: auto; clip-path: none; padding: 10px 16px; border-radius: 12px; background: var(--blanco); color: var(--tinta); font-weight: 600; }
#hd-contenido { display: flex; flex-direction: column; }
/* Por debajo de la barra del administrador de WordPress, cuando está. */
.admin-bar .hd-barra { top: calc(env(safe-area-inset-top, 0px) + 42px); }

/* ---------- Cabecera ---------- */
.hd-barra__marca { display: flex; flex: none; }
.hd-barra__marca img { height: 28px; width: auto; }
.hd-barra .hd-nav { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.hd-nav__enlaces { display: flex; gap: 2px; margin-inline: auto; font-size: 14px; }
.hd-nav__enlaces a { padding: 8px 14px; border-radius: var(--radio-pildora); color: var(--texto-medio); text-decoration: none; transition: color .2s, background .2s; }
.hd-nav__enlaces a:hover { color: var(--blanco); background: rgba(255,255,255,.08); }
.hd-nav__enlaces a[aria-current="page"] { color: var(--blanco); background: rgba(255,255,255,.12); }
.hd-sesion { font-size: 14px; color: var(--texto-medio); text-decoration: none; }
.hd-sesion:hover { color: var(--blanco); }
.hd-menu-boton { display: none; }
@media (max-width: 1000px) {
  .hd-barra { flex-wrap: wrap; border-radius: 28px; }
  .hd-menu-boton { display: flex; flex-direction: column; justify-content: center; gap: 4px; width: 42px; height: 42px; margin-left: auto; padding: 0 11px; border: 1px solid var(--vidrio-borde); border-radius: 50%; background: rgba(255,255,255,.08); cursor: pointer; }
  .hd-menu-boton span { display: block; height: 1.5px; border-radius: 2px; background: var(--blanco); transition: transform .3s var(--curva), opacity .2s; }
  .hd-abierta .hd-menu-boton span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
  .hd-abierta .hd-menu-boton span:nth-child(2) { opacity: 0; }
  .hd-abierta .hd-menu-boton span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
  .hd-barra .hd-nav { display: none; flex-basis: 100%; flex-direction: column; align-items: stretch; gap: 14px; padding: 10px 6px 8px; }
  .hd-abierta .hd-nav { display: flex; }
  .hd-nav__enlaces { flex-direction: column; margin: 0; font-size: 16px; }
  .hd-nav__enlaces a { padding: 12px 14px; }
  .hd-barra .hd-lado { flex-direction: column; align-items: stretch; gap: 10px; }
  .hd-barra .hd-lado .hd-boton { justify-content: center; }
  .hd-sesion { padding: 6px 14px; }
}

/* ---------- Tarjetas que son enlaces ---------- */
a.hd-pieza, a.hd-plan, a.hd-entrada { text-decoration: none; }
.hd-dato-c a { text-decoration: none; }
.hd-entrada > img, .hd-entrada__sin-imagen { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 16px; box-shadow: var(--sombra-flota); transition: transform .45s var(--curva); }
.hd-entrada__sin-imagen { display: block; background: radial-gradient(70% 80% at 80% 20%, var(--naranja), var(--naranja-profundo) 50%, var(--oscuro)); }
.hd-entrada:hover > img { transform: scale(1.04); }
.hd-entrada time { display: block; margin-bottom: 6px; }

/* ---------- Preguntas frecuentes (hd_preguntas_frecuentes) ---------- */
.hd-pregunta { background: linear-gradient(145deg, rgba(255,255,255,.16), rgba(255,255,255,.04) 45%, rgba(255,255,255,.07)); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--sombra-flota); }

/* ---------- Pie ---------- */
.hd-pie__redes { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; }
.hd-pie__redes a { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--vidrio-borde); color: var(--texto-medio); transition: color .2s, background .2s; }
.hd-pie__redes a:hover { color: var(--blanco); background: var(--naranja); border-color: transparent; }

/* ---------- Formulario de la llamada (ventana y Contacto) ---------- */
.hd-llamada { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--vidrio-borde); border-radius: 28px; color: var(--blanco); background: linear-gradient(160deg, #2C231D, var(--noche) 70%); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 40px 80px -30px rgba(0,0,0,.9); }
.hd-llamada::backdrop { background: rgba(18, 12, 8, .65); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.hd-llamada__form { position: relative; padding: 34px 30px 30px; }
.hd-llamada__form > div, .hd-llamada__campos { display: flex; flex-direction: column; }
.hd-llamada__form--pagina { padding: 0; }
/* El "Listo" queda oculto hasta enviar: el display de arriba le ganaba al atributo hidden. */
.hd-llamada__form > div[hidden] { display: none; }
/* En Contacto, el formulario ocupa toda la tarjeta (la grilla de dos columnas era de la vista previa). */
.hd-formulario { display: block; }
.hd-llamada__form--pagina h2 { font-size: 24px; font-weight: 600; letter-spacing: -0.025em; }
.hd-llamada__logo { height: 30px; width: auto; align-self: flex-start; margin-bottom: 22px; }
.hd-llamada h3 { font-size: 26px; font-weight: 600; letter-spacing: -0.03em; }
.hd-llamada__sub { margin-top: 8px; font-size: 15px; line-height: 1.55; color: var(--texto-medio); }
.hd-llamada__campos label, .hd-llamada__opciones legend { margin: 16px 0 7px; font-size: 13px; color: var(--texto-medio); }
.hd-llamada__campos input, .hd-llamada__campos select, .hd-llamada__campos textarea { width: 100%; min-width: 0; font: 400 15px/1.4 var(--font-sans); color: var(--blanco); background: rgba(18, 12, 8, .5); border: 1px solid var(--vidrio-borde); border-radius: 14px; padding: 12px 14px; }
.hd-llamada__campos select option { color: var(--tinta); }
.hd-llamada__campos textarea { min-height: 110px; resize: vertical; }
.hd-llamada__campos ::placeholder { color: var(--texto-tenue); }
.hd-llamada__campos input:focus, .hd-llamada__campos select:focus, .hd-llamada__campos textarea:focus { outline: none; border-color: var(--naranja-claro); box-shadow: 0 0 0 3px rgba(243,115,49,.25); }
.hd-llamada__tel { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px; }
.hd-llamada__opciones { min-width: 0; margin: 0; padding: 0; border: 0; }
.hd-llamada__opciones legend { padding: 0; }
.hd-opciones { display: flex; flex-wrap: wrap; gap: 8px; }
.hd-llamada__campos .hd-opcion { position: relative; margin: 0; font-size: 14px; font-weight: 500; color: var(--blanco); cursor: pointer; }
.hd-opcion input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; cursor: pointer; }
.hd-opcion span { display: inline-flex; padding: 10px 16px; border-radius: 999px; background: rgba(255,255,255,.06); border: 1px solid var(--vidrio-borde); transition: background .2s, border-color .2s; }
.hd-opcion input:checked + span { background: var(--naranja); border-color: var(--naranja); }
.hd-opcion input:focus-visible + span { outline: 2px solid var(--ambar); outline-offset: 2px; }
.hd-llamada__enviar { align-self: flex-start; margin-top: 22px; padding: 14px 26px; border: 0; border-radius: var(--radio-pildora); cursor: pointer; font: 600 15px/1.3 var(--font-sans); color: var(--blanco); background: var(--naranja); box-shadow: var(--sombra-flota-naranja), inset 0 1px 0 rgba(255,255,255,.28); transition: background .25s; }
.hd-llamada__enviar:hover { background: var(--naranja-claro); }
.hd-llamada__enviar:disabled { opacity: .6; cursor: wait; }
.hd-llamada__cerrar { position: absolute; top: 16px; right: 16px; width: 34px; height: 34px; border: 0; border-radius: 50%; cursor: pointer; font-size: 20px; line-height: 1; color: var(--blanco); background: rgba(255,255,255,.1); }
.hd-llamada__error { margin-top: 14px; font-size: 13.5px; color: #F2603F; }
.hd-llamada__legal { margin-top: 12px; font-size: 12.5px; line-height: 1.5; color: var(--texto-tenue); }
.hd-llamada__legal a { color: var(--naranja-claro); font-weight: 600; }

/* ---------- Chat de Thera ---------- */
.hd-tw { position: fixed; right: calc(env(safe-area-inset-right, 0px) + 20px); bottom: calc(env(safe-area-inset-bottom, 0px) + 20px); z-index: 50; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; }
.hd-tw__boton { display: flex; align-items: center; gap: 10px; padding: 8px 22px 8px 10px; border-radius: var(--radio-pildora); cursor: pointer; font: 600 15px/1.2 var(--font-sans); color: var(--blanco); background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.06) 50%, rgba(255,255,255,.1)); -webkit-backdrop-filter: var(--desenfoque); backdrop-filter: var(--desenfoque); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.28), var(--sombra-flota); transition: translate .4s var(--curva); }
.hd-tw__boton:hover { translate: 0 -2px; }
.hd-tw__boton .hd-punto { font-size: 1.5em; line-height: 0; font-weight: 800; color: var(--naranja-claro); }
.hd-tw__avatar { width: 42px; height: auto; flex: none; filter: drop-shadow(0 4px 6px rgba(0,0,0,.4)); }
.hd-tw__panel { width: min(380px, calc(100vw - 32px)); height: min(560px, calc(100dvh - 120px)); display: flex; flex-direction: column; overflow: hidden; border-radius: 26px; background: linear-gradient(160deg, #2C231D, var(--noche) 70%); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 40px 80px -30px rgba(0,0,0,.9); }
.hd-tw__panel[hidden] { display: none; }
.hd-tw__barra { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid var(--borde); }
.hd-chat-id { display: flex; align-items: center; gap: 10px; }
.hd-chat-id img { width: 38px; height: 38px; border-radius: 50%; }
.hd-chat-id b { display: block; font-weight: 600; }
.hd-chat-id small { font-size: 12px; color: var(--naranja-claro); }
.hd-tw__cerrar { width: 32px; height: 32px; border: 0; border-radius: 50%; cursor: pointer; font-size: 20px; color: var(--blanco); background: rgba(255,255,255,.1); }
.hd-tw__msgs { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.hd-tw__msg { max-width: 85%; padding: 11px 14px; border-radius: 18px; font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-line; }
.hd-tw__msg--bot { align-self: flex-start; background: rgba(255,255,255,.1); border-bottom-left-radius: 6px; }
.hd-tw__msg--user { align-self: flex-end; background: var(--naranja); border-bottom-right-radius: 6px; }
.hd-tw__msg--esperando { color: var(--texto-medio); font-style: italic; }
.hd-tw__form { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--borde); }
.hd-tw__input { flex: 1; min-width: 0; font: 400 14.5px/1.4 var(--font-sans); padding: 11px 16px; border-radius: 999px; border: 1px solid var(--vidrio-borde); color: var(--blanco); background: rgba(18,12,8,.5); }
.hd-tw__input:focus { outline: none; border-color: var(--naranja-claro); }
.hd-tw__enviar { width: 42px; height: 42px; flex: none; border: 0; border-radius: 50%; cursor: pointer; display: grid; place-items: center; color: var(--blanco); background: var(--naranja); }
.hd-tw__aviso { padding: 0 14px 12px; font-size: 11.5px; color: var(--texto-tenue); }
.hd-tw__oculto { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media (max-width: 560px) {
  .hd-tw { right: calc(env(safe-area-inset-right, 0px) + 14px); bottom: calc(env(safe-area-inset-bottom, 0px) + 14px); }
  .hd-tw__boton { font-size: 13.5px; padding: 6px 16px 6px 8px; }
  .hd-tw__avatar { width: 34px; }
}

/* ---------- Blog, artículo y páginas de texto ---------- */
.hd-notas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.hd-nota { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--radio-tarjeta); text-decoration: none; background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.03) 45%, rgba(255,255,255,.05)); border: 1px solid var(--vidrio-borde); box-shadow: inset 0 1px 0 rgba(255,255,255,.2), var(--sombra-flota); transition: transform .45s var(--curva); }
.hd-nota:hover { transform: translateY(-6px); }
.hd-nota__portada img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.hd-nota__texto { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 10px; }
.hd-nota__cat { align-self: flex-start; font-size: 11px; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--naranja-claro); }
.hd-nota h3 { font-size: 19px; line-height: 1.3; font-weight: 600; letter-spacing: -0.02em; }
.hd-nota p { font-size: 14.5px; line-height: 1.55; color: var(--texto-medio); }
.hd-nota__meta { font-size: 12.5px; color: var(--texto-tenue); }
.hd-notas__vacio { border-radius: var(--radio-tarjeta); padding: 24px; border: 1px dashed var(--vidrio-borde); display: flex; flex-direction: column; justify-content: center; gap: 8px; color: var(--texto-medio); }
.hd-notas__vacio h3 { color: var(--blanco); font-weight: 600; }
.hd-paginas { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.hd-paginas .page-numbers { padding: 10px 16px; border-radius: 999px; border: 1px solid var(--vidrio-borde); text-decoration: none; font-size: 14px; }
.hd-paginas .current { background: var(--naranja); border-color: transparent; }
.hd-articulo, .hd-texto { width: 100%; max-width: 760px; margin: 0 auto; padding-block: clamp(40px, 6vw, 88px) 40px; display: flex; flex-direction: column; gap: 22px; }
.hd-migas { display: flex; gap: 8px; font-size: 13.5px; color: var(--texto-tenue); }
.hd-migas a { color: var(--naranja-claro); text-decoration: none; }
.hd-articulo__cabeza { display: flex; flex-direction: column; gap: 14px; }
.hd-articulo h1, .hd-texto__titulo { font-size: clamp(32px, 4.6vw, 54px); line-height: 1.08; font-weight: 600; letter-spacing: -0.04em; }
.hd-articulo__bajada { font-size: 19px; line-height: 1.55; font-weight: 300; color: var(--durazno); }
.hd-articulo__meta, .hd-texto__fecha { font-size: 13.5px; color: var(--texto-tenue); }
.hd-articulo__portada img { width: 100%; border-radius: var(--radio-tarjeta); box-shadow: var(--sombra-flota); display: block; }
.hd-articulo__cuerpo, .hd-texto__cuerpo, .hd-texto__contenido { font-size: 17.5px; line-height: 1.8; color: #E6DFD9; }
.hd-articulo__cuerpo > * + *, .hd-texto__cuerpo > * + *, .hd-texto__contenido > * + * { margin-top: 1.1em; }
.hd-articulo__cuerpo h2, .hd-texto__cuerpo h2, .hd-texto__contenido h2 { margin-top: 1.8em; font-size: 28px; line-height: 1.2; font-weight: 600; letter-spacing: -0.03em; color: var(--blanco); }
.hd-articulo__cuerpo h3, .hd-texto__cuerpo h3, .hd-texto__contenido h3 { margin-top: 1.5em; font-size: 21px; font-weight: 600; color: var(--blanco); }
.hd-articulo__cuerpo a, .hd-texto__cuerpo a, .hd-texto__contenido a { color: var(--naranja-claro); }
.hd-articulo__cuerpo ul, .hd-articulo__cuerpo ol, .hd-texto__cuerpo ul, .hd-texto__contenido ul { padding-left: 1.3em; }
.hd-articulo__cuerpo li + li { margin-top: .4em; }
.hd-articulo__cuerpo img { border-radius: 18px; }
.hd-articulo__cuerpo blockquote { margin-inline: 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--naranja); font-size: 20px; font-weight: 300; color: var(--blanco); }
.hd-articulo__llamada { margin-top: 20px; border-radius: var(--radio-tarjeta); padding: 26px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; background: var(--naranja); box-shadow: var(--sombra-flota-naranja); }
.hd-articulo__llamada h2 { font-size: 22px; font-weight: 600; letter-spacing: -0.02em; }
.hd-articulo__llamada p { color: var(--noche); font-weight: 500; }
.hd-articulo__autor { display: flex; align-items: center; gap: 14px; padding-top: 22px; border-top: 1px solid var(--borde); }
.hd-articulo__autor img { width: 44px; height: auto; }
.hd-articulo__autor b, .hd-articulo__autor span { display: block; }
.hd-articulo__autor span { font-size: 14px; color: var(--texto-medio); }
.hd-sigue h2 { font-size: clamp(24px, 3vw, 32px); font-weight: 600; letter-spacing: -0.03em; margin-bottom: 22px; }
@media (max-width: 900px) { .hd-notas { grid-template-columns: 1fr; } }


/* Cierre más compacto (David, 2026-11-13: quedaba demasiado grande). */
#hd-cierre { padding: clamp(24px, 3.4vw, 44px); gap: clamp(18px, 2.4vw, 28px); }
#hd-cierre .hd-final { gap: 14px; }
#hd-cierre .hd-titular { font-size: clamp(28px, 3.4vw, 44px); }
#hd-cierre .hd-lema { font-size: clamp(24px, 3.2vw, 44px); padding-top: clamp(16px, 2vw, 24px); }
#hd-cierre .hd-isotipo { width: 150px; right: -24px; top: -30px; }