/* ═══════════════════════════════════════════════════════════════════════════
   CRISTINA BEAUTY DESIGNER · AWARD POLISH LAYER (v110)
   ─────────────────────────────────────────────────────────────────────────────
   Capa ADITIVA de dirección de arte. Se carga AL FINAL en las 19 páginas.
   No reescribe el sistema existente: lo eleva.

   Principios (investigación luxury/award 2026):
   · El lujo digital es ritmo: aire generoso, tipografía disciplinada,
     motion lento "cortina de terciopelo", y fluidez absoluta en mobile.
   · En mobile, performance = percepción de lujo (scroll sedoso > efectos).
   · Targets táctiles ≥ 44–48px. Titulares con impacto aún en 360px.

   Índice:
   01 · Primitivas luxury globales (selección, foco, tap, scroll)
   02 · CTA sheen unificado (el barrido de luz de hyb-btn, ahora en todo el sitio)
   03 · Sistema tipográfico MOBILE de las 16 secundarias (la brecha real)
   04 · Ritmo, cards y touch en secundarias (FAQ, reserve, dock, sdlx)
   05 · Mobile index: ritmo y detalles
   06 · Performance-luxury en táctil (blurs y capas pesadas, scroll sedoso)
   07 · Accesibilidad de movimiento (reduced motion, completitud)
   ═══════════════════════════════════════════════════════════════════════════ */


/* ── 01 · PRIMITIVAS LUXURY GLOBALES ──────────────────────────────────────── */

/* Selección de texto en clave de marca: vino profundo + champagne. Un detalle
   que casi nadie diseña y que se siente inmediatamente "cuidado". */
