/* Final hub route visibility overrides loaded after the legacy homepage stylesheet. */
.site-switcher {
  grid-template-columns: repeat(15, minmax(0, 1fr)) !important;
}

.site-switcher .switch-truckschool::before,
.truckschool-card::before,
.truckschool-preview .preview-shot,
.front-page .panel-truckschool::before,
.front-page .directory-truckschool::before,
.route-preview-drawer[data-active-route="truckschool"] b,
.front-page.enter-truckschool .page-transition b {
  background-image: url("truck-school/media/14-cockpit-both-mirrors.png") !important;
  background-position: center !important;
  background-size: cover !important;
}

.site-switcher .switch-flight::before,
.flight-card::before,
.flight-preview .preview-shot,
.front-page .panel-flight::before,
.front-page .directory-flight::before,
.route-preview-drawer[data-active-route="flight"] b,
.front-page.enter-flight .page-transition b {
  background-image: url("assets/previews/flight-tracker-preview.png") !important;
}

.site-switcher .switch-education::before,
.education-card::before,
.education-preview .preview-shot,
.front-page .panel-education::before,
.front-page .directory-education::before,
.route-preview-drawer[data-active-route="education"] b,
.front-page.enter-education .page-transition b {
  background-image: url("assets/previews/ai-school-preview.png") !important;
}

.site-switcher .switch-pizdon::before,
.pizdon-card::before,
.pizdon-preview .preview-shot,
.front-page .panel-pizdon::before,
.front-page .directory-pizdon::before,
.route-preview-drawer[data-active-route="pizdon"] b,
.front-page.enter-pizdon .page-transition b {
  background-image: url("pizdon/assets/pizdon-storefront-lineup.png") !important;
}

.site-switcher .switch-alert::before,
.alert-card::before,
.alert-preview .preview-shot,
.front-page .panel-alert::before,
.front-page .directory-alert::before,
.route-preview-drawer[data-active-route="alert"] b,
.front-page.enter-alert .page-transition b {
  background:
    radial-gradient(circle at 30% 64%, rgba(125, 240, 177, 0.9) 0 3px, transparent 4px),
    radial-gradient(circle at 58% 42%, rgba(255, 209, 93, 0.86) 0 4px, transparent 5px),
    radial-gradient(circle at 76% 28%, rgba(255, 95, 84, 0.9) 0 3px, transparent 4px),
    repeating-linear-gradient(90deg, rgba(125, 240, 177, 0.2) 0 2px, transparent 2px 42px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.12) 0 2px, transparent 2px 38px),
    linear-gradient(135deg, #11201b, #201b12 52%, #11171a) !important;
}

.site-switcher .switch-tracker::before,
.tracker-card::before,
.tracker-preview .preview-shot,
.front-page .panel-tracker::before,
.front-page .directory-tracker::before,
.route-preview-drawer[data-active-route="tracker"] b,
.front-page.enter-tracker .page-transition b {
  background:
    linear-gradient(135deg, rgba(125, 240, 177, 0.28), transparent 38%),
    linear-gradient(315deg, rgba(121, 183, 255, 0.24), transparent 40%),
    repeating-linear-gradient(90deg, rgba(255,255,255,0.16) 0 2px, transparent 2px 42px),
    repeating-linear-gradient(0deg, rgba(255,255,255,0.12) 0 2px, transparent 2px 38px),
    #10191c !important;
}

.site-switcher .switch-monitoring::before,
.monitoring-card::before,
.monitoring-preview .preview-shot,
.front-page .panel-monitoring::before,
.front-page .directory-monitoring::before,
.route-preview-drawer[data-active-route="monitoring"] b,
.front-page.enter-monitoring .page-transition b {
  background:
    linear-gradient(135deg, rgba(255, 209, 93, 0.32), transparent 36%),
    linear-gradient(315deg, rgba(255, 109, 102, 0.24), transparent 42%),
    repeating-linear-gradient(90deg, rgba(125, 242, 194, 0.22) 0 2px, transparent 2px 46px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.14) 0 2px, transparent 2px 34px),
    #101012 !important;
}

