/* =========================================================
   SEDRO 10 — PÁGINAS PARTIES Y SEASON 01
   1. Piezas compartidas
   2. Parties: portada, paquetes (recibos), cómo funciona, preguntas
   3. Season 01: portada, recorrido, pase, premios, apertura, lista
   ========================================================= */


/* ---------- 1. Piezas compartidas ---------- */
.cabeza-seccion {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--e-3) var(--e-5);
  align-items: end;
  margin-bottom: var(--e-6);
}
@media (max-width: 900px) { .cabeza-seccion { grid-template-columns: 1fr; } }

.cierre-pagina {
  padding-block: var(--e-7);
  text-align: center;
  color: #fff;
  background: radial-gradient(90% 100% at 50% 0%, #bb1a15, var(--rojo) 45%, var(--rojo-oscuro));
}
.cierre-pagina__interior { display: grid; justify-items: center; gap: 2rem; }

.enlace-crema { color: var(--crema); font-weight: 700; }

.lista-incluye { display: grid; margin-top: var(--e-4); border-top: 1px solid var(--linea); }
.lista-incluye li {
  position: relative;
  padding: 1rem 0 1rem 2.25rem;
  border-bottom: 1px solid var(--linea);
  font-size: 1.2rem;
  font-weight: 600;
}
.lista-incluye li::before {
  content: "";
  position: absolute;
  left: 0.35rem;
  top: 50%;
  width: 10px;
  height: 22px;
  margin-top: -11px;
  background: var(--naranja);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}


/* ---------- 2. Parties ---------- */
.portada-pagina {
  position: relative;
  min-height: min(92svh, 860px);
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  padding-top: var(--nav-alto);
  background: var(--negro);
}
.portada-pagina__foto { position: absolute; inset: 0; }
.portada-pagina__foto img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 60%; }
.portada-pagina::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(11, 10, 9, 0.92) 0%, rgba(11, 10, 9, 0.6) 45%, transparent 75%),
    linear-gradient(0deg, rgba(11, 10, 9, 0.9), transparent 45%);
}
.portada-pagina__texto {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 1.4rem;
  padding-bottom: clamp(3rem, 8vw, 6rem);
}
.portada-pagina__texto > * { max-width: 40rem; }
.portada-pagina .lead { color: var(--texto); }
.portada-pagina__acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.75rem; }

@media (max-width: 760px) {
  .portada-pagina__foto img { object-position: 78% 30%; height: 60%; }
  .portada-pagina::after { background: linear-gradient(0deg, var(--negro) 45%, rgba(11, 10, 9, 0.5) 70%, rgba(11, 10, 9, 0.2)); }
}

