/* Homepage-only motion pass. The shared site remains untouched. */

.home-page {
  --home-sweep-duration: 1.72s;
  --home-first-sweep-delay: 0.28s;
  --home-second-sweep-delay: 1.12s;
  --home-detail-delay: 3s;
  --home-card-delay: 3.26s;
  --home-motion-ease: cubic-bezier(0.16, 0.76, 0.22, 1);
}

.home-page .page-hero {
  min-height: 70svh;
}

.home-page .hero-grid {
  align-items: center;
}

.home-hero-copy {
  max-width: 840px;
}

.home-title-sweep {
  position: relative;
  width: min(820px, 100%);
  margin-bottom: 22px;
}

.home-title-sweep h1 {
  max-width: none;
  margin: 0;
  font-size: clamp(3.8rem, 7vw, 6.8rem);
  line-height: 0.92;
  letter-spacing: -0.045em;
  text-wrap: normal;
}

.home-title-line {
  position: relative;
  display: block;
  width: fit-content;
  max-width: 100%;
}

.home-title-line > span {
  display: block;
}

.home-title-disc {
  display: none;
}

.home-page .page-hero .lede {
  max-width: 650px;
}

.home-page .page-hero .btn {
  min-height: 50px;
  border-radius: 999px;
  padding-inline: 20px;
}

.home-page .hero-card {
  border-width: 1px;
  border-radius: 18px;
  padding: 24px;
  background: rgba(5, 8, 13, 0.5);
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.24);
}

.home-page .hero-card::after {
  right: -70px;
  bottom: -82px;
  width: 180px;
  border-width: 12px;
  opacity: 0.58;
}

.home-page main a:focus-visible,
.home-page main button:focus-visible {
  outline: 3px solid var(--qcc-blue-soft);
  outline-offset: 4px;
}

/* The disc and title share one timing curve so the title appears behind it. */
.home-motion-ready [data-hero-eyebrow] {
  opacity: 0;
  transform: translateY(6px);
  animation: home-copy-in 0.62s ease-out var(--home-detail-delay) forwards;
}

.home-motion-ready .home-title-line > span {
  clip-path: inset(0 100% 0 0);
}

.home-motion-ready .home-title-line-second > span {
  clip-path: inset(0 0 0 100%);
}

