/* ===================== CONTAINER QUERIES (responsive real por ancho de contenedor) ===================== */
  @container ds (max-width: 620px){
    .ds .cover{ padding:52px 0 30px; }
    .ds .cover h1{ font-size:clamp(2.1rem,9cqw,2.8rem); }
    .ds .cover p{ font-size:1.05rem; }
    .ds section.bloque{ padding:46px 0; }
    .ds .cards.cols-2, .ds .cards.cols-3{ grid-template-columns:1fr; }
    .ds .articulo{ display:block; }
    .ds .articulo > * + *{ margin-top:1.4em; }
    .ds .banda.hero-band{ padding:104px 22px 22px; }
    .ds .stats{ gap:22px; }
    .ds .stat .num{ font-size:2.3rem; }
    .ds h2.h{ font-size:1.55rem; }
    .ds .muestras{ grid-template-columns:repeat(auto-fill,minmax(116px,1fr)); }
    .ds .formdemo{ flex-direction:column; }
    .ds .formdemo input{ flex:1 1 auto; }
    .ds pre{ font-size:.72rem; padding:16px 16px; }
    .ds .wrap{ padding:0 20px; }
    .ds .cards{ padding:0 20px; }
    .ds .banda{ padding:40px 22px; }
    /* Tarjetas horizontales: se apilan */
    .ds .card-h{ flex-direction:column; }
    .ds .card-h .txt{ align-self:stretch; padding:22px 22px 18px; order:1; }
    .ds .card-h .media{ flex:0 0 auto; width:100%; min-height:160px; order:2; border-left:none; border-top:1px solid var(--linea); }
    .ds .card-h.b{ padding:22px 22px 0; min-height:0; }
    .ds .card-h.b .txt{ padding:0 0 18px; }
    .ds .card-h.b .media{ height:150px; min-height:0; margin-bottom:0; border:1px solid var(--linea); border-bottom:none; border-radius:12px 12px 0 0; }
    .ds .card-h.c .txt{ order:2; }
    .ds .card-h.c .media{ order:1; border-top:none; border-bottom:1px solid var(--linea); }
    .ds .card-h.d{ padding:0 22px 22px; min-height:0; }
    .ds .card-h.d .txt{ order:2; padding:18px 0 0; }
    .ds .card-h.d .media{ order:1; height:150px; min-height:0; width:100%; margin-bottom:0; border:1px solid var(--linea); border-top:none; border-radius:0 0 12px 12px; }
    .ds .card-h.e{ padding:0 22px 22px; min-height:0; margin-top:44px; }
    .ds .card-h.e .txt{ order:2; align-self:stretch; padding:18px 0 0; }
    .ds .card-h.e .media{ order:1; flex:0 0 auto; width:100%; height:150px; min-height:0; border:none; border-top:none; }
    .ds .card-h.e .media .retrato{ top:-40px; bottom:0; border-radius:12px 12px 0 0; }
    /* Testimonio en video: una tarjeta por fila */
    .ds .vt{ width:100%; }
    .ds .vt-grid{ padding:0; }
  }

  /* ===================== V2.1 — Títulos en negro por defecto =====================
     Regla: los títulos (H1/H2/H3 y títulos de tarjeta/callout) van en --negro.
     --marca se RESERVA para la identidad (logo/brand), enlaces, acentos,
     viñetas y la etiqueta del botón CTA. No se pinta con el color de marca todo encabezado. */
  .ds .cover h1,
  .ds h2.h,
  .ds .demo-h1, .ds .demo-h2, .ds .demo-h3,
  .ds .card .ctitle,
  .ds .card-h .titulo,
  .ds .callout .ct .t,
  .ds .banda.claro .texto,
  .ds .resena .nombre-r{ color: var(--negro); }
  .ds .callout.oscuro .ct .t,
  .ds .callout.gris800 .ct .t{ color:#fff; } /* excepción: sobre fondo oscuro / gris-800 */

  /* ===== V2 add-ons: tarjetas verticales · navbar claro · CTA form block ===== */
  .ds .cards-v{ display:grid; gap:20px; max-width:var(--medida-ancha); margin:0 auto; grid-template-columns:repeat(3,1fr); }
  .ds .cards-v.cols-2{ grid-template-columns:repeat(2,1fr); }
  .ds .card-v{ display:flex; flex-direction:column; background:var(--superficie); border:1px solid var(--linea); border-radius:16px; overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
  .ds .card-v:hover{ transform:translateY(-3px); box-shadow:0 14px 30px -18px rgba(0,0,0,.22); }
  .ds .card-v .media{ height:150px; background:var(--grad-claro); border-bottom:1px solid var(--linea); display:grid; place-items:center; color:var(--gris-600); font-family:var(--fuente-mono); font-size:.72rem; background-size:cover; background-position:center; }
  .ds .card-v .txt{ padding:20px 22px; }
  .ds .card-v .titulo{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.12rem; letter-spacing:-.01em; color:var(--marca); margin:0 0 7px; }
  .ds .card-v .desc{ font-family:var(--fuente-cuerpo); font-size:.96rem; line-height:1.55; color:var(--gris-600); margin:0; }
  .ds .card-v.anclada{ padding:16px 16px 0; }
  .ds .card-v.anclada .media{ border:1px solid var(--linea); border-radius:12px; height:140px; }
  .ds .card-v.anclada .txt{ padding:18px 6px 20px; }
  .ds .card-v.sobresale{ overflow:visible; position:relative; margin-top:78px; padding-top:150px; }
  .ds .card-v.sobresale .media{ position:absolute; top:-78px; left:16px; right:16px; height:212px; margin-top:0; border:1px solid var(--linea); border-radius:14px; }
  .ds .card-v.sobresale .txt{ padding:6px 22px 22px; }
  @container ds (max-width:640px){ .ds .cards-v, .ds .cards-v.cols-2{ grid-template-columns:1fr; } }

  .ds .navbar-demo.claro{ background:#E7ECE9; }
  .ds .navbar-demo.claro::before{ background:radial-gradient(closest-side at 50% -10%, rgba(53,92,83,.18), transparent 70%); }
  .ds .navbar.claro{ background:rgba(255,255,255,.55); border:1px solid rgba(53,92,83,.14); box-shadow:0 12px 36px -14px rgba(0,0,0,.25); }
  .ds .navbar.claro .brand{ color:var(--marca); }
  .ds .navbar.claro .nlinks a{ color:var(--gris-800); }
  .ds .navbar.claro .nlinks a:hover{ color:var(--marca); }

  .ds .cta-block{ background:var(--marca); border-radius:0; padding:52px 28px; }
  .ds .form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:start; max-width:var(--medida-ancha); margin:0 auto; }
  .ds .form-card{ background:var(--superficie); border-radius:16px; padding:24px 22px; box-shadow:0 20px 44px -26px rgba(0,0,0,.35); }
  .ds .form-card-title{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.24rem; line-height:1.15; color:var(--marca); margin:0 0 16px; }
  .ds .form-row-2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
  .ds .form-group{ display:flex; flex-direction:column; gap:6px; margin-bottom:12px; }
  .ds .form-group label{ font-family:var(--fuente-mono); font-size:.72rem; letter-spacing:.04em; text-transform:uppercase; color:var(--gris-600); }
  .ds .form-group .req{ color:var(--acento); }
  .ds .form-group input{ font-family:var(--fuente-cuerpo); font-size:1rem; padding:12px 14px; border:1px solid var(--linea); border-radius:10px; background:var(--fondo); color:var(--negro); width:100%; box-sizing:border-box; }
  .ds .form-group input:focus{ outline:3px solid var(--lavanda-suave); border-color:var(--lavanda); }
  .ds .input-icon{ position:relative; display:flex; align-items:center; }
  .ds .input-icon svg{ position:absolute; left:12px; color:var(--gris-400); }
  .ds .input-icon input{ padding-left:36px; }
  .ds .btn-form{ width:100%; margin-top:6px; justify-content:center; }
  .ds .form-note{ font-family:var(--fuente-mono); font-size:.76rem; color:var(--gris-600); margin:14px 0 0; text-align:center; }
  .ds .form-map{ margin-top:18px; }
  .ds .form-map-text{ font-family:var(--fuente-mono); font-size:.76rem; color:var(--gris-600); margin:0 0 8px; }
  .ds .form-map-ph{ height:150px; border-radius:12px; background:linear-gradient(135deg,#E2E7EA,#CBD3D0); display:grid; place-items:center; color:var(--gris-600); font-family:var(--fuente-mono); font-size:.72rem; }
  .ds .form-copy-title{ font-family:var(--fuente-titulo); font-weight:800; font-size:1.7rem; line-height:1.12; letter-spacing:-.02em; color:var(--marca); margin:0 0 16px; }
  .ds .form-price{ display:flex; align-items:baseline; gap:12px; margin-bottom:16px; }
  .ds .form-price .old{ font-family:var(--fuente-mono); font-size:1rem; color:var(--gris-600); text-decoration:line-through; }
  .ds .form-price .now{ font-family:var(--fuente-titulo); font-weight:800; font-size:2rem; color:var(--marca); }
  .ds .form-inc-label{ font-family:var(--fuente-titulo); font-weight:600; font-size:.95rem; color:var(--marca); margin:0 0 10px; }
  .ds .form-inc{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
  .ds .form-inc li{ display:flex; gap:10px; align-items:flex-start; font-family:var(--fuente-cuerpo); font-size:.96rem; line-height:1.45; color:var(--gris-800); }
  .ds .form-inc li svg{ flex:0 0 auto; margin-top:2px; color:var(--acento); }
  @container ds (max-width:680px){ .ds .form-grid{ grid-template-columns:1fr; } }
  /* Logo placeholder (texto MARCA) · navbar/solapa */
  .ds .logo-crece{ display:block; width:auto; }
  .ds .navbar .brand{ display:flex; align-items:center; }
  .ds .navbar .brand .logo-crece{ height:44px; color:#fff; }
  .ds .hero-band{ padding:140px 28px 28px; }  /* aire entre el navbar flotante y el hero */
  .ds .navbar.claro .brand .logo-crece{ color:var(--marca); }
  .ds .topbar-demo{ position:relative; height:210px; background:#E7ECE9; border-radius:16px; overflow:hidden; }
  .ds .topbar-demo::before{ content:""; position:absolute; inset:0; background:radial-gradient(closest-side at 50% -20%, rgba(53,92,83,.12), transparent 70%); }
  .ds .solapa{ position:absolute; top:0; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:8px; background:var(--superficie); border:1px solid var(--linea); border-top:none; border-radius:0 0 16px 16px; padding:16px 34px 18px; box-shadow:0 14px 32px -18px rgba(0,0,0,.35); text-decoration:none; }
  .ds .solapa .logo-crece{ height:64px; color:#111111; }
  .ds .solapa .solapa-text{ text-align:center; }
  .ds .solapa .solapa-text strong{ display:block; font-family:var(--fuente-titulo); font-weight:700; font-size:.92rem; color:var(--marca); letter-spacing:-.01em; }
  .ds .solapa .solapa-text small{ font-family:var(--fuente-mono); font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gris-600); }
  .ds .form-copy{ padding:6px 0; }
  .ds .form-copy .form-copy-title{ color:#fff; }
  .ds .form-copy .form-price .old{ color:rgba(255,255,255,.55); }
  .ds .form-copy .form-price .now{ color:#fff; }
  .ds .form-copy .form-inc-label{ color:#EAF1EE; }
  .ds .form-copy .form-inc li{ color:#E6EFEB; border-top:1px solid rgba(255,255,255,.22); padding-top:12px; }
  .ds .form-copy .form-inc li:first-child{ border-top:none; padding-top:0; }
  .ds .form-copy .form-inc li svg{ color:rgba(255,255,255,.82); }
  /* Equilibrio de líneas — aplicado a TODO el texto del DS (consistencia) */
  .ds h1, .ds h2, .ds h3, .ds p, .ds li, .ds dt, .ds dd,
  .ds .seccion-h, .ds .comp, .ds .demo-h1, .ds .demo-h2, .ds .demo-h3, .ds .demo-stand,
  .ds .nota, .ds .desc, .ds .cbody, .ds .titulo, .ds .ctitle, .ds .callout .ct .t,
  .ds .banda .texto, .ds .vt-quote, .ds .eyebrow, .ds .mini, .ds .spec-tipo,
  .ds .form-card-title, .ds .form-copy-title, .ds .form-note,
  .ds .demo-body, .ds .texto-ui, .ds .resena .texto{ text-wrap:balance; }
  /* Solo el intro de portada (el bloque más largo) usa pretty */
  .ds .cover p{ text-wrap:pretty; }

  /* ============================================================
     COMPONENTES DE LANDING — variantes incorporadas a la Biblioteca
     (origen: DS de clientes; retematizadas a tokens neutros)
  ============================================================ */
  .ds .ph{ background-color:var(--marcador); background-image:repeating-linear-gradient(135deg, rgba(0,0,0,.05) 0 10px, rgba(0,0,0,0) 10px 22px); display:grid; place-items:center; text-align:center; color:var(--gris-600); font-family:var(--fuente-mono); font-size:.72rem; letter-spacing:.02em; line-height:1.5; padding:14px; }
  .ds .ph.dark{ background-color:var(--marca); background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.08) 0 10px, rgba(255,255,255,0) 10px 22px); color:var(--sobre-oscuro-2); }
  .ds .ph .pl-ic{ font-size:1.1rem; opacity:.7; margin-bottom:4px; }
  /* Benefit card: imagen a sangre arriba + dato destacado + título + una línea */
    .ds .card.beneficio-dato{ padding:0; overflow:hidden; display:flex; flex-direction:column; }
  .ds .beneficio-dato .bmedia{ height:170px; border-radius:var(--r-media) var(--r-media) 0 0; overflow:hidden; margin:0; }
  .ds .beneficio-dato .btxt{ padding:20px 24px 26px; }
  .ds .beneficio-dato .bdato{ font-family:var(--fuente-titulo); font-weight:700; font-size:2.5rem; line-height:1; letter-spacing:-.01em; color:var(--acento); margin:0 0 10px; }
  .ds .beneficio-dato .bdato .bu{ font-family:var(--fuente-titulo); font-weight:700; font-size:.5em; color:var(--acento); letter-spacing:-.01em; }
  /* Fix Gabriel Garmendia: titulo-card/texto-card no tenían regla propia y heredán
     tamaño de párrafo completo — demasiado grande para 3 columnas. Ajustado hacia
     abajo del tamaño de .card .ctitle/.cbody del sistema. */
  .ds .beneficio-dato .titulo-card{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.02rem; line-height:1.28; letter-spacing:-.01em; color:var(--marca); margin:0 0 5px; }
  .ds .beneficio-dato .texto-card{ font-family:var(--fuente-cuerpo); font-size:.86rem; line-height:1.48; color:var(--gris-600); margin:0; }
  /* --- Hero / Header · banda full-bleed --- */
    .ds .header-banda{ position:relative; width:100cqw; margin-left:calc(50% - 50cqw); background:var(--marca); overflow:hidden; }
  .ds .header-banda .navbar{ position:relative; top:auto; left:auto; transform:none; margin:20px auto 0; }
  .ds .header-banda .hero-inner{ position:relative; z-index:2; max-width:var(--medida-ancha); margin:0 auto; min-height:clamp(520px,72vh,700px); padding:56px 28px 64px; display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
  .ds .header-banda .hero-copy{ display:flex; flex-direction:column; gap:14px; max-width:460px; }
  .ds .header-banda .hh-eyebrow{ font-family:var(--fuente-mono); font-size:.8rem; letter-spacing:.16em; text-transform:uppercase; color:var(--acento); margin:0; }
  .ds .header-banda .hh-h1{ font-family:var(--fuente-titulo); font-weight:700; font-size:clamp(1.9rem,4.2cqw,2.8rem); line-height:1.1; letter-spacing:-.01em; color:#fff; margin:0; text-wrap:balance; }
  .ds .header-banda .hh-h2{ font-family:var(--fuente-cuerpo); font-weight:400; font-size:clamp(1rem,2cqw,1.2rem); line-height:1.5; color:var(--sobre-oscuro); margin:0; }
  .ds .header-banda .hh-cta{ margin-top:8px; }
  .ds .header-banda .hero-media{ position:relative; aspect-ratio:3/4; border-radius:20px; overflow:hidden; align-self:stretch; }
  .ds .header-banda .hero-glow{ position:absolute; inset:-20%; background:radial-gradient(50% 50% at 70% 20%, rgba(110,125,140,.28), transparent 65%); pointer-events:none; z-index:1; }
  /* --- Logos de seguros: strip carrusel grayscale --- */
    .ds .logos-strip{ position:relative; width:100cqw; margin-left:calc(50% - 50cqw); overflow:hidden; padding:22px 0; background:transparent; }
  .ds .logos-strip::before, .ds .logos-strip::after{ content:""; position:absolute; top:0; bottom:0; width:80px; z-index:2; pointer-events:none; }
  .ds .logos-strip::before{ left:0; background:linear-gradient(90deg,var(--fondo),transparent); }
  .ds .logos-strip::after{ right:0; background:linear-gradient(270deg,var(--fondo),transparent); }
  .ds .logos-track{ display:flex; gap:56px; width:max-content; align-items:center; animation:logos-scroll 32s linear infinite; }
  .ds .logos-strip:hover .logos-track{ animation-play-state:paused; }
  .ds .logo-seg{ flex:0 0 auto; height:34px; display:flex; align-items:center; gap:9px; font-family:var(--fuente-cuerpo); font-weight:700; font-size:.98rem; color:#7C7C7C; filter:grayscale(1); opacity:.62; }
  .ds .logo-seg .dot{ width:22px; height:22px; border-radius:6px; background:#7C7C7C; opacity:.5; }
  @media (prefers-reduced-motion:reduce){ .ds .logos-track{ animation:none; } }
  /* --- Método · sticky stack (3 fases) --- */
    .ds .metodo-id{ display:flex; flex-direction:column; align-items:center; gap:16px; text-align:center; margin-bottom:44px; }
  .ds .metodo-id .m-badge{ width:96px; height:96px; border-radius:20px; overflow:hidden; }
  .ds .metodo-id .mtitle{ font-family:var(--fuente-titulo); font-weight:700; font-size:clamp(1.6rem,3vw,2.1rem); line-height:1.14; color:var(--marca); margin:0; }
  .ds .mstack{ max-width:900px; margin:0 auto; }
  .ds .pcard{ position:sticky; border-radius:20px; padding:36px 40px; box-shadow:var(--sombra); margin-bottom:clamp(18px,7vh,64px); border:1px solid var(--linea); display:grid; grid-template-columns:210px 1fr; gap:34px; align-items:start; }
  .ds .pcard:last-child{ margin-bottom:0; }
  .ds .pcard.p1{ background:var(--superficie); top:120px; }
  .ds .pcard.p2{ background:var(--marcador); top:140px; }
  .ds .pcard.p3{ background:var(--marca); top:160px; }
  .ds .pcard.p3 h3{ color:#fff; }
  .ds .pcard.p3 .pintro{ color:var(--sobre-oscuro-2); }
  .ds .pcard.p3 .plist li{ color:var(--sobre-oscuro); }
  .ds .pcard.p3 .ptag{ background:rgba(110,125,140,.2); color:var(--acento); }
  .ds .pcard.p3 .plist li::before{ background:rgba(110,125,140,.22); }
  .ds .pcard .pmedia{ width:100%; aspect-ratio:3/4; border-radius:14px; overflow:hidden; }
  .ds .pcard .ptag{ position:absolute; top:16px; right:18px; display:inline-flex; align-items:center; gap:8px; background:var(--marcador); border-radius:999px; padding:6px 14px; font-family:var(--fuente-mono); font-size:.72rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--acento); }
  .ds .pcard h3{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.32rem; line-height:1.22; margin:0 0 10px; padding-right:96px; color:var(--marca); }
  .ds .pcard .pintro{ margin:0; color:var(--gris-600); font-size:1.04rem; line-height:1.6; }
  .ds .plist{ list-style:none; margin:18px 0 0; padding:0; display:grid; gap:12px; }
  .ds .plist li{ position:relative; padding-left:32px; font-size:1rem; line-height:1.5; color:var(--gris-600); }
  .ds .plist li::before{ content:""; position:absolute; left:0; top:2px; width:20px; height:20px; border-radius:999px; background:var(--marcador) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235C6B7A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m20 6-11 11-5-5'/%3E%3C/svg%3E") center/12px no-repeat; }
  .ds .metodo-cta{ display:flex; justify-content:center; margin-top:40px; position:relative; z-index:4; }
  /* --- Credenciales --- */
    .ds .cred{ display:grid; grid-template-columns:340px 1fr; gap:54px; align-items:start; max-width:1000px; margin:0 auto; }
  .ds .cred .frame{ aspect-ratio:3/4; border-radius:20px 20px 80px 20px; overflow:hidden; box-shadow:var(--sombra-lg); }
  .ds .cred .story h2.h{ margin-bottom:18px; }
  .ds .credcards{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .ds .credcard{ border-radius:12px; padding:16px 18px; display:flex; align-items:flex-start; gap:12px; background:var(--superficie); border:1px solid var(--linea); }
  .ds .credcard .ck{ flex:0 0 auto; margin-top:2px; width:22px; height:22px; border-radius:999px; background:var(--marcador); color:var(--acento); display:grid; place-items:center; }
  .ds .credcard .ck svg{ width:13px; height:13px; }
  .ds .credcard .ctxt{ display:flex; flex-direction:column; gap:2px; }
  .ds .credcard .ct{ font-family:var(--fuente-cuerpo); font-size:1rem; font-weight:700; line-height:1.25; color:var(--marca); }
  .ds .credcard .cs{ font-size:.84rem; font-weight:500; line-height:1.35; color:var(--gris-600); }
  .ds .credcard.wide{ grid-column:1 / -1; }
  .ds .cred-logos{ display:flex; flex-wrap:wrap; gap:16px 26px; align-items:center; margin:28px 0 0; }
  .ds .cred-logos .logo-soc{ height:44px; display:flex; align-items:center; gap:8px; font-family:var(--fuente-cuerpo); font-weight:700; font-size:.86rem; color:#7C7C7C; filter:grayscale(1); opacity:.62; transition:opacity .22s, filter .22s; }
  .ds .cred-logos .logo-soc:hover{ filter:grayscale(0); opacity:1; }
  .ds .cred-logos .logo-soc .dot{ width:20px; height:20px; border-radius:5px; background:#7C7C7C; opacity:.5; }
  .ds .fprice-row{ display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 18px; margin:0 0 18px; }
  .ds .fprice{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
  .ds .fprice .now{ font-family:var(--fuente-titulo); font-weight:700; color:var(--acento); font-size:2.4rem; letter-spacing:-.01em; }
  .ds .fprice .was{ color:rgba(255,255,255,.5); font-size:1.2rem; text-decoration:line-through; }
  .ds .fprice .cur{ font-family:var(--fuente-mono); font-size:.8rem; color:var(--sobre-oscuro-2); align-self:center; }
  .ds .fincl{ color:var(--sobre-oscuro-2); font-size:1.02rem; margin:0; }
  .ds .fbenefits{ list-style:none; padding:0; margin:0 0 22px; display:grid; gap:12px; }
  .ds .fbenefits li{ display:grid; grid-template-columns:42px 1fr; gap:14px; align-items:center; }
  .ds .fbenefits .bi{ width:42px; height:42px; border-radius:12px; background:rgba(110,125,140,.14); display:grid; place-items:center; color:var(--acento); }
  .ds .fbenefits .bi svg{ width:20px; height:20px; }
  .ds .fbenefits .bt{ color:var(--sobre-oscuro); font-size:1rem; line-height:1.5; }
  .ds .fbenefits li.guar{ background:rgba(110,125,140,.12); border:1px solid rgba(110,125,140,.34); border-radius:14px; padding:14px; align-items:start; }
  .ds .fbenefits li.guar .bi{ background:var(--acento); color:var(--marca); }
  .ds .fbenefits li.guar .bt{ color:#E9ECEF; font-size:.97rem; }
  /* --- Ubicación multi-clínica --- */
    .ds .ubi-main{ display:grid; grid-template-columns:1.1fr 1fr; gap:22px; max-width:960px; margin:0 auto; background:var(--superficie); border:1px solid var(--linea); border-radius:var(--r-card); overflow:hidden; box-shadow:var(--sombra); }
  .ds .ubi-main .ubi-map{ min-height:320px; }
  .ds .ubi-main .ubi-body{ display:flex; flex-direction:column; gap:16px; padding:34px 34px 34px 10px; }
  .ds .ubi-photo{ height:150px; border-radius:12px; overflow:hidden; }
  .ds .ubi-main h3{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.4rem; margin:0; color:var(--marca); }
  .ds .ubi-addr{ display:flex; gap:12px; align-items:flex-start; font-size:1.04rem; color:var(--negro); line-height:1.5; margin:0; }
  .ds .ubi-addr .mk{ flex:0 0 auto; color:var(--acento); margin-top:2px; }
  .ds .ubi-tag{ font-family:var(--fuente-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--acento); }
  .ds .ubi-mini{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; max-width:960px; margin:18px auto 0; }
  .ds .ubi-card{ background:var(--superficie); border:1px solid var(--linea); border-radius:14px; overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
  .ds .ubi-card:hover{ transform:translateY(-3px); box-shadow:var(--sombra); }
  .ds .ubi-card .ubi-cphoto{ height:96px; }
  .ds .ubi-card .ubi-cbody{ padding:14px 16px; }
  .ds .ubi-card .ubi-cname{ font-family:var(--fuente-titulo); font-weight:700; font-size:.98rem; color:var(--marca); margin:0 0 4px; }
  .ds .ubi-card .ubi-caddr{ font-family:var(--fuente-cuerpo); font-size:.82rem; color:var(--gris-600); margin:0; line-height:1.4; }
  /* Variante Gabriel Garmendia: Ubicación · una marca, tres sedes (sin jerarquía) */
  .ds .ubi-brand{ display:flex; align-items:stretch; max-width:960px; margin:0 auto 16px; background:var(--superficie); border:1px solid var(--linea); border-radius:var(--r-card); overflow:hidden; box-shadow:var(--sombra); }
  .ds .ubi-brand .ubi-brand-media{ flex:0 0 240px; }
  .ds .ubi-brand .ubi-brand-body{ flex:1; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 28px; }
  .ds .ubi-brand h3{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.4rem; margin:0; color:var(--marca); }
  .ds .ubi-brand .ubi-brand-logo{ flex:0 0 auto; width:120px; height:44px; border-radius:8px; font-size:.68rem; }
  .ds .ubi-sedes-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:960px; margin:0 auto; }
  .ds .ubi-sede{ background:var(--superficie); border:1px solid var(--linea); border-radius:14px; overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
  .ds .ubi-sede:hover{ transform:translateY(-3px); box-shadow:var(--sombra); }
  .ds .ubi-sede .ubi-sede-map{ height:140px; }
  .ds .ubi-sede .ubi-sede-body{ padding:16px 18px; display:flex; flex-direction:column; gap:6px; }
  .ds .ubi-sede .ubi-tag{ font-family:var(--fuente-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--acento); }
  .ds .ubi-sede .ubi-addr{ font-family:var(--fuente-cuerpo); font-size:.92rem; color:var(--negro); line-height:1.45; margin:0; }
  @container ds (max-width:680px){
    .ds .ubi-brand{ flex-direction:column; }
    .ds .ubi-brand .ubi-brand-media{ flex:none; width:100%; height:160px; }
    .ds .ubi-brand .ubi-brand-body{ flex-direction:column; align-items:flex-start; gap:12px; padding:18px 20px; }
    .ds .ubi-sedes-3{ grid-template-columns:1fr; }
  }

  /* --- Lo que se logra · imágenes pareadas (29 jul) ---
     Variante simple: 2 imágenes lado a lado dentro de un mismo marco, en vez
     de un comparador antes/después interactivo. */
  .ds .logra-grid{ display:grid; gap:20px; max-width:var(--medida-ancha); margin:0 auto; grid-template-columns:repeat(3,1fr); }
  .ds .logra-card{ background:var(--superficie); border:1px solid var(--linea); border-radius:var(--r-card); overflow:hidden; transition:transform .2s ease, box-shadow .2s ease; }
  .ds .logra-card:hover{ transform:translateY(-3px); box-shadow:var(--sombra); }
  .ds .logra-imgs{ display:flex; }
  .ds .logra-imgs .logra-img{ flex:1 1 50%; aspect-ratio:1/1; border-right:1px solid var(--linea); }
  .ds .logra-imgs .logra-img:last-child{ border-right:none; }
  .ds .logra-card .logra-body{ padding:16px 18px; }
  @container ds (max-width:680px){ .ds .logra-grid{ grid-template-columns:1fr; } }

  /* --- FAQ acordeón --- */
    .ds .faq{ max-width:780px; margin:0 auto; }
  .ds .faq details{ border:1px solid var(--linea); border-radius:12px; background:var(--superficie); padding:2px 24px; margin-bottom:14px; transition:box-shadow .2s, border-color .2s; }
  .ds .faq details[open]{ box-shadow:var(--sombra); border-color:var(--acento); }
  .ds .faq summary{ cursor:pointer; list-style:none; font-family:var(--fuente-titulo); font-weight:700; font-size:1.12rem; padding:20px 0; display:flex; justify-content:space-between; align-items:center; gap:16px; color:var(--marca); }
  .ds .faq summary::-webkit-details-marker{ display:none; }
  .ds .faq summary .ico{ flex:0 0 auto; width:30px; height:30px; border-radius:999px; background:var(--marcador); color:var(--acento); display:grid; place-items:center; font-weight:700; font-size:1.3rem; transition:transform .2s, background .2s, color .2s; }
  .ds .faq details[open] summary .ico{ transform:rotate(45deg); background:var(--acento); color:var(--marca); }
  .ds .faq details p{ margin:0 0 22px; color:var(--gris-600); font-size:1.02rem; line-height:1.6; }
  /* --- Footer full-bleed --- */
    .ds .site-footer{ position:relative; width:100cqw; margin-left:calc(50% - 50cqw); overflow:hidden; background:var(--marca); }
  .ds .site-footer .foot-bg{ position:absolute; inset:0; z-index:0; opacity:.5; }
  .ds .site-footer .foot-veil{ position:absolute; inset:0; z-index:1; background:linear-gradient(180deg, rgba(38,46,54,.78), rgba(38,46,54,.94)); }
  .ds .site-footer .foot-inner{ position:relative; z-index:2; max-width:860px; margin:0 auto; padding:64px 28px 40px; }
  .ds .site-footer .foot-top{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:28px; align-items:flex-start; }
  .ds .site-footer .foot-brand{ font-family:var(--fuente-titulo); font-weight:700; font-size:1.6rem; color:#fff; margin:0 0 8px; }
  .ds .site-footer .foot-brand + p{ color:var(--sobre-oscuro-2); font-size:.98rem; max-width:320px; margin:0; line-height:1.55; }
  .ds .site-footer .foot-col h4{ font-family:var(--fuente-mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--acento); margin:0 0 12px; }
  .ds .site-footer .foot-col a{ display:block; color:var(--sobre-oscuro); text-decoration:none; font-size:.95rem; margin-bottom:8px; }
  .ds .site-footer .foot-col a:hover{ color:#fff; }
  .ds .site-footer .foot-segs{ display:flex; flex-wrap:wrap; gap:14px 22px; align-items:center; margin:34px 0; padding:22px 0; border-top:1px solid rgba(110,125,140,.2); border-bottom:1px solid rgba(110,125,140,.2); }
  .ds .site-footer .foot-segs .logo-soc{ height:30px; display:flex; align-items:center; gap:8px; font-family:var(--fuente-cuerpo); font-weight:700; font-size:.82rem; color:var(--sobre-oscuro-2); filter:grayscale(1); opacity:.7; }
  .ds .site-footer .foot-segs .logo-soc .dot{ width:18px; height:18px; border-radius:5px; background:var(--sobre-oscuro-2); opacity:.6; }
  .ds .site-footer .foot-legal{ font-family:var(--fuente-mono); font-size:.72rem; line-height:1.7; color:var(--sobre-oscuro-2); margin-top:34px; padding-top:22px; border-top:1px solid rgba(110,125,140,.2); }
  .ds .btn-cta .arw{ transition:transform .18s ease; }
  .ds .btn-cta:hover .arw{ transform:translateX(3px); }
  /* Fix Gabriel Garmendia: estilos-2-sistema.css fija color:var(--marca) (navy) como
     texto del CTA — funcionaba sobre dorado claro, pero pierde contraste sobre el verde
     Caribe (medio-oscuro). Override local, sin tocar el hueso compartido. */
  .ds .btn-cta{ color:#FFFFFF; }
  .ds .btn-cta.fantasma{ color:var(--marca); }

  /* Variante Gabriel Garmendia: testimonio en video vertical 9:16 (decisión 29 jul,
     provisoria mientras se define el material real). El hueso .vt-media{aspect-ratio:1/1}
     de estilos-2-sistema.css no se toca — se sobreescribe solo con el modificador .v916. */
  .ds .vt.v916{ width:230px; }
  .ds .vt.v916 .vt-media{ aspect-ratio:9/16; }
  @container ds (max-width:620px){ .ds .vt.v916{ width:100%; max-width:280px; margin:0 auto; } }
  @keyframes logos-scroll{ to{ transform:translateX(calc(-50% - 28px)); } }
  .ds .oferta-demo{ background:var(--card); border-radius:16px; padding:34px 36px; max-width:520px; }
  .ds .oferta-demo .fprice .now{ color:#C6D0DA; }   /* acento aclarado sobre superficie oscura */
  .ds .oferta-demo .fbenefits .bi{ color:#C6D0DA; }
  .ds .oferta-demo .fbenefits li.guar .bi{ color:var(--card); }
  .ds .logo-txt{ font-family:var(--fuente-titulo); font-weight:800; letter-spacing:.08em; font-size:1rem; }
  @media (max-width:900px){
    /* Método */
        .ds .pcard{ grid-template-columns:1fr; gap:18px; padding:26px 22px; }
    .ds .pcard .pmedia{ width:140px; margin:0 auto; }
    .ds .pcard h3{ padding-right:0; }
    .ds .pcard.p1{ top:80px; }
    .ds .pcard.p2{ top:96px; }
    .ds .pcard.p3{ top:112px; }
    /* Credenciales */
        .ds .cred{ grid-template-columns:1fr; gap:40px; }
    .ds .cred .photo{ max-width:320px; margin:0 auto; }
    .ds .credcards{ grid-template-columns:1fr; }
    .ds .credcard.wide{ grid-column:auto; }
    .ds .fprice .now{ font-size:2rem; }
    /* Ubicación */
        .ds .ubi-main{ grid-template-columns:1fr; }
    .ds .ubi-main .ubi-map{ min-height:220px; }
    .ds .ubi-main .ubi-body{ padding:24px; }
    .ds .ubi-mini{ grid-template-columns:1fr 1fr; }
    /* Hero band */
        .ds .header-banda .hero-inner{ grid-template-columns:1fr; min-height:0; padding:36px 22px 40px; gap:26px; }
    .ds .header-banda .hero-copy{ max-width:100%; }
    .ds .header-banda .hero-media{ order:-1; aspect-ratio:16/10; }
    .ds .header-banda .navbar{ margin-top:14px; }
    /* Footer */
        .ds .site-footer .foot-top{ flex-direction:column; gap:24px; }
  }

  /* --- Contenedores angostos: rejillas que aún no colapsaban --- */
  @container ds (max-width:620px){
    .ds .pcard{ grid-template-columns:1fr; gap:20px; padding:28px 22px; }
    .ds .pcard .pmedia{ aspect-ratio:16/10; }
    .ds .cred{ grid-template-columns:1fr; gap:28px; }
    .ds .cred .frame{ max-width:320px; margin:0 auto; }
    .ds .credcards{ grid-template-columns:1fr; }
    .ds .ubi-mini{ grid-template-columns:1fr 1fr; }
    .ds .gl > div{ grid-template-columns:1fr; gap:4px; }
    .ds .muestras{ grid-template-columns:repeat(auto-fill,minmax(104px,1fr)); }
  }