/* Motion system for the landing. One easing, three durations; everything off under reduced motion.
   Reveals use the individual `translate` property so `transform` stays free for hover,
   and never scale .lg elements (liquid.js sizes its refraction map from the bounding box). */
:root {
  --ease: cubic-bezier(.22, 1, .36, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);
  --d1: .18s; --d2: .45s; --d3: .9s;
}
html { scroll-behavior: smooth; }

/* Hero: soft blur-in instead of a plain slide */
.gpu-appear { animation: gpuRise 1.1s var(--ease) both !important; }
@keyframes gpuRise { from { opacity: 0; translate: 0 26px; filter: blur(10px); } to { opacity: 1; translate: 0 0; filter: none; } }
#header video { animation: heroVid 2.6s var(--ease) both; }
@keyframes heroVid { from { opacity: 0; scale: 1.08; } to { opacity: 1; scale: 1; } }
nav[data-framer-name] { animation: navIn .9s var(--ease) .1s both; }
@keyframes navIn { from { opacity: 0; translate: 0 -14px; } to { opacity: 1; translate: 0 0; } }

/* Scroll reveal. JS adds .rv (so content is visible without JS) and .in when on screen. */
.rv { opacity: 0; translate: 0 28px; transition: opacity var(--d3) var(--ease), translate var(--d3) var(--ease), filter var(--d3) var(--ease);
  transition-delay: calc(var(--i, 0) * 70ms); }
.rv.rv-blur { filter: blur(8px); }
.rv.in { opacity: 1; translate: 0 0; filter: none; }

/* Buttons and links: lift on hover, press on click */
.cat-reserve, .adv-pick a, .ft-x, .gpu-cta-m, a.gpu-cta > *, .lg-input button {
  transition: background var(--d1) ease, color var(--d1) ease, transform var(--d2) var(--ease), box-shadow var(--d2) var(--ease) !important; }
.cat-reserve:hover, .adv-pick a:hover, .ft-x:hover, .gpu-cta-m:hover { transform: translateY(-1px); }
a.gpu-cta:hover > * { transform: translateY(-1px); }
.cat-reserve:active, .adv-pick a:active, .ft-x:active, .gpu-cta-m:active, a.gpu-cta:active > *, .lg-input button:active { transform: scale(.96); transition-duration: var(--d1) !important; }
.ft-links a:not(.ft-x) { position: relative; }
.ft-links a:not(.ft-x)::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: right; transition: transform var(--d2) var(--ease); }
.ft-links a:not(.ft-x):hover::after { transform: scaleX(1); transform-origin: left; }

/* Prompt: glow while focused */
.lg-input { transition: box-shadow var(--d2) var(--ease), border-color var(--d2) var(--ease) !important; }
.lg-input:focus-within { border-color: rgba(255, 255, 255, .38) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.35), 0 0 0 4px rgba(140, 190, 255, .10), 0 0 60px rgba(110, 170, 255, .18), inset 0 1px 1px rgba(255,255,255,.55) !important; }

/* Catalogue cards: lift + cursor-following sheen */
.cat-card { transition: transform var(--d2) var(--ease), box-shadow var(--d2) var(--ease), opacity var(--d3) var(--ease), translate var(--d3) var(--ease) !important; }
.cat-card:hover { transform: translateY(-6px); box-shadow: 0 30px 70px rgba(0,0,0,.45), inset 0 1px 1px rgba(255,255,255,.6), inset 0 0 24px rgba(255,255,255,.06) !important; }
.cat-card::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(150, 200, 255, .12), transparent 45%);
  transition: opacity var(--d2) var(--ease); }
.cat-card:hover::after { opacity: 1; }
.cat-card > * { position: relative; z-index: 1; }
.cat-units i { animation: live 2.4s ease-in-out infinite; }
@keyframes live { 50% { opacity: .45; box-shadow: 0 0 2px #5ee8a0; } }

/* Filter pill: one indicator slides between tabs */
.cat-filters { position: relative; }
.cat-filters button { position: relative; z-index: 1; }
.cat-filters button.on { background: transparent !important; box-shadow: none !important; }
.cat-ind { position: absolute; top: 5px; left: 0; height: calc(100% - 10px); border-radius: 999px; background: rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35); transition: translate var(--d2) var(--ease), width var(--d2) var(--ease); pointer-events: none; }
.cat-ind.no-anim { transition: none; }

/* Advisor */
.adv { animation: advIn .7s var(--ease) both !important; }
@keyframes advIn { from { opacity: 0; translate: 0 18px; filter: blur(8px); } to { opacity: 1; translate: 0 0; filter: none; } }
.adv-panel { overflow: hidden; }
.adv-pick { opacity: 0; animation: pickIn .7s var(--ease) both; animation-delay: calc(var(--i, 0) * 90ms); }
@keyframes pickIn { from { opacity: 0; translate: 0 14px; filter: blur(6px); } to { opacity: 1; translate: 0 0; filter: none; } }
.adv-foot > span:not(:empty) { animation: fadeIn .6s var(--ease) both; animation-delay: .25s; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
.adv.busy .adv-reply { background: linear-gradient(90deg, rgba(255,255,255,.35) 0%, #fff 50%, rgba(255,255,255,.35) 100%) 0 0 / 200% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: shimmer 1.6s linear infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
.adv.err .adv-panel { animation: nudge .45s var(--ease); }
@keyframes nudge { 20% { translate: -6px 0; } 40% { translate: 5px 0; } 60% { translate: -3px 0; } 80% { translate: 2px 0; } }

/* Card highlight when jumping from a pick */
.cat-card.flash { animation: flash 1.8s var(--ease) !important; }

/* Footer wordmark rises out of a mask */
.ft-mark { background: none !important; }
.ft-mark > span { display: inline-block; padding-bottom: .08em; background: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, .04));
  -webkit-background-clip: text; background-clip: text; color: transparent; }
.ft-mark.rv { opacity: 1; translate: none; overflow: hidden; }
.ft-mark.rv > span { translate: 0 105%; transition: translate 1.4s var(--ease); }
.ft-mark.rv.in > span { translate: 0 0; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; transition-delay: 0s !important; }
  .rv, .ft-mark.rv { opacity: 1; translate: none; filter: none; }
  .ft-mark.rv > span { translate: none; }
  .gpu-ticker, .gpu-grain { animation: none !important; }
}
.cat-empty { grid-column: 1 / -1; text-align: center; color: rgba(255,255,255,.6); padding: 48px 16px; font-size: 15px; }
.cat-card.cat-out { opacity: .55; }
.cat-card.cat-out .cat-units i { background: rgba(255,255,255,.35); box-shadow: none; }
.cat-reserve.is-off { pointer-events: none; opacity: .6; cursor: default; }