/* Copia de web-emprende/assets/css/sitio.css (la hace el generador): no editar acá. */
/* ATICMA Emprende 2026: lo propio de este sitio.
   La base (colores, tipografías, barra, botones, tarjetas, fondos, cintas, modo claro) es base.css, que es la hoja
   de los ATICMA Awards tal cual. Acá va lo que Emprende agrega o cambia. */

:root { --sol: #ffab1a; --panel: linear-gradient(165deg, rgba(16, 34, 104, .78), rgba(3, 8, 30, .92) 62%); --panel-borde: rgba(95, 138, 255, .55); --linea: rgba(255, 255, 255, .16); }
:root[data-modo="claro"] { --sol: #9a5200; --panel: linear-gradient(165deg, #fff, #e8eeff 72%); --panel-borde: rgba(29, 79, 240, .55); --linea: rgba(12, 30, 92, .16); }

.ancho--amplio { width: min(100% - 2 * var(--margen), 72rem); }
.aticma :is(.encabezado, .titulo) { text-wrap: balance; }
.aticma .seccion > .ancho > .titulo { text-align: center; margin-bottom: clamp(2.2rem, 4.5vw, 4rem); }
.aticma .titulo a { color: inherit; text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 100% 2px no-repeat; }
.aticma .titulo a:hover { color: var(--cian); }
.aticma .tarjeta p a, .aticma .caso p a { color: var(--celeste); text-underline-offset: .2em; }

/* ---------- Marca ---------- */

.marca { display: inline-flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--fuerte); }
.marca__isotipo { width: calc(var(--alto-barra) * .56); height: calc(var(--alto-barra) * .52); transition: width .4s var(--suave), height .4s var(--suave); filter: drop-shadow(0 0 10px rgba(255, 171, 26, .35)); }
.marca__texto { display: grid; font-family: var(--cuerpo); line-height: .98; letter-spacing: .04em; font-size: clamp(.78rem, .7rem + .3vw, .95rem); }
.marca__texto b { font-weight: 700; }
.marca__texto i { font-style: normal; font-weight: 400; letter-spacing: .13em; }
.barra__cta { text-decoration: none; }

/* ---------- Portada ---------- */

/* "EMPRENDE 2026" es más largo que "AWARDS 2026": el título va un poco más chico para que entre igual. */
.aticma .portada__marco { font-size: clamp(1.85rem, .7rem + 5.1vw, 4.7rem); }
@media (min-width: 48.01rem) {
  .aticma .portada__marco { font-size: clamp(1.85rem, min(.7rem + 5.1vw, 9.4vh), 4.7rem); }
}
.aticma .portada__sobre { color: var(--sol); }
/* El récord, resaltado en la portada: lleva a la franja del número grande. */
.portada__record { display: inline-flex; align-items: center; gap: .4em; min-height: 1.5rem; padding: .06em .8em .08em; line-height: 1.1; border-radius: 99px; border: 1.5px solid currentColor; color: inherit; text-decoration: none; background: color-mix(in srgb, var(--sol) 16%, transparent); box-shadow: 0 0 22px -6px var(--sol); transition: transform .35s var(--suave), box-shadow .3s; }
.portada__record b { font-size: 1.45em; font-weight: 800; line-height: 1; color: var(--fuerte); }
@media (max-height: 44rem) { .portada__record { padding-block: 0; } .portada__record b { font-size: 1.2em; } }      /* en pantallas bajas no le suma alto a la portada */
.portada__record:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 0 34px -4px var(--sol); }
.aticma .portada__lema { max-width: 46rem; }
.aticma .portada__lema em:first-of-type { color: var(--sol); }
.aticma .mancha--lima { background: radial-gradient(closest-side, rgba(255, 171, 26, .5), rgba(255, 140, 20, .16) 58%, transparent 76%); }

