@font-face{font-family:Graphik;src:url('Graphik-Regular.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Graphik;src:url('Graphik-Medium.woff2') format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Graphik;src:url('Graphik-Semibold.woff2') format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Graphik;src:url('Graphik-Bold.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--ink:#0a173c;--muted:#657697;--blue:#0873ff;--green:#00c967;--pale:#edf8ff;--line:#e4edf5;--shadow:0 14px 35px #246da51c,0 3px 10px #246da50a}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:105px}body{margin:0;color:var(--ink);font-family:Graphik,Arial,sans-serif;-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img{display:block;max-width:100%}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #136bdf;outline-offset:5px}[hidden]{display:none!important}.container{width:calc(100% - 96px);max-width:1180px;margin-inline:auto}.wide-container{max-width:1260px;width:calc(100% - 64px)}.icon{display:inline-block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.icon-definitions{position:absolute;width:0;height:0;overflow:hidden}.skip-link{position:fixed;top:12px;left:12px;padding:12px 20px;background:white;z-index:100;transform:translateY(-150%)}.skip-link:focus{transform:translateY(0)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:56px;padding:0 30px;border:1px solid transparent;border-radius:7px;background:var(--green);color:#fff;font-size:16px;font-weight:600;box-shadow:0 4px 8px #00c9670a;transition:background .18s,box-shadow .18s,transform .18s;white-space:nowrap}.button:hover{background:#00b65d;box-shadow:0 6px 18px #00b65d25;transform:translateY(-2px)}.button .icon{width:22px}.button-small{min-height:48px;padding-inline:24px;font-size:14px}.button-outline{color:var(--blue);background:#ffffffc9;border-color:var(--blue);box-shadow:none}.button-outline:hover{background:#e7f3ff;box-shadow:none}.eyebrow{color:var(--blue);font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-bottom:16px}.intro{color:var(--muted);font-size:19px;line-height:1.55}h2{font-size:42px;line-height:1.18;letter-spacing:-1.65px;font-weight:600}h2 span{color:var(--blue)}.section-title{text-align:center;font-size:38px;line-height:1.25;letter-spacing:-1.5px}
.site-header{height:88px;position:relative;z-index:20;background:#fff}.header-inner{height:100%;display:flex;align-items:center;gap:90px}.brand{flex-shrink:0;display:inline-flex;align-items:center}.brand img{width:158px;height:auto}.main-nav{flex:1;display:flex;align-items:center;justify-content:space-between;gap:32px;font-size:14px;font-weight:500}.nav-links,.nav-actions{display:flex;align-items:center;gap:38px}.nav-links{margin-inline:auto}.nav-actions{gap:30px}.main-nav a:not(.button):hover,.site-footer a:hover{color:var(--blue)}.menu-toggle{display:none}
.wave-surface{position:relative;isolation:isolate;overflow:hidden}.wave-surface::before,.wave-surface::after{content:"";position:absolute;z-index:-1;pointer-events:none;width:1050px;height:680px;border-radius:50%;background:repeating-radial-gradient(ellipse at center,transparent 0,transparent 19px,#ffffff66 20px,transparent 21px,transparent 34px);transform:rotate(-24deg)}.wave-surface::before{right:-100px;top:-510px}.wave-surface::after{left:-230px;bottom:-570px}.hero{background:radial-gradient(ellipse at 73% 60%,#d9f1ff55,transparent 55%),linear-gradient(110deg,#f3fbff,#e6f5ff);}.hero-inner{min-height:575px;display:grid;grid-template-columns:48% 52%;align-items:center;position:relative}.hero-copy{padding:45px 0 44px;z-index:5}.hero h1{font-size:58px;font-weight:600;line-height:1.09;letter-spacing:-2.7px;margin-bottom:23px}.hero h1 span{display:block;color:var(--blue);font-size:42px;line-height:1.15;letter-spacing:-2px;white-space:nowrap}.hero .intro{max-width:470px}.hero-actions{display:flex;gap:18px;margin-top:30px}.hero-actions .button{padding-inline:26px}.hero-note{font-size:13px;color:var(--muted);margin-top:20px}
.hero-art{position:relative;width:600px;height:460px;margin-left:-2px;transform-origin:top left}.dot-field{position:absolute;right:-10px;top:90px;width:290px;height:280px;background-image:radial-gradient(#82cdff 1.1px,transparent 1.1px);background-size:17px 17px;mask-image:linear-gradient(90deg,transparent,#000 30%,#000 80%,transparent)}.payment-card{position:relative;overflow:hidden;width:350px;height:213px;border-radius:14px;background:linear-gradient(115deg,#0877ff 0%,#1684ff 50%,#0872f6 100%);border:1px solid #63adff;box-shadow:inset 4px 0 0 #ffffff24,inset 0 -4px 1px #0048ba40,0 18px 28px #175a9d2b;color:#fff}.payment-card::before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,#ffffff09,transparent 60%);pointer-events:none}
/* Shared anchor: the alert overlaps the card, never changes the logo's position. */
.payment-card-logo{position:absolute;top:20px;right:23px;width:100px;height:auto;filter:url("#logo-on-blue");opacity:.96}.card-chip-row{position:absolute;left:30px;top:72px;display:flex;align-items:center;gap:6px}.card-chip-row img{width:40px;height:auto}.card-chip-row .icon{width:27px;height:32px;stroke-width:1.5}.card-number{position:absolute;left:30px;bottom:46px;font-family:Consolas,'Courier New',monospace;font-size:23px;letter-spacing:3px;text-shadow:0 1px 2px #0047b166;white-space:nowrap}.hero-card{position:absolute;left:24px;top:53px;transform:rotate(5deg) skewY(-1deg);width:350px;height:210px;z-index:1}.hero-card .payment-card-logo{top:20px;right:23px}.token-alert{position:absolute;z-index:4;left:229px;top:18px;display:flex;align-items:center;gap:16px;width:274px;min-height:82px;padding:18px;background:#fff;border:1px solid #f2f7fc;border-radius:14px;box-shadow:var(--shadow)}.check-circle{width:36px;height:36px;display:inline-flex;justify-content:center;align-items:center;background:var(--green);border-radius:50%;color:#fff;flex-shrink:0;box-shadow:inset 0 2px 3px #ffffff35}.check-circle .icon{width:22px;height:22px;stroke-width:2.2}.token-alert strong{display:block;font-size:13px;font-weight:500;margin-bottom:9px}.token-alert div>span{display:block;color:var(--blue);font-family:Consolas,monospace;font-size:13px;font-weight:600}.copy-icon{width:17px;height:17px;color:var(--blue);margin-left:auto;align-self:flex-end}.vault-panel{position:absolute;left:65px;top:218px;z-index:3;background:#fff;border:12px solid #f5faff;border-radius:19px;width:370px;box-shadow:0 18px 35px #236b9f24,0 0 0 1px #e7f4ff;padding:0 15px 5px}.vault-panel h3{font-size:16px;font-weight:500;padding:16px 0 17px;border-bottom:1px solid var(--line)}.vault-row{display:flex;align-items:center;gap:14px;min-height:63px}.vault-row>.icon{color:var(--blue);width:27px;height:27px;filter:drop-shadow(0 3px 4px #147eff22)}.vault-row strong{font-size:11px;font-weight:500;display:block;white-space:nowrap}.vault-row small{display:block;color:var(--muted);font-size:9px;margin-top:5px;white-space:nowrap}.mini-status{display:inline-flex;align-items:center;gap:5px;margin-left:auto;background:#e7f3ff;color:var(--blue);font-size:9px;padding:7px 9px;border-radius:20px}.mini-status::before{content:"✓";font-size:7px;border-radius:50%;width:11px;height:11px;display:grid;place-items:center;background:var(--blue);color:#fff}.gateway-lines{position:absolute;inset:0;width:600px;height:460px;fill:none;stroke:#59acff;stroke-width:2;stroke-dasharray:3 4;z-index:2}.gateway-lines .arrowhead{fill:#59acff;stroke:none}.gateway{position:absolute;z-index:3;right:3px;width:100px;height:110px;background:#fff;box-shadow:var(--shadow);border:1px solid #eef6fb;border-radius:10px;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:11px}.gateway>.icon{color:var(--blue);width:33px;height:33px}.gateway strong{font-size:11px;font-weight:500}.gateway i{position:absolute;right:14px;bottom:12px;width:7px;height:7px;border-radius:50%;background:#00cc7d}.gateway-a{top:146px}.gateway-b{top:278px}
.benefits{padding:50px 0 46px;background:#fff;scroll-margin-top:30px}.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:36px}.benefit-grid article{text-align:center;padding:0 24px}.benefit-grid article+article{border-left:1px solid var(--line)}.benefit-grid .icon{color:var(--blue);height:44px;width:44px;margin-bottom:19px;stroke-width:1.65}.benefit-grid h3{font-size:17px;font-weight:500;letter-spacing:-.5px;margin-bottom:9px}.benefit-grid p{font-size:16px;line-height:1.45;color:var(--muted)}
.platform-section{padding-top:42px;background:linear-gradient(#eef9ff 0%,#edf8ff 76%,#fff 76%)}.platform-inner{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:0 0 46px}.platform-copy h2{font-size:40px;white-space:nowrap;margin-bottom:22px}.platform-copy .intro{font-size:18px;max-width:460px}.check-list{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:16px}.check-list li{display:flex;align-items:center;gap:17px;font-size:16px;color:#425576}.check-list .check-circle{width:34px;height:34px;background:var(--blue)}.check-list .icon{width:19px;height:19px}.dashboard{background:#fff;border:1px solid #f4f9fc;border-radius:13px;box-shadow:var(--shadow);padding:26px 24px;color:#203153}.dashboard h3{font-size:16px;font-weight:500;padding-bottom:15px;border-bottom:1px solid var(--line);letter-spacing:-.45px}.table-head{display:grid;grid-template-columns:37% 38% 25%;font-size:12px;color:var(--muted);padding:15px 6px 11px}.payment-row{display:grid;grid-template-columns:37% 38% 21% 4%;align-items:center;min-height:58px;border:1px solid var(--line);border-radius:7px;margin-bottom:6px;padding:0 8px}.masked-card{display:flex;align-items:center;gap:13px}.masked-card strong{font-size:12px;white-space:nowrap;font-weight:500}.card-brand{width:42px;height:29px;display:inline-flex;align-items:center;justify-content:center;border-radius:3px;flex-shrink:0}.visa{font:bold italic 15px Arial,sans-serif;background:#075bce;color:#fff}.mastercard{background:#07325d;position:relative}.mastercard i{background:#ea1639;width:20px;height:20px;border-radius:50%;position:absolute;left:5px}.mastercard i+i{background:#ffb600;left:17px;opacity:.95}.amex{font:bold 6px/1.05 Arial,sans-serif;text-align:center;color:#fff;background:#1686c7;text-shadow:0 0 1px white;border:2px solid #1686c7;outline:1px solid #ffffff88;outline-offset:-4px}.token-value{display:flex;align-items:center;gap:9px;font-size:11px;color:var(--muted);white-space:nowrap}.token-value .icon{width:14px;height:14px;color:var(--blue)}.active-status{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#e7faf3;color:#159d77;font-size:11px;padding:8px 9px;border-radius:20px;width:fit-content}.active-status::before,.connection-grid small::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:#15c78c}.row-dots{font-size:18px;color:#87a4c8;text-align:right}.dashboard .connections-title{border-top:1px solid var(--line);border-bottom:0;margin-top:21px;padding:16px 0}.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.connection-grid>div{display:flex;align-items:center;gap:16px;padding:18px 13px;border:1px solid var(--line);border-radius:8px;box-shadow:0 3px 6px #12395604}.connection-grid>.icon,.connection-grid>div>.icon{width:32px;height:36px;color:var(--blue)}.connection-grid strong{font-size:12px;display:block;font-weight:500}.connection-grid small{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted);margin-top:7px}.connection-grid>div>.chevron{margin-left:auto;width:17px;color:#7185a5}
.developer-banner{display:grid;grid-template-columns:53% 47%;gap:0;align-items:center;border-radius:22px;padding:34px 44px;background:linear-gradient(115deg,#004fae,#0076e5 58%,#0056bd);box-shadow:0 8px 15px #1265af12;color:#fff}.developer-banner::after{left:auto;right:-590px;bottom:-450px;opacity:.3}.developer-banner::before{top:-630px;left:-500px;opacity:.2}.code-window{background:linear-gradient(115deg,#0d2b3c,#05192c);border:1px solid #143653;box-shadow:0 10px 20px #00356635;border-radius:11px;overflow:hidden;min-width:0}.code-tabs{display:flex;align-items:center;background:#0a263c;border-bottom:1px solid #31546888;padding:0 13px;height:43px}.code-tabs button{align-self:stretch;padding:0 18px;background:transparent;color:#8ca0b8;border:0;border-bottom:2px solid transparent;font-size:12px}.code-tabs button[aria-selected=true]{color:#fff;border-bottom-color:#32a8fa;background:#11344e}.code-tabs button:hover{color:#fff}.code-tabs>span{margin-left:auto;font-size:10px;color:#7e99af;padding-right:7px}.code-window pre{margin:0;padding:22px 23px 25px 32px;font:13px/1.8 Consolas,'Courier New',monospace;overflow:auto;color:#d3dfed;min-height:217px;tab-size:2}.code-comment,.code-green{color:#89c955}.code-blue{color:#56c7e8}.code-pink{color:#e779c1}.developer-copy{padding-left:52px}.developer-copy h2{font-size:44px;line-height:1.13;letter-spacing:-1.7px;margin-bottom:17px}.developer-copy p{font-size:20px;line-height:1.5;max-width:415px;color:#e9f2ff;margin-bottom:21px}.developer-copy .button{min-height:53px}
.workflow-section{padding:52px 0 47px}.workflow-section .section-title{font-size:37px}.workflow{position:relative;max-width:980px;height:720px;margin:42px auto 0}.workflow-step{position:absolute;display:flex;gap:31px;align-items:flex-start;z-index:2}.step-number{display:flex;align-items:center;justify-content:center;width:51px;height:51px;border-radius:50%;color:#fff;font-size:25px;background:linear-gradient(135deg,#0085fa,#0057b8);border:2px solid #c2e7ff;box-shadow:0 2px 4px #1765ab0d;flex-shrink:0}.workflow-step h3{font-size:25px;font-weight:600;letter-spacing:-.8px;padding-top:10px;margin-bottom:14px}.workflow-step p{font-size:20px;line-height:1.45;color:var(--muted)}.step-one{top:23px;left:110px}.step-two{top:254px;left:520px}.step-three{top:510px;left:110px}.capture-art{position:absolute;right:88px;top:0;width:330px;height:210px}.mini-code{position:absolute;right:0;top:4px;width:222px;height:159px;padding:18px 14px;background:#192f56;color:#9aadd4;font:10px/1.7 Consolas,monospace;border-radius:7px;box-shadow:0 12px 18px #22466619;transform:rotate(-1deg)}.mini-code span{color:#9cc26e}.capture-card{position:absolute;top:38px;left:-14px;width:260px;height:155px;transform:rotate(-13deg);border-radius:11px}.capture-card .payment-card-logo{width:80px;top:14px;right:16px}.capture-card .card-chip-row{top:52px;left:22px;gap:4px}.capture-card .card-chip-row img{width:30px}.capture-card .card-chip-row .icon{width:22px;height:26px}.capture-card .card-number{font-size:18px;left:22px;bottom:30px;letter-spacing:2px}.token-receipt{position:absolute;top:241px;left:110px;width:308px;padding:23px 25px 26px;background:#fff;border:1px solid #edf4f9;border-radius:14px;box-shadow:var(--shadow);z-index:2}.receipt-heading{display:flex;align-items:center;gap:15px}.receipt-heading strong{font-size:14px;font-weight:500}.receipt-heading .check-circle{width:36px;height:36px}.receipt-card{display:flex;align-items:center;gap:32px;margin:20px 0 25px}.receipt-card strong{font:600 16px Consolas,monospace}.receipt-token{display:flex;align-items:center;gap:27px;font-size:15px}.receipt-token strong{font-weight:500}.receipt-token span{color:var(--muted);font-family:Consolas,monospace}.receipt-token .icon{width:19px;height:19px;color:var(--blue);margin-left:auto}.phone-art{position:absolute;left:558px;top:440px;width:222px;height:340px;padding:43px 20px 20px;border:2px solid #e1e7ec;border-radius:31px;background:linear-gradient(120deg,#eff8ff,#fff 35%,#fff 75%,#f1f9ff);box-shadow:0 0 0 6px #fff,0 1px 18px 10px #1e598b10;text-align:center;z-index:2;mask-image:linear-gradient(#000 65%,transparent 98%)}.phone-speaker{position:absolute;top:0;left:52px;width:114px;height:23px;background:#fff;border-radius:0 0 15px 15px}.phone-speaker::before{content:"";position:absolute;width:29px;height:3px;border-radius:4px;top:10px;left:37px;background:#cdd6df}.phone-speaker::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:#cdd6df;left:76px;top:9px}.phone-card{width:100%;height:85px;border-radius:6px;box-shadow:0 5px 10px #175a9d14}.phone-card .payment-card-logo{top:9px;right:10px;width:57px}.phone-card .card-chip-row{top:27px;left:12px;gap:3px}.phone-card .card-chip-row img{width:21px}.phone-card .card-chip-row .icon{width:16px;height:20px}.phone-card .card-number{bottom:14px;left:12px;font-size:11px;letter-spacing:1.4px}.phone-art>.check-circle{margin:18px auto 10px;width:39px;height:39px}.phone-art>strong{display:block;color:#00b55f;font-size:13px;font-weight:500;white-space:nowrap}.phone-lines{display:grid;gap:8px;width:108px;margin:22px auto}.phone-lines i{height:11px;background:#e7ecf0;border-radius:4px}.phone-lines i:nth-child(3){width:65%}.flow-path{position:absolute;z-index:0;border:3px dotted #83c5ff;pointer-events:none}.path-one{left:6px;top:52px;width:72px;height:211px;border-radius:75px 0 0 75px;border-right:0}.path-two{right:16px;top:256px;width:224px;height:245px;border-radius:0 85px 85px 0;border-left:0}.path-three{top:535px;left:6px;width:340px;height:211px;border-top:0;border-right:0;border-radius:0 0 0 75px}.path-three::before{content:"";position:absolute;left:-3px;top:-22px;width:73px;height:72px;border-left:3px dotted #83c5ff;border-top:3px dotted #83c5ff;border-radius:70px 0 0 0;background:#fff}.workflow-cta{text-align:center;position:relative;z-index:4;margin-top:1px}.workflow-cta .button{min-width:200px}
.foundation{padding:39px 0 33px;background:#edf8ff}.foundation .section-title{font-size:34px;letter-spacing:-1.2px}.foundation-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}.foundation-grid article{display:flex;align-items:center;gap:17px;min-height:145px;padding:24px 19px;background:#fff;border-radius:11px;box-shadow:0 6px 18px #1f669808}.feature-icon{display:flex;align-items:center;justify-content:center;width:74px;height:80px;background:linear-gradient(#effaff,#e7f6ff);border-radius:50%;flex-shrink:0;color:var(--blue)}.feature-icon .icon{width:42px;height:42px;stroke-width:1.6}.foundation-grid h3{font-size:15px;font-weight:500;line-height:1.4;letter-spacing:-.35px;margin-bottom:9px}.foundation-grid p{font-size:14px;line-height:1.5;color:var(--muted)}
.closing-section{padding:16px 0 20px}.closing-banner{min-height:252px;display:flex;align-items:center;border-radius:22px;background:linear-gradient(115deg,#f0faff,#e6f5ff);padding:43px 48px}.closing-copy{position:relative;z-index:3}.closing-copy h2{font-size:33px;letter-spacing:-1.3px;margin-bottom:11px}.closing-copy p{color:var(--muted);font-size:19px;margin-bottom:23px}.closing-copy .button{min-height:53px}.closing-banner::before{top:auto;bottom:-580px;right:-100px;opacity:.9}.closing-banner::after{display:none}.closing-art{position:absolute;right:0;top:0;width:440px;height:280px}.closing-card-front{position:absolute;width:295px;height:177px;left:-14px;top:35px;transform:rotate(-21deg);z-index:2}.closing-card-back{position:absolute;width:268px;height:160px;right:0;top:92px;transform:rotate(-20deg);background:linear-gradient(115deg,#0560c6,#2b90f5)}.closing-art .payment-card-logo{width:85px;top:16px;right:18px}.closing-art .card-chip-row{left:23px;top:60px}.closing-art .card-chip-row img{width:35px}.closing-art .card-number{font-size:20px;left:23px;bottom:32px;letter-spacing:2.5px}.closing-card-back .card-number{font-size:18px}.site-footer{border-top:1px solid #d8e9f7;padding:32px 0}.footer-inner{display:flex;align-items:center;gap:29px;min-height:58px}.site-footer .brand img{width:145px}.site-footer p{color:var(--muted);font-size:13px}.site-footer nav{display:flex;gap:27px;margin-left:auto;font-size:12px;color:var(--muted)}
@media(min-width:1400px){.hero-inner{min-height:600px}.hero-art{margin-left:8px}.platform-inner{gap:82px}.closing-art{right:12px}}
@media(max-width:1199px){.container{width:calc(100% - 72px)}.wide-container{width:calc(100% - 48px)}.header-inner{gap:50px}.nav-links{gap:26px}.nav-actions{gap:24px}.hero-inner{min-height:530px}.hero h1{font-size:51px}.hero h1 span{font-size:35px;letter-spacing:-1.8px}.hero .intro{max-width:395px;font-size:17px}.hero-actions{gap:13px}.hero-actions .button{padding-inline:20px;font-size:14px;min-height:52px}.hero-art{transform:scale(.83);height:382px}.platform-inner{gap:36px}.platform-copy h2{font-size:34px}.platform-copy .intro{font-size:16px}.check-list li{font-size:14px}.dashboard{padding:23px 18px}.masked-card{gap:8px}.masked-card strong{font-size:10px}.token-value{font-size:10px;gap:5px}.active-status{font-size:10px;padding:7px}.connection-grid{gap:10px}.connection-grid>div{gap:11px;padding:15px 11px}.connection-grid strong{font-size:11px}.developer-banner{padding:30px 35px}.developer-copy{padding-left:35px}.developer-copy h2{font-size:38px}.developer-copy p{font-size:18px}.code-window pre{font-size:11px;padding-left:22px}.workflow{transform:scale(.9);transform-origin:top center;width:980px;max-width:none;left:50%;margin-left:-490px;height:680px}.workflow-cta{margin-top:-20px}.foundation-grid{gap:16px}.foundation-grid article{padding:22px 15px;gap:12px}.feature-icon{width:60px;height:66px}.feature-icon .icon{width:35px;height:35px}.foundation-grid h3{font-size:13px}.foundation-grid p{font-size:12px}.closing-copy h2{font-size:28px}.closing-copy p{font-size:17px}.closing-art{transform:scale(.86);transform-origin:right center;right:-8px}.closing-banner{padding:37px;min-height:235px}.site-footer nav{gap:20px}.footer-inner{gap:23px}.site-footer p{font-size:11px}}
@media(max-width:979px) and (min-width:761px){.container{width:calc(100% - 60px)}.wide-container{width:calc(100% - 40px)}.brand img{width:135px}.header-inner{gap:30px}.main-nav{font-size:12px;gap:18px}.nav-links{gap:22px}.nav-actions{gap:20px}.button-small{padding-inline:18px;min-height:42px;font-size:12px}.hero-inner{min-height:450px;grid-template-columns:47% 53%}.eyebrow{font-size:10px;letter-spacing:1.7px;margin-bottom:13px}.hero h1{font-size:44px;letter-spacing:-2px;margin-bottom:20px}.hero h1 span{font-size:29px;letter-spacing:-1.5px}.hero .intro{font-size:14px;max-width:330px}.hero-actions .button{font-size:11px;padding:0 16px;min-height:44px;gap:9px}.hero-actions .icon{width:18px}.hero-note{font-size:11px;margin-top:16px}.hero-art{transform:scale(.67);height:308px;margin-left:0}.benefits{padding:38px 0}.section-title{font-size:30px}.benefit-grid article{padding-inline:14px}.benefit-grid h3{font-size:14px}.benefit-grid p{font-size:13px}.benefit-grid .icon{width:37px;height:37px;margin-bottom:15px}.platform-inner{gap:28px}.platform-copy h2{font-size:28px;letter-spacing:-1.3px}.platform-copy .intro{font-size:14px}.check-list{gap:13px;margin-top:21px}.check-list li{font-size:12px;gap:12px}.check-list .check-circle{width:29px;height:29px}.dashboard{padding:20px 16px}.dashboard h3{font-size:13px}.table-head{font-size:10px}.payment-row{grid-template-columns:37% 37% 22% 4%;min-height:48px;padding-inline:5px}.card-brand{width:32px;height:25px}.visa{font-size:12px}.mastercard i{width:17px;height:17px;left:2px}.mastercard i+i{left:13px}.amex{font-size:5px}.masked-card{gap:7px}.masked-card strong{font-size:9px}.token-value{font-size:8px;gap:4px}.token-value .icon{width:11px}.active-status{font-size:8px;gap:4px;padding:6px}.active-status::before{width:5px;height:5px}.connection-grid>div{gap:9px;padding:12px 9px}.connection-grid>div>.icon{width:26px;height:29px}.connection-grid strong{font-size:9px}.connection-grid small{font-size:8px;gap:5px}.connection-grid>div>.chevron{width:13px}.developer-banner{padding:26px 28px}.developer-copy{padding-left:30px}.developer-copy h2{font-size:32px}.developer-copy p{font-size:15px}.developer-copy .button{font-size:13px;min-height:44px;padding-inline:22px}.code-tabs{height:37px;padding-inline:5px}.code-tabs button{font-size:10px;padding-inline:13px}.code-tabs>span{font-size:8px}.code-window pre{font-size:9px;padding:20px 17px;min-height:176px}.workflow-section .section-title{font-size:29px}.workflow{transform:scale(.75);height:570px;margin-top:35px}.workflow-cta{margin-top:-12px}.foundation .section-title{font-size:27px}.foundation-grid{gap:13px}.foundation-grid article{min-height:130px;padding:18px 12px;gap:10px}.feature-icon{width:52px;height:58px}.feature-icon .icon{width:30px;height:30px}.foundation-grid h3{font-size:10px;letter-spacing:-.2px}.foundation-grid p{font-size:10px}.closing-banner{padding:32px;min-height:200px}.closing-copy h2{font-size:24px;letter-spacing:-1px}.closing-copy p{font-size:14px}.closing-copy .button{min-height:44px;font-size:13px;padding-inline:23px}.closing-art{transform:scale(.7);right:-10px;top:-26px}.site-footer{padding:25px 0}.site-footer .brand img{width:120px}.footer-inner{gap:20px}.site-footer p{font-size:9px}.site-footer nav{font-size:10px;gap:17px}}
@media(max-width:760px){html{scroll-padding-top:30px}.container,.wide-container{width:calc(100% - 40px)}.site-header{height:77px}.header-inner{justify-content:space-between}.brand img{width:136px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;background:#f0f8ff;border:1px solid #dfedfa;border-radius:6px;width:43px;height:41px;padding:10px;color:var(--ink)}.menu-toggle span{height:2px;width:21px;background:currentColor;transition:transform .2s,opacity .2s}.menu-toggle[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.menu-toggle[aria-expanded=true] span:nth-child(2){opacity:0}.menu-toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.main-nav{display:none;position:absolute;top:76px;left:0;right:0;padding:22px;background:#fff;border-top:1px solid var(--line);box-shadow:0 14px 20px #16324d12}.main-nav.is-open{display:flex;align-items:stretch;gap:20px}.nav-links,.nav-actions{flex-direction:column;align-items:stretch;gap:0;flex:1;margin:0}.nav-links a,.nav-actions>a:not(.button){padding:13px 8px}.nav-actions .button{margin-top:5px;min-height:43px;font-size:12px;padding-inline:15px}.hero-inner{display:flex;flex-direction:column;align-items:stretch;min-height:0}.hero-copy{padding:44px 0 0}.eyebrow{font-size:10px;letter-spacing:1.7px;margin-bottom:15px}.hero h1{font-size:49px;line-height:1.09;letter-spacing:-2.3px;margin-bottom:22px}.hero h1 span{font-size:34px;letter-spacing:-1.5px;white-space:normal;max-width:480px;margin-top:4px}.hero .intro{font-size:16px;line-height:1.6;max-width:500px}.hero-actions{gap:12px;margin-top:24px}.hero-actions .button{font-size:12px;padding:0 18px;min-height:48px;gap:12px}.hero-note{font-size:11px;margin-top:17px}.hero-art{align-self:center;flex-shrink:0;margin:35px 0 0;width:600px;transform:scale(.61);transform-origin:top center;height:291px}.benefits{padding:36px 0 35px}.section-title{font-size:28px;letter-spacing:-1.2px}.benefit-grid{grid-template-columns:repeat(2,1fr);row-gap:32px;margin-top:30px}.benefit-grid article{padding-inline:10px}.benefit-grid article:nth-child(3){border-left:0}.benefit-grid .icon{width:36px;height:36px;margin-bottom:14px}.benefit-grid h3{font-size:13px;margin-bottom:8px;letter-spacing:-.3px}.benefit-grid p{font-size:12px}.platform-section{padding-top:38px;background:linear-gradient(#eef9ff 0%,#edf8ff 82%,#fff 82%)}.platform-inner{grid-template-columns:1fr;gap:30px;padding-bottom:35px}.platform-copy h2{font-size:32px;letter-spacing:-1.3px;white-space:normal;margin-bottom:18px}.platform-copy .intro{font-size:15px;max-width:510px}.check-list{gap:14px;margin-top:22px}.check-list li{font-size:13px;gap:13px}.check-list .check-circle{width:30px;height:30px}.dashboard{width:100%;max-width:540px;justify-self:center;padding:21px 17px}.dashboard h3{font-size:14px}.table-head{font-size:10px}.payment-row{padding:0 6px;min-height:50px;grid-template-columns:37% 36% 23% 4%}.card-brand{width:35px;height:25px}.visa{font-size:13px}.mastercard i{width:18px;height:18px;left:3px}.mastercard i+i{left:14px}.amex{font-size:5px}.masked-card{gap:7px}.masked-card strong{font-size:10px}.token-value{font-size:9px;gap:5px}.token-value .icon{width:12px;height:12px}.active-status{font-size:9px;padding:7px;gap:5px}.active-status::before{width:6px;height:6px}.connection-grid{gap:10px}.connection-grid>div{gap:11px;padding:14px 10px}.connection-grid>div>.icon{width:28px;height:31px}.connection-grid strong{font-size:10px}.connection-grid small{font-size:8px}.connection-grid>div>.chevron{width:13px}.developer-banner{display:flex;flex-direction:column-reverse;gap:27px;padding:29px 23px;border-radius:16px}.developer-copy{padding:0;width:100%}.developer-copy h2{font-size:35px;letter-spacing:-1.4px}.developer-copy p{font-size:16px;max-width:450px}.developer-copy .button{min-height:46px;font-size:13px;padding-inline:23px}.code-window{width:100%}.code-window pre{font-size:10px;padding:20px 15px;min-height:180px}.code-tabs{padding-inline:4px;height:39px}.code-tabs button{font-size:10px;padding-inline:14px}.code-tabs>span{font-size:9px}.workflow-section{padding:38px 0 35px;overflow:hidden}.workflow-section .section-title{font-size:28px;max-width:420px;margin:auto;line-height:1.25}.workflow{width:100%;height:auto;max-width:470px;left:auto;transform:none;display:grid;grid-template-columns:1fr;margin:35px auto 0;gap:25px}.workflow-step{position:relative;top:auto;left:auto;gap:20px;max-width:100%;padding-left:4px}.step-number{width:43px;height:43px;font-size:21px}.workflow-step h3{font-size:22px;padding-top:7px;margin-bottom:11px}.workflow-step p{font-size:16px}.step-one{grid-row:1}.capture-art{grid-row:2;position:relative;right:auto;top:auto;margin:0 auto 6px;transform:scale(.88);transform-origin:center center;width:330px;height:200px}.step-two{grid-row:3}.token-receipt{grid-row:4;position:relative;top:auto;left:auto;width:290px;margin:0 auto 20px;padding:22px}.step-three{grid-row:5}.phone-art{grid-row:6;position:relative;top:auto;left:auto;margin:4px auto -25px;height:315px}.flow-path{display:none}.workflow-cta{margin-top:0}.workflow-cta .button{font-size:14px;min-height:49px;min-width:180px}.foundation{padding:33px 0}.foundation .section-title{font-size:27px;max-width:400px;margin:auto;line-height:1.25}.foundation-grid{grid-template-columns:1fr;gap:13px;margin-top:25px}.foundation-grid article{min-height:118px;padding:23px;gap:20px}.feature-icon{width:64px;height:70px}.feature-icon .icon{width:36px;height:36px}.foundation-grid h3{font-size:14px;margin-bottom:6px}.foundation-grid p{font-size:13px;max-width:300px}.closing-section{padding-top:18px}.closing-banner{display:block;padding:29px 25px 0;min-height:425px;border-radius:16px}.closing-copy h2{font-size:28px;max-width:370px;line-height:1.2;letter-spacing:-1.1px}.closing-copy p{font-size:15px;line-height:1.5;margin-top:13px;margin-bottom:20px}.closing-copy .button{font-size:13px;min-height:47px;padding-inline:24px}.closing-art{top:auto;bottom:-44px;right:-3px;transform:scale(.73);transform-origin:right bottom}.site-footer{padding:27px 0}.footer-inner{flex-wrap:wrap;justify-content:center;gap:18px;text-align:center}.site-footer .brand img{width:132px}.site-footer p{font-size:11px}.site-footer nav{flex-basis:100%;margin:5px 0 0;justify-content:center;gap:22px;font-size:11px}}
@media(min-width:520px) and (max-width:760px){.hero-art{transform:scale(.83);height:395px;margin-top:38px}.hero h1 span{font-size:40px}.hero-actions .button{font-size:14px;padding-inline:24px}.hero-copy{max-width:540px}.closing-banner{min-height:410px}.closing-art{transform:scale(.87);right:10px;bottom:-40px}}
@media(max-width:374px){.container,.wide-container{width:calc(100% - 32px)}.hero h1{font-size:44px}.hero h1 span{font-size:30px}.hero-actions{gap:9px}.hero-actions .button{font-size:11px;padding-inline:12px;gap:8px}.hero-art{transform:scale(.51);height:244px}.platform-copy h2{font-size:28px}.dashboard{padding:18px 12px}.masked-card strong{font-size:9px}.token-value{font-size:8px;gap:3px}.active-status{font-size:8px;padding:6px}.connection-grid>div{gap:7px;padding-inline:8px}.connection-grid>div>.icon{width:24px}.foundation-grid article{padding:19px 16px;gap:14px}.site-footer nav{gap:17px}.closing-art{transform:scale(.65)}.code-window pre{font-size:9px}.code-tabs button{padding-inline:11px}.capture-art{transform:scale(.8);left:-8px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}

/* Keep the original header space when the navigation fixes after 40px. */
.header-space { height: 88px; }
.site-header { width: 100%; z-index: 50; transition: box-shadow .25s ease; }
.site-header.fixed-nav { position: fixed; top: 0; left: 0; box-shadow: 0 4px 20px #15365214; }
/* Keep the section links in page order with room for the demo action. */
@media (min-width: 761px) {
    .header-inner { gap: 44px; }
    .main-nav { gap: 28px; }
    .nav-links { gap: 28px; }
    .nav-links a { white-space: nowrap; }
}
@media (min-width: 761px) and (max-width: 1199px) {
    .header-inner { gap: 28px; }
    .main-nav { gap: 24px; font-size: 13px; }
    .nav-links { gap: 22px; }
}
@media (min-width: 761px) and (max-width: 979px) {
    .header-inner { gap: 24px; }
    .main-nav { gap: 18px; font-size: 12px; }
    .nav-links { gap: 16px; }
}
@media (max-width: 760px) {
    .main-nav { max-height: calc(100dvh - 77px); overflow-y: auto; }
    .nav-links { flex: 2; }
    .nav-actions { justify-content: flex-start; }
}
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Rotating advantages and the connected card / token / API illustration. */
.why-ordercard { padding: 72px 0 58px; background: radial-gradient(ellipse at 38% 60%, #d9efff, transparent 65%), linear-gradient(120deg, #f1faff, #e7f5ff); }
.why-ordercard::before { width: 1500px; height: 1100px; top: -880px; right: calc(50% - 750px); opacity: .75; }
.why-ordercard::after { left: -530px; bottom: -490px; width: 1500px; height: 1000px; opacity: .8; }
.section-heading { text-align: center; position: relative; z-index: 2; }
.section-heading .eyebrow { font-size: 13px; letter-spacing: 3.3px; margin-bottom: 21px; }
.section-heading h2 { font-size: 50px; font-weight: 600; line-height: 1.12; letter-spacing: -2px; }
.section-intro { color: var(--muted); font-size: 20px; line-height: 1.55; margin-top: 21px; }
.why-layout { display: grid; grid-template-columns: 53% 47%; align-items: center; gap: 0; margin-top: 43px; }
.stack-visual { position: relative; min-width: 0; height: 540px; }
.stack-scene { position: absolute; width: 580px; height: 520px; top: 4px; left: 50%; margin-left: -290px; isolation: isolate; }
.stack-glow { position: absolute; width: 470px; height: 360px; left: 60px; top: 100px; background: radial-gradient(ellipse, #57b3ff33, transparent 70%); filter: blur(20px); }
.stack-dots { position: absolute; left: 0; top: 85px; width: 530px; height: 300px; background: radial-gradient(#61b2fa77 1.3px, transparent 1.4px) 0 0 / 21px 21px; mask-image: radial-gradient(ellipse, #000, transparent 74%); }
.stack-layer { position: absolute; transform: rotateX(52deg) rotateZ(26deg); transform-origin: center; transition: transform .85s cubic-bezier(.22,.8,.24,1), box-shadow .85s ease, border-color .85s ease; }
.stack-payment-card { z-index: 4; top: 8px; left: 96px; width: 405px; height: 240px; border-radius: 19px; background: linear-gradient(125deg, #0060f4, #0879ff 60%, #208bff); box-shadow: inset 0 -5px 0 #ffffff24, 0 19px 35px #0865c225; }
.stack-payment-card .payment-card-logo { width: 122px; top: 28px; right: 28px; z-index: 2; }
.stack-payment-card .card-chip-row { top: 83px; left: 40px; gap: 11px; }
.stack-payment-card .card-chip-row img { width: 49px; }
.stack-payment-card .card-chip-row .icon { width: 34px; height: 39px; }
.stack-payment-card .card-number { left: 40px; bottom: 45px; font-size: 26px; letter-spacing: 4px; }
.stack-card-contours { position: absolute; right: -120px; top: -130px; width: 400px; height: 490px; border-radius: 50%; background: repeating-radial-gradient(ellipse at right, transparent 0 27px, #ffffff0d 28px 29px, transparent 30px 43px); transform: rotate(-18deg); pointer-events: none; }
.stack-token { z-index: 3; top: 125px; left: 79px; width: 440px; height: 238px; padding: 35px; border: 2px solid #fff; border-radius: 19px; background: linear-gradient(125deg, #ffffffd9, #dbeaffbf); box-shadow: inset 0 -5px 0 #ffffffc7, 0 21px 38px #4086b91c; }
.stack-token-content { display: flex; align-items: center; justify-content: center; gap: 24px; height: 100%; border: 1px solid #fff9; border-radius: 12px; background: linear-gradient(110deg, #fff, #e9f0ffdb); }
.stack-token-content > .icon { color: var(--blue); width: 54px; height: 54px; stroke-width: 1.7; }
.stack-token-content strong { display: block; font-size: 22px; font-weight: 600; letter-spacing: -.6px; }
.stack-token-content div > span { display: block; margin-top: 14px; font: 15px Consolas, monospace; color: #8aabd1; letter-spacing: 2px; }
.stack-token-content > .token-check { width: 26px; height: 26px; color: #16bb81; margin-left: -5px; }
.stack-api { z-index: 1; top: 247px; left: 62px; width: 472px; height: 240px; background: linear-gradient(130deg, #0b2d4d, #071b32); color: #c5def5; border: 2px solid #446888; border-radius: 18px; overflow: hidden; box-shadow: inset 0 -4px 0 #0005, 0 25px 35px #1b517c22; }
.stack-code-tabs { display: flex; align-items: center; gap: 0; padding: 0 26px; height: 52px; border-bottom: 1px solid #6f95b33b; color: #7898b9; font-size: 13px; }
.stack-code-tabs > span { display: grid; align-items: center; height: 100%; padding: 0 23px; }
.stack-code-tabs .is-selected { background: #22456c55; color: #fff; border-bottom: 2px solid #44adff; }
.stack-code { display: grid; grid-template-columns: 22px 1fr; column-gap: 21px; row-gap: 12px; padding: 27px 22px 17px; font: 13px/1.4 Consolas, monospace; }
.stack-code code { font: inherit; white-space: nowrap; }
.code-line-number { color: #7591ab; text-align: center; }
.stack-code-status { display: flex; align-items: center; gap: 8px; padding: 6px 0 0 65px; font: 11px Consolas, monospace; color: #7c9cb7; }
.stack-code-status > span { width: 5px; height: 5px; background: #17ca92; border-radius: 50%; }
.stack-connector { position: absolute; z-index: 2; width: 2px; border-left: 2px dotted #4d9dff88; }
.stack-connector::before, .stack-connector::after { content: ""; position: absolute; width: 9px; height: 9px; border: 3px solid #fff; border-radius: 50%; background: #127dff; left: -8px; box-shadow: 0 0 12px #75c0ff66; }
.stack-connector::before { top: 0; }.stack-connector::after { bottom: 0; }
.connector-left { top: 144px; left: 109px; height: 231px; }.connector-right { top: 170px; left: 501px; height: 237px; }.connector-front { top: 264px; left: 384px; height: 166px; }
.stack-connector > i { position: absolute; width: 6px; height: 6px; top: 0; left: -4px; background: #1381ff; border-radius: 50%; box-shadow: 0 0 0 4px #1783ff16, 0 0 10px #1e8aff; opacity: 0; }
.why-ordercard[data-active-feature="portability"] .stack-payment-card { transform: translateY(-12px) rotateX(52deg) rotateZ(26deg); box-shadow: inset 0 -5px 0 #ffffff30, 0 28px 42px #0865c238; }
.why-ordercard[data-active-feature="control"] .stack-token { transform: translateY(-13px) rotateX(52deg) rotateZ(26deg); border-color: #8ccaff; box-shadow: inset 0 -5px 0 #fffd, 0 21px 40px #218cda38; }
.why-ordercard[data-active-feature="simplicity"] .stack-api { transform: translateY(-13px) rotateX(52deg) rotateZ(26deg); border-color: #4ca6fb; box-shadow: inset 0 -4px 0 #0005, 0 26px 42px #1c6dba40; }
.why-feature-panel { position: relative; padding-left: 35px; }
.why-features { display: grid; gap: 15px; }
.why-feature { position: relative; display: flex; align-items: center; gap: 24px; padding: 27px 26px; min-height: 145px; width: 100%; background: transparent; border: 1px solid transparent; border-radius: 16px; color: var(--ink); text-align: left; transition: background .5s ease, box-shadow .5s ease, transform .5s ease, border-color .5s ease; }
.why-feature::after { content: ""; position: absolute; height: 1px; bottom: -8px; left: 16px; right: 16px; background: #b7d8f4; transition: opacity .4s; }
.why-feature:last-child::after, .why-feature.is-active::after { opacity: 0; }
.why-feature.is-active { background: #fff; box-shadow: 0 16px 35px #1f7cc017; border-color: #f1f8ff; transform: translateX(-10px); }
.why-feature:hover { background: #ffffff80; }.why-feature.is-active:hover { background: #fff; }
.why-feature-icon { display: flex; align-items: center; justify-content: center; width: 88px; height: 90px; background: linear-gradient(135deg, #eaf6ff, #dcedff); color: var(--blue); border-radius: 20px; flex-shrink: 0; transition: background .5s, transform .5s; }
.why-feature.is-active .why-feature-icon { background: linear-gradient(135deg, #f2f9ff, #eaf5ff); transform: scale(1.03); }
.why-feature-icon .icon { width: 47px; height: 47px; stroke-width: 1.8; }
.why-feature-copy { display: block; }.why-feature-copy > strong { display: block; font-size: 25px; font-weight: 600; letter-spacing: -.9px; margin-bottom: 9px; }
.why-feature-copy > span { display: block; color: var(--muted); font-size: 17px; line-height: 1.6; max-width: 310px; }
.feature-progress { position: absolute; bottom: 0; left: 26px; right: 26px; height: 2px; border-radius: 2px; background: #e7f3fe; overflow: hidden; opacity: 0; }
.why-ordercard.is-enhanced .why-feature.is-active .feature-progress { opacity: 1; }
.why-feature.is-active .feature-progress::after { content: ""; position: absolute; inset: 0; background: #56aaff; transform: scaleX(0); transform-origin: left; animation: feature-progress 4.5s linear both; animation-play-state: paused; }
.rotation-controls { display: flex; align-items: center; justify-content: space-between; padding: 23px 27px 0 16px; color: #617d9e; font-size: 11px; }
.feature-counter { letter-spacing: 2px; }.feature-counter b { color: #0b74de; font-weight: 500; }
.rotation-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 5px 9px; background: transparent; border: 0; border-radius: 5px; color: #617d9e; font-size: 11px; }
.rotation-toggle:hover { background: #fff8; color: #0873ff; }.rotation-symbol { width: 12px; font-size: 13px; font-weight: 600; }
.why-ordercard.is-enhanced .stack-scene { animation: stack-float 6s ease-in-out infinite; animation-play-state: paused; }
.why-ordercard.is-enhanced .stack-connector > i { animation: token-travel 2.8s ease-in-out infinite; animation-play-state: paused; }
.why-ordercard .connector-right > i { animation-delay: .65s; }.why-ordercard .connector-front > i { animation-delay: 1.3s; }
.why-ordercard.is-running .stack-scene, .why-ordercard.is-running .stack-connector > i, .why-ordercard.is-running .why-feature.is-active .feature-progress::after { animation-play-state: running; }
@keyframes feature-progress { to { transform: scaleX(1); } }
@keyframes stack-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes token-travel { 0% { top: 0; opacity: 0; } 15%, 80% { opacity: 1; } 100% { top: 100%; opacity: 0; } }

/* Roomy comparison rows keep the two storage models easy to scan. */
.comparison-section { padding: 78px 0 74px; background: linear-gradient(#fff, #fcfdff); }
.comparison-table-wrap { margin-top: 45px; border: 1px solid #dce9f6; border-radius: 19px; box-shadow: 0 12px 30px #185f9d0d; overflow: hidden; }
.comparison-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; text-align: left; }
.criteria-column { width: 27%; }.ordercard-column { width: 36.5%; }.processor-column { width: 36.5%; }
.comparison-table th, .comparison-table td { padding: 28px 31px; font-size: 16px; line-height: 1.6; vertical-align: middle; }
.comparison-table thead th { height: 126px; background: linear-gradient(115deg, #f3f8fd, #fff); font-size: 18px; font-weight: 600; letter-spacing: -.45px; }
.comparison-table thead .ordercard-heading { padding-block: 20px; background: linear-gradient(115deg, #0064f5, #2185ff); color: #fff; text-align: center; border-radius: 9px 9px 0 0; }
.ordercard-heading img { width: 145px; height: auto; margin: 0 auto 9px; filter:url("#logo-on-blue"); }
.ordercard-heading > span { display: block; font-size: 14px; font-weight: 500; letter-spacing: .3px; }
.comparison-table thead .processor-heading { text-align: center; background: #fff; }
.processor-heading strong { display: block; font-weight: 600; font-size: 18px; line-height: 1.4; }
.processor-heading > span { display: block; font-size: 13px; line-height: 1.5; font-weight: 400; color: var(--muted); letter-spacing: -.1px; margin-top: 7px; }
.comparison-table tbody th, .comparison-table tbody td { border-top: 1px solid #dce8f4; height: 95px; }
.comparison-table tbody th { font-weight: 500; letter-spacing: -.3px; background: #fff; }
.comparison-table tbody td:nth-child(2) { background: linear-gradient(110deg, #eef8ff, #e9f5ff); border-left: 1px solid #dceafb; border-right: 1px solid #dceafb; }
.comparison-table tbody td:last-child { color: var(--muted); background: #fff; }
.comparison-cell { display: flex; align-items: center; gap: 20px; }
.comparison-cell .check-circle, .comparison-minus { width: 31px; height: 31px; flex-shrink: 0; }
.comparison-cell .check-circle .icon { width: 19px; height: 19px; }
.comparison-minus { display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(140deg, #aebdcb, #9fadb9); border-radius: 50%; color: #fff; font-size: 23px; font-weight: 400; }
.comparison-cta { text-align: center; margin-top: 30px; }.comparison-cta p { color: var(--muted); font-size: 18px; line-height: 1.55; margin-bottom: 22px; }
.comparison-cta .button { min-width: 214px; }

@media (max-width: 1199px) {
    .why-feature-panel { padding-left: 18px; }.why-feature { gap: 20px; padding: 25px 22px; min-height: 141px; }
    .why-feature-icon { width: 75px; height: 79px; border-radius: 17px; }.why-feature-icon .icon { width: 42px; height: 42px; }
    .why-feature-copy > strong { font-size: 23px; }.why-feature-copy > span { font-size: 15px; }
    .stack-visual { height: 490px; }.stack-scene { scale: .88; transform-origin: center top; }
    .comparison-table th, .comparison-table td { padding: 27px 25px; font-size: 14px; }.comparison-cell { gap: 16px; }
    .comparison-table thead th { font-size: 17px; }.processor-heading strong { font-size: 16px; }
}
@media (min-width: 761px) and (max-width: 979px) {
    .why-ordercard { padding: 58px 0 45px; }.section-heading h2 { font-size: 44px; }.section-intro { font-size: 17px; }
    .why-layout { grid-template-columns: 51% 49%; margin-top: 32px; }.stack-visual { height: 414px; }.stack-scene { scale: .7; top: 24px; }
    .why-feature-panel { padding-left: 10px; }.why-features { gap: 12px; }.why-feature { gap: 15px; padding: 23px 18px; min-height: 120px; }
    .why-feature-icon { width: 60px; height: 66px; border-radius: 14px; }.why-feature-icon .icon { width: 35px; height: 35px; }
    .why-feature-copy > strong { font-size: 21px; margin-bottom: 7px; }.why-feature-copy > span { font-size: 13px; }
    .rotation-controls { padding-top: 16px; }.comparison-section { padding: 60px 0; }.comparison-table-wrap { margin-top: 35px; }
    .comparison-table th, .comparison-table td { padding: 25px 18px; font-size: 13px; }.comparison-table thead th { height: 118px; font-size: 15px; }
    .ordercard-heading img { width: 125px; }.ordercard-heading > span { font-size: 12px; }.processor-heading strong { font-size: 14px; }.processor-heading > span { font-size: 11px; }
    .comparison-cell { gap: 12px; }.comparison-cell .check-circle, .comparison-minus { width: 27px; height: 27px; }.comparison-cta p { font-size: 16px; }
}
@media (max-width: 760px) {
    html { scroll-padding-top: 95px; }.header-space { height: 77px; }
    .why-ordercard { padding: 45px 0 36px; }.section-heading .eyebrow { font-size: 10px; letter-spacing: 2.8px; margin-bottom: 18px; }
    .section-heading h2 { font-size: 35px; line-height: 1.15; letter-spacing: -1.5px; }.section-intro { font-size: 15px; margin: 17px auto 0; max-width: 370px; }
    .why-layout { grid-template-columns: 1fr; margin-top: 22px; }.stack-visual { height: 322px; }.stack-scene { top: 12px; scale: .6; }
    .why-feature-panel { padding: 0; max-width: 500px; width: 100%; margin: 0 auto; }.why-features { gap: 13px; }
    .why-feature { gap: 20px; padding: 22px; min-height: 125px; border-radius: 13px; }.why-feature.is-active { transform: none; }
    .why-feature-icon { width: 64px; height: 70px; border-radius: 15px; }.why-feature-icon .icon { width: 36px; height: 36px; }
    .why-feature-copy > strong { font-size: 21px; margin-bottom: 7px; }.why-feature-copy > span { font-size: 13px; line-height: 1.65; }
    .rotation-controls { padding: 18px 12px 0; }.feature-progress { left: 22px; right: 22px; }
    .comparison-section { padding: 45px 0 42px; }.comparison-table-wrap { margin-top: 30px; border-radius: 13px; }
    .comparison-table, .comparison-table tbody { display: block; }.comparison-table colgroup { display: none; }
    .comparison-table thead { display: block; }.comparison-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .comparison-table thead th:first-child { display: none; }.comparison-table thead th { display: flex; flex-direction: column; align-items: center; justify-content: center; height: auto; min-height: 115px; padding: 20px 13px; font-size: 13px; }
    .comparison-table thead .ordercard-heading { border-radius: 0; }.ordercard-heading img { width: 116px; margin-bottom: 9px; }.ordercard-heading > span { font-size: 10px; letter-spacing: 0; }
    .processor-heading strong { font-size: 13px; line-height: 1.45; }.processor-heading > span { font-size: 10px; line-height: 1.5; max-width: 150px; }
    .comparison-table tbody th { grid-column: 1 / -1; padding: 16px 20px; height: auto; min-height: 54px; font-size: 14px; background: #f7faff; border-top: 1px solid #dce8f4; }
    .comparison-table tbody td { display: flex; align-items: flex-start; height: auto; min-height: 132px; padding: 21px 17px 24px; font-size: 12px; line-height: 1.65; border-top: 1px solid #e5eef7; }
    .comparison-table tbody td:nth-child(2) { border-left: 0; }.comparison-cell { flex-direction: column; align-items: flex-start; gap: 12px; }
    .comparison-cell .check-circle, .comparison-minus { width: 27px; height: 27px; }.comparison-cell .check-circle .icon { width: 17px; height: 17px; }
    .comparison-cta { margin-top: 24px; }.comparison-cta p { font-size: 14px; margin-bottom: 20px; }.comparison-cta .button { font-size: 14px; min-height: 49px; min-width: 195px; }
}
@media (min-width: 520px) and (max-width: 760px) {
    .stack-scene { scale: .82; }.stack-visual { height: 435px; }.section-heading h2 { font-size: 41px; }
    .comparison-table tbody td { padding: 24px; font-size: 14px; min-height: 130px; }.comparison-cell { flex-direction: row; align-items: center; gap: 14px; }
    .ordercard-heading > span { font-size: 12px; }.processor-heading strong { font-size: 16px; }.processor-heading > span { font-size: 12px; max-width: none; }
}
@media (max-width: 374px) {
    .section-heading h2 { font-size: 31px; }.stack-scene { scale: .51; }.stack-visual { height: 275px; }
    .why-feature { gap: 14px; padding: 20px 17px; }.why-feature-icon { width: 55px; height: 61px; }.why-feature-copy > strong { font-size: 20px; }.why-feature-copy > span { font-size: 12px; }
    .comparison-table thead th { padding-inline: 9px; }.ordercard-heading img { width: 105px; }.processor-heading strong { font-size: 12px; }.comparison-table tbody td { padding-inline: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    .why-ordercard *, .why-ordercard *::before, .why-ordercard *::after { animation: none !important; }
    .feature-progress { display: none; }
}
