:where(:root) { 
  --m-dur: 640ms;                          
  --m-dur-ui: 180ms;                       
  --m-dist: 18px;                          
  --m-stagger: 70ms;                       
  --m-ease: cubic-bezier(.2, .7, .2, 1);   
  --m-ease-ui: cubic-bezier(.3, .7, .4, 1);
  --m-accent: currentColor;                
  --m-header-bg: Canvas;                   
  --m-head-offset: 88px;                   
  interpolate-size: allow-keywords;        
}

@media (prefers-reduced-motion: no-preference) {
  .m-js .m-reveal:not(.m-in),
  .m-js .m-stagger > :not(.m-in) {
    opacity: 0;
    translate: 0 var(--m-dist);
  }
  
  .m-js .m-reveal.m-in, .m-js .m-stagger > .m-in {
    animation: m-reveal var(--m-dur) var(--m-ease) backwards;
    animation-delay: calc(var(--m-i, 0) * var(--m-stagger));
  }
  @keyframes m-reveal { from { opacity: 0; translate: 0 var(--m-dist); } }
}

.m-btn { transition: background-color var(--m-dur-ui) var(--m-ease-ui), color var(--m-dur-ui) var(--m-ease-ui), box-shadow var(--m-dur-ui) var(--m-ease-ui); }
.m-btn:focus-visible, .m-ring:focus-visible { outline: 2px solid var(--m-accent); outline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .m-btn { transition-property: background-color, color, box-shadow, transform; }
  @media (hover: hover) { .m-btn:hover { transform: translateY(-2px); } }
  .m-btn:active { transform: translateY(0) scale(.98); transition-duration: 60ms; }
  .m-btn:focus-visible, .m-ring:focus-visible { animation: m-ring .25s var(--m-ease-ui); }
  @keyframes m-ring { from { outline-offset: 9px; outline-color: transparent; } }
}

.m-underline {
  text-decoration: none;
  background: linear-gradient(var(--m-accent), var(--m-accent)) no-repeat 0 100% / 0 1px;
  padding-bottom: 2px;
}
.m-underline:hover, .m-underline:focus-visible, .m-underline[aria-current] { background-size: 100% 1px; }
@media (prefers-reduced-motion: no-preference) {
  .m-underline { transition: background-size .35s var(--m-ease); }
}

.m-zoom { overflow: hidden; }
.m-zoom img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  :where(.m-lift) { position: relative; }
  .m-lift::after {
    content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    box-shadow: 0 14px 30px -18px rgb(0 0 0 / .35); opacity: 0; transition: opacity .3s var(--m-ease-ui);
  }
  .m-lift { transition: transform .3s var(--m-ease-ui); }
  .m-lift:hover { transform: translateY(-4px); }
  .m-lift:hover::after { opacity: 1; }
  .m-zoom img { transition: scale .9s var(--m-ease); }
  .m-lift:hover .m-zoom img, .m-zoom:hover img { scale: 1.045; }
}

.m-header { position: sticky; top: 0; z-index: 20; }
.m-header::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: var(--m-header-bg); box-shadow: 0 1px 0 rgb(0 0 0 / .08); }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .m-header::before { animation: m-header linear both; animation-timeline: scroll(); animation-range: 0 140px; }
    @keyframes m-header { from { opacity: 0; } }
  }
}

.m-faq summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.m-faq summary::-webkit-details-marker { display: none; }
.m-faq summary::after { content: "+"; flex: none; font-weight: 400; line-height: 1; }
.m-faq[open] summary::after { rotate: 45deg; }
@media (prefers-reduced-motion: no-preference) {
  .m-faq summary::after { transition: rotate .3s var(--m-ease-ui); }
  .m-faq::details-content { block-size: 0; overflow-y: clip; transition: block-size .35s var(--m-ease), content-visibility .35s allow-discrete; }
  .m-faq[open]::details-content { block-size: auto; }
}

[id] { scroll-margin-top: var(--m-head-offset); }
@media (prefers-reduced-motion: no-preference) { html:focus-within { scroll-behavior: smooth; } }

.m-field { transition: border-color var(--m-dur-ui) var(--m-ease-ui), box-shadow var(--m-dur-ui) var(--m-ease-ui); }
.m-field:focus-visible { outline: none; border-color: var(--m-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--m-accent) 22%, transparent); }