/* Entradas: lo de la portada aparece al cargar, en orden; el resto, al llegar a la vista. */
.js [data-intro] { transform: translateY(22px); }
.cargado [data-intro] { opacity: 1; transform: none; transition: opacity .9s ease, transform 1s var(--suave); transition-delay: calc(.75s + var(--orden, 0) * .13s); }
.cargado .portada__linea { opacity: 1; }
.cargado .portada__linea .letra { animation: letra 1.05s var(--suave) both; animation-delay: calc(.1s + var(--orden, 0) * .04s); }
.portada__linea + .portada__linea .letra { --retraso: .28s; animation-delay: calc(.38s + var(--orden, 0) * .04s); }
@keyframes letra { from { opacity: 0; transform: translateY(80%) rotateX(-75deg); filter: blur(10px); } }
.js .palabra { opacity: 0; }
.cargado .palabra { opacity: 1; transition: opacity 1.6s ease .5s; animation: flotar-palabra 7s ease-in-out infinite alternate; }
.palabra:nth-child(even) { animation-direction: alternate-reverse; animation-duration: 9s; }
@keyframes flotar-palabra { from { transform: translate3d(-3%, 14%, 0); } to { transform: translate3d(3%, -14%, 0); } }
.pausado .palabra { animation-play-state: paused; }

.js [data-aparece], .js [data-escalonado] > * { opacity: 0; transform: translateY(40px); }
.js [data-aparece].visto, .js [data-escalonado] > .visto { opacity: 1; transform: none; transition: opacity .9s ease, transform 1.05s var(--suave); }
.js [data-escalonado] > .visto { transition-delay: calc(var(--orden, 0) * .08s); }
/* las tarjetas que se inclinan ya usan transform: una vez adentro, se les devuelve el control */
.js .inclina.visto { transition: opacity .9s ease, transform .6s var(--suave), box-shadow .45s, border-color .3s; }
.sin-anim [data-aparece], .sin-anim [data-escalonado] > *, .sin-anim .palabra { opacity: 1 !important; transform: none !important; }
.sin-anim .portada__linea .letra { animation: none; }
/* Red de seguridad: si el script no llega (un corte, un bloqueo), a los 4 segundos lo escondido aparece igual. */
.js:not(.cargado):not(.sin-anim) :is([data-aparece], [data-escalonado] > *, .palabra) { animation: aparecer-igual .5s 4s both; }

/* ---------- Chapitas de estado ---------- */

.chapita { display: inline-block; font-family: var(--titulos); font-style: normal; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; padding: .28em .7em .22em; border-radius: 99px; border: 1px solid currentColor; color: var(--tenue); line-height: 1.2; white-space: nowrap; }
.chapita:empty { display: none; }

/* ---------- Programa: la pista de masterclasses ---------- */