.flight-card::before {
  --gateway-card-x: calc(var(--gateway-studio-x) * -0.08);
  --gateway-card-y: calc(var(--gateway-game-y) * 0.18);
  opacity: 0.84;
  animation-delay: -13s;
}

.flight-card::after {
  background:
    radial-gradient(circle at 26% 26%, rgba(96, 231, 255, 0.24), transparent 20%),
    radial-gradient(circle at 72% 48%, rgba(125, 244, 190, 0.16), transparent 18%),
    linear-gradient(180deg, rgba(7, 8, 12, 0.08), rgba(7, 8, 12, 0.9));
}

.education-card::before {
  --gateway-card-x: calc(var(--gateway-studio-x) * 0.18);
  --gateway-card-y: calc(var(--gateway-game-y) * 0.28);
  opacity: 0.82;
  animation-delay: -11s;
}

.pizdon-card::before {
  --gateway-card-x: calc(var(--gateway-studio-x) * -0.18);
  --gateway-card-y: calc(var(--gateway-game-y) * 0.06);
  opacity: 0.86;
  animation-delay: -15s;
}

.pizdon-card::after {
  background:
    radial-gradient(circle at 28% 30%, rgba(255, 255, 255, 0.22), transparent 19%),
    radial-gradient(circle at 76% 58%, rgba(220, 48, 44, 0.16), transparent 21%),
    linear-gradient(180deg, rgba(7, 8, 12, 0.06), rgba(7, 8, 12, 0.9));
}

.alert-card::before {
  --gateway-card-x: calc(var(--gateway-studio-x) * 0.14);
  --gateway-card-y: calc(var(--gateway-game-y) * -0.1);
  opacity: 0.86;
  animation-delay: -16s;
}

.alert-card::after {
  background:
    radial-gradient(circle at 28% 60%, rgba(125, 240, 177, 0.24), transparent 18%),
    radial-gradient(circle at 72% 34%, rgba(255, 95, 84, 0.2), transparent 22%),
    linear-gradient(180deg, rgba(7, 8, 12, 0.08), rgba(7, 8, 12, 0.9));
}

.tracker-card::before {
  --gateway-card-x: calc(var(--gateway-studio-x) * 0.08);
  --gateway-card-y: calc(var(--gateway-game-y) * -0.14);
  opacity: 0.84;
  animation-delay: -9s;
}

.tracker-card::after {
  background:
    radial-gradient(circle at 28% 26%, rgba(125, 240, 177, 0.26), transparent 19%),
    radial-gradient(circle at 70% 62%, rgba(121, 183, 255, 0.2), transparent 20%),
    linear-gradient(180deg, rgba(7, 8, 12, 0.08), rgba(7, 8, 12, 0.9));
}

.monitoring-card::before {
  --gateway-card-x: calc(var(--gateway-studio-x) * -0.14);
  --gateway-card-y: calc(var(--gateway-game-y) * 0.1);
  opacity: 0.84;
  animation-delay: -7s;
}

.monitoring-card::after {
  background:
    radial-gradient(circle at 72% 34%, rgba(255, 209, 93, 0.28), transparent 18%),
    radial-gradient(circle at 40% 62%, rgba(255, 109, 102, 0.18), transparent 20%),
    linear-gradient(180deg, rgba(7, 8, 12, 0.08), rgba(7, 8, 12, 0.9));
}

