/* ═══════════════════════════════════════════════
   RETO MARTE — Consolidated Stylesheet
   ═══════════════════════════════════════════════ */

/* ── Variables & Reset ── */
:root {
  --ink: #f8fbff;
  --muted: #9fb1c6;
  --panel: rgba(7,12,20,.74);
  --panel-strong: rgba(9,18,31,.92);
  --line: rgba(126,213,255,.28);
  --cyan: #65e1ff;
  --mint: #72f6b5;
  --amber: #ffbf69;
  --red: #df5a3d;
  --space: #05070d;
  --content-max: 1180px;
  --page-gutter: clamp(1.25rem,6vw,6.5rem);
  --content-gutter: max(var(--page-gutter), calc((100vw - var(--content-max))/2));
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box }
html { scroll-behavior: smooth }
html, body { max-width: 100%; overflow-x: hidden }
body {
  --mx: 0px;
  --my: 0px;
  margin: 0;
  color: var(--ink);
  background: radial-gradient(circle at 85% 12%, rgba(223,90,61,.22), transparent 28rem),
              linear-gradient(180deg, #05070d 0%, #111923 44%, #170c0a 100%);
  min-height: 100vh;
  font-family: "Poppins", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
a { color: inherit; text-decoration: none }
img, canvas { max-width: 100% }
h1, h2, h3, p { margin-top: 0 }
h2 { font-size: clamp(2rem,4.8vw,4.5rem); line-height: 1; letter-spacing: 0 }
h3 { font-size: 1.1rem }
p, .hero-copy, .intro-item p, .mission-card p, .mission-detail p,
.timeline p, .section-heading p, .registration p,
.footer, label, input, select, textarea, button {
  font-family: "Poppins", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
.hero-copy, .intro-item p, .mission-card p, .mission-detail p,
.timeline p, .section-heading p, .registration p {
  font-weight: 400;
  letter-spacing: 0;
  word-spacing: .08em;
}
.eyebrow {
  margin: 0 0 .9rem;
  color: var(--cyan);
  text-transform: uppercase;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .12rem;
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 3.1rem;
  padding: .85rem 1.2rem;
  border-radius: 8px;
  border: 1px solid var(--line);
  font-weight: 800;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.button:hover { transform: translateY(-2px) }
.button.primary {
  color: #031018;
  background: linear-gradient(135deg, var(--cyan), var(--mint));
  box-shadow: 0 0 1.8rem rgba(101,225,255,.25);
}
.button.secondary {
  color: var(--ink);
  background: rgba(255,255,255,.06);
}

/* ── Header & Navigation ── */
.site-header {
  position: fixed;
  z-index: 20;
  top: 0;
  left: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem var(--content-gutter, clamp(1rem,4vw,4.5rem));
  min-height: clamp(4.4rem,6.4vw,5.6rem);
  background: linear-gradient(180deg, rgba(1,10,24,.94), rgba(2,23,47,.54));
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(78,213,255,.18);
}
.brand { display: inline-flex; align-items: center; gap: .7rem; font-weight: 800 }
.brand-logos {
  display: flex;
  align-items: center;
  gap: clamp(.8rem,2vw,1.55rem);
  min-width: 0;
  position: relative;
  isolation: isolate;
}
.brand-logos .brand-logo {
  display: block;
  width: auto;
  object-fit: contain;
  -webkit-user-select: none;
  user-select: none;
  opacity: 0;
  filter: drop-shadow(0 0 .2rem rgba(102,240,255,.18));
  animation: logoMeteorIn .95s cubic-bezier(.18,.9,.24,1.05) forwards;
}
.brand-logo-mars {
  height: clamp(2.05rem,4.2vw,3.15rem);
  max-width: clamp(10.5rem,28vw,22rem);
  transform: translate3d(3rem, 0, 0) scale(.94);
  animation-delay: .56s;
}
.brand-logo-unach {
  height: clamp(2.55rem,5vw,3.9rem);
  max-width: clamp(2.5rem,6vw,4.2rem);
  filter: drop-shadow(0 0 .65rem rgba(255,255,255,.22));
  transform: translate3d(-3rem, 0, 0) scale(.9);
  animation-delay: .08s;
}
.brand-logo-marca {
  height: clamp(2.55rem,5vw,3.9rem);
  max-width: clamp(2.8rem,7vw,4.8rem);
  background: transparent;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  transform: translate3d(0, -2.2rem, 0) scale(.94);
  animation-delay: .24s;
}
.brand-logo-ignite {
  height: clamp(3.8rem, 7.5vw, 5.5rem);
  max-width: clamp(5rem, 12vw, 9rem);
  filter: drop-shadow(0 0 .65rem rgba(255,255,255,.22));
  transform: translate3d(0, 2.2rem, 0) scale(.9);
  animation-delay: .40s;
}
.brand-logos::before,
.brand-logos::after {
  content: "";
  position: absolute;
  top: 50%;
  width: clamp(3rem,9vw,8rem);
  height: 2px;
  pointer-events: none;
  opacity: 0;
  z-index: -1;
  background: linear-gradient(90deg, transparent, rgba(102,240,255,.95), rgba(255,255,255,.82), transparent);
  filter: drop-shadow(0 0 .7rem rgba(102,240,255,.7));
  animation: logoMeteorTrail 1.15s ease-out forwards;
}
.brand-logos::before {
  left: -1rem;
  transform: translate3d(-120%,0,0) rotate(-5deg);
  animation-delay: .02s;
}
.brand-logos::after {
  right: -1rem;
  transform: translate3d(120%,0,0) rotate(5deg);
  animation-delay: .22s;
}
.nav-links { display: flex; align-items: center; gap: clamp(.7rem,2.6vw,2rem); color: #dbe7f3; font-size: .92rem }
.nav-links a { opacity: .82; transition: opacity .25s ease, color .25s ease, text-shadow .25s ease }
.nav-links a:hover,
.nav-links a.active { opacity: 1; color: var(--cyan); text-shadow: 0 0 10px rgba(101, 225, 255, 0.4) }

@keyframes logoMeteorIn {
  0% { opacity: 0; filter: blur(5px) drop-shadow(0 0 1.2rem rgba(102,240,255,.0)) }
  58% { opacity: 1; filter: blur(0) drop-shadow(0 0 1.25rem rgba(102,240,255,.55)) }
  100% { opacity: 1; transform: translate3d(0,0,0) scale(1); filter: drop-shadow(0 0 .45rem rgba(102,240,255,.18)) }
}
@keyframes logoMeteorTrail {
  0% { opacity: 0 }
  18% { opacity: .95 }
  100% { opacity: 0; transform: translate3d(0,0,0) rotate(0deg) }
}

/* ── Main layout ── */
main {
  --page-gutter: clamp(1.25rem,6vw,6.5rem);
  --content-max: 1180px;
  --content-gutter: max(var(--page-gutter), calc((100vw - var(--content-max))/2));
  background: #f7fafc;
  color: #112033;
}
main > section:not(.hero) { scroll-margin-top: 5.2rem }
.section { padding: clamp(4rem,8vw,7rem) var(--content-gutter) }
.section-heading { max-width: 58rem; margin-bottom: 2rem }

/* ── Hero Section ── */
.hero {
  position: relative;
  min-height: 92vh;
  display: grid;
  align-items: center;
  padding: 8rem clamp(1rem,6vw,5rem) 4rem;
  overflow: hidden;
  contain: layout paint;
  color: var(--ink);
  background: #031527;
}
.hero-bg, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100% }
.hero-bg {
  object-fit: cover;
  object-position: center center;
  opacity: 1;
  filter: saturate(1.22) contrast(1.10) brightness(1.06);
  transform-origin: 64% 42%;
  animation: heroMarsApproach 18s ease-in-out infinite;
  will-change: transform, filter;
}
.hero-shade {
  z-index: 3;
  background:
    linear-gradient(90deg, rgba(2,10,24,.94) 0%, rgba(4,20,40,.70) 31%, rgba(3,18,34,.18) 57%, rgba(2,10,24,.02) 100%),
    linear-gradient(180deg, rgba(1,13,31,.08) 0%, rgba(2,22,43,.12) 48%, rgba(3,17,34,.70) 100%),
    radial-gradient(circle at 78% 34%, rgba(255,126,68,.28), transparent 34rem);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 24%, rgba(24,194,255,.14), transparent 18rem),
    repeating-radial-gradient(circle at 72% 33%, rgba(72,209,255,.20) 0 1px, transparent 1px 18px);
  opacity: .26;
  mix-blend-mode: screen;
  mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.82) 42%, rgba(0,0,0,.45) 72%, transparent 100%);
}
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(circle at 80% 38%, rgba(255,126,68,.28), transparent 32rem),
    radial-gradient(circle at 18% 62%, rgba(0,70,130,.10), transparent 20rem);
  opacity: .58;
  mix-blend-mode: screen;
}

