.integrate-public{--ip-violet:#815cf3;--ip-cyan:#2ad0c5}.integrate-public .shopify-hero{background:radial-gradient(circle at 82% 18%,rgba(112,82,244,.3),transparent 32%),linear-gradient(135deg,#050e18,#0a1530 58%,#251650)}.integrate-public .shopify-hero .eyebrow{color:#9fd0ff}.integrate-public .shopify-hero h1 em{color:#9a82ff}.integrate-logo{background:linear-gradient(145deg,#fff,#f1edff)!important;color:#7655df;font:900 13px Consolas,monospace}.integrate-public .shopify-router-node{border-color:rgba(129,92,243,.38);background:linear-gradient(135deg,#17294d,#312060)}
.integrate-code-request{margin-top:15px;padding:15px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:#061522}.integrate-code-request small{display:block;color:#65dcd3;font-size:8px;font-weight:900;letter-spacing:.09em}.integrate-code-request code{display:block;margin-top:10px;color:#c7d8e8;font-size:10px;line-height:1.65}.integrate-device-node{display:flex;align-items:center;gap:13px;margin-top:15px;padding:14px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:#091b2c}.integrate-device-node>span{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#eaf4ff;color:#0877f9}.integrate-device-node div{min-width:0;flex:1}.integrate-device-node small,.integrate-device-node strong,.integrate-device-node p{display:block}.integrate-device-node small{color:#708ba2;font-size:7px;font-weight:900;letter-spacing:.09em}.integrate-device-node strong{margin-top:3px;color:#fff;font-size:12px}.integrate-device-node p{margin:3px 0 0;color:#8299ae;font-size:8px}.integrate-device-node>b{color:#4dd6aa;font-size:7px}
.integrate-architecture{padding:105px 0;background:#f2f6fa}.integrate-stack{max-width:1040px;margin:auto}.integrate-stack>i{height:55px;display:grid;grid-template-columns:1fr auto;gap:12px;place-items:center;position:relative;color:#748ba0;font-size:8px;font-style:normal;text-transform:uppercase;letter-spacing:.08em}.integrate-stack>i:before{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:#a8c4df}.integrate-stack>i:after{content:"";position:relative;width:9px;height:9px;border-radius:50%;background:#158df1;box-shadow:0 0 0 6px rgba(21,141,241,.09)}.integrate-stack-sources{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.integrate-stack-sources span{padding:14px;border:1px solid #cfdeeb;border-radius:13px;background:#fff;color:#264760;font-size:10px;font-weight:850;text-align:center}.integrate-stack-api{display:flex;align-items:center;justify-content:center;gap:15px;padding:22px;border:1px solid #7ab8f2;border-radius:20px;background:#082b4a;color:#fff;box-shadow:0 20px 45px rgba(7,52,92,.16)}.integrate-stack-api img{width:52px;height:52px;border-radius:15px}.integrate-stack-api strong,.integrate-stack-api span{display:block}.integrate-stack-api strong{font-size:17px}.integrate-stack-api span{margin-top:4px;color:#91b4d1;font-size:9px}.integrate-stack-endpoints{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.integrate-stack-endpoints article{padding:18px;border:1px solid #cfdeeb;border-radius:14px;background:#fff;text-align:center}.integrate-stack-endpoints b,.integrate-stack-endpoints small{display:block}.integrate-stack-endpoints b{color:#173650;font-size:11px}.integrate-stack-endpoints small{margin-top:5px;color:#71889c;font-size:8px}.integrate-stack-result{padding:17px;border-radius:14px;background:#e0f5f2;text-align:center}.integrate-stack-result strong,.integrate-stack-result span{display:block}.integrate-stack-result strong{color:#174642;font-size:12px}.integrate-stack-result span{margin-top:5px;color:#56827d;font-size:8px}
.integrate-path-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.integrate-path-grid article{min-height:390px;display:flex;flex-direction:column;padding:28px;border:1px solid #d9e4ed;border-radius:22px;background:#f8fafc}.integrate-path-grid article>span{color:#879bae;font:900 9px Consolas,monospace}.integrate-path-icon{width:52px;height:52px;display:grid;place-items:center;margin-top:54px;border-radius:15px;background:#e6f2ff;color:#0877f9;font-size:11px;font-weight:900}.integrate-path-grid article:nth-child(2) .integrate-path-icon{background:#eeeaff;color:#7654dc}.integrate-path-grid article:nth-child(3) .integrate-path-icon{background:#e3f8f5;color:#168f86;font-size:20px}.integrate-path-grid h3{margin:23px 0 10px;font-size:23px}.integrate-path-grid p{margin:0;color:#60758b;font-size:11px}.integrate-path-grid a{margin-top:auto;padding-top:20px;color:#0877f9;font-size:9px;font-weight:900}.integrate-path-grid article>div:last-child{display:flex;flex-wrap:wrap;gap:7px;margin-top:auto}.integrate-path-grid article>div:last-child a{margin:0;padding:6px 8px;border:1px solid #cbdbea;border-radius:8px;background:#fff}
.integrate-capabilities{background:#fff}.integrate-capability-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #dbe5ee;border-left:1px solid #dbe5ee}.integrate-capability-grid>a{min-height:270px;display:flex;flex-direction:column;padding:27px;border-right:1px solid #dbe5ee;border-bottom:1px solid #dbe5ee;color:#11263c}.integrate-capability-grid span{color:#0877f9;font-size:8px;font-weight:900;letter-spacing:.08em}.integrate-capability-grid h3{margin:65px 0 9px;font-size:22px}.integrate-capability-grid p{margin:0;color:#60758b;font-size:11px}.integrate-capability-grid b{margin-top:auto;padding-top:18px;color:#0877f9;font-size:9px}
.integrate-quickstart{padding:105px 0;background:#07111f;color:#a7bed3}.integrate-quickstart-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center}.integrate-quickstart h2{margin:0;color:#fff;font-size:clamp(34px,4.2vw,58px);line-height:1.04;letter-spacing:-.035em}.integrate-quickstart p{font-size:14px}.integrate-quickstart ol{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:22px 0 0;padding:0;list-style:none}.integrate-quickstart li{display:flex;align-items:center;gap:10px;padding:11px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.04);font-size:9px}.integrate-quickstart li span{width:25px;height:25px;display:grid;place-items:center;flex:0 0 auto;border-radius:8px;background:rgba(76,145,255,.16);color:#87b6ff;font-weight:900}.integrate-quick-actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}.integrate-quick-actions .button-secondary{border-color:rgba(255,255,255,.25);background:transparent;color:#fff}.integrate-code-window{overflow:hidden;border:1px solid rgba(255,255,255,.14);border-radius:22px;background:#05101b;box-shadow:0 32px 70px rgba(0,0,0,.32)}.integrate-code-window header{display:flex;align-items:center;gap:12px;padding:15px 18px;border-bottom:1px solid rgba(255,255,255,.09)}.integrate-code-window header>span{display:flex;gap:5px}.integrate-code-window header i{width:7px;height:7px;border-radius:50%;background:#425d72}.integrate-code-window header b{color:#7892a8;font-size:9px}.integrate-code-window pre{overflow-x:auto;margin:0;padding:32px;color:#d2e0ed;font-size:12px;line-height:1.9}.integrate-code-window em{color:#62d8cf;font-style:normal}.integrate-code-window footer{display:flex;justify-content:space-between;padding:14px 18px;border-top:1px solid rgba(255,255,255,.09);color:#6f879d;font-size:8px}.integrate-code-window footer b{color:#58d7ad}
.integrate-visual-section{background:linear-gradient(135deg,#111126,#20164b)}.integrate-product-visual{overflow:hidden;margin:0;border:1px solid rgba(255,255,255,.14);border-radius:25px;background:#fff;box-shadow:0 30px 70px rgba(0,0,0,.28)}.integrate-product-visual img{width:100%;display:block}.integrate-product-visual figcaption{padding:15px;color:#6f8498;font-size:9px;text-align:center}.integrate-production{padding:105px 0;background:#eef4f9}.integrate-production-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px}.integrate-production h2{margin:0;font-size:clamp(34px,4.2vw,58px);line-height:1.04;letter-spacing:-.035em}.integrate-production-grid>div>p:not(.eyebrow){color:#60758b;font-size:13px}.integrate-production ul{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none}.integrate-production li{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:17px;border:1px solid #d6e2ec;border-radius:15px;background:#fff}.integrate-production li>span{width:40px;height:40px;display:grid;place-items:center;border-radius:11px;background:#e8f3ff;color:#0877f9;font-size:9px;font-weight:900}.integrate-production strong,.integrate-production small{display:block}.integrate-production strong{font-size:11px}.integrate-production small{margin-top:4px;color:#72889c;font-size:8px;line-height:1.5}.integrate-public .shopify-final-card{border-color:#c8bef2;background:linear-gradient(135deg,#f1edff,#fff)}
@media(max-width:1050px){.integrate-quickstart-grid,.integrate-production-grid{grid-template-columns:1fr;gap:40px}.integrate-path-grid{grid-template-columns:1fr 1fr}.integrate-capability-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.integrate-public .shopify-hero-grid{grid-template-columns:minmax(0,1fr);min-width:0}.integrate-public .shopify-hero-copy,.integrate-public .integrate-live-console{width:calc(100vw - 28px);min-width:0;max-width:calc(100vw - 28px)}.integrate-public .shopify-hero h1{font-size:40px}.integrate-architecture,.integrate-quickstart,.integrate-production{padding:72px 0}.integrate-stack-sources{grid-template-columns:1fr 1fr}.integrate-stack-sources span:last-child{grid-column:1/-1}.integrate-stack-endpoints,.integrate-path-grid,.integrate-capability-grid,.integrate-production ul{grid-template-columns:1fr}.integrate-path-grid article{min-height:330px}.integrate-capability-grid{border-left:0}.integrate-capability-grid>a{min-height:235px;border-left:1px solid #dbe5ee}.integrate-quickstart ol{grid-template-columns:1fr}.integrate-code-window pre{padding:22px;font-size:10px}.integrate-product-visual img{width:145%;max-width:none;transform:translateX(-15%)}.integrate-quick-actions .button{width:100%}}