/* Conferencia con científico senior de la NASA — estilos propios de /conferencia.
   Complementa css/styles.css y la config de Tailwind compartida. Los fondos y la paleta vienen del kit gráfico
   (spaceapps_conferencia_assets/07_documentacion/paleta.json): navy #071846, deep #06112F, lime #E4FA25, muted #C8D9F2. */

:root {
  --conf-navy: #071846;
  --conf-deep: #06112F;
  --conf-muted: #C8D9F2;
}

/* Hero: arte cósmico del kit como fondo (SVG, 6–7 KB); versión móvil con el arte a la derecha y espacio de texto a la izquierda */
.conf-hero {
  position: relative;
  background: var(--conf-navy) url("../assets/conferencia/hero_cosmico_mobile.svg") center top / cover no-repeat;
}
@media (min-width: 768px) {
  .conf-hero {
    background-image: url("../assets/conferencia/hero_cosmico_desktop.svg");
    background-position: center right;
  }
}

/* Retrato circular: la foto original optimizada (WebP), recortada con CSS; un solo marco fino */
.conf-portrait {
  position: relative;
  width: min(62vw, 260px);
  aspect-ratio: 1 / 1;
  margin-inline: auto;
}
@media (min-width: 768px) {
  .conf-portrait {
    width: min(36vw, 320px);
  }
}
.conf-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 9999px;
  border: 4px solid #fff;
  box-shadow: 0 30px 60px -24px rgba(0, 0, 0, 0.7);
}
.conf-portrait figcaption {
  position: absolute;
  left: 50%;
  bottom: -14px;
  transform: translateX(-50%);
  white-space: nowrap;
  background: var(--conf-deep);
  color: #fff;
  border: 1px solid rgba(228, 250, 37, 0.7);
  border-radius: 9999px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* Datos del evento en el hero */
.conf-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  padding-top: 20px;
}
.conf-facts dt {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #DFFF00;
}
.conf-facts dd {
  margin: 2px 0 0;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
}

/* Retrato vertical del perfil */
.conf-profile-photo {
  width: 100%;
  max-width: 420px;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 18px;
  box-shadow: 0 24px 48px -24px rgba(7, 24, 70, 0.5);
}