/* Hero canvas & grid */
.hero-canvas, .hero-grid { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none }
.hero-canvas {
  z-index: 2;
  mix-blend-mode: screen;
  opacity: .86;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, transparent 43%, rgba(0,0,0,.5) 58%, #000 72%);
  mask-image: linear-gradient(90deg, transparent 0%, transparent 43%, rgba(0,0,0,.5) 58%, #000 72%);
}
.hero-grid {
  z-index: 2;
  background-image:
    linear-gradient(rgba(78,213,255,.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(78,213,255,.12) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(180deg, transparent 0%, #000 28%, transparent 86%);
  transform: perspective(620px) rotateX(62deg) translateY(18%);
  transform-origin: bottom;
  animation: gridDrift 9s linear infinite;
  opacity: .65;
}
.orbital-ring {
  position: absolute;
  z-index: 4;
  border: 1px solid rgba(66,205,255,.34);
  border-radius: 50%;
  transform: rotate(-18deg);
  pointer-events: none;
  box-shadow: 0 0 1.6rem rgba(0,170,255,.18);
  animation: orbitFloat 12s ease-in-out infinite;
}
.ring-one { width: 34rem; height: 12rem; right: 6%; bottom: 20% }
.ring-two {
  width: 18rem; height: 6rem; right: 16%; bottom: 32%;
  border-color: rgba(29,231,255,.30);
  animation-duration: 9s;
  animation-direction: reverse;
}

/* Hero astronaut */
.hero-astronaut {
  position: absolute;
  z-index: 3;
  right: clamp(13rem,18vw,24rem);
  bottom: -5rem;
  width: clamp(13rem,22vw,24rem);
  max-height: 82vh;
  object-fit: contain;
  pointer-events: none;
  opacity: .92;
  filter: drop-shadow(0 0 1rem rgba(255,255,255,.18)) drop-shadow(0 0 2.6rem rgba(101,225,255,.28)) drop-shadow(0 2rem 3rem rgba(0,0,0,.52));
  transform: translate3d(0,0,0) rotate(-1deg);
  animation: astronautFloat 8s ease-in-out infinite;
}

/* Hero content */
.hero-content {
  position: relative;
  z-index: 8;
  max-width: 46rem;
  isolation: isolate;
}
.hero-content > .eyebrow,
.hero-content > h1,
.hero-content > .hero-copy,
.hero-content > .hero-actions { position: relative; z-index: 2 }
.hero-content .eyebrow {
  position: relative;
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  margin-left: .6rem;
  overflow: hidden;
  color: #49d7ff;
  text-shadow: 0 0 .9rem rgba(0,178,255,.34);
}
.hero-content .eyebrow::after {
  content: "";
  position: absolute;
  left: 0; bottom: -.25rem;
  width: 100%; height: 1px;
  background: linear-gradient(90deg, transparent, #65e1ff, transparent);
  transform: translateX(-110%);
  animation: eyebrowSignal 3.2s ease-in-out infinite 1.2s;
}
.hero-content h1 {
  position: relative;
  z-index: 9;
  display: grid;
  gap: .02em;
  max-width: min-content;
  margin-bottom: 1rem;
  font-family: "Nasalization","Michroma","Eurostile Extended","BankGothic Md BT","Bahnschrift",system-ui,sans-serif;
  font-size: clamp(3rem,7.4vw,6.55rem);
  font-weight: 500;
  font-style: normal;
  line-height: .9;
  letter-spacing: .055em;
  text-transform: uppercase;
  color: #fff;
  -webkit-text-fill-color: #fff;
  text-shadow: none;
  -webkit-text-stroke: 0;
  filter: none;
  clip-path: none;
  mix-blend-mode: normal;
  background: none;
  visibility: visible;
  opacity: 1;
  animation: titleCleanMotion 6s ease-in-out infinite;
}
.hero-content h1 span {
  display: block;
  position: relative;
  z-index: 10;
  white-space: nowrap;
  overflow: visible;
  color: #fff;
  -webkit-text-fill-color: #fff;
  text-shadow: none;
  filter: none;
  clip-path: none;
  mix-blend-mode: normal;
  background: none;
  visibility: visible;
  opacity: 1;
  transform: none;
  animation: none;
}
.hero-content h1 span::before,
.hero-content h1 span::after {
  display: none;
  content: none;
}
.hero-content h1 span:first-child { letter-spacing: .105em }
.hero-content h1 span:last-child { letter-spacing: .055em }

/* Hero year badge */
.hero-year {
  position: relative;
  z-index: 10;
  margin: -.35rem 0 1.05rem;
  font-family: "Nasalization","Michroma","Eurostile Extended","BankGothic Md BT","Bahnschrift",system-ui,sans-serif;
  font-size: clamp(1.45rem,3.6vw,3.05rem);
  line-height: 1;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 700;
  color: #ff4a32;
  -webkit-text-fill-color: #ff4a32;
  text-shadow: 0 0 .75rem rgba(255,74,50,.26), 0 0 1.4rem rgba(223,90,61,.16);
}
.hero-year::after {
  content: "";
  display: block;
  width: min(18rem,62vw);
  height: 1px;
  margin: .55rem 0 0;
  background: linear-gradient(90deg, rgba(255,74,50,.92), rgba(66,228,255,.44), transparent);
}

/* Hero copy */
.hero-copy {
  max-width: min(35.5rem,58vw);
  color: #dbeaf6;
  font-size: clamp(.9rem,1.1vw,1.02rem);
  line-height: 1.72;
  font-weight: 500;
  text-align: justify;
  text-justify: inter-word;
}
.hero-copy br {
  content: "";
  display: block;
  margin-top: .65rem;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem }
.hero-actions .button.primary {
  color: #031018;
  background: linear-gradient(135deg, #38d8ff 0%, #66f0ff 46%, #18a7e2 100%);
  border-color: rgba(154,238,255,.82);
  box-shadow: 0 0 1.6rem rgba(0,182,255,.34), inset 0 0 0 1px rgba(255,255,255,.28);
}
.hero-actions .button.secondary {
  background: rgba(4,34,63,.52);
  border-color: rgba(82,214,255,.52);
  color: #eaf8ff;
  box-shadow: inset 0 0 1.2rem rgba(0,178,255,.10), 0 0 1.4rem rgba(0,134,215,.16);
}

/* ── Hero Announcement Card ── */
.hero-announcement {
  position: relative;
  margin: 1.4rem 0 0.2rem;
  max-width: min(36.5rem, 58vw);
  width: 100%;
  padding: 0.95rem 1.25rem;
  border-radius: 10px;
  background: linear-gradient(135deg, rgba(8, 28, 54, 0.88) 0%, rgba(4, 16, 32, 0.82) 100%);
  border: 1px solid rgba(255, 191, 105, 0.55);
  box-shadow: 0 0.8rem 2.2rem rgba(0, 0, 0, 0.45),
              0 0 1.5rem rgba(255, 191, 105, 0.15),
              inset 0 0 1.2rem rgba(101, 225, 255, 0.06);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  overflow: hidden;
  transition: border-color 0.3s ease, box-shadow 0.3s ease, transform 0.3s ease;
}
.hero-announcement::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, #ffbf69 0%, #ff704d 50%, #65e1ff 100%);
  box-shadow: 0 0 10px rgba(255, 191, 105, 0.8);
}
.hero-announcement:hover {
  border-color: rgba(255, 191, 105, 0.85);
  transform: translateY(-2px);
  box-shadow: 0 1rem 2.8rem rgba(0, 0, 0, 0.55),
              0 0 2.2rem rgba(255, 191, 105, 0.25),
              inset 0 0 1.2rem rgba(101, 225, 255, 0.1);
}
.announcement-header {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin-bottom: 0.55rem;
  flex-wrap: wrap;
}
.announcement-pulse {
  width: 0.62rem;
  height: 0.62rem;
  border-radius: 50%;
  background: #ffbf69;
  box-shadow: 0 0 0.8rem rgba(255, 191, 105, 0.95);
  animation: pulseAmber 1.6s infinite ease-in-out;
  flex-shrink: 0;
}
@keyframes pulseAmber {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 191, 105, 0.75);
  }
  70% {
    transform: scale(1.15);
    box-shadow: 0 0 0 8px rgba(255, 191, 105, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 191, 105, 0);
  }
}
.announcement-badge {
  font-family: "Michroma", "Nasalization", ui-sans-serif, sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: #ffbf69;
  text-transform: uppercase;
  text-shadow: 0 0 0.65rem rgba(255, 191, 105, 0.4);
}
.announcement-tag {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #65e1ff;
  background: rgba(101, 225, 255, 0.12);
  border: 1px solid rgba(101, 225, 255, 0.35);
  padding: 0.15rem 0.5rem;
  border-radius: 4px;
}
.announcement-body {
  margin: 0;
  color: #e0eef9;
  font-size: clamp(0.85rem, 1vw, 0.95rem);
  line-height: 1.55;
  font-weight: 400;
}
.announcement-body strong {
  color: #ffd166;
  font-weight: 700;
  text-shadow: 0 0 0.75rem rgba(255, 209, 102, 0.35);
  white-space: nowrap;
}

/* ── Registration Deadline Badge ── */
.registration-deadline-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  margin-top: 1rem;
  padding: 0.55rem 1.1rem;
  border-radius: 999px;
  background: rgba(15, 34, 58, 0.85);
  border: 1px solid rgba(255, 191, 105, 0.4);
  color: #dbeaf6;
  font-size: 0.88rem;
  box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.18);
}
.registration-deadline-badge strong {
  color: #ffbf69;
  font-weight: 700;
}
.deadline-pulse {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: #ffbf69;
  box-shadow: 0 0 0.6rem rgba(255, 191, 105, 0.9);
  animation: pulseAmber 1.6s infinite ease-in-out;
  flex-shrink: 0;
}

/* Hero text reveal (replayable) */
.hero-content .eyebrow,
.hero-content h1 span,
.hero-copy,
.sidebar-announcement,
.hero-announcement,
.hero-actions .button,
.mission-panel { opacity: 1 }
.hero.text-reveal-on .hero-content .eyebrow,
.hero.text-reveal-on .hero-content h1 span,
.hero.text-reveal-on .hero-copy,
.hero.text-reveal-on .sidebar-announcement,
.hero.text-reveal-on .hero-announcement,
.hero.text-reveal-on .hero-actions .button,
.hero.text-reveal-on .mission-panel {
  animation: spaceTextReveal .95s cubic-bezier(.2,.8,.2,1) both !important;
}
.hero.text-reveal-on .hero-content .eyebrow { animation-delay: .05s !important }
.hero.text-reveal-on .hero-content h1 span:first-child { animation-delay: .16s !important }
.hero.text-reveal-on .hero-content h1 span:last-child { animation-delay: .28s !important }
.hero.text-reveal-on .hero-copy { animation-delay: .42s !important }
.hero.text-reveal-on .hero-announcement { animation-delay: .52s !important }
.hero.text-reveal-on .hero-actions .button:first-child { animation-delay: .62s !important }
.hero.text-reveal-on .hero-actions .button:last-child { animation-delay: .72s !important }
.hero.text-reveal-on .hero-sidebar {
  animation: appleFadeUp .68s cubic-bezier(.22,1,.36,1) .08s both !important;
}

/* Mission panel */
.hero-sidebar {
  position: absolute;
  z-index: 3;
  right: clamp(1rem,5vw,5rem);
  bottom: 2rem;
  width: min(24rem, calc(100% - 2rem));
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.mission-panel {
  position: relative;
  width: 100%;
  padding: 1rem;
  border: 1px solid rgba(74,215,255,.55);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(3,18,39,.78), rgba(2,12,27,.72));
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  box-shadow: 0 1.4rem 5rem rgba(0,0,0,.42), 0 0 2.8rem rgba(0,160,235,.18);
  overflow: hidden;
}
.video-panel {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid rgba(74,215,255,.55);
  box-shadow: 0 1.4rem 5rem rgba(0,0,0,.42), 0 0 2.8rem rgba(0,160,235,.18);
  background: #000;
}
.video-panel iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
  background: #000;
}
.video-placeholder img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  opacity: 0.8;
  transition: opacity 0.3s;
}
.video-placeholder:hover img {
  opacity: 1;
}
.video-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 68px;
  height: 48px;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 12px;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s, transform 0.3s;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  cursor: pointer;
}
.video-placeholder:hover .video-play-btn {
  background: #ff0000;
  transform: translate(-50%, -50%) scale(1.05);
}
.video-play-icon {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 18px solid #fff;
  margin-left: 5px;
}

