/* =========================================================================
   Guía para pacientes v2 — recreación de prototipo/Guia para Pacientes v2.dc.html
   (interactiva, con modos consulta/estudio). Todo scopeado bajo .pg-guia;
   los var(--*) resuelven en tokens.css.
   ========================================================================= */

/* Encabezado con corriente animada y "río" de líneas */
.pg-guia [hidden] { display: none !important; }

/* =========================================================================
   Capa de dinamismo v3: barra de progreso de lectura, aparición suave al
   hacer scroll (.g-rev/.on con fallback en guia.js), cascada de tarjetas
   (.g-st), entrada del hero (.pg-guia__hero-st) y línea del stepper (.rline).
   prefers-reduced-motion apaga todo.
   ========================================================================= */
.pg-guia__progreso { position: fixed; top: 0; left: 0; height: 3px; width: 0; background: var(--oc-orange-600); z-index: 1200; transition: width 140ms linear; border-radius: 0 2px 2px 0; }
.pg-guia .g-rev { opacity: 0; transform: translateY(12px); transition: opacity 480ms var(--ease-out), transform 480ms var(--ease-out); }
.pg-guia .g-rev.on { opacity: 1; transform: none; }
@keyframes pg-guia-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.pg-guia .g-rev .g-st { opacity: 0; }
.pg-guia .g-rev.on .g-st { animation: pg-guia-up 520ms var(--ease-out) both; }
.pg-guia .g-rev.on .g-st:nth-child(1) { animation-delay: 40ms; }
.pg-guia .g-rev.on .g-st:nth-child(2) { animation-delay: 150ms; }
.pg-guia .g-rev.on .g-st:nth-child(3) { animation-delay: 260ms; }
.pg-guia .g-rev.on .g-st:nth-child(4) { animation-delay: 370ms; }
.pg-guia .g-rev.on .g-st:nth-child(5) { animation-delay: 480ms; }
.pg-guia .g-rev .rline { transform: scaleX(0); transform-origin: left; transition: transform 900ms var(--ease-out) 420ms; }
.pg-guia .g-rev.on .rline { transform: scaleX(1); }
.pg-guia__hero-st > * { opacity: 0; animation: pg-guia-up 560ms var(--ease-out) both; }
.pg-guia__hero-st > *:nth-child(1) { animation-delay: 40ms; }
.pg-guia__hero-st > *:nth-child(2) { animation-delay: 120ms; }
.pg-guia__hero-st > *:nth-child(3) { animation-delay: 200ms; }
.pg-guia__hero-st > *:nth-child(4) { animation-delay: 280ms; }
.pg-guia__hero-st > *:nth-child(5) { animation-delay: 360ms; }
.pg-guia__hero-st > *:nth-child(6) { animation-delay: 440ms; }
@media (prefers-reduced-motion: reduce) {
	.pg-guia .g-rev { opacity: 1; transform: none; transition: none; }
	.pg-guia .g-st, .pg-guia__hero-st > * { opacity: 1 !important; animation: none !important; }
	.pg-guia .rline { transform: none !important; transition: none !important; }
	.pg-guia__progreso { transition: none; }
}
@keyframes pg-guia-flujo { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }
.pg-guia__hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--border); background: var(--neutral-0); }
.pg-guia__corriente { position: absolute; top: -35%; bottom: -35%; left: 0; width: 200%; background: radial-gradient(ellipse 26% 55% at 14% 32%, rgba(255,232,214,0.8) 0%, rgba(255,232,214,0) 70%), radial-gradient(ellipse 20% 45% at 38% 62%, rgba(255,244,234,0.95) 0%, rgba(255,244,234,0) 70%), radial-gradient(ellipse 26% 55% at 64% 32%, rgba(255,232,214,0.8) 0%, rgba(255,232,214,0) 70%), radial-gradient(ellipse 20% 45% at 88% 62%, rgba(255,244,234,0.95) 0%, rgba(255,244,234,0) 70%); pointer-events: none; animation: pg-guia-flujo 55s linear infinite; }
.pg-guia__rio { position: absolute; bottom: 4px; left: 0; width: 200%; height: 44px; color: var(--oc-orange); pointer-events: none; animation: pg-guia-flujo 80s linear infinite; }
@media (prefers-reduced-motion: reduce) { .pg-guia__corriente, .pg-guia__rio { animation: none; } }
.pg-guia__hero-inner { position: relative; max-width: 1272px; margin: 0 auto; padding: 64px 64px 48px; display: flex; flex-direction: column; gap: 14px; }
.pg-guia__eyebrow { margin: 0; color: var(--oc-orange-600); }
.pg-guia__titulo { font-family: var(--font-display); font-size: 40px; font-weight: 700; color: var(--navy); margin: 0; letter-spacing: -0.02em; }
.pg-guia__bajada { font-size: 17px; line-height: 1.65; color: var(--fg-2); margin: 0; max-width: 66ch; }
/* Nota única de borrador (consolidada, decisión UX 2026-07-15) */
.pg-guia__borrador-linea { margin: 0; }
.pg-guia__borrador { display: inline-flex; align-items: center; font-size: 12px; font-weight: 600; color: var(--fg-3); background: var(--bg-muted); border: 1px dashed var(--border-strong); border-radius: 999px; padding: 4px 12px; }

