/* PortSync V2.5 · prototipo «4 · Fusión» · inicio-secciones.css — Noticias y Preguntas frecuentes DENTRO del INICIO
   (doc 14 §W1: antes eran las subpáginas noticias.html y preguntas.html; van justo debajo de «12 puertos»).
   Orden en el <head>: portsync-tokens.css → tipografia.css → comun.css → inicio-tokens.css → inicio.css → inicio-secciones.css
   → pg-noticias.css → pg-preguntas.css. Aquí van el marco de las dos secciones y las pocas piezas «pg-*» que usan (avatar,
   enlace, segmento, botón redondo, pausa, texto fino): son las de pg-comun.css (de W2, que el INICIO no carga), con los
   mismos nombres y acotadas a estas dos secciones. Colores: solo roles (inicio-tokens.css, comun-tokens.css). */

.i-noticias, .i-preguntas { position: relative; padding: var(--i-seccion) var(--i-margen) 0; --pg-ease: cubic-bezier(.16, 1, .3, 1); }
.i-noticias [hidden], .i-preguntas [hidden] { display: none !important; }   /* «hidden» manda aunque una clase fije un display */
.i-noticias { scroll-margin-top: 96px; }
.i-preguntas { scroll-margin-top: 96px; }

/* ---------- piezas compartidas (acotadas) ---------- */
.i-noticias .pg-lede, .i-preguntas .pg-lede { max-width: 52ch; font-size: clamp(17px, 1.25vw, 20px); color: var(--c-tinta-2); text-wrap: pretty; }
.i-noticias .pg-h2, .i-preguntas .pg-h2 { font-size: var(--t-h2); line-height: 1.12; color: var(--c-tinta); text-wrap: balance; }
.i-noticias .pg-fino, .i-preguntas .pg-fino { font-size: 14px; line-height: 1.55; color: var(--c-tinta-2); max-width: 78ch; }   /* REV-FINAL: tinta-2, sobre vidrio y video la 3 quedaba bajo AA (3,8-4,3:1) */
.i-noticias .pg-texto, .i-preguntas .pg-texto { color: var(--c-tinta-2); max-width: 64ch; }
.i-noticias .pg-vidrio, .i-preguntas .pg-vidrio {
  position: relative; background: var(--c-tarjeta); border: 1px solid var(--c-tarjeta-borde); border-radius: 26px;
  box-shadow: inset 0 1px 0 var(--c-tarjeta-filo), var(--c-sombra-chica);
}
.i-noticias .pg-enlace, .i-preguntas .pg-enlace {
  color: var(--accent-ink); font-weight: 500; text-decoration: underline; text-decoration-thickness: 1px;
  text-underline-offset: 3px; text-decoration-color: color-mix(in srgb, currentColor 45%, transparent);
  transition: text-decoration-color var(--dur-rapida);
}
.i-noticias .pg-enlace:hover, .i-preguntas .pg-enlace:hover { text-decoration-color: currentColor; }
.i-noticias .pg-enlace--flecha, .i-preguntas .pg-enlace--flecha { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; text-decoration: none; }
.i-noticias .pg-enlace--flecha::after, .i-preguntas .pg-enlace--flecha::after { content: "→"; transition: transform .25s var(--ease-out); }
.i-noticias .pg-enlace--flecha:hover::after, .i-preguntas .pg-enlace--flecha:hover::after { transform: translateX(4px); }

.i-noticias .pg-avatar, .i-preguntas .pg-avatar {
  display: inline-grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%;
  background: var(--pg-avatar-ps); color: var(--pg-avatar-ps-tinta);
  font-size: 13px; font-weight: 600; letter-spacing: .04em; line-height: 1;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--blanco) 12%, transparent) inset;
}
.i-noticias .pg-avatar--otro, .i-preguntas .pg-avatar--otro { background: var(--pg-avatar-otro); color: var(--pg-avatar-otro-tinta); }
.i-noticias .pg-avatar--op, .i-preguntas .pg-avatar--op { background: var(--pg-avatar-op); color: var(--pg-avatar-op-tinta); }
.i-noticias .pg-avatar--ge, .i-preguntas .pg-avatar--ge { background: var(--pg-avatar-ge); color: var(--pg-avatar-ge-tinta); }