.home-motion-ready .home-title-disc {
  position: fixed;
  top: var(--disc-center-y, 50vh);
  left: -64px;
  z-index: 10;
  display: block;
  width: 46px;
  height: 42px;
  border: 1px solid rgba(83, 14, 24, 0.48);
  border-radius: 50%;
  opacity: 0;
  background: linear-gradient(165deg, #cf3948 0%, #c52d3e 58%, #b52536 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 0 2px rgba(83, 7, 17, 0.08),
    0 3px 0 rgba(91, 11, 23, 0.72),
    0 6px 9px rgba(0, 0, 0, 0.18);
  pointer-events: none;
}

.home-motion-ready .home-title-disc-second {
  right: auto;
  border-color: rgba(8, 65, 112, 0.48);
  background: linear-gradient(165deg, #439fe2 0%, #328fd4 58%, #2780c1 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.11),
    inset 0 0 0 2px rgba(2, 47, 83, 0.08),
    0 3px 0 rgba(6, 70, 114, 0.72),
    0 6px 9px rgba(0, 0, 0, 0.18);
}

.home-motion-ready [data-hero-detail],
.home-motion-ready [data-hero-card] {
  opacity: 0;
  transform: translateY(9px);
  animation: home-detail-in 0.68s ease-out calc(var(--home-detail-delay) + 0.12s) forwards;
}

.home-motion-ready .hero-actions[data-hero-detail] {
  animation-delay: calc(var(--home-detail-delay) + 0.3s);
}

.home-motion-ready [data-hero-card] {
  animation-duration: 0.52s;
  animation-delay: var(--home-card-delay);
}

@keyframes home-copy-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes home-detail-in {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Preserve the original continuous information rail, in the homepage blue. */
.home-page .ticker {
  border-block-width: 1px;
  background: var(--qcc-blue);
}

.home-page .ticker-track {
  animation: marquee 24s linear infinite;
}

.home-page .ticker span {
  position: relative;
  padding: 11px 22px;
  font-size: 0.76rem;
  letter-spacing: 0.055em;
}

.home-page .ticker span + span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: -2px;
  width: 5px;
  height: 5px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: rgba(2, 4, 7, 0.54);
}

/* Quiet polish below the fold. */
.home-page .home-route-card {
  min-height: 250px;
  border-width: 1px;
  border-radius: 16px;
  box-shadow: 0 14px 36px rgba(16, 19, 23, 0.07);
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.home-page .home-route-card > span {
  width: 44px;
  height: 44px;
  border: 1px solid rgba(47, 156, 244, 0.3);
  border-radius: 50%;
  background: var(--qcc-blue-soft);
  color: var(--qcc-blue-dark);
}

.home-page .home-route-card:hover {
  transform: translateY(-3px);
  border-color: rgba(47, 156, 244, 0.42);
  box-shadow: 0 18px 42px rgba(16, 19, 23, 0.11);
}

.home-page .home-photo-panel {
  border-width: 1px;
  border-radius: 18px;
}

.home-page .home-photo-panel img {
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.home-page .home-photo-panel:hover img {
  transform: scale(1.012);
}

.home-motion-ready [data-home-reveal] {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.5s ease-out,
    transform 0.5s ease-out;
}

.home-motion-ready [data-home-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 1040px) {
  .home-page .page-hero {
    min-height: auto;
  }

  .home-page .hero-card {
    max-width: 620px;
  }
}

@media (max-width: 720px) {
  .home-page {
    --home-sweep-duration: 1.42s;
    --home-first-sweep-delay: 0.18s;
    --home-second-sweep-delay: 0.82s;
    --home-detail-delay: 2.4s;
    --home-card-delay: 2.64s;
  }

  .home-page .page-hero {
    padding-top: 54px;
    padding-bottom: 52px;
  }

  .home-title-sweep {
    margin-bottom: 18px;
  }

  .home-title-sweep h1 {
    font-size: clamp(2.8rem, 12.6vw, 4.1rem);
    line-height: 0.95;
  }

  .home-motion-ready .home-title-disc {
    top: 54%;
    width: 34px;
    height: 31px;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.1),
      inset 0 0 0 2px rgba(83, 7, 17, 0.08),
      0 2px 0 rgba(91, 11, 23, 0.72),
      0 5px 7px rgba(0, 0, 0, 0.18);
  }

  .home-motion-ready .home-title-disc-second {
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.11),
      inset 0 0 0 2px rgba(2, 47, 83, 0.08),
      0 2px 0 rgba(6, 70, 114, 0.72),
      0 5px 7px rgba(0, 0, 0, 0.18);
  }

  .home-page .hero-card {
    border-radius: 15px;
    padding: 20px;
  }

  .home-page .ticker span {
    padding: 10px 13px;
    font-size: 0.64rem;
    letter-spacing: 0.03em;
  }

  .home-page .home-route-card {
    min-height: 210px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-motion-ready [data-hero-eyebrow],
  .home-motion-ready .home-title-line > span,
  .home-motion-ready [data-hero-detail],
  .home-motion-ready [data-hero-card],
  .home-motion-ready [data-home-reveal] {
    clip-path: none;
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }

  .home-motion-ready .home-title-disc {
    display: none;
    animation: none;
  }

  .home-page .home-photo-panel img,
  .home-page .home-route-card {
    transition: none;
  }
}

@supports not (clip-path: inset(0 0 0 0)) {
  .home-motion-ready .home-title-line > span {
    clip-path: none;
    animation: none;
  }

  .home-motion-ready .home-title-disc {
    display: none;
  }
}