.front-page .gateway-grid,
.front-page .gateway-grid:has(.gateway-card:hover),
.front-page .gateway-grid:has(.gateway-card:focus-within),
.front-page .gateway-grid:has(.flight-card:hover),
.front-page .gateway-grid:has(.flight-card:focus-within),
.front-page .gateway-grid:has(.tracker-card:hover),
.front-page .gateway-grid:has(.tracker-card:focus-within),
.front-page .gateway-grid:has(.pizdon-card:hover),
.front-page .gateway-grid:has(.pizdon-card:focus-within),
.front-page .gateway-grid:has(.alert-card:hover),
.front-page .gateway-grid:has(.alert-card:focus-within),
.front-page .gateway-grid:has(.monitoring-card:hover),
.front-page .gateway-grid:has(.monitoring-card:focus-within),
.front-page .gateway-grid:has(.education-card:hover),
.front-page .gateway-grid:has(.education-card:focus-within) {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.front-page .motion-panels,
.front-page .motion-panels:has(.motion-panel:hover),
.front-page .motion-panels:has(.motion-panel:focus-visible),
.front-page .motion-panels:has(.panel-flight:hover),
.front-page .motion-panels:has(.panel-flight:focus-visible),
.front-page .motion-panels:has(.panel-tracker:hover),
.front-page .motion-panels:has(.panel-tracker:focus-visible),
.front-page .motion-panels:has(.panel-pizdon:hover),
.front-page .motion-panels:has(.panel-pizdon:focus-visible),
.front-page .motion-panels:has(.panel-alert:hover),
.front-page .motion-panels:has(.panel-alert:focus-visible),
.front-page .motion-panels:has(.panel-monitoring:hover),
.front-page .motion-panels:has(.panel-monitoring:focus-visible),
.front-page .motion-panels:has(.panel-education:hover),
.front-page .motion-panels:has(.panel-education:focus-visible),
.front-page .directory-board {
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

.front-page .panel-flight {
  min-height: 302px !important;
  transform: translate3d(12px, -14px, 0) rotate(0.4deg);
}

.front-page .panel-flight::before {
  --wall-image-x: -10px;
  --wall-image-y: 14px;
  animation-delay: -12s;
}

.front-page .panel-education {
  min-height: 302px !important;
  transform: translate3d(-12px, 18px, 0) rotate(-0.4deg);
}

.front-page .panel-tracker {
  min-height: 302px !important;
  transform: translate3d(6px, 18px, 0) rotate(-0.2deg);
}

.front-page .panel-tracker::before {
  --wall-image-x: 10px;
  --wall-image-y: -6px;
  animation-delay: -10s;
}

.front-page .panel-pizdon {
  min-height: 302px !important;
  transform: translate3d(-10px, 12px, 0) rotate(-0.35deg);
}

.front-page .panel-pizdon::before {
  --wall-image-x: -6px;
  --wall-image-y: 10px;
  animation-delay: -14s;
}

.front-page .panel-alert {
  min-height: 302px !important;
  transform: translate3d(8px, -16px, 0) rotate(0.35deg);
}

.front-page .panel-alert::before {
  --wall-image-x: 8px;
  --wall-image-y: -8px;
  animation-delay: -15s;
}

.front-page .panel-monitoring {
  min-height: 302px !important;
  transform: translate3d(-8px, -10px, 0) rotate(0.25deg);
}

.front-page .panel-monitoring::before {
  --wall-image-x: -8px;
  --wall-image-y: -12px;
  animation-delay: -8s;
}

.route-line-flight {
  left: 45%;
  top: 42%;
  width: 31%;
  transform: rotate(12deg);
}

.route-line-pizdon {
  left: 43%;
  top: 44%;
  width: 28%;
  transform: rotate(3deg);
}

.route-line-alert {
  left: 33%;
  top: 42%;
  width: 26%;
  transform: rotate(-16deg);
}

.route-line-alert::after {
  animation-delay: -520ms;
}

.route-line-pizdon::after {
  animation-delay: -760ms;
}

.route-line-flight::after {
  animation-delay: -900ms;
}

.route-line-education {
  left: 47%;
  top: 50%;
  width: 34%;
  transform: rotate(-26deg);
}

.route-line-tracker {
  left: 46%;
  top: 47%;
  width: 32%;
  transform: rotate(-7deg);
}

.route-line-tracker::after {
  animation-delay: -680ms;
}

.route-radar[data-active-route="flight"] .route-line-flight,
.front-page:has(a[data-route="flight"]:hover) .route-line-flight,
.front-page:has(a[data-route="flight"]:focus-visible) .route-line-flight,
.route-radar[data-active-route="pizdon"] .route-line-pizdon,
.front-page:has(a[data-route="pizdon"]:hover) .route-line-pizdon,
.front-page:has(a[data-route="pizdon"]:focus-visible) .route-line-pizdon,
.route-radar[data-active-route="alert"] .route-line-alert,
.front-page:has(a[data-route="alert"]:hover) .route-line-alert,
.front-page:has(a[data-route="alert"]:focus-visible) .route-line-alert,
.route-radar[data-active-route="tracker"] .route-line-tracker,
.front-page:has(a[data-route="tracker"]:hover) .route-line-tracker,
.front-page:has(a[data-route="tracker"]:focus-visible) .route-line-tracker,
.route-radar[data-active-route="education"] .route-line-education,
.front-page:has(a[data-route="education"]:hover) .route-line-education,
.front-page:has(a[data-route="education"]:focus-visible) .route-line-education {
  height: 5px;
  opacity: 1;
}

.front-page:has(a[data-route="flight"]:hover) .route-node[data-route="flight"],
.front-page:has(a[data-route="flight"]:focus-visible) .route-node[data-route="flight"] {
  border-color: rgba(96, 231, 255, 0.58);
  background: rgba(19, 95, 114, 0.26);
}

.front-page:has(a[data-route="education"]:hover) .route-node[data-route="education"],
.front-page:has(a[data-route="education"]:focus-visible) .route-node[data-route="education"] {
  border-color: rgba(198, 61, 55, 0.58);
  background: rgba(198, 61, 55, 0.2);
}

.front-page:has(a[data-route="tracker"]:hover) .route-node[data-route="tracker"],
.front-page:has(a[data-route="tracker"]:focus-visible) .route-node[data-route="tracker"] {
  border-color: rgba(125, 240, 177, 0.58);
  background: rgba(42, 101, 75, 0.24);
}

.front-page:has(a[data-route="pizdon"]:hover) .route-node[data-route="pizdon"],
.front-page:has(a[data-route="pizdon"]:focus-visible) .route-node[data-route="pizdon"] {
  border-color: rgba(255, 255, 255, 0.62);
  background: rgba(182, 40, 40, 0.22);
}

.front-page:has(a[data-route="alert"]:hover) .route-node[data-route="alert"],
.front-page:has(a[data-route="alert"]:focus-visible) .route-node[data-route="alert"] {
  border-color: rgba(125, 240, 177, 0.62);
  background: rgba(26, 100, 70, 0.24);
}

.route-flight,
.front-page #siteBoard .route-flight {
  right: 8% !important;
  top: 58% !important;
}

.route-pizdon,
.front-page #siteBoard .route-pizdon {
  right: 20% !important;
  top: 55% !important;
}

