@charset "UTF-8";

/* Juegos: las ediciones tienen su propio recorrido, siempre en Flexbox. */
.juegos-ediciones { background: var(--profundo); }
.juegos-edicion {
    display: flex;
    align-items: center;
    gap: clamp(32px, 4vw, 76px);
    padding: clamp(48px, 6vw, 96px) var(--margen);
}
.juegos-clasica { background: radial-gradient(ellipse at 75% 50%, #69522721, transparent 65%); }
.juegos-relato { flex: 1; min-width: 0; }
.juegos-relato .etiqueta { font-size: 12px; }
.juegos-relato h1 { font-size: clamp(50px, 4.9vw, 84px); line-height: 1.07; letter-spacing: -.045em; }
.juegos-relato h2 { font-size: clamp(42px, 3.8vw, 64px); line-height: 1.12; }
.juegos-relato em { color: #e3bf84; }
.juegos-descripcion { max-width: 440px; margin-top: 28px; font-size: 18px; line-height: 1.8; color: #c1c3b8; text-wrap: pretty; }
.juegos-accion { margin-top: 32px; min-height: 54px; padding-inline: 28px; font-size: 14px; border-color: #d4ad7066; background: linear-gradient(135deg, #b188392e, #b1883908); color: #f5dfb9; }
.juegos-escena { flex: 1.65; min-width: 0; }
.juegos-escena img { width: 100%; height: auto; aspect-ratio: 3/2; border-radius: 18px; border: 1px solid #dfc28b20; }
.juegos-escena figcaption { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; padding-top: 19px; color: #aaa997; font-size: 12px; letter-spacing: .02em; }
.juegos-escena figcaption span:last-child { color: #ddc59c; }
.juegos-variante { flex-direction: row-reverse; border-top: 1px solid var(--linea); padding-block: clamp(65px, 7vw, 110px); gap: clamp(40px, 6vw, 100px); }
.juegos-variante .juegos-escena { flex: 1.15; }
.juegos-variante .juegos-relato { padding-right: 2vw; }
.juegos-variante .juegos-relato em { color: #a8c9d3; }
.juegos-variante .juegos-accion { color: #d8edf0; border-color: #86c5d15c; background: linear-gradient(135deg, #639bab25, #639bab08); }
.juegos-variante .juegos-accion:hover { border-color: #a8c9d3; box-shadow: 0 0 28px #86c5d118; }

/* Información complementaria: fuera de la presentación de cada tablero. */
.juegos-informacion { display: flex; justify-content: space-between; gap: 8%; border-top: 1px solid var(--linea); background: #151d17; }
.juegos-informacion>div:first-child { flex: 1; min-width: 0; }
.juegos-informacion h2 { font-size: clamp(38px, 3.5vw, 58px); }
.juegos-informacion>div>p:last-child:not(.juegos-nota) { max-width: 380px; margin-top: 25px; font-size: 17px; line-height: 1.8; }
.juegos-preguntas { flex: 1.2; min-width: 0; }
.juegos-preguntas details:first-child { border-top: 1px solid var(--linea); }
.juegos-preguntas summary { font-size: 18px; padding-block: 24px; }
.juegos-preguntas details>p { font-size: 16px; color: #bbc1b3; }
.juegos-nota { margin-top: 28px; font-size: 13px; line-height: 1.8; color: #929d8e; }

/* Entrada desde inicio: la clásica ocupa el lugar principal. */
.juegos-resumen { background: var(--profundo); }
.juegos-resumen .seccion-cabecera { margin-bottom: 48px; }
.juegos-seleccion { display: flex; align-items: flex-end; gap: clamp(24px, 4vw, 60px); }
.juegos-opcion { display: flex; flex-direction: column; flex: 1.55; min-width: 0; }
.juegos-opcion+.juegos-opcion { flex: 1; }
.juegos-imagen { overflow: hidden; border-radius: 16px; border: 1px solid #dfc28b20; }
.juegos-imagen img { width: 100%; height: auto; aspect-ratio: 3/2; transition: filter .4s; }
.juegos-opcion-texto { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 27px 0; border-bottom: 1px solid var(--linea); }
.juegos-opcion .etiqueta { margin-bottom: 9px; font-size: 10px; }
.juegos-opcion h3 { font-size: clamp(32px, 3vw, 46px); }
.juegos-opcion-flecha { display: flex; align-items: center; justify-content: center; flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid #dfc28b40; border-radius: 50%; color: var(--acento); transition: background-color .3s, border-color .3s; }
.juegos-opcion:hover img { filter: brightness(1.1); }
.juegos-opcion:hover .juegos-opcion-flecha { background: #dfc28b18; border-color: var(--acento); }

@media (max-width: 1100px) {
    .juegos-relato h1 { font-size: 52px; }
    .juegos-descripcion { font-size: 17px; }
    .juegos-escena { flex: 1.35; }
    .juegos-variante .juegos-relato { padding-right: 0; }
}
@media (max-width: 900px) {
    .juegos-edicion { flex-direction: column; align-items: stretch; gap: 34px; }
    .juegos-relato { display: flex; flex-direction: column; align-items: flex-start; }
    .juegos-relato h1 { font-size: clamp(48px, 8vw, 72px); }
    .juegos-descripcion { max-width: 620px; margin-top: 22px; }
    .juegos-accion { margin-top: 24px; }
    .juegos-escena, .juegos-relato { flex: auto; }
    .juegos-variante .juegos-escena { flex: auto; }
    .juegos-relato h2 { font-size: clamp(40px, 7vw, 58px); }
    .juegos-informacion { flex-direction: column; gap: 36px; }
    .juegos-informacion>div>p:last-child:not(.juegos-nota) { max-width: 540px; }
}
@media (max-width: 700px) {
    .juegos-seleccion { flex-direction: column; align-items: stretch; gap: 40px; }
    .juegos-opcion, .juegos-opcion+.juegos-opcion { flex: auto; }
    .juegos-opcion+.juegos-opcion { margin-inline: 8% 0; }
    .juegos-opcion-texto { padding-block: 23px; }
    .juegos-resumen .seccion-cabecera { margin-bottom: 30px; }
}
@media (max-width: 600px) {
    .juegos-edicion { padding-block: 42px; }
    .juegos-relato .etiqueta { font-size: 10px; margin-bottom: 20px; }
    .juegos-relato h1 { font-size: clamp(43px, 9.4vw, 56px); }
    .juegos-relato h2 { font-size: clamp(37px, 8.5vw, 48px); }
    .juegos-descripcion { font-size: 17px; line-height: 1.75; }
    .juegos-escena img { border-radius: 12px; }
    .juegos-escena figcaption { font-size: 11px; padding-top: 15px; }
    .juegos-accion { font-size: 13px; padding-inline: 22px; }
    .juegos-preguntas summary { font-size: 17px; }
    .juegos-opcion h3 { font-size: 34px; }
    .juegos-opcion .etiqueta { font-size: 9px; letter-spacing: .12em; }
    .juegos-opcion-flecha { flex-basis: 44px; width: 44px; height: 44px; }
    .juegos-opcion-texto { gap: 10px; }
}