/* Pause animations completely when video is playing */
.video-active #heroCanvas {
  display: none !important;
}
.video-active .hero-bg,
.video-active .hero-grid,
.video-active .orbital-ring,
.video-active .mission-panel::before,
.video-active .pulse {
  animation: none !important;
}
.video-active .mission-panel {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: rgba(3,18,39,0.96) !important;
}
.event-date-inline {
  margin: 0 0 .65rem;
  display: grid;
  gap: .1rem;
}
.event-date-inline span {
  color: #9fb1c6;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.event-date-inline strong {
  color: #7cf0ff;
  font-size: 1.12rem;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: .01em;
  text-shadow: 0 0 .95rem rgba(95,232,255,.36);
}
.event-venue-inline {
  margin: 0 0 0.85rem;
  padding: 0.65rem 0.8rem;
  border-radius: 6px;
  background: rgba(8, 28, 52, 0.5);
  border: 1px solid rgba(104, 224, 255, 0.22);
  display: grid;
  gap: 0.22rem;
}
.event-venue-inline .venue-label {
  color: #9fb1c6;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.event-venue-inline .venue-name {
  color: #ffffff;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: 0.01em;
}
.event-venue-inline .venue-address {
  margin: 0.15rem 0 0;
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  color: #bed5e8;
  font-size: 0.74rem;
  line-height: 1.38;
}
.event-venue-inline .venue-pin-icon {
  width: 0.95rem;
  height: 0.95rem;
  color: #ff704d;
  flex-shrink: 0;
  margin-top: 0.12rem;
  filter: drop-shadow(0 0 4px rgba(255, 112, 77, 0.5));
}
.mission-panel::before {
  content: "";
  position: absolute;
  inset: -1px;
  background: linear-gradient(120deg, transparent 0 28%, rgba(72,218,255,.26) 38%, transparent 52% 100%);
  transform: translateX(-120%);
  animation: panelShine 5s ease-in-out infinite;
  pointer-events: none;
}
.panel-header {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: #66f0ff;
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
}
.pulse {
  width: .68rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background: #66f0ff;
  box-shadow: 0 0 1.1rem rgba(102,240,255,.85);
  animation: pulse 1.4s infinite;
}
.telemetry { display: grid; grid-template-columns: repeat(3,1fr); gap: .65rem; margin: 1rem 0 0 }
.telemetry div {
  padding: .8rem;
  border: 1px solid rgba(104,224,255,.18);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(18,62,94,.34), rgba(255,255,255,.035));
}
.telemetry dt { color: var(--muted); font-size: .72rem }
.telemetry dd { margin: .25rem 0 0; font-size: 1.1rem; font-weight: 900 }
.launch-window {
  position: relative;
  margin-top: .85rem;
  padding: .85rem;
  border: 1px solid rgba(74,215,255,.34);
  border-radius: 8px;
  background: linear-gradient(135deg, rgba(13,91,139,.28), rgba(3,24,48,.62));
  display: grid;
  gap: .15rem;
}
.launch-window span, .launch-window small { color: var(--muted); font-size: .72rem }
.launch-window strong {
  font-size: 1.45rem;
  color: #5fe8ff;
  text-shadow: 0 0 1.1rem rgba(62,216,255,.5);
  font-variant-numeric: tabular-nums;
}
.countdown-row {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0.15rem 0;
}
.countdown-row .clock-icon {
  width: 1.6rem;
  height: 1.6rem;
  color: #5fe8ff;
  filter: drop-shadow(0 0 6px rgba(95,232,255,0.6));
  flex-shrink: 0;
}
.countdown-row strong {
  margin: 0 !important;
}

/* Hero paused state */
.hero-paused .hero-bg { animation-play-state: paused }
.hero-paused .hero-grid,
.hero-paused .orbital-ring,
.hero-paused .mission-panel::before,
.hero-paused .pulse { animation-play-state: paused }
.hero-paused .hero-canvas { opacity: .26 }
.hero-paused .hero-content,
.hero-paused .hero-sidebar { transform: translate3d(0,0,0) }
.hero-paused .hero-astronaut { animation-play-state: paused }