/* Fork del tipo de visita (UNA decisión en el encabezado) */
.pg-guia__fork { display: flex; flex-direction: column; gap: 12px; margin-top: 10px; }
.pg-guia__fork-fila { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pg-guia__fork-label { font-size: 13.5px; font-weight: 600; color: var(--fg-3); margin-right: 4px; }
/* Chip-toggle genérico (tipo de visita, previsión, GES, sede) */
.pg-guia__chip { font-family: inherit; font-size: 13.5px; font-weight: 600; color: var(--fg-2); background: var(--neutral-0); border: 1px solid var(--border-strong); border-radius: 999px; padding: 7px 16px; cursor: pointer; transition: background 120ms var(--ease-standard), color 120ms var(--ease-standard); }
.pg-guia__chip[aria-pressed="true"] { color: #fff; background: var(--navy); border-color: var(--navy); }

/* Aviso del modo estudio — panel teal Acerey */
.pg-guia__aviso-estudio { display: flex; flex-direction: column; gap: 10px; background: rgba(24, 147, 177, 0.07); border: 1px solid rgba(24, 147, 177, 0.3); border-radius: var(--radius-lg); padding: 18px 22px; max-width: 880px; }
.pg-guia__aviso-estudio[hidden] { display: none; }
.pg-guia__aviso-estudio-titulo { font-size: 15px; font-weight: 600; color: var(--navy); margin: 0; }
.pg-guia__aviso-estudio-texto { font-size: 14.5px; line-height: 1.6; color: var(--fg-2); margin: 0; max-width: 72ch; }
.pg-guia__aviso-estudio-enlaces { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font-size: 14px; font-weight: 600; }
.pg-guia__aviso-estudio-enlaces a { color: var(--ac-teal-700); }

/* Tarjeta «cómo funciona» comprimida a una línea */
.pg-guia__como-funciona { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; background: var(--neutral-0); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 16px 22px; margin-top: 8px; max-width: 900px; }
.pg-guia__como-funciona p { font-size: 15px; line-height: 1.55; color: var(--fg-2); margin: 0; }
.pg-guia__como-funciona p strong { font-weight: 600; color: var(--navy); }
.pg-guia__como-funciona > a { font-size: 13.5px; font-weight: 600; color: var(--oc-orange-600); white-space: nowrap; }

/* Banner-intro con el reel — tarjeta navy; bloque de texto en vidrio oscuro (§7) */
.pg-guia__video { padding: 44px 64px 8px; background: var(--neutral-0); }
.pg-guia__video-inner { max-width: 1272px; margin: 0 auto; background: var(--navy); border-radius: var(--radius-xl); display: grid; grid-template-columns: 280px 1fr; gap: 64px; align-items: center; padding: 40px 56px; }
.pg-guia__video-col { display: flex; flex-direction: column; gap: 10px; }
.pg-guia__reel-pie { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 13.5px; margin: 0; }
.pg-guia__reel-pie span { color: rgba(255, 255, 255, 0.6); }
.pg-guia__reel-pie a { font-weight: 600; color: var(--oc-orange); white-space: nowrap; }
.pg-guia__reel-pie a:hover { color: #FFB380; }
.pg-guia__video-texto { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; background: linear-gradient(165deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.05)); border: 1px solid rgba(255, 255, 255, 0.18); border-radius: var(--radius-lg); padding: 26px 30px; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 10px 28px -14px rgba(0, 0, 0, 0.4); }
.pg-guia__video-eyebrow { margin: 0; color: var(--oc-orange); }
.pg-guia__video-texto h2 { font-size: 26px; font-weight: 700; color: #fff; margin: 0; letter-spacing: -0.01em; }
.pg-guia__video-texto p { font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, 0.75); margin: 0; max-width: 52ch; }

/* Layout de dos columnas: índice lateral en tarjeta + contenido */
.pg-guia__layout { max-width: 1272px; margin: 0 auto; display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 56px; padding: 56px 64px; align-items: start; }
.pg-guia__indice { display: flex; flex-direction: column; gap: 2px; font-size: 14px; position: sticky; top: 98px; background: var(--neutral-0); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 16px 14px; }
.pg-guia__indice-cab { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 10px; padding: 0 12px 0 0; }
.pg-guia__indice-titulo { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3); margin: 0; }
.pg-guia__indice-pct { font-family: var(--font-mono); font-size: 11px; color: var(--fg-3); }
.pg-guia__indice > a { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: var(--radius-sm); background: transparent; color: var(--fg-2); font-weight: 400; }
.pg-guia__indice > a:hover { background: var(--bg-muted); }
.pg-guia__indice > a.activo { background: var(--oc-orange-50); color: var(--oc-orange-600); font-weight: 600; }
/* Punto por sección: se enciende naranjo al alcanzarla en el scroll */
.pg-guia__nav-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: transparent; border: 1.5px solid var(--border-strong); transition: background 240ms var(--ease-standard), border-color 240ms var(--ease-standard); }
.pg-guia__indice > a.alcanzado .pg-guia__nav-dot { background: var(--oc-orange); border-color: var(--oc-orange); }
.pg-guia__indice-kicker { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3); margin: 0 0 6px; }
.pg-guia__indice-kicker--suguia { padding: 0 12px; margin: 0 0 8px; }
.pg-guia__indice-sep { height: 1px; background: var(--divider); margin: 10px 4px; }
.pg-guia__indice-sep--abajo { margin: 12px 4px; }
.pg-guia__indice-guia { padding: 0 12px; display: flex; flex-direction: column; gap: 8px; }
.pg-guia__indice-check { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--fg-2); }
.pg-guia__indice-frac { font-family: var(--font-mono); font-size: 11.5px; }
.pg-guia__indice-estado { font-size: 13px; line-height: 1.6; color: var(--fg-2); margin: 0; }
/* Barra de progreso del checklist (índice + paso 2) */
.pg-guia__barra { height: 5px; background: var(--bg-muted); border-radius: 999px; overflow: hidden; }
.pg-guia__barra-relleno { height: 100%; width: 0; background: var(--oc-orange); border-radius: 999px; transition: width 320ms var(--ease-standard); }
.pg-guia__barra--paso2 { flex: 1; max-width: 220px; }
.pg-guia__check-progreso { display: flex; align-items: center; gap: 12px; }

