:root{--okko-blue:#075cff;--okko-ink:#080b12;--okko-navy:#06132b;--okko-muted:#606778;--okko-line:#dfe3ea;--okko-white:#fff;--okko-max:1440px;--okko-radius:2px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body.okko-site{margin:0;background:#fff;color:var(--okko-ink);font-family:Manrope,Arial,sans-serif;font-size:16px;line-height:1.7;-webkit-font-smoothing:antialiased}.okko-container{max-width:var(--okko-max);padding-left:clamp(24px,4vw,72px);padding-right:clamp(24px,4vw,72px)}a{color:inherit;text-decoration:none}img{max-width:100%;height:auto}.skip-link{position:fixed;left:12px;top:-100px;background:#fff;padding:12px;z-index:9999}.skip-link:focus{top:12px}.site-header{background:rgba(255,255,255,.92);border-bottom:1px solid var(--okko-line);backdrop-filter:blur(18px)}.navbar{min-height:88px}.navbar-brand{font-size:23px;letter-spacing:-1px}.navbar-brand strong{font-weight:800}.navbar-brand span{font-weight:500}.custom-logo{width:auto;max-height:48px}.nav-link{font-size:14px;font-weight:600;color:#171a22!important;padding:12px 0!important;position:relative}.nav-link:after{content:"";position:absolute;height:2px;bottom:7px;left:0;right:100%;background:var(--okko-blue);transition:.25s}.nav-link:hover:after,.current-menu-item .nav-link:after{right:0}.navbar-toggler{border:0;padding:8px;box-shadow:none!important}.navbar-toggler span{display:block;width:24px;height:2px;background:#111;margin:6px}.btn{border-radius:var(--okko-radius);font-size:14px;font-weight:700;padding:15px 22px;transition:transform .2s,box-shadow .2s,background-color .2s}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--okko-blue);border-color:var(--okko-blue);box-shadow:0 8px 22px rgba(7,92,255,.15)}.btn-primary:hover{background:#004bd7;border-color:#004bd7}.btn-outline-dark{border-color:#111}.hero{min-height:720px;display:flex;align-items:center;overflow:hidden;border-bottom:1px solid var(--okko-line);background-image:linear-gradient(#eef1f6 1px,transparent 1px),linear-gradient(90deg,#eef1f6 1px,transparent 1px);background-size:72px 72px;background-position:calc(100% - 7vw) 0}.hero .row{min-height:720px}.hero-copy{padding-top:50px;padding-bottom:50px}.hero h1{font-size:clamp(48px,5.9vw,90px);line-height:1.02;letter-spacing:-.065em;font-weight:800;max-width:850px;margin:0 0 30px}.hero-copy>p{font-size:18px;line-height:1.65;color:#4e5563;max-width:610px;margin-bottom:34px}.product-visual{position:relative;height:560px;isolation:isolate}.visual-orbit{position:absolute;inset:9% 0 0 7%;border:1px solid rgba(7,92,255,.23);transform:rotate(-6deg)}.visual-orbit:before,.visual-orbit:after{content:"";position:absolute;width:8px;height:8px;background:var(--okko-blue)}.visual-orbit:before{left:-4px;top:-4px}.visual-orbit:after{right:-4px;bottom:-4px}.device{position:absolute;background:#f8f9fb;border:9px solid #11141c;box-shadow:0 40px 70px rgba(0,19,61,.17);overflow:hidden}.device-laptop{width:76%;height:62%;left:16%;top:17%;border-radius:12px;transform:perspective(1000px) rotateY(-5deg) rotateX(2deg)}.device-phone{width:23%;height:60%;left:3%;top:29%;border-radius:25px;z-index:3}.device-screen{height:100%;padding:7%;background:#fff}.device-screen header{height:7%;border-bottom:1px solid #e6e9ef;margin-bottom:8%;position:relative}.device-screen header:after{content:"";position:absolute;width:22%;height:5px;background:var(--okko-blue);top:0}.ui-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8% 6%}.ui-card{height:72px;border:1px solid #e1e5ed;padding:10px}.ui-card i{display:block;width:22px;height:22px;background:#e7efff;margin-bottom:8px}.ui-card b{display:block;width:65%;height:5px;background:#1b2230}.ui-chart{grid-column:1/-1;height:105px;border:1px solid #e1e5ed;position:relative;overflow:hidden}.ui-chart:after{content:"";position:absolute;width:120%;height:70%;left:-10%;top:40%;border-top:3px solid var(--okko-blue);transform:skewY(-12deg)}.phone-screen .ui-grid{grid-template-columns:1fr;gap:12px}.phone-screen .ui-card{height:58px}.phone-screen .ui-chart{height:120px}.floating-panel{position:absolute;right:0;z-index:4;background:#fff;border:1px solid #e0e5ec;box-shadow:0 20px 45px rgba(8,25,59,.12);padding:18px;width:180px}.floating-panel.top{top:11%}.floating-panel.bottom{bottom:16%}.floating-panel small{display:block;color:#667084}.floating-panel strong{font-size:20px}.blue-block{position:absolute;width:38%;height:35%;right:4%;bottom:2%;background:var(--okko-blue);z-index:-1}.proof{border-bottom:1px solid var(--okko-line);padding:30px 0}.proof .container{display:flex;align-items:center;justify-content:space-between;gap:40px}.proof p{font-size:13px;max-width:145px;line-height:1.4;margin:0}.proof-list{display:flex;flex:1;justify-content:space-around;color:#818695;font-weight:700;font-size:19px;letter-spacing:.02em}.section-pad{padding:clamp(90px,10vw,150px) 0;border-bottom:1px solid var(--okko-line)}.section-intro{padding-right:45px}.section-intro h2,.featured h2,.about h2{font-size:clamp(38px,4.3vw,66px);line-height:1.08;letter-spacing:-.055em;font-weight:800}.section-intro p,.featured p,.about p{color:var(--okko-muted)}.service-grid{border-left:1px solid var(--okko-line)}.service-item{min-height:400px;border-right:1px solid var(--okko-line);padding:16px 30px;display:flex;flex-direction:column}.service-no,.label{font-size:12px;font-weight:800;color:var(--okko-blue);text-transform:uppercase;letter-spacing:.08em}.service-item h3{font-size:20px;font-weight:750;margin:65px 0 20px}.service-item p{font-size:14px;color:var(--okko-muted);flex:1}.service-item>a{color:var(--okko-blue);font-size:24px;transition:transform .2s}.service-item:hover>a{transform:translateX(6px)}.process{background:#fafbfc}.process-track{display:grid;grid-template-columns:repeat(5,1fr);position:relative;padding-top:15px}.process-track:before{content:"";position:absolute;height:1px;background:#a9c4ff;left:4%;right:4%;top:34px}.process-step{position:relative;padding-right:20px}.process-step span{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;color:#fff;background:var(--okko-blue);font-size:12px;font-weight:800;position:relative;z-index:2}.process-step h3{font-size:15px;font-weight:800;margin-top:28px}.featured{overflow:hidden}.featured h2{max-width:650px;margin:20px 0 24px}.check-list{list-style:none;padding:0;margin:28px 0}.check-list li{margin:10px 0;color:#485061}.check-list li:before{content:"✓";color:var(--okko-blue);font-weight:800;margin-right:12px}.text-link{color:var(--okko-blue);font-weight:800}.dashboard-mock{position:relative;background:#fff;border:9px solid #11141c;border-bottom-width:18px;border-radius:14px;box-shadow:0 32px 80px rgba(8,31,75,.17);min-height:440px}.dashboard-mock:after{content:"";position:absolute;z-index:-1;width:35%;height:110%;right:-8%;top:-5%;background:var(--okko-blue)}.mock-bar{height:48px;border-bottom:1px solid var(--okko-line);display:flex;align-items:center;gap:7px;padding:0 15px}.mock-bar i{width:7px;height:7px;border-radius:50%;background:#d8dce4}.mock-bar strong{margin-left:15px;font-size:11px}.mock-body{display:grid;grid-template-columns:24% 76%;min-height:365px}.mock-body aside{border-right:1px solid var(--okko-line);padding:30px 18px;display:flex;flex-direction:column;gap:22px;font-size:10px;color:#7c8390}.mock-body aside b{background:#edf3ff;color:var(--okko-blue);padding:8px}.mock-main{display:grid;grid-template-columns:1fr 2fr;gap:20px;padding:35px}.mock-main>div:first-child{border:1px solid var(--okko-line);padding:15px}.mock-main small,.mock-main strong{display:block}.mock-main strong{font-size:26px}.chart{border:1px solid var(--okko-line);position:relative}.chart i{position:absolute;left:7%;right:7%;height:45%;top:45%;border-top:3px solid var(--okko-blue);transform:skewY(-11deg)}.mock-rows{grid-column:1/-1;display:grid;gap:9px}.mock-rows span{height:18px;background:#f0f2f6}.about-art{height:560px;background:linear-gradient(140deg,#f4f7fb 0 65%,var(--okko-blue) 65%);display:grid;place-items:center;position:relative;overflow:hidden}.about-art:before,.about-art:after{content:"";position:absolute;border:1px solid #a8c5ff;width:55%;height:65%;transform:rotate(20deg)}.about-art:after{transform:rotate(-25deg);width:35%;height:50%}.about-art span{font-size:clamp(80px,12vw,180px);font-weight:800;color:#0b1020;letter-spacing:-.12em;position:relative;z-index:2}.about h2{margin-bottom:28px}.about>p{font-size:17px}.values{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:55px}.values strong,.values span{display:block}.values strong{font-size:14px;margin-bottom:8px}.values span{font-size:12px;color:var(--okko-muted)}.cta-band{background:var(--okko-blue);color:#fff;padding:42px 0}.cta-band h2{font-size:clamp(28px,3vw,46px);font-weight:800;letter-spacing:-.04em;margin:0}.cta-band p{margin:5px 0 0;opacity:.8}.cta-band .btn{min-width:220px}.site-footer{background:var(--okko-navy);color:#fff;padding:80px 0 25px}.footer-brand{font-size:23px;display:block;margin-bottom:22px}.site-footer p,.site-footer address,.site-footer a{color:#b7c0d1;font-size:13px}.site-footer h3{font-size:13px;margin-bottom:22px}.site-footer ul{list-style:none;padding:0;margin:0}.site-footer li{margin:8px 0}.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:65px;padding-top:22px;color:#778399;font-size:11px}.page-main{padding:60px 0 120px}.page-hero{padding:80px 0;border-bottom:1px solid var(--okko-line);margin-bottom:65px;max-width:1000px}.page-hero h1{font-size:clamp(52px,7vw,100px);font-weight:800;line-height:1;letter-spacing:-.06em}.page-hero>p:not(.label){font-size:20px;color:var(--okko-muted);max-width:750px}.entry-content{max-width:900px;font-size:18px}.entry-content h2{font-size:40px;font-weight:800;margin-top:60px}.entry-content h3{font-size:26px;font-weight:750;margin-top:42px}.entry-content a{color:var(--okko-blue);text-decoration:underline}.entry-content img{margin:30px 0}.post-card{border-bottom:1px solid var(--okko-line);padding:35px 0}.post-card h2{font-size:34px;font-weight:800}.not-found{min-height:70vh;display:grid;place-items:center;text-align:center;padding:80px 0}.not-found span{font-size:100px;font-weight:800;color:var(--okko-blue)}.not-found h1{font-size:clamp(40px,6vw,80px);font-weight:800;letter-spacing:-.05em}
@media(max-width:991px){.navbar{min-height:74px}.navbar-collapse{padding:25px 0}.navbar-collapse .btn{margin-top:15px}.hero,.hero .row{min-height:auto}.hero{padding:70px 0}.product-visual{height:480px}.proof .container{align-items:flex-start;flex-direction:column}.proof-list{width:100%;flex-wrap:wrap;gap:18px;justify-content:space-between}.section-intro{margin-bottom:55px}.process-track{grid-template-columns:repeat(5,180px);overflow-x:auto;padding-bottom:20px}.dashboard-mock{margin-top:30px}.about-art{height:430px}.cta-band .btn{margin-top:25px}.service-item{min-height:320px}.site-footer .navbar-nav{align-items:flex-start!important}}
@media(max-width:767px){body.okko-site{font-size:15px}.hero h1{font-size:47px}.hero-copy>p{font-size:16px}.product-visual{height:390px;margin-top:10px}.device-laptop{width:82%;height:58%;left:14%}.device-phone{width:27%;height:57%;left:0}.floating-panel{width:135px;padding:11px}.floating-panel strong{font-size:15px}.section-pad{padding:80px 0}.service-grid{border-left:0}.service-item{border:1px solid var(--okko-line);min-height:300px;padding:25px}.service-item h3{margin-top:35px}.proof-list{font-size:15px}.dashboard-mock{min-height:310px;border-width:6px}.mock-body{min-height:260px}.mock-main{padding:15px;gap:10px}.mock-body aside{padding:15px 8px}.values{grid-template-columns:1fr}.about-art{height:320px}.page-hero{padding:45px 0}.page-hero h1{font-size:50px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* OKKO monochrome motion system */
:root{--okko-blue:#1259ff;--okko-ink:#050505;--okko-navy:#050505;--okko-muted:#565656;--okko-line:#d7d7d7}
body.okko-site{background:#fff;color:#050505}
.site-header{background:rgba(255,255,255,.94);border-color:#d8d8d8}
.nav-link:after{background:#050505}
.btn-primary{background:#050505;border-color:#050505;box-shadow:none;position:relative;overflow:hidden}
.btn-primary:before{content:"";position:absolute;inset:0;background:var(--okko-blue);transform:translateX(-102%);transition:transform .35s cubic-bezier(.2,.75,.25,1);z-index:0}
.btn-primary:hover:before,.btn-primary:focus-visible:before{transform:translateX(0)}
.btn-primary>* ,.btn-primary{isolation:isolate}.btn-primary span{position:relative;z-index:1;margin-left:8px}.btn-primary:hover{background:#050505;border-color:#050505}
.hero{background-color:#fff;background-image:linear-gradient(#ededed 1px,transparent 1px),linear-gradient(90deg,#ededed 1px,transparent 1px);background-size:88px 88px}
.hero h1{color:#050505}
.visual-orbit{border-color:#111;border-radius:50%;animation:okko-orbit 18s linear infinite}
.visual-orbit:before{background:#050505}.visual-orbit:after{background:var(--okko-blue)}
.blue-block{background:#050505;animation:okko-block-float 5s ease-in-out infinite}
.device{border-color:#050505;box-shadow:0 38px 75px rgba(0,0,0,.18);will-change:transform}
.device-laptop{animation:okko-laptop 6s ease-in-out infinite}
.device-phone{animation:okko-phone 5.2s ease-in-out infinite .35s}
.device-screen header:after,.ui-card i{background:#050505}.ui-chart:after{border-color:var(--okko-blue);animation:okko-chart 3.5s ease-in-out infinite}
.floating-panel{border-color:#111;box-shadow:10px 12px 0 rgba(0,0,0,.08);animation:okko-panel 4.5s ease-in-out infinite}
.floating-panel.bottom{animation-delay:-2s}
.proof{overflow:hidden}.proof-list{color:#050505;text-transform:uppercase;letter-spacing:.08em}
.services{background:#050505;color:#fff;border-color:#2d2d2d}
.services .section-intro p,.services .service-item p{color:#bcbcbc}
.services .service-grid,.services .service-item{border-color:#333}
.service-no{color:#fff}.service-item>a{color:#fff}.service-item{transition:background-color .35s,color .35s,transform .35s}.service-item:hover{background:#111;transform:translateY(-8px)}.service-item:hover>a{color:var(--okko-blue)}
.process{background:#fff}.process-track:before{background:#050505}.process-step span{background:#fff;border:1px solid #050505;color:#050505;transition:.3s}.process-step:hover span{background:#050505;color:#fff;transform:scale(1.12)}
.featured{background:#050505;color:#fff;border-color:#222}.featured p,.featured .check-list li{color:#bcbcbc}.featured .label,.featured .text-link,.check-list li:before{color:var(--okko-blue)}
.dashboard-mock{border-color:#fff;box-shadow:18px 18px 0 #1c1c1c}.dashboard-mock:after{background:transparent;border:1px dotted #777}.chart i{border-color:var(--okko-blue)}
.about-art{background:linear-gradient(140deg,#f1f1f1 0 65%,#050505 65%)}.about-art:before,.about-art:after{border-color:#050505;animation:okko-geo 14s linear infinite}.about-art:after{animation-direction:reverse}.about-art span{color:#050505}
.cta-band{background:#fff;color:#050505;border-top:1px solid #050505;border-bottom:1px solid #050505}.cta-band .btn-light{background:#050505;color:#fff;border-color:#050505}.cta-band .btn-light:hover{background:var(--okko-blue);border-color:var(--okko-blue);color:#fff}
.site-footer{background:#050505}.site-footer p,.site-footer address,.site-footer a{color:#c7c7c7}.footer-bottom{color:#8c8c8c}
.label{color:#050505}.featured .label{color:var(--okko-blue)}
.text-link,.entry-content a,.not-found span{color:var(--okko-blue)}
.okko-cursor-glow{position:fixed;width:220px;height:220px;border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(18,89,255,.09),transparent 68%);opacity:0;transition:opacity .25s;mix-blend-mode:multiply}
body:hover .okko-cursor-glow{opacity:1}
@keyframes okko-orbit{to{transform:rotate(354deg)}}
@keyframes okko-block-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}
@keyframes okko-laptop{0%,100%{transform:perspective(1000px) rotateY(-5deg) rotateX(2deg) translateY(0)}50%{transform:perspective(1000px) rotateY(-2deg) rotateX(1deg) translateY(-12px)}}
@keyframes okko-phone{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-18px) rotate(1deg)}}
@keyframes okko-panel{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(-8px,-13px,0)}}
@keyframes okko-chart{0%,100%{transform:skewY(-12deg) translateX(-4%)}50%{transform:skewY(-7deg) translateX(4%)}}
@keyframes okko-geo{to{transform:rotate(380deg)}}
@media(max-width:991px){.okko-cursor-glow{display:none}}
@media(prefers-reduced-motion:reduce){.visual-orbit,.blue-block,.device-laptop,.device-phone,.floating-panel,.ui-chart:after,.about-art:before,.about-art:after{animation:none!important}}