/* Small product preview assets only; full-resolution screenshots are not published. */
.hero{display:block;min-height:830px;padding:154px 0 42px;isolation:isolate}
.hero .hero-inner{max-width:1400px;grid-template-columns:minmax(0,.92fr) minmax(0,1.18fr);gap:48px;padding:0 48px}
.hero-copy{position:relative;isolation:isolate}
.hero-copy::before{content:'';position:absolute;z-index:-1;inset:-50px -65px -35px -100px;background:radial-gradient(ellipse at 50% 50%,#0c102ce8 0%,#0c102cb3 42%,#0c102c00 70%);filter:blur(16px);pointer-events:none}
.hero h1{font-size:clamp(2.65rem,4.65vw,4.1rem);line-height:1.2;letter-spacing:-.04em;margin:24px 0 28px;color:#fff;text-shadow:0 2px 18px #060a2350}
.hero-audience{font-size:.84rem;margin-top:18px}
.hero-sub{font-size:1rem;line-height:1.95;margin-bottom:25px;max-width:510px}
.hero-actions{gap:12px;margin-bottom:22px}
.hero-actions .btn{padding:15px 23px;font-size:.9rem}
.hero-price{font-size:.83rem;margin:0 0 23px}
.hero-price strong{font-size:1.1rem}
.hero-news{border:0;border-top:1px solid #cadcfc26;border-radius:0;padding:18px 0 0;font-size:.79rem;margin:0;max-width:460px;align-items:flex-start}
.hero-news .release-badge{font-size:.65rem;margin-top:3px}
.hero-provider{display:flex;gap:9px;align-items:center;font-size:.76rem;color:#a8b6d8;margin-bottom:28px}
.hero-provider a{color:#e4ebfc;text-decoration:underline;text-underline-offset:4px}
.hero .orb1{width:860px;height:860px;right:-200px;top:-300px;animation:ambient-drift 19s ease-in-out infinite alternate}
.hero .orb2{width:640px;height:640px;right:4%;bottom:-330px;opacity:.55;animation:ambient-drift 24s ease-in-out -8s infinite alternate-reverse}
.hero-aurora{position:absolute;z-index:-1;inset:-30%;pointer-events:none;opacity:.35;background:conic-gradient(from 20deg at 65% 50%,transparent 0deg,#4865dc50 35deg,transparent 80deg,transparent 210deg,#8faeff25 250deg,transparent 290deg);filter:blur(42px);animation:aurora-turn 34s ease-in-out infinite alternate}
.hero .hero-grid-bg{inset:-60px;opacity:.6;animation:grid-drift 26s linear infinite}
.product-showcase{position:relative;min-width:0;padding:28px 0 15px;perspective:1400px}
.laptop{position:relative;padding:0 17px 23px;transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,-3deg));transition:transform .45s ease;transform-style:preserve-3d}
.laptop::after{content:'';position:absolute;bottom:-18px;left:7%;width:86%;height:35px;border-radius:50%;background:#0008;filter:blur(16px);z-index:-1}
.laptop-lid{position:relative;border:1px solid #8d94a5;border-radius:17px 17px 5px 5px;padding:20px 9px 13px;background:linear-gradient(135deg,#333d50,#111723 45%,#3c4355);box-shadow:0 30px 75px #03071c70,inset 0 0 0 2px #111621}
.laptop-camera{position:absolute;left:50%;top:7px;width:5px;height:5px;background:#0a1020;border:1px solid #596171;border-radius:50%}
.laptop-screen{aspect-ratio:1.899;overflow:hidden;background:#fff;border-radius:3px}
.laptop-base{position:absolute;left:0;right:0;height:17px;bottom:7px;border-radius:2px 2px 45% 45% / 2px 2px 100% 100%;background:linear-gradient(#d6dbe4,#8992a3 35%,#535e71 85%,#323c50);box-shadow:0 2px 2px #0005}
.laptop-base::before{content:'';position:absolute;left:40%;width:20%;height:6px;top:0;background:linear-gradient(#687489,#bec6d4);border-radius:0 0 10px 10px}
.hero-bottom{max-width:1304px;margin:35px auto 0;padding:20px 0 0;border-top:1px solid #cadcfc20;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#9fafd1;font-size:.7rem;position:relative;z-index:2}
.hero-bottom .en{letter-spacing:.18em;display:flex;align-items:center;gap:12px}
.scroll-stroke{display:block;width:34px;height:1px;background:#a5b6d3;transform-origin:left;animation:scroll-stroke 3s ease-in-out infinite}
.reading-progress{position:fixed;left:0;top:0;width:100%;height:2px;background:linear-gradient(90deg,#f59e0b,#ffe2a3);transform:scaleX(0);transform-origin:left;z-index:110;pointer-events:none}
html.motion-ready .reveal:not(.in){opacity:0;transform:translateY(22px)}
html.motion-paused *,html.motion-paused *::before,html.motion-paused *::after{animation-play-state:paused!important;scroll-behavior:auto!important}
html.motion-paused .reveal{opacity:1!important;transform:none!important;transition:none!important}
html.motion-paused .laptop{transform:none!important;transition:none!important}
.hero.is-idle *,.hero.is-idle *::before,.hero.is-idle *::after{animation-play-state:paused!important}
@keyframes ambient-drift{to{transform:translate(-90px,75px) scale(1.15)}}
@keyframes aurora-turn{from{transform:rotate(-12deg) scale(.95)}to{transform:rotate(18deg) scale(1.1)}}
@keyframes grid-drift{to{transform:translate(54px,54px)}}
@keyframes scroll-stroke{0%,100%{transform:scaleX(.4);opacity:.4}50%{transform:scaleX(1);opacity:1}}
/* Enlarge the desktop device past the right edge, while keeping its height in view. */
@media(min-width:851px){
  .hero{min-height:100svh;padding-top:clamp(104px,15svh,148px)}
  .hero .hero-inner{align-items:start}
  .product-showcase{padding:0;margin-top:clamp(28px,5svh,48px);width:min(150%,max(280px,calc(170svh - 310px)));max-width:none;justify-self:start}
}
@media(max-width:1100px){.hero .hero-inner{padding:0 32px;gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr)}.hero h1{font-size:clamp(2.25rem,3.9vw,2.85rem)}.hero-bottom{margin-left:32px;margin-right:32px}.hero-actions .btn{padding:13px 18px}}
@media(max-width:850px){.hero{padding-top:124px;min-height:0}.hero .hero-inner{grid-template-columns:1fr;gap:40px;max-width:740px}.hero-copy{max-width:650px}.hero h1{font-size:clamp(2.5rem,6.8vw,3.5rem)}.hero-sub{max-width:620px}.product-showcase{padding:0}.hero-news{max-width:none}.laptop{--tilt-y:0deg}.hero-bottom{margin-top:28px}.hero-aurora{filter:blur(24px)}}
@media(max-width:480px){.hero{padding-top:111px;padding-bottom:25px}.hero .hero-inner{padding:0 22px;gap:35px}.hero h1{font-size:clamp(1.8rem,9vw,2.65rem);line-height:1.32;letter-spacing:-.045em}.hero .eyebrow{font-size:.65rem;letter-spacing:.04em}.hero-audience{font-size:.74rem;margin-top:13px}.hero-sub{font-size:.88rem;line-height:1.9}.hero-actions{gap:8px}.hero-actions .btn{font-size:.79rem;padding:13px 16px}.hero-provider{font-size:.67rem;flex-wrap:wrap}.hero-price{font-size:.75rem}.hero-news{font-size:.74rem}.laptop{padding:0 7px 17px}.laptop-lid{padding:13px 5px 8px;border-radius:10px 10px 3px 3px}.laptop-camera{top:4px;width:4px;height:4px}.laptop-base{height:11px;bottom:7px}.laptop-base::before{height:4px}.hero-bottom{margin-left:22px;margin-right:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.laptop{transform:none!important}html.motion-ready .reveal:not(.in){opacity:1;transform:none}}
/* Presentation previews intentionally contain only a small raster. */
.screen-preview{height:100%;width:100%;background-size:100% 100%;background-repeat:no-repeat;pointer-events:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.screen-po-image{background-image:url('./screens/purchase-orders-preview.webp?v=a701a5270cf5')}
.laptop-screen{position:relative;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:default}
.laptop-screen::after{content:'';position:absolute;inset:0;background:linear-gradient(125deg,#fff0 35%,#fff1 48%,#fff0 65%);pointer-events:none}

/* Luminous orbits and drifting light provide depth without covering content. */
.hero{background:radial-gradient(ellipse at 80% 28%,#2d3b87 0%,#171f51 35%,#0c102c 76%)}
.hero-aurora{opacity:.7;filter:blur(24px);animation-duration:18s}
.hero-orbits{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.hero-orbits span{position:absolute;width:900px;height:900px;right:-170px;top:-60px;border:1px solid #9cb6ff27;border-radius:50%;box-shadow:0 0 80px #567bff0c,inset 0 0 90px #5e81ff09;animation:orbit-turn 34s linear infinite}
.hero-orbits span::before{content:'';position:absolute;top:13%;left:15%;width:7px;height:7px;border-radius:50%;background:#b3caff;box-shadow:0 0 20px 4px #80a9ff70}
.hero-orbits span:nth-child(2){width:660px;height:660px;top:60px;right:-50px;animation-duration:26s;animation-direction:reverse;border-style:dashed;border-color:#a8c1ff20}
.hero-orbits span:nth-child(2)::before{background:#fbc466;box-shadow:0 0 18px #f59e0b70}
.hero-orbits span:nth-child(3){width:1120px;height:1120px;right:-280px;top:-170px;animation-duration:48s;border-color:#9cb6ff13}
.hero-beam{position:absolute;inset:-50%;pointer-events:none;z-index:0;background:linear-gradient(115deg,transparent 40%,#77a4ff0d 45%,#83adff22 47%,#83adff08 50%,transparent 55%);animation:beam-travel 16s ease-in-out infinite alternate;transform-origin:70% 40%}
.product-showcase::before{content:'';position:absolute;inset:10% -5% 18%;background:radial-gradient(ellipse,#7198ff22,transparent 70%);filter:blur(18px);pointer-events:none}
.hero h1 .accent{color:#ffd15c;background:none;text-shadow:0 2px 18px #060a2350}
.section{position:relative;isolation:isolate}
.problem{background:radial-gradient(ellipse at 5% 5%,#dce5ff 0%,transparent 50%),linear-gradient(160deg,#f4f7fe,#fff 70%)}
.features{background:linear-gradient(110deg,#fff 50%,#edf2fc)}
.problem::before,.features::before,.pricing::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(#6e89bb30 .8px,transparent .8px);background-size:24px 24px;mask-image:linear-gradient(100deg,transparent 45%,#000)}
.solution,.steps{overflow:hidden;background:radial-gradient(ellipse at 100% 10%,#2c3775,transparent 65%),#121938}
.solution::after,.steps::after,.cta-box::after{content:'';position:absolute;right:-220px;top:-120px;width:650px;height:650px;z-index:0;border:1px solid #a4bcff26;border-radius:50%;box-shadow:0 0 0 80px #809cff07,0 0 0 160px #809cff04;pointer-events:none;animation:ring-drift 18s ease-in-out infinite alternate}
.solution .sol-inner{z-index:2}
.results{background:linear-gradient(130deg,#e9effb,#f8faff 60%,#fff5dd)}
.stat{box-shadow:0 20px 50px #17204b12}
.feat{background:#ffffffeb;box-shadow:0 8px 35px #1e276107}
.guide-section{background:linear-gradient(150deg,#f6f8fd,#e8eefb)}
.cta-box{position:relative;overflow:hidden;background:radial-gradient(ellipse at 15% 100%,#394689,transparent 60%),#131b44}
.cta-box h2,.cta-box p,.cta-box .hero-actions{position:relative;z-index:2}
.motion-section.is-idle::after,.motion-section.is-idle::before{animation-play-state:paused!important}
@keyframes orbit-turn{to{transform:rotate(360deg)}}
@keyframes beam-travel{from{transform:translateX(-8%) rotate(-7deg);opacity:.5}to{transform:translateX(12%) rotate(8deg);opacity:1}}
@keyframes ring-drift{to{transform:translate(-80px,80px) scale(1.12)}}

/* The amount is primary. Conditions use a compact, readable secondary tier. */
.pricing{background:linear-gradient(165deg,#eef3ff 0%,#f7f9ff 45%,#fff8eb 100%)}
.pricing .sec-head{margin-bottom:40px}

.pricing-summary{padding:30px 32px 25px;background:#fff;border:1px solid #dbe3f1;border-radius:20px;box-shadow:0 12px 36px #23346c09;position:relative;overflow:hidden;min-height:0}
.pricing-summary::before{content:'';position:absolute;top:0;left:0;right:0;height:4px;background:#566898}
.monthly-summary{background:linear-gradient(145deg,#1e2b61,#141d42);border-color:#243568;color:#fff;box-shadow:0 16px 40px #14204a21}
.monthly-summary::before{background:linear-gradient(90deg,#f59e0b,#fce0a2)}
.pricing-card-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}
.pricing-stage{font-size:.75rem;font-weight:700;color:#415078;background:#eff3fb;padding:5px 10px;border-radius:5px;line-height:1.5}
.monthly-summary .pricing-stage{color:#fce1a6;background:#fbbf241a}
.pricing-card-heading .en{font-size:.65rem;letter-spacing:.16em;color:#7987a3}
.monthly-summary .pricing-card-heading .en{color:#a6b4d5}
.pricing-summary h3{font-size:1.35rem;line-height:1.4;color:var(--navy);margin:0}
.monthly-summary h3{color:#fff}
.pricing-amount{display:flex;align-items:baseline;gap:10px;line-height:1.1;margin:18px 0;color:var(--navy)}
.pricing-amount strong{font-family:var(--en);font-size:4.6rem;font-weight:600;letter-spacing:-.045em}
.pricing-amount>span{font-size:1.15rem;font-weight:700}
.pricing-amount small{font-size:.73rem;font-weight:400;color:#68748d;display:inline-block;margin-left:7px}
.monthly-summary .pricing-amount{color:#ffce66}
.monthly-summary .pricing-amount small{color:#c5d1e9}
.pricing-card-description{font-size:.85rem;line-height:1.65;color:#526079;margin:0 0 18px}
.monthly-summary .pricing-card-description{color:#d7e0f1}
.setup-bundles{border-top:1px solid #e5eaf3;padding-top:7px}
.setup-bundles>div{display:flex;align-items:center;justify-content:space-between;padding:6px 0;color:#273653;font-size:.84rem;gap:12px}
.setup-bundles>div>span>small{display:inline-block;font-size:.66rem;color:#826012;background:#fff6de;border-radius:4px;padding:2px 5px;margin-left:6px}
.setup-bundles strong{font:600 1.45rem var(--en);white-space:nowrap}
.setup-bundles strong small{font:400 .75rem var(--jp);margin-left:4px}
.monthly-factors{display:flex;align-items:center;gap:12px;margin:21px 0 17px;font-size:.84rem}
.monthly-factors span{border:1px solid #7e90bd60;background:#ffffff08;border-radius:7px;padding:9px 17px}
.monthly-factors b{color:#92a3c7;font-weight:400}
.monthly-table-link{display:flex;justify-content:space-between;align-items:center;color:#ffd98b;font-size:.85rem;padding:9px 0;border-bottom:1px solid #b8c7e12e;font-weight:600}
.pricing-small{font-size:.74rem;color:#5e6d84;line-height:1.55;margin-top:10px}
.monthly-summary .pricing-small{color:#b2c0dd;font-size:.71rem}
.pricing-details{border-top:1px solid #e3e8f1;margin-top:12px;padding-top:10px;font-size:.76rem;color:#53617a;line-height:1.6}
.pricing-details summary{cursor:pointer;font-size:.76rem;font-weight:500;list-style:none;display:flex;align-items:center;gap:8px}
.pricing-details summary::-webkit-details-marker{display:none}
.pricing-details summary::before{content:'+';font-family:var(--en);font-size:1rem;line-height:1}
.pricing-details[open] summary::before{content:'−'}
.pricing-details summary:hover{color:#1e2761}
.pricing .pricing-notes{font-size:.75rem;line-height:1.6;margin:10px 0 0;padding-left:1.3em;color:#617086}
.pricing .pricing-notes li+li{margin-top:5px}
.pricing .pricing-notes b{font-weight:500;color:inherit}
.monthly-detail{background:#ffffffed;border:1px solid #dce4f2;border-radius:20px;padding:32px;margin-bottom:0;box-shadow:0 16px 45px #23346c07;scroll-margin-top:100px}
.monthly-detail .price-step-label{justify-content:space-between;margin-bottom:25px;align-items:flex-end}
.pricing-table-eyebrow{font:500 .64rem var(--en);letter-spacing:.17em;color:#8190aa;display:block;margin-bottom:7px}
.monthly-detail .price-step-label h4{font-size:1.15rem;color:var(--navy)}
.monthly-detail .price-step-label .sub{font-size:.73rem;color:#65728a}
.pricing-intro{gap:12px;margin:0 0 18px}
.pricing-instruction{border-radius:9px;padding:14px 16px;background:#f2f5fb;gap:10px}
.pricing-instruction .number{font-size:1rem;line-height:1.5;color:#8a9ab6}
.pricing-instruction strong{font-size:.86rem;margin-bottom:3px;line-height:1.5}
.pricing-instruction p{font-size:.76rem;line-height:1.55;color:#5f6c82}
.pricing-scroll-hint{font-size:.71rem;margin-bottom:8px;line-height:1.5}
.tier-table{border-radius:10px}.tier-table thead th{font-size:.78rem;padding:13px 9px;line-height:1.5}
.tier-table th,.tier-table td{border-width:0 0 1px 0;padding:13px 9px}
.tier-table .limit{font-size:.74rem;color:#69768b;background:#f8faff}
.tier-table .price-value{font-size:1.2rem}.tier-table .price-value small{font-size:.73rem}
.tier-table tbody tr:hover td,.tier-table tbody tr:hover th{background:#fff8e8}
.tier-table caption{font-size:.71rem;line-height:1.5;padding:11px 14px;background:#f8faff}
.price-example{margin-top:16px;padding:15px 18px;border-left:3px solid #e9ad3c;border-radius:0 8px 8px 0;background:#fff8e8;font-size:.82rem;line-height:1.7}
.price-example strong{font-size:.98rem;white-space:nowrap}
.monthly-dependency{font-size:.74rem;line-height:1.6}.monthly-dependency a{color:#384f87;text-decoration:underline;text-underline-offset:3px}
.price-foot,.results-note,.form-note,.setup-support{font-size:.77rem;line-height:1.6}
.results-note{max-width:920px;color:#66738a;margin-top:14px}
.feature-conditions{font-size:.8rem;padding:16px 20px;line-height:1.6}
.feature-conditions summary{font-size:.84rem}.feature-conditions p{margin-top:12px;line-height:1.65}
@media(max-width:760px){.pricing-summary{min-height:0;padding:25px}.pricing-amount strong{font-size:4rem}.monthly-detail{padding:24px 18px}.monthly-detail .price-step-label{align-items:flex-start;gap:10px}.pricing-intro{grid-template-columns:1fr;gap:8px}.pricing-instruction{padding:12px}.pricing .sec-head{margin-bottom:30px}.hero-orbits{opacity:.6}.hero-orbits span{right:-600px}.hero-orbits span:nth-child(2){right:-480px}.hero-orbits span:nth-child(3){right:-710px}.hero-beam{opacity:.6}.pricing-card-heading .en{font-size:.58rem}.pricing-amount small{font-size:.69rem}.setup-bundles>div>span>small{font-size:.62rem}}
@media(prefers-reduced-motion:reduce){.hero-orbits span,.hero-beam,.hero h1 .accent,.solution::after,.steps::after,.cta-box::after{animation:none!important}}

/* Separate the one-time cost from the recurring cost and its own price table. */
.setup-summary{max-width:1124px;margin:0 auto;padding:34px 38px 30px}
.pricing-block-grid{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:start}
.pricing-block-grid .pricing-card-description{margin-bottom:0}
.setup-options{border-left:1px solid #e0e6f0;padding-left:36px}
.setup-options h4{font-size:.85rem;font-weight:500;color:#5c6b83;margin:0 0 10px}
.setup-options .setup-bundles{border-top:0;padding-top:0}
.setup-options .setup-bundles>div{padding:9px 0}
.monthly-group{max-width:1124px;margin:76px auto 0;position:relative;padding-top:0;scroll-margin-top:100px}
.monthly-group::before{content:'';position:absolute;top:-39px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#adbcd5 15%,#adbcd5 85%,transparent)}
.monthly-group .monthly-summary{border-radius:20px 20px 0 0;padding:34px 38px 30px;box-shadow:none}
.monthly-explanation{border-left:1px solid #a0b5de35;padding-left:36px;padding-top:6px}
.monthly-explanation .monthly-factors{margin:16px 0}
.monthly-group .monthly-detail{border-radius:0 0 20px 20px;border-top:0;padding:30px 38px 32px}
@media(max-width:760px){.setup-summary,.monthly-group .monthly-summary{padding:25px}.pricing-block-grid{grid-template-columns:1fr;gap:24px}.setup-options{border-left:0;border-top:1px solid #e0e6f0;padding:20px 0 0}.monthly-explanation{border-left:0;border-top:1px solid #a0b5de35;padding:20px 0 0}.monthly-group{margin-top:64px}.monthly-group::before{top:-33px}.monthly-group .monthly-detail{padding:25px 18px}.pricing-card-heading{margin-bottom:20px}}