/* Doctor Online MX v2 — /aviso-de-privacidad
   Texto legal íntegro y fácil de leer: resumen en 30 segundos con sello, índice fijo en
   escritorio (desplegable en celular), barra de lectura y apartados con apoyos visuales
   que no cambian la redacción legal. Nada se anima en bucle. */

/* ---------- Barra de lectura ---------- */
.lg-progress { position: fixed; z-index: 95; inset: 0 0 auto 0; height: 3px; pointer-events: none; }
.lg-progress i { display: block; height: 100%; background: linear-gradient(90deg, var(--electric), var(--sky)); transform-origin: 0 50%; transform: scaleX(0); border-radius: 0 3px 3px 0; }

/* ---------- Hero ---------- */
.lg-hero { padding-bottom: clamp(2.5rem, 1.6rem + 3vw, 4.5rem); }
@media (min-width: 1024px) { .lg-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: end; } }
.lg-hero .s-hero__lead { max-width: 54ch; }
.lg-meta { list-style: none; padding: 0; margin: 1.6rem 0 0; display: flex; flex-wrap: wrap; gap: .5rem; }
/* El inicio es oscuro (service.css v3): pastillas de vidrio oscuro, texto claro */
.lg-meta li { display: inline-flex; align-items: center; gap: .45rem; min-height: 38px; padding: .4rem .9rem; border-radius: 999px; background: rgba(255, 255, 255, .06); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font-size: var(--fs-xs); font-weight: 560; color: rgba(255, 255, 255, .76); }
.lg-meta .i { width: 1rem; height: 1rem; color: var(--sky); }
.lg-meta time { color: #fff; font-weight: 680; }

/* Palabra gigante hueca al fondo del inicio: se hunde bajo el texto que sube como hoja y se desliza
   de lado con el scroll. Decoración (aria-hidden). */
.lg-word { position: absolute; z-index: -1; left: max(var(--gutter), calc((100vw - var(--wrap)) / 2)); bottom: .35rem; margin-left: -.06em; pointer-events: none; white-space: nowrap; font-family: var(--font-display); font-weight: 600; font-size: clamp(5.25rem, 2.5rem + 13.5vw, 15.5rem); line-height: .8; letter-spacing: -.035em; color: transparent; -webkit-text-stroke: 1.5px rgba(143, 182, 255, .2); background: linear-gradient(180deg, rgba(143, 182, 255, .13), rgba(143, 182, 255, 0) 62%); -webkit-background-clip: text; background-clip: text; will-change: transform; }
.lg-word > span { display: block; animation: lg-word-in 1.8s var(--ease-out) .35s both; }
@keyframes lg-word-in { from { opacity: 0; transform: translateY(22%); } }
@media (max-width: 759px) { .lg-word { bottom: .15rem; font-size: clamp(4.25rem, 2rem + 13vw, 6rem); -webkit-text-stroke-width: 1.2px; } }
@media (prefers-reduced-motion: reduce) { .lg-word > span { animation: none; } }

/* ---------- Lo esencial (resumen) + sello ---------- */
.lg-essence { position: relative; width: 100%; max-width: 540px; margin-top: 1.5rem; }
@media (min-width: 1024px) { .lg-essence { justify-self: end; margin-top: 0; } }
/* Tarjeta de vidrio oscuro: antes era blanca translúcida y sobre el inicio oscuro quedaba gris
   con los títulos en blanco heredado (contraste ilegible). */
.lg-essence__card { position: relative; z-index: 1; padding: clamp(1.25rem, 1rem + 1.2vw, 1.9rem); border-radius: var(--r-panel); color: #fff; background: linear-gradient(160deg, rgba(24, 46, 110, .62), rgba(6, 16, 46, .7) 62%); -webkit-backdrop-filter: blur(18px) saturate(140%); backdrop-filter: blur(18px) saturate(140%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13), inset 0 1px 0 rgba(255, 255, 255, .14), 0 40px 80px -34px rgba(0, 0, 0, .7); }
.lg-essence__title { font-family: var(--font-display); font-size: 1.22rem; font-weight: 600; letter-spacing: -.005em; word-spacing: .09em; line-height: 1.2; text-wrap: balance; color: #fff; padding-right: 5.5rem; margin-bottom: .6rem; }
.lg-essence__list li + li { border-top: 1px solid rgba(255, 255, 255, .1); }
.lg-essence__list a { display: grid; grid-template-columns: 2.6rem minmax(0, 1fr) auto; gap: .9rem; align-items: center; padding: .85rem .6rem; margin-inline: -.6rem; border-radius: 14px; color: #fff; transition: background-color .25s var(--ease-out); }
.lg-essence__list a:hover { background: rgba(255, 255, 255, .06); }
.lg-essence__list .i-box { width: 2.6rem; height: 2.6rem; border-radius: 13px; display: grid; place-items: center; background: rgba(143, 182, 255, .14); color: var(--sky); box-shadow: inset 0 0 0 1px rgba(143, 182, 255, .22); transition: background-color .25s var(--ease-out), color .25s var(--ease-out); }
.lg-essence__list a:hover .i-box { background: var(--electric); color: #fff; }
.lg-essence__list b { display: block; font-weight: 650; line-height: 1.25; color: #fff; }
.lg-essence__list small { display: block; margin-top: .2rem; font-size: var(--fs-small); color: rgba(255, 255, 255, .72); line-height: 1.4; }
.lg-essence__list .chev { width: 1rem; height: 1rem; color: rgba(255, 255, 255, .45); transition: transform .3s var(--ease-out), color .3s; }
.lg-essence__list a:hover .chev { transform: translateX(3px); color: var(--sky); }
.lg-essence__note { margin-top: .9rem; font-size: var(--fs-xs); color: rgba(255, 255, 255, .62); }

.lg-seal { position: absolute; z-index: 2; top: -2.4rem; right: -.6rem; width: 7.25rem; height: 7.25rem; display: grid; place-items: center; filter: drop-shadow(0 16px 26px rgba(0, 85, 255, .3)); }
@media (min-width: 1024px) { .lg-seal { width: 8.25rem; height: 8.25rem; top: -2.2rem; right: -2.6rem; } }
.lg-seal__ring { position: absolute; inset: 0; width: 100%; height: 100%; will-change: transform; }
.lg-seal__bg { fill: #fff; }
.lg-seal__dash { fill: none; stroke: rgba(0, 85, 255, .35); stroke-width: 1; stroke-dasharray: 2 4; }
.lg-seal text { font-family: var(--font); font-size: 10.5px; font-weight: 700; letter-spacing: .04em; fill: var(--ink); }
.lg-seal__core { position: absolute; inset: 0; margin: auto; width: 44%; height: 44%; border-radius: 50%; display: grid; place-items: center; background: var(--electric); color: #fff; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 10px 22px -10px rgba(0, 85, 255, .9); }
.lg-seal__core .i { width: 46%; height: 46%; }
.lg-seal { animation: lg-seal-in 1.3s var(--ease-out) .35s backwards; }
@keyframes lg-seal-in { from { opacity: 0; transform: scale(.6) rotate(-35deg); } }

/* ---------- Cuerpo: índice + texto ---------- */
.lg-body { padding-top: clamp(2.5rem, 1.5rem + 3vw, 4.5rem); }
.lg-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
@media (min-width: 1024px) { .lg-grid { grid-template-columns: 15.5rem minmax(0, 1fr); column-gap: clamp(3rem, 1rem + 4vw, 6rem); align-items: start; } }
.lg-main { min-width: 0; max-width: 46rem; }

.lg-aside { display: none; }
@media (min-width: 1024px) {
  .lg-aside { display: grid; gap: 1rem; position: sticky; top: calc(var(--header-h) + 1.75rem); }
  .lg-aside .legal-toc { position: static; }
  .lg-mtoc { display: none; }
}
/* --ink-3 sobre --paper da 4.2:1: en texto de 13-15 px no llega a AA, por eso aquí va --ink-2 o azul */
.lg-aside__title { font-size: var(--fs-xs); font-weight: 650; color: var(--ink-2); letter-spacing: .01em; }
.lg-aside .legal-toc a { display: grid; grid-template-columns: 1.5rem minmax(0, 1fr); line-height: 1.35; padding-block: .42rem; }
.lg-aside .legal-toc a span { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--electric-600); transition: color .2s; }
.lg-aside .legal-toc a.is-on span, .lg-aside .legal-toc a:hover span { color: var(--electric); }
.lg-aside .legal-toc a.is-on { font-weight: 620; }
.lg-aside__mail { display: inline-flex; align-items: center; gap: .5rem; margin-top: .25rem; padding: .7rem .9rem; border-radius: 14px; background: var(--card); box-shadow: 0 0 0 1px var(--line); font-size: var(--fs-xs); font-weight: 600; color: var(--ink-2); transition: box-shadow .25s var(--ease-out), color .25s; }
.lg-aside__mail .i { width: 1rem; height: 1rem; color: var(--electric); }
.lg-aside__mail:hover { color: var(--electric); box-shadow: 0 0 0 1.5px var(--electric); }

/* Índice desplegable (celular y tableta) */
.lg-mtoc { margin-bottom: .5rem; border-radius: var(--r-card); background: var(--card); box-shadow: 0 0 0 1px var(--line), var(--shadow-1); }
.lg-mtoc summary { list-style: none; display: flex; align-items: center; gap: .65rem; min-height: 56px; padding: .75rem 1.1rem; font-weight: 650; cursor: pointer; }
.lg-mtoc summary::-webkit-details-marker { display: none; }
.lg-mtoc summary .i { color: var(--electric); }
.lg-mtoc summary span { margin-left: auto; font-size: var(--fs-xs); font-weight: 520; color: var(--ink-2); }
.lg-mtoc summary::after { content: ""; flex: none; width: 9px; height: 9px; margin: 0 .2rem 0 .35rem; border-right: 2px solid var(--ink-2); border-bottom: 2px solid var(--ink-2); transform: rotate(45deg) translateY(-3px); transition: transform .3s var(--ease-out); }
.lg-mtoc[open] summary::after { transform: rotate(225deg) translateY(-3px); }
.lg-mtoc__list { display: grid; padding: 0 .6rem .6rem !important; margin: 0; border-top: 1px solid var(--line); }
.lg-mtoc__list a { display: grid; grid-template-columns: 1.6rem minmax(0, 1fr); align-items: center; min-height: 46px; padding: .5rem .55rem; border-radius: 10px; font-size: var(--fs-small); color: var(--ink-2); }
.lg-mtoc__list a:hover { background: var(--paper); color: var(--ink); }
.lg-mtoc__list b { color: var(--electric); font-weight: 650; font-variant-numeric: tabular-nums; }

/* ---------- Texto legal ---------- */
.legal.lg-legal { max-width: none; }
.lg-sec { padding-block: clamp(1.9rem, 1.4rem + 1.6vw, 2.75rem); border-top: 1px solid var(--line); }
.lg-sec:first-child { border-top: 0; padding-top: 1rem; }
.legal .lg-sec h2 { display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); align-items: baseline; margin: 0 0 1rem; font-family: var(--font-display); font-weight: 600; letter-spacing: -.005em; word-spacing: .09em; text-wrap: balance; }
.lg-n { color: var(--electric); font-variant-numeric: tabular-nums; }
@media (min-width: 1024px) { .legal .lg-sec h2 { grid-template-columns: 2.5rem minmax(0, 1fr); margin-left: -2.5rem; } }
.legal.lg-legal ul:not([class]) { list-style: none; padding-left: 0; }
.legal.lg-legal ul:not([class]) > li { position: relative; padding-left: 1.35rem; }
.legal.lg-legal ul:not([class]) > li::before { content: ""; position: absolute; left: .2rem; top: .7em; width: 6px; height: 6px; border-radius: 50%; background: var(--electric); }
.legal.lg-legal a { word-break: break-word; }

/* Apoyos visuales (la redacción es la del aviso) */
.legal .lg-callout { display: grid; grid-template-columns: 2.5rem minmax(0, 1fr); gap: .9rem; align-items: start; margin-top: 1.25rem; padding: 1.1rem 1.2rem; border-radius: var(--r-card); background: var(--electric-050); box-shadow: inset 0 0 0 1px rgba(0, 85, 255, .14); color: var(--ink); }
.lg-callout .i-box { width: 2.5rem; height: 2.5rem; border-radius: 12px; display: grid; place-items: center; background: #fff; color: var(--electric); box-shadow: 0 6px 14px -8px rgba(0, 38, 128, .45); }
@media (max-width: 559px) {
  /* En celular el icono va arriba: la columna de texto ya no queda de 250 px */
  .legal .lg-callout { grid-template-columns: minmax(0, 1fr); gap: .7rem; padding: 1rem 1.05rem 1.1rem; }
  .lg-callout .i-box { width: 2.25rem; height: 2.25rem; border-radius: 11px; }
}
.lg-sec h2 + .lg-callout { margin-top: 0; }
.lg-callout + p { margin-top: 1.1rem !important; }

.lg-groups { display: grid; gap: .9rem; margin: 0 0 1.25rem; }
@media (min-width: 640px) { .lg-groups { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.lg-group { padding: 1.15rem 1.25rem; border-radius: var(--r-card); background: var(--card); box-shadow: 0 0 0 1px var(--line); }
.lg-group--primary { box-shadow: 0 0 0 1.5px var(--electric), var(--shadow-2); }
.lg-group ul { margin-bottom: 0 !important; }
.lg-group p { color: var(--ink) !important; }

.lg-checklist { list-style: none; padding: 0 !important; display: grid; gap: .55rem !important; }
.lg-checklist li { display: grid; grid-template-columns: 1.4rem minmax(0, 1fr); gap: .7rem; padding: .75rem .95rem; border-radius: 14px; background: var(--card); box-shadow: 0 0 0 1px var(--line); line-height: 1.5 !important; }
.lg-checklist li::before { content: ""; width: 1.4rem; height: 1.4rem; margin-top: .1rem; border-radius: 999px; background: var(--electric-050) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230055FF' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 60% no-repeat; }

/* Derechos ARCO: cuatro letras (refuerzo visual; el texto de arriba es el que cuenta) */
.lg-arco { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: 1.35rem 0 1.5rem; }
@media (min-width: 560px) { .lg-arco { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.lg-arco > span { position: relative; overflow: hidden; isolation: isolate; display: grid; gap: .1rem; align-content: start; padding: 1rem 1rem 1.1rem; border-radius: var(--r-card); background: linear-gradient(165deg, #0B2260, var(--night) 70%); color: #fff; box-shadow: 0 18px 34px -22px rgba(0, 38, 128, .8); }
.lg-arco > span::before { content: ""; position: absolute; z-index: -1; width: 9rem; height: 9rem; right: -4rem; top: -4.5rem; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 85, 255, .65), rgba(0, 85, 255, 0)); }
.lg-arco b { font-family: var(--font-display); font-size: clamp(2.6rem, 2.1rem + 1.6vw, 3.4rem); font-weight: 600; line-height: .9; letter-spacing: -.02em; color: var(--sky); margin-bottom: .45rem; }
.lg-arco i { font-style: normal; font-weight: 650; font-size: 1rem; color: #fff; }
.lg-arco small { font-size: var(--fs-small); line-height: 1.3; color: rgba(255, 255, 255, .72); }
.motion-ready .lg-arco[data-reveal]:not(.is-in) { opacity: 1; transform: none; }
.motion-ready .lg-arco[data-reveal] > span { transition: opacity .7s var(--ease-out), transform .9s var(--ease-out); transition-delay: calc(var(--i, 0) * 90ms); }
.motion-ready .lg-arco[data-reveal]:not(.is-in) > span { opacity: 0; transform: translateY(18px) scale(.96); }

/* =====================================================================
   v3 — ¿Dudas sobre tus datos?: banda oscura a todo lo ancho con el escudo 3D
   ===================================================================== */
.lg-body { padding-bottom: calc(var(--space-section) * .75 + 2.5rem); }
/* Oscura sobre el pie (también oscuro): termina como panel redondeado con filo de luz, sin corte plano */
.lg-help { overflow: clip; z-index: 2; margin-bottom: -2.5rem; padding-bottom: calc(var(--space-section) + 2.5rem); border-radius: 2.5rem; box-shadow: 0 -30px 60px -40px rgba(4, 11, 32, .45), inset 0 -1px 0 rgba(143, 182, 255, .2), 0 60px 90px -50px rgba(0, 0, 0, .9); }
@media (max-width: 759px) { .lg-help { margin-bottom: -1.5rem; padding-bottom: calc(var(--space-section) + 1.5rem); border-radius: 1.5rem; } }
.lg-help__grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 2.5rem; align-items: center; }
@media (min-width: 1024px) { .lg-help__grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(3rem, 1rem + 5vw, 6.5rem); } }
.lg-help__copy { display: grid; gap: 1.2rem; justify-items: start; }
.lg-help__icon { width: 3.25rem; height: 3.25rem; border-radius: 17px; display: grid; place-items: center; background: rgba(143, 182, 255, .14); color: var(--sky); box-shadow: inset 0 0 0 1px rgba(143, 182, 255, .25); }
.lg-help__icon .i { width: 1.45rem; height: 1.45rem; }
.lg-help .t-d2 { max-width: 13ch; }
.lg-help__text { max-width: 50ch; }
.lg-help__text .link { word-break: break-word; }
.lg-nowrap { white-space: nowrap; }
.lg-help__ctas { margin-top: .4rem; }
@media (max-width: 559px) { .lg-help__ctas, .lg-help__ctas .btn { width: 100%; } }
.lg-help__status { min-height: 1.4em; font-size: var(--fs-small); font-weight: 600; color: var(--sky); }
.lg-copy.is-done { box-shadow: inset 0 0 0 1.5px var(--sky); color: var(--sky); }

.lg-help__visual { position: relative; display: none; }
@media (min-width: 760px) { .lg-help__visual { display: block; width: min(100%, 23rem); justify-self: center; } }
.lg-help__halo { position: absolute; inset: 6% -16% -4%; border-radius: 50%; background: radial-gradient(closest-side, rgba(0, 85, 255, .5), rgba(0, 85, 255, 0) 72%); pointer-events: none; }
.lg-help__frame { position: relative; margin: 0; aspect-ratio: 4 / 5; border-radius: 30px; overflow: hidden; background: var(--night); box-shadow: inset 0 0 0 1px rgba(143, 182, 255, .26), 0 60px 110px -40px rgba(0, 30, 150, .95); transition: transform .8s var(--ease-out); }
.lg-help__frame img { width: 100%; height: 100%; object-fit: cover; }
.lg-help__chip { position: absolute; z-index: 2; }
.lg-help__chip--a { left: -2.5rem; top: 14%; }
.lg-help__chip--b { right: -2rem; bottom: 12%; }
@media (max-width: 1023px) { .lg-help__chip--a { left: -1rem; } .lg-help__chip--b { right: -1rem; } }

/* =====================================================================
   v3 — Celular: los resúmenes se deslizan de lado (página más corta)
   ===================================================================== */
@media (max-width: 759px) {
  /* Lo esencial: cuatro tarjetas de vidrio en una fila deslizable */
  .lg-essence { margin-top: .5rem; }
  .lg-essence__card { padding: 0; background: none; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .lg-essence__title { padding-right: 6rem; margin-bottom: .9rem; }
  .lg-essence__list { display: flex; gap: .65rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: .15rem var(--gutter) .5rem; scroll-padding-inline: var(--gutter); }
  .lg-essence__list::-webkit-scrollbar { display: none; }
  .lg-essence__list li { flex: none; width: min(72vw, 270px); scroll-snap-align: start; }
  .lg-essence__list li + li { border-top: 0; }
  .lg-essence__list a { height: 100%; margin: 0; grid-template-columns: minmax(0, 1fr); align-content: start; gap: .7rem; padding: 1rem 1.05rem 1.1rem; border-radius: 20px; background: linear-gradient(160deg, rgba(24, 46, 110, .62), rgba(6, 16, 46, .72) 62%); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .13), 0 24px 44px -30px rgba(0, 0, 0, .8); }
  .lg-essence__list .chev { display: none; }
  .lg-essence__note { margin-top: .5rem; }
  .lg-seal { width: 5.25rem; height: 5.25rem; top: -1.6rem; right: 0; }

  /* Finalidades: dos tarjetas lado a lado deslizables */
  .lg-groups { display: flex; gap: .75rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin-inline: calc(var(--gutter) * -1); padding: .25rem var(--gutter) .6rem; scroll-padding-inline: var(--gutter); }
  .lg-groups::-webkit-scrollbar { display: none; }
  .lg-group { flex: none; width: min(84vw, 330px); scroll-snap-align: start; }

  /* ARCO: las cuatro letras en una sola fila */
  .lg-arco { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .45rem; }
  .lg-arco > span { padding: .8rem .55rem .85rem; }
  .lg-arco b { font-size: 2.2rem; margin-bottom: .3rem; }
  .lg-arco i { font-size: .82rem; }
  .lg-arco small { display: none; }
}
@media (max-width: 759px) { .lg-essence .lg-essence__list { padding: .15rem var(--gutter) .5rem; } }