@media (prefers-reduced-motion: no-preference) {
  @view-transition { navigation: auto; }
  ::view-transition-old(root), ::view-transition-new(root) { animation-duration: .22s; }
}

.m-menu[popover] { inset: 0 0 auto auto; margin: 0; min-height: 100dvh; width: min(86vw, 360px); border: 0; padding: 24px; }
.m-menu[popover]::backdrop { background: rgb(0 0 0 / .35); }
@media (prefers-reduced-motion: no-preference) {
  .m-menu[popover] { transition: translate .3s var(--m-ease), opacity .3s var(--m-ease), overlay .3s allow-discrete, display .3s allow-discrete; translate: 100% 0; opacity: 0; }
  .m-menu[popover]:popover-open { translate: 0 0; opacity: 1; }
  @starting-style { .m-menu[popover]:popover-open { translate: 100% 0; opacity: 0; } }
}

.m-calm { --m-dur: 900ms; --m-dur-ui: 260ms; --m-dist: 14px; --m-stagger: 90ms; --m-ease: cubic-bezier(.2, .7, .2, 1); --m-ease-ui: cubic-bezier(.25, .6, .3, 1); }

.m-snappy { --m-dur: 480ms; --m-dur-ui: 140ms; --m-dist: 22px; --m-stagger: 50ms; --m-ease: cubic-bezier(.2, .9, .3, 1); --m-ease-ui: cubic-bezier(.3, .8, .4, 1); }

.m-bouncy { --m-dur: 620ms; --m-dur-ui: 220ms; --m-dist: 20px; --m-stagger: 70ms; --m-ease: cubic-bezier(.3,1,.5,1); --m-ease-ui: cubic-bezier(.3,1,.5,1); }
@supports (transition-timing-function: linear(0, 1)) {
  .m-bouncy { --m-ease: linear(0, .24 8%, .78 22%, 1.05 34%, 1.08 42%, 1.03 56%, .995 72%, 1); }
}

.m-loud { --m-dur: 520ms; --m-dur-ui: 120ms; --m-dist: 40px; --m-stagger: 45ms; --m-ease: cubic-bezier(.12, .9, .1, 1); --m-ease-ui: cubic-bezier(.2, .9, .2, 1); }

:where(:root) { --m-glow: color-mix(in srgb, var(--m-accent) 16%, transparent); }

.m-words .m-w, .m-words .m-w > span { display: inline-block; }
@media (prefers-reduced-motion: no-preference) {
  
  .m-words .m-w { overflow: clip; padding-bottom: .14em; margin-bottom: -.14em; vertical-align: bottom; }
  .m-words .m-w > span { animation: m-word .7s var(--m-ease) both; animation-delay: calc(var(--m-i, 0) * 45ms); }
  @keyframes m-word { from { translate: 0 .6em; opacity: .35; } }
}

.m-unveil { overflow: hidden; }
.m-unveil img { display: block; width: 100%; height: 100%; object-fit: cover; }
@media (prefers-reduced-motion: no-preference) {
  .m-unveil { animation: m-unveil 1.1s var(--m-ease) both; }
  .m-unveil img { animation: m-unveil-in 1.1s var(--m-ease) both, m-settle 1.6s var(--m-ease) both; }
  @keyframes m-unveil { from { scale: .88; } }
  @keyframes m-unveil-in { from { transform: scale(1.136); } }
  @keyframes m-settle { from { scale: 1.08; } }
}

.m-parallax { overflow: hidden; }
.m-parallax img { display: block; width: 100%; height: 100%; object-fit: cover; }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .m-parallax img { height: 116%; margin-top: -8%; animation: m-par linear both; animation-timeline: view(); animation-range: cover; }
    @keyframes m-par { from { translate: 0 -7%; } to { translate: 0 7%; } }
  }
}

@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .m-recede { animation: m-recede linear both; animation-timeline: view(); animation-range: exit 0% exit 100%; transform-origin: 50% 0; }
    @keyframes m-recede { to { scale: .94; opacity: .55; } }
  }
}