/* control segmentado de los filtros */
.i-noticias .pg-segmento {
  display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: var(--r-pill);
  background: var(--c-tarjeta); border: 1px solid var(--c-tarjeta-borde);
}
.i-noticias .pg-segmento button {
  min-height: 40px; padding: 0 16px; border-radius: var(--r-pill); border: 0; background: transparent; cursor: pointer;
  color: var(--c-tinta-2); font-size: 15px; font-weight: 500; white-space: nowrap;
  transition: background-color var(--dur-rapida), color var(--dur-rapida);
}
.i-noticias .pg-segmento button:hover { color: var(--c-tinta); background: var(--c-activo); }
.i-noticias .pg-segmento button[aria-pressed="true"] { background: var(--c-boton); color: var(--c-boton-tinta); }

/* botón redondo (anterior, siguiente) y de pausa */
.i-noticias .pg-redondo {
  display: inline-grid; place-items: center; width: 48px; height: 48px; flex: none; border-radius: 50%; cursor: pointer;
  border: 1px solid var(--c-linea-fuerte); background: var(--c-tarjeta); color: var(--c-tinta);
  transition: background-color var(--dur-rapida), border-color var(--dur-rapida), transform .25s var(--ease-out);
}
.i-noticias .pg-redondo:hover:not(:disabled) { border-color: var(--accent); background: var(--c-tarjeta-hover); }
.i-noticias .pg-redondo:active { transform: scale(.94); }
.i-noticias .pg-redondo:disabled { opacity: .4; cursor: default; }
.i-noticias .pg-redondo svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.i-preguntas .pg-pausa {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px 0 12px; border-radius: var(--r-pill);
  border: 1px solid var(--c-linea-fuerte); background: var(--c-tarjeta); color: var(--c-tinta); font-size: 14px; font-weight: 500; cursor: pointer;
}
.i-preguntas .pg-pausa:hover { border-color: var(--accent); }
.i-preguntas .pg-pausa svg { width: 14px; height: 14px; fill: currentColor; }
.i-preguntas .pg-pausa .pg-pausa__play { display: none; }
.i-preguntas .pg-pausa[aria-pressed="true"] .pg-pausa__ii { display: none; }
.i-preguntas .pg-pausa[aria-pressed="true"] .pg-pausa__play { display: inline; }

/* ---------- marco de Noticias ---------- */
.no-escena { width: 100%; max-width: var(--i-max); margin-inline: auto; padding-inline: calc(var(--i-pad) - var(--i-margen)); padding-top: 0; }
.no-escena .no-h2 { max-width: 16ch; }
.no-escena .pg-lede { max-width: 40ch; }

/* ---------- marco de Preguntas ---------- */
.pr-cabeza { max-width: var(--i-max); margin-inline: auto; padding-inline: calc(var(--i-pad) - var(--i-margen)); display: grid; gap: 18px;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: end; column-gap: clamp(24px, 5vw, 96px); padding-bottom: clamp(20px, 3vw, 40px); }
.pr-cabeza__texto { display: grid; gap: 18px; }
.pr-cinta__pie { max-width: var(--i-max); margin-inline: auto; padding-inline: calc(var(--i-pad) - var(--i-margen)); width: 100%; }
.pr-lista { max-width: var(--i-max); margin-inline: auto; padding-inline: calc(var(--i-pad) - var(--i-margen));
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); align-items: start; grid-template-rows: auto 1fr; column-gap: clamp(24px, 4vw, 72px); }
.pr-lista > .pr-grupo:first-child { grid-row: span 2; }
.pr-lista > .pr-cierre { grid-column: 2; grid-row: 2; }

@media (max-width: 1099px) {
  .pr-lista { grid-template-columns: minmax(0, 1fr); }
  .pr-lista > .pr-grupo:first-child { grid-row: auto; }
  .pr-lista { grid-template-rows: none; }
  .pr-lista > .pr-cierre { grid-column: auto; grid-row: auto; }
}
@media (max-width: 899px) {
  .pr-cabeza { grid-template-columns: minmax(0, 1fr); row-gap: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .i-noticias .pg-enlace--flecha::after, .i-preguntas .pg-enlace--flecha::after, .i-noticias .pg-redondo, .i-noticias .pg-segmento button { transition: none; }
}
@media (forced-colors: active) {
  .i-noticias .pg-segmento button[aria-pressed="true"] { outline: 2px solid CanvasText; }
}