/* monowaai — quiet depth, precise motion. All decoration ignores pointer input. */
.brand{font-weight:800;letter-spacing:-.045em}.brand .logo{width:38px;height:38px;flex-shrink:0;background:none;border-radius:0;box-shadow:none}.links{font-size:16px}.links :is(a,.nav-link){font-size:16px}.section-head h2,.faq h2,.page-title h1,.section-heading h2,.detail-faq h2{font-weight:850;letter-spacing:-.035em}.step h3,.plan-heading h3{font-weight:800}
.roll-label{display:inline-flex;vertical-align:middle;white-space:pre;line-height:1.5;perspective:400px}.roll-char{position:relative;display:block;overflow:hidden}.roll-char>span{display:block;transition:transform .48s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--char)*22ms);transform-origin:50% 50%}.roll-copy{position:absolute;inset:0;transform:translateY(115%) rotateX(-50deg);color:var(--brand-ink)}
:is(.links,.footlinks) :is(a,button):is(:hover,:focus-visible) .roll-char>span:first-child{transform:translateY(-115%) rotateX(50deg)}
:is(.links,.footlinks) :is(a,button):is(:hover,:focus-visible) .roll-copy{transform:translateY(0) rotateX(0)}
.hero h1{font-size:clamp(38px,3.65vw,56px);font-weight:850;letter-spacing:-.04em;line-height:1.16}.hero-grid{min-height:352px;gap:40px}.hero p{font-size:15px;line-height:1.85}.hero-spotlight{padding:14px 0}.membership-art{height:235px}.member-card{width:284px;height:180px}.member-card-bottom .card-signature{font-size:13px;letter-spacing:-.02em}.hero-grid:before{content:'';position:absolute;width:48%;height:120%;right:-8%;top:-25%;border-radius:50%;background:radial-gradient(ellipse,#9f81ff20,transparent 65%);pointer-events:none;transform:rotate(-25deg)}
.hero-grid.motion-visible .card-front{animation:membership-float 8s ease-in-out infinite}.hero-grid.motion-visible .card-echo{animation:echo-float 8s ease-in-out infinite}.hero-grid.motion-visible .art-track{animation:orbit-breathe 12s ease-in-out infinite}.hero-grid.motion-visible .art-point{animation:point-drift 6s ease-in-out infinite}.hero-grid.motion-visible .point-two{animation-delay:-3s}
@keyframes membership-float{0%,100%{transform:translateY(0) rotate(-9deg) rotateY(-10deg)}50%{transform:translateY(-9px) rotate(-5deg) rotateY(-4deg)}}
@keyframes echo-float{0%,100%{transform:translate(15px,-12px) rotate(7deg) rotateY(-10deg)}50%{transform:translate(22px,-19px) rotate(10deg) rotateY(-4deg)}}
@keyframes orbit-breathe{50%{transform:rotate(-17deg) scale(1.06);opacity:.6}}
@keyframes point-drift{50%{transform:translate(8px,-15px);opacity:.35}}
.finish-midnight{--plan-ink:#262136;--plan-muted:#655c79;--plan-border:#c7bcdf;--plan-line:#51406124;--plan-surface:radial-gradient(ellipse at 100% 0,#d4c1f399,transparent 64%),linear-gradient(140deg,#f0eafa,#d6cbe5 68%,#c5b8d8);box-shadow:inset 0 1px #ffffff99,0 8px 24px #23172e0a}.finish-midnight .plan-mark{filter:invert(1);mix-blend-mode:multiply;opacity:.85}.finish-midnight:after{filter:invert(1);mix-blend-mode:multiply;opacity:.035}.finish-midnight .card-button{background:#ffffff30}
[data-theme=dark] .finish-midnight{--plan-ink:#faf5ff;--plan-muted:#ddd2ed;--plan-border:#8b779e;--plan-line:#f1dbff30;--plan-surface:radial-gradient(ellipse at 100% 0,#9e80c455,transparent 65%),linear-gradient(140deg,#655272,#44384e 70%,#51405e)}[data-theme=dark] .finish-midnight .plan-mark{filter:none;mix-blend-mode:screen}[data-theme=dark] .finish-midnight:after{filter:none;mix-blend-mode:screen}[data-theme=dark] .finish-midnight .card-button{background:#ffffff08}
.plan-card{--spark-color:#8971ed;--spark-opacity:.5;transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s,border-color .4s}.plan-card[data-tier="2"]{--spark-opacity:.65}.plan-card[data-tier="3"]{--spark-opacity:.8}.plan-card[data-tier="4"]{--spark-color:#e2d2ff;--spark-opacity:1}.plan-card>.motion-sparks:after{content:'';position:absolute;inset:-50% -80%;background:linear-gradient(110deg,transparent 43%,#ffffff00 45%,#fff6 49%,#ffffff00 53%,transparent 57%);transform:translateX(-65%);opacity:0}
.motion-sparks{display:block;position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:0}.motion-sparks i{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;background:var(--spark-color,#eee5ff);box-shadow:0 0 5px currentColor;color:var(--spark-color,#eee5ff);opacity:0;pointer-events:none}.primary,.primary-button,.flow-primary{position:relative;isolation:isolate;overflow:hidden;--spark-color:#fff;--spark-opacity:.9}.primary>.motion-sparks,.primary-button>.motion-sparks,.flow-primary>.motion-sparks{z-index:-1;background:radial-gradient(ellipse at 50% 100%,#d7c1ff23,transparent 70%)}
@media(hover:hover) and (pointer:fine){
 .plan-card:hover{transform:translateY(-5px);box-shadow:0 18px 40px #49306e1c;border-color:#9c87db}.plan-card:hover>.motion-sparks i{animation:spark-rise 1.25s ease-out var(--delay) both}.plan-card:hover>.motion-sparks:after{animation:material-sweep 1.05s cubic-bezier(.2,.65,.3,1) both}
 :is(.primary,.primary-button,.flow-primary):hover>.motion-sparks i{animation:spark-rise 1.1s ease-out var(--delay) both}
}
:is(.primary,.primary-button,.flow-primary):focus-visible>.motion-sparks i{animation:spark-rise 1.1s ease-out var(--delay) both}
@keyframes spark-rise{0%{opacity:0;transform:translate(0,8px) scale(.3)}25%{opacity:var(--spark-opacity,.6)}100%{opacity:0;transform:translate(var(--dx),-30px) scale(.2)}}
@keyframes material-sweep{0%{opacity:0;transform:translateX(-65%)}18%{opacity:calc(var(--spark-opacity,.5)*.3)}60%{opacity:calc(var(--spark-opacity,.5)*.6)}100%{opacity:0;transform:translateX(65%)}}
.step{position:relative;isolation:isolate;overflow:hidden;min-height:190px}.step-watermark{position:absolute;right:-14px;top:27px;width:148px;height:148px;color:var(--brand-ink);opacity:.075;transform:rotate(-9deg);z-index:-1;pointer-events:none}.step:nth-child(2) .step-watermark{transform:rotate(7deg);top:18px}.step:nth-child(3) .step-watermark{transform:rotate(-5deg)}.step h3{max-width:90%;position:relative}.step p{position:relative;max-width:95%}
.faq-list .motion-faq{padding:0;border-bottom:1px solid var(--line)}.faq-list .motion-faq summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;min-height:68px;font-size:17px;font-weight:650;line-height:1.55;cursor:pointer;list-style:none;transition:color .2s}.faq-list .motion-faq summary::-webkit-details-marker{display:none}.faq-list .motion-faq summary:after{display:none}.motion-faq summary .icon{flex-shrink:0;width:19px;height:19px;color:var(--subtle);transition:transform .32s cubic-bezier(.22,1,.36,1),color .2s}.motion-faq[data-expanded=true] summary .icon{transform:rotate(180deg);color:var(--brand-ink)}.faq-list .faq-content p{margin:0;padding:0 36px 22px 0;line-height:1.85;font-size:16px;color:var(--muted)}.faq-content{display:flow-root}.motion-faq[data-expanded=true] summary{color:var(--brand-ink)}
.motion-paused .hero-grid *{animation-play-state:paused!important}
@media(max-width:1180px){.hero-grid{gap:20px;padding:32px}.hero h1{font-size:43px}.hero p{font-size:14px}.member-card{width:260px;height:170px}}
@media(max-width:950px){.hero h1{font-size:38px}.hero-grid{gap:12px}.hero p{font-size:13px}.links{gap:22px}.plan-heading h3{font-size:25px}.step{padding:22px}.step-watermark{right:-35px;opacity:.055}}
@media(max-width:760px){.hero-grid{min-height:290px;padding:30px}.hero h1{font-size:40px}.hero p{font-size:14px}.links :is(a,.nav-link){font-size:16px}.step h3{font-size:18px}.step p{font-size:14px}.step-watermark{width:125px;height:125px}.faq-list .motion-faq summary{font-size:16px;padding:20px 0}.faq-list .faq-content p{font-size:15px}.brand{font-size:23px}}
@media(max-width:540px){.hero-grid{padding:28px 24px;min-height:302px}.hero h1{font-size:clamp(29px,8.1vw,38px);line-height:1.23;padding-right:0}.hero-mobile-mark{display:none}.hero p{font-size:13px}.hero .actions{gap:8px}.hero-order-link{font-size:12px}.links{gap:28px}.brand .logo{width:32px;height:32px}.step{min-height:180px}.step-watermark{right:14px;top:15px;opacity:.065;width:145px;height:145px}.section-head h2,.faq h2{font-weight:850}.faq-list .motion-faq summary{gap:16px}.faq-list .faq-content p{padding-right:20px}}
@media(prefers-reduced-motion:reduce){.hero-grid *, .motion-sparks *, .motion-sparks:after{animation:none!important}.roll-char>span,.motion-faq summary .icon,.plan-card{transition:none!important}.roll-char>span:first-child{transform:none!important}.roll-copy{visibility:hidden}.plan-card:hover{transform:none}.motion-sparks i{display:none}}

/* Pointer smoke uses a small canvas only while the desktop pointer moves. */
.hero-smoke{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;opacity:.8;contain:strict}.hero-spotlight{z-index:1}
.hero .primary,[data-theme=dark] .hero .primary{padding:12px 22px;gap:14px;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .35s,background .35s}
.hero .cta-arrow{width:20px;height:20px;border-radius:0;background:transparent;color:currentColor;box-shadow:none}
.hero .cta-arrow .icon{width:20px;height:20px;transition:transform .35s cubic-bezier(.22,1,.36,1)}
/* Fine particles keep flowing only while a button is hovered or keyboard-focused. */
:is(.primary,.primary-button,.flow-primary)>.motion-sparks i{--size:2px}
@media(hover:hover) and (pointer:fine){
 .hero .primary:hover{transform:translateX(4px)}
 .hero .primary:hover .cta-arrow .icon{transform:translate(3px,0)}
 :is(.primary,.primary-button,.flow-primary):hover>.motion-sparks i{animation:button-dust 1.7s linear var(--delay) infinite}
}
:is(.primary,.primary-button,.flow-primary):focus-visible>.motion-sparks i{animation:button-dust 1.7s linear var(--delay) infinite}
@keyframes button-dust{0%{opacity:0;transform:translate(-8px,12px) scale(.4)}20%{opacity:.35}55%{opacity:.85}100%{opacity:0;transform:translate(15px,-20px) scale(.25)}}
.motion-paused .motion-sparks *{animation-play-state:paused!important}
@media(max-width:540px){.hero .primary{padding:12px 17px;gap:10px}.hero .cta-arrow{width:18px;height:18px}.hero .cta-arrow .icon{width:18px;height:18px}}
@media(prefers-reduced-motion:reduce){.hero-smoke{display:none}.hero .primary,.hero .cta-arrow .icon{transition:none!important;transform:none!important}.motion-sparks i{animation:none!important}}