@media (prefers-reduced-motion: no-preference) {
  .m-js .m-wipe:not(.m-in) { clip-path: inset(0 0 100% 0); }
  .m-js .m-wipe.m-in { animation: m-wipe 1s var(--m-ease) backwards; }
  @keyframes m-wipe { from { clip-path: inset(0 0 100% 0); } }
  .m-js .m-wipe.m-in:has(> img) { animation: m-wipe-win 1s var(--m-ease) backwards, m-wipe-frame 1s linear backwards; }
  .m-js .m-wipe.m-in:has(> img) > * { animation: m-wipe-back 1s var(--m-ease) backwards, m-wipe-round 1s linear backwards; }
  @keyframes m-wipe-win { from { translate: 0 -100%; } }
  @keyframes m-wipe-back { from { translate: 0 100%; } }
  @keyframes m-wipe-frame { from, to { overflow: visible; clip-path: inset(0); } }
  @keyframes m-wipe-round { from, to { border-radius: inherit; } }
}

.m-mark { background: linear-gradient(var(--m-glow), var(--m-glow)) no-repeat 0 85% / 100% .42em; padding: 0 .08em; }
@media (prefers-reduced-motion: no-preference) {
  .m-mark { transition: background-size .8s var(--m-ease) .35s; }
  .m-js .m-reveal:not(.m-in) .m-mark { background-size: 0 .42em; }
}

.m-spot { position: relative; isolation: isolate; }
@media (hover: hover) and (pointer: fine) {
  .m-spot::before {
    content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; opacity: 0;
    background: radial-gradient(320px circle at var(--mx, 50%) var(--my, 50%), var(--m-glow), transparent 70%);
    transition: opacity .3s var(--m-ease-ui);
  }
  .m-spot:hover::before { opacity: 1; will-change: transform; }
}

.m-ring-card { position: relative; border: 2px solid transparent; background-clip: padding-box; }
.m-orbit { position: absolute; inset: -2px; padding: 2px; border-radius: inherit; overflow: hidden; pointer-events: none;
  container-type: size; mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); }
@supports (mask-composite: exclude) {
  .m-orbit::before { content: ""; position: absolute; left: 50%; top: 50%; width: 200%; width: hypot(100cqw, 100cqh); aspect-ratio: 1;
    translate: -50% -50%; background: conic-gradient(var(--m-accent), transparent 30%, var(--m-accent) 60%, transparent 85%, var(--m-accent)); }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .m-ring-card:hover > .m-orbit::before { animation: m-turn 4s linear 2; }
  @keyframes m-turn { to { rotate: 1turn; } }
}

.m-ribbon { overflow: hidden; }
.m-ribbon .m-track { display: flex; gap: 3rem; flex-wrap: wrap; }
.m-ribbon .m-track > [aria-hidden] { display: none; }
.m-ribbon .m-pause { font: inherit; display: inline-flex; gap: .4em; align-items: center; cursor: pointer; }
@media (prefers-reduced-motion: no-preference) {
  .m-ribbon .m-track { flex-wrap: nowrap; width: max-content; animation: m-ribbon var(--m-ribbon-dur, 40s) linear infinite; }
  .m-ribbon .m-track > [aria-hidden] { display: flex; gap: inherit; }
  .m-ribbon:hover .m-track, .m-ribbon:focus-within .m-track, .m-ribbon:has(.m-pause input:checked) .m-track { animation-play-state: paused; }
  @keyframes m-ribbon { to { translate: calc(-50% - 1.5rem) 0; } }
}
@media (prefers-reduced-motion: reduce) { .m-ribbon .m-pause { display: none; } }

.m-snap { display: grid; grid-auto-flow: column; grid-auto-columns: min(82%, 420px); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: thin; padding-bottom: 8px; }
.m-snap > * { scroll-snap-align: center; }
@supports (animation-timeline: view(inline)) {
  @media (prefers-reduced-motion: no-preference) {
    .m-snap > * { animation: m-snap linear both; animation-timeline: view(inline); }
    @keyframes m-snap { 0%, 100% { scale: .93; opacity: .6; } 40%, 60% { scale: 1; opacity: 1; } }
  }
}
@media (prefers-reduced-motion: no-preference) { .m-snap { scroll-behavior: smooth; } }

.m-cap { position: relative; overflow: hidden; }
.m-cap figcaption { position: absolute; inset: auto 0 0 0; padding: 14px 16px; color: #fff; background: linear-gradient(transparent, rgb(0 0 0 / .62)); }
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .m-cap figcaption { transition: translate .45s var(--m-ease), opacity .45s var(--m-ease); translate: 0 30%; opacity: 0; }
  .m-cap:hover figcaption, .m-cap:focus-within figcaption { translate: 0 0; opacity: 1; }
}