/* Iconos del kit como apoyo a los temas, sin ilustraciones repetidas. */
.conf-topics { display:grid; gap:36px; }
.conf-theme-row { display:grid; grid-template-columns:40px minmax(0,1fr); gap:20px; align-items:start; }
.conf-topic-icon { width:40px; height:40px; }
.conf-theme-num { color:#DFFF00; font-size:12px; letter-spacing:.12em; font-weight:700; }
@media(min-width:768px){ .conf-topics { grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px; } }

/* Logística: iconos del kit (son claros, van sobre navy) con tamaño y espaciado uniformes */
.conf-logistics {
  background: var(--conf-navy);
  color: #fff;
  border-radius: 20px;
  padding: 28px;
}
.conf-logistics > div + div {
  border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.conf-logistics > div {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 16px;
  padding: 16px 0;
  align-items: start;
}
.conf-logistics img {
  width: 44px;
  height: 44px;
}
.conf-logistics dt {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--conf-muted);
}
.conf-logistics dd {
  margin: 2px 0 0;
  font-weight: 700;
  font-size: 17px;
  line-height: 1.35;
}
.conf-logistics dd small {
  display: block;
  font-weight: 500;
  font-size: 14px;
  color: var(--conf-muted);
}

/* Separador orbital del kit entre secciones (decorativo) */
.conf-separator {
  display: block;
  width: min(100%, 1100px);
  height: auto;
  margin: 0 auto;
}

/* Registro: órbitas del kit como fondo sutil de un área amplia y de poco detalle */
.conf-register {
  background: linear-gradient(rgba(6,17,47,.84),rgba(6,17,47,.84)), var(--conf-deep) url("../assets/conferencia/orbitas_superposicion_transparente.svg") center top / 1920px auto no-repeat;
}

/* Logos oficiales (originales del kit, sin modificar): misma altura, sobre fondo oscuro */
.conf-logos {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 28px 40px;
}
.conf-logos img {
  width:96px;
  height:auto;
}
.conf-logos img.is-wide {
  height: 44px;
}

/* CTA fijo en móvil: visible hasta llegar al registro */
.conf-sticky-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 40;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  background: rgba(6, 17, 47, 0.94);
  backdrop-filter: blur(8px);
  border-top: 1px solid rgba(228, 250, 37, 0.4);
  transition: transform 0.25s ease, opacity 0.25s ease;
}
.conf-sticky-cta.is-off {
  transform: translateY(110%);
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}
@media (min-width: 768px) {
  .conf-sticky-cta {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .conf-sticky-cta,
  .card-hover {
    transition: none;
  }
}

/* CTA externo sin URL todavía (p. ej. el formulario de mentores): visible pero inactivo, con aviso al lado */
a.btn-nasa[aria-disabled="true"] {
  opacity: 0.55;
  pointer-events: none;
}

/* Pulido del diseño original: proporciones y legibilidad, sin cambiar su estructura. */
.site-brand-logo { width:96px; height:auto; flex-shrink:0; }
.nav-glass { background:rgba(7,24,70,.96); }
.conf-hero { background-size:auto 760px; background-position:right top; }
.conf-hero::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(to bottom,transparent 500px,#071846 760px),linear-gradient(90deg,#071846 0%,rgba(7,24,70,.88) 48%,rgba(7,24,70,.06) 100%); }
.conf-hero > * { position:relative; }

#inicio .hero-title { font-size:clamp(36px,5vw,64px); line-height:1.08; letter-spacing:-.035em; }
#inicio .hero-title span { font-size:.82em; }
.mentor-hero-copy { max-width:900px; margin-inline:auto; text-align:center; }
.mentor-hero-copy > p, .mentor-hero-copy ul { margin-inline:auto; justify-content:center; }

#conferencista .conf-profile-photo { display:none; }
#invitado .max-w-4xl { text-align:left; }
#sede a img, #horarios .bg-space-lime-yellow img { filter:brightness(0); }
section { scroll-margin-top:100px; }
@media(max-width:767px){
 .conf-hero::before { background:linear-gradient(to bottom,transparent 500px,#071846 760px),linear-gradient(90deg,rgba(7,24,70,.95),rgba(7,24,70,.65)); }
 .original-timeline > .absolute { left:12px; }
 .original-timeline > .space-y-16 > div { display:block; padding-left:40px; }
 .original-timeline .w-1\/2 { width:auto; text-align:left; padding:0; }
 .original-timeline .timeline-dot { left:12px; top:24px; }
 .original-timeline .space-y-16 > :not([hidden]) ~ :not([hidden]) { margin-top:28px; }
}

/* El hero ocupa ambas columnas, con registro e invitado agrupados. */
#inicio.home-hero { padding:48px 0 32px; text-align:left; }
.home-hero-columns { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:56px; align-items:center; }
.home-hero-description { margin-top:24px; color:#dbe6f6; font-size:18px; line-height:1.65; max-width:620px; }
.home-hero-aside { padding:28px; background:rgba(6,17,47,.72); border:1px solid rgba(200,217,242,.25); border-radius:16px; backdrop-filter:blur(8px); }
.home-guest-card { display:flex; align-items:center; gap:20px; }
.home-guest-card img { width:96px; height:96px; }
.home-guest-card .tracking-widest { font-size:10px; letter-spacing:.08em; line-height:1.5; }
.home-guest-card .text-2xl { font-size:24px; line-height:1.2; }
.home-registration { margin-top:28px; }
.home-registration a.btn-nasa { width:100%; padding:16px 20px; font-size:16px; line-height:1.4; border-radius:8px; box-shadow:none; }
.home-registration > p { font-size:13px; line-height:1.5; }
.home-hero-links { display:flex; gap:20px; flex-wrap:wrap; align-items:center; margin-top:32px; }
.home-program-link .btn-secondary { padding:12px 20px; font-size:14px; }
.home-community-link a { padding:12px 20px; font-size:14px; }
.home-eligibility { margin-top:24px; padding-top:20px; border-top:1px solid rgba(200,217,242,.18); max-width:100%; }
.home-eligibility p { font-size:12px; line-height:1.6; }
@media(max-width:1023px){
 .home-hero-columns { gap:28px; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
 .home-hero-aside { padding:22px; }
 .home-guest-card { flex-direction:column; align-items:flex-start; gap:16px; }
 #inicio.home-hero .hero-title { font-size:46px; }
}
@media(max-width:767px){
 #inicio.home-hero { padding:32px 0 24px; }
 .home-hero-columns { grid-template-columns:minmax(0,1fr); gap:16px; }
 .home-hero-copy { display:contents; }
 .home-hero-copy > div { margin-top:0; justify-content:flex-start; order:1; }
 .home-hero-copy > h1 { order:0; }
 .home-hero-aside { order:2; margin-top:8px; }
 .home-hero-copy > .home-hero-description { order:3; margin-top:8px; }
 #inicio.home-hero .hero-title { font-size:36px; }
 .home-hero-description { margin-top:20px; font-size:16px; line-height:1.6; }
 .home-guest-card { flex-direction:row; align-items:center; gap:16px; }
 .home-guest-card img { width:72px; height:72px; }
 .home-guest-card .text-2xl { font-size:20px; }
 .home-guest-card .text-sm { font-size:12px; }
 .home-hero-aside { padding:20px; }
 .home-registration { margin-top:20px; }
 .home-hero-links { gap:12px; margin-top:24px; }
 .home-hero-links > div, .home-hero-links a { width:100%; justify-content:center; text-align:center; }
}