/* OTEMATIK · Reusable product page visual component system.
   Typography is sourced only from assets/design-system.css; this file handles
   layout, color, illustration and micro-UI inside illustrative previews. */
:root{--op-ink:#171e30;--op-muted:#64728e;--op-brand:#704be8;--op-shell-gutter:clamp(22px,4.95vw,98px);--op-section:var(--ot-space-section);--op-radius:17px}
.op-page{color:var(--op-ink);overflow:clip}
.op-page *, .op-dialog *, .op-mobile-cta *{box-sizing:border-box}
.op-page :is(a,button,summary):focus-visible,.op-dialog :is(button,input,textarea):focus-visible{outline:3px solid #8e69f4;outline-offset:4px}
.op-shell{width:100%;padding-inline:var(--op-shell-gutter);max-width:1920px;margin:0 auto}
.op-skip{position:absolute;top:-80px;left:12px;padding:12px 20px;z-index:1001;background:#151b30;color:#fff;border-radius:10px}.op-skip:focus{top:12px}
.op-eyebrow{color:#7454e7;margin-bottom:13px}
.op-page h1,.op-page h2,.op-page h3,.op-page p{margin-top:0}
.op-page :is(.ot-type-display,.ot-type-section,.ot-type-feature,.ot-type-intro,.ot-type-card-title,.ot-type-card-copy){margin-bottom:0}
.op-section{padding-block:var(--op-section)}
.op-section-heading{margin-bottom:34px}.op-section-heading .ot-type-intro{color:var(--op-muted);max-width:620px;margin-top:13px}
.op-section-heading.op-centered{text-align:center;max-width:790px;margin-inline:auto}.op-section-heading.op-centered .ot-type-intro{margin-inline:auto}
.op-section-heading.op-between{display:flex;align-items:end;justify-content:space-between;gap:26px}
.op-inline-link{display:inline-flex;align-items:center;gap:10px;color:#44319c;font-weight:700;white-space:nowrap}.op-inline-link:hover{color:#7548ec}.op-inline-link .icon{width:17px;height:17px;transition:transform .2s}.op-inline-link:hover .icon{transform:translateX(4px)}
.op-button{display:inline-flex;justify-content:center;align-items:center;gap:14px;min-height:52px;padding:0 22px;border-radius:11px;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.op-button .icon{width:19px;height:19px}.op-button:hover{transform:translateY(-2px)}.op-button-dark{background:#101827;color:#fff;box-shadow:0 8px 18px #18244116}.op-button-dark:hover{background:#283550;color:white;box-shadow:0 12px 23px #15203b20}.op-button-ghost{background:#fff;border-color:#dce3f2;color:#202c47}.op-button-ghost:hover{box-shadow:0 8px 18px #12214415}.op-button-light{background:#fff;color:#162035}.op-button-light:hover{color:#171e30;box-shadow:0 9px 24px #040d243b}
/* HERO */
.op-hero{isolation:isolate;position:relative;overflow:hidden;background:radial-gradient(ellipse 56% 85% at 101% 53%,#e5ddff 0,transparent 78%),radial-gradient(ellipse 35% 59% at -5% 100%,#d9f0ff 0,transparent 80%),linear-gradient(105deg,#f8fcff 0,#fff 40%,#f8f6ff 100%);padding:24px 0 clamp(52px,5.3vw,84px)}
.op-hero:before{content:"";position:absolute;width:520px;height:520px;background:#ebe8ffb5;filter:blur(85px);right:-18%;top:-28%;z-index:-1;border-radius:50%}
.op-crumb{display:flex;gap:10px;align-items:center;flex-wrap:wrap;color:#7c8eaf;font-size:13px;line-height:1.5;margin:0 0 clamp(31px,4vw,54px)}.op-crumb a:hover{color:#704be8}.op-crumb [aria-current]{font-weight:750;color:#243252}
.op-hero-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:clamp(30px,5vw,86px)}
.op-hero-copy{max-width:785px;min-width:0}.op-kicker{display:flex;align-items:center;gap:10px;color:#7550e7;margin-bottom:19px}.op-kicker-dot{width:8px;height:8px;background:#8355f6;box-shadow:0 0 0 4px #905bf01a;border-radius:50%;flex-shrink:0}
.op-page .op-hero h1{margin:0 0 22px}.op-gradient-text{background:linear-gradient(90deg,#7341da 0%,#9258e9 50%,#2e90ee 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.op-hero-description{color:#677697;max-width:630px;margin:0 0 26px !important}
.op-hero-actions{display:flex;gap:11px;flex-wrap:wrap;align-items:center}.op-hero-checks{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:25px;color:#566e92;font-size:13px}.op-hero-checks span{display:inline-flex;gap:7px;align-items:center}.op-hero-checks .icon{width:18px;height:18px;color:#19ab7a}
/* INTERACTIVE HERO ILLUSTRATION */
.op-hero-demo{width:100%;max-width:680px;justify-self:end;position:relative;padding:26px 20px 9px;min-width:0}
.op-demo-topline{position:absolute;top:0;left:28px;right:24px;display:flex;align-items:center;justify-content:space-between}.op-live-pill{display:flex;align-items:center;gap:7px;font-size:10px;font-weight:800;letter-spacing:.09em;color:#6a50ca}.op-live-pill>span{background:#16c38c;width:6px;height:6px;border-radius:50%;box-shadow:0 0 0 4px #19bd821b}.op-demo-caption{font-size:10px;color:#8591b1;letter-spacing:.12em;font-weight:800}
.op-demo-window{background:#fff;border:1px solid #e5e9f6;box-shadow:0 25px 60px #424a8830,0 5px 15px #7777a51c;border-radius:22px;overflow:hidden;transform:rotate(1deg);position:relative;z-index:2}.op-demo-window:after{content:"";pointer-events:none;position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#36cda1,#8767f0,#87b9f4)}
.op-demo-toolbar{background:#fdfdff;padding:18px 20px;display:flex;align-items:center;gap:11px;border-bottom:1px solid #edf0f7}.op-demo-avatar{width:43px;height:43px;border-radius:13px;background:#dff8eb;color:#13a875;display:grid;place-items:center}.op-demo-avatar .icon{width:23px;height:23px}.op-demo-person{display:grid;gap:2px}.op-demo-person strong{font-size:13px;color:#19243c;font-weight:800}.op-demo-person small{font-size:10px;color:#8b9db9}.op-demo-dots{margin-left:auto;display:flex;gap:4px}.op-demo-dots i{background:#cbd3e8;width:5px;height:5px;border-radius:50%}
.op-demo-body{background:#f5f8fb;background-image:radial-gradient(#dbe7e988 1px,transparent 1px);background-size:17px 17px;min-height:298px;padding:18px 22px 20px;position:relative}.op-chat-scene{display:flex;flex-direction:column;gap:17px;animation:opShow .25s ease}.op-chat-scene[hidden]{display:none!important}.op-chat-day{align-self:center;color:#95a3b8;background:#fff;border-radius:50px;padding:6px 11px;font-size:9px;font-weight:800;letter-spacing:.1em}.op-chat-bubble{font-size:13px;line-height:1.64;padding:12px 14px;border-radius:13px;max-width:80%;box-shadow:0 4px 10px #1c46600b}.op-chat-bubble.received{background:#fff;color:#334561;align-self:flex-start;border-top-left-radius:3px}.op-chat-bubble.sent{background:#e2f9eb;color:#24513b;align-self:flex-end;border-top-right-radius:3px}.op-chat-mark{font-size:9px;font-weight:800;color:#109069;letter-spacing:.06em;display:block;margin-bottom:5px}.op-chat-check{font-size:10px;color:#25a5bf;display:block;text-align:right;margin-top:4px}.op-chat-event{align-self:center;display:inline-flex;align-items:center;gap:5px;border:1px solid #dce6f1;background:#fffffff0;padding:5px 11px;border-radius:50px;font-size:10px;color:#667a97;font-weight:700}.op-chat-event .icon{width:13px;height:13px;color:#13bd84}.op-demo-bottom{background:#fff;padding:12px 17px;display:flex;gap:12px;align-items:center}.op-compose{flex:1;background:#f7f8fc;border-radius:50px;padding:10px 15px;color:#a4aec5;font-size:11px}.op-send{display:grid;place-items:center;background:#1bb87f;border-radius:50%;width:34px;height:34px;color:#fff}.op-send .icon{width:18px;height:18px}
.op-demo-status{position:relative;z-index:3;max-width:338px;background:#fff;box-shadow:0 15px 30px #343c7c22;border:1px solid #e8ecf7;border-radius:12px;padding:12px;display:flex;align-items:center;gap:10px;margin:-31px -10px 0 auto}.op-demo-status-symbol{width:34px;height:34px;border-radius:9px;background:#f0ebff;display:grid;place-items:center;color:#8150e8}.op-demo-status-symbol .icon{width:19px;height:19px}.op-demo-status>div:nth-child(2){display:grid;gap:1px}.op-demo-status small{font-size:9px;letter-spacing:.06em;color:#8a99b9;font-weight:700}.op-demo-status strong{font-size:11px;line-height:1.4;color:#263354}.op-demo-status-check{margin-left:auto;color:#17ae79;font-weight:900}
.op-demo-switch{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:22px}.op-demo-switch button{appearance:none;background:#fff;border:1px solid #e5e8f5;border-radius:100px;padding:9px 14px;color:#7984a5;font-weight:650;font-size:11px;cursor:pointer;transition:background .2s,border .2s,color .2s}.op-demo-switch button[aria-selected="true"]{color:#6b45d8;background:#f0ecff;border-color:#d8cbff}.op-demo-switch button:hover{border-color:#af95fa}.op-illustration-note{display:block;text-align:center;margin-top:10px;font-size:10px;color:#8d97b3}
/* PROOF */
.op-proof{border-top:1px solid #e9eef6;border-bottom:1px solid #e9eef6;background:#fff}.op-proof-inner{display:grid;grid-template-columns:minmax(250px,.8fr) 1.4fr;align-items:center;gap:35px;padding-block:26px}.op-proof-intro span{color:#7450de}.op-proof-intro p{font-size:13px;color:#637390;line-height:1.6;margin:6px 0 0;max-width:475px}.op-proof-names{display:flex;align-items:center;justify-content:space-around;gap:26px;flex-wrap:wrap;color:#304360;font-size:14px;font-weight:770;letter-spacing:-.025em}.op-proof-names a{display:inline-flex;align-items:center;gap:6px}.op-proof-names a:hover{color:#704be8}.op-proof-names .icon{width:13px;height:13px}
/* JOURNEY */
.op-benefits{background:#fff}.op-journey{display:grid;grid-template-columns:1fr 46px 1fr 46px 1fr;align-items:stretch;gap:6px}.op-journey-step{position:relative;background:linear-gradient(144deg,#f7faff,#fbfcff);border:1px solid #e8edf7;border-radius:17px;padding:30px 26px;min-height:250px}.op-step-symbol{display:grid;place-items:center;width:50px;height:50px;border-radius:13px;margin-bottom:28px}.op-step-symbol .icon{width:25px;height:25px}.op-step-symbol-1{background:#e6f9f0;color:#12ac79}.op-step-symbol-2{background:#eee9ff;color:#7950e6}.op-step-symbol-3{background:#e7f1ff;color:#297fe5}.op-step-index{position:absolute;top:31px;right:26px;color:#b0bbd3;font-size:12px;font-weight:800}.op-journey-step .ot-type-card-title{margin-bottom:10px}.op-journey-step .ot-type-card-copy{color:#657594}.op-journey-join{display:flex;align-items:center;justify-content:center;color:#9888e5}.op-journey-join .icon{width:24px;height:24px}
/* FEATURES */
.op-features{background:linear-gradient(#f8faff,#fafbff)}.op-feature-grid{display:grid;grid-template-columns:1.14fr .86fr;grid-template-rows:auto auto auto;gap:16px}.op-feature-card{background:#fff;border-radius:17px;border:1px solid #e8edf8;padding:28px;display:flex;flex-direction:column;min-width:0;overflow:hidden}.op-feature-card .ot-type-card-title{margin-top:20px;margin-bottom:9px}.op-feature-card .ot-type-card-copy{color:#667797;max-width:460px}.op-feature-primary{grid-row:span 3;background:linear-gradient(145deg,#efefff,#f9f8ff 52%,#fff);border-color:#e8e3fc;justify-content:space-between;min-height:575px;padding:31px}.op-feature-primary .ot-type-card-copy{max-width:520px}.op-feature-icon{display:grid;place-items:center;width:47px;height:47px;border-radius:13px;background:#f1ecff;color:#8250e8}.op-feature-icon .icon{width:25px;height:25px}.op-feature-icon.mint{background:#e8f9f1;color:#1bab7d}.op-feature-icon.blue{background:#e8f2ff;color:#2782ef}.op-feature-icon.peach{background:#fff1e8;color:#e78a44}
.op-feature-card:not(.op-feature-primary){flex-direction:row;justify-content:space-between;gap:15px;min-height:171px}.op-feature-card:not(.op-feature-primary) .ot-type-card-title{margin-top:0}.op-feature-card:not(.op-feature-primary) .op-feature-content{max-width:410px;align-self:center}.op-feature-card:not(.op-feature-primary) .op-feature-icon{margin-bottom:12px;width:34px;height:34px;border-radius:10px}.op-feature-card:not(.op-feature-primary) .op-feature-icon .icon{width:18px;height:18px}.op-feature-micro{align-self:center;flex-shrink:0;display:flex;flex-direction:column;gap:7px;min-width:145px;align-items:center}.op-feature-micro span{font-size:10px;min-width:133px;text-align:center;background:#f4f6fd;border:1px solid #e7edf6;border-radius:6px;padding:7px;color:#64708f;font-weight:700}.op-feature-micro span:last-child{background:#e9f7f0;border-color:#cdebdc;color:#3d956c}.op-feature-micro .icon{width:14px;height:14px;transform:rotate(90deg);color:#a1a5c1}
.op-ai-preview{background:#fff;box-shadow:0 16px 42px #5e569e19;border:1px solid #e5e2f4;border-radius:15px;padding:17px;margin-top:22px;transform:rotate(-1.8deg);min-height:240px}.op-ai-preview-header{font-size:10px;font-weight:800;color:#7f77a5;display:flex;align-items:center;gap:9px;padding-bottom:13px;border-bottom:1px solid #eef0f7;letter-spacing:.045em}.op-ai-preview-header span{display:flex;gap:4px}.op-ai-preview-header i{width:6px;height:6px;border-radius:50%;background:#d8d2ed}.op-ai-query{padding:17px 0}.op-ai-query span{display:inline-block;background:#f5f6fb;border-radius:8px;padding:11px 15px;font-size:12px;color:#525b78}.op-ai-answer{background:#f0eaff;border:1px solid #e8defd;border-radius:9px;display:flex;gap:11px;align-items:flex-start;padding:13px}.op-ai-answer span:first-child{font-size:10px;font-weight:850;color:#8354e5;white-space:nowrap}.op-ai-answer span:last-child{font-size:12px;line-height:1.55;color:#455273}.op-ai-tags{display:flex;gap:7px;margin-top:13px;flex-wrap:wrap}.op-ai-tags span{border-radius:30px;background:#f7f8fc;font-size:10px;color:#7982a0;padding:7px 9px}
/* USE CASES */
.op-case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.op-case{border:1px solid #e7ebf5;border-radius:17px;padding:28px;min-height:263px;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}.op-case:hover{transform:translateY(-3px);box-shadow:0 15px 35px #1c2f4b10}.op-case-icon{width:47px;height:47px;border-radius:12px;background:#f0edff;color:#7953e5;display:grid;place-items:center;margin-bottom:23px}.op-case-icon .icon{width:24px;height:24px}.op-case:nth-child(2) .op-case-icon{background:#e8f7f1;color:#1dad7c}.op-case:nth-child(3) .op-case-icon{background:#fff2e9;color:#df8b50}.op-case .ot-type-card-title{margin-bottom:10px}.op-case .ot-type-card-copy{color:#657694}.op-case-footer{margin-top:auto;display:flex;align-items:center;gap:7px;padding-top:22px;color:#3d6082;font-weight:700;font-size:12px}.op-case-footer .icon{width:14px;height:14px;color:#14ad7c}
/* DARK INTEGRATIONS */
.op-integrations{background:#0e1727;color:#fff;border-radius:17px;margin:0 clamp(12px,1.35vw,26px);overflow:hidden;position:relative}.op-integrations:before{content:"";position:absolute;width:530px;height:530px;background:radial-gradient(circle,#493aaf44,transparent 70%);top:-200px;right:0;pointer-events:none}.op-integrations-grid{padding-block:clamp(62px,6vw,105px);display:grid;grid-template-columns:.95fr 1.05fr;gap:80px;align-items:center}.op-integrations .op-eyebrow{color:#a6e8ed}.op-integrations-copy .ot-type-feature{max-width:590px}.op-integrations-copy .ot-type-intro{color:#b7c7dc;max-width:590px;margin-top:18px}.op-integrations-points{display:grid;gap:15px;margin:25px 0}.op-integrations-points span{display:flex;align-items:center;gap:10px;color:#e4efff;font-weight:600;font-size:14px}.op-integrations-points .icon{width:20px;height:20px;color:#6be4b6;flex-shrink:0}.op-integrations-note{font-size:12px;line-height:1.68;color:#99a9c2;max-width:575px}.op-integrations-visual{min-height:370px;display:grid;place-items:center;position:relative}.op-central-orbit{width:320px;height:320px;position:relative;display:grid;place-items:center}.op-orbit-ring{border:1px dashed #9da0ff48;border-radius:50%;position:absolute;inset:22px}.op-orbit-ring.ring-two{inset:0;border-style:solid;border-color:#ffffff0c}.op-orbit-core{width:136px;height:136px;border-radius:30px;background:linear-gradient(140deg,#fafaff,#dbd7ff);color:#241e48;box-shadow:0 20px 55px #06091c85;display:flex;justify-content:center;align-items:center;flex-direction:column;transform:rotate(-6deg)}.op-orbit-core .icon{width:35px;height:35px;color:#7850e6}.op-orbit-core strong{font-size:21px;font-weight:850;letter-spacing:-.05em}.op-orbit-core small{font-size:11px;color:#8159e1}.op-orbit-chip{position:absolute;background:#fff;border:1px solid #e7ecf5;box-shadow:0 12px 35px #02030d54;color:#25324e;border-radius:10px;padding:13px 16px;display:flex;align-items:center;gap:9px;font-size:12px;font-weight:750;white-space:nowrap}.op-orbit-chip .icon{width:19px;height:19px;color:#7553e1}.op-orbit-chip.chip-a{top:2px;left:-50px}.op-orbit-chip.chip-b{right:-67px;top:70px}.op-orbit-chip.chip-c{bottom:8px;left:-65px}.op-orbit-chip.chip-d{bottom:4px;right:-67px}
/* DEPLOYMENT */
.op-deployment-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(42px,7vw,120px)}.op-deployment-heading .ot-type-intro{color:var(--op-muted);margin-top:14px;margin-bottom:21px;max-width:550px}.op-deploy-steps{display:grid;gap:0}.op-deploy-row{display:grid;grid-template-columns:55px 1fr;gap:15px;padding:0 0 26px;position:relative}.op-deploy-row:not(:last-child):before{position:absolute;content:"";left:19px;top:40px;bottom:2px;width:1px;background:#e1e6f3}.op-deploy-number{display:grid;place-items:center;background:#f2edff;color:#7753df;border:1px solid #e3dafb;border-radius:12px;width:40px;height:40px;font-size:13px;font-weight:800}.op-deploy-row .ot-type-card-title{margin-bottom:7px}.op-deploy-row .ot-type-card-copy{color:#647593;max-width:620px}
/* FAQ */
.op-faq{background:#f8faff}.op-faq-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(34px,6vw,100px)}.op-faq-heading .ot-type-intro{max-width:450px;color:#657592;margin-top:13px}.op-accordion details{border-bottom:1px solid #dce4f0}.op-accordion details:first-child{border-top:1px solid #dce4f0}.op-accordion summary{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 0;cursor:pointer;color:#22314d;font-size:15px;font-weight:730;list-style:none}.op-accordion summary::-webkit-details-marker{display:none}.op-accordion summary .icon{width:20px;height:20px;flex-shrink:0;transition:transform .2s;color:#7850e7}.op-accordion details[open] summary .icon{transform:rotate(45deg)}.op-accordion details>p{padding:0 40px 23px 0;color:#647592}
/* FINAL CTA */
.op-final{border-radius:17px;margin:16px clamp(12px,1.35vw,26px) 0;background:radial-gradient(ellipse 45% 130% at 99% 100%,#38306c,transparent 70%),linear-gradient(110deg,#0d1a28,#1c224a);color:#fff;overflow:hidden}.op-final-inner{display:flex;align-items:center;justify-content:space-between;gap:40px;padding-block:clamp(48px,5vw,80px)}.op-final-kicker{display:block;color:#99e6ee;margin-bottom:11px}.op-final-inner .ot-type-feature{max-width:820px}.op-final-inner .ot-type-intro{color:#bccbe3;margin-top:16px;max-width:680px}.op-final-actions{display:grid;gap:19px;justify-items:center;flex-shrink:0}.op-final-actions .op-button{min-width:235px}.op-phone-link{display:inline-flex;align-items:center;gap:9px;color:#dce7fc;font-size:14px;font-weight:600}.op-phone-link .icon{width:19px;height:19px}.op-phone-link:hover{color:#fff}
/* MODAL */
.op-dialog{border:1px solid #e1e7f4;border-radius:19px;padding:0;max-width:620px;width:calc(100vw - 30px);max-height:min(86vh,850px);overflow:auto;box-shadow:0 24px 70px #12234256}.op-dialog::backdrop{background:#091225a6;backdrop-filter:blur(4px)}.op-dialog-inner{padding:30px 34px}.op-dialog-heading{display:flex;align-items:start;justify-content:space-between;gap:12px;margin-bottom:15px}.op-dialog-heading .ot-type-section{margin-top:7px}.op-dialog-inner>p{color:#637491;margin-bottom:20px}.op-dialog-x{width:37px;height:37px;border-radius:10px;display:grid;place-items:center;border:1px solid #e5e9f2;background:#f8f9fc;color:#28334b;cursor:pointer}.op-dialog-x .icon{width:19px;height:19px}.op-dialog-form{display:grid;gap:14px}.op-dialog-form label{display:grid;gap:7px;font-weight:700;font-size:13px;color:#344562}.op-dialog-form input,.op-dialog-form textarea{width:100%;padding:13px 15px;border:1px solid #d9e1ee;border-radius:10px;background:#fbfcff;font:inherit;font-size:14px;color:#1a2940}.op-dialog-form textarea{resize:vertical;min-height:112px}.op-dialog-form .op-button{justify-self:start}.op-dialog-phone{font-size:13px;color:#7155cf;font-weight:650}.op-dialog-note{font-size:12px;line-height:1.6;color:#7585a2;margin-top:12px!important;white-space:pre-wrap;overflow-wrap:anywhere}
.op-mobile-cta{display:none}
@keyframes opShow{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1160px){.op-hero-grid{gap:24px}.op-hero-demo{padding-inline:5px}.op-feature-micro{min-width:105px}.op-feature-micro span{min-width:110px}.op-integrations-grid{gap:35px}.op-orbit-chip.chip-a{left:-15px}.op-orbit-chip.chip-b{right:-28px}.op-orbit-chip.chip-c{left:-25px}.op-orbit-chip.chip-d{right:-30px}}
@media(max-width:970px){.op-hero-grid{grid-template-columns:1fr}.op-hero-copy{max-width:810px}.op-hero-demo{justify-self:center;width:min(100%,670px);margin-top:25px}.op-proof-inner{grid-template-columns:1fr;gap:18px}.op-proof-names{justify-content:flex-start}.op-feature-grid{grid-template-columns:1fr 1fr}.op-feature-primary{grid-column:1/-1;grid-row:auto;min-height:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:30px}.op-feature-card:not(.op-feature-primary){flex-direction:column}.op-feature-micro{flex-direction:row;align-self:start;margin-top:22px}.op-feature-micro .icon{transform:none}.op-feature-micro span{min-width:0}.op-integrations-grid{grid-template-columns:1fr}.op-integrations-visual{min-height:335px}.op-final-inner{align-items:flex-start}.op-journey{grid-template-columns:1fr;gap:10px}.op-journey-step{min-height:auto}.op-journey-join{height:30px}.op-journey-join .icon{transform:rotate(90deg)}.op-case-grid{gap:10px}}
@media(max-width:770px){.op-section-heading.op-between{display:block}.op-section-heading .op-inline-link{margin-top:15px}.op-deployment-grid,.op-faq-grid{grid-template-columns:1fr;gap:24px}.op-case-grid{grid-template-columns:1fr}.op-case{min-height:unset}.op-case-icon{margin-bottom:17px}.op-final-inner{display:block}.op-final-actions{justify-items:start;margin-top:26px}.op-page{padding-bottom:0}.op-proof-names{gap:18px}}
@media(max-width:600px){.op-hero{padding-top:19px;padding-bottom:49px}.op-crumb{margin-bottom:29px;font-size:12px}.op-hero-grid{gap:10px}.op-page .op-hero h1{margin-bottom:18px}.op-hero-actions .op-button{flex:1}.op-hero-checks{gap:9px 18px;font-size:12px}.op-hero-demo{margin-top:18px;padding-inline:0}.op-demo-body{min-height:276px;padding:15px}.op-demo-status{margin-right:-3px;max-width:280px}.op-demo-switch button{font-size:10px;padding:8px 10px}.op-illustration-note{font-size:10px}.op-proof-inner{padding-block:25px}.op-proof-names{font-size:13px;gap:12px 22px}.op-journey-step{padding:24px}.op-feature-grid{display:grid;grid-template-columns:1fr}.op-feature-primary{display:flex;grid-column:1/-1;padding:22px}.op-ai-preview{width:100%;min-height:222px}.op-feature-card:not(.op-feature-primary){min-height:unset}.op-feature-card{padding:23px}.op-feature-micro{flex-wrap:wrap}.op-case{padding:24px}.op-integrations{margin-inline:10px}.op-integrations-grid{padding-block:55px}.op-central-orbit{transform:scale(.82);width:290px;height:290px}.op-integrations-visual{min-height:290px}.op-integrations-points span{font-size:13px}.op-final{margin-inline:10px}.op-final-inner{padding-block:49px}.op-deploy-row{gap:8px}.op-dialog-inner{padding:25px 20px}.op-mobile-cta{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:32;align-items:center;justify-content:space-between;gap:10px;padding:10px max(15px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom));box-shadow:0 -4px 20px #0b1b291b;background:#fff;border-top:1px solid #e7ecf4}.op-mobile-cta>span{font-size:12px;font-weight:760;color:#263555}.op-mobile-cta button{background:#151e2e;color:#fff;border-radius:9px;border:0;padding:12px 16px;font-size:12px;font-weight:730;display:flex;align-items:center;gap:8px}.op-mobile-cta button .icon{width:16px;height:16px}.op-page + .site-footer{padding-bottom:80px}}
@media(max-width:380px){.op-hero-actions .op-button{min-height:47px;padding:0 12px}.op-hero-actions{flex-wrap:wrap}.op-hero-actions .op-button{flex-basis:100%}.op-demo-window{border-radius:14px}.op-demo-body{padding:12px}.op-chat-bubble{font-size:12px}.op-demo-toolbar{padding:11px}.op-demo-status{max-width:260px}.op-proof-names{display:grid;gap:12px}.op-feature-micro span{font-size:9px}.op-central-orbit{transform:scale(.73)}.op-integrations-visual{min-height:250px}}
@media(prefers-reduced-motion:reduce){.op-page *,.op-dialog *,.op-mobile-cta *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* PRODUCT V2 — TRUST SYSTEM, shared brand typography remains authoritative. */
.op-proof-name{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.op-proof-name .icon{width:19px;height:19px;color:#7954e7}
.op-proof-details{display:inline-flex;align-items:center;gap:7px;color:#5a37c5!important;font-weight:700;text-decoration:none;white-space:nowrap}
.op-proof-details .icon{width:16px;height:16px}
.op-trust{position:relative;background:linear-gradient(180deg,#f7f9ff 0%,#fff 100%)}
.op-trust-heading{display:grid;grid-template-columns:minmax(0,1.07fr) minmax(0,.93fr);align-items:end;gap:clamp(24px,5vw,90px);margin-bottom:34px}
.op-trust-heading .ot-type-section{max-width:790px}
.op-trust-heading .ot-type-intro{color:var(--ot-text-muted);max-width:610px}
.op-trust-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,.95fr);gap:16px}
.op-trust-project,.op-trust-method{border-radius:19px;min-height:440px;padding:clamp(22px,2.2vw,34px);position:relative;overflow:hidden}
.op-trust-project{display:flex;flex-direction:column;background:#fff;border:1px solid #e6ebf6;box-shadow:0 13px 40px #566ba112;transition:transform .2s,box-shadow .2s}
.op-trust-project:hover{transform:translateY(-3px);box-shadow:0 18px 35px #566ba11c}
.op-trust-project-1{background:radial-gradient(ellipse 90% 60% at 100% 0%,#e7fff2 0%,transparent 85%),#fff}
.op-trust-project-2{background:radial-gradient(ellipse 90% 60% at 100% 0%,#eee9ff 0%,transparent 85%),#fff}
.op-trust-project-top{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:clamp(30px,4vw,62px)}
.op-trust-project-mark{height:53px;width:53px;border-radius:14px;display:grid;place-items:center;background:#fff;border:1px solid #e5eaf2;box-shadow:0 5px 18px #1939520c}
.op-trust-project-mark .icon{width:25px;height:25px;color:#7454dc}
.op-trust-project-1 .op-trust-project-mark .icon{color:#13ad83}
.op-trust-project-type{font-size:var(--ot-eyebrow-size);font-weight:var(--ot-eyebrow-weight);letter-spacing:var(--ot-eyebrow-tracking);color:#586b88}
.op-trust-project-kicker{display:block;color:#7554dc;font-size:var(--ot-eyebrow-size);font-weight:var(--ot-eyebrow-weight);letter-spacing:var(--ot-eyebrow-tracking);margin-bottom:10px}
.op-trust-project-content{margin-bottom:24px}
.op-trust-project-content .ot-type-card-title{margin-bottom:10px}
.op-trust-project-content .ot-type-card-copy{color:var(--ot-text-muted)}
.op-trust-project-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.op-trust-project-tags span{border:1px solid #e4e9f5;background:#f8faff;padding:8px 11px;border-radius:100px;font-size:13px;font-weight:600;color:#495c7e}
.op-trust-project-link{display:inline-flex;gap:7px;align-items:center;margin-top:19px;font-weight:720;font-size:14px;color:#5b39ca;align-self:flex-start}
.op-trust-project-link .icon{width:16px;height:16px}
.op-trust-project-link:hover{color:#371ba6}
.op-trust-method{background:radial-gradient(ellipse 130% 60% at 100% 0%,#29335e,transparent 70%),linear-gradient(145deg,#111d30 0%,#141e34 100%);color:#fff;box-shadow:0 15px 36px #0712241c;display:flex;flex-direction:column}
.op-trust-method-label{font-size:var(--ot-eyebrow-size);font-weight:var(--ot-eyebrow-weight);letter-spacing:var(--ot-eyebrow-tracking);color:#a4e5e9;margin-bottom:21px}
.op-trust-method .ot-type-card-title{color:#fff;margin-bottom:26px}
.op-trust-principles{display:grid;gap:20px;margin-top:auto}
.op-trust-principle{display:flex;align-items:flex-start;gap:11px}
.op-trust-principle>span{width:35px;height:35px;flex:0 0 35px;display:grid;place-items:center;border-radius:9px;color:#8bdfd0;background:#ffffff19}
.op-trust-principle .icon{width:19px;height:19px}
.op-trust-principle strong{display:block;font-weight:700;font-size:14.5px;line-height:1.42;letter-spacing:-.017em}
.op-trust-principle p{font-size:14px;line-height:1.6;color:#c1cede;margin:4px 0 0}
.op-trust-clarifier{margin:16px 0 0!important;display:flex;gap:8px;align-items:flex-start;color:#596b89;font-size:13px;line-height:1.6;max-width:1190px}
.op-trust-clarifier .icon{width:17px;height:17px;flex:0 0 17px;margin-top:2px;color:#7653da}
.op-trust-testimonials{margin-top:32px}.op-trust-quotes{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:18px}
.op-trust-quotes figure{border-radius:14px;background:#fff;border:1px solid #e8ebf5;padding:23px;margin:0}
.op-trust-quotes blockquote{margin:0 0 14px;font-size:var(--ot-product-description-size);line-height:var(--ot-product-description-leading)}
.op-trust-quotes figcaption{font-size:13px;color:#657493}
.op-hero-generic{background:linear-gradient(140deg,#fdfdff,#f1f4ff);border:1px solid #e5e8f5;border-radius:23px;padding:30px;box-shadow:0 20px 45px #535aa81e}
.op-generic-kicker{font-size:var(--ot-eyebrow-size);font-weight:var(--ot-eyebrow-weight);letter-spacing:var(--ot-eyebrow-tracking);color:#7053d3}
.op-generic-workflow{display:grid;gap:10px;margin-top:20px}.op-generic-stage{border:1px solid #e3e7f4;background:#fff;display:flex;gap:18px;align-items:center;border-radius:12px;padding:15px 20px}
.op-generic-stage>span{background:#f1edff;border-radius:8px;padding:5px 11px;color:#684bd4;font-weight:770}
.op-generic-stage strong{font-size:16px}
@media(max-width:1150px){.op-trust-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.op-trust-method{grid-column:1/-1;min-height:auto}.op-trust-principles{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-top:0}}
@media(max-width:770px){.op-trust-heading{grid-template-columns:1fr;gap:12px}.op-trust-grid{gap:12px}.op-trust-project{min-height:405px}.op-trust-principles{grid-template-columns:1fr}}
@media(max-width:600px){.op-proof-name{font-size:14px}.op-trust-grid{grid-template-columns:1fr}.op-trust-project{min-height:340px;padding:24px}.op-trust-project-top{margin-bottom:30px}.op-trust-method{grid-column:auto;padding:27px;min-height:unset}.op-trust-clarifier{font-size:13px}.op-trust-quotes{grid-template-columns:1fr}}