.pista-caja { position: relative; }
.pista {
  display: flex; gap: clamp(.9rem, 1.6vw, 1.4rem); overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
  padding: 1.6rem .4rem 2.6rem; margin-inline: -.4rem; overscroll-behavior-x: contain;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 2.5%, #000 97.5%, transparent); mask-image: linear-gradient(90deg, transparent, #000 2.5%, #000 97.5%, transparent);
}
.pista::-webkit-scrollbar { display: none; }
.pista:focus-visible { outline: 2px solid var(--cian); outline-offset: 4px; border-radius: 16px; }
.clase {
  position: relative; flex: 0 0 clamp(14.5rem, 23vw, 17rem); scroll-snap-align: start; display: grid; align-content: start; gap: .55rem;
  padding: 1.5rem 1.35rem 1.3rem; border-radius: 18px; border: 2px solid var(--panel-borde); background: var(--panel);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 4px 0 rgba(0, 20, 90, .6), 0 26px 40px -22px #000, 0 30px 54px -30px rgba(0, 56, 220, .8);
  transition: transform .45s var(--suave), border-color .3s, box-shadow .45s;
}
.clase:hover { transform: translateY(-8px); border-color: var(--cian); }
.clase__numero { font-family: var(--titulos); font-weight: 800; font-size: 2.6rem; line-height: 1; color: transparent; -webkit-text-stroke: 1.5px var(--panel-borde); }
.clase h3 { font-family: var(--titulos); font-weight: 600; font-size: 1.02rem; line-height: 1.25; color: var(--fuerte); }
.clase p { font-size: .93rem; }
.clase__fecha { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .7rem; margin-top: .4rem; padding-top: .8rem; border-top: 1px solid var(--linea); font-size: .86rem !important; color: var(--fuerte); }
.clase[data-estado="hecha"] { opacity: 1; }        /* la chapita "Dictada" ya la distingue: apagarla le quitaba contraste al texto */
.clase[data-estado="hecha"] .clase__numero { -webkit-text-stroke-color: var(--tenue); }
.clase[data-estado="hecha"] .chapita { color: var(--cian); }
.clase[data-estado="proxima"] { border-color: var(--sol); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 4px 0 rgba(120, 70, 0, .7), 0 0 38px -8px var(--sol), 0 30px 54px -28px rgba(255, 150, 20, .7); }
.clase[data-estado="proxima"] .clase__numero { -webkit-text-stroke-color: var(--sol); }
.clase[data-estado="proxima"] .chapita { color: #1a1200; background: var(--sol); border-color: var(--sol); }
[data-modo="claro"] .clase[data-estado="proxima"] .chapita { color: #fff; }
[data-modo="claro"] .clase { box-shadow: inset 0 1px 0 #fff, 0 4px 0 #c3cde6, 0 22px 36px -22px rgba(10, 30, 90, .45); }

.pista__flecha {
  position: absolute; top: 50%; z-index: 2; width: 2.8rem; height: 2.8rem; margin-top: -1.9rem; border-radius: 50%; display: grid; place-items: center;
  border: 2px solid var(--panel-borde); color: var(--fuerte); background: var(--fondo);
  box-shadow: 0 3px 0 rgba(0, 20, 90, .5), 0 14px 22px -10px #000; transition: transform .35s var(--suave), background .3s, color .3s, border-color .3s;
}
.pista__flecha:hover { background: var(--azul); color: #fff; border-color: #fff; transform: scale(1.1); }
.pista__flecha .i { width: 1.2rem; height: 1.2rem; }
.pista__flecha--ant { left: -1.2rem; }
.pista__flecha--ant .i { rotate: 180deg; }
.pista__flecha--sig { right: -1.2rem; }

.sellos { display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem 1rem; margin-top: clamp(1.2rem, 3vw, 2.4rem); }
.sellos li { padding: .7rem 1.2rem; border-radius: 99px; border: 1px solid var(--linea); background: rgba(255, 255, 255, .04); font-size: .95rem; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 10px 20px -14px #000; }
.sellos b { color: var(--fuerte); font-weight: 600; }
[data-modo="claro"] .sellos li { background: rgba(255, 255, 255, .7); }

/* ---------- Fechas: el cronograma ---------- */

.fechas__grilla { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.fechas__grilla .titulo { text-align: left; margin-bottom: clamp(1.6rem, 3vw, 2.6rem); }
.cronograma { position: relative; display: grid; gap: clamp(.9rem, 1.9vh, 1.35rem); padding-left: 2.4rem; }
/* la línea: gris de punta a punta, y encima el tramo ya recorrido */
.cronograma::before, .cronograma::after { content: ""; position: absolute; left: .62rem; top: .6rem; bottom: .6rem; width: 3px; border-radius: 3px; background: var(--linea); }
.cronograma::after { background: linear-gradient(180deg, var(--sol), var(--lima) 55%, var(--cian)); transform-origin: 50% 0; transform: scaleY(var(--avance, 0)); transition: transform 1.6s var(--suave) .3s; }
.cronograma li { position: relative; display: grid; grid-template-columns: 1fr auto; gap: .1rem .9rem; align-items: baseline; }
.cronograma li::before {
  content: ""; position: absolute; left: -2.4rem; top: .2rem; width: 1.4rem; height: 1.4rem; border-radius: 50%; z-index: 1;
  background: var(--fondo); border: 3px solid var(--tenue); box-sizing: border-box; transition: border-color .4s, background .4s, box-shadow .4s;
}
.cronograma b { font-family: var(--titulos); font-weight: 600; font-size: clamp(.95rem, .85rem + .35vw, 1.12rem); color: var(--fuerte); }
.cronograma span { grid-column: 1; font-size: .95rem; }
.cronograma .chapita { grid-column: 2; grid-row: 1; }
.cronograma li[data-estado="hecha"]::before { border-color: var(--cian); background: var(--cian); }
.cronograma li[data-estado="hecha"] .chapita { color: var(--cian); }
.cronograma li[data-estado="en-curso"]::before { border-color: var(--sol); background: var(--sol); box-shadow: 0 0 0 5px rgba(255, 171, 26, .25), 0 0 22px var(--sol); animation: latir-punto 1.8s ease-in-out infinite; }
.cronograma li[data-estado="en-curso"] b { color: var(--sol); }
.cronograma li[data-estado="en-curso"] .chapita { color: #1a1200; background: var(--sol); border-color: var(--sol); }
[data-modo="claro"] .cronograma li[data-estado="en-curso"] .chapita { color: #fff; }
.cronograma li[data-estado="pendiente"] b { color: var(--texto); }
@keyframes latir-punto { 50% { box-shadow: 0 0 0 9px rgba(255, 171, 26, .08), 0 0 30px var(--sol); } }
.pausado .cronograma li::before { animation-play-state: paused; }

.fechas__lado { display: grid; gap: clamp(1.2rem, 2.4vw, 1.8rem); align-content: start; }
.legado { text-align: left; justify-items: start; }
/* El récord de inscripción de este año, destacado. */
.aticma .legado--record { border-color: var(--sol); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 0 40px -8px var(--sol), 0 36px 64px -26px rgba(255, 150, 20, .55), 0 28px 40px -18px #000; }
/* La franja del récord: el número ocupa el ancho de la pantalla. */
.logro { text-align: center; padding-block: clamp(2.4rem, 6vw, 5rem); overflow: hidden; }
.logro .ancho { display: grid; justify-items: center; gap: clamp(.4rem, 1.2vw, 1rem); }
.logro .caso__sobre { font-size: clamp(.78rem, .7rem + .4vw, 1rem); }
.logro__numero { display: grid; justify-items: center; gap: .1em; margin: 0; }
.logro__numero b { font-family: var(--titulos); font-weight: 900; font-size: clamp(7rem, min(31vw, 52vh), 23rem); line-height: .86; letter-spacing: -.01em; font-variant-numeric: tabular-nums; background: linear-gradient(90deg, var(--sol), var(--lima) 55%, var(--cian)); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 46px rgba(255, 171, 26, .4)); }
.logro__numero span { font-family: var(--titulos); font-weight: 700; font-size: clamp(1.35rem, 1rem + 3.4vw, 3.6rem); line-height: 1.05; text-transform: uppercase; letter-spacing: .05em; color: var(--fuerte); }
.logro__bajada { max-width: 42rem; font-size: clamp(1.05rem, 1rem + .45vw, 1.35rem); }
[data-modo="claro"] .logro__numero b { filter: drop-shadow(0 0 30px rgba(154, 82, 0, .25)); }
.record { display: flex; align-items: baseline; flex-wrap: wrap; gap: .2rem .9rem; }
.record b { font-family: var(--titulos); font-weight: 800; font-size: clamp(3rem, 2rem + 4.5vw, 5.4rem); line-height: .95; font-variant-numeric: tabular-nums; background: linear-gradient(90deg, var(--sol), var(--lima) 60%, var(--cian)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.record span { font-family: var(--titulos); font-size: clamp(.95rem, .85rem + .5vw, 1.25rem); color: var(--fuerte); }
.cronograma span strong { color: var(--sol); font-weight: 600; }
.legado__jurado { font-size: .9rem; color: var(--tenue); }
.legado__jurado b { color: var(--fuerte); font-weight: 600; }

.numeros { display: flex; flex-wrap: wrap; gap: .8rem; width: 100%; }
.numeros li { flex: 1 1 6.4rem; display: grid; gap: .15rem; padding: .8rem .9rem; border-radius: 14px; border: 1px solid var(--linea); background: rgba(0, 0, 0, .28); text-align: center; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 3px 0 rgba(0, 0, 0, .35); }
.numeros b { font-family: var(--titulos); font-weight: 700; font-size: clamp(1.35rem, 1rem + 1.3vw, 2rem); line-height: 1.1; color: var(--fuerte); font-variant-numeric: tabular-nums; white-space: nowrap; }
.numeros span { font-size: .8rem; color: var(--tenue); }
.numeros--destacados b { background: linear-gradient(90deg, var(--sol), var(--lima) 60%, var(--cian)); -webkit-background-clip: text; background-clip: text; color: transparent; }
[data-modo="claro"] .numeros li { background: rgba(255, 255, 255, .75); box-shadow: inset 0 1px 0 #fff, 0 3px 0 #c3cde6; }

/* ---------- Casos de éxito y premio ---------- */

.casos__grilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.4rem, 3vw, 2.6rem); align-items: stretch; }
.caso { text-align: left; justify-items: start; align-content: start; }
.caso__sobre { font-family: var(--titulos); font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--sol); }
.caso--foto { grid-template-columns: minmax(0, .8fr) minmax(0, 1fr); gap: clamp(1rem, 2.4vw, 1.8rem); align-items: center; }
.caso--foto > div:last-child { display: grid; gap: 1rem; }
.caso__foto, .premio__foto { border-radius: 14px; overflow: hidden; border: 2px solid rgba(255, 255, 255, .8); box-shadow: 0 0 22px -6px rgba(255, 255, 255, .5), 0 26px 40px -20px #000; }
.caso__foto { aspect-ratio: 4 / 5; }
:is(.caso__foto, .premio__foto) img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--suave); }
.tarjeta:hover :is(.caso__foto, .premio__foto) img { transform: scale(1.06); }

.premio__grilla { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: clamp(1.4rem, 3vw, 2.6rem); align-items: stretch; }
.premio__principal { text-align: left; justify-items: start; align-content: start; }
.premio__foto { width: 100%; aspect-ratio: 1200 / 618; }
.premio__dato { padding: .8rem 1.1rem; border-radius: 12px; border: 1px solid var(--linea); background: rgba(0, 0, 0, .28); }
.premio__dato b { font-family: var(--titulos); color: var(--sol); margin-right: .3em; }
[data-modo="claro"] .premio__dato { background: rgba(255, 255, 255, .75); }
.premio__lado { display: grid; gap: clamp(1.2rem, 2.4vw, 1.8rem); align-content: start; }
.premio__lado .tarjeta { text-align: left; justify-items: start; padding-block: clamp(1.3rem, 2.6vw, 1.9rem); }
.premio__nota { text-align: center; color: var(--tenue); font-size: .95rem; }

/* ---------- Sponsors: paquetes ---------- */

.paquetes__titulo { margin-top: clamp(5rem, 10vw, 9rem); }
.paquetes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.9rem, 1.8vw, 1.4rem); align-items: stretch; }
.paquete {
  display: grid; align-content: start; gap: .9rem; padding: 1.5rem 1.25rem; border-radius: 18px; border: 2px solid var(--panel-borde); background: var(--panel);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 4px 0 rgba(0, 20, 90, .6), 0 26px 40px -22px #000; transition: transform .45s var(--suave), border-color .3s;
}
.paquete:hover { transform: translateY(-8px); border-color: var(--cian); }
.paquete h3 { font-family: var(--titulos); font-weight: 600; font-size: 1.1rem; letter-spacing: .08em; text-transform: uppercase; color: var(--fuerte); }
.paquete ul { display: grid; gap: .5rem; font-size: .93rem; }
.paquete li, .lista-tildes li { position: relative; padding-left: 1.4rem; }
.paquete li::before, .lista-tildes li::before { content: ""; position: absolute; left: 0; top: .42em; width: .62rem; height: .34rem; border-left: 2px solid var(--cian); border-bottom: 2px solid var(--cian); rotate: -45deg; }
.paquete--premium { border-color: var(--sol); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .22), 0 4px 0 rgba(120, 70, 0, .7), 0 0 38px -10px var(--sol), 0 26px 40px -22px #000; }
.paquete--premium h3 { color: var(--sol); }
.paquete--premium li::before { border-color: var(--sol); }
[data-modo="claro"] .paquete { box-shadow: inset 0 1px 0 #fff, 0 4px 0 #c3cde6, 0 22px 36px -22px rgba(10, 30, 90, .45); }
.paquetes__accion { display: grid; justify-items: center; margin-top: clamp(2rem, 4vw, 3.2rem); }

/* ---------- Inscripción, prensa y pie ---------- */

.aticma .cierre { margin-top: 0; }
.lista-tildes { display: grid; gap: .55rem; text-align: left; max-width: 34rem; }
.prensa { width: min(100%, 36rem); margin: clamp(3rem, 6vw, 5rem) auto 0; }
.preguntas .titulo { margin-bottom: clamp(2rem, 4vw, 3.4rem); }

.pie__isotipo { width: 4.6rem; height: 4.3rem; filter: drop-shadow(0 0 16px rgba(255, 171, 26, .35)); }
.pie__iniciativa p:first-of-type { max-width: 40rem; }
.pie__enlaces { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 1.1rem; margin-top: .6rem; }
.pie__enlaces a { display: inline-block; padding: .5rem 1.15rem; border-radius: 99px; border: 1px solid var(--linea); color: var(--fuerte); text-decoration: none; font-family: var(--titulos); font-size: .78rem; letter-spacing: .08em; transition: border-color .3s, color .3s, transform .35s var(--suave); }
.pie__enlaces a:hover { border-color: var(--cian); color: var(--cian); transform: translateY(-3px); }

/* ---------- Pantallas chicas ---------- */

@media (max-width: 62rem) {
  .fechas__grilla, .casos__grilla, .premio__grilla { grid-template-columns: 1fr; }
  .paquetes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pista__flecha { display: none; }
}
@media (max-width: 36rem) {
  .paquetes { grid-template-columns: 1fr; }
  .caso--foto { grid-template-columns: 1fr; }
  .caso__foto { aspect-ratio: 4 / 3; }
  .marca__texto { font-size: .74rem; }
  .cronograma li { grid-template-columns: 1fr; }
  .cronograma .chapita { grid-column: 1; grid-row: auto; justify-self: start; margin-top: .25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .palabra, .cronograma li::before, .portada__linea .letra { animation: none !important; }
}

/* ---------- Ajustes sobre la base ---------- */

/* El botón del menú es un enlace: se le devuelve el aspecto de botón que la regla de los enlaces del menú le pisa. */
.barra__nav a.boton { font-family: var(--cuerpo); font-size: 1.05rem; padding: .5em 1.1em; color: #fff; }
.barra__nav a.boton:hover { color: #fff; }
.barra__nav a.boton::after { content: none; }
/* Dentro de las tarjetas de casos y premios todo va alineado a la izquierda, también los títulos. */
.caso .titulo, .premio__grilla .tarjeta .titulo, .legado .titulo { text-align: left; }

/* ---------- En qué anda el programa hoy (portada) ---------- */

.portada__ahora {
  display: inline-flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: .2rem .7rem; margin-top: clamp(.6rem, 1.8vh, 1.3rem);
  padding: .5rem 1.15rem; border-radius: 99px; border: 1px solid color-mix(in srgb, var(--sol) 60%, transparent);
  background: color-mix(in srgb, var(--sol) 12%, transparent); font-size: clamp(.82rem, min(.74rem + .4vw, 2.3vh), 1rem); color: var(--fuerte);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 12px 24px -14px #000;
}
.portada__ahora b { font-weight: 600; color: var(--sol); }
.portada__ahora i { font-style: normal; opacity: .5; }
.portada__ahora[hidden] { display: none; }

/* En el celular toda la portada, hasta la cuenta regresiva, entra en la primera pantalla: esta portada tiene
   más renglones que la de los Awards (la etapa en curso, dos botones largos), así que se aprieta un poco. */
@media (max-width: 48rem) {
  .aticma .portada__centro { padding-top: clamp(4.4rem, 11vh, 5.8rem); padding-bottom: .7rem; }
  .aticma .palabra { font-size: clamp(.95rem, 4.8vw, 1.3rem); }
  .aticma :is(.palabra--2, .palabra--5) { top: 4.2%; }
  .aticma :is(.palabra--3, .palabra--6) { top: 8.4%; }
  .aticma .portada__sobre { margin-bottom: .8rem; }
  .aticma .portada__lema { margin-top: .55rem; }
  .aticma .portada__ahora { margin-top: .65rem; padding: .34rem .9rem; font-size: .84rem; border-radius: 18px; }
  .aticma .portada__dato { margin-top: .75rem; }
  .aticma .portada__botones { margin-top: .85rem; gap: .7rem; flex-wrap: nowrap; }
  .aticma .portada .boton { font-size: 1rem; min-width: 0; padding: .6em .95em; white-space: nowrap; }
  .aticma .cuenta { margin-top: .85rem; }
}

/* ---------- Fotos de cada etapa ---------- */

.fotos__grupo { margin-top: clamp(2rem, 4vw, 3.4rem); scroll-margin-top: calc(var(--alto-barra) + 1rem); }
.fotos__grupo:first-child { margin-top: 0; }
.fotos__grupo h3 { display: flex; flex-wrap: wrap; align-items: baseline; gap: .3rem 1rem; font-family: var(--titulos); font-weight: 600; font-size: clamp(1rem, .9rem + .5vw, 1.3rem); color: var(--fuerte); margin-bottom: 1rem; }
.fotos__grupo h3 small { font-family: var(--cuerpo); font-weight: 400; font-size: .88rem; color: var(--tenue); }
.fotos__grupo h3 small::first-letter { text-transform: uppercase; }
.fotos__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 13.5rem), 1fr)); gap: clamp(.7rem, 1.4vw, 1.1rem); }
.fotos__foto {
  display: block; width: 100%; aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden; cursor: zoom-in; border: 2px solid var(--panel-borde); background: #05070f;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), 0 4px 0 rgba(0, 20, 90, .55), 0 22px 34px -20px #000; transition: transform .45s var(--suave), border-color .3s, box-shadow .45s;
}
.fotos__foto:hover { transform: translateY(-6px) scale(1.02); border-color: var(--cian); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 6px 0 rgba(0, 20, 90, .55), 0 30px 44px -20px rgba(0, 84, 255, .8); }
.fotos__foto img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--suave); }
.fotos__foto:hover img { transform: scale(1.07); }
[data-modo="claro"] .fotos__foto { box-shadow: inset 0 1px 0 #fff, 0 4px 0 #c3cde6, 0 20px 32px -20px rgba(10, 30, 90, .5); }

.ver-fotos { color: var(--cian); font-weight: 500; white-space: nowrap; text-underline-offset: .2em; }
.ver-fotos:hover { color: var(--fuerte); }
.clase__fecha .ver-fotos { margin-left: auto; font-size: .84rem; }

/* El visor: una foto por vez, sin desplazamiento; mientras baja la grande se ve la miniatura, suavizada. */
.visor__foto { flex: 1; min-width: 0; display: grid; place-items: center; }
.visor__foto img { width: auto; height: auto; max-width: 100%; max-height: calc(100dvh - 9.6rem); border-radius: 10px; object-fit: contain; transition: filter .35s; }
.visor__foto img.cargando-foto { width: min(100%, 60rem); filter: blur(6px) saturate(1.1); }

/* El recuadro de fecha y lugar es un enlace al mapa. */
a.portada__dato { position: relative; text-decoration: none; cursor: pointer; transition: transform .35s var(--suave), filter .3s; }
a.portada__dato:hover { --c: var(--lima); transform: translateY(-3px) scale(1.03); filter: drop-shadow(0 0 16px rgba(197, 242, 28, .55)); }
a.portada__dato span { display: inline-flex; align-items: center; gap: .45em; }
a.portada__dato .i { width: 1.15em; height: 1.15em; color: var(--c); }