/* ==========================================================================
   OFA — home. A web-technology company, not a theme shop: ink throughout, one
   electric-blue accent (the logo's), hairlines and small uppercase labels. The sense of technology comes
   from interface detail (live data, depth, quiet motion), never from neon or glow.
   Loaded on the front page only, after app.css; palette.css loads after this.
   ========================================================================== */

.home{
	--ox-bg:#111318;--ox-bg-2:#16181d;--ox-navy:#191b21;--ox-deep:#1f2229;--ox-black:#0d0e11;
	--ox-panel:#1a1c21;--ox-panel-2:#22252b;--ox-chrome:#15171c;--ox-view:#101115;
	--ox-line:rgb(255 255 255 / .1);--ox-line-2:rgb(255 255 255 / .17);--ox-line-3:rgb(255 255 255 / .28);
	--ox-text:#ffffff;--ox-text-2:#ececea;--ox-text-3:#b3b5bc;
	/* Brand accent: Elektrik #005EFB for fills on the ink surfaces; copy accents and live dots use
	   lighter Elektrik derivatives, which read on the dark background. */
	--ox-accent:#005efb;--ox-accent-hover:#2b78ff;--ox-accent-deep:#0047c2;--ox-accent-rgb:0 94 251;--ox-blue-rgb:0 94 251;
	--ox-accent-text:#a9c4ff;--ox-blue-text:#a9c4ff;--ox-signal:#6f9bff;--ox-signal-rgb:111 155 255;--ox-light:#fafaf8;
	--ox-r:10px;--ox-r-sm:8px;
	background:var(--ox-bg);color:var(--ox-text)
}
.ox-num,.ox-console__now,.ox-ind__count,.ox-hero__facts dd,.ox-inspect dd{font-variant-numeric:tabular-nums}
.home ::selection{background:rgb(var(--ox-accent-rgb) / .6);color:#fff}
.home .site-main{overflow-x:clip}
.home .search-trigger span{white-space:nowrap}

/* ---------- shared atoms ---------- */
.ox-label{display:flex;align-items:center;gap:10px;margin:0 0 18px;font:500 11.5px/1.2 var(--font);letter-spacing:.08em;text-transform:uppercase;color:#b9c6de}
.ox-num{font:500 11.5px/1 var(--font);letter-spacing:.04em;color:var(--ox-blue-text)}
.ox-label .ox-num::after{content:"";display:inline-block;width:22px;height:1px;margin:0 0 3px 10px;vertical-align:middle;background:var(--ox-line-2)}
.ox-dot{display:inline-block;flex:none;width:6px;height:6px;border-radius:50%;background:var(--ox-signal);box-shadow:0 0 0 0 rgb(var(--ox-signal-rgb) / .45);animation:ox-pulse 2.4s ease-out infinite}
@keyframes ox-pulse{0%{box-shadow:0 0 0 0 rgb(var(--ox-signal-rgb) / .4)}70%{box-shadow:0 0 0 7px rgb(var(--ox-signal-rgb) / 0)}100%{box-shadow:0 0 0 0 rgb(var(--ox-signal-rgb) / 0)}}
.ox-tag{display:inline-flex;align-items:center;margin-right:8px;padding:3px 8px;border:1px solid var(--ox-line-2);border-radius:5px;font:500 11px/1.4 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ox-accent-text);vertical-align:2px}
.ox-h2{margin:0 0 16px;font-family:var(--font);font-size:clamp(1.573rem,2.21vw,2.21rem);font-weight:550;line-height:1.08;letter-spacing:-.03em;color:var(--ox-text);text-wrap:balance}
/* A two-line heading: the first line (a short list) sits on one line, a step smaller. */
.ox-h2__kicker{display:block;margin-bottom:.12em;font-size:.74em;white-space:nowrap}
@media (max-width:640px){.ox-h2__kicker{white-space:normal}}
.ox-sub{margin:0;max-width:600px;font-size:0.93rem;line-height:1.65;color:var(--ox-text-2)}
.ox-ctas{display:flex;flex-wrap:wrap;gap:10px}
.ox-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:48px;padding:0 20px;border-radius:var(--ox-r-sm);border:1px solid transparent;font:550 14px/1 var(--font);letter-spacing:-.005em;white-space:nowrap;transition:background .2s,border-color .2s,color .2s,transform .2s var(--ease)}
.ox-btn .icon{width:16px;height:16px;transition:transform .25s var(--ease)}
.ox-btn:hover .icon{transform:translateX(3px)}
.ox-btn--primary{background:var(--ox-accent);color:#fff;box-shadow:inset 0 1px 0 rgb(255 255 255 / .14),0 10px 24px -14px rgb(0 0 0 / .7);transition:background .2s,transform .2s var(--ease)}
.ox-btn--primary:hover{background:var(--ox-accent-hover);transform:translateY(-1px)}
.ox-btn--line{border-color:rgb(157 191 234 / .34);background:rgb(var(--ox-accent-rgb) / .1);color:var(--ox-text)}
.ox-btn--line:hover{border-color:rgb(157 191 234 / .6);background:rgb(var(--ox-accent-rgb) / .2)}
.ox-btn:focus-visible,.ox-icon-btn:focus-visible,.ox-link:focus-visible{outline:2px solid var(--ox-signal);outline-offset:3px}
.ox-icon-btn{display:grid;place-items:center;width:36px;height:36px;padding:0;border:1px solid var(--ox-line-2);border-radius:var(--ox-r-sm);background:none;color:var(--ox-text-2);cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.ox-icon-btn:hover{border-color:var(--ox-line-3);color:var(--ox-text);background:rgb(255 255 255 / .04)}
.ox-icon-btn .icon{width:16px;height:16px}
[data-prev] .icon{transform:scaleX(-1)}
.ox-link{display:inline-flex;align-items:center;gap:8px;font:550 13px/1 var(--font);color:var(--ox-accent-text);white-space:nowrap}
.ox-link .icon{width:15px;height:15px;transition:transform .25s var(--ease)}.ox-link:hover .icon{transform:translateX(3px)}
.ox-panel{border:1px solid rgb(176 200 248 / .28);border-radius:var(--ox-r);background:rgb(27 29 35 / .96);-webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 30px 60px -30px rgb(0 0 0 / .8)}
.ox-panel__head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0;padding:10px 14px;border-bottom:1px solid var(--ox-line);font:500 11px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:#bcc8de}

/* window chrome, shared by the hero deck and the sector preview */
.ox-win__bar{display:flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-bottom:1px solid var(--ox-line);background:var(--ox-chrome)}
.ox-win__bar i{width:8px;height:8px;border-radius:50%;background:#464a53}
.ox-win__bar em{display:inline-flex;align-items:center;gap:6px;margin:0 auto;padding:4px 12px;max-width:62%;overflow:hidden;border-radius:6px;background:rgb(255 255 255 / .05);font:400 11.5px/1 var(--font);font-style:normal;color:var(--ox-text-2);white-space:nowrap;text-overflow:ellipsis}
.ox-win__bar em .icon{width:11px;height:11px;flex:none;color:var(--ox-accent-text)}
.ox-win__bar b{display:inline-flex;align-items:center;gap:6px;font:500 11px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--ox-text-2)}

/* page entrance (no JS needed) */
@keyframes ox-rise{from{opacity:0;transform:translate3d(0,14px,0)}to{opacity:1;transform:none}}
.ox-rise{animation:ox-rise .9s var(--ease-out) var(--d,0s) both}

/* ---------- hero ---------- */
.ox-hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:min(100svh,940px);margin-top:calc(var(--head) * -1);padding:calc(var(--head) + clamp(40px,7vh,84px)) 0 clamp(48px,7vh,80px);background:radial-gradient(ellipse 70% 80% at 78% 38%,#1f2229 0%,rgb(25 27 33 / .55) 38%,transparent 70%),radial-gradient(ellipse 60% 70% at 8% 0%,#111318 0%,transparent 65%),linear-gradient(180deg,#040814 0%,#060d1d 60%,#081226 100%);overflow:clip}
.ox-hero__bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.ox-hero__grid{position:absolute;inset:0;background-image:linear-gradient(rgb(255 255 255 / .035) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .035) 1px,transparent 1px);background-size:56px 56px;background-position:-1px -1px;-webkit-mask-image:radial-gradient(ellipse 62% 70% at 70% 46%,#000 10%,transparent 78%);mask-image:radial-gradient(ellipse 62% 70% at 70% 46%,#000 10%,transparent 78%)}
.ox-hero__light{position:absolute;right:2%;top:14%;width:46%;aspect-ratio:1;background:radial-gradient(closest-side,rgb(var(--ox-accent-rgb) / .2),rgb(var(--ox-accent-rgb) / .06) 55%,transparent 75%)}
.ox-hero__bg::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .2) 30%,rgb(var(--ox-signal-rgb) / .35) 70%,transparent)}
/* data traces: hairlines on the grid with a short pulse travelling along them */
.ox-hero__trace{position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .07) 30%,rgb(255 255 255 / .07) 70%,transparent);overflow:hidden}
.ox-hero__trace::after{content:"";position:absolute;top:0;left:-18%;width:18%;height:1px;background:linear-gradient(90deg,transparent,rgb(var(--ox-signal-rgb) / .55),transparent);animation:ox-trace var(--t,9s) linear var(--td,0s) infinite}
.ox-hero__trace--1{top:calc(var(--head) + 56px * 2)}
.ox-hero__trace--2{top:calc(var(--head) + 56px * 7);--t:12s;--td:-4s}
.ox-hero__trace--3{bottom:112px;--t:15s;--td:-9s}
@keyframes ox-trace{to{left:100%}}
.ox-hero__in{display:grid;grid-template-columns:minmax(0,5.5fr) minmax(0,6.5fr);gap:clamp(32px,4vw,64px);align-items:center;width:100%}
.ox-hero__copy{min-width:0;max-width:560px}
.ox-hero__title{margin:0 0 22px;font-family:var(--font);font-size:clamp(1.785rem,2.55vw,2.592rem);font-weight:550;line-height:1.06;letter-spacing:-.032em;color:var(--ox-text);text-wrap:balance}
.ox-hero__title em{font-style:normal;white-space:nowrap;color:var(--ox-accent-text)}
.ox-hero__title sup{margin-left:1px;font-size:.38em;vertical-align:super;color:var(--ox-text-3)}
.ox-hero__lead{margin:0 0 30px;max-width:480px;font-size:0.986rem;line-height:1.6;color:var(--ox-text-2)}
.ox-hero__lead--intro{margin-bottom:14px}
.ox-hero__facts{display:grid;grid-template-columns:auto auto 1fr;margin:34px 0 0;border-top:1px solid var(--ox-line)}
.ox-hero__facts div{padding:14px 22px 0 0;margin-right:22px;border-right:1px solid var(--ox-line)}
.ox-hero__facts div:last-child{border-right:0;margin-right:0}
.ox-hero__facts dt{margin:0 0 6px;font:500 11px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:#bcc8de}
.ox-hero__facts dd{margin:0;font:550 14px/1.2 var(--font);color:var(--ox-text);white-space:nowrap}
.ox-hero__note{margin:18px 0 0;font-size:11.5px;line-height:1.6;color:var(--ox-text-2)}

/* the console: depth, live data, one quiet loop */
.ox-console{position:relative;min-width:0;--dwell:5600ms}
.ox-scene{position:relative;height:clamp(420px,38vw,540px);perspective:1800px}
.ox-deck{position:absolute;inset:13% 7% 12% 9%;transform:rotateX(calc(2deg + var(--rx,0deg))) rotateY(calc(-6deg + var(--ry,0deg)));transform-style:preserve-3d;transition:transform .8s var(--ease-out)}
.ox-win{position:absolute;inset:0;transform-origin:50% 0;margin:0;overflow:hidden;border:1px solid var(--ox-line-2);border-radius:var(--ox-r);background:var(--ox-panel);box-shadow:0 50px 90px -40px rgb(0 0 0 / .9),0 0 0 1px rgb(0 0 0 / .3);opacity:0;transform:translate3d(0,-84px,-120px) scale(.84);filter:brightness(.4);z-index:0;transition:transform 1.1s var(--ease-out),opacity .8s var(--ease-out),filter .8s var(--ease-out)}
.ox-win[data-pos="0"]{opacity:1;transform:none;filter:none;z-index:3}
.ox-win[data-pos="1"]{opacity:.75;transform:translate3d(0,-26px,-40px) scale(.95);filter:brightness(.5) saturate(.6);z-index:2}
.ox-win[data-pos="2"]{opacity:.4;transform:translate3d(0,-52px,-80px) scale(.9);filter:brightness(.4) saturate(.5);z-index:1}
.ox-win[data-pos="out"]{opacity:0;transform:translate3d(0,40px,40px) scale(1.02);z-index:4;transition-duration:.7s,.5s,.5s}
.ox-win__view{position:absolute;inset:32px 0 0;overflow:hidden;background:var(--ox-view)}
.ox-win__shot{width:100%;height:100%;object-fit:cover;object-position:top;transform:scale(1.001);transition:transform 1s var(--ease-out)}
.ox-win[data-pos="0"] .ox-win__shot{transform:translateY(-3%);transition:transform calc(var(--dwell) + 1s) linear}
.ox-win__cap{position:absolute;left:10px;right:10px;bottom:10px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 14px;border:1px solid var(--ox-line-2);border-radius:var(--ox-r-sm);background:rgb(25 27 33 / .95);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;transform:translate3d(0,10px,0);transition:opacity .3s,transform .3s var(--ease-out)}
.ox-win[data-pos="0"] .ox-win__cap{opacity:1;transform:none;transition:opacity .6s .45s,transform .7s .45s var(--ease-out)}
.ox-win__cap{left:auto;padding:0;border:0;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
.ox-win__cap span{display:none;gap:3px;min-width:0}
.ox-win__open{box-shadow:0 10px 24px -10px rgb(0 0 0 / .7)}
.ox-win__cap small{font:500 10.5px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--ox-accent-text)}
.ox-win__cap strong{font:550 14px/1.2 var(--font);color:var(--ox-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ox-win__open{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:7px;background:var(--ox-accent);color:#fff;font:550 12.5px/1 var(--font);transition:background .2s}
.ox-win__open:hover{background:var(--ox-accent-hover)}
.ox-win__open .icon{width:13px;height:13px}
.ox-win__open:focus-visible{outline:2px solid #fff;outline-offset:2px}
.ox-inspect{position:absolute;top:10%;right:0;z-index:5;width:212px}
.ox-inspect dl{margin:0;padding:6px 14px 8px}
.ox-inspect dl div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--ox-line)}
.ox-inspect dl div:last-child{border-bottom:0}
.ox-inspect dt{font:500 11px/1.3 var(--font);letter-spacing:.06em;text-transform:uppercase;color:#bcc8de}
.ox-inspect dd{margin:0;max-width:120px;overflow:hidden;font:550 12.5px/1.3 var(--font);color:var(--ox-text);text-align:right;white-space:nowrap;text-overflow:ellipsis;transition:opacity .25s}
.ox-console.is-switching .ox-inspect dd,.ox-console.is-switching [data-f="url"]{opacity:0}
.ox-log{position:absolute;left:0;bottom:4%;z-index:5;width:232px}
.ox-log [data-f="url"]{max-width:120px;overflow:hidden;text-transform:none;letter-spacing:0;color:var(--ox-text-2);white-space:nowrap;text-overflow:ellipsis;transition:opacity .25s}
.ox-log ol{margin:0;padding:8px 14px 10px;list-style:none;counter-reset:ox}
.ox-log li{position:relative;display:flex;justify-content:space-between;gap:10px;padding:6px 0 6px 20px;font:500 12.5px/1.2 var(--font);color:var(--ox-text-2);transition:color .3s}
.ox-log li::before{content:"";position:absolute;left:0;top:50%;width:10px;height:10px;margin-top:-5px;border:1px solid var(--ox-line-3);border-radius:50%;transition:background .3s,border-color .3s}
.ox-log li span{font:400 11.5px/1.2 var(--font);color:var(--ox-text-2);opacity:0;transition:opacity .3s}
.ox-log li.is-done{color:var(--ox-text)}
.ox-log li.is-done::before{background:var(--ox-accent);border-color:var(--ox-accent)}
.ox-log li.is-done span{opacity:1;color:var(--ox-accent-text)}
.ox-console__ctrl{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:18px;margin:14px 0 0 9%}
.ox-console__now{margin:0;min-width:0;overflow:hidden;font:500 11.5px/1 var(--font);letter-spacing:.04em;color:var(--ox-text-2);white-space:nowrap;text-overflow:ellipsis}
.ox-console__now b{margin-left:10px;font:550 12.5px/1 var(--font);letter-spacing:0;color:var(--ox-text-2);transition:opacity .25s}
.ox-console.is-switching .ox-console__now b{opacity:0}
.ox-console__dots{display:flex;gap:4px}
.ox-console__dots button{position:relative;width:16px;height:20px;padding:0;border:0;background:none;cursor:pointer;transition:width .5s var(--ease-out)}
.ox-console__dots button::before,.ox-console__dots button::after{content:"";position:absolute;left:0;top:9px;height:2px;border-radius:1px}
.ox-console__dots button::before{right:0;background:rgb(255 255 255 / .22)}
.ox-console__dots button:hover::before{background:rgb(255 255 255 / .36)}
.ox-console__dots button::after{width:0;background:var(--ox-accent)}
.ox-console__dots button.is-on{width:40px}
.ox-console__dots button.is-on::after{animation:ox-fill var(--dwell) linear forwards}
.ox-console.is-paused .ox-console__dots button.is-on::after{animation:none;width:100%}
.ox-console__dots button:focus-visible{outline:2px solid var(--ox-signal);outline-offset:1px;border-radius:3px}
@keyframes ox-fill{to{width:100%}}
.ox-console__nav{display:flex;gap:6px}

/* ---------- sections ---------- */
.ox-sec{position:relative;isolation:isolate;padding:clamp(80px,9vw,128px) 0;border-top:1px solid var(--ox-line);background:var(--ox-bg)}
.ox-sec--alt{background:var(--ox-bg-2)}
/* Depth by section: near-black, navy and deep blue alternate; the gradients stay broad and soft. */
#sektorler{background:radial-gradient(ellipse 50% 70% at 85% 60%,rgb(var(--ox-accent-rgb) / .12),transparent 70%),radial-gradient(ellipse 60% 60% at 0% 0%,rgb(var(--ox-accent-rgb) / .22),transparent 70%),linear-gradient(180deg,#191b21 0%,#16181d 100%)}
#ozel{background:radial-gradient(ellipse 50% 70% at 80% 50%,rgb(var(--ox-accent-rgb) / .18),transparent 70%),var(--ox-black)}
#yapay-zeka{background:radial-gradient(ellipse 60% 80% at 50% 0%,rgb(var(--ox-accent-rgb) / .14),transparent 65%),linear-gradient(180deg,#191b21 0%,#16181d 100%)}
#hizmetler{background:radial-gradient(ellipse 45% 70% at 90% 50%,rgb(var(--ox-accent-rgb) / .14),transparent 70%),#0a1328}
#nasil-calisir{background:linear-gradient(180deg,#16181d 0%,#191b21 55%,#16181d 100%)}
#ofa-care{background:radial-gradient(ellipse 55% 70% at 15% 40%,rgb(var(--ox-accent-rgb) / .1),transparent 70%),#081226}
.ox-head{max-width:720px;margin-bottom:clamp(36px,4vw,56px)}
.ox-head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;max-width:none}
.ox-head--row > div{max-width:720px}


/* 02 sectors */
.ox-ind{display:grid;grid-template-columns:minmax(0,1.22fr) minmax(0,.78fr);gap:clamp(32px,4.2vw,64px);align-items:start}
.ox-ind__side{min-width:0;width:100%;justify-self:center}
.home .ox-search{max-width:none;margin-bottom:18px;padding:5px 5px 5px 16px;border:1px solid var(--ox-line-2);border-radius:var(--ox-r);background:var(--ox-panel);box-shadow:none;color:var(--ox-text)}
.ox-search:focus-within{border-color:rgb(var(--ox-signal-rgb) / .6);box-shadow:0 0 0 3px rgb(var(--ox-accent-rgb) / .2)}
.ox-search > .icon{width:18px;height:18px;color:var(--ox-text-3)}
.ox-search input{height:42px;font-size:14px;color:var(--ox-text)}
.ox-search input::placeholder{color:var(--ox-text-3)}
.ox-search .btn{min-height:40px;padding:0 18px;border-radius:7px;border:0;background:var(--ox-accent);color:#fff}
.home .ox-search .btn:hover{background:var(--ox-accent-hover)}
.home .ox-search .finder__list{border:1px solid var(--ox-line-2);background:var(--ox-panel);color:var(--ox-text)}
.ox-ind__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px}
.ox-ind__row{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:11px 4px;border-bottom:1px solid var(--ox-line);color:var(--ox-text-2);transition:color .2s,padding .3s var(--ease-out)}
.ox-ind__row::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--ox-accent);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease-out)}
.ox-ind__row:hover,.ox-ind__row.is-on,.ox-ind__row:focus-visible{color:var(--ox-text);padding-left:10px;outline:0}
.ox-ind__row:hover::after,.ox-ind__row.is-on::after,.ox-ind__row:focus-visible::after{transform:none}
.ox-ind__icon{display:grid;color:var(--ox-text-3)}.ox-ind__icon .icon{width:16px;height:16px}
.ox-ind__row.is-on .ox-ind__icon,.ox-ind__row:hover .ox-ind__icon{color:var(--ox-accent-text)}
.ox-ind__name{font:500 13.5px/1.3 var(--font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ox-ind__count{font:400 11.5px/1 var(--font);color:var(--ox-text-3)}
/* The laptop sits on the vertical centre of the sector list (the column below the search box). */
.ox-ind__preview{align-self:stretch;display:flex;flex-direction:column;justify-content:center;padding-top:72px;justify-self:end;width:100%;max-width:470px;margin-right:calc(-1 * min(48px, max((100vw - var(--wrap)) / 2, 0px) + var(--gut) - 12px))}
/* Laptop (black MacBook), seen straight on: space-black aluminium, black glass bezel, a 16:10 panel, and a deck drawn
   in slight perspective. Light comes from above: bright top edges, darker lower edges, a soft
   contact shadow under the base. */
.ox-laptop{position:relative;padding:0 0 14px;isolation:isolate}
.ox-laptop::before{content:"";position:absolute;left:-4%;right:-4%;bottom:2px;height:30px;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgb(0 0 0 / .42),transparent);filter:blur(10px)}
.ox-laptop::after{content:"";position:absolute;left:3%;right:3%;bottom:8px;height:8px;z-index:-1;border-radius:50%;background:rgb(0 0 0 / .6);filter:blur(4px)}
.ox-laptop__lid{position:relative;width:84%;margin:0 auto;padding:3.4% 3.1% 3.9%;border-radius:15px 15px 5px 5px;background:linear-gradient(180deg,#4a4e55 0%,#2a2d32 45%,#1a1c20 100%);box-shadow:inset 0 0 0 1px rgb(255 255 255 / .1),inset 0 1px 0 rgb(255 255 255 / .18),0 1px 0 rgb(255 255 255 / .1),0 24px 40px -24px rgb(0 0 0 / .85)}
.ox-laptop__lid::before{content:"";position:absolute;inset:1.5px;border-radius:13.5px 13.5px 4px 4px;background:linear-gradient(180deg,#0e0f12,#050607 30%)}
.ox-laptop__cam{position:absolute;z-index:1;top:1.4%;left:50%;width:5px;height:5px;margin-left:-2.5px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#3a4250 0,#0d1015 60%);box-shadow:0 0 0 1px rgb(255 255 255 / .05)}
.ox-laptop__screen{position:relative;z-index:1;aspect-ratio:16/10;overflow:hidden;border-radius:2px;background:#fff;box-shadow:0 0 0 1px #000}
.ox-laptop__bar{position:absolute;inset:0 0 auto;z-index:2;display:flex;align-items:center;gap:4px;height:20px;padding:0 8px;background:#f2f4f7;border-bottom:1px solid #dde2e8}
.ox-laptop__bar i{width:6px;height:6px;border-radius:50%;background:#ff5f57}
.ox-laptop__bar i:nth-child(2){background:#febc2e}.ox-laptop__bar i:nth-child(3){background:#28c840}
.ox-laptop__bar em{display:inline-flex;align-items:center;gap:5px;margin:0 auto;padding:3px 12px;max-width:60%;overflow:hidden;border-radius:5px;background:#fff;box-shadow:0 0 0 1px #e3e7ec;font:500 9.5px/1 var(--font);font-style:normal;color:#4a5568;white-space:nowrap;text-overflow:ellipsis}
.ox-laptop__bar em .icon{width:9px;height:9px;flex:none;color:#1e8e3e}
/* Deck: the top face narrows toward the hinge (perspective), the front lip catches the light. */
.ox-laptop__base{position:relative;height:9px;margin-top:7px;border-radius:0 0 14px 14px / 0 0 9px 9px;background:linear-gradient(180deg,#3d4148 0%,#24272c 45%,#141518 100%);box-shadow:inset 0 1px 0 rgb(255 255 255 / .22)}
.ox-laptop__base::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:7px;background:linear-gradient(180deg,#1c1e22 0%,#2e3137 55%,#454a52 100%);clip-path:polygon(8% 0,92% 0,100% 100%,0 100%)}
.ox-laptop__notch{position:absolute;top:0;left:50%;width:15%;height:4px;margin-left:-7.5%;border-radius:0 0 7px 7px;background:linear-gradient(180deg,#121316,#2a2d32)}
.ox-ind__shots{position:absolute;inset:20px 0 0;background:#fff}
/* The screenshot fills the screen width; only content below the first screen is out of view. */
.ox-ind__shots img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;opacity:0;filter:saturate(1.1) contrast(1.04);image-rendering:high-quality;transition:opacity .6s var(--ease-out)}
.ox-ind__shots img.is-on{opacity:1}
.ox-ind__cap{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:center;gap:4px 10px;margin:10px 0 0;text-align:center}
.ox-ind__cap span{font:500 11px/1 var(--font);letter-spacing:.08em;text-transform:uppercase;color:var(--ox-accent-text)}
.ox-ind__cap strong{font:550 14px/1.25 var(--font);color:var(--ox-text)}
/* Autoplay: the active row's underline fills while it is on screen. */
.ox-ind__row.is-on.is-auto::after{animation:ox-ind-fill var(--ind-dwell,4200ms) linear both}
@keyframes ox-ind-fill{from{transform:scaleX(0)}to{transform:none}}

/* 03 custom + 05 infrastructure: copy beside a technical drawing */
.ox-split{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(36px,5vw,80px);align-items:center}
.ox-split--even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.ox-split__copy{min-width:0}
.ox-list{list-style:none;margin:28px 0 30px;padding:0;border-top:1px solid var(--ox-line)}
.ox-list li{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--ox-line)}
.ox-list strong{font:550 14px/1.35 var(--font);color:var(--ox-text)}
.ox-list span{font-size:13px;line-height:1.5;color:var(--ox-text-2)}
.ox-blueprint{min-width:0;border:1px solid var(--ox-line-2);border-radius:var(--ox-r);background:var(--ox-panel);overflow:hidden}
.ox-bp{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:34px 120px 96px 84px;gap:10px;padding:18px;background-image:linear-gradient(rgb(255 255 255 / .035) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .035) 1px,transparent 1px);background-size:16px 16px}
.ox-bp > span{position:relative;min-width:0;overflow:hidden;border:1px dashed rgb(255 255 255 / .2);border-radius:6px;background:rgb(255 255 255 / .015);transition:border-color .6s,background-color .6s}
.ox-bp > span > b{position:absolute;left:10px;bottom:7px;font:500 10.5px/1.2 var(--font);letter-spacing:.04em;color:var(--ox-text-3)}
.ox-bp__nav{grid-column:1/-1}
.ox-bp__nav > b{top:50%;bottom:auto!important;transform:translateY(-50%)}
.ox-bp__hero{grid-column:1/-1;border-style:solid!important;border-color:rgb(var(--ox-signal-rgb) / .45)!important;background:rgb(var(--ox-accent-rgb) / .08)!important}
.ox-bp__hero > b{color:var(--ox-accent-text)}
.ox-bp__a{grid-column:1/5}.ox-bp__b{grid-column:5/7}.ox-bp__c{grid-column:1/4}.ox-bp__d{grid-column:4/7}

/* Live plan: one layer per stage inside each box (data-s), switched by data-stage on the panel. */
.ox-bp__in{position:absolute;inset:8px 10px 24px;overflow:hidden}
.ox-bp__nav .ox-bp__in{inset:0 10px 0 34%;display:flex;align-items:center;justify-content:flex-end}
.ox-bp [data-s]{display:none}
.ox-blueprint[data-stage="0"] .ox-bp [data-s*="0"],.ox-blueprint[data-stage="1"] .ox-bp [data-s*="1"],.ox-blueprint[data-stage="2"] .ox-bp [data-s*="2"],.ox-blueprint[data-stage="3"] .ox-bp [data-s*="3"],.ox-blueprint[data-stage="4"] .ox-bp [data-s*="4"]{display:var(--d,block)}
.ox-bp__ln{font:400 10.5px/14px var(--font);font-style:normal;color:var(--ox-text-2);white-space:pre;overflow:hidden;text-overflow:ellipsis}
.ox-bp__ln i{font-style:normal}
.ox-bp__nav .ox-bp__ln{text-align:right}
.t-k{color:#8fb2ff}.t-s{color:#d8c9a3}.t-f{color:var(--ox-text-3)}
.ox-bp__ln.is-dim{color:var(--ox-text-3)}
.ox-bp__ln.is-ok{color:#bcd3f0}
.ox-bp__ln.is-file{--d:flex;gap:2px;margin:0 0 4px;font-size:9.5px;line-height:15px}
.ox-bp__ln.is-file i{padding:0 8px;border-radius:4px 4px 0 0;background:rgb(255 255 255 / .04);color:var(--ox-text-3)}
.ox-bp__ln.is-file i:first-child{background:rgb(255 255 255 / .09);color:var(--ox-text)}
.ox-bp__ln.is-live{--d:flex;align-items:center;gap:7px;font-weight:550;color:var(--ox-text)}
.ox-bp__nav .ox-bp__ln.is-live{justify-content:flex-end}
.ox-bp__ln.is-big{font-size:12.5px;line-height:20px;margin-bottom:2px}
/* Cursor while a line is typed. */
.ox-caret{display:inline-block;width:1px;height:11px;margin-left:1px;vertical-align:-1px;background:var(--ox-text);animation:ox-caret 1.05s steps(1) infinite}
@keyframes ox-caret{50%{opacity:0}}
/* Wireframe stage: grey blocks draw in. */
.ox-bp__wf{--d:flex;flex-direction:column;gap:6px}
.ox-bp__wf--row{flex-direction:row;align-items:center;justify-content:flex-end}
.ox-bp__wf--start{justify-content:flex-start}
.ox-bp__wf i{display:block;flex:none;width:var(--bw,60%);height:var(--bh,5px);border-radius:3px;background:rgb(255 255 255 / .14);transform-origin:left;animation:ox-draw .7s var(--ease-out) both;animation-delay:calc(.25s + var(--k,0) * .3s + var(--j,0) * .09s)}
.ox-bp__wf i:nth-child(2){--j:1}.ox-bp__wf i:nth-child(3){--j:2}.ox-bp__wf i:nth-child(4){--j:3}.ox-bp__wf i:nth-child(5){--j:4}
.ox-bp__wf i.is-pill{height:var(--bh,10px);border-radius:999px;background:rgb(var(--ox-accent-rgb) / .6)}
.ox-bp__wf--tiles{flex-direction:row;gap:6px}
.ox-bp__wf--tiles i{flex:1;height:38px;border-radius:4px;background:rgb(255 255 255 / .1)}
.ox-bp__wf--link{flex-direction:row;align-items:center;gap:0;padding-top:6px}
.ox-bp__wf--link i.is-node{width:28px;height:16px;border-radius:4px;background:rgb(255 255 255 / .14)}
.ox-bp__wf--link i.is-line{flex:1;height:1px;background:rgb(255 255 255 / .22)}
@keyframes ox-draw{from{opacity:0;transform:scaleX(.15)}to{opacity:1;transform:none}}
/* Development stage: a short data flow between two systems. */
.ox-bp__flow{--d:flex;align-items:center;gap:7px;margin-top:4px;font:400 10px/14px var(--font);color:var(--ox-text-3)}
.ox-bp__flow em{font-style:normal}
.ox-bp__flow i{position:relative;flex:1;height:1px;background:repeating-linear-gradient(90deg,rgb(255 255 255 / .28) 0 3px,transparent 3px 6px)}
.ox-bp__flow i::after{content:"";position:absolute;top:-2px;left:0;width:5px;height:5px;border-radius:50%;background:var(--ox-signal);animation:ox-flow 2.4s ease-in-out infinite}
@keyframes ox-flow{0%{left:0;opacity:0}15%,85%{opacity:1}100%{left:calc(100% - 5px);opacity:0}}
/* Test stage: a progress bar fills. */
.ox-bp__bar{height:3px;max-width:58%;margin-top:7px;border-radius:2px;background:rgb(255 255 255 / .08);overflow:hidden}
.ox-bp__bar i{display:block;height:100%;background:var(--ox-accent);transform-origin:left;animation:ox-fillx 3.4s .8s var(--ease) both}
@keyframes ox-fillx{from{transform:scaleX(0)}to{transform:none}}
/* Box states by stage: scanned → drawn → coded (active box lit) → passed → live. */
.ox-blueprint[data-stage="0"] .ox-bp > span{animation:ox-scan 1.8s ease calc(.3s + var(--k) * .5s) both}
@keyframes ox-scan{40%{border-color:rgb(var(--ox-signal-rgb) / .6)}}
.ox-blueprint:is([data-stage="1"],[data-stage="2"]) .ox-bp > span{border-style:solid;border-color:rgb(255 255 255 / .16)}
.ox-blueprint[data-stage="2"] .ox-bp > span.is-typing{border-color:rgb(var(--ox-signal-rgb) / .55);background:rgb(var(--ox-accent-rgb) / .06)}
.ox-blueprint[data-stage="3"] .ox-bp > span{border-style:solid;border-color:rgb(255 255 255 / .16);animation:ox-pass .6s ease calc(.5s + var(--k) * .45s) forwards}
@keyframes ox-pass{to{border-color:rgb(var(--ox-signal-rgb) / .5)}}
.ox-blueprint[data-stage="4"] .ox-bp > span{border-style:solid;border-color:rgb(var(--ox-signal-rgb) / .5);background:rgb(var(--ox-accent-rgb) / .07)}
/* Header status: working dot, then "yayınlandı". */
.ox-bp__status{display:inline-flex;align-items:center;gap:7px}
.ox-bp__status em{font-style:normal;transition:color .4s}
.ox-bp__pulse{width:6px;height:6px;border-radius:50%;background:var(--ox-accent-text);animation:ox-blink 1.6s ease-in-out infinite}
@keyframes ox-blink{50%{opacity:.25}}
.ox-blueprint.is-live .ox-bp__pulse{background:var(--ox-signal);animation:ox-pulse 2.4s ease-out infinite}
.ox-blueprint.is-live .ox-bp__status em{color:var(--ox-text)}
/* Stage bar: done, active (fills over the stage), upcoming. */
.ox-bp__steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;padding:0;list-style:none;border-top:1px solid var(--ox-line)}
.ox-bp__steps li{position:relative;padding:12px 10px 13px;border-left:1px solid var(--ox-line);font:500 11.5px/1 var(--font);color:var(--ox-text-3);text-align:center;transition:color .4s}
.ox-bp__steps li:first-child{border-left:0}
.ox-bp__steps li::before{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--ox-accent);transform:scaleX(0);transform-origin:left}
.ox-bp__steps li.is-done{color:var(--ox-text-2)}
.ox-bp__steps li.is-done::before{transform:none;opacity:.45}
.ox-bp__steps li.is-on{color:var(--ox-text)}
.ox-bp__steps li.is-on::before{animation:ox-fillx var(--bp-dwell,5s) linear both}

/* 04 AI grid: a hairline table, numbered */
.ox-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;border:1px solid var(--ox-line);border-radius:var(--ox-r);overflow:hidden;background:var(--ox-line)}
.ox-grid li{padding:28px 26px 30px;background:rgb(27 29 35 / .6);transition:background .25s}
.ox-grid li:hover{background:rgb(35 38 45 / .75)}
.ox-grid h3{margin:18px 0 8px;font:550 15px/1.3 var(--font);letter-spacing:-.01em;color:var(--ox-text)}
.ox-grid p{margin:0;font-size:13px;line-height:1.6;color:var(--ox-text-2)}
/* four cards (Dijital reklam yönetimi): one row of four on wide screens */
.ox-grid--four{grid-template-columns:repeat(4,minmax(0,1fr))}

/* 05 infrastructure stack */
.ox-stack{position:relative;list-style:none;margin:0;padding:0;display:grid;gap:8px}
.ox-stack::before{content:"";position:absolute;left:29px;top:22px;bottom:22px;width:1px;background:linear-gradient(var(--ox-line-2),var(--ox-line-2)) no-repeat,var(--ox-line);background-size:1px 0;transition:background-size 1.6s var(--ease-out) .2s}
.ox-stack.is-in::before{background-size:1px 100%}
.ox-stack li{position:relative;display:grid;grid-template-columns:24px 18px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px 16px 12px 18px;border:1px solid var(--ox-line);border-radius:var(--ox-r-sm);background:var(--ox-panel);color:var(--ox-text-3)}
.ox-stack li .ox-num{position:relative;z-index:1;display:grid;place-items:center;width:24px;height:24px;margin-left:-6px;border-radius:6px;background:#16181d;font-size:10.5px;color:var(--ox-text-3)}
.ox-stack li .icon{width:16px;height:16px}
.ox-stack strong{font:550 13.5px/1.3 var(--font);color:var(--ox-text)}
.ox-stack__state{display:inline-flex;align-items:center;gap:7px;font:400 11.5px/1 var(--font);color:var(--ox-accent-text);opacity:0;transition:opacity .4s calc(.3s + var(--i) * 90ms)}
.ox-stack.is-in .ox-stack__state{opacity:1}

/* 06 flow */
.ox-flow{--n:5;position:relative;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:20px;margin:0;padding:0;list-style:none;--p:0}
.ox-flow__line{position:absolute;left:0;right:0;top:17px;height:1px;background:var(--ox-line-2)}
.ox-flow__line span{position:absolute;inset:0;background:var(--ox-accent);transform:scaleX(var(--p));transform-origin:left}
.ox-flow__step{position:relative;z-index:1;opacity:.45;transition:opacity .6s var(--ease-out)}
.ox-flow__step.is-on{opacity:1}
.ox-flow__node{display:grid;place-items:center;width:36px;height:36px;margin-bottom:20px;border:1px solid var(--ox-line-3);border-radius:8px;background:#191b21;font:500 11.5px/1 var(--font);color:var(--ox-text-2);transition:border-color .5s,color .5s,background .5s}
.ox-flow__step.is-on .ox-flow__node{border-color:var(--ox-accent);color:var(--ox-text);background:var(--ox-accent-deep)}
.ox-flow__step h3{margin:0 0 8px;font:550 14px/1.3 var(--font);color:var(--ox-text)}
.ox-flow__step p{margin:0;max-width:230px;font-size:13px;line-height:1.6;color:var(--ox-text-2)}

/* 07 monthly packages: the copy beside the two packages */
.ox-care{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(36px,5vw,80px);align-items:center}
.ox-care__price{display:flex;align-items:baseline;gap:8px;margin:26px 0 22px}
.ox-care__price strong{font-family:var(--font);font-size:1.87rem;font-weight:550;letter-spacing:-.03em;color:var(--ox-text)}
.ox-care__price span{color:var(--ox-text-3)}
.ox-care__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--ox-line)}
.ox-care__list li{display:flex;align-items:center;gap:10px;padding:13px 0;border-bottom:1px solid var(--ox-line);font-size:13.5px;color:var(--ox-text-2)}
.ox-care__list li:nth-child(odd){padding-right:16px}
.ox-care__list .icon{flex:none;width:15px;height:15px;color:var(--ox-accent-text)}
.ox-care--packs{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.ox-packs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.ox-pack{display:block;padding:22px 22px 10px;border:1px solid var(--ox-line);border-radius:var(--ox-r);background:rgb(27 29 35 / .6);color:inherit;text-decoration:none;transition:border-color .25s,background .25s}
.ox-pack:hover{border-color:rgb(var(--ox-accent-rgb) / .55);background:rgb(35 38 45 / .75)}
.ox-pack:focus-visible{outline:2px solid var(--ox-accent-text);outline-offset:2px}
.ox-pack h3{margin:0;font:550 15px/1.3 var(--font);letter-spacing:-.01em;color:var(--ox-text)}
.ox-pack .ox-care__price{margin:8px 0 14px}
.ox-pack .ox-care__price strong{font-size:1.5rem}
.ox-pack .ox-care__list{grid-template-columns:minmax(0,1fr)}
.ox-pack .ox-care__list li{align-items:flex-start;padding:9px 0;font-size:13px;line-height:1.45}
.ox-pack .ox-care__list li:nth-child(odd){padding-right:0}
.ox-pack .ox-care__list li:last-child{border-bottom:0}
.ox-pack .ox-care__list .icon{margin-top:2px}

/* 08 final */
.ox-final{position:relative;padding:clamp(88px,10vw,140px) 0;border-top:1px solid var(--ox-line);background:radial-gradient(ellipse 60% 90% at 85% 100%,rgb(var(--ox-accent-rgb) / .22),transparent 65%),radial-gradient(ellipse 70% 90% at 20% 0%,#2a2d35 0%,transparent 70%),linear-gradient(160deg,#1f2229 0%,#16181d 55%,#081226 100%);overflow:clip;isolation:isolate}
.ox-final::before{content:"";position:absolute;inset:0;z-index:-1;background-image:linear-gradient(rgb(255 255 255 / .035) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .035) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(ellipse 60% 80% at 30% 50%,#000,transparent 75%);mask-image:radial-gradient(ellipse 60% 80% at 30% 50%,#000,transparent 75%)}
.ox-final__in{display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.ox-final__in > div:first-child{flex:1;min-width:0}
.ox-final .ox-ctas{flex:none;flex-wrap:nowrap}
.ox-final__title{margin:0;max-width:720px;font-family:var(--font);font-size:clamp(1.7rem,2.89vw,2.72rem);font-weight:550;line-height:1.06;letter-spacing:-.034em;color:var(--ox-text);text-wrap:balance}
.ox-final__lead{margin-top:16px}
.home .site-foot{border-top:1px solid var(--ox-line);background:#070e1e;color:var(--ox-text-3)}
/* Header on the home page: clear over the hero, deep navy glass once it sticks (beats palette.css). */
body.home .site-head.is-stuck,body.home .site-head.is-open{background:rgb(9 20 44 / .86);border-bottom-color:var(--ox-line)}
body.home .site-head.is-open{background:rgb(9 20 44 / .97)}

/* ---------- responsive ---------- */
@media (max-width:1180px){
	.ox-ind__list{column-gap:12px}
	.ox-ind__row{gap:7px}
	.ox-ind__name{font-size:12.5px}
	.ox-inspect{width:196px}
	.ox-log{width:216px}
}
@media (max-width:1024px){
	.ox-hero{min-height:0}
	.ox-hero__in,.ox-split,.ox-split--even,.ox-care,.ox-ind{grid-template-columns:minmax(0,1fr)}
	.ox-hero__copy{max-width:640px}
	.ox-scene{height:clamp(380px,62vw,520px)}
	.ox-ind__preview{display:none}
	.ox-ind__list{grid-template-columns:repeat(3,minmax(0,1fr))}
	.ox-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
	.ox-flow{grid-template-columns:minmax(0,1fr);gap:26px;padding-left:2px}
	.ox-flow__line{left:18px;right:auto;top:18px;bottom:18px;width:1px;height:auto}
	.ox-flow__line span{transform:scaleY(var(--p));transform-origin:top}
	.ox-flow__step{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:18px}
	.ox-flow__node{grid-row:1/3;margin:0}
	.ox-flow__step p{max-width:none}
	.ox-final__in{flex-direction:column;align-items:flex-start}
	.ox-final .ox-ctas{flex-wrap:wrap}
}
@media (max-width:640px){
	.ox-hero{padding-bottom:48px}
	.ox-hero__title{font-size:clamp(1.53rem,6.63vw,1.87rem)}
	.ox-hero__lead{font-size:0.911rem}
	.ox-ctas .ox-btn{flex:1 1 auto}
	.ox-hero__facts{grid-template-columns:1fr 1fr}
	.ox-hero__facts div:nth-child(2){border-right:0;margin-right:0}
	.ox-hero__facts div:last-child{grid-column:1/-1;border-top:1px solid var(--ox-line);margin-top:14px}
	.ox-scene{height:330px}
	.ox-log,.ox-inspect{display:none}
	.ox-deck{inset:12% 0 0;transform:none}
	.ox-win__cap{left:8px;right:8px;bottom:8px;padding:8px 8px 8px 12px;border:1px solid var(--ox-line-2);background:rgb(25 27 33 / .96)}
	.ox-win__cap span{display:grid}
	.ox-console__ctrl{margin-left:0;grid-template-columns:minmax(0,1fr) auto}
	.ox-console__dots{display:none}
	.ox-head--row{flex-direction:column;align-items:flex-start}
	.ox-ind__list{grid-template-columns:minmax(0,1fr)}
	.ox-list li{grid-template-columns:minmax(0,1fr);gap:4px}
	.ox-grid{grid-template-columns:minmax(0,1fr)}
	.ox-grid li{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:8px;padding:18px 18px 20px}
	.ox-grid li .ox-num{grid-row:1/3;padding-top:4px}
	.ox-grid h3{margin:0 0 4px}
	.ox-bp{grid-template-rows:30px 90px 74px 64px;gap:8px;padding:14px}
	.ox-bp__steps li{padding:10px 2px;font-size:10.5px}
	.ox-bp__in{inset:6px 8px 20px}
	.ox-bp__ln{font-size:9.5px;line-height:12px}
	.ox-bp__ln.is-file{margin-bottom:2px;line-height:13px}
	.ox-bp__ln.is-big{font-size:11.5px;line-height:16px}
	.ox-bp > span > b{left:8px;bottom:5px;font-size:9.5px}
	.ox-bp__wf--tiles i{height:26px}
	.ox-care__list{grid-template-columns:minmax(0,1fr)}
	.ox-packs{grid-template-columns:minmax(0,1fr)}
	.ox-care__list li:nth-child(odd){padding-right:0}
	.ox-ctas .ox-btn,.ox-final .ox-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){
	.ox-rise,.ox-dot,.ox-hero__trace::after,.ox-ind__row.is-on.is-auto::after,.ox-bp > span,.ox-bp__wf i,.ox-bp__flow i::after,.ox-bp__bar i,.ox-caret,.ox-bp__pulse,.ox-bp__steps li::before{animation:none}
	.ox-win,.ox-win__shot,.ox-deck{transition-duration:.01s}
	.ox-stack::before{transition:none;background-size:1px 100%}.ox-stack__state{transition:none;opacity:1}
}

/* ---------- One continuous ink canvas: sections flow into each other ----------
   The page is one ink surface; the sections themselves are transparent and carry no edge
   lines. A fixed layer of soft electric-blue light drifts very slowly (90 s) over it. No glow
   on content, no neon. */
.home{background:linear-gradient(180deg,#0e1013 0%,#111318 10%,#111318 88%,#0c0d10 100%)}
.home::before{content:"";position:fixed;inset:-25%;z-index:-1;pointer-events:none;background:
	radial-gradient(32% 28% at 28% 32%,rgb(0 94 251 / .07),transparent 70%),
	radial-gradient(28% 26% at 74% 64%,rgb(0 94 251 / .08),transparent 70%),
	radial-gradient(26% 22% at 50% 92%,rgb(255 255 255 / .03),transparent 70%);
	animation:ox-ambient 90s ease-in-out infinite alternate;will-change:transform}
@keyframes ox-ambient{0%{transform:translate3d(-4%,-3%,0) scale(1)}50%{transform:translate3d(3%,2%,0) scale(1.06)}100%{transform:translate3d(5%,-2%,0) scale(1.02)}}
.home .ox-sec,.home .ox-sec--alt,.home #sektorler,.home #ozel,.home #yapay-zeka,.home #hizmetler,.home #nasil-calisir,.home #ofa-care{background:transparent;border-top-color:transparent}
/* Hero and final call keep their own light, but only as pools that fade out inside the section. */
.home .ox-hero{background:radial-gradient(ellipse 60% 70% at 78% 40%,rgb(0 94 251 / .16) 0%,rgb(0 94 251 / .05) 40%,transparent 70%),radial-gradient(ellipse 60% 70% at 8% 0%,rgb(255 255 255 / .04) 0%,transparent 65%)}
.home .ox-hero__bg::after{display:none}
.home .ox-final{background:radial-gradient(ellipse 50% 60% at 75% 55%,rgb(var(--ox-accent-rgb) / .14),transparent 70%),radial-gradient(ellipse 55% 60% at 22% 45%,rgb(255 255 255 / .04),transparent 70%);border-top-color:transparent}
@media (prefers-reduced-motion:reduce){.home::before{animation:none}}

/* Readability: header links at full white on the home page (no glow). */
.home .site-head .nav__link{opacity:1;color:#fff}
.home .site-head .nav__link:hover{background:rgb(255 255 255 / .08)}