/* Additive cinematic polish for the public homepage. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 50;
  pointer-events: none;
  opacity: .035;
  background-image:
    repeating-radial-gradient(circle at 18% 27%, transparent 0 1px, rgba(255,255,255,.42) 1px 2px),
    repeating-radial-gradient(circle at 78% 71%, transparent 0 2px, rgba(130,184,255,.3) 2px 3px);
  background-size: 5px 5px, 7px 7px;
  mix-blend-mode: soft-light;
}

.site-header {
  text-shadow: 0 2px 16px rgba(0,0,0,.72);
}

.site-header nav > a:not(.nav-cta) {
  position: relative;
}

.site-header nav > a:not(.nav-cta)::after {
  content: "";
  position: absolute;
  left: 0;
  right: 100%;
  bottom: -8px;
  height: 1px;
  background: linear-gradient(90deg, var(--gold), var(--cyan));
  transition: right .35s cubic-bezier(.2,.7,.2,1);
}

.site-header nav > a:not(.nav-cta):hover::after,
.site-header nav > a:not(.nav-cta):focus-visible::after {
  right: 0;
}

.hero::before {
  content: "";
  position: absolute;
  inset: -24%;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 68% 34%, rgba(73,171,255,.13), transparent 24%),
    radial-gradient(circle at 44% 70%, rgba(231,189,114,.09), transparent 22%);
  animation: hero-aurora 14s ease-in-out infinite alternate;
}

.hero::after {
  background:
    linear-gradient(90deg, rgba(3,7,14,.78) 0, rgba(3,7,14,.58) 39%, rgba(3,7,14,.12) 64%, rgba(3,7,14,.2)),
    linear-gradient(0deg, rgba(3,7,14,.32), transparent 42%);
}

.hero-copy::before {
  content: "";
  position: absolute;
  inset: -56px -70px -52px -8vw;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(ellipse at 43% 48%, rgba(2,6,13,.77) 0, rgba(2,6,13,.5) 52%, transparent 76%);
  filter: blur(10px);
}

.hero h1,
.hero-lede,
.availability {
  text-shadow: 0 3px 28px rgba(0,0,0,.92), 0 1px 2px rgba(0,0,0,.8);
}

/* Keep decorative covers entirely in the visual half of the hero. */
.shelf-signal {
  -webkit-mask-image: linear-gradient(90deg, transparent 0 43%, rgba(0,0,0,.28) 49%, #000 58%);
  mask-image: linear-gradient(90deg, transparent 0 43%, rgba(0,0,0,.28) 49%, #000 58%);
}

.signal-book-three {
  left: auto;
  right: 47%;
  bottom: 12%;
}

.button,
.nav-cta {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.button::before,
.nav-cta::before {
  content: "";
  position: absolute;
  inset: -40% auto -40% -55%;
  width: 34%;
  pointer-events: none;
  transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.42), transparent);
  transition: left .65s cubic-bezier(.2,.7,.2,1);
}

.button:hover::before,
.button:focus-visible::before,
.nav-cta:hover::before,
.nav-cta:focus-visible::before {
  left: 125%;
}

.text-link {
  background: linear-gradient(90deg, currentColor 0 44%, var(--gold) 50%, currentColor 56%) 100% 0 / 240% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  transition: background-position .6s ease, border-color .3s ease;
}

.text-link:hover,
.text-link:focus-visible {
  background-position: 0 0;
  border-color: var(--gold);
}

.scroll-cue i {
  position: relative;
  overflow: hidden;
  border-left-color: rgba(120,154,255,.3);
}

.scroll-cue i::after {
  content: "";
  position: absolute;
  left: -1px;
  top: -100%;
  height: 60%;
  border-left: 1px solid #b9d5ff;
  animation: scroll-trace 2.3s ease-in-out infinite;
}

.phone-stage::before {
  content: "";
  position: absolute;
  width: 460px;
  height: 460px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(68,173,255,.17), rgba(111,82,255,.07) 42%, transparent 69%);
  filter: blur(8px);
  animation: phone-aura 6s ease-in-out infinite;
}

.phone {
  box-shadow:
    0 42px 100px rgba(0,0,0,.78),
    -18px 4px 60px rgba(56,154,255,.12),
    18px -6px 50px rgba(231,189,114,.09),
    0 0 0 1px rgba(187,214,255,.34);
}

.intelligence,
.scan-section,
.wishlist-section,
.capabilities,
.launch {
  background-attachment: fixed;
}

.intel-step,
.scan-result,
.wishlist-preview,
.capability,
.launch-panel {
  --spot-x: 50%;
  --spot-y: 50%;
}

.intel-step,
.capability {
  transition: transform .4s cubic-bezier(.2,.7,.2,1), border-color .4s ease, filter .4s ease;
}