.route-alert,
.front-page #siteBoard .route-alert {
  left: 6% !important;
  top: 62% !important;
}

.route-tracker,
.front-page #siteBoard .route-tracker {
  right: 16% !important;
  top: 43% !important;
}

.route-education,
.front-page #siteBoard .route-education {
  right: 5% !important;
  top: 31% !important;
}

.front-page.enter-flight .page-transition {
  background:
    linear-gradient(135deg, rgba(96, 231, 255, 0.22), transparent 42%),
    linear-gradient(315deg, rgba(125, 244, 190, 0.14), transparent 42%),
    rgba(6, 8, 12, 0.96);
}

.front-page.enter-education .page-transition {
  background:
    linear-gradient(135deg, rgba(198, 61, 55, 0.22), transparent 42%),
    linear-gradient(315deg, rgba(46, 128, 99, 0.18), transparent 42%),
    rgba(6, 8, 12, 0.96);
}

.front-page.enter-tracker .page-transition {
  background:
    linear-gradient(135deg, rgba(125, 240, 177, 0.2), transparent 42%),
    linear-gradient(315deg, rgba(121, 183, 255, 0.16), transparent 42%),
    rgba(6, 8, 12, 0.96);
}

.front-page.enter-pizdon .page-transition {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.18), transparent 42%),
    linear-gradient(315deg, rgba(194, 39, 39, 0.16), transparent 42%),
    rgba(6, 8, 12, 0.96);
}

