:root{--motion:cubic-bezier(.22,1,.36,1)}
html{scroll-behavior:smooth}
body{opacity:1;transform:none}
body.page-entering{animation:pageEnter .42s var(--motion) both}
body.page-leaving{opacity:.18;transform:translateY(-4px);transition:opacity .16s ease,transform .16s ease}
@keyframes pageEnter{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}
[hidden]{display:none!important}
.motion-reveal{opacity:1;transform:none}
html.motion-ready .motion-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s var(--motion),transform .65s var(--motion)}
html.motion-ready .motion-reveal.is-visible{opacity:1;transform:none}
button,a,.card,.panel,.feature-card,.metric,.btn{transition:transform .24s var(--motion),box-shadow .24s var(--motion),border-color .24s var(--motion),background-color .24s var(--motion),color .24s var(--motion)}
@media (hover:hover){.card:hover,.panel:hover,.feature-card:hover{transform:translateY(-3px)}.btn:hover,.button:hover{transform:translateY(-2px)}}
.page-progress{position:fixed;left:0;top:0;height:3px;width:0;background:var(--accent,#7c5cff);z-index:99999;transition:width .25s ease,opacity .25s ease;box-shadow:0 0 16px color-mix(in srgb,var(--accent,#7c5cff) 60%,transparent)}
.product-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.product-nav a{font-size:.78rem;font-weight:700;text-decoration:none;color:var(--text-2,currentColor);padding:8px 10px;border-radius:10px;border:1px solid transparent}
.product-nav a:hover,.product-nav a.active{color:var(--text,currentColor);background:var(--surface-2,rgba(0,0,0,.05));border-color:var(--border-hi,rgba(0,0,0,.12))}
.product-shell{max-width:1180px;margin:0 auto;padding:34px 22px 80px;position:relative;z-index:2}
.product-hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr);gap:18px;margin:28px 0}
.product-card{background:var(--surface,#fff);border:1px solid var(--border-hi,#ddd);border-radius:20px;padding:24px;box-shadow:0 16px 48px rgba(0,0,0,.12)}
.product-card h1,.product-card h2,.product-card h3{margin-top:0}.product-kicker{font:700 .72rem var(--mono,monospace);letter-spacing:.13em;text-transform:uppercase;color:var(--accent,#7c5cff)}
.product-title{font-size:clamp(2rem,5vw,4rem);line-height:1.02;letter-spacing:-.055em;margin:.5rem 0 1rem}.product-copy{color:var(--text-2,#666);max-width:65ch}
.product-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.product-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.product-list{display:grid;gap:10px;margin:18px 0}.product-list-item{display:flex;gap:12px;align-items:flex-start;padding:13px;border-radius:14px;background:var(--surface-2,#f7f7f7);border:1px solid var(--border,#ddd)}
.product-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--accent-dim,rgba(124,92,255,.12));color:var(--accent,#7c5cff);font-weight:900;flex:none}
.plan-card{position:relative;overflow:hidden}.plan-card.featured{border-color:var(--accent,#7c5cff);box-shadow:0 0 0 1px var(--accent,#7c5cff),0 22px 60px rgba(0,0,0,.18)}.plan-badge{position:absolute;right:14px;top:14px;font:700 .67rem var(--mono,monospace);padding:6px 9px;border-radius:999px;background:var(--accent,#7c5cff);color:white}.plan-price{font-size:2.3rem;font-weight:800;letter-spacing:-.05em}.plan-price small{font-size:.8rem;color:var(--text-2,#777)}
.flow-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.flow-step{position:relative;padding:18px;border:1px solid var(--border,#ddd);border-radius:16px;background:var(--surface,#fff)}.flow-step strong{display:block;margin-bottom:5px}.flow-step span{color:var(--text-2,#777);font-size:.84rem}.flow-step:not(:last-child)::after{content:'→';position:absolute;right:-10px;top:50%;z-index:2;color:var(--accent,#7c5cff);font-weight:900}
.inline-notice{padding:14px 16px;border-radius:14px;border:1px solid var(--accent-b,rgba(124,92,255,.35));background:var(--accent-dim,rgba(124,92,255,.1));color:var(--text,#111)}
@media(max-width:850px){.product-hero,.product-grid,.product-grid.two{grid-template-columns:1fr}.flow-steps{grid-template-columns:1fr 1fr}.flow-step::after{display:none}}
@media(max-width:520px){.flow-steps{grid-template-columns:1fr}.product-shell{padding-inline:14px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}body{opacity:1!important;transform:none!important}.motion-reveal{opacity:1!important;transform:none!important}}