/* ── Intro Band ── */
.intro-band {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: clamp(.85rem,2vw,1.25rem);
  padding: clamp(2rem,4.8vw,3.4rem) var(--content-gutter);
  background: linear-gradient(180deg, #f7fbfe 0%, #edf4f8 100%);
  border-block: 1px solid #dbe7ef;
}
.intro-header {
  grid-column: 1 / -1;
  text-align: center;
  max-width: 840px;
  margin: 0 auto 1.5rem;
}
.intro-header .eyebrow {
  color: #0f9fc2;
  text-shadow: none;
}
.intro-header h2 {
  color: #0c1826;
  font-size: clamp(2rem, 4.6vw, 3.2rem);
  line-height: 1.1;
  margin-bottom: 1rem;
}
.intro-header p {
  color: #35465a;
  font-size: clamp(1rem, 1.3vw, 1.15rem);
  line-height: 1.7;
}
.intro-item {
  position: relative;
  overflow: hidden;
  min-height: 12rem;
  padding: clamp(1.25rem,2.2vw,1.75rem);
}
.intro-item span { color: #ff704d }
.intro-item strong { display: block; margin: .45rem 0; font-size: 1.35rem; color: #ffffff }
.intro-item p { color: #d9efff; line-height: 1.62 }

/* ── STEAM White Section ── */
.steam-white-section {
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  gap: clamp(1.6rem,3vw,2.6rem);
  padding: clamp(4rem,7vw,6rem) var(--content-gutter);
  background: #ffffff;
  border-block: 0;
}
.steam-copy {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 100%;
  text-align: left;
}
.steam-copy .eyebrow {
  color: #0f9fc2;
  margin-bottom: .75rem;
  text-shadow: none;
}
.steam-copy h2 {
  color: #0c1826;
  font-size: clamp(2rem,4.6vw,4rem);
  line-height: 1.02;
  margin-bottom: 1rem;
}
.steam-copy p:not(.eyebrow) {
  color: #35465a;
  font-size: clamp(.98rem,1.25vw,1.12rem);
  line-height: 1.75;
  font-weight: 400;
  text-align: justify;
}
.steam-white-image {
  position: relative;
  z-index: 1;
  display: block;
  width: min(1200px,98vw);
  max-width: 100%;
  height: auto;
  object-fit: contain;
  filter: none;
  animation: none;
  transform: none;
}
.steam-white-image.steam-enter {
  animation: steamSlideInRight 1s cubic-bezier(.2,.8,.2,1) both;
}

/* ── Participation Rules ── */
.participation-rules {
  position: relative;
  overflow: hidden;
  display: block;
  padding: clamp(4rem,7vw,6rem) var(--content-gutter);
  min-height: clamp(40rem,72vw,54rem);
  background: #ffffff;
  color: #102032;
}
.participation-rules::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 8% 10%, rgba(66,228,255,.14), transparent 22rem),
    radial-gradient(circle at 95% 22%, rgba(0,112,185,.10), transparent 20rem),
    linear-gradient(135deg, rgba(8,31,53,.035) 0 1px, transparent 1px),
    linear-gradient(45deg, rgba(8,31,53,.025) 0 1px, transparent 1px);
  background-size: auto, auto, 24px 24px, 32px 32px;
}
#misiones, #evaluacion, .registration {
  padding-left: var(--content-gutter);
  padding-right: var(--content-gutter);
}
.rules-content {
  position: relative;
  z-index: 1;
  max-width: min(1080px,100%);
  margin: 0 auto;
}
.rules-content .eyebrow { color: #0f6fa5; text-shadow: none; margin-bottom: .9rem }
.rules-content h2 {
  position: relative;
  z-index: 2;
  color: #071526;
  max-width: min(42rem,52vw);
  font-size: clamp(2.15rem,5vw,5rem);
  line-height: 1.02;
  margin-bottom: clamp(1.8rem,3vw,2.6rem);
}
.rules-text {
  max-width: 1000px;
  color: #26384e;
  font-family: "Poppins", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas:
    "denied denied"
    "mode mode"
    "work tools";
  gap: clamp(1.35rem,2.8vw,2.25rem) clamp(2rem,4vw,3.4rem);
  align-items: start;
}
.rules-block { min-width: 0 }
.rules-block-denied { grid-area: denied; max-width: min(890px,74vw) }
.rules-block-mode { grid-area: mode }
.rules-block-work { grid-area: work }
.rules-block-tools { grid-area: tools; align-self: start }
.rules-block h3 {
  margin: 0 0 .65rem;
  padding-top: 1.15rem;
  border-top: 1px solid #dce8f0;
}
.rules-block-tools h3,
.rules-block-work h3 {
  min-height: calc(2.5em + 1.15rem);
}
.rules-block p, .rules-block ul { margin-top: 0; margin-bottom: 0 }
.rules-text h3 {
  margin: 0 0 .55rem;
  color: #0b2948;
  font-size: clamp(1.12rem,1.8vw,1.35rem);
  line-height: 1.25;
}
.rules-text p, .rules-text li {
  color: #35465a;
  font-size: clamp(.96rem,1.15vw,1.08rem);
  line-height: 1.72;
  font-weight: 400;
}
.rules-text p { margin-bottom: .65rem; text-align: left }
.rules-text strong { color: #df5a3d; font-weight: 700 }
.rules-text ul {
  display: grid;
  gap: .55rem;
  margin: .3rem 0 .85rem;
  padding: 0;
  list-style: none;
}
.rules-text li { position: relative; padding-left: 1.55rem }
.rules-text li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .72em;
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: linear-gradient(135deg, #0f9fc2, #df5a3d);
  box-shadow: 0 0 .8rem rgba(15,159,194,.24);
}

/* Floating meteor */
.meteor-hero {
  --rx: 0deg;
  --ry: 0deg;
  --tx: 0px;
  --ty: 0px;
  --sx: 50%;
  --sy: 42%;
  position: absolute;
  z-index: 1;
  right: clamp(-4.5rem,-3vw,-1.4rem);
  top: clamp(.8rem,2.6vw,2.2rem);
  width: clamp(13rem,24vw,24rem);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  pointer-events: auto;
  perspective: 900px;
  transform-style: preserve-3d;
  transform: translate3d(var(--tx), var(--ty), 0) translateZ(0);
  will-change: transform;
  backface-visibility: hidden;
  animation: meteorFloat 8.8s ease-in-out infinite;
  contain: layout paint style;
}
.meteor-hero::before {
  content: "";
  position: absolute;
  inset: 12%;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, rgba(83,209,255,.20), rgba(83,209,255,.08) 34%, transparent 70%);
  filter: blur(12px);
  transform: translateZ(-80px);
  opacity: .82;
  pointer-events: none;
}
.meteor-hero::after {
  content: "";
  position: absolute;
  inset: 20% 18% 10%;
  border-radius: 50%;
  background: radial-gradient(ellipse at 50% 62%, rgba(7,21,38,.24), rgba(7,21,38,.12) 34%, transparent 68%);
  filter: blur(18px);
  transform: translate3d(calc(var(--tx) * -.18), calc(var(--ty) * -.12 + 1.1rem), -120px) scale(1.05);
  opacity: .7;
  pointer-events: none;
  will-change: transform, opacity;
}
.meteor-img {
  position: relative;
  z-index: 3;
  width: 88%;
  height: auto;
  object-fit: contain;
  transform: translateZ(86px) rotateX(var(--rx)) rotateY(var(--ry));
  transform-style: preserve-3d;
  will-change: transform, filter;
  backface-visibility: hidden;
  filter: drop-shadow(calc(var(--tx) * -.18) calc(var(--ty) * -.14 + 1.2rem) 1.3rem rgba(7,21,38,.28)) drop-shadow(0 0 1.5rem rgba(52,190,255,.18));
}
.meteor-glow {
  position: absolute;
  z-index: 4;
  inset: 20%;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle at var(--sx) var(--sy), rgba(255,255,255,.52), rgba(129,230,255,.22) 18%, transparent 45%);
  mix-blend-mode: screen;
  opacity: .72;
  transform: translateZ(120px);
  will-change: background, transform, opacity;
}
.meteor-dust {
  position: absolute;
  z-index: 2;
  width: .42rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(62,191,255,.72);
  box-shadow: 0 0 .8rem rgba(62,191,255,.55);
  pointer-events: none;
  will-change: transform, opacity;
  animation: meteorDustOrbit 7.5s ease-in-out infinite;
}
.dust-one { left: 18%; top: 27%; animation-delay: 0s }
.dust-two { right: 18%; top: 20%; width: .3rem; animation-delay: 1.1s }
.dust-three { left: 24%; bottom: 22%; width: .34rem; animation-delay: 2.2s }
.dust-four { right: 24%; bottom: 30%; width: .26rem; animation-delay: 3.1s }

/* ── Timeline / Programa Section ── */
.timeline-section {
  position: relative;
  overflow: hidden;
  min-height: 46rem;
  color: #fff;
  background: linear-gradient(90deg, #05070d 0%, #08101b 44%, #120b08 100%);
  isolation: isolate;
}
.timeline-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background:
    radial-gradient(circle at 70% 42%, rgba(255,174,104,.18), transparent 22rem),
    linear-gradient(90deg, rgba(5,7,13,.96), rgba(5,7,13,.62) 46%, rgba(5,7,13,.16) 100%);
}
.mars3d-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none }
.mars3d-stars {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    radial-gradient(circle, rgba(255,255,255,.7) 0 1px, transparent 1.7px),
    radial-gradient(circle, rgba(101,225,255,.55) 0 1px, transparent 1.6px);
  background-size: 130px 90px, 190px 140px;
  background-position: 12px 20px, 70px 30px;
  opacity: .32;
  mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.68) 50%, transparent 88%);
}
.timeline-section .section-heading,
.timeline-section .timeline { position: relative; z-index: 2 }
.timeline-section .section-heading { max-width: 51rem }
.timeline-section .timeline { max-width: 62rem }
.timeline-section .eyebrow { color: #65e1ff }
.timeline-section .section-heading p,
.timeline-section .timeline p { color: #d7e4ee }
.timeline-section h2 { color: #fff; text-shadow: 0 0 2.5rem rgba(0,0,0,.5) }
.program-satellite {
  position: absolute;
  z-index: 1;
  top: clamp(2.8rem,6vw,5.5rem);
  right: clamp(1rem,6vw,7rem);
  width: clamp(11rem,20vw,19rem);
  pointer-events: none;
  opacity: .88;
  transform: rotate(-15deg) translate3d(0,0,0);
  filter: drop-shadow(0 0 .55rem rgba(255,255,255,.16)) drop-shadow(0 0 1.9rem rgba(101,225,255,.26)) drop-shadow(0 1.2rem 2.4rem rgba(0,0,0,.56));
  animation: satelliteOrbitDrift 13s ease-in-out infinite;
}
.program-satellite:where(img) { 
  -webkit-user-select: none;
  user-select: none;
}
.timeline {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  border-top: 1px solid rgba(101,225,255,.42);
}
.timeline article {
  position: relative;
  padding: 2rem 1.2rem 0;
  background: linear-gradient(180deg, rgba(7,12,20,.42), rgba(7,12,20,.12));
  border-radius: 8px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(101,225,255,.12);
}
.timeline article::before {
  content: "";
  position: absolute;
  top: -.45rem;
  left: 1.2rem;
  width: .85rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 1rem var(--cyan);
}
.timeline span { color: #ffbf69; font-weight: 900; font-size: .8rem }
.timeline h3 { color: #fff }
.timeline p { color: #d7e4ee }

/* ── Evaluation ── */
#evaluacion {
  background:
    radial-gradient(circle at 12% 0%, rgba(101,225,255,.13), transparent 20rem),
    linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
  color: #102032;
}
#evaluacion .section-heading { max-width: 42rem }
#evaluacion .section-heading h2 { color: #0c1826 }
#evaluacion .section-heading p { color: #526277 }
#evaluacion .eyebrow { color: #0f9fc2 }
.split {
  display: grid;
  grid-template-columns: minmax(0,1.05fr) minmax(19rem,.95fr);
  gap: clamp(1.5rem,5vw,5rem);
  align-items: center;
}
.score-row { display: grid; gap: .65rem; padding: 1rem 0 }
.score-row span { color: #102032; font-weight: 800 }
meter { width: 100%; height: .8rem }
meter::-webkit-meter-bar { background: rgba(255,255,255,.08); border: none; border-radius: 99px }
meter::-webkit-meter-optimum-value { border-radius: 99px; background: linear-gradient(90deg, var(--red), var(--amber), var(--cyan)) }

/* ── Registration ── */
.registration {
  position: relative;
  overflow: hidden;
  padding: clamp(4rem,8vw,7rem) var(--content-gutter);
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%);
  color: #1f3347;
}
.registration::before {
  content: "";
  position: absolute;
  left: var(--content-gutter);
  right: var(--content-gutter);
  top: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(15,159,194,.38), transparent);
}
.registration .eyebrow { color: #0f9fc2 }
.registration-intro {
  width: min(980px, 100%);
  margin: 0 auto 1.4rem;
}
.registration-intro h2 { color: #0c1826 }
.registration-intro p { color: #526277 }

/* Form Styles */
.signup-form {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
  width: min(1100px, 100%);
  margin: 0 auto;
  padding: clamp(1.2rem,2.5vw,1.9rem);
  border: 1px solid #d8e5ef;
  border-radius: 16px;
  background: #ffffff;
  box-shadow: 0 .9rem 2.2rem rgba(15,39,61,.08);
}

.institution-selector {
  display: grid;
  gap: 1rem;
}

.institution-selector h3 {
  margin: 0;
  color: #1b3046;
  font-size: clamp(1.4rem,2.3vw,2rem);
}

.institution-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.institution-card {
  display: grid;
  justify-items: center;
  gap: .6rem;
  min-height: 10rem;
  padding: 1rem;
  border: 1px solid #d9e6ef;
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff 0%, #f9fcff 100%);
  color: #1a2837;
  text-align: center;
  box-shadow: 0 .8rem 1.8rem rgba(15,39,61,.05);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
  cursor: pointer;
}

.institution-card:hover {
  transform: translateY(-2px);
  border-color: #b8d7ea;
  box-shadow: 0 1rem 2rem rgba(15,39,61,.08);
}

.institution-card:disabled,
.institution-card:disabled:hover {
  cursor: default;
  transform: none;
  border-color: #d9e6ef;
  box-shadow: 0 .8rem 1.8rem rgba(15,39,61,.05);
}

.institution-card.is-active {
  border-color: #bfcfdc;
  box-shadow: 0 0 0 1px rgba(15,159,194,.08), 0 1rem 2rem rgba(15,39,61,.08);
}

.institution-icon {
  display: inline-grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  border-radius: 999px;
  background: #f2f8fc;
  font-size: 1.55rem;
}

.institution-logo {
  width: min(100%, 18rem);
  height: auto;
  max-height: 8.5rem;
  object-fit: contain;
  display: block;
}

.institution-card strong {
  font-size: clamp(1.35rem,2.1vw,1.8rem);
  font-weight: 700;
  color: #171e26;
}

.institution-card small {
  color: #636e79;
  font-size: 1rem;
  line-height: 1.45;
}

.institution-empty {
  display: grid;
  place-items: center;
  min-height: 4.5rem;
  border: 1px dashed #d9e6ef;
  border-radius: 16px;
  background: #fbfdff;
}

.institution-empty[hidden] {
  display: none !important;
}

.institution-empty p {
  margin: 0;
  color: #678095;
  text-align: center;
}

.institution-panel {
  display: grid;
  gap: 1rem;
  border: 1px solid #e1ecf4;
  border-radius: 16px;
  padding: 1rem;
  background: #fcfeff;
  animation: stepReveal .28s ease;
}

.institution-panel[hidden] {
  display: none !important;
}

.panel-heading {
  display: grid;
  gap: .3rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid #e4eef5;
}

.panel-kicker {
  margin: 0;
  color: #6b859a;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.institution-panel h3 {
  margin: 0;
  color: #0f9fc2;
  font-size: 1.25rem;
  text-transform: uppercase;
  letter-spacing: .03em;
}

.step-grid {
  display: grid;
  gap: .9rem;
}

.step-grid.cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.step-grid label {
  display: grid;
  gap: .5rem;
}

.step-grid label.full {
  grid-column: 1 / -1;
}

.inline-field-group {
  display: grid;
  grid-template-columns: minmax(0, 1.8fr) minmax(6.5rem, .7fr);
  gap: .75rem;
  align-items: end;
}

.inline-field-group label {
  min-width: 0;
}

.age-field input {
  text-align: center;
  font-weight: 700;
  color: #0f9fc2;
  background: #f3fbff;
}

.age-field input::placeholder {
  color: #89a3b8;
}

.field-label {
  color: #1d3a54;
  font-size: .95rem;
  font-weight: 700;
  letter-spacing: .01em;
}

.field-label em {
  color: #ff704d;
  font-style: normal;
}

.checkline {
  grid-template-columns: auto 1fr;
  align-items: start;
  column-gap: .65rem;
  background: #f6fbff;
  border: 1px solid #d7e9f5;
  border-radius: 10px;
  padding: .85rem .9rem;
}

.checkline input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  margin-top: .15rem;
}

.form-submit-row {
  display: flex;
  justify-content: center;
  padding-top: .25rem;
}

.institution-submit {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-width: clamp(15rem, 38vw, 21rem);
}

.stepper-submit-icon {
  font-size: 1.05rem;
  line-height: 1;
}

/* ── App Dialog ── */
.app-dialog[hidden] {
  display: none !important;
}

.app-dialog {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 1rem;
}

.app-dialog__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(5, 18, 34, .48);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}

.app-dialog__card {
  position: relative;
  z-index: 1;
  width: min(30rem, calc(100vw - 2rem));
  padding: 1.1rem 1.1rem 1rem;
  border-radius: 14px;
  border: 1px solid rgba(122, 214, 255, .42);
  background: linear-gradient(180deg, rgba(248, 252, 255, .98), rgba(238, 248, 255, .95));
  box-shadow: 0 1.1rem 2.8rem rgba(12, 36, 59, .26), 0 0 1.9rem rgba(42, 177, 244, .16);
  color: #102032;
  animation: appDialogPop .26s cubic-bezier(.2,.8,.2,1);
}

.app-dialog__header {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .5rem;
}

.app-dialog__status-dot {
  width: .58rem;
  height: .58rem;
  border-radius: 999px;
  background: #1fb1d8;
  box-shadow: 0 0 .8rem rgba(31, 177, 216, .48);
}

.app-dialog__card h3 {
  margin: 0;
  font-size: 1.04rem;
  color: #0f2d48;
}

.app-dialog__message {
  margin: 0;
  color: #36506a;
  font-size: .97rem;
  line-height: 1.55;
}

.app-dialog__actions {
  margin-top: .9rem;
  display: flex;
  justify-content: flex-end;
}

.app-dialog__button {
  border: 1px solid rgba(15, 159, 194, .52);
  border-radius: 999px;
  background: linear-gradient(135deg, #1cb0d9, #42d6ff);
  color: #032031;
  font-weight: 800;
  font-size: .9rem;
  padding: .52rem 1rem;
  cursor: pointer;
}

.app-dialog--error .app-dialog__status-dot {
  background: #ff6a53;
  box-shadow: 0 0 .8rem rgba(255, 106, 83, .52);
}

.app-dialog--error .app-dialog__button {
  border-color: rgba(210, 74, 52, .45);
  background: linear-gradient(135deg, #ff7a61, #ff9c88);
  color: #3b1108;
}

@keyframes appDialogPop {
  from { opacity: 0; transform: translate3d(0, 14px, 0) scale(.98) }
  to { opacity: 1; transform: translate3d(0, 0, 0) scale(1) }
}

@keyframes stepReveal {
  from { opacity: 0; transform: translateY(6px) }
  to { opacity: 1; transform: translateY(0) }
}

/* ── Footer ── */
.footer {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.4rem var(--content-gutter);
  background: #ffffff;
  border-top: 1px solid #dce8f0;
  color: #526277;
}
.footer span:first-child { color: #102032; font-weight: 900 }

/* ── Convocatoria-style futuristic cards ── */
.intro-item,
.mission-card,
.mission-detail,
.score-board {
  --panel-cyan: #42e4ff;
  --panel-blue: #06223b;
  --panel-orange: #df5a3d;
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(66,228,255,.72);
  border-radius: 0;
  clip-path: polygon(1.2rem 0, calc(100% - .65rem) 0, 100% .65rem, 100% calc(100% - 1.2rem), calc(100% - 1.2rem) 100%, .65rem 100%, 0 calc(100% - .65rem), 0 1.2rem);
  background:
    linear-gradient(120deg, rgba(9,42,72,.96) 0%, rgba(5,26,49,.92) 42%, rgba(11,55,86,.94) 52%, rgba(3,18,37,.9) 100%);
  background-size: 220% 100%;
  color: #f4fbff;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06) inset,
    0 0 0 2px rgba(66,228,255,.13) inset,
    0 1.35rem 3rem rgba(4,22,42,.20),
    0 0 2.2rem rgba(0,192,255,.16);
  transform: translateY(1rem);
  opacity: .72;
  transition:
    opacity .75s cubic-bezier(.2,.8,.2,1),
    transform .75s cubic-bezier(.2,.8,.2,1),
    border-color .22s ease,
    box-shadow .22s ease;
  animation: techPanelBreath 7s ease-in-out infinite, cardEnergyFlow 8s ease-in-out infinite;
  will-change: transform, box-shadow, background-position;
}

.intro-item.is-visible,
.mission-card.is-visible,
.mission-detail.is-visible,
.score-board.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.intro-item:nth-child(2) { animation-delay: .35s }
.intro-item:nth-child(3) { animation-delay: .7s }

/* Inner grid line pseudo-element */
.intro-item::before,
.mission-card::before,
.mission-detail::before,
.score-board::before {
  content: "";
  position: absolute;
  inset: .55rem;
  z-index: 0;
  pointer-events: none;
  border: 1px solid rgba(66,228,255,.36);
  clip-path: polygon(.9rem 0, calc(100% - .5rem) 0, 100% .5rem, 100% calc(100% - .9rem), calc(100% - .9rem) 100%, .5rem 100%, 0 calc(100% - .5rem), 0 .9rem);
  background:
    linear-gradient(90deg, rgba(66,228,255,.22) 0 1px, transparent 1px 30px),
    linear-gradient(180deg, rgba(66,228,255,.12) 0 1px, transparent 1px 30px);
  background-position: 0 0, 0 0;
  opacity: .48;
  transition: opacity .2s ease;
  box-shadow:
    inset 0 0 1.4rem rgba(66,228,255,.08),
    0 0 1.1rem rgba(66,228,255,.12);
  animation: panelCircuitDrift 9s linear infinite;
}

.signup-form::before { display: none }

/* Light sweep pseudo-element */
.intro-item::after,
.mission-card::after,
.mission-detail::after,
.score-board::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: -40%;
  bottom: auto;
  left: -42%;
  right: auto;
  width: 34%;
  height: 180%;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(104,238,255,.0) 18%, rgba(104,238,255,.26) 46%, rgba(255,255,255,.30) 52%, rgba(255,112,77,.14) 62%, transparent 100%);
  filter: blur(.2px);
  transform: skewX(-18deg) translateX(0);
  animation: cardLightSweep 4.8s ease-in-out infinite;
}
.intro-item:nth-child(2)::after { animation-delay: .45s }
.intro-item:nth-child(3)::after { animation-delay: .9s }

/* Card children z-index */
.intro-item > *,
.mission-card > *,
.mission-detail > *,
.score-board > * { position: relative; z-index: 1 }

.signup-form > * { position: relative; z-index: 2 }

/* Card text colors */
.intro-item strong, .mission-card h3, .mission-detail strong,
.score-row span { color: #ffffff }
.intro-item p, .mission-card p, .mission-detail p,
.score-board { color: #d9efff }
.mission-detail span, .timeline span { color: #ff704d }

/* Card hover */
.intro-item:hover,
.mission-card:hover,
.mission-detail:hover,
.score-board:hover {
  transform: translateY(-6px) scale(1.012);
  border-color: rgba(120,244,255,1);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.12) inset,
    0 1.65rem 3.6rem rgba(2,22,42,.28),
    0 0 3.1rem rgba(0,209,255,.34);
}
.intro-item:hover::before,
.mission-card:hover::before,
.score-board:hover::before { opacity: .82 }
.intro-item:hover::after,
.mission-card:hover::after,
.mission-detail:hover::after,
.score-board:hover::after { animation-duration: 2.6s }

/* Form hover - subtle effect */
.signup-form:hover {
  border-color: #c7dceb;
  box-shadow: 0 1rem 2.2rem rgba(15,39,61,.1);
}
.signup-form:hover::before { opacity: 1 }

/* Card icon */
.card-icon {
  display: grid;
  place-items: center;
  width: 2.4rem;
  aspect-ratio: 1;
  margin-bottom: 1.2rem;
  background: rgba(66,228,255,.10);
  border: 1px solid rgba(66,228,255,.62);
  color: #66f0ff;
  border-radius: 0;
  clip-path: polygon(.45rem 0, 100% 0, 100% calc(100% - .45rem), calc(100% - .45rem) 100%, 0 100%, 0 .45rem);
  box-shadow: 0 0 1.2rem rgba(66,228,255,.22);
  font-weight: 900;
  animation: iconTelemetryPulse 3.6s ease-in-out infinite;
}
.mission-card:nth-child(even) .card-icon { animation-delay: .45s }

/* Score row borders */
.score-row + .score-row { border-top: 1px solid rgba(66,228,255,.18) }
.score-board meter { filter: drop-shadow(0 0 .45rem rgba(66,228,255,.25)) }

/* Form inputs */
.signup-form input,
.signup-form select,
.signup-form textarea {
  color: #203649;
  background: #ffffff;
  border: 1px solid #c9dced;
  border-radius: 8px;
  transition: all .25s cubic-bezier(.4,0,.2,1);
  box-shadow: inset 0 1px 2px rgba(12,35,54,.05);
}

.signup-form input::placeholder,
.signup-form textarea::placeholder {
  color: #7f97ac;
  font-weight: 400;
}

.signup-form input:focus,
.signup-form select:focus,
.signup-form textarea:focus {
  outline: 0;
  border-color: #0f9fc2;
  background: #ffffff;
  box-shadow: 
    0 0 0 3px rgba(15,159,194,.15), 
    0 3px 10px rgba(15,159,194,.08),
    inset 0 1px 2px rgba(12,35,54,.04);
  transform: none;
}

.signup-form .button.primary {
  background: linear-gradient(135deg, #42e4ff 0%, #18a7e2 100%);
  color: #031018;
  border: none;
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: .02em;
  margin-top: .5rem;
  box-shadow: 
    0 4px 16px rgba(66,228,255,.28),
    inset 0 1px 1px rgba(255,255,255,.25);
  transition: all .3s cubic-bezier(.4,0,.2,1);
}

.signup-form .button.primary:hover {
  background: linear-gradient(135deg, #5eeeff 0%, #22b8f3 100%);
  box-shadow: 
    0 6px 24px rgba(66,228,255,.4),
    inset 0 1px 1px rgba(255,255,255,.35);
  transform: translateY(-2px);
}

.signup-form .button.primary:active {
  transform: translateY(0);
  box-shadow: 
    0 2px 8px rgba(66,228,255,.3),
    inset 0 1px 2px rgba(0,0,0,.1);
}

.signup-form .institution-submit {
  border-radius: 999px;
  text-transform: uppercase;
  letter-spacing: .02em;
}

input, select, textarea {
  width: 100%;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  padding: .85rem .95rem;
  color: var(--ink);
  background: rgba(255,255,255,.06);
  font: inherit;
  transition: all .2s ease;
}

/* ── Keyframe Animations ── */
@keyframes pulse {
  0%, 100% { opacity: .55; transform: scale(.82) }
  50% { opacity: 1; transform: scale(1.05) }
}
@keyframes heroMarsApproach {
  0%, 100% {
    filter: saturate(1.12) contrast(1.06) brightness(.98);
    transform: scale(1.035) translate3d(calc(var(--mx)*-.01), calc(var(--my)*-.01), 0);
  }
  48% {
    filter: saturate(1.22) contrast(1.1) brightness(1.08);
    transform: scale(1.16) translate3d(calc(var(--mx)*-.014 - 1.2rem), calc(var(--my)*-.014 - .55rem), 0);
  }
  72% {
    filter: saturate(1.18) contrast(1.08) brightness(1.03);
    transform: scale(1.1) translate3d(calc(var(--mx)*-.012 - .45rem), calc(var(--my)*-.012 - .2rem), 0);
  }
}
@keyframes gridDrift { from { background-position: 0 0 } to { background-position: 0 72px } }
@keyframes orbitFloat {
  0%, 100% { translate: 0 0; opacity: .55 }
  50% { translate: 0 -1.2rem; opacity: .95 }
}
@keyframes panelShine {
  0%, 55% { transform: translateX(-120%) }
  75%, 100% { transform: translateX(120%) }
}
@keyframes astronautFloat {
  0%, 100% { transform: translate3d(0,0,0) rotate(-1deg) }
  50% { transform: translate3d(0,-.75rem,0) rotate(.25deg) }
}
@keyframes astronautMobileFloat {
  0%, 100% { transform: translate3d(0,0,0) rotate(-2deg) }
  50% { transform: translate3d(0,-.45rem,0) rotate(-.4deg) }
}
@keyframes titleCleanMotion {
  0%, 100% { transform: translate3d(0,0,0); letter-spacing: .055em }
  50% { transform: translate3d(.18rem,0,0); letter-spacing: .064em }
}
@keyframes titleCleanMotionMobile {
  0%, 100% { transform: translate3d(0,0,0); letter-spacing: .025em }
  50% { transform: translate3d(.08rem,0,0); letter-spacing: .032em }
}
@keyframes steamSlideInRight {
  0% {
    opacity: 0;
    transform: translate3d(min(44vw, 34rem),0,0) scale(.9) skewX(-3deg);
  }
  28% {
    opacity: .78;
    transform: translate3d(min(22vw, 16rem),0,0) scale(.95) skewX(-1.2deg);
  }
  62% {
    opacity: 1;
    transform: translate3d(-14px,0,0) scale(1.015) skewX(.2deg);
  }
  100% {
    opacity: 1;
    transform: translate3d(0,0,0) scale(1) skewX(0);
  }
}
@keyframes spaceTextReveal {
  from { opacity: 0; transform: translate3d(0,1rem,0); clip-path: inset(0 0 100% 0); filter: blur(6px) }
  60% { opacity: 1; filter: blur(0) }
  to { opacity: 1; transform: translate3d(0,0,0); clip-path: inset(0 0 0 0); filter: blur(0) }
}
@keyframes spacePanelReveal {
  from { opacity: 0; transform: translate3d(1.2rem,1rem,0) scale(.985); filter: blur(7px) }
  to { opacity: 1; transform: translate3d(0,0,0) scale(1); filter: blur(0) }
}
@keyframes appleFadeUp {
  from { opacity: 0; transform: translate3d(0,22px,0) }
  to { opacity: 1; transform: translate3d(0,0,0) }
}
@keyframes eyebrowSignal {
  0%, 55% { transform: translateX(-110%); opacity: 0 }
  70% { opacity: .9 }
  100% { transform: translateX(110%); opacity: 0 }
}
@keyframes heroMarsGlow {
  0%, 100% { opacity: .58; transform: translate3d(0,0,0) }
  50% { opacity: .9; transform: translate3d(.8rem,-.35rem,0) }
}
@keyframes satelliteOrbitDrift {
  0%, 100% { transform: translate3d(0,0,0) rotate(-15deg) scale(1) }
  34% { transform: translate3d(-1.8rem,.75rem,0) rotate(-10deg) scale(1.035) }
  68% { transform: translate3d(.85rem,-.9rem,0) rotate(-18deg) scale(.98) }
}
@keyframes meteorFloat {
  0%, 100% { translate: 0 0; rotate: .001deg }
  50% { translate: 0 -10px; rotate: 1.2deg }
}
@keyframes meteorDustOrbit {
  0%, 100% { opacity: .28; transform: translate3d(0,0,24px) scale(.86) }
  50% { opacity: .92; transform: translate3d(12px,-12px,70px) scale(1.12) }
}
@keyframes techPanelBreath {
  0%, 100% { box-shadow: 0 0 0 1px rgba(255,255,255,.06) inset, 0 0 0 2px rgba(66,228,255,.12) inset, 0 1.35rem 3rem rgba(4,22,42,.20), 0 0 2.2rem rgba(0,192,255,.14) }
  50% { box-shadow: 0 0 0 1px rgba(255,255,255,.09) inset, 0 0 0 2px rgba(66,228,255,.20) inset, 0 1.45rem 3.2rem rgba(4,22,42,.22), 0 0 2.8rem rgba(0,192,255,.24) }
}
@keyframes cardEnergyFlow {
  0%, 100% { background-position: 0% 50% }
  50% { background-position: 100% 50% }
}
@keyframes cardLightSweep {
  0%, 42% { left: -42%; opacity: 0 }
  52% { opacity: .85 }
  72%, 100% { left: 118%; opacity: 0 }
}
@keyframes panelCircuitDrift {
  from { background-position: 0 0, 0 0 }
  to { background-position: 60px 0, 0 60px }
}
@keyframes iconTelemetryPulse {
  0%, 100% { transform: translateY(0); box-shadow: 0 0 1.2rem rgba(66,228,255,.18) }
  50% { transform: translateY(-2px); box-shadow: 0 0 1.8rem rgba(66,228,255,.34) }
}

/* ── Responsive: Desktop+ (min-width: 901px) ── */
@media (min-width: 901px) {
  .hero-astronaut {
    right: clamp(21rem,30vw,34rem);
    bottom: -3.6rem;
    opacity: .96;
    z-index: 4;
  }
  .mission-panel { z-index: 5 }
  .rules-text h3:nth-of-type(2),
  .rules-text h3:nth-of-type(2) + ul { grid-column: 1 }
  .rules-text h3:nth-of-type(3),
  .rules-text h3:nth-of-type(3) + p,
  .rules-text h3:nth-of-type(3) + p + ul { grid-column: 2 }
}
@media (min-width: 901px) and (max-width: 1180px) {
  .hero-astronaut {
    right: clamp(17rem,28vw,24rem);
    width: clamp(12rem,22vw,18rem);
  }
  .hero-copy { max-width: min(32rem,54vw) }
}
@media (min-width: 1200px) {
  .meteor-hero { right: clamp(-6rem,-4vw,-2.5rem) }
}

/* ── Responsive: Tablet (max-width: 900px) ── */
@media (max-width: 900px) {
  .nav-links { display: none }
  .site-header { min-height: 4.5rem; padding: 0.85rem 1.2rem }
  .brand-logos { width: 100%; justify-content: space-between; gap: .6rem }
  .brand-logo-mars { height: 2.4rem; max-width: 15rem }
  .brand-logo-unach { height: 3.1rem; max-width: 3.5rem }
  .brand-logo-marca { height: 3.1rem; max-width: 3.5rem }
  .brand-logo-ignite { height: 3.6rem; max-width: 5.5rem }

  .hero {
    min-height: auto;
    padding: 6.3rem clamp(.95rem,4vw,1.4rem) 2rem;
    align-items: start;
    display: flex;
    flex-direction: column;
  }
  .hero-bg {
    transform: scale(1.08);
    animation: none;
    object-position: 61% center;
    filter: saturate(1.14) contrast(1.04) brightness(1.02);
  }
  .hero-shade {
    background:
      linear-gradient(180deg, rgba(1,14,32,.18) 0%, rgba(2,24,47,.52) 48%, rgba(3,17,34,.82) 100%),
      linear-gradient(90deg, rgba(2,16,35,.74), rgba(0,70,120,.04));
  }
  .hero::before { opacity: .28; mask-image: linear-gradient(180deg, transparent 0%, #000 30%, rgba(0,0,0,.4) 82%, transparent 100%) }
  .hero::after { opacity: .42 }
  .hero-grid { background-size: 52px 52px; animation-duration: 18s }
  .hero-canvas { opacity: .72 }
  .hero-content {
    width: 100%;
    max-width: min(33rem,78vw);
    transform: none;
  }
  .hero-content h1 {
    font-size: clamp(2.55rem,10vw,4.25rem);
    font-weight: 500;
    line-height: .88;
    margin-bottom: .9rem;
  }
  .hero-content h1 span:first-child { letter-spacing: .12em }
  .hero-content h1 span:last-child { letter-spacing: .08em }
  .hero-copy { font-size: 1rem; line-height: 1.55; max-width: min(31rem,76vw) }
  .hero-announcement { max-width: min(31rem,76vw); padding: .85rem 1rem; margin-top: 1.1rem }
  .hero-actions { gap: .7rem; margin-top: 1.35rem }
  .hero-actions .button { min-height: 3rem; padding: .8rem 1rem; font-size: .95rem }
  .hero-astronaut { right: -2.5rem; bottom: 8.5rem; width: 14rem; opacity: .42 }
  .hero-sidebar {
    position: relative;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 2rem;
  }
  .mission-panel { width: 100%; max-width: none; margin-top: 0; transform: none; left: auto; right: auto; bottom: auto }
  .mission-panel::before { display: none }

  main { --page-gutter: clamp(1rem,4.8vw,1.5rem); --content-gutter: var(--page-gutter) }
  .section, .registration { padding: 3.5rem var(--page-gutter) }
  .section-heading { margin-bottom: 1.45rem }
  h2 { font-size: clamp(1.85rem,7.8vw,3rem); line-height: 1.04 }
  .intro-band { padding-block: 2rem }
  .steam-white-section { padding: clamp(3.5rem,6vw,5rem) var(--page-gutter) }
  .intro-item { min-height: auto; padding: 1.35rem 1rem }
  .intro-band, .split, .registration { grid-template-columns: 1fr }
  .step-grid.cols-2 { grid-template-columns: 1fr }
  .inline-field-group { grid-template-columns: minmax(0, 1.7fr) minmax(5.8rem, .7fr) }
  .institution-options { grid-template-columns: 1fr }
  .mission-card { min-height: auto; padding: 1.1rem }
  .timeline { gap: 1.2rem; border-top: none; grid-template-columns: 1fr }
  .timeline article { padding: 1.2rem; border-left: 1px solid var(--line); background: rgba(7,12,20,.52) }
  .timeline article::before { top: 1.35rem; left: -.45rem }
  .program-satellite { right: -1.4rem; top: 3rem; width: 10rem; opacity: .36 }
  .timeline-section { min-height: auto }
  .mars3d-canvas { opacity: .78 }
  .timeline-section::before { background: linear-gradient(180deg, rgba(5,7,13,.82), rgba(5,7,13,.9)) }
  .mars3d-stars { opacity: .2 }
  .footer { flex-direction: column }

  .participation-rules { min-height: auto; padding: 3.5rem var(--page-gutter) }
  .rules-content h2 { max-width: 100%; padding-right: 8rem }
  .rules-text { grid-template-columns: 1fr; grid-template-areas: "denied" "mode" "work" "tools"; gap: 1.5rem }
  .rules-block-denied { max-width: 100% }
  .rules-block-tools h3, .rules-block-work h3 { min-height: 0 }
  .meteor-hero { right: -3.6rem; top: 1.4rem; width: 10.5rem; opacity: .52; pointer-events: none }
  #misiones, #evaluacion, .registration { padding-left: var(--page-gutter); padding-right: var(--page-gutter) }
  .registration::before { left: var(--page-gutter); right: var(--page-gutter) }
}

/* ── Responsive: Small Mobile (max-width: 700px) ── */
@media (max-width: 700px) {
  .hero-canvas {
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, transparent 46%, #000 72%);
    mask-image: linear-gradient(180deg, transparent 0%, transparent 46%, #000 72%);
  }
}

/* ── Responsive: Mobile (max-width: 560px) ── */
@media (max-width: 560px) {
  .site-header { padding: .72rem .9rem; align-items: center; min-height: 3.8rem }
  .brand-logos { width: 100%; justify-content: space-between; gap: .4rem }
  .brand-logo-mars { height: 1.85rem; max-width: 11.5rem }
  .brand-logo-unach { height: 2.5rem; max-width: 2.8rem }
  .brand-logo-marca { height: 2.5rem; max-width: 2.8rem }
  .brand-logo-ignite { height: 2.9rem; max-width: 4.2rem }

  .hero {
    padding-top: 5.6rem;
    padding-bottom: 2rem;
  }
  .hero-content {
    max-width: 74vw;
    position: relative;
    z-index: 5;
  }
  .hero-content .eyebrow {
    max-width: 92vw;
    font-size: .66rem;
    line-height: 1.35;
    letter-spacing: .08rem;
    margin-left: .35rem;
    margin-bottom: .75rem;
  }
  .hero-content h1 {
    font-size: clamp(2rem,10.4vw,2.65rem);
    font-weight: 500;
    letter-spacing: .025em;
    line-height: .9;
    animation: titleCleanMotionMobile 6s ease-in-out infinite;
  }
  .hero-content h1 span:first-child { letter-spacing: .055em }
  .hero-content h1 span:last-child { letter-spacing: .025em }
  .hero-copy {
    max-width: 92vw;
    font-size: .86rem;
    line-height: 1.56;
    text-align: left;
    word-spacing: 0;
  }
  .hero-announcement {
    max-width: 92vw;
    padding: .75rem .9rem;
    margin-top: 1rem;
  }
  .announcement-body {
    font-size: .82rem;
    line-height: 1.48;
  }
  .announcement-badge {
    font-size: .62rem;
  }
  .registration-deadline-badge {
    font-size: .8rem;
    padding: .45rem .85rem;
  }
  .hero-actions { width: 100%; max-width: 92vw; display: grid; grid-template-columns: 1fr; gap: .65rem }
  .hero-actions .button { width: 100%; min-height: 2.9rem; font-size: .92rem; white-space: normal; text-align: center }
  .hero-astronaut {
    display: block;
    content: url('img/oce.png');
    top: 4.8rem;
    right: -.5rem;
    bottom: auto;
    width: clamp(9.5rem,38vw,11.5rem);
    max-height: 42vh;
    opacity: .95;
    z-index: 4;
    transform: translate3d(0,0,0) rotate(0deg);
    animation: astronautMobileFloat 7s ease-in-out infinite;
    filter: drop-shadow(0 0 .65rem rgba(255,255,255,.22)) drop-shadow(0 0 1.4rem rgba(101,225,255,.34)) drop-shadow(0 1rem 1.8rem rgba(0,0,0,.58));
  }
  .hero-year {
    margin: -.15rem 0 .85rem;
    font-size: clamp(1rem,5.8vw,1.45rem);
    letter-spacing: .12em;
  }
  .hero-year::after { width: min(13rem,66vw); margin-top: .45rem }
  .hero-copy br { margin-top: .5rem }
  .hero-sidebar { margin-top: 1.5rem }
  .mission-panel {
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    padding: .85rem;
    margin-top: 0;
    border-radius: 8px;
  }
  .event-date-inline strong { font-size: 1.02rem }
  .event-date-inline {
    margin-bottom: .55rem;
    gap: .08rem;
  }
  .event-date-inline span {
    font-size: .56rem;
    letter-spacing: .12em;
  }
  .event-date-inline strong {
    font-size: .88rem;
    line-height: 1.24;
  }
  .panel-header { font-size: .74rem; line-height: 1.25 }
  .telemetry { grid-template-columns: 1fr 1fr; gap: .55rem }
  .telemetry div:last-child { grid-column: 1/-1 }
  .launch-window strong { font-size: 1.25rem; overflow-wrap: anywhere }
  .hero-grid { animation: none }
  .hero::before { opacity: .22 }
  .hero::after { opacity: .32 }
  .hero-bg { filter: saturate(1.14) contrast(1.04) brightness(1.02) }

  .intro-band { grid-template-columns: 1fr; gap: .85rem; padding: 1.5rem 1rem }
  .intro-item { min-height: auto; border-bottom: 1px solid #e3edf4 }
  .section, .registration { padding: 3rem 1rem }
  .steam-white-section { padding: 3rem 1rem }
  h2 { font-size: clamp(1.65rem,8.3vw,2.3rem); line-height: 1.06 }
  .section-heading p, .mission-card p, .timeline p, .registration p { font-size: .95rem; line-height: 1.55 }
  .mission-grid { gap: .8rem }
  .mission-detail { padding: 1rem }
  .mission-detail strong { font-size: 1.2rem }
  .timeline-section { padding-top: 3.8rem }
  .timeline-section .section-heading,
  .timeline-section .timeline { max-width: none }
  .program-satellite { top: 1.2rem; right: -2.1rem; width: 7.2rem; opacity: .26; animation-duration: 16s }
  .timeline { gap: .85rem }
  .timeline article { padding: 1rem 1rem 1rem 1.05rem }
  .mars3d-canvas { opacity: .52 }
  .score-board, .signup-form { padding: 1rem }
  .step-grid.cols-2 { grid-template-columns: 1fr }
  .inline-field-group { grid-template-columns: 1fr }
  input, select, textarea { font-size: 1rem; min-height: 2.9rem }
  .footer { padding: 1.15rem 1rem; font-size: .9rem }

  .participation-rules { padding: 3rem 1rem }
  .rules-content h2 { max-width: none; padding-right: 0; font-size: clamp(1.85rem,9vw,2.65rem) }
  .rules-text p, .rules-text li { font-size: .92rem; line-height: 1.62 }
  .rules-text li { padding-left: 1.35rem }
  .meteor-hero { position: relative; right: auto; top: auto; width: min(12rem,58vw); margin: -.5rem auto 1.2rem; opacity: .9 }
  .steam-white-image.steam-enter { animation-duration: .82s }
  #misiones, #evaluacion, .registration { padding-left: 1rem; padding-right: 1rem }
  .registration::before { left: 1rem; right: 1rem }
  .mission-card, .mission-detail, .score-board { box-shadow: 0 .9rem 2rem rgba(14,33,52,.08) }
  .signup-form { 
    box-shadow: 0 6px 24px rgba(4,22,42,.15), 0 1px 3px rgba(66,228,255,.1);
    border-radius: 10px;
  }
  .intro-item, .mission-card, .mission-detail, .score-board {
    clip-path: polygon(.9rem 0, calc(100% - .5rem) 0, 100% .5rem, 100% calc(100% - .9rem), calc(100% - .9rem) 100%, .5rem 100%, 0 calc(100% - .5rem), 0 .9rem);
    animation: techPanelBreath 8s ease-in-out infinite, cardEnergyFlow 10s ease-in-out infinite;
  }
  .intro-item::before, .mission-card::before, .mission-detail::before,
  .score-board::before { inset: .42rem }
  .intro-item::after, .mission-card::after, .mission-detail::after,
  .score-board::after { width: 42%; animation-duration: 5.6s }
  .steam-white-section { padding: 1.7rem 1rem }
  .steam-white-image { width: 98vw }
  .steam-copy { width: 100%; max-width: 100% }
  .steam-copy h2 { font-size: clamp(1.65rem,8vw,2.35rem) }
  .steam-copy p:not(.eyebrow) { font-size: .92rem; line-height: 1.62; text-align: left }
  .institution-card { min-height: 8.75rem; padding: .9rem }
  .institution-logo { width: min(100%, 15rem); max-height: 7.5rem }
  .intro-item p, .mission-card p, .mission-detail p,
  .timeline p, .section-heading p, .registration p {
    font-size: .9rem;
    line-height: 1.55;
    word-spacing: 0;
  }
}

/* ── Responsive: Extra Small (max-width: 390px) ── */
@media (max-width: 390px) {
  .brand-logo-mars { height: 1.55rem; max-width: 9.5rem }
  .brand-logo-unach { height: 2.1rem; max-width: 2.4rem }
  .brand-logo-marca { height: 2.1rem; max-width: 2.4rem }
  .brand-logo-ignite { height: 2.5rem; max-width: 3.5rem }
  .hero-content { max-width: 76vw }
  .hero-content h1 { font-size: clamp(2.2rem,12.6vw,2.85rem) }
  .hero-astronaut { top: 5rem; right: -.6rem; width: 8.8rem; opacity: .92 }
  .hero-copy { font-size: .9rem }
  .button { font-size: .9rem }
  .telemetry { grid-template-columns: 1fr }
  .telemetry div:last-child { grid-column: auto }
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
  .hero-bg, .hero-content, .mission-panel { transform: none !important }
  .hero-canvas { display: none }
  .hero-astronaut { animation: none !important }
  .program-satellite { animation: none !important }
  .meteor-hero, .meteor-dust { animation: none !important }
  .meteor-hero, .meteor-img { transform: none !important }
  .brand-logo, .brand-logos::before, .brand-logos::after {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
  .brand-logos::before, .brand-logos::after { display: none !important }
  .hero-content .eyebrow, .hero-content h1 span,
  .hero-copy, .hero-announcement, .hero-actions .button, .mission-panel { animation: none !important }
  .hero-content h1 span::before, .hero-content h1 span::after { display: none !important }
  .hero-content h1 { animation: none !important }
  .intro-item, .mission-card, .mission-detail, .score-board,
  .intro-item::after, .mission-card::after, .mission-detail::after,
  .score-board::after { animation: none !important }
  .intro-item, .mission-card, .mission-detail, .score-board, .signup-form {
    opacity: 1 !important;
    transform: none !important;
  }
  .steam-white-image { animation: none !important }
  .space-reveal { 
    transition: none !important; 
    opacity: 1 !important; 
    transform: none !important; 
    filter: none !important; 
    text-shadow: none !important;
  }
}

/* ── Space-tech 2026 Transitions ── */
.space-reveal {
  opacity: 0;
  transform: perspective(600px) translateY(1.5rem) rotateX(25deg) scale(0.96);
  text-shadow: 0 0 20px rgba(102, 240, 255, 0.7);
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.85s cubic-bezier(0.16, 1, 0.3, 1),
              text-shadow 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform, text-shadow;
}
.space-reveal.space-revealed {
  opacity: 1;
  transform: perspective(600px) translateY(0) rotateX(0) scale(1);
  text-shadow: 0 0 0 rgba(102, 240, 255, 0);
}

.institution-selector h3 {
  text-align: center;
}