.intel-step:hover {
  transform: translateY(-7px);
  border-color: rgba(116,205,255,.48);
  filter: drop-shadow(0 22px 28px rgba(0,0,0,.24));
}

.insight-card,
.scan-result,
.wishlist-preview,
.launch-panel {
  position: relative;
  isolation: isolate;
}

.insight-card::after,
.scan-result::after,
.wishlist-preview::after,
.launch-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(240px circle at var(--spot-x) var(--spot-y), rgba(116,207,255,.16), transparent 70%);
  transition: opacity .35s ease;
}

.insight-card:hover::after,
.scan-result:hover::after,
.wishlist-preview:hover::after,
.launch-panel:hover::before {
  opacity: 1;
}

.wishlist-light {
  animation: wishlist-glow 9s ease-in-out infinite alternate;
}

.capability-orbit::before {
  animation: orbit-ring-one 24s linear infinite;
}

.capability-orbit::after {
  animation: orbit-ring-two 32s linear infinite reverse;
}

.orbit-core {
  box-shadow: 0 0 45px #2770d57a, 0 0 90px rgba(39,112,213,.18);
  animation: core-breathe 5s ease-in-out infinite;
}

.capability span {
  box-shadow: 0 0 0 rgba(82,206,255,0);
  transition: border-color .35s ease, color .35s ease, box-shadow .35s ease, transform .35s ease;
}

.capability:hover span {
  color: #d8f3ff;
  border-color: var(--cyan);
  box-shadow: 0 0 28px rgba(82,206,255,.28);
  transform: rotate(-5deg) scale(1.08);
}

.launch-panel::after {
  box-shadow: 0 0 80px rgba(81,184,255,.1), inset 0 0 45px rgba(81,184,255,.06);
  animation: launch-orbit 8s ease-in-out infinite alternate;
}

.cinematic-ready .section .reveal {
  opacity: 0;
  transform: translateY(28px) scale(.985);
  filter: blur(5px);
  transition:
    opacity .85s cubic-bezier(.2,.7,.2,1),
    transform .85s cubic-bezier(.2,.7,.2,1),
    filter .85s ease;
}

.cinematic-ready .section .reveal.is-visible {
  opacity: 1;
  transform: none;
  filter: none;
}

.cinematic-ready .intelligence-rail .reveal:nth-child(2),
.cinematic-ready .wish-cover-row .wish-cover:nth-child(2),
.cinematic-ready .capability:nth-child(3) { transition-delay: .09s; }

.cinematic-ready .intelligence-rail .reveal:nth-child(3),
.cinematic-ready .wish-cover-row .wish-cover:nth-child(3),
.cinematic-ready .capability:nth-child(4) { transition-delay: .18s; }

@keyframes hero-aurora {
  0% { transform: translate3d(-1.5%, 0, 0) rotate(-1deg); opacity: .65; }
  100% { transform: translate3d(2%, -1.5%, 0) rotate(1deg); opacity: 1; }
}

@keyframes phone-aura {
  50% { transform: scale(1.12); opacity: .72; filter: blur(15px); }
}

@keyframes scroll-trace {
  0% { top: -70%; opacity: 0; }
  30% { opacity: 1; }
  100% { top: 115%; opacity: 0; }
}

@keyframes wishlist-glow {
  100% { transform: translate3d(-55px, 28px, 0) scale(1.08); opacity: .8; }
}

@keyframes orbit-ring-one { to { transform: rotate(345deg); } }
@keyframes orbit-ring-two { to { transform: rotate(390deg); } }

@keyframes core-breathe {
  50% { box-shadow: 0 0 65px #2770d58c, 0 0 120px rgba(39,112,213,.24); transform: scale(1.025); }
}

@keyframes launch-orbit {
  100% { transform: translate(-28px, -18px) scale(1.08); border-color: rgba(231,189,114,.28); }
}

@media (max-width: 850px) {
  body::before { opacity: .024; }
  .hero-copy::before { inset: -45px -12vw; }
  .phone-stage {
    transform: scale(.82) !important;
    transform-origin: top center;
    margin: 34px 0 -42px;
  }
  .hero::after {
    background: linear-gradient(180deg, rgba(3,7,14,.48), rgba(3,7,14,.62) 47%, #06080f 92%);
  }
  .intelligence,
  .scan-section,
  .wishlist-section,
  .capabilities,
  .launch { background-attachment: scroll; }
}

@media (max-width: 430px) {
  .phone-stage {
    transform: scale(.68) !important;
    transform-origin: top center;
    margin: 34px 0 -105px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero::before,
  .phone-stage::before,
  .scroll-cue i::after,
  .wishlist-light,
  .capability-orbit::before,
  .capability-orbit::after,
  .orbit-core,
  .launch-panel::after { animation: none !important; }

  .cinematic-ready .section .reveal,
  .cinematic-ready .section .reveal.is-visible {
    opacity: 1;
    transform: none;
    filter: none;
  }
}