/* Subtle cheetah pattern accents and polished motion shared across the site. */
body { background-image: radial-gradient(ellipse at 12px 10px, rgba(30,34,210,.035) 0 4px, transparent 4.5px), radial-gradient(ellipse at 34px 28px, rgba(77,195,242,.045) 0 3px, transparent 3.5px); background-size: 54px 46px; animation: page-arrive .42s ease both; }
.page-hero, .hero, section.block.alt { background-image: var(--spots), linear-gradient(180deg, var(--ice), #fff); background-position: 0 0, 0 0; animation: spots-drift 32s linear infinite alternate; }
.site-footer { position: relative; overflow: hidden; }
.site-footer::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .16; background-image: radial-gradient(ellipse at 20px 18px, #4DC3F2 0 8px, transparent 9px), radial-gradient(ellipse at 66px 48px, #fff 0 5px, transparent 6px); background-size: 92px 74px; transform: rotate(-3deg) scale(1.08); }
.site-footer .wrap { position: relative; z-index: 1; }
.site-credit { margin-top: 12px; font-size: .78rem; color: #97a2e6; }
.site-credit a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
/* Smooth navigation underline. */
.main-nav a { position: relative; border-bottom-color: transparent !important; }
.main-nav a::after { content: ""; position: absolute; left: 50%; right: 50%; bottom: 7px; height: 3px; border-radius: 99px; background: var(--sky); transition: left .2s ease, right .2s ease; }
.main-nav a:hover::after, .main-nav a[aria-current="page"]::after { left: 13px; right: 13px; }
/* Reliable interaction polish. */
.btn { transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease; }
.btn:hover { transform: translateY(-3px); box-shadow: 0 12px 24px -11px rgba(30,34,210,.72); }
.tile, .ev-card, .card, .qa, .vol-row { transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.tile:hover, .ev-card:hover, .card:hover, .qa:hover, .vol-row:hover { transform: translateY(-5px); border-color: var(--sky); box-shadow: var(--shadow-lg); }
.tile .ico, .qa .ico { transition: transform .2s ease; }
.tile:hover .ico, .qa:hover .ico { transform: scale(1.1); }
/* One-time logo and scroll entrances. */
.brand img, .logo-big { animation: logo-arrive .55s cubic-bezier(.2,.8,.25,1.2) both; }
.motion-ready .motion-item { opacity: 0; transform: translateY(18px); }
.motion-ready .motion-item.is-visible { opacity: 1; transform: none; transition: opacity .5s ease, transform .5s cubic-bezier(.2,.75,.25,1); transition-delay: var(--motion-delay, 0ms); }
/* Heading accent line draws on entry. */
.motion-heading { position: relative; padding-bottom: .16em; }
.motion-heading::after { content: ""; position: absolute; left: 0; bottom: 0; width: 48px; height: 4px; border-radius: 99px; background: linear-gradient(90deg, var(--blue), var(--sky)); transform: scaleX(0); transform-origin: left; }
.motion-heading.line-visible::after { animation: line-draw .5s ease forwards; }
/* Slow light sweep across the primary CTA panel. */
.cta-band { position: relative; overflow: hidden; }
.cta-band::after { content: ""; position: absolute; top: -60%; bottom: -60%; left: -35%; width: 20%; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent); transform: skewX(-18deg); animation: cta-sweep 12s ease-in-out infinite; }
@keyframes page-arrive { from { opacity: 0; } to { opacity: 1; } }
@keyframes spots-drift { from { background-position: 0 0, 0 0; } to { background-position: 26px 18px, 0 0; } }
@keyframes logo-arrive { from { opacity: 0; transform: scale(.9); } to { opacity: 1; transform: scale(1); } }
@keyframes line-draw { to { transform: scaleX(1); } }
@keyframes cta-sweep { 0%, 72%, 100% { left: -35%; opacity: 0; } 76% { opacity: 1; } 88% { left: 120%; opacity: 1; } 90% { opacity: 0; } }
@media (max-width: 1080px) { .main-nav a::after { bottom: 4px; } .main-nav a:hover::after, .main-nav a[aria-current="page"]::after { left: 4px; right: calc(100% - 52px); } }
@media (prefers-reduced-motion: reduce) { body, .page-hero, .hero, section.block.alt, .brand img, .logo-big, .cta-band::after { animation: none; } .motion-ready .motion-item { opacity: 1; transform: none; } .motion-heading::after { transform: scaleX(1); animation: none; } }
@media print { .site-credit { display: none; } }