/* -------------------------------------------------------------------------
 * satellite.css — il template «Satellite» (protect/templates/31.json): la
 * pagina come la sala di controllo di una stazione di terra che segue quattro
 * missioni. Pannelli scuri e letture vere, come nei centri di controllo, non
 * fantascienza.
 *
 * Testata (header_35): il marchio della stazione a sinistra, a destra la Terra
 * vista dall'orbita geostazionaria sopra 0 gradi, com'e' adesso (canvas, in
 * js/local/satellite.js; senza JavaScript il disco statico terra_disco.jpg),
 * con il segno di CNR-IFAC; sotto, la riga della telemetria. Poi la console
 * (navbar_31), la traiettoria (breadcrumb_31) e, in fondo, la sala di
 * controllo (footer_31). Nel corpo, pannelli con la sigla di sezione: il
 * profilo di missione con le tre quote in scala, le quattro missioni con le
 * loro toppe ricamate, il segmento di terra, i canali della telemetria (un
 * pacchetto per ogni elemento), i requisiti. Tutto sotto .tpl-satellite, la
 * classe che top.php mette sul <body> (classi_body).
 *
 * Colori: nero dello spazio e blu notte per i pannelli, ciano per le letture e
 * i collegamenti, verde solo per lo stato nominale, arancio per il Sole, la
 * linea del terminatore e i comandi principali; ogni missione ha la sua tinta,
 * quella della toppa (--tinta).
 * Caratteri: Barlow Condensed per titoli, etichette e toppe (stretto, da
 * cartellonistica tecnica: mai nel testo lungo), IBM Plex Sans per il testo,
 * JetBrains Mono per letture e sigle (css/common/font-*.css, ospitati dal sito).
 * Chi chiede meno movimento (prefers-reduced-motion) ha la Terra ferma, senza
 * scansione e senza satellite in moto, e nessun lampeggio.
 * ------------------------------------------------------------------------- */