.m-count { font-variant-numeric: tabular-nums; }

.m-progress { position: fixed; inset: 0 0 auto 0; height: 3px; background: var(--m-accent); transform-origin: 0 50%; scale: 0 1; z-index: 30; pointer-events: none; }
@supports not (animation-timeline: scroll()) { .m-progress { display: none; } }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) { .m-progress { animation: m-progress linear both; animation-timeline: scroll(root); } @keyframes m-progress { to { scale: 1 1; } } }
  @media (prefers-reduced-motion: reduce) { .m-progress { display: none; } }
}

@media (prefers-reduced-motion: no-preference) {
  .m-header { view-transition-name: m-header; }
  ::view-transition-old(root) { animation: m-vt-out .18s ease-in both; }
  ::view-transition-new(root) { animation: m-vt-in .42s var(--m-ease) both; }
  @keyframes m-vt-out { to { opacity: 0; } }
  @keyframes m-vt-in { from { opacity: 0; translate: 0 14px; } }
}

@media (prefers-reduced-motion: no-preference){details::details-content{block-size:0;overflow-y:clip;transition:block-size .35s var(--m-ease),content-visibility .35s allow-discrete}details[open]::details-content{block-size:auto}}
@media (prefers-reduced-motion: no-preference){html.m-js{overflow-x:clip}}
@media (prefers-reduced-motion: no-preference){:root{--m-rv-run: calc(var(--m-dist) * 2);}
@media (max-width: 600px){:root{--m-rv-run: calc(var(--m-dist) * .8);}}
.m-js .m-reveal[class*="m-rv-"].m-in,.m-js .m-stagger[class*="m-rv-"] > .m-in,.m-js[class*="m-rv-site-"] .m-reveal.m-in,.m-js[class*="m-rv-site-"] .m-stagger > .m-in{animation-duration: var(--m-dur);
    animation-timing-function: var(--m-ease);
    animation-fill-mode: backwards;
    animation-delay: calc(var(--m-rv-i, var(--m-i, 0)) * var(--m-stagger));}
.m-js.m-rv-site-scale .m-reveal:not([class*="m-rv-"]):not(.m-in),.m-js.m-rv-site-scale .m-stagger:not([class*="m-rv-"]) > :not(.m-in){opacity: 0; translate: none; scale: .96;}
.m-js.m-rv-site-scale .m-reveal:not([class*="m-rv-"]).m-in,.m-js.m-rv-site-scale .m-stagger:not([class*="m-rv-"]) > .m-in{animation-name: m-rv-scale;}
@keyframes m-rv-scale{from { opacity: 0; scale: .96; }}}
:root{--m-ui-dur: min(calc(var(--m-dur-ui) + 100ms), 300ms);}
@media (prefers-reduced-motion: no-preference){html.m-ui-vt-fade::view-transition-old(root){animation: m-ui-out 280ms var(--m-ui-vt, cubic-bezier(.4, 0, .2, 1)) both;}
html.m-ui-vt-fade::view-transition-new(root){animation: m-ui-in 280ms var(--m-ui-vt, cubic-bezier(.4, 0, .2, 1)) both;}
@keyframes m-ui-out{to { opacity: 0; }}
@keyframes m-ui-in{from { opacity: 0; }}}
.m-eb-r{display: inline-grid; overflow: clip; vertical-align: top; padding-block: .12em; margin-block: -.12em;}
.m-eb-r > m-rl{grid-area: 1 / 1;}
.m-eb-r > [aria-hidden]{visibility: hidden; translate: 0 135%;}
@media (prefers-reduced-motion: no-preference){.m-eb-r > m-rl{transition: translate .5s var(--m-ease);}
.m-eb-r > [aria-hidden]{visibility: visible; transition-delay: 40ms;}
.m-eb-roll:focus-visible .m-eb-r > m-rl{translate: 0 -135%;}
.m-eb-roll:focus-visible .m-eb-r > [aria-hidden]{translate: 0 0;}
@media (hover: hover){.m-eb-roll:hover .m-eb-r > m-rl{translate: 0 -135%;}
.m-eb-roll:hover .m-eb-r > [aria-hidden]{translate: 0 0;}}}