/* Tableau d'accueil */

/* Le nom en très grand, à la taille exacte de la tuile (le mot mesure environ 5,25 fois sa taille de police). */
.name-band {
  flex: 1 1 100%;
  height: clamp(110px, 12vw, 190px);
  background: var(--tile);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.name-band span {
  font-size: min(clamp(140px, 17vw, 300px), calc((100vw - 64px) / 5.3));
  letter-spacing: -0.045em;
  line-height: 0.8;
  white-space: nowrap;
  transform: translateY(0.04em);
}

.iss-now { display: grid; gap: 14px; align-content: start; }
.iss-now .head { max-width: 18ch; }
.iss-now .lead { max-width: 44ch; }
.iss-count { font-size: var(--step-lead); color: var(--accent); }

.launch-now {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
  text-decoration: none;
  transition: background-color var(--t-hover) ease;
}
.launch-now:hover { background: var(--tile-2); }
.ln-body { display: grid; gap: 4px; }
.ln-body .lead { font-weight: 600; }
.ln-count { font-size: clamp(1.75rem, 0.9rem + 1.9vw, 2.75rem); line-height: 1; letter-spacing: -0.04em; white-space: nowrap; }

.home-map { display: flex; flex-direction: column; background: var(--map-sea); }
.home-map-legend { padding: 12px var(--pad) 14px; background: var(--tile); margin-top: auto; color: var(--muted); font-family: var(--mono); }

.home-photo { margin: 0; display: flex; flex-direction: column; }
.home-photo img { width: 100%; flex: 1; min-height: 260px; object-fit: cover; }
.home-photo figcaption { padding: 12px var(--pad) 14px; color: var(--muted); }

.tonight { display: grid; gap: 18px; align-content: space-between; text-decoration: none; transition: background-color var(--t-hover) ease; }
.tonight:hover { background: var(--field); }
.tn-row { display: grid; grid-template-columns: 88px 1fr; gap: 20px; align-items: center; }
.tn-moon { width: 88px; height: 88px; }
.tn-moon .moon-dark { fill: var(--moon-dark); }
.tn-moon .moon-lit { fill: var(--moon-lit); }
.tn-text { display: grid; gap: 6px; }
.tn-text .lead { font-weight: 600; }
.space-now { display: flex; flex-direction: column; justify-content: space-between; gap: 16px; text-decoration: none; transition: background-color var(--t-hover) ease; }
.space-now:hover { background: var(--tile-2); }
.sp-kp { font-size: clamp(2.25rem, 1.2rem + 2.6vw, 3.5rem); line-height: 1; letter-spacing: -0.04em; }
.sp-text { display: grid; gap: 6px; }
.sp-text .lead { font-weight: 600; }
.sky-event { display: flex; flex-direction: column; justify-content: space-between; gap: 16px; text-decoration: none; transition: background-color var(--t-hover) ease; }
.sky-event:hover { background: var(--field); }
.se-count { font-size: clamp(1.75rem, 0.9rem + 1.9vw, 2.75rem); line-height: 1; letter-spacing: -0.04em; color: var(--accent); }
.se-text { display: grid; gap: 6px; }
.se-text .lead { font-weight: 600; }
.tn-planets { display: grid; gap: 16px; align-content: start; }
.tnp-list { display: grid; gap: 6px; }
.tnp-list li:not(.small) { display: grid; grid-template-columns: 5.5rem 1fr; gap: 12px; padding: 12px 14px; background: var(--tile-2); }
.tnp-list strong { font-weight: 600; }


.home-apod { margin: 0; display: flex; flex-direction: column; background: #000; }
.ha-link { display: block; position: relative; aspect-ratio: 16 / 9; overflow: hidden; }
.ha-link img, .ha-link video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--ease-out); }
.ha-link:hover img, .ha-link:hover video { transform: scale(1.02); }
.ha-wait { position: absolute; left: var(--pad); bottom: var(--pad); color: #a9a59e; }
.ha-cap { display: grid; gap: 4px; padding: 14px var(--pad) 16px; background: var(--tile); margin-top: auto; }
.ha-title { font-weight: 600; }
.home-news { display: grid; gap: 14px; align-content: start; }
.hn-list { display: grid; gap: 4px; }
.hn-list li { display: grid; gap: 2px; padding: 12px 14px; background: var(--tile-2); }
.hn-list a { text-decoration: none; font-weight: 600; line-height: 1.3; }
.hn-list a:hover { text-decoration: underline; }
.hn-list span { font-size: var(--step-small); color: var(--muted); }

@media (max-width: 1080px) {
  .home-apod, .home-news { grid-column: span 12; }
  .iss-now, .home-map { grid-column: span 12; }
  .launch-now, .home-photo { grid-column: span 6; }
}
@media (max-width: 860px) {
  .name-band { height: clamp(72px, 20vw, 110px); }
  .name-band span { transform: translateY(0.06em); }
  .home-head .menu-toggle { flex: 1 1 100%; }
}
@media (max-width: 1080px) {
  .tonight { grid-column: span 12; }
  .tn-planets, .space-now, .sky-event, .home-photo { grid-column: span 6; }
  .launch-now, .home-apod { grid-column: span 12; }
}
@media (max-width: 640px) {
  .tonight, .tn-planets, .space-now, .sky-event { grid-column: span 12; }
}
@media (max-width: 640px) {
  .launch-now, .home-photo { grid-column: span 12; }
  .tnp-list li:not(.small) { grid-template-columns: 1fr; gap: 2px; }
}

/* Choix d'affichage et intertitres de rubrique */
.view-switch { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding-block: 12px; }
.group-title { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px 24px; margin-top: 24px; }
.group-title .head { font-size: var(--step-head); }
.group-links { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: var(--step-body); font-weight: 400; }
.group-links a { text-decoration: underline; text-underline-offset: 0.18em; }
.home-news .hn-list { grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); }
.view-switch .home-intro { margin: 0 0 0 auto; max-width: 62ch; }
@media (max-width: 860px) { .view-switch .home-intro { margin-left: 0; } }