.tpl-satellite {
  --sa-vuoto      : #02040B;   /* lo spazio */
  --sa-fondo      : #050B17;   /* la sala: il fondo della pagina */
  --sa-pannello   : #0B1527;   /* i pannelli su cui si legge, piu' chiari del fondo */
  --sa-pannello-2 : #0F1C33;
  --sa-bordo      : #20324E;
  --sa-bordo-luce : #35507A;
  --sa-schermo    : #040915;   /* il fondo dei display */
  --sa-testo      : #E8EEF8;
  --sa-tenue      : #A3B3CB;
  --sa-ciano      : #63D3FF;
  --sa-verde      : #5BE38E;
  --sa-arancio    : #FF9F43;
  --sa-rosso      : #FF6B6B;
  --sa-titolo     : 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --sa-sans       : 'IBM Plex Sans', 'Segoe UI', sans-serif;
  --sa-mono       : 'JetBrains Mono', Consolas, monospace;
  --sa-esce       : cubic-bezier(.23, 1, .32, 1);   /* ease-out deciso, per entrate e risposte */

  /* Bootstrap al buio: tendine, finestra modale, campi e bottoni prendono questi */
  --bs-body-color              : var(--sa-testo);
  --bs-body-bg                 : var(--sa-pannello);
  --bs-emphasis-color          : #FFFFFF;
  --bs-secondary-color         : var(--sa-tenue);
  --bs-secondary-bg            : #13223D;
  --bs-tertiary-bg             : #0F1B31;
  --bs-heading-color           : inherit;
  --bs-link-color              : var(--sa-ciano);
  --bs-link-color-rgb          : 99, 211, 255;
  --bs-link-hover-color        : #FFFFFF;
  --bs-link-hover-color-rgb    : 255, 255, 255;
  --bs-border-color            : var(--sa-bordo);
  --bs-border-color-translucent: rgba(110, 140, 190, .3);
  --bs-btn-close-filter        : invert(1) grayscale(100%) brightness(200%);
  color-scheme : dark;

  background-color : var(--sa-fondo);
  /* la griglia appena accennata dei pannelli della sala */
  background-image :
    linear-gradient(rgba(120, 160, 230, .028) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120, 160, 230, .028) 1px, transparent 1px);
  background-size  : 100% 48px, 48px 100%;
  color       : var(--sa-testo);
  font-family : var(--sa-sans);
  font-size   : 18px;
  line-height : 1.65;
}
.tpl-satellite a { color: var(--sa-ciano); text-underline-offset: 3px; }
.tpl-satellite a:hover { color: #FFFFFF; }
.tpl-satellite a:focus-visible,
.tpl-satellite button:focus-visible,
.tpl-satellite input:focus-visible,
.tpl-satellite .select2-selection:focus-visible {
  outline        : 2px solid var(--sa-arancio);
  outline-offset : 3px;
  box-shadow     : none;
}
.tpl-satellite ::selection { background: rgba(99, 211, 255, .3); color: #FFFFFF; }

/* ============ testata (header_35) ============ */
.tpl-satellite .sa-testata { position: relative; background: var(--sa-vuoto); }
.tpl-satellite .sa-orbita {
  position : relative;
  overflow : hidden;
  /* il chiarore dell'atmosfera dietro la Terra */
  background:
    radial-gradient(circle at 76% 52%, rgba(64, 130, 255, .2), transparent 34%),
    radial-gradient(ellipse 70% 90% at 76% 52%, rgba(20, 50, 120, .35), transparent 70%),
    var(--sa-vuoto);
}
/* le stelle: tre reticoli di puntini sfalsati, fermi (lo spazio visto da un'orbita non scorre) */
.tpl-satellite .sa-stelle {
  position : absolute;
  inset    : 0;
  opacity  : .9;
  background-image:
    radial-gradient(1px 1px at 12% 18%, #FFFFFF 50%, transparent 51%),
    radial-gradient(1px 1px at 33% 72%, #CFE0FF 50%, transparent 51%),
    radial-gradient(1.2px 1.2px at 58% 34%, #FFFFFF 50%, transparent 51%),
    radial-gradient(1px 1px at 81% 12%, #FFE9C9 50%, transparent 51%),
    radial-gradient(1px 1px at 92% 64%, #FFFFFF 50%, transparent 51%),
    radial-gradient(1px 1px at 46% 90%, #CFE0FF 50%, transparent 51%);
  background-size: 211px 197px, 263px 241px, 317px 293px, 179px 223px, 389px 331px, 241px 277px;
}
.tpl-satellite .sa-orbita-riga {
  position              : relative;
  display               : grid;
  grid-template-columns : minmax(0, 1fr) min(44vw, 470px);
  align-items           : center;
  gap                   : 24px 48px;
  min-height            : 460px;
  padding-top           : 22px;
  padding-bottom        : 22px;
}

/* il marchio della stazione (testi allineati a sinistra: il testo del sito e' giustificato) */
.tpl-satellite .sa-marchio { max-width: 640px; text-align: left; }
.tpl-satellite .sa-marchio p { text-align: left; hyphens: manual; }
.tpl-satellite .sa-stazione {
  display        : inline-flex;
  align-items    : center;
  gap            : 10px;
  margin         : 0 0 14px;
  padding        : 5px 12px 4px;
  border         : 1px solid var(--sa-bordo-luce);
  border-radius  : 999px;
  background     : rgba(11, 21, 39, .7);
  color          : var(--sa-tenue);
  font-family    : var(--sa-mono);
  font-size      : 12px;
  line-height    : 1.3;
  letter-spacing : .08em;
  text-transform : uppercase;
}
.tpl-satellite .sa-spia {
  width         : 8px;
  height        : 8px;
  border-radius : 50%;
  background    : var(--sa-verde);
  box-shadow    : 0 0 8px var(--sa-verde);
  animation     : sa-respiro 2.4s ease-in-out infinite;
}
@keyframes sa-respiro { 50% { opacity: .45; box-shadow: 0 0 2px var(--sa-verde); } }
.tpl-satellite .sa-nome {
  display         : block;
  margin          : 0 0 6px -2px;
  color           : #FFFFFF;
  font-family     : var(--sa-titolo);
  font-size       : clamp(64px, 9vw, 124px);
  line-height     : .92;
  letter-spacing  : .02em;
  text-decoration : none;
  text-shadow     : 0 0 40px rgba(64, 130, 255, .35);
}
.tpl-satellite .sa-nome:hover { color: #FFFFFF; }
.tpl-satellite .sa-nome-port { font-weight: 600; }
.tpl-satellite .sa-nome-lab  { font-weight: 800; color: var(--sa-ciano); }
/* solo in satellite: «S.A.T.E.L.L.I.T.E.» e' largo 6,2 volte la sua dimensione e non va a capo
   (fra un punto e una lettera la riga non si spezza), quindi la misura la da' anche la colonna del
   marchio: 15,8cqi e' il 98% della colonna. Prima, con la sola larghezza dello schermo, il nome
   finiva sotto la Terra fra 992 e 1200 px e sul telefono usciva dallo schermo. */
.tpl-satellite .sa-marchio { container-type: inline-size; }
.tpl-satellite .sa-nome { font-size: min(clamp(64px, 9vw, 124px), 15.8cqi); }
.tpl-satellite .sa-motto {
  margin      : 0 0 18px;
  color       : #D7E2F4;
  font-size   : clamp(19px, 1.9vw, 24px);
  font-weight : 300;
  line-height : 1.35;
}
.tpl-satellite .sa-vista {
  position    : relative;
  margin      : 0;
  padding-left: 20px;
  max-width   : 34em;
  color       : var(--sa-tenue);
  font-family : var(--sa-mono);
  font-size   : 13px;
  line-height : 1.5;
}
.tpl-satellite .sa-vista::before {
  content       : "";
  position      : absolute;
  left          : 0;
  top           : .45em;
  width         : 9px;
  height        : 9px;
  border-radius : 50%;
  background    : var(--sa-arancio);
  box-shadow    : 0 0 10px rgba(255, 159, 67, .8);
}

/* la Terra */
.tpl-satellite .sa-terra { position: relative; }
.tpl-satellite .sa-disco {
  position   : relative;
  width      : 100%;
  aspect-ratio: 1;
  /* senza JavaScript, o finche' il canvas non ha disegnato: il disco statico */
  background : url("/img/local/styles/satellite/terra_disco.jpg") center / contain no-repeat;
}
.tpl-satellite .sa-tela-attiva .sa-disco { background: none; }
.tpl-satellite .sa-tela {
  position : absolute;
  inset    : 0;
  width    : 100%;
  height   : 100%;
}
/* CNR-IFAC sul disco: la posizione la calcola satellite.js con la stessa proiezione */
.tpl-satellite .sa-ifac {
  position       : absolute;
  left           : 57.3%;
  top            : 14%;
  display        : flex;
  align-items    : center;
  gap            : 8px;
  transform      : translate(-6px, -50%);
  pointer-events : none;
}
.tpl-satellite .sa-ifac i {
  position      : relative;
  flex          : 0 0 auto;
  width         : 12px;
  height        : 12px;
  border        : 2px solid var(--sa-arancio);
  border-radius : 50%;
  box-shadow    : 0 0 0 2px rgba(2, 4, 11, .55), 0 0 10px rgba(255, 159, 67, .7);
}
.tpl-satellite .sa-ifac i::after {
  content       : "";
  position      : absolute;
  inset         : -2px;
  border        : 2px solid var(--sa-arancio);
  border-radius : 50%;
  animation     : sa-segnale 2.6s var(--sa-esce) infinite;
}
@keyframes sa-segnale { from { transform: scale(1); opacity: .9; } to { transform: scale(3.2); opacity: 0; } }
.tpl-satellite .sa-ifac { transition: opacity .4s ease-out; }
.tpl-satellite .sa-in-scansione .sa-ifac { opacity: 0; }
.tpl-satellite .sa-didascalia {
  margin      : 4px 0 0;
  color       : #7F92B0;
  font-family : var(--sa-mono);
  font-size   : 11.5px;
  line-height : 1.45;
  text-align  : center;
}
.tpl-satellite .sa-ifac b {
  padding        : 2px 6px 1px;
  border-radius  : 3px;
  background     : rgba(2, 4, 11, .72);
  color          : #FFFFFF;
  font-family    : var(--sa-mono);
  font-size      : 11px;
  font-weight    : 600;
  letter-spacing : .04em;
}

/* la telemetria */
.tpl-satellite .sa-telemetria {
  background    : linear-gradient(180deg, #0A1324, #070E1C);
  border-top    : 1px solid var(--sa-bordo);
  border-bottom : 1px solid var(--sa-bordo);
}
.tpl-satellite .sa-letture {
  display               : grid;
  grid-template-columns : repeat(4, minmax(0, 1fr));
  margin                : 0 auto;
}
.tpl-satellite .sa-lettura {
  padding     : 12px 18px 11px;
  border-left : 1px solid var(--sa-bordo);
}
.tpl-satellite .sa-lettura:first-child { border-left: 0; padding-left: 0; }
.tpl-satellite .sa-lettura dt {
  margin         : 0 0 3px;
  color          : var(--sa-tenue);
  font-family    : var(--sa-titolo);
  font-weight    : 600;
  font-size      : 14px;
  line-height    : 1.2;
  letter-spacing : .12em;
  text-transform : uppercase;
}
.tpl-satellite .sa-lettura dd {
  display     : flex;
  flex-wrap   : wrap;
  align-items : baseline;
  gap         : 0 9px;
  margin      : 0;
  font-family : var(--sa-mono);
  line-height : 1.3;
}
.tpl-satellite .sa-valore {
  color       : var(--sa-ciano);
  font-size   : 19px;
  font-weight : 600;
  white-space : pre;
  font-variant-numeric: tabular-nums;
}
.tpl-satellite .sa-unita { color: var(--sa-tenue); font-size: 12.5px; }

/* ============ la console (navbar_31) ============ */
.tpl-satellite #nav-cont { position: relative; z-index: 5; }
.tpl-satellite .sa-console {
  position      : relative;
  padding       : 2px 12px 4px;
  background    : linear-gradient(180deg, #101C33 0%, #0C1629 100%);
  border        : 1px solid var(--sa-bordo);
  border-top    : 0;
  border-radius : 0 0 10px 10px;
  box-shadow    : 0 16px 30px rgba(0, 0, 0, .45);
}
/* il filo ciano in testa al banco */
.tpl-satellite .sa-console::before {
  content    : "";
  position   : absolute;
  left       : 18px;
  right      : 18px;
  top        : 0;
  height     : 1px;
  background : linear-gradient(90deg, transparent, rgba(99, 211, 255, .7) 20%, rgba(99, 211, 255, .7) 80%, transparent);
}
.tpl-satellite .sa-console .navbar { padding: 6px 0; }
.tpl-satellite .sa-console .navbar-collapse { gap: 10px; }
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link {
  position       : relative;
  display        : flex;
  align-items    : center;
  margin         : 2px 4px 2px 0;
  padding        : 10px 13px 9px;
  color          : #D9E3F3;
  font-family    : var(--sa-titolo);
  font-weight    : 600;
  font-size      : 16px;
  line-height    : 1.2;
  letter-spacing : .08em;
  text-transform : uppercase;
  border-radius  : 6px;
  transition     : color .15s ease, background-color .15s ease;
}
/* sotto la voce, la barra della selezione che si accende */
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link::after {
  content       : "";
  position      : absolute;
  left          : 13px;
  right         : 13px;
  bottom        : 3px;
  height        : 2px;
  border-radius : 2px;
  background    : var(--sa-ciano);
  transform     : scaleX(0);
  transform-origin: left center;
  transition    : transform .2s var(--sa-esce);
}
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link:hover,
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link:focus-visible,
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link.show {
  color            : #FFFFFF;
  background-color : rgba(99, 211, 255, .08);
}
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link:hover::after,
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link:focus-visible::after,
.tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link.show::after { transform: scaleX(1); }
.tpl-satellite .sa-console .menu-ico { color: var(--sa-ciano) !important; margin-right: .5em; }
.tpl-satellite .sa-console .dropdown-toggle::after { margin-left: .5em; color: var(--sa-ciano); }

/* le tendine */
.tpl-satellite .dropdown-menu {
  --bs-dropdown-bg               : #0B1527;
  --bs-dropdown-color            : #E3EAF6;
  --bs-dropdown-border-color     : var(--sa-bordo-luce);
  --bs-dropdown-link-color       : #E3EAF6;
  --bs-dropdown-link-hover-color : #FFFFFF;
  --bs-dropdown-link-hover-bg    : #15284A;
  --bs-dropdown-link-active-color: #FFFFFF;
  --bs-dropdown-link-active-bg   : rgba(99, 211, 255, .2);
  border-top    : 2px solid var(--sa-ciano);
  border-radius : 0 0 8px 8px;
  box-shadow    : 0 18px 36px rgba(0, 0, 0, .55);
  font-family   : var(--sa-sans);
  font-size     : 15.5px;
  line-height   : 1.35;
}
.tpl-satellite .dropdown-menu > li:hover { background-color: #12213D; }
.tpl-satellite .sa-console .dropdown-menu .nav-link,
.tpl-satellite .sa-console .dropdown-menu .dropdown-item {
  padding : 7px 14px;
  color   : #E3EAF6;
}
.tpl-satellite .sa-console .dropdown-menu a.nav-link:hover,
.tpl-satellite .sa-console .dropdown-menu a.nav-link:focus-visible,
.tpl-satellite .sa-console .dropdown-menu .dropdown-item:hover,
.tpl-satellite .sa-console .dropdown-menu .dropdown-item:focus-visible {
  color      : #FFFFFF;
  background : #17305A;
  box-shadow : inset 3px 0 0 var(--sa-ciano);
}
/* la pagina corrente: functions.php la scrive come <span class="nav-link"><strong>, senza link */
.tpl-satellite .sa-console .dropdown-menu span.nav-link {
  color      : var(--sa-arancio);
  box-shadow : inset 3px 0 0 var(--sa-arancio);
  cursor     : default;
}
.tpl-satellite .sa-console .dropdown-menu .float-end { color: var(--sa-ciano); }
.tpl-satellite .dropdown-menu .form-check-label { color: #E3EAF6; }

/* lingua, accesso e ricerca */
.tpl-satellite .select2-container--default .select2-selection--single {
  background-color : var(--sa-schermo);
  border           : 1px solid var(--sa-bordo-luce);
  border-radius    : 6px;
}
.tpl-satellite .select2-container--default .select2-selection--single .select2-selection__rendered {
  color       : #E3EAF6;
  font-family : var(--sa-mono);
  font-size   : 13px;
}
.tpl-satellite .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color : var(--sa-ciano) transparent transparent transparent;
}
.tpl-satellite .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color : transparent transparent var(--sa-ciano) transparent;
}
.tpl-satellite .select2-dropdown {
  background-color : #0B1527;
  border-color     : var(--sa-bordo-luce);
  color            : #E3EAF6;
  font-family      : var(--sa-mono);
  font-size        : 13px;
}
.tpl-satellite .select2-container--default .select2-search--dropdown .select2-search__field {
  background-color : var(--sa-schermo);
  border           : 1px solid var(--sa-bordo-luce);
  border-radius    : 4px;
  color            : #E3EAF6;
}
.tpl-satellite .select2-container--default .select2-results__option--selected { background-color: #13264A; }
.tpl-satellite .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color : #17305A;
  color            : #FFFFFF;
  box-shadow       : inset 3px 0 0 var(--sa-ciano);
}
.tpl-satellite .sa-console #search {
  background-color : var(--sa-schermo);
  border-color     : var(--sa-bordo-luce);
  color            : #E3EAF6;
  font-family      : var(--sa-mono);
  font-size        : 13px;
}
.tpl-satellite .sa-console #search::placeholder { color: #8395B2; }
.tpl-satellite .sa-console #search:focus { border-color: var(--sa-ciano); }
.tpl-satellite .sa-console .btn-outline-success {
  --bs-btn-color              : var(--sa-ciano);
  --bs-btn-border-color       : rgba(99, 211, 255, .55);
  --bs-btn-hover-color        : #FFFFFF;
  --bs-btn-hover-bg           : rgba(99, 211, 255, .15);
  --bs-btn-hover-border-color : var(--sa-ciano);
  --bs-btn-active-color       : #FFFFFF;
  --bs-btn-active-bg          : rgba(99, 211, 255, .26);
  --bs-btn-active-border-color: var(--sa-ciano);
  background-color            : #0C1A31;
}
.tpl-satellite .sa-console .btn-primary {
  --bs-btn-bg                 : #12223F;
  --bs-btn-border-color       : var(--sa-bordo-luce);
  --bs-btn-hover-bg           : #183058;
  --bs-btn-hover-border-color : var(--sa-ciano);
  --bs-btn-active-bg          : #183058;
  --bs-btn-active-border-color: var(--sa-ciano);
  --bs-btn-color              : var(--sa-ciano);
  --bs-btn-hover-color        : #FFFFFF;
}
.tpl-satellite .sa-console .navbar-toggler {
  margin        : 6px 0;
  padding       : 6px 10px;
  border        : 1px solid var(--sa-bordo-luce);
  border-radius : 6px;
  background    : #0F1C33;
}
.tpl-satellite .sa-console .navbar-toggler:focus { box-shadow: 0 0 0 2px var(--sa-ciano); }
.tpl-satellite .sa-console .personal-name {
  padding     : 0 6px 4px;
  background  : transparent;
  font-family : var(--sa-mono);
  font-size   : 12.5px;
  line-height : 1.4;
  color       : #C3D0E5;
}
.tpl-satellite .sa-console .personal-name::before {
  content        : "";
  display        : inline-block;
  width          : 7px;
  height         : 7px;
  margin-right   : 8px;
  border-radius  : 50%;
  vertical-align : 1px;
  background     : var(--sa-verde);
  box-shadow     : 0 0 6px var(--sa-verde);
}

/* ============ la traiettoria (breadcrumb_31, con breadcrumb_1) ============ */
.tpl-satellite .sa-traccia {
  display       : flex;
  flex-wrap     : wrap;
  align-items   : center;
  gap           : 6px 16px;
  margin        : 14px 0 0;
  padding       : 8px 14px;
  background    : rgba(4, 9, 21, .75);
  border        : 1px solid var(--sa-bordo);
  border-radius : 8px;
}
.tpl-satellite .sa-traccia-targa {
  padding        : 3px 9px 2px;
  border-radius  : 3px;
  background     : var(--sa-arancio);
  color          : #1A0E02;
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : 13px;
  line-height    : 1.2;
  letter-spacing : .16em;
  text-transform : uppercase;
}
.tpl-satellite .sa-traccia #breadcrumb_0 { background-color: transparent !important; }
.tpl-satellite .sa-traccia .breadcrumb {
  --bs-breadcrumb-divider : "";
  margin      : 0;
  row-gap     : 4px;
  font-family : var(--sa-mono);
  font-size   : 13.5px;
  line-height : 1.4;
}
/* ogni passaggio e' un punto della traccia; fra due passaggi, l'arco della traccia */
.tpl-satellite .sa-traccia .breadcrumb-item {
  display     : inline-flex;
  align-items : center;
  color       : #C3D0E5;
}
.tpl-satellite .sa-traccia .breadcrumb-item::before,
.tpl-satellite .sa-traccia .breadcrumb-item + .breadcrumb-item::before {
  content       : "";
  float         : none;
  flex          : 0 0 auto;
  width         : 7px;
  height        : 7px;
  margin-right  : 10px;
  padding       : 0;
  border-radius : 50%;
  background    : var(--sa-ciano);
  box-shadow    : 0 0 6px rgba(99, 211, 255, .7);
}
.tpl-satellite .sa-traccia .breadcrumb-item + .breadcrumb-item {
  padding-left : 40px;
  background   : radial-gradient(ellipse 15px 9px at 50% 100%, transparent 13px, rgba(99, 211, 255, .65) 14px, transparent 15px)
                 6px calc(50% - 5px) / 28px 10px no-repeat;
}
.tpl-satellite .sa-traccia .breadcrumb-item a { color: var(--sa-ciano); text-decoration: none; }
.tpl-satellite .sa-traccia .breadcrumb-item a:hover { color: #FFFFFF; text-decoration: underline; }
.tpl-satellite .sa-traccia .breadcrumb-item:last-child { color: #FFFFFF; font-weight: 600; }
.tpl-satellite .sa-traccia .breadcrumb-item:last-child::before {
  background : var(--sa-arancio);
  box-shadow : 0 0 9px rgba(255, 159, 67, .9);
}

/* ============ il corpo ============ */
.tpl-satellite .section-content.py-5 { padding-top: 30px !important; padding-bottom: 8px !important; }

/* il pannello: un display della sala, con il filo luminoso in testa e gli angoli segnati */
.tpl-satellite .sa-pannello {
  position      : relative;
  margin        : 0 0 32px;
  background    : linear-gradient(180deg, var(--sa-pannello-2) 0, var(--sa-pannello) 160px);
  border        : 1px solid var(--sa-bordo);
  border-radius : 10px;
  box-shadow    : 0 18px 36px rgba(0, 0, 0, .35);
}
.tpl-satellite .sa-pannello::before {
  content        : "";
  position       : absolute;
  inset          : -1px;
  border-radius  : inherit;
  pointer-events : none;
  /* gli angoli: quattro squadrette ciano, come i riferimenti di un display */
  background:
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 0 0 / 14px 2px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 0 0 / 2px 14px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 100% 0 / 14px 2px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 100% 0 / 2px 14px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 0 100% / 14px 2px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 0 100% / 2px 14px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 100% 100% / 14px 2px no-repeat,
    linear-gradient(var(--sa-ciano), var(--sa-ciano)) 100% 100% / 2px 14px no-repeat;
  opacity: .55;
}
.tpl-satellite .sa-pannello-testa {
  display       : flex;
  align-items   : center;
  gap           : 12px;
  padding       : 12px 20px;
  border-bottom : 1px solid var(--sa-bordo);
}
.tpl-satellite .sa-pannello-corpo { padding: 22px 24px 24px; }
.tpl-satellite .sa-sigla {
  flex           : 0 0 auto;
  padding        : 2px 8px 1px;
  border         : 1px solid rgba(99, 211, 255, .55);
  border-radius  : 4px;
  color          : var(--sa-ciano);
  font-family    : var(--sa-mono);
  font-size      : 12px;
  font-weight    : 600;
  line-height    : 1.4;
  letter-spacing : .06em;
}
.tpl-satellite .sa-pannello-nome,
.tpl-satellite .sa-pannello-testa h2,
.tpl-satellite .sa-sezione-testa h2 {
  flex           : 1 1 auto;
  margin         : 0;
  color          : #FFFFFF;
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : 25px;
  line-height    : 1.15;
  letter-spacing : .06em;
  text-transform : uppercase;
}
.tpl-satellite .sa-pannello-testa h3 {
  flex           : 1 1 auto;
  margin         : 0;
  color          : #FFFFFF;
  font-family    : var(--sa-titolo);
  font-weight    : 600;
  font-size      : 20px;
  line-height    : 1.2;
  letter-spacing : .04em;
}
.tpl-satellite .sa-esito {
  display        : inline-flex;
  align-items    : center;
  gap            : 7px;
  color          : var(--sa-verde);
  font-family    : var(--sa-mono);
  font-size      : 12px;
  letter-spacing : .06em;
  text-transform : uppercase;
  white-space    : nowrap;
}
.tpl-satellite .sa-esito::before {
  content       : "";
  width         : 7px;
  height        : 7px;
  border-radius : 50%;
  background    : var(--sa-verde);
  box-shadow    : 0 0 7px var(--sa-verde);
}
.tpl-satellite .sa-pannello .sillaba p { margin: 0 0 .8em; }
.tpl-satellite .sa-pannello .sillaba > p:last-child { margin-bottom: 0; }
.tpl-satellite .sa-premessa { max-width: 52em; margin-bottom: 22px; color: #D3DDEC; }

/* il profilo di missione */
.tpl-satellite .sa-apertura-corpo {
  display               : grid;
  grid-template-columns : minmax(0, 1.05fr) minmax(0, 1fr);
  gap                   : 28px 36px;
  align-items           : center;
  padding               : 26px 28px 28px;
}
.tpl-satellite .sa-titolo {
  margin         : 0 0 18px;
  color          : #FFFFFF;
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : clamp(38px, 4.4vw, 58px);
  line-height    : 1.02;
  letter-spacing : .01em;
  text-wrap      : balance;
}
.tpl-satellite .sa-attacco { font-size: 20px; line-height: 1.6; color: #F0F4FA; }
.tpl-satellite .sa-salti {
  display   : flex;
  flex-wrap : wrap;
  gap       : 8px;
  margin    : 22px 0 0;
}
.tpl-satellite .sa-salti a {
  display         : inline-flex;
  align-items     : center;
  gap             : 8px;
  padding         : 7px 13px 6px;
  border          : 1px solid var(--sa-bordo-luce);
  border-radius   : 6px;
  background      : rgba(4, 9, 21, .6);
  color           : #E3EAF6;
  font-family     : var(--sa-titolo);
  font-weight     : 600;
  font-size       : 16px;
  letter-spacing  : .06em;
  text-transform  : uppercase;
  text-decoration : none;
  transition      : border-color .15s ease, color .15s ease, transform .16s var(--sa-esce);
}
.tpl-satellite .sa-salti a:hover { border-color: var(--sa-ciano); color: #FFFFFF; }
.tpl-satellite .sa-salti a:active { transform: scale(.97); }
.tpl-satellite .sa-salto-n { color: var(--sa-ciano); font-family: var(--sa-mono); font-size: 12px; }

/* le tre quote in scala */
.tpl-satellite .sa-quote { margin: 0; }
.tpl-satellite .sa-quote-disegno {
  display       : block;
  width         : 100%;
  height        : auto;
  background    : radial-gradient(ellipse at 0 55%, rgba(31, 95, 184, .25), transparent 60%), var(--sa-schermo);
  border        : 1px solid var(--sa-bordo);
  border-radius : 8px;
}
.tpl-satellite .sa-q-orbita { fill: none; stroke-width: 1.5; stroke-dasharray: 5 5; }
.tpl-satellite .sa-q-leo { stroke: var(--sa-ciano); stroke-dasharray: none; }
.tpl-satellite .sa-q-meo { stroke: #B488F5; }
.tpl-satellite .sa-q-geo { stroke: var(--sa-arancio); }
.tpl-satellite .sa-q-sat { fill: #FFFFFF; stroke: var(--sa-vuoto); stroke-width: 1.5; }
.tpl-satellite .sa-q-sat-geo { fill: var(--sa-arancio); }
.tpl-satellite .sa-q-nome { fill: #FFFFFF; font-family: var(--sa-titolo); font-weight: 600; font-size: 17px; letter-spacing: .04em; }
.tpl-satellite .sa-q-dato { fill: var(--sa-tenue); font-family: var(--sa-mono); font-size: 11.5px; }
.tpl-satellite .sa-q-scala { fill: none; stroke: var(--sa-tenue); stroke-width: 1.5; }
.tpl-satellite .sa-quote figcaption {
  margin-top  : 10px;
  color       : var(--sa-tenue);
  font-size   : 14.5px;
  line-height : 1.5;
}

/* le quattro missioni */
.tpl-satellite .sa-flotta {
  display               : grid;
  grid-template-columns : repeat(2, minmax(0, 1fr));
  gap                   : 18px;
}
.tpl-satellite .sa-missione {
  display       : flex;
  gap           : 20px;
  align-items   : flex-start;
  padding       : 20px 22px 20px 20px;
  background    : linear-gradient(135deg, rgba(255, 255, 255, .025), transparent 60%), var(--sa-schermo);
  border        : 1px solid var(--sa-bordo);
  border-top    : 2px solid var(--tinta);
  border-radius : 8px;
}
.tpl-satellite .sa-toppa {
  flex       : 0 0 112px;
  width      : 112px;
  height     : 112px;
  filter     : drop-shadow(0 6px 10px rgba(0, 0, 0, .45));
  transition : transform .22s var(--sa-esce);
}
.tpl-satellite .sa-missione:hover .sa-toppa { transform: rotate(-6deg) scale(1.03); }
.tpl-satellite .sa-toppa-orlo { fill: #0A1222; stroke: var(--tinta); stroke-width: 3; }
.tpl-satellite .sa-toppa-campo {
  fill             : #0E1C36;
  stroke           : var(--tinta);
  stroke-width     : 1.4;
  stroke-dasharray : 2.6 2.2;   /* il punto del ricamo */
}
.tpl-satellite .sa-toppa-scritta {
  fill           : var(--tinta);
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : 10.5px;
  letter-spacing : .2em;
  text-transform : uppercase;
}
.tpl-satellite .sa-toppa-segno { fill: none; stroke: var(--tinta); stroke-width: 3.2; stroke-linecap: round; stroke-linejoin: round; }
.tpl-satellite .sa-toppa-fine { stroke-width: 2.2; }
.tpl-satellite .sa-toppa-punti { fill: var(--tinta); }
.tpl-satellite .sa-toppa-spettro path { fill: none; stroke-width: 2.4; stroke-linecap: round; }
.tpl-satellite .sa-missione-testo { min-width: 0; }
.tpl-satellite .sa-missione-nome {
  margin         : 0;
  color          : #FFFFFF;
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : 27px;
  line-height    : 1.1;
  letter-spacing : .03em;
}
.tpl-satellite .sa-missione-ambito {
  margin         : 2px 0 10px;
  color          : var(--tinta);
  font-family    : var(--sa-mono);
  font-size      : 12.5px;
  letter-spacing : .06em;
  text-transform : uppercase;
}
.tpl-satellite .sa-missione .sillaba p { font-size: 16.5px; line-height: 1.6; color: #D3DDEC; }
.tpl-satellite .sa-rimando {
  display         : inline-flex;
  align-items     : center;
  gap             : 7px;
  margin-top      : 12px;
  font-family     : var(--sa-mono);
  font-size       : 13.5px;
  text-decoration : none;
}
.tpl-satellite .sa-rimando:hover { text-decoration: underline; }

/* il segmento di terra */
.tpl-satellite .sa-sezione { margin: 0 0 32px; }
.tpl-satellite .sa-sezione-testa {
  display     : flex;
  align-items : center;
  gap         : 12px;
  margin      : 0 0 16px;
}
.tpl-satellite .sa-griglia-3 {
  display               : grid;
  grid-template-columns : repeat(3, minmax(0, 1fr));
  gap                   : 18px;
}
.tpl-satellite .sa-griglia-3 .sa-pannello { margin: 0; display: flex; flex-direction: column; }
.tpl-satellite .sa-strumento .sa-pannello-corpo { display: flex; flex-direction: column; gap: 18px; flex: 1 1 auto; }
.tpl-satellite .sa-strumento .sillaba p { font-size: 16.5px; line-height: 1.6; color: #D3DDEC; }
.tpl-satellite .sa-scheda {
  margin        : auto 0 0;
  padding       : 10px 12px;
  background    : var(--sa-schermo);
  border        : 1px solid var(--sa-bordo);
  border-radius : 6px;
  font-family   : var(--sa-mono);
  font-size     : 13px;
}
.tpl-satellite .sa-scheda div { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; }
.tpl-satellite .sa-scheda div + div { border-top: 1px dashed rgba(110, 140, 190, .25); }
.tpl-satellite .sa-scheda dt { color: var(--sa-tenue); font-weight: 400; }
.tpl-satellite .sa-scheda dd { margin: 0; color: var(--sa-ciano); text-align: right; }

.tpl-satellite .sa-catena { margin: auto 0 0; }
.tpl-satellite .sa-livelli {
  display         : flex;
  justify-content : space-between;
  margin          : 0 0 12px;
  padding         : 0;
  list-style      : none;
  position        : relative;
}
/* la linea che unisce i livelli */
.tpl-satellite .sa-livelli::before {
  content    : "";
  position   : absolute;
  left       : 22px;
  right      : 22px;
  top        : 15px;
  height     : 2px;
  background : linear-gradient(90deg, var(--sa-verde) 0 50%, rgba(255, 159, 67, .7) 50% 100%);
}
.tpl-satellite .sa-livelli li {
  position       : relative;
  display        : flex;
  flex-direction : column;
  align-items    : center;
  gap            : 3px;
  min-width      : 44px;
  font-family    : var(--sa-mono);
}
.tpl-satellite .sa-livelli b {
  display       : grid;
  place-items   : center;
  width         : 32px;
  height        : 32px;
  border-radius : 50%;
  background    : var(--sa-schermo);
  border        : 2px solid var(--sa-verde);
  color         : var(--sa-verde);
  font-size     : 12px;
}
.tpl-satellite .sa-livelli .sa-corso b { border-color: var(--sa-arancio); color: var(--sa-arancio); box-shadow: 0 0 12px rgba(255, 159, 67, .5); }
.tpl-satellite .sa-livelli span { color: var(--sa-tenue); font-size: 11.5px; }
.tpl-satellite .sa-lavoro {
  padding       : 10px 12px;
  background    : var(--sa-schermo);
  border        : 1px solid var(--sa-bordo);
  border-radius : 6px;
  font-family   : var(--sa-mono);
  font-size     : 12.5px;
  color         : var(--sa-tenue);
}
.tpl-satellite .sa-lavoro-riga { display: flex; justify-content: space-between; gap: 10px; }
.tpl-satellite .sa-lavoro-riga b { color: #FFFFFF; font-weight: 600; }
.tpl-satellite .sa-lavoro-pct { color: var(--sa-arancio); font-weight: 600; }
.tpl-satellite .sa-lavoro-arresto {
  padding       : 0 7px;
  border        : 1px solid rgba(255, 107, 107, .6);
  border-radius : 3px;
  color         : var(--sa-rosso);
  text-transform: uppercase;
  font-size     : 11px;
  line-height   : 1.6;
}
.tpl-satellite .sa-lavoro-barra {
  height        : 8px;
  margin        : 8px 0;
  border-radius : 4px;
  background    : #0E1A30;
  overflow      : hidden;
}
.tpl-satellite .sa-lavoro-barra span {
  display    : block;
  width      : calc(var(--p) * 1%);
  height     : 100%;
  background : repeating-linear-gradient(90deg, var(--sa-arancio) 0 6px, #FFB66E 6px 8px);
  box-shadow : 0 0 10px rgba(255, 159, 67, .55);
}
.tpl-satellite .sa-catena figcaption { margin-top: 8px; color: var(--sa-tenue); font-size: 13.5px; line-height: 1.45; }

.tpl-satellite .sa-comandi { display: grid; gap: 8px; margin: auto 0 0; padding: 0; list-style: none; }
.tpl-satellite .sa-comando {
  display         : flex;
  align-items     : center;
  justify-content : space-between;
  gap             : 10px;
  padding         : 9px 14px;
  border          : 1px solid rgba(99, 211, 255, .45);
  border-radius   : 6px;
  background      : rgba(99, 211, 255, .05);
  color           : #E3EAF6;
  font-family     : var(--sa-titolo);
  font-weight     : 600;
  font-size       : 17px;
  letter-spacing  : .05em;
  text-transform  : uppercase;
  text-decoration : none;
  transition      : background-color .15s ease, border-color .15s ease, transform .16s var(--sa-esce);
}
.tpl-satellite .sa-comando::after { content: "\203A"; color: var(--sa-ciano); font-size: 22px; line-height: 1; }
.tpl-satellite .sa-comando:hover { color: #FFFFFF; background-color: rgba(99, 211, 255, .14); border-color: var(--sa-ciano); }
.tpl-satellite .sa-comando:active { transform: scale(.97); }
.tpl-satellite .sa-comando-pieno {
  margin-top   : 18px;
  border-color : var(--sa-arancio);
  background   : var(--sa-arancio);
  color        : #1A0E02;
}
.tpl-satellite .sa-comando-pieno::after { color: #1A0E02; }
.tpl-satellite .sa-comando-pieno:hover { background: #FFB66E; border-color: #FFB66E; color: #1A0E02; }

/* la telemetria: un canale per contatore, un pacchetto per elemento */
.tpl-satellite .sa-canali {
  display               : grid;
  grid-template-columns : repeat(5, minmax(0, 1fr));
  gap                   : 14px;
  margin                : 0;
  padding               : 0;
  list-style            : none;
}
.tpl-satellite .sa-canale {
  display        : flex;
  flex-direction : column;
  gap            : 6px;
  padding        : 14px 14px 16px;
  background     : var(--sa-schermo);
  border         : 1px solid var(--sa-bordo);
  border-radius  : 8px;
}
.tpl-satellite .sa-canale-numero {
  color       : var(--sa-ciano);
  font-family : var(--sa-mono);
  font-size   : 42px;
  font-weight : 600;
  line-height : 1;
  font-variant-numeric: tabular-nums;
  text-shadow : 0 0 18px rgba(99, 211, 255, .35);
}
.tpl-satellite .sa-canale-voce { color: #D3DDEC; font-size: 15px; line-height: 1.4; min-height: 2.8em; }
.tpl-satellite .sa-pacchetti { display: flex; flex-wrap: wrap; gap: 3px; margin-top: auto; }
.tpl-satellite .sa-pacchetti i {
  width         : 8px;
  height        : 8px;
  border-radius : 1.5px;
  background    : var(--sa-ciano);
  box-shadow    : 0 0 5px rgba(99, 211, 255, .55);
}
.tpl-satellite .sa-canale-missioni .sa-canale-numero { color: var(--sa-arancio); text-shadow: 0 0 18px rgba(255, 159, 67, .35); }
.tpl-satellite .sa-canale-missioni .sa-pacchetti i { background: var(--sa-arancio); box-shadow: 0 0 5px rgba(255, 159, 67, .6); }
/* l'arrivo dei pacchetti: satellite.js mette sa-in-attesa, poi sa-in-arrivo quando il canale e'
   sullo schermo; --i e' l'ordine del pacchetto. Senza JavaScript sono accesi da subito. */
.tpl-satellite .sa-in-attesa .sa-pacchetti i { opacity: .12; box-shadow: none; }
.tpl-satellite .sa-in-arrivo .sa-pacchetti i {
  opacity    : 1;
  box-shadow : 0 0 5px rgba(99, 211, 255, .55);
  transition : opacity .18s ease-out calc(var(--i, 0) * 28ms), box-shadow .18s ease-out calc(var(--i, 0) * 28ms);
}
.tpl-satellite .sa-nota { margin: 14px 0 0; color: var(--sa-tenue); font-family: var(--sa-mono); font-size: 13px; }

/* i requisiti e il passaggio */
.tpl-satellite .sa-coppia {
  display               : grid;
  grid-template-columns : minmax(0, 1.6fr) minmax(0, 1fr);
  gap                   : 18px;
  align-items           : start;
}
.tpl-satellite .sa-coppia .sa-pannello { margin-bottom: 32px; }
.tpl-satellite .sa-regole {
  display               : grid;
  grid-template-columns : repeat(2, minmax(0, 1fr));
  gap                   : 0;
  margin                : 0;
  padding               : 0;
  list-style            : none;
}
.tpl-satellite .sa-regole li { padding: 18px 22px 20px; border-bottom: 1px solid var(--sa-bordo); }
.tpl-satellite .sa-regole li:nth-child(odd) { border-right: 1px solid var(--sa-bordo); }
.tpl-satellite .sa-regole li:nth-last-child(-n+2) { border-bottom: 0; }
.tpl-satellite .sa-req { color: var(--sa-arancio); font-family: var(--sa-mono); font-size: 12px; font-weight: 600; letter-spacing: .06em; }
.tpl-satellite .sa-regole h3 {
  margin         : 4px 0 6px;
  color          : #FFFFFF;
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : 20px;
  line-height    : 1.2;
  letter-spacing : .04em;
  text-transform : uppercase;
}
.tpl-satellite .sa-regole p { font-size: 16px; line-height: 1.55; color: #D3DDEC; }
.tpl-satellite .sa-elenco { margin: .4em 0 0; padding-left: 0; list-style: none; }
.tpl-satellite .sa-elenco li { position: relative; padding-left: 20px; margin-bottom: .45em; font-size: 16.5px; line-height: 1.5; color: #D3DDEC; }
.tpl-satellite .sa-elenco li::before {
  content    : "";
  position   : absolute;
  left       : 2px;
  top        : .6em;
  width      : 8px;
  height     : 2px;
  background : var(--sa-ciano);
}

/* ============ la sala di controllo (footer_31) ============ */
.tpl-satellite .sa-controllo {
  margin        : 8px 0 0;
  padding       : 24px 26px 14px;
  background    : linear-gradient(180deg, #0A1324, #060C18);
  border        : 1px solid var(--sa-bordo);
  border-bottom : 0;
  border-radius : 12px 12px 0 0;
  color         : var(--sa-tenue);
  font-size     : 15px;
  line-height   : 1.55;
}
.tpl-satellite .sa-controllo-pannelli {
  display               : grid;
  grid-template-columns : minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1.2fr);
  gap                   : 22px 32px;
}
.tpl-satellite .sa-controllo-titolo {
  margin         : 0 0 8px;
  color          : #FFFFFF;
  font-family    : var(--sa-titolo);
  font-weight    : 700;
  font-size      : 16px;
  letter-spacing : .14em;
  text-transform : uppercase;
}
.tpl-satellite .sa-controllo-testo { margin: 0 0 6px; }
.tpl-satellite .sa-controllo-coord { color: var(--sa-ciano); font-family: var(--sa-mono); font-size: 13px; white-space: pre; }
.tpl-satellite .sa-controllo-data { font-family: var(--sa-mono); font-size: 13px; }
.tpl-satellite .sa-controllo-sistemi { margin: 0; padding: 0; list-style: none; font-family: var(--sa-mono); font-size: 13.5px; }
.tpl-satellite .sa-controllo-sistemi li { display: flex; align-items: center; gap: 9px; padding: 2px 0; }
.tpl-satellite .sa-controllo-sistemi b { color: #E3EAF6; font-weight: 600; min-width: 7.5em; }
.tpl-satellite .sa-controllo-ok {
  width         : 7px;
  height        : 7px;
  border-radius : 50%;
  background    : var(--sa-verde);
  box-shadow    : 0 0 6px var(--sa-verde);
}
.tpl-satellite .sa-controllo-crediti {
  margin      : 18px 0 0;
  padding     : 12px 0 0;
  border-top  : 1px solid var(--sa-bordo);
  font-size   : 13.5px;
}
.tpl-satellite .sa-controllo-stato {
  display         : flex;
  flex-wrap       : wrap;
  align-items     : center;
  justify-content : space-between;
  gap             : 8px 18px;
  margin-top      : 10px;
}
.tpl-satellite .sa-controllo-stato p { margin: 0; }
.tpl-satellite .sa-controllo-su {
  font-family     : var(--sa-titolo);
  font-weight     : 600;
  font-size       : 15px;
  letter-spacing  : .1em;
  text-transform  : uppercase;
  text-decoration : none;
}
.tpl-satellite .sa-controllo-su::before { content: "\2191\00a0"; }

/* ============ la finestra modale, al buio come il resto ============ */
.tpl-satellite .modal-content { border: 1px solid var(--sa-bordo-luce); box-shadow: 0 24px 50px rgba(0, 0, 0, .6); }
.tpl-satellite .modal-header { border-bottom-color: rgba(110, 140, 190, .3); }
.tpl-satellite .modal-footer { border-top-color: rgba(110, 140, 190, .3); }
.tpl-satellite .modal .btn-secondary {
  --bs-btn-bg                : #12223F;
  --bs-btn-border-color      : var(--sa-bordo-luce);
  --bs-btn-hover-bg          : #183058;
  --bs-btn-hover-border-color: var(--sa-ciano);
  --bs-btn-color             : #E3EAF6;
  --bs-btn-hover-color       : #FFFFFF;
}
/* il riquadro dei cookie: cookie.css lo fa bianco, e il testo, che eredita dalla pagina, qui e'
   chiaro (contrasto 1,2:1). Al buio come la modale. */
.tpl-satellite #cookie-banner {
  background       : var(--sa-pannello);
  border-top-color : var(--sa-ciano);
  box-shadow       : 0 -12px 30px rgba(0, 0, 0, .55);
}

/* ============ schermi piu' stretti ============ */
@media (max-width: 1199px) {
  .tpl-satellite .sa-canali { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 991px) {
  .tpl-satellite .sa-orbita-riga {
    grid-template-columns : minmax(0, 1fr);
    min-height            : 0;
    padding-top           : 26px;
    padding-bottom        : 26px;
  }
  .tpl-satellite .sa-terra { width: min(100%, 440px); margin: 0 auto; }
  .tpl-satellite .sa-letture { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tpl-satellite .sa-lettura:nth-child(3) { border-left: 0; padding-left: 0; }
  .tpl-satellite .sa-lettura:nth-child(n+3) { border-top: 1px solid var(--sa-bordo); }
  .tpl-satellite .sa-apertura-corpo { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-flotta { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-griglia-3 { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-coppia { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-controllo-pannelli { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .tpl-satellite .sa-console .navbar-nav > .nav-item > .nav-link { margin-right: 0; }
}
@media (max-width: 767px) {
  .tpl-satellite { font-size: 17px; }
  .tpl-satellite .sa-canali { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tpl-satellite .sa-regole { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-regole li:nth-child(odd) { border-right: 0; }
  .tpl-satellite .sa-regole li:nth-last-child(2) { border-bottom: 1px solid var(--sa-bordo); }
  .tpl-satellite .sa-controllo-pannelli { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 575px) {
  .tpl-satellite .sa-letture { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-lettura { border-left: 0; padding-left: 0; }
  .tpl-satellite .sa-lettura + .sa-lettura { border-top: 1px solid var(--sa-bordo); }
  .tpl-satellite .sa-pannello-corpo,
  .tpl-satellite .sa-apertura-corpo { padding: 18px 16px 20px; }
  .tpl-satellite .sa-pannello-testa { padding: 10px 14px; flex-wrap: wrap; }
  .tpl-satellite .sa-missione { flex-direction: column; align-items: center; text-align: center; }
  .tpl-satellite .sa-missione-testo { text-align: left; }
  .tpl-satellite .sa-canali { grid-template-columns: minmax(0, 1fr); }
  .tpl-satellite .sa-canale-voce { min-height: 0; }
  .tpl-satellite .sa-controllo { padding: 20px 16px 12px; }
}

/* ============ su carta ============ */
@media print {
  .tpl-satellite .sa-in-attesa .sa-pacchetti i { opacity: 1; }   /* sulla carta non si scorre */
}

/* ============ meno movimento ============ */
@media (prefers-reduced-motion: reduce) {
  .tpl-satellite .sa-spia,
  .tpl-satellite .sa-ifac i::after { animation: none; }
  .tpl-satellite .sa-ifac i::after { opacity: 0; }
  .tpl-satellite .sa-missione:hover .sa-toppa { transform: none; }
  .tpl-satellite .sa-in-arrivo .sa-pacchetti i { transition: none; }
  .tpl-satellite .sa-comando,
  .tpl-satellite .sa-salti a { transition: none; }
}

/* la precedente e la successiva della cartella (common/breadcrumb/prev_next.php), sotto le briciole */
.tpl-satellite .prevNext { margin: 8px 0 0; font-family: var(--sa-mono); font-size: 13px; }
.tpl-satellite .prevNext-verso { font-family: var(--sa-titolo); font-size: 13px; letter-spacing: .12em; text-transform: uppercase; color: var(--sa-arancio); }