/* ═══════════════════════════════════════════════════════════════════════════
   [MÓDULO CELEBRACIONES] — se puede quitar entero.
   Esta hoja solo sirve a <section id="celebraciones" data-modulo="celebraciones">.
   Receta de borrado en el README (y scripts/quitar-celebraciones.mjs).
   Usa los tokens de css/estilos.css; no define nada que use el resto.
   ═══════════════════════════════════════════════════════════════════════════ */

.celebra {
  position: relative; z-index: 1;
  display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
  gap: clamp(2rem, 6vw, 6rem);
  padding: clamp(5rem, 10vw, 8rem) var(--margen);
  background: var(--carbon); color: var(--cal);
}
.celebra .antetitulo { color: var(--almagre-claro); }
.celebra .antetitulo::before { background: var(--almagre-claro); }
.celebra .entrada { color: var(--apagado-oscuro); }

.celebra__cifra { align-self: start; position: sticky; top: calc(var(--cab) + 4vh); }
.celebra__n {
  font: 400 clamp(8rem, 21vw, 19rem)/.82 var(--tipo-rotulo);
  font-variant-numeric: tabular-nums; letter-spacing: -.01em;
}
.celebra__leyenda {
  max-width: 16rem; margin-top: 1.1rem; padding-top: 1rem;
  border-top: 6px solid var(--almagre);
  font: italic 300 1.25rem/1.35 var(--tipo-texto); color: var(--apagado-oscuro);
}

.config { margin-top: 2.4rem; display: grid; gap: 1.6rem; }
.config__grupo { margin: 0; padding: 0; border: 0; min-width: 0; }
.config__grupo legend, .config__campo > span {
  display: block; margin-bottom: .7rem;
  font: 400 .92rem/1 var(--tipo-versal); letter-spacing: .12em; text-transform: lowercase;
  color: var(--almagre-claro);
}
.config__campo > span i { font-style: normal; color: var(--apagado-oscuro); }
.chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.chips label { position: relative; cursor: pointer; }
.chips input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.chips span {
  display: inline-flex; align-items: center; min-height: 2.75rem; padding: .55rem 1.1rem;
  border: 1.5px solid rgba(244, 240, 232, .42); border-radius: 2px;
  font: 400 .98rem/1 var(--tipo-rotulo); letter-spacing: .06em; text-transform: uppercase;
  transition: background-color .3s var(--suave), border-color .3s var(--suave), color .3s;
}
.chips input:checked + span { background: var(--almagre); border-color: var(--almagre); }
.chips input:focus-visible + span { outline: 2px solid var(--cal); outline-offset: 3px; }
.chips label:hover span { border-color: var(--cal); }

.config__fila { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 1.6rem; align-items: end; }
.config__campo { display: block; }
.config__campo--rango { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 1rem; }
.config__campo--rango > span { grid-column: 1 / -1; }
.config__campo input[type="range"] { width: 100%; accent-color: var(--almagre-claro); }
.config__campo output { min-width: 3.4ch; font: 400 2.2rem/1 var(--tipo-rotulo); text-align: right; font-variant-numeric: tabular-nums; }
.celebra .config__campo select, .celebra .config__campo textarea { border-bottom-color: rgba(244, 240, 232, .6); color: var(--cal); background: transparent; }
.celebra .config__campo select option { color: var(--tinta); }
.config__aviso { padding: .8rem 1rem; border-left: 5px solid var(--almagre-claro); background: rgba(244, 240, 232, .06); font-style: italic; }
.config__aviso[hidden] { display: none; }

.mensaje { padding: 1.3rem 1.4rem; background: rgba(244, 240, 232, .07); border-left: 6px solid var(--almagre); }
.celebra .mensaje__rotulo { color: var(--almagre-claro); }
.mensaje__texto { font: italic 300 1.2rem/1.5 var(--tipo-texto); }
.celebra .boton--linea { --texto: var(--cal); --borde: rgba(244, 240, 232, .7); }
.celebra .boton--linea:hover { --fondo: var(--cal); --texto: var(--tinta); }

@media (max-width: 900px) {
  .celebra { grid-template-columns: 1fr; }
  .celebra__cifra { position: static; display: flex; align-items: flex-end; gap: 1.2rem; }
  .celebra__n { font-size: clamp(6rem, 30vw, 9rem); }
  .celebra__leyenda { margin: 0 0 .6rem; }
}
@media (max-width: 560px) {
  .config__fila { grid-template-columns: 1fr; }
}

/* ═══ [MANDO DE MAQUETA] en la versión sobria: sin las bandas de almagre del módulo ═══ */
.densidad-sobria .celebra__leyenda { border-top-width: 1px; border-top-color: rgba(244, 240, 232, .4); }
.densidad-sobria .mensaje { border-left-width: 1px; border-left-color: rgba(244, 240, 232, .4); }
.densidad-sobria .celebra .antetitulo::before { display: none; }
/* ═══ fin del bloque [MANDO DE MAQUETA] ═══ */
/* ═══ fin [MÓDULO CELEBRACIONES] ═══ */