:root {
  --bg: #fff;
  --text: #0a0a0a;
  --muted: #1a1a1a;
  --blue: #006cd2;
  --blue-dark: #0053a3;
  --headline-muted: #6b7378;
  --glass: rgba(0, 0, 0, .13);
  --glass-blur: 18px;
  --glass-light: rgba(255, 255, 255, .28);
  --radius: 0;
  --font: "Inter", "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  --pad-x: clamp(20px, 3.52vw, 64px);
  --nav-top: clamp(16px, 2.05vw, 28px);
  --btn-icon: 36px;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; overflow: hidden; }
body { background: var(--bg); color: var(--text); font-family: var(--font); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
a { color: inherit; text-decoration: none; }
button { border: 0; cursor: pointer; font: inherit; }
a:focus-visible, button:focus-visible { outline: 3px solid #f2b84b; outline-offset: 4px; }
[hidden] { display: none !important; }

.page { position: relative; display: flex; flex-direction: column; width: 100%; height: 100vh; height: 100dvh; overflow: hidden; padding: var(--nav-top) var(--pad-x) clamp(28px, 4.9vw, 48px); }
.bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; background: #fff; }
.bg-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nav, .hero, .lede, .mobile-menu { position: relative; z-index: 1; }

.nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; }
.nav__links { display: flex; justify-self: start; gap: clamp(22px, 2.6vw, 32px); padding: 24px 34px; background: var(--glass); -webkit-backdrop-filter: blur(var(--glass-blur)); backdrop-filter: blur(var(--glass-blur)); }
.nav__links a { position: relative; padding-bottom: 2px; color: var(--text); font-size: clamp(13px, 1.37vw, 15px); font-weight: 500; letter-spacing: -.01em; line-height: 1; white-space: nowrap; animation: link-in .55s cubic-bezier(.16, 1, .3, 1) backwards; }
.nav__links a:nth-child(1) { animation-delay: .02s; }
.nav__links a:nth-child(2) { animation-delay: .08s; }
.nav__links a:nth-child(3) { animation-delay: .14s; }
.nav__links a:nth-child(4) { animation-delay: .2s; }
.nav__links a::after { position: absolute; right: 0; bottom: -6px; left: 0; height: 3px; background: var(--blue); content: ""; transform: scaleX(0); transform-origin: left; transition: transform .28s cubic-bezier(.16, 1, .3, 1); }
.nav__links a:hover { color: var(--blue); transform: translateY(-2px); }
.nav__links a:hover::after, .nav__links a:focus-visible::after { transform: scaleX(1); }

.logo { display: inline-flex; justify-self: center; align-items: center; gap: 12px; color: var(--text); font-size: 14px; font-weight: 700; white-space: nowrap; transition: transform .35s cubic-bezier(.16, 1, .3, 1); }
.logo:hover { transform: scale(1.06); }
.logo svg { width: clamp(30px, 3.2vw, 38px); height: auto; overflow: visible; }
.logo polygon { transform-box: fill-box; transform-origin: left center; animation: mark-in .5s cubic-bezier(.16, 1, .3, 1) backwards; }
.logo polygon:nth-child(1) { animation-delay: .04s; }
.logo polygon:nth-child(2) { animation-delay: .09s; }
.logo polygon:nth-child(3) { animation-delay: .14s; }
.logo polygon:nth-child(4) { animation-delay: .19s; }
.logo polygon:nth-child(5) { animation-delay: .24s; }
.logo polygon:nth-child(6) { animation-delay: .29s; }

.btn { position: relative; display: inline-flex; align-items: center; gap: 18px; height: 58px; padding: 12px 10px 12px 22px; overflow: hidden; border-radius: var(--radius); font-size: 16px; font-weight: 500; letter-spacing: -.015em; line-height: 1; white-space: nowrap; }
.btn::before { position: absolute; inset: 0; background: var(--wipe-color); content: ""; pointer-events: none; transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(.16, 1, .3, 1); }
.btn:hover::before { transform: scaleX(1); }
.btn__label, .btn__icon { position: relative; z-index: 1; }
.btn__icon { display: grid; place-items: center; width: var(--btn-icon); height: var(--btn-icon); flex: none; background: var(--icon-bg); color: var(--icon-color); transition: background .3s, color .3s; }
.btn__icon svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.btn:hover .btn__icon { background: #fff; color: var(--blue); }
.btn--nav { --wipe-color: #004a96; --icon-bg: var(--blue-dark); --icon-color: #fff; justify-self: end; background: var(--blue); color: #fff; animation: wipe-right .65s cubic-bezier(.16, 1, .3, 1) .16s backwards; }
.btn--light { --wipe-color: #e8f2fb; --icon-bg: var(--blue); --icon-color: #fff; background: #fff; color: var(--blue); }
.btn--ghost { --wipe-color: rgba(255, 255, 255, .78); padding: 12px 26px; background: rgba(255, 255, 255, .55); -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px); color: var(--text); }
.btn--ghost:hover { background: rgba(255, 255, 255, .55); }

.nav__burger { display: none; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 36px; height: 36px; background: transparent; transition: transform .2s; }
.nav__burger span { width: 18px; height: 1.5px; background: var(--text); transition: width .2s, background .2s; }
.nav__burger:hover { transform: scale(1.08); }
.nav__burger:hover span { background: var(--blue); }
.nav__burger:hover span:first-child, .nav__burger:hover span:last-child { width: 14px; }
.mobile-menu { display: none; }

.hero { margin-top: clamp(52px, 10.15vh, 92px); }
.badge { display: inline-flex; align-items: center; gap: 10px; height: clamp(34px, 3.6vw, 42px); padding: 0 18px 0 14px; border: 1px solid rgba(0, 108, 210, .2); background: var(--glass-light); -webkit-backdrop-filter: blur(var(--glass-blur)); backdrop-filter: blur(var(--glass-blur)); color: var(--muted); font-size: clamp(13px, 1.35vw, 15px); font-weight: 500; letter-spacing: -.01em; }
.badge__mark { width: 14px; height: 14px; flex: none; border: 2px solid var(--blue); background: #fff; }
.headline { margin-top: clamp(22px, 2.8vw, 36px); font-size: calc(clamp(2.9rem, 5.9vw, 5rem) + 3px); font-weight: 600; letter-spacing: -.038em; line-height: 1.18; }
.headline__mask { display: block; overflow: hidden; }
.headline__rise { display: block; animation: type-rise .85s cubic-bezier(.16, 1, .3, 1) var(--d) backwards; }
.headline__line { white-space: nowrap; }
.headline__muted { color: var(--headline-muted); }
.headline__accent { position: relative; display: inline-block; color: var(--headline-muted); }
.headline__accent::before, .headline__accent::after { position: absolute; inset: 0; content: attr(data-text); -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 72px), transparent 100%); mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 72px), transparent 100%); -webkit-mask-size: 0% 100%; mask-size: 0% 100%; -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; animation: accent-fill 1.05s cubic-bezier(.4, 0, .2, 1) forwards; }
.headline__accent::before { color: #7eb6ee; animation-delay: .7s; }
.headline__accent::after { color: var(--blue); animation-delay: 1.08s; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(28px, 3.4vw, 42px); }
.wipe { animation: wipe-left .7s cubic-bezier(.16, 1, .3, 1) var(--d) backwards; }

.lede { width: 100%; max-width: 700px; margin-top: auto; overflow: hidden; color: #fff; font-size: clamp(17px, 1.8vw, 20px); font-weight: 300; letter-spacing: -.01em; line-height: 1.5; text-shadow: 0 1px 3px rgba(0, 0, 0, .5); }
.lede__rise { animation: type-rise .9s cubic-bezier(.16, 1, .3, 1) var(--d) backwards; }
.filing { display: inline-block; margin-top: 16px; border-bottom: 1px solid currentColor; font-size: 13px; font-weight: 500; text-shadow: inherit; }
.filing:hover { color: #d8ebff; }

@keyframes link-in { from { opacity: 0; transform: translate3d(-16px, 0, 0); } }
@keyframes mark-in { from { opacity: 0; transform: translate3d(-12px, 8px, 0); } }
@keyframes wipe-right { from { clip-path: inset(0 0 0 100%); } }
@keyframes wipe-left { from { clip-path: inset(0 100% 0 0); } }
@keyframes type-rise { from { transform: translate3d(0, 118%, 0); } }
@keyframes accent-fill { to { -webkit-mask-size: calc(100% + 72px) 100%; mask-size: calc(100% + 72px) 100%; } }

@media (max-width: 820px) {
  html, body { height: auto; overflow: auto; }
  .page { height: auto; min-height: 100vh; min-height: 100dvh; }
  .nav { grid-template-columns: auto 1fr auto; }
  .nav__links, .nav > .btn--nav { display: none; }
  .logo { justify-self: start; grid-column: 1; }
  .nav__burger { display: flex; grid-column: 3; animation: link-in .5s cubic-bezier(.16, 1, .3, 1) .16s backwards; }
  .mobile-menu { flex-direction: column; gap: 1.25rem; padding: 1.25rem 0 .5rem; }
  .mobile-menu:not([hidden]) { display: flex; }
  .mobile-menu__links { display: flex; flex-direction: column; gap: .9rem; }
  .mobile-menu__links a { display: block; padding: 16px 20px; background: var(--glass); -webkit-backdrop-filter: blur(var(--glass-blur)); backdrop-filter: blur(var(--glass-blur)); font-size: 1.05rem; font-weight: 500; }
  .mobile-menu .btn--nav { align-self: start; }
  .hero { margin-top: 48px; }
  .headline { font-size: calc(clamp(2.75rem, 10vw, 3.85rem) + 3px); }
  .headline__line { white-space: normal; }
  .lede { margin-top: 64px; }
}
@media (max-width: 480px) {
  .logo span { font-size: 12px; }
  .hero { margin-top: 48px; }
  .actions .btn { font-size: 14px; }
  .lede { background: rgba(3, 25, 46, .42); padding: 16px; }
}
@media (max-height: 700px) and (min-width: 821px) {
  .hero { margin-top: 36px; }
  .headline { font-size: calc(clamp(2.75rem, 7.2vh, 4.15rem) + 3px); }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
  .headline__rise, .lede__rise, .nav__links a, .logo polygon, .nav__burger { opacity: 1; transform: none; clip-path: none; }
  .headline__accent { color: var(--blue); }
  .headline__accent::before, .headline__accent::after { content: none; }
  .bg-video { display: none; }
  .bg { background: linear-gradient(#fff 0%, #eef5fa 55%, #17304d 100%); }
}