/* Paquetes como recibos de la caja registradora */
.paquetes { background: var(--carbon); }
.paquetes__lista {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.5rem, 3vw, 2.75rem);
  align-items: start;
}
.paquete { display: flex; flex-direction: column; height: 100%; }
.paquete:nth-child(1) { transform: rotate(-1deg); }
.paquete:nth-child(3) { transform: rotate(1deg); }
.paquete .recibo__cabeza { gap: 0.5rem; }
.paquete__para { font-weight: 650; color: var(--tinta-2); }
.paquete__precio {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 0.35rem;
  padding-block: 0.4rem 1rem;
  border-bottom: 2px dashed var(--linea-tinta);
  font-stretch: 112%;
  font-weight: 850;
}
.paquete__precio small { font-size: 1rem; font-weight: 700; color: var(--tinta-2); text-transform: uppercase; }
.paquete__precio .num { font-size: clamp(2.8rem, 4.5vw, 3.8rem); line-height: 1; letter-spacing: -0.02em; }
.paquete__incluye { display: grid; gap: 0.15rem; padding-block: 1rem 1.25rem; flex: 1; }
.paquete__incluye li {
  display: flex;
  gap: 0.6rem;
  align-items: flex-start;
  padding-block: 0.3rem;
}
.paquete__incluye .icono { width: 20px; height: 20px; margin-top: 0.22rem; color: var(--rojo); }
.paquete--destacado .recibo { --papel: #fff6ea; }
.paquete__marca {
  align-self: center;
  margin-bottom: -0.2rem;
  padding: 0.35rem 0.9rem;
  background: var(--naranja);
  color: #fff;
  font-weight: 750;
  font-size: 0.9rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  position: relative;
  z-index: 1;
}

@media (max-width: 960px) {
  .paquetes__lista { grid-template-columns: minmax(0, 1fr); max-width: 32rem; margin-inline: auto; }
  .paquete:nth-child(n) { transform: none; }
}

.como { background: var(--negro); }
.como__grilla {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
}
.como__pasos { border-top: 1px solid var(--linea-fuerte); }
.como__pasos li {
  display: grid;
  grid-template-columns: 4.5rem 1fr;
  gap: 1rem;
  padding-block: 1.6rem;
  border-bottom: 1px solid var(--linea);
}
.como__num {
  font-stretch: 125%;
  font-weight: 850;
  font-size: 3rem;
  line-height: 0.9;
  color: var(--naranja-claro);
}
.como h3 { font-size: 1.45rem; font-weight: 800; font-stretch: 108%; margin-bottom: 0.3rem; }
.como p { color: var(--texto-suave); font-size: 1.15rem; }

.preguntas-fiesta { background: var(--crema); color: var(--tinta); }
.preguntas-fiesta .lead { color: var(--tinta-2); margin-top: 1rem; }
.preguntas-fiesta .enlace-crema { color: var(--rojo); }
.preguntas-fiesta__grilla {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: clamp(2rem, 6vw, 6rem);
  align-items: start;
}
.lista-preguntas { border-top: 1px solid var(--linea-tinta); }
.lista-preguntas div { padding-block: 1.35rem; border-bottom: 1px solid var(--linea-tinta); }
.lista-preguntas dt { font-weight: 800; font-size: 1.25rem; margin-bottom: 0.3rem; }
.lista-preguntas dd { margin: 0; color: var(--tinta-2); font-size: 1.1rem; }

.galeria { background: var(--carbon); padding-block: var(--e-6); }
.galeria__grilla { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }

@media (max-width: 900px) {
  .como__grilla, .preguntas-fiesta__grilla { grid-template-columns: minmax(0, 1fr); }
  .galeria__grilla { grid-template-columns: minmax(0, 1fr); }
}


/* ---------- 3. Season 01 ---------- */
.temporada-portada {
  padding-top: calc(var(--nav-alto) + clamp(2.5rem, 6vw, 5rem));
  padding-bottom: clamp(3.5rem, 8vw, 6.5rem);
  overflow: hidden;
  background:
    radial-gradient(45% 70% at 80% 40%, rgba(168, 15, 15, 0.35), transparent 70%),
    var(--negro);
}
.temporada-portada__grilla {
  display: grid;
  grid-template-columns: 1.3fr 0.7fr;
  gap: clamp(2rem, 5vw, 5rem);
  align-items: center;
}
.temporada-portada__texto { display: grid; gap: 1.6rem; justify-items: start; }
.temporada-portada__titulo {
  font-stretch: 125%;
  font-weight: 900;
  text-transform: uppercase;
  font-size: clamp(3.4rem, 11vw, 9.5rem);
  line-height: 0.82;
  letter-spacing: -0.02em;
}
.temporada-portada__escudo { width: 100%; max-width: 380px; justify-self: center; }

.fichas {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border: 1px solid var(--linea-fuerte);
}
.fichas div { padding: 0.8rem 1.25rem; border-right: 1px solid var(--linea-fuerte); }
.fichas div:last-child { border-right: 0; }
.fichas dt {
  font-stretch: 82%;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.9rem;
  color: var(--naranja-claro);
}
.fichas dd { margin: 0; font-weight: 750; font-size: 1.15rem; }

@media (max-width: 860px) {
  .temporada-portada__grilla { grid-template-columns: minmax(0, 1fr); }
  .temporada-portada__escudo { grid-row: 1; max-width: 150px; justify-self: start; }
  .fichas div { flex: 1 1 33%; }
}

.recorrido { background: var(--carbon); }
.recorrido__etapas {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border-top: 3px solid var(--naranja);
}
.recorrido__etapas li {
  display: grid;
  align-content: start;
  gap: 0.6rem;
  padding: 1.75rem 1.5rem 1.75rem 0;
  border-right: 1px solid var(--linea);
}
.recorrido__etapas li + li { padding-left: 1.5rem; }
.recorrido__etapas li:last-child { border-right: 0; }
.recorrido__num {
  font-stretch: 125%;
  font-weight: 850;
  font-size: clamp(2.8rem, 4vw, 3.6rem);
  line-height: 0.9;
  color: var(--naranja-claro);
}
.recorrido h3 { font-size: 1.35rem; font-weight: 800; font-stretch: 108%; line-height: 1.15; }
.recorrido p { color: var(--texto-suave); }

@media (max-width: 960px) {
  .recorrido__etapas { grid-template-columns: minmax(0, 1fr); }
  .recorrido__etapas li,
  .recorrido__etapas li + li {
    grid-template-columns: 4rem 1fr;
    column-gap: 1rem;
    padding: 1.25rem 0;
    border-right: 0;
    border-bottom: 1px solid var(--linea);
  }
  .recorrido__num { grid-row: 1 / span 2; }
}

.pase { background: var(--negro); }
.pase__grilla {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
.premios {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  background: var(--rojo);
  color: #fff;
  clip-path: polygon(24px 0, 100% 0, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0 100%, 0 24px);
}
.premios__lista { display: grid; margin-top: 1.25rem; border-top: 1px solid rgba(255, 255, 255, 0.3); }
.premios__lista li {
  display: grid;
  grid-template-columns: 4.25rem 1fr;
  gap: 1rem;
  align-items: center;
  padding-block: 1.1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.premios__lugar { font-stretch: 125%; font-weight: 900; font-size: 2rem; line-height: 1; }
.premios__campeon .premios__lugar { font-size: 2.6rem; }
.premios h3 { font-size: 1.3rem; font-weight: 800; }
.premios p { color: rgba(255, 255, 255, 0.92); }
.premios__nota { margin-top: 1.1rem; font-size: 1rem; color: rgba(255, 255, 255, 0.92); }

@media (max-width: 900px) { .pase__grilla { grid-template-columns: minmax(0, 1fr); } }

.apertura { background: var(--crema); color: var(--tinta); }
.apertura .lead { color: var(--tinta-2); }
.apertura__lista {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--linea-tinta);
  border-left: 1px solid var(--linea-tinta);
}
.apertura__lista li {
  display: grid;
  align-content: start;
  gap: 0.4rem;
  min-height: 11rem;
  padding: 1.5rem;
  border-right: 1px solid var(--linea-tinta);
  border-bottom: 1px solid var(--linea-tinta);
}
.apertura h3 { font-size: 1.3rem; font-weight: 800; font-stretch: 110%; line-height: 1.15; }
.apertura p { color: var(--tinta-2); }
/* El ultimo elemento cierra la fila cuando quedan 7 */
.apertura__lista li:last-child { grid-column: span 2; }
.apertura__destacado { background: var(--tinta); color: var(--crema); }
.apertura__destacado h3 {
  font-stretch: 125%;
  font-weight: 900;
  text-transform: uppercase;
  font-size: 1.6rem;
  color: var(--naranja-claro);
}
.apertura__destacado p { color: var(--texto-suave); }

@media (max-width: 960px) { .apertura__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .apertura__lista { grid-template-columns: minmax(0, 1fr); } .apertura__lista li { min-height: 0; } .apertura__lista li:last-child { grid-column: auto; } }

.lista-espera {
  background:
    radial-gradient(50% 60% at 85% 50%, rgba(168, 15, 15, 0.18), transparent 70%),
    var(--negro);
}
.lista-espera__grilla {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(2.5rem, 6vw, 6rem);
  align-items: start;
}
.lista-espera__texto { display: grid; gap: 1.5rem; }

.formulario { display: grid; gap: 1.25rem; margin-top: 0.5rem; }
.formulario__grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.1rem 1.25rem; }
.formulario .boton { justify-self: start; }
.formulario__nota { color: var(--texto-suave); font-size: 1rem; }
.formulario__exito {
  display: grid;
  gap: 0.6rem;
  padding: 1.25rem 1.4rem;
  border: 1.5px solid var(--ok);
  border-radius: var(--radio);
}
.formulario__exito:focus { outline: none; }
.formulario__exito h3 { font-size: 1.4rem; font-weight: 800; color: var(--ok); }
.formulario .campo--ancho { grid-column: 1 / -1; }
/* Trampa para robots (inscripción Season 01): fuera de la pantalla en vez de
   display:none, porque muchos robots se saltan los campos con display:none
   y así no caerían en la trampa. aria-hidden la saca del lector de pantalla. */
.campo-trampa { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 640px) { .formulario__grilla { grid-template-columns: minmax(0, 1fr); } }

/* Tablero de ranking (mismo que en inicio) */
.ranking {
  padding: 1.25rem 1.5rem 0.75rem;
  background: var(--carbon);
  border: 1px solid var(--linea);
  border-top: 3px solid var(--naranja);
}
.ranking__cabeza,
.ranking__filas li {
  display: grid;
  grid-template-columns: 3.5rem minmax(0, 1fr) 4.5rem;
  align-items: center;
  gap: 1rem;
}
.ranking__cabeza {
  padding-bottom: 0.75rem;
  border-bottom: 1px solid var(--linea-fuerte);
  font-stretch: 82%;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-size: 0.95rem;
  color: var(--texto-suave);
}
.ranking__cabeza span:last-child,
.ranking__filas .num { text-align: right; }
.ranking__filas li {
  min-height: 2.9rem;
  border-bottom: 1px solid var(--linea);
  font-weight: 700;
}
.ranking__filas li:last-child { border-bottom: 0; }
.ranking__pos { font-stretch: 125%; font-weight: 850; font-size: 1.2rem; color: var(--naranja-claro); }
.ranking__filas .num { color: var(--texto-suave); }
.ranking__vacio {
  height: 2px;
  margin-right: 1.5rem;
  background: repeating-linear-gradient(90deg, var(--linea-fuerte) 0 10px, transparent 10px 17px);
}
.ranking__corte { border-bottom: 2px solid var(--naranja) !important; }

@media (max-width: 900px) { .lista-espera__grilla { grid-template-columns: minmax(0, 1fr); } }
