html:not(.js) [data-reveal],
html:not(.js) .split-char {
opacity: 1;
transform: none;
filter: none;
clip-path: none;
}
html:not(.js) .reveal-mask > *   { transform: none; }
html:not(.js) .draw-path         { stroke-dashoffset: 0; } [data-reveal] {
opacity: 0;
transition-property: opacity, transform, filter, clip-path;
transition-duration: var(--dur-slow);
transition-timing-function: var(--ease-out);
will-change: transform, opacity;
}
[data-reveal="up"]    { transform: translateY(34px); }
[data-reveal="down"]  { transform: translateY(-26px); }
[data-reveal="left"]  { transform: translateX(-34px); }
[data-reveal="right"] { transform: translateX(34px); }
[data-reveal="scale"] { transform: scale(.92); }
[data-reveal="blur"]  { filter: blur(14px); }
[data-reveal="clip"]  { opacity: 1; clip-path: inset(0 0 100% 0); } [data-reveal="rise"] {
transform: translateY(46px) rotate(.6deg);
transition-duration: var(--dur-xslow);
}
[data-reveal].is-revealed {
opacity: 1;
transform: none;
filter: blur(0);
clip-path: inset(0 0 0% 0);
} .reveal-mask {
overflow: hidden;
display: block; padding-bottom: .12em;
margin-bottom: -.12em;
}
.reveal-mask > * {
display: block;
transform: translateY(105%);
transition: transform var(--dur-xslow) var(--ease-out);
}
.reveal-mask.is-revealed > * { transform: none; }  .split-word {
display: inline-block;
overflow: hidden;
vertical-align: top; padding-bottom: .14em;
margin-bottom: -.14em;
}
.split-char {
display: inline-block;
transform: translateY(108%) rotate(4deg);
opacity: 0;
transition:
transform var(--dur-xslow) var(--ease-out),
opacity calc(var(--dur-base) * 1.6) ease;
will-change: transform;
}
.split-char.is-in { transform: none; opacity: 1; }  .band-wipe {
position: relative;
isolation: isolate;
}
.band-wipe.wipe-ready { background-color: transparent; } .band-wipe.wipe-ready::after {
content: "";
position: absolute;
inset: 0;
z-index: -2;
border-radius: inherit;
background-color: var(--band-bg, var(--navy));
clip-path: inset(100% 0 0 0);
transition: clip-path var(--dur-xslow) var(--ease-wipe);
pointer-events: none;
}
.band-wipe.wipe-ready.is-in::after { clip-path: inset(0 0 0 0); } @media print {
.band-wipe.wipe-ready::after { clip-path: inset(0 0 0 0); }
} [data-glow] { position: relative; }
[data-glow]::after {
content: "";
position: absolute;
inset: -1px;
border-radius: inherit;
padding: 1px;
pointer-events: none;
opacity: 0;
transition: opacity var(--dur-base) var(--ease);
background: radial-gradient(
240px circle at var(--gx, 50%) var(--gy, 50%),
rgba(var(--brand-rgb), .85),
transparent 62%
);
-webkit-mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
mask: linear-gradient(#000, #000) content-box, linear-gradient(#000, #000);
-webkit-mask-composite: xor;
mask-composite: exclude;
}
[data-glow]:hover::after,
[data-glow]:focus-within::after { opacity: 1; } [data-scene] { perspective: 1400px; perspective-origin: 50% 45%; }
[data-scene] .scene__stage {
position: relative;
width: 100%;
height: 100%;
transform-style: preserve-3d;
transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
transition: transform var(--dur-slow) var(--ease);
}
.scene__layer {
position: absolute;
transform-style: preserve-3d;
will-change: transform;
} .scene__layer--back {
filter: blur(2.5px);
opacity: .62;
} [data-tilt] {
transform-style: preserve-3d;
will-change: transform;
transition: transform var(--dur-base) var(--ease), box-shadow var(--dur-base) var(--ease);
}
[data-tilt]:hover { box-shadow: var(--shadow-l); } [data-magnetic] { transition: transform 340ms var(--ease-spring); } .spring-ind {
position: absolute;
z-index: 0;
top: 4px;
bottom: 4px;
left: 4px;
width: 0;
border-radius: var(--radius-full);
background: var(--ink);
transition:
transform var(--dur-slow) var(--ease-spring),
width var(--dur-slow) var(--ease-spring);
}  .spotlight { position: relative; isolation: isolate; }
.spotlight::before {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background: radial-gradient(620px circle at var(--x, 50%) var(--y, 50%), rgba(255,255,255,.075), transparent 45%);
opacity: 0;
transition: opacity var(--dur-base) var(--ease);
pointer-events: none;
}
.spotlight:hover::before { opacity: 1; } @keyframes floatY {
0%, 100% { translate: 0 0; }
50%      { translate: 0 -14px; }
}
@keyframes floatSlow {
0%, 100% { translate: 0 0; rotate: 0deg; }
50%      { translate: 0 -20px; rotate: 1.2deg; }
}
.float     { animation: floatY 6s ease-in-out infinite; }
.float--sl { animation: floatSlow 9s ease-in-out infinite; } @keyframes blobMorph {
0%, 100% { border-radius: 47% 53% 44% 56% / 58% 42% 58% 42%; rotate: 0deg; }
50%      { border-radius: 58% 42% 62% 38% / 42% 62% 38% 58%; rotate: 14deg; }
}
.blob { animation: blobMorph 16s ease-in-out infinite; } body { animation: pageEnter 520ms var(--ease-out); }
@keyframes pageEnter {
from { opacity: 0; }
to   { opacity: 1; }
} .spinner {
width: 18px;
height: 18px;
border: 2.5px solid rgba(255,255,255,.4);
border-top-color: #fff;
border-radius: 50%;
animation: spin 700ms linear infinite;
display: none;
}
.is-loading .spinner { display: inline-block; }
.is-loading .btn__label, .is-loading .btn__icon { display: none; }
@keyframes spin { to { rotate: 360deg; } } [data-counter] { font-variant-numeric: tabular-nums; }
.draw-path {
stroke-dasharray: var(--path-length, 1000);
stroke-dashoffset: var(--path-length, 1000);
transition: stroke-dashoffset 1400ms var(--ease-out);
}
.draw-path.is-drawn { stroke-dashoffset: 0; } .sticky-scroll { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xl); }
.sticky-scroll__visual {
position: sticky;
top: calc(var(--header-h) + var(--space-l));
height: fit-content;
}
.sticky-scroll__step { min-height: 62vh; display: flex; flex-direction: column; justify-content: center; }
.sticky-scroll__step > * { opacity: .34; transition: opacity var(--dur-slow) var(--ease); }
.sticky-scroll__step.is-active > * { opacity: 1; }
@media (max-width: 900px) {
.sticky-scroll { grid-template-columns: 1fr; }
.sticky-scroll__visual { position: static; }
.sticky-scroll__step { min-height: 0; }
.sticky-scroll__step > * { opacity: 1; }
} @media (prefers-reduced-motion: reduce) {
[data-reveal],
[data-reveal].is-revealed { opacity: 1; transform: none; filter: none; clip-path: none; }
.reveal-mask > *          { transform: none; }
.split-char               { transform: none; opacity: 1; }
.draw-path                { stroke-dashoffset: 0; }
.float, .float--sl, .blob { animation: none; }
[data-scene] .scene__stage { transform: none; }
body                      { animation: none; }
}
html.motion-off [data-reveal],
html.motion-off [data-reveal].is-revealed { opacity: 1; transform: none; filter: none; clip-path: none; }
html.motion-off .reveal-mask > *   { transform: none; }
html.motion-off .split-char        { transform: none; opacity: 1; }
html.motion-off .draw-path         { stroke-dashoffset: 0; }
html.motion-off .float,
html.motion-off .float--sl,
html.motion-off .blob              { animation: none; }
html.motion-off [data-scene] .scene__stage { transform: none; }