::selection{ background:#4E0610; color:#ECD7A4; }
::-moz-selection{ background:#4E0610; color:#ECD7A4; }

/* Foco visible elegante (teclado): anillo dorado fino, nunca el azul por defecto. */
:focus-visible{
  outline:2px solid rgba(201,162,78,.85);
  outline-offset:3px;
  border-radius:4px;
}

/* El highlight gris de tap en Android/iOS rompe la ilusión premium. */
html{ -webkit-tap-highlight-color:transparent; }

/* Scroll suave solo para quien no pidió movimiento reducido. */
@media (prefers-reduced-motion:no-preference){
  html{ scroll-behavior:smooth; }
}

/* Tipografía: rendering óptimo de las serifas display. */
body{ -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }


/* ── 02 · CTA SHEEN UNIFICADO ─────────────────────────────────────────────── */
/* El barrido de luz que ya tiene .hyb-btn--gold (las secundarias) se extiende
   a los botones gold de la landing principal. Mismo lenguaje en todo el sitio:
   lento, sedoso, con intención. Solo en dispositivos con hover real. */

.qs-cta--gold, .lux-next-btn--gold, .lashrail-btn--gold{
  position:relative; overflow:hidden; isolation:isolate;
}
@media (hover:hover) and (pointer:fine){
  .qs-cta--gold::after, .lux-next-btn--gold::after, .lashrail-btn--gold::after{
    content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
    background:linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
    transform:skewX(-18deg); transition:left .9s cubic-bezier(.16,1,.3,1);
    pointer-events:none; z-index:1;
  }
  .qs-cta--gold:hover::after, .lux-next-btn--gold:hover::after, .lashrail-btn--gold:hover::after{
    left:170%;
  }
}


/* ── 03 · SISTEMA TIPOGRÁFICO MOBILE · 16 SECUNDARIAS ─────────────────────── */
/* sd-hierarchy.css define la jerarquía editorial pero sin media queries: en
   pantallas pequeñas los clamps caen a su piso sin ritmo entre sí. Aquí se
   diseña la escala mobile como sistema: titular protagonista, subtítulo con
   medida de lectura, eyebrows finos, cuerpo cómodo. */

@media (max-width:760px){

  /* Hero: el titular conserva drama (piso más alto), la promesa respira. */
  body.sd-body .hyb-hero-title{ font-size:clamp(2.6rem,12vw,3.6rem); line-height:.96; }
  body.sd-body .hyb-hero-kicker{ font-size:1.05rem; }
  body.sd-body .hyb-hero-promise{ font-size:clamp(1.22rem,5.4vw,1.5rem); line-height:1.45; max-width:30ch; }
  body.sd-body .hyb-hero-sub{ font-size:.95rem; line-height:1.75; max-width:44ch; margin-bottom:1.8rem; }

  /* Títulos de sección: presencia editorial constante en pantalla pequeña. */
  body.sd-body .sdlx-h{ font-size:clamp(1.9rem,8.4vw,2.35rem); line-height:1.06; }
  body.sd-body .sdlx-eyebrow{ font-size:.62rem; letter-spacing:.3em; }
  body.sd-body .sdlx-sub{ font-size:1.06rem; line-height:1.62; }

  /* Cierre (hyb-final): piso digno, sin desbordar. */
  body.sd-body .hyb-final-title{ font-size:clamp(2.2rem,10.5vw,3rem); }

  /* Prosa de FAQ: medida e interlineado de lectura larga. */
  body.sd-body .hyb-q-a p{ font-size:1.06rem; line-height:1.66; }
}

/* Ajuste fino 414–430 (iPhone Plus/Pro Max): un punto más de aire. */
@media (max-width:430px){
  body.sd-body .hyb-hero-grid{ gap:2.4rem; padding-block:2.4rem 3.2rem; }
  body.sd-body .hyb-hero-cta{ gap:.7rem; }
}

/* Ajuste fino 375–390 (iPhone estándar): chips/price del hero a escala. */
@media (max-width:390px){
  body.sd-body .hyb-hero-price b{ font-size:1.45rem; }
  body.sd-body .hyb-hero-price{ right:0; }
  body.sd-body .hyb-hero-chip{ transform:scale(.92); transform-origin:top right; }
}

/* Piso 360 (Android compacto): nada se toca entre sí, todo respira. */
@media (max-width:360px){
  body.sd-body .hyb-hero-title{ font-size:2.35rem; }
  body.sd-body .hyb-btn{ padding:.95rem 1.45rem; font-size:.72rem; }
}


/* ── 04 · RITMO, CARDS Y TOUCH · SECUNDARIAS ──────────────────────────────── */

/* FIX funcional: el acordeón limita la respuesta abierta a 340px; la nueva
   pregunta de ubicación (y otras largas) quedaría cortada en mobile. */
.hyb-q[open] .hyb-q-a{ max-height:640px; }

/* FAQ como experiencia táctil: target ≥48px, aire de lectura, '+' centrado. */
@media (max-width:760px){
  body.sd-body .hyb-q summary{
    min-height:48px; padding:1.15rem .25rem; gap:.9rem;
    font-size:1.02rem; line-height:1.35;
  }
  body.sd-body .hyb-q summary::after{ width:30px; height:30px; }

  /* Cards sdlx (experiencia/garantía): padding que deja respirar al texto. */
  body.sd-body .sdlx-exp-card{ padding:1.6rem 1.35rem; border-radius:18px; }
  body.sd-body .sdlx-trust-card{ padding:1.5rem 1.1rem; }

  /* Secciones sdlx: un punto más de aire vertical = percepción boutique. */
  body.sd-body .sdlx-sec{ padding:clamp(4rem,12vw,5rem) 0; }
}

/* Reserva en 4 pasos: bajo 520px una sola columna se lee como ritual,
   no como tabla apretada. El número 44px se mantiene como ancla visual. */
@media (max-width:520px){
  body.sd-body .hyb-reserve-steps{ grid-template-columns:1fr; }
  body.sd-body .hyb-step{ grid-template-columns:44px 1fr; gap:1.1rem; padding:1.05rem 0; }
  body.sd-body .hyb-step-n{ width:44px; height:44px; }
}

/* Dock inferior: en mobile es EL CTA. Targets cómodos, jerarquía clara. */
@media (max-width:760px){
  body.sd-body .hyb-dock{ padding:.7rem .8rem; gap:.7rem; border-radius:20px; }
  body.sd-body .hyb-dock .hyb-btn{ min-height:46px; padding:.7rem 1.15rem; font-size:.7rem; }
  body.sd-body .hyb-dock-info b{ font-size:.95rem; }
}
@media (max-width:420px){
  /* En pantallas estrechas el subtítulo del dock cede el espacio al botón. */
  body.sd-body .hyb-dock-info span{ display:none; }
  body.sd-body .hyb-dock .hyb-btn{ padding:.7rem 1rem; }
}

/* Targets táctiles globales en secundarias (coarse pointer = dedo). */
@media (pointer:coarse){
  body.sd-body .hyb-btn{ min-height:48px; }
}


/* ── 05 · MOBILE INDEX · RITMO Y DETALLES ─────────────────────────────────── */

@media (max-width:768px){
  /* CTAs principales de index con target táctil pleno. */
  .qs-cta, .lux-next-btn, .lashrail-btn{ min-height:48px; }

  /* Footer: enlaces con aire de tap (sin rediseñar el footer). */
  .cbd-footer-link{ padding-block:.3rem; display:inline-block; }
}


/* ── 06 · PERFORMANCE-LUXURY EN TÁCTIL ────────────────────────────────────── */
/* "Si la web no es fluida, la magia visual no vale nada." En táctil, los
   blurs gigantes y el grano animado cuestan GPU y producen micro-jank en el
   scroll. Se atenúan (no se eliminan): el lujo es la fluidez. */

@media (hover:none) and (pointer:coarse){
  /* Auroras del hero hyb: mismo glow, la mitad de costo de render. */
  body.sd-body .hyb-hero-aurora span{ filter:blur(44px); opacity:.85; }

  /* Glassmorphism: blur más contenido = scroll más sedoso en gama media. */
  .lashrail-card{ backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
}


/* ── 07 · MOVIMIENTO ACCESIBLE · COMPLETITUD ──────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  .qs-cta--gold::after, .lux-next-btn--gold::after, .lashrail-btn--gold::after{
    display:none;
  }
  html{ scroll-behavior:auto; }
}


/* ═══════════════════════════════════════════════════════════════════════════
   SEGUNDA PASADA (v111) · Auditoría sección-por-sección desde código
   Hallazgos con valores reales; cada regla corrige una debilidad concreta.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── INDEX · Testimonios (marquee) ───────────────────────────────────────────
   Debilidad: .testimonial-card tenía width:360px FIJO → en viewports de
   360–390px la tarjeta igualaba o excedía la pantalla (borde a borde, sin
   aire = sensación barata). Ahora respira dentro del viewport. */
@media (max-width:768px){
  .testimonial-card{ width:clamp(272px, 80vw, 330px); padding:1.6rem 1.4rem; }
  .testimonial-mini{ font-size:.92rem; }
}

/* ── SECUNDARIAS · Garantía (sdlx-trust) ─────────────────────────────────────
   Debilidad: la grid quedaba en 2 columnas hasta 0px → cards de ~150px con
   títulos partidos en 3 líneas. Bajo 480px, una columna serena: cada
   compromiso de la marca se lee como una afirmación, no como un mosaico. */
@media (max-width:480px){
  body.sd-body .sdlx-trust-grid{ grid-template-columns:1fr; gap:.8rem; }
  body.sd-body .sdlx-trust-card{ padding:1.35rem 1.4rem; }
}

/* ── SECUNDARIAS · Comparador "Mapa de las técnicas" ─────────────────────────
   Debilidad: nombres de técnica a .58rem en mobile (ilegible en la sección
   más diferenciadora del sitio) y nodos de 15px sin área táctil real. */
@media (max-width:760px){
  body.sd-body .hyb-node .nm{ font-size:.62rem; letter-spacing:.05em; }
  body.sd-body .hyb-axis-labels{ font-size:.54rem; }
}
@media (pointer:coarse){
  /* Padding simétrico: el translate(-50%,-50%) re-centra la caja, así que el
     punto visual no se mueve y el área de tap sube a ≥44px. */
  body.sd-body .hyb-node{ padding:.8rem .55rem; }
}

/* ── SECUNDARIAS · Pricing card (extensiones) ────────────────────────────────
   En 360–520px el padding mínimo de 2rem comía ancho útil del contenido. */
@media (max-width:520px){
  body.sd-body .hyb-pricing-grid{ padding:1.6rem 1.3rem; }
}

/* ── SECUNDARIAS · Medida editorial de lectura (FAQ) ─────────────────────────
   Las respuestas largas en desktop corrían a todo el ancho de la lista;
   una medida de 62ch es el estándar editorial de lectura cómoda. */
body.sd-body .hyb-q-a p{ max-width:62ch; }


/* ═══════════════════════════════════════════════════════════════════════════
   CIRUGÍA POR SECCIONES (v112) · Cada bloque = una sección leída por completo
   y elevada con un movimiento de diseño concreto.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── HERO PRINCIPAL · Firma editorial de cierre ──────────────────────────────
   El hero (7 capas cinematográficas, fondo blanco perlado) termina contra el
   ticker vino con un corte seco. Una hairline dorada centrada —el mismo gesto
   del divider del manifiesto final— firma el hero y anuncia el cambio de acto.
   En táctil, el shader mesh baja levemente su opacidad: misma atmósfera,
   menos costo de GPU en el scroll inicial (la primera impresión debe ser
   sedosa antes que densa). */
.hero-v3::after{
  content:""; position:absolute; left:50%; bottom:1.1rem; transform:translateX(-50%);
  width:min(240px,38%); height:1px; z-index:7; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(201,162,78,.55), transparent);
}
@media (hover:none) and (pointer:coarse){
  #hero-mesh-canvas{ opacity:.2; }
}

/* ── FOOTER · El cierre comercial deja de ser un link plano ──────────────────
   "Reservar beauty session" era texto con flecha: el último CTA de la página
   sin presencia. Ahora es una pill champagne que se enciende en oro al hover
   — el mismo lenguaje de los CTAs principales, cerrando el círculo. */
.cbd-footer-link-cta{
  display:inline-flex; align-items:center; gap:.45rem;
  margin-top:.9rem; padding:.75rem 1.15rem;
  border:1px solid rgba(201,169,97,.55); border-radius:999px;
  color:var(--gold-light, #ECD7A4) !important;
  font-weight:600; letter-spacing:.05em; text-transform:uppercase; font-size:.62rem;
  transition:background .45s cubic-bezier(.16,1,.3,1), color .45s, border-color .45s, transform .45s;
  width:auto; max-width:100%; white-space:nowrap; box-sizing:border-box; line-height:1;
  justify-content:center; text-align:center;
}
@media (hover:hover) and (pointer:fine){
  .cbd-footer-link-cta:hover{
    background:linear-gradient(120deg, #ECD7A4, #C9A24E 60%, #9A7B36);
    color:#3A040C !important; border-color:transparent; transform:translateY(-2px);
  }
}

/* Botones sociales: presencia y target táctil (eran 40px, justo bajo el
   mínimo). En hover, anillo dorado y elevación de terciopelo. */
.cbd-footer-social-btn{ width:44px; height:44px; }
@media (hover:hover) and (pointer:fine){
  .cbd-footer-social-btn:hover{
    border-color:rgba(236,215,164,.85); color:#ECD7A4;
    background:rgba(201,162,78,.1); transform:translateY(-2px);
  }
}

/* Títulos de columna: la hairline corta bajo el título estructura el footer
   en mobile (donde las columnas se apilan y pierden arquitectura). */
.cbd-footer-col-title{ position:relative; padding-bottom:.55rem; }
.cbd-footer-col-title::after{
  content:""; position:absolute; left:0; bottom:0; width:26px; height:1px;
  background:linear-gradient(90deg, rgba(201,169,97,.7), transparent);
}

/* ── HEROES SECUNDARIOS · Ergonomía de pulgar en pantallas estrechas ─────────
   Bajo 430px, los dos CTAs del hero se apilan a ancho completo: un solo
   gesto seguro por fila. El botón dorado se vuelve imposible de fallar:
   conversión y lujo en el mismo movimiento. */
@media (max-width:430px){
  body.sd-body .hyb-hero-cta{ flex-direction:column; align-items:stretch; }
  body.sd-body .hyb-hero-cta .hyb-btn{ width:100%; justify-content:center; }
}

/* ── FAQ SECUNDARIAS · Estado abierto con luz propia ─────────────────────────
   La pregunta abierta recibe un lavado champagne que nace arriba y se
   desvanece: el ojo sabe dónde está leyendo sin necesidad de bordes duros. */
body.sd-body .hyb-q{ transition:background .5s cubic-bezier(.16,1,.3,1); }
body.sd-body .hyb-q[open]{
  background:linear-gradient(180deg, rgba(201,162,78,.08), rgba(201,162,78,.02) 60%, transparent);
}

/* ── DOCK MOBILE · Materialidad de vidrio fino ───────────────────────────────
   El dock es el CTA flotante permanente: gana un filo de luz superior y
   saturación de fondo —se siente vidrio de joyería, no plástico oscuro. */
body.sd-body .hyb-dock{
  -webkit-backdrop-filter:blur(16px) saturate(1.35);
  backdrop-filter:blur(16px) saturate(1.35);
  box-shadow:0 24px 60px -24px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.09);
}

/* ── TESTIMONIOS · Comilla editorial ─────────────────────────────────────────
   Una comilla Cormorant gigante y tenue en la esquina de cada tarjeta:
   el gesto clásico del editorial de moda. No compite con el texto
   (esquina superior derecha, opacidad de marca de agua). */
.testimonial-card{ position:relative; }
.testimonial-card::before{
  content:"\201D"; position:absolute; top:.2rem; right:1.1rem;
  font-family:'Cormorant Garamond', serif; font-size:4.2rem; line-height:1;
  color:#ECD7A4; opacity:.22; pointer-events:none;
}


/* ═══════════════════════════════════════════════════════════════════════════
   CORRECCIONES ESTRUCTURALES (v113) · Errores reportados con capturas
   Acompañan a los cambios de markup (lockup de marca, iconos SVG) y al fix
   fixed→sticky del nav en service-detail.css.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── CAPTURA 1a · Marca en la barra (16 secundarias) ─────────────────────────
   Lockup idéntico a la identidad de index: CRISTINA en Italiana cereza con
   tracking .16em; "Beauty Designer" en Manrope oro, versalitas finas. */
/* [v114] Lockup HORIZONTAL elegido por la clienta (captura 1):
   CRISTINA | BEAUTY DESIGNER — con barrita dorada, en desktop y mobile. */
.sd-logo{ display:inline-flex; flex-direction:row; align-items:center;
  gap:.8rem; line-height:1; }
.sd-logo .sd-logo-name{
  font-family:'Italiana',serif; font-size:clamp(1.05rem,3.4vw,1.3rem);
  letter-spacing:.16em; color:var(--cherry, #7A0712);
}
.sd-logo .sd-logo-div{
  width:1px; height:16px; background:var(--gold, #C9A24E); opacity:.7;
}
.sd-logo .sd-logo-sub{
  font-family:'Manrope',sans-serif; font-size:.58rem; font-weight:600;
  text-transform:uppercase; letter-spacing:.3em; color:var(--gold-dark, #9A7B36);
  white-space:nowrap;
}
@media (max-width:760px){
  .sd-logo{ gap:.55rem; }
  .sd-logo .sd-logo-name{ font-size:.98rem; letter-spacing:.14em; }
  .sd-logo .sd-logo-div{ height:12px; }
  .sd-logo .sd-logo-sub{ font-size:.46rem; letter-spacing:.2em; }
}
@media (max-width:380px){
  .sd-logo .sd-logo-name{ font-size:.9rem; }
  .sd-logo .sd-logo-sub{ font-size:.42rem; letter-spacing:.15em; }
}

/* ── CAPTURA 1b · Botón de la barra: una línea, nunca quebrado ──────────────
   (Recomendación aplicada: línea única compacta. La variante apilada
   "Reservar / Beauty Session" queda lista por si la prefieres.) */
.sd-nav-cta{ white-space:nowrap; }
@media (max-width:760px){
  .sd-nav{ padding:.7rem 1.1rem; }
  .sd-nav-cta{ font-size:.58rem; letter-spacing:.1em; padding:.62rem .95rem; }
}
@media (max-width:360px){
  .sd-nav-cta{ font-size:.54rem; padding:.58rem .8rem; }
}

/* ── CAPTURA 1c · Hero secundarias: respiración y jerarquía en mobile ───────
   Con el nav ya en sticky (no tapa nada), el hero gana aire arriba, ritmo
   entre marca→título→promesa→CTAs, y la imagen baja con espacio prudente. */
@media (max-width:760px){
  body.sd-body .hyb-hero-grid{ padding-block:2.6rem 4rem; gap:3.4rem; }
  body.sd-body .sd-back{ margin-bottom:2rem !important; opacity:.85; }
  body.sd-body .hyb-hero-kicker{ margin-bottom:.7rem; }
}

/* ── CAPTURA 2 · FAQ con sangría real ────────────────────────────────────────
   La lista colgaba directa de la sección, sin contenedor lateral: tocaba los
   bordes. Medida editorial centrada en todos los tamaños. */
body.sd-body .hyb-faq-list{
  width:min(860px, calc(100% - 2.6rem));
  margin-inline:auto;
}
body.sd-body .sdlx-faq-sec .sdlx-head{ padding-inline:1.4rem; }
@media (max-width:760px){
  body.sd-body .hyb-q summary{ padding-inline:.35rem; }
  body.sd-body .hyb-q-a p{ padding-inline:.35rem; }
}

/* ── CAPTURA 3 · Sección de cierre: de genérica a pieza de marca ─────────────
   Chips: los emojis (color de sistema, rompen el lujo) ya son iconos SVG de
   trazo fino en oro sobre medallón champagne. Botones: jerarquía real —
   el dorado manda, los secundarios hablan vino. */
.trust-mini{
  background:linear-gradient(180deg, #FFFEFB, #FBF6ED);
  border:1px solid rgba(201,162,78,.32); border-radius:18px;
  padding:1.35rem 1.1rem 1.25rem; text-align:center;
  box-shadow:0 18px 38px -28px rgba(78,6,16,.28);
}
.trust-mini-ic{
  width:42px; height:42px; margin:0 auto .65rem; display:grid; place-items:center;
  border-radius:50%; color:var(--cherry, #7A0712);
  border:1px solid rgba(201,162,78,.5);
  background:linear-gradient(135deg, rgba(236,215,164,.35), rgba(201,162,78,.08));
}
.trust-mini-ic svg{ width:21px; height:21px; }

.sd-cta-row--triple{ display:flex; flex-wrap:wrap; justify-content:center;
  gap:.8rem; max-width:520px; margin-inline:auto; }
.sd-cta-row--triple .sd-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:50px; padding:.85rem 1.5rem; border-radius:999px;
  font-family:'Manrope',sans-serif; font-weight:600; font-size:.74rem;
  letter-spacing:.09em; text-transform:uppercase; text-decoration:none;
  transition:transform .45s cubic-bezier(.16,1,.3,1), box-shadow .45s,
             background .45s, border-color .45s, color .45s;
}
.sd-cta-row--triple .sd-btn-gold{
  color:#3A040C;
  background:linear-gradient(120deg, #ECD7A4, #C9A24E 55%, #9A7B36);
  border:0; box-shadow:0 18px 42px -16px rgba(201,162,78,.65);
}
.sd-cta-row--triple .sd-btn-ghost{
  color:var(--cherry, #7A0712); background:transparent;
  border:1px solid rgba(122,7,18,.34);
}
@media (hover:hover) and (pointer:fine){
  .sd-cta-row--triple .sd-btn-gold:hover{ transform:translateY(-3px);
    box-shadow:0 24px 52px -16px rgba(201,162,78,.8); }
  .sd-cta-row--triple .sd-btn-ghost:hover{ border-color:var(--cherry, #7A0712);
    background:rgba(122,7,18,.05); transform:translateY(-2px); }
}
@media (max-width:560px){
  /* En mobile: columna a ancho completo y el DORADO arriba (jerarquía). */
  .sd-cta-row--triple{ flex-direction:column; align-items:stretch; }
  .sd-cta-row--triple .sd-btn{ width:100%; }
  .sd-cta-row--triple .sd-btn-gold{ order:-1; }
}

/* ── LANDING PRINCIPAL · CTAs del hero apilados en pantallas estrechas ──────
   Misma ergonomía de pulgar que en las secundarias: un gesto por fila. */
@media (max-width:430px){
  .hero-v3-ctas{ display:flex; flex-direction:column; align-items:stretch; gap:.8rem; }
  .hero-v3-ctas > *{ width:100%; justify-content:center; }
}


/* ── v114 · DOCK: el fondo violeta-oscuro pasa al vino del botón de Aura ────
   (captura 3 de la clienta: mismo lenguaje cromático que "Pregúntale a Aura") */
body.sd-body .hyb-dock{
  background:var(--grad-wine, linear-gradient(135deg,#8E0A14,#861F18 55%,#4E0610));
  border-color:rgba(232,212,162,.38);
}


/* ═══ v115 · COPY MOBILE (doble versión) ═══════════════════════════════════
   Desktop intacto: su texto original queda tal cual (clase cbd-dcopy añadida,
   sin reglas que lo alteren fuera de este bloque). La variante editorial
   mobile (cbd-mcopy) solo existe bajo 767px. */
.cbd-mcopy{ display:none !important; }
@media (max-width:767px){
  .cbd-mcopy{ display:block !important; }
  .cbd-dcopy{ display:none !important; }
}


/* ── v116 · Footer: fila legal discreta ── */
.cbd-footer-legal{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center;
  gap:.4rem .8rem; padding:1.2rem 1rem .2rem; }
.cbd-footer-legal a{ font-family:'Manrope',sans-serif; font-size:.66rem; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(236,215,164,.65); text-decoration:none; transition:color .4s; }
.cbd-footer-legal a:hover{ color:#ECD7A4; }
.cbd-footer-legal span{ color:rgba(236,215,164,.3); }


/* ── v119 · Garantía: todo CTA del sitio en mayúsculas ── */
.qs-cta, .lux-next-btn, .lashrail-btn, .sd-nav-cta, .hyb-btn, .sd-btn,
.cbd-footer-link-cta, .lg-back, .lg-cta a{ text-transform:uppercase; }


/* ── v120 · FAQ: cada <p> llevaba 1.4rem de padding inferior + margen
   nativo del navegador -> doble aire entre párrafos. Ritmo editorial: ── */
body.sd-body .hyb-q-a p{ margin:0; padding:0 .4rem .8rem; }
body.sd-body .hyb-q-a p:last-child{ padding-bottom:1.15rem; }