/* OKHBOT 2.6.7: repair based on the last visually approved 2.6.5 baseline. */
/* Shared light backdrop. No oversized overlay gradients on sections or footer. */
body.ok264-home-active .site { background:#fafaff; }
.ok265-home {background:#fafaff;}
.ok265-home .ok264-logo-section { background:#fafaff; border-bottom:0; }
.ok265-home .ok265-about { background:#fafaff; }
.ok265-home .ok265-services { background:#fafaff; padding-bottom:70px; }
.ok265-home .ok264-steps-section { background:linear-gradient(180deg,#f7f6ff 0%,#f4f2ff 100%); }
body.ok264-home-active .site>.footer { background:#f4f2ff;border-top:0;box-shadow:none; }
body.ok264-home-active .site>.footer .foot-bottom {border-top:1px solid rgba(103,86,232,.11)}
/* Preserve the approved lavender + mint offer cards and real 3D visuals. */
.ok265-home .ok264-service-design {background:linear-gradient(145deg,#f0ecff,#ebe9ff)}
.ok265-home .ok264-service-website {background:linear-gradient(145deg,#e3faf7,#d8f3f4)}
/* Actual flip transition; no empty title frames. */
.ok265-claim-wrap{perspective:1000px}
.ok265-claim{transform-origin:50% 50%;animation:ok267-flip .68s cubic-bezier(.22,.8,.18,1) both}
@keyframes ok267-flip{0%{opacity:.45;transform:rotateX(-80deg) translateY(12px)}68%{opacity:1;transform:rotateX(8deg)}100%{opacity:1;transform:rotateX(0) translateY(0)}}
/* Compact creative horizontal gallery, with truly different branded artwork per service. */
.ok267-design-strip { background:#fafaff; padding:42px 0 56px;position:relative;z-index:2; }
.ok267-design-header {display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin:0 0 19px;}
.ok267-design-header h2 {font-size:clamp(31px,3.3vw,46px);line-height:1.3;color:#25223f;margin:0 0 5px;letter-spacing:-1.1px}
.ok267-design-header p {margin:0;color:#79758f;font-size:14px;line-height:1.8}
.ok267-view-all {border:1px solid #dedafb;background:#fff;color:#5d50d4;padding:11px 16px;border-radius:12px;white-space:nowrap;font-weight:800;font-size:14px;cursor:pointer}
.ok267-view-all span{margin-inline-start:7px}
.ok267-design-rail{display:flex;direction:rtl;gap:14px;overflow-x:auto;padding:2px 1px 16px;scroll-snap-type:x mandatory;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#d3cef4 transparent}
.ok267-design-preview{flex:0 0 clamp(185px,19%,240px);min-width:0;scroll-snap-align:start;padding:0;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid #e9e6f6;border-radius:17px;text-align:right;cursor:pointer;transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;box-shadow:0 8px 18px rgba(50,41,119,.035)}
.ok267-design-preview:hover,.ok267-design-preview:focus-visible{transform:translateY(-4px);border-color:#bdb6f6;box-shadow:0 16px 29px rgba(51,42,111,.11)}
.ok267-design-visual{height:158px;width:100%;position:relative;overflow:hidden;background:#edeafb}
.ok267-design-visual .ok261-portfolio-art{width:100%;height:100%;min-height:0;border-radius:0;transform:none!important;box-shadow:none;}
.ok267-design-visual .ok261-art-top{font-size:8px;padding:10px 14px}
.ok267-design-visual .ok261-art-title{font-size:clamp(26px,2.3vw,36px);line-height:1.12}
.ok267-design-visual .ok261-art-footer{font-size:8px;padding:0 12px 10px}
.ok267-design-info{padding:14px 15px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:55px}
.ok267-design-info strong{font-size:15px;font-weight:800;color:#24243e;line-height:1.45}
.ok267-design-info span{color:#6557e8;font-size:19px}
.ok267-design-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:5px}
.ok267-design-bottom>span{font-size:12px;color:#858098}
.ok267-rail-controls{display:flex;gap:8px}
.ok267-rail-controls button{width:34px;height:34px;border:1px solid #e0dcf5;background:#fff;color:#6456dc;border-radius:10px;cursor:pointer;font-size:20px}
/* No extended dead zone before footer: a shorter pinned journey on desktop. */
.ok265-home .ok264-step-track{height:155vh;min-height:960px}
.ok265-home .ok264-step-sticky{top:72px;min-height:0;height:calc(100svh - 72px);padding:28px 0;overflow:visible}
.ok265-home .ok264-steps-heading{margin-bottom:55px}
.ok265-home .ok264-step-number.is-active,.ok265-home .ok264-step-number.is-complete{background:#6655e9;color:#fff}
.ok265-home .ok264-step-card h3,.ok265-home .ok264-steps-heading h2 em{color:#6655e9}
.ok265-home .ok264-step-fill{background:#6655e9}
.ok265-home .ok264-step-card.is-active{border-color:#d4ccfa}
@media(max-width:780px){
 .ok267-design-strip{padding:28px 0 44px}
 .ok267-design-header{align-items:flex-start;flex-direction:column;gap:12px}
 .ok267-design-preview{flex-basis:clamp(190px,53%,240px)}
 .ok267-design-visual{height:148px}
 .ok265-home .ok264-step-track{height:auto;min-height:0}
 .ok265-home .ok264-step-sticky{position:relative;top:auto;height:auto;min-height:0;padding:66px 0 76px;overflow:visible}
 .ok265-home .ok264-step-card{opacity:1;transform:none}
}
@media(max-width:420px){
 .ok267-design-header h2{font-size:30px}
 .ok267-design-preview{flex-basis:74%}
 .ok267-design-visual{height:168px}
}
@media(prefers-reduced-motion:reduce){.ok265-claim{animation:none!important}.ok267-design-preview{transition:none!important}}

/* V2.6.8: creative about section, remove design strip */
.ok268-about-creative{padding:94px 0 84px;position:relative;overflow:hidden}
.ok268-about-creative::before{content:"";position:absolute;inset:0;background:
 radial-gradient(circle at 15% 20%, rgba(108,92,231,.07), transparent 28%),
 radial-gradient(circle at 88% 78%, rgba(92,199,181,.08), transparent 24%);
pointer-events:none}
.ok268-about-inner{position:relative;z-index:1}
.ok268-about-header{text-align:center;max-width:860px;margin:0 auto 38px}
.ok268-about-badge{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:999px;background:rgba(103,86,232,.08);color:#6557e8;font-weight:800;font-size:14px;margin-bottom:18px}
.ok268-about-creative h2{margin:0 0 14px;font-size:clamp(40px,4.5vw,64px);line-height:1.18;color:#24243e;letter-spacing:-1.5px}
.ok268-about-creative h2 em{color:#6557e8;font-style:normal}
.ok268-about-creative .ok265-about-lead{margin:0 auto;max-width:760px;color:#72708a;font-size:20px;line-height:1.95}
.ok268-about-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:30px}
.ok268-about-card{position:relative;background:linear-gradient(180deg,#fff 0%,#fcfbff 100%);border:1px solid rgba(103,86,232,.11);border-radius:28px;padding:28px 24px 24px;box-shadow:0 18px 34px rgba(56,44,130,.05)}
.ok268-about-card strong{display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,#6f60ee,#8c7cff);color:#fff;font-size:24px;font-weight:900;box-shadow:0 14px 24px rgba(103,86,232,.22);margin-bottom:18px}
.ok268-about-card h3{margin:0 0 10px;color:#282744;font-size:28px;line-height:1.3}
.ok268-about-card p{margin:0;color:#76738b;font-size:16px;line-height:1.9}
.ok268-about-summary{margin-top:24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ok268-about-summary>div{background:rgba(255,255,255,.58);border:1px solid rgba(103,86,232,.09);border-radius:22px;padding:18px 20px;text-align:center}
.ok268-about-summary b{display:block;color:#292844;font-size:22px;margin-bottom:6px}
.ok268-about-summary span{display:block;color:#7b7891;font-size:14px;line-height:1.8}
@media(max-width:900px){
 .ok268-about-flow,.ok268-about-summary{grid-template-columns:1fr}
 .ok268-about-creative .ok265-about-lead{font-size:18px}
}
@media(max-width:540px){
 .ok268-about-creative{padding:72px 0 64px}
 .ok268-about-creative h2{font-size:clamp(32px,10vw,48px)}
 .ok268-about-creative .ok265-about-lead{font-size:16px;line-height:1.9}
 .ok268-about-card{padding:22px 18px 18px;border-radius:24px}
 .ok268-about-card h3{font-size:24px}
}