.front-page.enter-alert .page-transition {
  background:
    linear-gradient(135deg, rgba(125, 240, 177, 0.2), transparent 42%),
    linear-gradient(315deg, rgba(255, 95, 84, 0.16), transparent 42%),
    rgba(6, 8, 12, 0.96);
}

.front-page.enter-monitoring .page-transition {
  background:
    linear-gradient(135deg, rgba(255, 209, 93, 0.2), transparent 42%),
    linear-gradient(315deg, rgba(255, 109, 102, 0.16), transparent 42%),
    rgba(6, 8, 12, 0.96);
}

@media (max-width: 1050px) {
  .site-switcher {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }

  .front-page .gateway-grid,
  .front-page .gateway-grid:has(.gateway-card:hover),
  .front-page .gateway-grid:has(.gateway-card:focus-within),
  .front-page .motion-panels,
  .front-page .motion-panels:has(.motion-panel:hover),
  .front-page .motion-panels:has(.motion-panel:focus-visible),
  .front-page .directory-board {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 680px) {
  .front-page .gateway-grid,
  .front-page .gateway-grid:has(.gateway-card:hover),
  .front-page .gateway-grid:has(.gateway-card:focus-within),
  .front-page .motion-panels,
  .front-page .motion-panels:has(.motion-panel:hover),
  .front-page .motion-panels:has(.motion-panel:focus-visible),
  .front-page .directory-board {
    grid-template-columns: 1fr !important;
  }

  .front-page .panel-flight,
  .front-page .panel-tracker,
  .front-page .panel-pizdon,
  .front-page .panel-alert,
  .front-page .panel-monitoring,
  .front-page .panel-education,
  .front-page .directory-flight,
  .front-page .directory-tracker,
  .front-page .directory-pizdon,
  .front-page .directory-alert,
  .front-page .directory-monitoring,
  .front-page .directory-education {
    min-height: 172px !important;
    transform: none !important;
  }

  .front-page #siteBoard .route-flight,
  .front-page #siteBoard .route-tracker,
  .front-page #siteBoard .route-pizdon,
  .front-page #siteBoard .route-alert,
  .front-page #siteBoard .route-education {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-height: 68px !important;
  }
}

/* Roger Dolan Radio route */
.front-page .radio-card,.front-page .directory-radio,.front-page .panel-radio{border-color:rgba(200,255,49,.42)!important}
.front-page .radio-preview{background:radial-gradient(circle at 68% 45%,rgba(255,91,53,.52),transparent 22%),repeating-radial-gradient(circle at 68% 45%,#181816 0 5px,#2b2a26 6px 9px),linear-gradient(135deg,#c8ff31,#111)!important}
.front-page .panel-radio{min-height:302px!important;transform:translate3d(6px,-4px,0) rotate(-.2deg)}
.route-line-radio{left:49%;top:50%;width:31%;transform:rotate(19deg);transform-origin:left center}
.route-radar[data-active-route="radio"] .route-line-radio,.front-page:has(a[data-route="radio"]:hover) .route-line-radio,.front-page:has(a[data-route="radio"]:focus-visible) .route-line-radio{height:5px;opacity:1;background:#c8ff31}
.route-radio,.front-page #siteBoard .route-radio{right:4%!important;top:62%!important}
.front-page.enter-radio .page-transition{background:linear-gradient(135deg,rgba(200,255,49,.22),transparent 42%),linear-gradient(315deg,rgba(255,91,53,.2),transparent 42%),rgba(6,8,12,.96)}
@media(max-width:760px){.front-page .panel-radio,.front-page .directory-radio{min-height:172px!important;transform:none!important}.front-page #siteBoard .route-radio{position:relative!important;inset:auto!important;width:100%!important}}