/* Selector de momento del paciente (en el índice) */
.pg-guia__momento { display: flex; flex-direction: column; gap: 8px; margin-bottom: 12px; }
.pg-guia__contenido { display: flex; flex-direction: column; gap: 44px; }
.pg-guia__seccion { display: flex; flex-direction: column; gap: 16px; scroll-margin-top: 98px; }
.pg-guia__seccion-cab { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pg-guia__seccion-titulo { font-size: 26px; font-weight: 700; color: var(--navy); margin: 0; letter-spacing: -0.01em; }
.pg-guia__intro { font-size: 15px; line-height: 1.6; color: var(--fg-2); margin: 0; max-width: 66ch; }
.pg-guia__nota-suave { font-size: 13.5px; color: var(--fg-3); margin: 0; }
.pg-guia__nota-progreso { font-size: 13px; color: var(--fg-3); margin: 0; }

/* Empiece aquí — pasos numerados */
.pg-guia__pasos { display: flex; flex-direction: column; gap: 12px; }
.pg-guia__paso { display: grid; grid-template-columns: 44px 1fr auto; gap: 18px; align-items: center; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px 24px; }
.pg-guia__paso--lista { grid-template-columns: 44px 1fr; align-items: start; }
.pg-guia__paso--simple { grid-template-columns: 44px 1fr; }
.pg-guia__numero { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; background: var(--oc-orange-50); font-family: var(--font-mono); font-size: 15px; font-weight: 500; color: var(--oc-orange-600); }
.pg-guia__numero--chico { width: 38px; height: 38px; font-size: 14px; }
.pg-guia__paso-cuerpo { display: flex; flex-direction: column; gap: 4px; }
.pg-guia__paso-cuerpo--lista { gap: 10px; }
.pg-guia__paso-cuerpo h3 { font-size: 17px; font-weight: 600; color: var(--navy); margin: 0; letter-spacing: normal; }
.pg-guia__paso-cuerpo p { font-size: 15px; line-height: 1.55; color: var(--fg-2); margin: 0; }
.pg-guia__cta-hora { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: #fff; background: var(--oc-orange-600); padding: 10px 16px; border-radius: var(--radius-md); white-space: nowrap; }
.pg-guia__cta-hora:hover { background: var(--oc-orange-700); color: #fff; }
/* Paso 1 marcable (circuito de guiado v3) */
.pg-guia__paso1-acciones { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.pg-guia__paso1-toggle { font-family: inherit; font-size: 12.5px; font-weight: 600; color: var(--fg-3); background: none; border: none; padding: 2px 4px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.pg-guia__paso1-toggle:hover { color: var(--navy); }
.pg-guia__paso1-nudge { font-size: 14px; font-weight: 600; color: var(--success); margin: 4px 0 0; }
.pg-guia__paso[data-guia-paso1] { transition: border-color 240ms var(--ease-standard); }
.pg-guia__paso[data-guia-paso1] .pg-guia__numero { transition: background 240ms var(--ease-standard); }
.pg-guia__paso.es-hecho { border-color: var(--success); }
.pg-guia__paso.es-hecho .pg-guia__numero { background: var(--success); color: #fff; }
.pg-guia__callout { display: flex; align-items: flex-start; gap: 12px; background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 14px 16px; }
.pg-guia__callout > svg { flex: none; margin-top: 2px; }
.pg-guia__callout p { font-size: 14px; line-height: 1.6; color: var(--fg-2); margin: 0; }
.pg-guia__callout p a { color: var(--oc-orange-600); font-weight: 600; }
.pg-guia__llegada { display: flex; align-items: center; gap: 14px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--bg-subtle); padding: 16px 24px; flex-wrap: wrap; }
.pg-guia__llegada > svg { flex: none; }
.pg-guia__llegada p { font-size: 15px; color: var(--fg-2); margin: 0; flex: 1; min-width: 240px; }
.pg-guia__llegada-enlaces { display: flex; align-items: center; gap: 16px; font-size: 14.5px; font-weight: 600; }
.pg-guia__llegada-enlaces a { color: var(--oc-orange-600); white-space: nowrap; }

/* Ítem marcable (checklist «qué llevar» + preguntas para el médico) */
.pg-guia__checklist { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pg-guia__marcable { display: flex; align-items: center; gap: 11px; text-align: left; font-family: inherit; font-size: 14.5px; line-height: 1.4; color: var(--fg-2); background: var(--neutral-0); border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: 10px 13px; cursor: pointer; transition: background 120ms var(--ease-standard), border-color 120ms var(--ease-standard); }
.pg-guia__caja { flex: none; display: flex; align-items: center; justify-content: center; width: 21px; height: 21px; border-radius: 6px; background: var(--neutral-0); border: 1.5px solid var(--border-strong); transition: background 120ms var(--ease-standard); }
.pg-guia__caja svg { opacity: 0; transition: opacity 120ms var(--ease-standard); }
.pg-guia__marcable[aria-pressed="true"] { color: var(--fg-3); background: var(--bg-subtle); border-color: var(--border); }
.pg-guia__marcable[aria-pressed="true"] .pg-guia__caja { background: var(--success); border-color: var(--success); }
.pg-guia__marcable[aria-pressed="true"] .pg-guia__caja svg { opacity: 1; }

/* Cobertura — panel teal de estudio y orientador de consulta */
.pg-guia__cob-estudio { display: flex; flex-direction: column; gap: 10px; border: 1px solid rgba(24, 147, 177, 0.3); background: rgba(24, 147, 177, 0.07); border-radius: var(--radius-lg); padding: 22px 24px; }
.pg-guia__cob-estudio[hidden] { display: none; }
.pg-guia__cob-estudio h3 { font-size: 17px; font-weight: 600; color: var(--navy); margin: 0; letter-spacing: normal; }
.pg-guia__cob-estudio p { font-size: 15px; line-height: 1.6; color: var(--fg-2); margin: 0; max-width: 72ch; }
.pg-guia__enlace-teal { font-size: 14px; font-weight: 600; color: var(--ac-teal-700); }
.pg-guia__orientador { display: flex; flex-direction: column; gap: 18px; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 22px 24px; }
.pg-guia__orientador[hidden] { display: none; }
/* Nota GES como details (v3): hoy con `open` — la variante plegada por defecto
   está propuesta por el prototipo y pendiente de validación del equipo. */
.pg-guia__ges-informativo { border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--bg-subtle); }
.pg-guia__ges-informativo > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 22px; }
.pg-guia__ges-informativo > summary::-webkit-details-marker { display: none; }
.pg-guia__ges-titulo { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 600; color: var(--navy); }
.pg-guia__ges-titulo svg { flex: none; }
.pg-guia__ges-cuerpo { display: flex; flex-direction: column; gap: 10px; padding: 0 22px 18px; }
.pg-guia__ges-cuerpo p { margin: 0; color: var(--fg-2); font-size: 14.5px; line-height: 1.6; max-width: 72ch; }
.pg-guia__ges-cuerpo strong { color: var(--navy); }
.pg-guia__ges-cuerpo a { color: var(--oc-orange-600); font-size: 14px; font-weight: 600; }
/* Chevron compartido de los details (GES + glosario) */
.pg-guia details .pg-guia__chev { transition: transform 200ms ease; flex: none; }
.pg-guia details[open] > summary .pg-guia__chev { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { .pg-guia details .pg-guia__chev { transition: none; } }
.pg-guia__orientador-pregunta { display: flex; flex-direction: column; gap: 10px; }
.pg-guia__orientador-pregunta[hidden] { display: none; }
.pg-guia__orientador-pregunta p { font-size: 15px; font-weight: 600; color: var(--navy); margin: 0; }
.pg-guia__chips { display: flex; gap: 8px; flex-wrap: wrap; }
.pg-guia__orientador-resp { display: flex; flex-direction: column; gap: 10px; background: var(--bg-subtle); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 16px 18px; }
.pg-guia__orientador-resp[hidden] { display: none; }
.pg-guia__orientador-resp p { font-size: 15px; line-height: 1.6; color: var(--fg-2); margin: 0; }
.pg-guia__orientador-resp p[hidden] { display: none; }
.pg-guia__orientador-enlaces { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; font-size: 14px; font-weight: 600; }
.pg-guia__orientador-enlaces a { color: var(--oc-orange-600); }

/* Ruta después de la consulta / de postular */
/* Ruta como stepper conectado (v3): círculos numerados con borde naranjo
   unidos por una línea que se «dibuja» (.rline) al revelar la sección. */
.pg-guia__ruta { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
.pg-guia__ruta[hidden] { display: none; }
.pg-guia__ruta-paso { display: flex; flex-direction: column; gap: 10px; padding: 6px 18px 6px 0; }
.pg-guia__ruta-fila { display: flex; align-items: center; }
.pg-guia__ruta-circulo { flex: none; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 50%; background: var(--oc-orange-50); border: 1.5px solid var(--oc-orange); font-family: var(--font-mono); font-size: 14px; font-weight: 500; color: var(--oc-orange-600); }
.pg-guia__ruta-linea { flex: 1; height: 1.5px; background: var(--border-strong); margin-left: 10px; }
.pg-guia__ruta-paso h3 { font-size: 16px; font-weight: 600; color: var(--navy); margin: 6px 0 0; letter-spacing: normal; }
.pg-guia__ruta-paso p { font-size: 14.5px; line-height: 1.6; color: var(--fg-2); margin: 0; }

/* Preguntas frecuentes — buscador + acordeones button[aria-expanded] + región */
.pg-guia__faq-buscador { position: relative; }
.pg-guia__faq-buscador > svg { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); pointer-events: none; }
.pg-guia__faq-buscador input { width: 100%; box-sizing: border-box; font-family: inherit; font-size: 15px; color: var(--navy); background: var(--neutral-0); border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: 12px 16px 12px 42px; }
.pg-guia__faq-seccion { display: flex; flex-direction: column; gap: 16px; }
.pg-guia__faq-seccion[hidden] { display: none; }
.pg-guia__faq-kicker { font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3); margin: 4px 0 0; }
.pg-guia__faq-kicker--sep { margin: 8px 0 0; }
.pg-guia__faq-grupo { display: flex; flex-direction: column; border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.pg-guia__faq-item + .pg-guia__faq-item { border-top: 1px solid var(--divider); }
.pg-guia__faq-item[hidden] { display: none; }
.pg-guia__faq-encabezado { margin: 0; }
.pg-guia__faq-boton { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 18px 24px; background: none; border: none; cursor: pointer; font-family: inherit; text-align: left; }
.pg-guia__faq-boton > span { font-size: 16px; font-weight: 500; color: var(--navy); }
.pg-guia__chev { flex: none; transition: transform 200ms ease; }
.pg-guia__faq-boton[aria-expanded="true"] .pg-guia__chev { transform: rotate(180deg); }
.pg-guia__faq-region p { font-size: 15px; line-height: 1.65; color: var(--fg-2); margin: 0; padding: 0 24px 20px; }
.pg-guia__faq-region p a { color: var(--oc-orange-600); font-weight: 600; }
.pg-guia__faq-region[hidden] { display: none; }
.pg-guia__faq-vacio { font-size: 15px; color: var(--fg-2); margin: 0; }
.pg-guia__faq-vacio[hidden] { display: none; }

/* Sus preguntas para el médico */
.pg-guia__preguntas { display: flex; flex-direction: column; gap: 8px; }
.pg-guia__preguntas-lista { display: flex; flex-direction: column; gap: 8px; }
.pg-guia__preguntas-lista[hidden] { display: none; }
.pg-guia__propias { display: flex; flex-direction: column; gap: 8px; }
.pg-guia__propias:empty { display: none; }
.pg-guia__propia { display: flex; align-items: center; gap: 11px; border: 1px solid var(--oc-orange-600); border-radius: var(--radius-md); padding: 10px 13px; font-size: 14.5px; line-height: 1.4; color: var(--navy); background: var(--oc-orange-50); }
.pg-guia__propia > span { flex: 1; }
.pg-guia__propia-quitar { display: flex; align-items: center; justify-content: center; width: 26px; height: 26px; flex: none; background: none; border: none; border-radius: 50%; cursor: pointer; color: var(--fg-3); }
.pg-guia__propia-quitar:hover { background: rgba(32, 46, 71, 0.08); color: var(--navy); }
.pg-guia__agregar { display: flex; gap: 8px; }
.pg-guia__agregar input { flex: 1; min-width: 0; font-family: inherit; font-size: 14.5px; color: var(--navy); background: var(--neutral-0); border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: 10px 14px; }
.pg-guia__agregar button { font-family: inherit; font-size: 14px; font-weight: 600; color: var(--navy); background: var(--neutral-0); border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: 10px 18px; cursor: pointer; }
.pg-guia__agregar button:hover { background: var(--bg-muted); }
.pg-guia__franja { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.pg-guia__franja > a { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--oc-orange-600); white-space: nowrap; }

/* Glosario */
/* Glosario como términos plegables (v3): details en grilla de 2 columnas */
.pg-guia__glosario { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; align-items: start; }
.pg-guia__glosario[hidden] { display: none; }
.pg-guia__glosario-hint { font-size: 13.5px; color: var(--fg-3); margin: 0; }
.pg-guia__glosario-fuente { font-size: 13px; line-height: 1.5; color: var(--fg-3); margin: -2px 0 4px; }
.pg-guia__glosario-termino { border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--neutral-0); }
.pg-guia__glosario-termino > summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; }
.pg-guia__glosario-termino > summary::-webkit-details-marker { display: none; }
.pg-guia__glosario-termino > summary span { font-size: 15px; font-weight: 600; color: var(--navy); }
.pg-guia__glosario-termino > p { font-size: 14.5px; line-height: 1.6; color: var(--fg-2); margin: 0; padding: 0 18px 14px; }

/* Lleve su guía consigo */
.pg-guia__miguia { border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--bg-subtle); padding: 22px 24px; display: flex; flex-direction: column; gap: 16px; }
.pg-guia__miguia-sede { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pg-guia__miguia-sede p { font-size: 14.5px; font-weight: 600; color: var(--navy); margin: 0; }
.pg-guia__miguia-sede-nota { font-size: 13px; color: var(--fg-3); }
.pg-guia__miguia-sep { height: 1px; background: var(--divider); }
.pg-guia__miguia-resumen { display: flex; flex-direction: column; gap: 7px; font-size: 14.5px; color: var(--fg-2); }
.pg-guia__miguia-resumen > span { display: flex; align-items: center; gap: 9px; }
.pg-guia__miguia-resumen svg { flex: none; }
.pg-guia__miguia-acciones { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.pg-guia__miguia-wa { display: inline-flex; align-items: center; justify-content: center; gap: 10px; font-size: 15px; font-weight: 600; color: #fff; background: var(--oc-orange-600); padding: 13px 22px; border-radius: var(--radius-md); }
.pg-guia__miguia-wa:hover { background: var(--oc-orange-700); color: #fff; }
.pg-guia__miguia-pdf { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-family: inherit; font-size: 15px; font-weight: 600; color: var(--navy); background: var(--neutral-0); border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: 12px 20px; cursor: pointer; }
.pg-guia__miguia-pdf:hover { background: var(--bg-muted); }
.pg-guia__miguia-imprimir { font-family: inherit; font-size: 13.5px; font-weight: 600; color: var(--fg-3); background: none; border: none; padding: 6px 4px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.pg-guia__miguia-imprimir:hover { color: var(--navy); }
.pg-guia__miguia-pie { font-size: 13px; color: var(--fg-3); margin: 0; }
.pg-guia__miguia-incluir { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; line-height: 1.5; color: var(--fg-2); cursor: pointer; }
.pg-guia__miguia-incluir input { margin-top: 3px; accent-color: var(--oc-orange-600); }
.pg-guia__miguia-aviso { display: flex; flex-direction: column; gap: 4px; padding: 13px 15px; border: 1px solid var(--border-strong); border-radius: var(--radius-md); background: var(--neutral-0); font-size: 13.5px; line-height: 1.5; color: var(--fg-2); }
.pg-guia__miguia-aviso strong { color: var(--navy); }
.pg-guia__miguia-vista { border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--neutral-0); }
.pg-guia__miguia-vista summary { padding: 12px 14px; color: var(--navy); font-size: 14px; font-weight: 600; cursor: pointer; }
.pg-guia__miguia-vista pre { margin: 0; padding: 14px; border-top: 1px solid var(--border); max-height: 320px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; font: 12.5px/1.55 var(--font-mono); color: var(--fg-2); }
.pg-guia__miguia-borrar { font: inherit; font-size: 13.5px; font-weight: 600; color: var(--fg-3); background: none; border: none; padding: 6px 4px; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.pg-guia__miguia-borrar:hover { color: var(--navy); }

/* ¿Necesita ayuda? — banda final */
.pg-guia__ayuda { background: var(--bg-muted); border-top: 1px solid var(--border); scroll-margin-top: 98px; }
.pg-guia__ayuda-inner { max-width: 1272px; margin: 0 auto; display: flex; flex-direction: column; gap: 22px; padding: 40px 64px 48px; }
.pg-guia__ayuda-texto { display: flex; flex-direction: column; gap: 6px; }
.pg-guia__ayuda-texto h2 { font-size: 22px; font-weight: 700; color: var(--navy); margin: 0; }
.pg-guia__ayuda-texto p { font-size: 15px; color: var(--fg-2); margin: 0; max-width: 66ch; }
/* Selector de sede escalable (V2 §2): grilla auto-fit generada desde oc_sedes() */
.pg-guia__ayuda-sedes { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.pg-guia__sede { background: var(--neutral-0); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px 22px; display: flex; flex-direction: column; gap: 12px; }
.pg-guia__sede-nombre { font-size: 16px; font-weight: 600; color: var(--navy); margin: 0; }
.pg-guia__sede-wa { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-size: 14.5px; font-weight: 600; color: #fff; background: var(--oc-orange-600); padding: 11px 16px; border-radius: var(--radius-md); }
.pg-guia__sede-wa:hover { background: var(--oc-orange-700); color: #fff; }
.pg-guia__sede-tel { display: inline-flex; align-items: center; justify-content: center; gap: 9px; font-size: 14px; font-weight: 500; color: var(--navy); border: 1px solid var(--border-strong); background: var(--neutral-0); padding: 10px 16px; border-radius: var(--radius-md); }
.pg-guia__sede-tel:hover { background: var(--bg-subtle); color: var(--navy); }
.pg-guia__sede-fono { font-family: var(--font-mono); font-size: 13.5px; }

/* --- Responsive (V2 §6 + §8): índice → chips, select a ancho completo ------ */
@media (max-width: 900px) {
	.pg-guia__hero-inner { padding: 40px 20px 32px; }
	.pg-guia__titulo { font-size: 31px; }
	.pg-guia__como-funciona { flex-direction: column; align-items: flex-start; gap: 10px; }
	.pg-guia__aviso-estudio-enlaces { flex-direction: column; align-items: stretch; }
	.pg-guia__video { padding: 36px 20px 8px; }
	.pg-guia__video-inner { grid-template-columns: minmax(112px, 132px) minmax(0, 1fr); gap: 16px; padding: 18px; align-items: center; }
	.pg-guia__video-col { max-width: 132px; }
	.pg-guia__reel-pie span { display: none; }
	.pg-guia__reel-pie { justify-content: flex-start; font-size: 12px; }
	.pg-guia__video-texto { gap: 8px; padding: 16px; }
	.pg-guia__video-eyebrow { display: none; }
	.pg-guia__video-texto h2 { font-size: 20px; line-height: 1.2; }
	.pg-guia__video-texto p { font-size: 13.5px; line-height: 1.5; }
	.pg-guia__layout { grid-template-columns: 1fr; gap: 28px; padding: 36px 20px; }
	/* Índice «Su recorrido»: deja de ser sticky y pasa a fila de chips con
	   borde (v3, mismo patrón toc de la v1); el separador «Para sus dudas»
	   se oculta y el bloque «Su guía» ocupa el ancho completo. */
	.pg-guia__indice { position: static; top: auto; flex-direction: row; flex-wrap: wrap; gap: 8px; }
	.pg-guia__indice-cab { width: 100%; margin: 0; }
	.pg-guia__indice > a { border: 1px solid var(--border); }
	.pg-guia__indice > a.activo { border-color: var(--oc-orange-600); }
	.pg-guia__indice-kicker { display: none; }
	.pg-guia__indice-sep { display: none; }
	.pg-guia__indice-kicker--suguia { display: block; width: 100%; margin: 4px 0 0; }
	.pg-guia__indice-guia { width: 100%; padding: 0; }
	.pg-guia__paso { grid-template-columns: 44px 1fr; }
	.pg-guia__paso .pg-guia__paso1-acciones { grid-column: 1 / -1; align-items: stretch; }
	.pg-guia__paso .pg-guia__cta-hora { justify-content: center; }
	/* Tap targets ≥44px (v3): chips de modo y botón de texto del paso 1 */
	.pg-guia__fork-fila .pg-guia__chip { padding: 12px 20px; }
	.pg-guia__paso1-toggle { padding: 14px 8px; }
	.pg-guia__checklist { grid-template-columns: 1fr; }
	/* Stepper de la ruta: 1 columna, línea conectora oculta */
	.pg-guia__ruta { grid-template-columns: 1fr; gap: 16px; }
	.pg-guia__ruta-paso { padding: 0; }
	.pg-guia__ruta-linea { display: none; }
	.pg-guia__glosario { grid-template-columns: 1fr; }
	.pg-guia__franja { flex-direction: column; align-items: flex-start; gap: 10px; }
	.pg-guia__miguia-acciones { flex-direction: column; align-items: stretch; }
	.pg-guia__ayuda-inner { padding: 32px 20px; }
}

@media (max-width: 430px) {
	.pg-guia__video-inner { grid-template-columns: 112px minmax(0, 1fr); gap: 12px; padding: 14px; }
	.pg-guia__video-col { max-width: 112px; }
	.pg-guia__video-texto { padding: 12px; }
	.pg-guia__video-texto h2 { font-size: 18px; }
	.pg-guia__video-texto p { font-size: 12.75px; }
}
