:root { --mt: 1; }
@keyframes mt-fade { from { opacity: 0 } to { opacity: 1 } }
@keyframes mt-rise { from { opacity: 0; transform: translateY(28px) } to { opacity: 1; transform: none } }
@keyframes mt-pop { 0% { opacity: 0; transform: scale(.6) } 60% { opacity: 1; transform: scale(1.06) } 100% { opacity: 1; transform: scale(1) } }
@keyframes mt-out { from { opacity: 1 } to { opacity: 0; visibility: hidden } }
@keyframes mt-float { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(-10px) } }
@keyframes mt-twinkle { 0%, 100% { opacity: .25; transform: scale(.7) } 50% { opacity: 1; transform: scale(1) } }
@keyframes mt-hop6 { 0%, 37%, 100% { transform: translateY(0) scale(1) } 4.8% { transform: translateY(0) scale(1.06, .92) }
13.2% { transform: translateY(-16px) scale(.96, 1.05) } 21.6% { transform: translateY(0) scale(1.05, .94) } 27.6% { transform: none } }
@keyframes mt-reveal { from { opacity: 0; translate: 0 34px } to { opacity: 1; translate: none } }
@keyframes mt-in { from { opacity: 0; translate: 0 10px } to { opacity: 1; translate: none } }
@keyframes mt-word { from { opacity: 0; transform: translateY(.4em) } to { opacity: 1; transform: none } }
@keyframes mt-nudge { from { translate: 0 28px } to { translate: none } }
@keyframes mt-draw { from { stroke-dashoffset: 1 } to { stroke-dashoffset: 0 } }
@keyframes mt-progress { from { transform: scaleX(0) } to { transform: scaleX(1) } }
@keyframes mt-marquee { to { transform: translateX(-50%) } }
@keyframes gg-sway { 0%, 100% { transform: rotate(-1.5deg) } 50% { transform: rotate(1.5deg) } }
@keyframes gg-tilt { 0%, 100% { transform: rotate(0) } 35% { transform: rotate(-3.5deg) } 70% { transform: rotate(2.5deg) } }
@keyframes gg-blink { 0%, 93%, 100% { transform: scaleY(1) } 96% { transform: scaleY(.08) } }
@keyframes gg-earR { 0%, 84%, 100% { transform: rotate(0) } 89% { transform: rotate(-16deg) } 94% { transform: rotate(7deg) } }
@keyframes gg-earL { 0%, 84%, 100% { transform: rotate(0) } 89% { transform: rotate(16deg) } 94% { transform: rotate(-7deg) } }
@keyframes gg-tail { 0%, 100% { transform: rotate(-4deg) } 50% { transform: rotate(9deg) } }
@keyframes gg-talk { 0%, 100% { transform: scaleY(1) } 50% { transform: scaleY(2.3) } }
@keyframes gg-muz { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(3px) } }
@keyframes gg-wave { 0%, 52%, 100% { transform: rotate(0) } 10%, 24% { transform: rotate(66deg) } 17%, 31% { transform: rotate(46deg) } 38% { transform: rotate(62deg) } }
@keyframes gg-wave1 { 0%, 100% { transform: rotate(0) } 18%, 46% { transform: rotate(66deg) } 32%, 60% { transform: rotate(46deg) } 74% { transform: rotate(60deg) } }
@keyframes mt-hop { 0%, 62%, 100% { transform: translateY(0) scale(1) } 8% { transform: translateY(0) scale(1.06, .92) } 22% { transform: translateY(-16px) scale(.96, 1.05) } 36% { transform: translateY(0) scale(1.05, .94) } 46% { transform: none } }
@keyframes mt-dayon { from { background: var(--surface); color: var(--text); transform: scale(.85) } to { background: var(--primary); color: #fff; transform: none } }
@keyframes mt-ping { 0% { opacity: .9; transform: scale(.7) } 100% { opacity: 0; transform: scale(1.9) } }
@keyframes mt-hopto { 0% { opacity: 0; transform: translate(0, 0) } 12% { opacity: 1; transform: translate(0, 0) scale(1.06, .92) } 45% { transform: translate(52%, -55%) scale(.96, 1.05) }
70% { transform: translate(105%, -6%) scale(1.06, .94) } 80%, 100% { opacity: 1; transform: translate(105%, -6%) } }
@keyframes mt-numA { 0%, 40% { visibility: visible } 41%, 100% { visibility: hidden } }
@keyframes mt-numB { 0%, 40% { visibility: hidden } 41%, 100% { visibility: visible } }
@keyframes mt-plus { 0%, 30% { opacity: 0; transform: translateY(0) } 45% { opacity: 1 } 75%, 100% { opacity: 0; transform: translateY(-160%) } }
@keyframes mt-toast { 0%, 15% { opacity: 0; translate: 0 30% } 35%, 100% { opacity: 1; translate: none } }
@keyframes mt-night { 0%, 38% { opacity: 0 } 50%, 88% { opacity: 1 } 100% { opacity: 0 } }
@keyframes mt-float2 { 0%, 100% { transform: translateY(0) rotate(-4deg) } 50% { transform: translateY(-12px) rotate(4deg) } }
@keyframes mt-walkin { 0% { opacity: 0; transform: translateX(190%) } 8% { opacity: 1 } 60%, 88% { opacity: 1; transform: none } 96%, 100% { opacity: 0; transform: none } }
@keyframes mt-legs { 0% { transform: rotate(-14deg) } 3.75% { transform: rotate(14deg) } 7.5% { transform: rotate(-14deg) } 11.25% { transform: rotate(14deg) } 15% { transform: rotate(-14deg) } 18.75% { transform: rotate(14deg) } 22.5% { transform: rotate(-14deg) } 26.25% { transform: rotate(14deg) } 30% { transform: rotate(-14deg) } 33.75% { transform: rotate(14deg) } 37.5% { transform: rotate(-14deg) } 41.25% { transform: rotate(14deg) } 45% { transform: rotate(-14deg) } 48.75% { transform: rotate(14deg) } 52.5% { transform: rotate(-14deg) } 56.25% { transform: rotate(14deg) } 60% { transform: rotate(0deg) } 100% { transform: none } }
@keyframes mt-bobw { 0% { transform: translateY(0%) } 1.875% { transform: translateY(-4%) } 3.75% { transform: translateY(0%) } 5.625% { transform: translateY(-4%) } 7.5% { transform: translateY(0%) } 9.375% { transform: translateY(-4%) } 11.25% { transform: translateY(0%) } 13.125% { transform: translateY(-4%) } 15% { transform: translateY(0%) } 16.875% { transform: translateY(-4%) } 18.75% { transform: translateY(0%) } 20.625% { transform: translateY(-4%) } 22.5% { transform: translateY(0%) } 24.375% { transform: translateY(-4%) } 26.25% { transform: translateY(0%) } 28.125% { transform: translateY(-4%) } 30% { transform: translateY(0%) } 31.875% { transform: translateY(-4%) } 33.75% { transform: translateY(0%) } 35.625% { transform: translateY(-4%) } 37.5% { transform: translateY(0%) } 39.375% { transform: translateY(-4%) } 41.25% { transform: translateY(0%) } 43.125% { transform: translateY(-4%) } 45% { transform: translateY(0%) } 46.875% { transform: translateY(-4%) } 48.75% { transform: translateY(0%) } 50.625% { transform: translateY(-4%) } 52.5% { transform: translateY(0%) } 54.375% { transform: translateY(-4%) } 56.25% { transform: translateY(0%) } 58.125% { transform: translateY(-4%) } 60% { transform: translateY(0%) } 100% { transform: none } }
@keyframes mt-ken { from { transform: scale(1) } to { transform: scale(1.08) } }
@keyframes mt-pick { 0% { transform: scale(.86) } 60% { transform: scale(1.12) } 100% { transform: none } }
@keyframes mt-zoom { from { opacity: 0; transform: scale(.9) } to { opacity: 1; transform: none } }
.mt-stage, .mt-skip, .mt-star, .mt-veil { display: none; }
@media screen and (prefers-reduced-motion: no-preference) {
.mt .hero-art .gigi { animation: mt-float 6s ease-in-out infinite; }
.mt .band .gigi { transform-origin: 50% 100%; animation: mt-hop6 6s ease-in-out 1s infinite; }
:is(.mt-on, .mt-stage) .gg .gg-eye { animation: gg-blink 4.8s linear var(--o, 0s) infinite; }
:is(.mt-on, .mt-stage) .gg .gg-er { animation: gg-earR 6.8s ease-in-out var(--o, 0s) infinite; }
:is(.mt-on, .mt-stage) .gg .gg-el { animation: gg-earL 6.8s ease-in-out var(--o, 0s) infinite; }
:is(.mt-on, .mt-stage) .gg .gg-tail { animation: gg-tail 3.4s ease-in-out var(--o, 0s) infinite; }
:is(.mt-on, .mt-stage) .gg .gg-sway { animation: gg-sway 7s ease-in-out var(--o, 0s) infinite; }
:is(.mt-on, .mt-stage) .gg .gg-tilt { animation: gg-tilt 6.2s ease-in-out var(--o, 0s) infinite; }
:is(.mt-on, .mt-stage) .gg.wave .gg-arm { animation: gg-wave1 1.9s ease-in-out .85s, gg-wave 5.2s ease-in-out 3.85s infinite; }
:is(.mt-on, .mt-stage) .gg.talk .gg-mouth { animation: gg-talk .3s ease-in-out .8s 4, gg-talk .3s ease-in-out 3s 3; }
:is(.mt-on, .mt-stage) .gg.talk .gg-muz { animation: gg-muz .3s ease-in-out .8s 4, gg-muz .3s ease-in-out 3s 3; }
#children.mt-on .portraits > figure > img:first-child { transform-origin: 50% 100%; animation: mt-hop 3.6s ease-in-out calc(var(--i) * .14s) infinite; }
#children.mt-on .portraits > figure.open > img:first-child { animation-play-state: paused; }
.mt .portraits figure.open .wave-card { transform-origin: 50% 100%; animation: mt-pop .35s cubic-bezier(.2, .9, .3, 1.3) both; }
#children.mt-on .kids-phone .shot.day .night { animation: mt-night 9s ease-in-out infinite; }
#children.mt-on .rh-bg { animation: mt-ken 9s ease-in-out infinite alternate; }
#children.mt-on .rh-ch { animation: mt-walkin 6s linear infinite; }
#children.mt-on .rh-ch svg { animation: mt-bobw 6s linear infinite; }
#children.mt-on .rh-ch :is(.lgl, .arr) { animation: mt-legs 6s linear infinite; }
#children.mt-on .rh-ch :is(.lgr, .arl) { animation: mt-legs 6s linear -.225s infinite; }
.mt #map .tick path { stroke-dasharray: 1; }
.mt #map.mt-seen .tick path { animation: mt-draw .55s cubic-bezier(.6, 0, .2, 1) calc(.35s + var(--i) * .45s) both; }
.mt #map.mt-on .map-float { animation: mt-float2 6s ease-in-out infinite; }
.mt-on .price-gigi { animation: mt-float 5s ease-in-out infinite; }
.band > .mt-star { display: block; position: absolute; z-index: 0; width: 16px; height: 16px; fill: #F4C55E; pointer-events: none;
animation: mt-twinkle 2.6s ease-in-out infinite; }
.band > .mt-star:nth-child(1) { left: 84%; top: 44%; width: 22px; height: 22px; }
.band > .mt-star:nth-child(2) { left: 64%; top: 57%; animation-duration: 3.1s; animation-delay: .7s; }
.band > .mt-star:nth-child(3) { left: 89%; top: 61%; width: 18px; height: 18px; animation-duration: 2.8s; animation-delay: 1.2s; }
.band > .mt-star:nth-child(4) { left: 9%; top: 79%; width: 13px; height: 13px; animation-duration: 3.4s; animation-delay: .4s; }
.band > .mt-star:nth-child(5) { left: 33%; top: 91%; width: 12px; height: 12px; animation-duration: 2.9s; animation-delay: 1.8s; }
.mt .steps > .card { transition: border-color .45s ease, box-shadow .45s ease; }
.mt #how.mt-on .step.hl .scene { display: block; animation: mt-fade .25s ease both; }
.mt #how.mt-on .step.hl .sc1 .days i:nth-child(-n+5) { animation: mt-dayon .3s cubic-bezier(.2, .9, .3, 1.3) calc(.3s + var(--d) * .18s) both; }
.mt #how.mt-on .step.hl .sc2 .ping { animation: mt-ping .9s ease-out .15s both; }
.mt #how.mt-on .step.hl .sc2 .hopper { animation: mt-hopto 1.1s cubic-bezier(.4, 0, .3, 1) .3s both; }
.mt #how.mt-on .step.hl .sc3 .n > span:first-child { animation: mt-numA 2s linear both; }
.mt #how.mt-on .step.hl .sc3 .n > span + span { animation: mt-numB 2s linear both; }
.mt #how.mt-on .step.hl .sc3 .plus5 { animation: mt-plus 2s ease-out both; }
.mt #how.mt-on .step.hl .sc3 .toast { animation: mt-toast 2s ease both; }
.zoom[open] img { animation: mt-zoom .26s cubic-bezier(.2, .8, .2, 1) both; }
.zoom[open]::backdrop { animation: mt-fade .26s ease both; }
.mt .worlds [data-world].on { animation: mt-pick .5s cubic-bezier(.2, .9, .3, 1.3); }
.mt .amount[data-plan-panel], .mt .quote .q-item { animation: mt-in .35s cubic-bezier(.2, .8, .2, 1) both; }
.mt .acc.auto .acc-item.open::after { animation: mt-progress 4.5s linear both; }
.mt .cast figure.pop { animation: mt-pop .42s cubic-bezier(.2, .9, .3, 1.3) both; }
.mt-pre .mt-veil { display: block; position: fixed; inset: 0; z-index: 28; overflow: hidden; pointer-events: none; background: var(--canvas);
animation: mt-out .4s ease 2.5s forwards; }
.mt-intro .mt-veil { animation: mt-out .7s cubic-bezier(.2, .8, .2, 1) 1s forwards; }
.mt-stage { display: flex; position: fixed; inset: 0; z-index: 29; flex-direction: column; align-items: center; justify-content: center;
padding-top: 6vh; overflow: hidden; pointer-events: none; }
.mt-stage .bubble { margin: 0 16px 16px; font-size: 21px; padding: 14px 20px 16px; text-align: center; transform-origin: 50% 100%;
animation: mt-pop .45s cubic-bezier(.2, .9, .3, 1.3) .15s both, mt-out .2s ease .95s forwards; }
.mt-stage .bubble::after { right: calc(50% - 8px); }
.mt-stage .gg { display: block; width: clamp(150px, 15vw, 210px); height: auto; transform-origin: 50% 100%;
animation: mt-pop .5s cubic-bezier(.2, .9, .3, 1.3) both; }
.mt-skip { display: inline-flex; align-items: center; position: fixed; z-index: 31; top: 14px; right: 16px; min-height: 44px;
padding: 3px 18px 0; border-radius: 99px; background: var(--paper); border: 1.5px solid var(--line); box-shadow: var(--clay);
font: 800 15px/1 'Overpass', system-ui, sans-serif; color: var(--ink); cursor: pointer;
animation: mt-fade .3s ease both, mt-out .25s ease 1.45s forwards; }
.mt-intro .hdr { animation: mt-fade .45s ease 1.55s both; }
.mt-intro .hero-text > * { animation: mt-rise .6s cubic-bezier(.2, .8, .2, 1) 1.2s both; }
.mt-intro .hero-text > .badges { animation-delay: 1.14s; }
.mt-intro .hero-text > .lead { animation: mt-nudge .6s cubic-bezier(.2, .8, .2, 1) 1.06s both; }
.mt-intro .hero-text > .h1 { animation: none; }
.mt-intro .h1 .w { animation: mt-word .6s cubic-bezier(.2, .8, .2, 1) calc(.98s + var(--i) * .08s) both; }
.mt-intro .h1 .swash path { stroke-dasharray: 1; animation: mt-draw .85s cubic-bezier(.6, 0, .2, 1) 1.2s both; }
.mt-intro .hero-art > .shot { animation: mt-nudge .75s cubic-bezier(.2, .8, .2, 1) 1s both; }
.mt-intro .hero-art > .pts { animation: mt-pop .45s cubic-bezier(.2, .9, .3, 1.3) 1.45s both; }
.mt-intro .hero-art > .bubble { transform-origin: 80% 100%; animation: mt-pop .45s cubic-bezier(.2, .9, .3, 1.3) 1.55s both; }
.mt-intro .hero-art > .gigi { visibility: hidden; animation: none; }
.mt-intro.mt-land .hero-art > .gigi { visibility: visible; }
.mt-intro .hero > .trust { animation: mt-rise .7s cubic-bezier(.2, .8, .2, 1) 1.25s both; }
.mt-rv .mt-h { opacity: 0; translate: 0 34px; }
.mt-rv .mt-h.mt-in { animation: mt-reveal .85s cubic-bezier(.2, .8, .2, 1) both; }
}
@media screen and (min-width: 700px) and (prefers-reduced-motion: no-preference) {
.mt-skip { top: 20px; right: max(40px, calc(50vw - 600px)); }
.band > .mt-star:nth-child(1) { left: 63%; top: 18%; }
.band > .mt-star:nth-child(2) { left: 91%; top: 14%; }
.band > .mt-star:nth-child(3) { left: 67%; top: 70%; }
.band > .mt-star:nth-child(4) { left: 86%; top: 46%; }
.band > .mt-star:nth-child(5) { left: 44%; top: 86%; }
}
@media screen and (min-width: 1100px) and (prefers-reduced-motion: no-preference) { .mt-skip { top: 26px; } }
@media screen and (max-width: 699px) and (prefers-reduced-motion: no-preference) {
.mt .awards { overflow: hidden; }
.mt .award.aw-clone { display: flex; }
.mt .aw-track { animation: mt-marquee 22s linear infinite; animation-play-state: paused; }
.mt .trust.mt-on .aw-track { animation-play-state: running; }
.mt .trust.mt-on .awards:is(:hover, :focus-within, :active) .aw-track { animation-play-state: paused; }
}
@media (hover: hover) {
.hdr .nav a { text-decoration-line: underline; text-decoration-thickness: 2px; text-decoration-color: transparent; text-underline-offset: 8px; }
.hdr .nav a:hover { text-decoration-color: var(--primary); }
.faq summary:hover { background: #F8F3FD; border-radius: 18.5px; }
.faq summary:focus-visible { border-radius: 8px; }
.btn-p:hover { background: #7E2BCE; }
.steps > .card:hover { border-color: var(--coral); box-shadow: 0 0 0 6px var(--coral-soft), var(--clay); }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
.hdr .nav a { transition: text-decoration-color .2s ease; }
.faq summary { transition: background-color .2s ease; }
.card:has(a[href]):not(nav, details, .doc-card, .other, .form-card, .price-card, .consent) { transition: transform .25s ease, box-shadow .25s ease; }
.card:has(a[href]):not(nav, details, .doc-card, .other, .form-card, .price-card, .consent):hover {
transform: translateY(-4px); box-shadow: 0 22px 36px -22px rgba(43, 36, 64, .5), inset 0 2px 3px rgba(255, 255, 255, .95); }
.btn-p { transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.btn-p:not(:disabled):hover { transform: translateY(-2px); box-shadow: 0 18px 32px -14px rgba(110, 26, 189, .55); }
.btn-p:not(:disabled):active { transform: scale(.98); }
.link > svg:last-child, a.o > svg:last-child, .menu-list a > svg:last-child { transition: transform .2s ease; }
.link:hover > svg:last-child, a.o:hover > svg:last-child, .menu-list a:hover > svg:last-child { transform: translateX(3px); }
.badges a, .social a { transition: transform .2s ease, box-shadow .2s ease; }
.badges a:hover, .social a:hover, .logos .lg:hover { transform: translateY(-3px); }
.logos .lg { transition: transform .2s ease; }
.social a:hover { box-shadow: 0 10px 18px -12px rgba(43, 36, 64, .5); }
.worlds [data-world]:hover { transform: scale(1.08); }
}