:root{--cream:#F5F1EA;--paper:#EFEAE1;--navy:#1B2A3A;--navy-d:#0F1B27;--copper:#C8722E;--ink-62:rgba(27,42,58,.62);--ink-40:rgba(27,42,58,.4);--ink-20:rgba(27,42,58,.2);--ink-12:rgba(27,42,58,.12);--c-70:rgba(245,241,234,.7);--c-40:rgba(245,241,234,.4);--c-14:rgba(245,241,234,.14);--ease:cubic-bezier(.16,1,.3,1);--pad:clamp(22px,6vw,104px);--maxw:1320px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--navy);font-family:"Manrope",system-ui,sans-serif;font-weight:450;-webkit-font-smoothing:antialiased;text-wrap:pretty;overflow-x:hidden}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.038em;line-height:.94}
p{margin:0}
a{color:var(--navy);text-decoration:none}
a:hover{color:var(--copper)}
svg{display:block}
::selection{background:var(--copper);color:#fff}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--pad)}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-40)}
.lede{font-size:clamp(16px,1.15vw,18.5px);line-height:1.65;color:var(--ink-62)}

/* cursor */
.cur{position:fixed;left:0;top:0;width:11px;height:11px;border-radius:50%;background:var(--copper);pointer-events:none;z-index:90;opacity:0;transition:opacity .4s var(--ease),transform .35s var(--ease);will-change:transform}
.cur.on{opacity:.92}
.cur.big{transform:translate(-50%,-50%) scale(3.4);opacity:.22}
@media(pointer:coarse){.cur{display:none}}

/* mark engine */
.mk{overflow:visible}
.mk .ln{stroke:var(--navy);stroke-width:2.2;stroke-linecap:round;opacity:.5;transition:stroke-width .4s var(--ease),opacity .4s var(--ease),stroke .4s var(--ease)}
.mk .nd{fill:var(--navy);transform-box:fill-box;transform-origin:center;transition:transform .5s var(--ease),fill .4s var(--ease)}
.mk .core{fill:none;stroke:var(--navy);stroke-width:2.6}
.mk .ln.hot{stroke:var(--copper);stroke-width:3.2;opacity:1}
.mk .nd.hot{fill:var(--copper);transform:scale(1.6)}
.mk[data-invert] .ln,.mk[data-invert] .core{stroke:var(--cream)}
.mk[data-invert] .nd{fill:var(--cream)}
.mk .spark{fill:var(--copper)}

/* top */
.top{position:fixed;left:0;right:0;top:0;z-index:60;height:78px;display:flex;align-items:center;gap:clamp(16px,3vw,40px);padding:0 var(--pad);transition:background .45s var(--ease),box-shadow .45s var(--ease)}
.top.stuck{background:rgba(245,241,234,.86);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--ink-12)}
.brand{display:flex;align-items:center;gap:11px}
.brand span{font-size:18.5px;font-weight:500;letter-spacing:-.022em;white-space:nowrap}
.brand span b{font-weight:800}
.top nav{margin-left:auto;display:flex;align-items:center;gap:clamp(18px,2.6vw,34px)}
.top nav a{font-size:14px;font-weight:600;color:var(--ink-62)}
.top nav a:hover{color:var(--copper)}
.top .mail{font-weight:700;color:var(--navy)}

/* hero */
.hero{min-height:100svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);align-items:center;gap:clamp(24px,5vw,80px);padding-top:104px;padding-bottom:clamp(48px,7vw,96px)}
.hero h1{font-size:clamp(54px,9.4vw,132px);letter-spacing:-.048em}
.hero .lede{margin-top:clamp(26px,3vw,40px);max-width:40ch}
.down{display:inline-flex;align-items:center;gap:12px;margin-top:clamp(34px,4vw,54px);font-size:15px;font-weight:700;padding-bottom:7px;border-bottom:1.5px solid var(--ink-12);transition:border-color .35s var(--ease),gap .35s var(--ease)}
.down:hover{border-color:var(--copper);gap:20px}
.down svg{animation:nudge 2.6s var(--ease) infinite}
@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(3px)}}
.hero-cred{display:flex;flex-wrap:wrap;gap:11px clamp(20px,2.6vw,34px);margin-top:clamp(30px,3.4vw,46px);padding-top:18px;border-top:1px solid var(--ink-12)}
.hero-cred .mono{display:flex;align-items:center;gap:9px;color:var(--ink-62)}
.hero-cred .mono::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--copper);opacity:.8;flex:0 0 auto}
.hero-mk{display:flex;justify-content:center;align-items:center}
.hero-mk svg{width:min(100%,460px);height:auto}

/* sections */
.sec{padding-top:clamp(90px,13vw,220px);padding-bottom:clamp(90px,13vw,220px)}
.sec-head{max-width:none}
.sec-head h2{font-size:clamp(30px,4.4vw,60px);margin-top:20px;max-width:19ch}
.sec-head .lede{margin-top:18px;max-width:44ch}

/* solutions: sticky mark + rows */
.sol{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(30px,6vw,110px);align-items:start}
.sol-mk{position:sticky;top:22vh;display:flex;flex-direction:column;gap:clamp(28px,4vw,52px)}
.sol-mk svg{width:min(100%,300px);height:auto}
.rows{display:flex;flex-direction:column;border-top:1px solid var(--ink-12)}
.srow{display:grid;grid-template-columns:38px 1fr;gap:clamp(14px,2vw,28px);align-items:baseline;padding:clamp(20px,2.4vw,30px) 0;border-bottom:1px solid var(--ink-12);transition:padding-left .45s var(--ease)}
.srow:hover{padding-left:14px}
.srow-n{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;color:var(--ink-40);transition:color .35s var(--ease)}
.srow:hover .srow-n{color:var(--copper)}
.srow h3{font-size:clamp(21px,2.3vw,30px);letter-spacing:-.03em}
.srow p{margin-top:9px;font-size:15px;line-height:1.6;color:var(--ink-62);max-width:44ch}

/* approach */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(22px,3vw,54px);margin-top:clamp(50px,6vw,88px)}
.step{display:flex;flex-direction:column;gap:14px;padding-top:20px;border-top:1px solid var(--ink-12)}
.step:first-child{border-top-color:var(--copper)}
.step-n{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.14em;color:var(--ink-40)}
.step:first-child .step-n{color:var(--copper)}
.step h3{font-size:clamp(22px,2.4vw,32px);letter-spacing:-.032em}
.step p{font-size:14.6px;line-height:1.6;color:var(--ink-62)}

/* quote */
.qs{background:var(--paper)}
.quote-in{max-width:26ch;margin:0 auto;text-align:center}
.quote{font-size:clamp(24px,3.4vw,50px);font-weight:800;letter-spacing:-.036em;line-height:1.14;margin:0}
.quote s{text-decoration:none;color:var(--copper)}
.byline{margin-top:clamp(30px,3.4vw,46px);display:flex;flex-direction:column;gap:7px;align-items:center}
.byline b{font-size:15px;font-weight:700}

/* contact */
.contact{position:relative;overflow:hidden;background:var(--navy-d);color:var(--cream);padding:clamp(84px,11vw,180px) 0 clamp(72px,9vw,140px)}
.contact .mono{color:var(--c-40)}
.contact .lede{color:var(--c-70)}
.contact a{color:var(--cream)}
.contact-in{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.92fr);gap:clamp(38px,6vw,104px);align-items:end}
.contact-h{font-size:clamp(32px,5.2vw,74px);letter-spacing:-.044em;max-width:15ch;margin-top:22px}
.contact-l .lede{margin-top:clamp(22px,2.4vw,32px);max-width:38ch}
.channels{display:flex;flex-direction:column}
.ch{display:grid;grid-template-columns:1fr auto;grid-template-areas:"lab lab" "val ico";row-gap:9px;column-gap:18px;align-items:center;padding:clamp(18px,2.1vw,26px) 0;border-top:1px solid var(--c-14);transition:padding-left .45s var(--ease),color .35s var(--ease)}
.channels .ch:last-child{border-bottom:1px solid var(--c-14)}
.ch .mono{grid-area:lab}
.ch b{grid-area:val;font-size:clamp(17px,1.75vw,24px);font-weight:800;letter-spacing:-.03em;line-height:1.1}
.ch svg{grid-area:ico;opacity:.45;transition:transform .45s var(--ease),opacity .35s var(--ease)}
.ch[href]:hover{padding-left:12px;color:var(--copper)}
.ch[href]:hover svg{transform:translate(5px,-5px);opacity:1}
.ch.static{color:var(--c-70)}
.contact-mk{position:absolute;right:-7%;bottom:-22%;width:min(54%,600px);height:auto;color:var(--cream);opacity:.055;pointer-events:none}

/* footer */
footer{background:var(--navy-d);color:var(--cream);padding:0 0 34px}
.foot{display:flex;flex-wrap:wrap;gap:20px 40px;align-items:center;justify-content:space-between;padding-top:30px;border-top:1px solid var(--c-14)}
.foot .mono{color:var(--c-40)}
.foot a{color:var(--c-70);font-size:14px}
.foot a:hover{color:var(--copper)}
.foot-links{display:flex;gap:clamp(16px,2.4vw,30px);flex-wrap:wrap}

/* reveal */
.rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}

@media(max-width:960px){
  .contact-in{grid-template-columns:1fr;align-items:start}
  .contact-mk{width:min(70%,420px);right:-14%;bottom:-16%}
  .hero{grid-template-columns:1fr;min-height:auto;padding-top:118px;gap:clamp(30px,6vw,56px)}
  .hero-mk{order:-1;justify-content:flex-start}
  .hero-mk svg{width:min(52%,240px)}
  .sol{grid-template-columns:1fr;gap:clamp(34px,6vw,60px)}
  .sol-mk{position:static;flex-direction:row;align-items:center;gap:28px}
  .sol-mk svg{width:min(34%,170px)}
  .steps{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .brand-x{font-size:.6em;font-weight:400}
  .brand span{font-size:15px}
  .brand .mk{width:24px;height:24px}
  .top{gap:8px;padding:0 16px}
  .top nav{gap:9px}
  .top nav a{font-size:10.5px}
  .top nav a[href="#sektorler"]{display:none}
  .partner{width:100%;gap:12px;padding:10px 12px}
  .partner-logo{width:104px;height:28px}
  .partner .mono{padding-left:12px;font-size:9.5px;letter-spacing:.1em;white-space:nowrap}
  .steps{grid-template-columns:1fr}
  .quote-in{max-width:100%;text-align:left}
  .byline{align-items:flex-start}
  .sol-mk{flex-direction:column;align-items:flex-start}
  .sol-mk svg{width:min(48%,190px)}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .rv{opacity:1;transform:none}
  .cur{display:none}
}

/* v4 additions — layered on top of site-v3.css */

/* solutions head + interactive mark side by side */
.sol-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.42fr);gap:clamp(28px,5vw,80px);align-items:center;margin-bottom:clamp(44px,5vw,76px)}
.sol-top .sec-head{max-width:none}
.sol-mk-s{display:flex;justify-content:flex-end}
.sol-mk-s svg{width:min(100%,210px);height:auto}

/* card grid (v1 structure) */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--ink-12);border:1px solid var(--ink-12)}
.card{background:var(--cream);padding:clamp(26px,2.7vw,40px);display:flex;flex-direction:column;gap:16px;transition:background .35s var(--ease),transform .35s var(--ease)}
.card:hover{background:#fff;transform:translateY(-2px)}
.card-ico{color:var(--navy);opacity:.85;transition:color .35s var(--ease),opacity .35s var(--ease)}
.card:hover .card-ico{color:var(--copper);opacity:1}
.card h3{font-size:19.5px;letter-spacing:-.02em}
.card p{font-size:14.8px;line-height:1.58;color:var(--ink-62)}

/* odoo modules — radyal sinaps düzeni */
.stage{position:relative;container-type:inline-size;max-width:880px;margin:0 auto}
.ring{position:relative;width:100%;aspect-ratio:1}
.web{position:absolute;inset:0;width:100%;height:100%}
.syn{stroke:var(--navy);stroke-width:2.2;stroke-linecap:round;opacity:.4;stroke-dasharray:420;transition:stroke-dasharray .75s var(--ease),opacity .6s var(--ease)}
.flow{stroke:var(--copper);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:5 17;opacity:.7;animation:synflow 2.6s linear infinite;transition:opacity .6s var(--ease)}
@keyframes synflow{to{stroke-dashoffset:44}}
.chaos{stroke:var(--navy);stroke-width:1.3;stroke-dasharray:4 7;fill:none;opacity:0;transition:opacity .7s var(--ease)}
.brk{stroke:var(--copper);stroke-width:2.4;stroke-linecap:round;opacity:0;transition:opacity .5s var(--ease)}
.hub{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:23cqw;min-width:130px;aspect-ratio:1}
.hub-mk,.hub-off{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.hub-mk{background:var(--cream)}
.hub-mk svg{width:84%;height:auto}
.hub-off{opacity:0;transform:scale(.86);border:1.5px dashed var(--ink-20);text-align:center;padding:12px}
.hub-off span{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-62);line-height:1.65}
.hub-off b{display:block;font-size:11px;font-weight:400;color:var(--copper);margin-bottom:6px}
.rn{position:absolute;left:50%;top:50%;width:15cqw;min-width:104px;display:flex;flex-direction:column;align-items:center;gap:11px;transform:translate(-50%,-50%) rotate(var(--a)) translate(var(--r,41cqw)) rotate(calc(-1 * var(--a)));transition:transform .8s var(--ease)}
.rn-dot{position:relative;width:10.6cqw;min-width:78px;aspect-ratio:1;border-radius:50%;background:var(--cream);border:1.5px solid var(--ink-12);display:flex;align-items:center;justify-content:center;transition:border-color .5s var(--ease),border-style .5s,background .5s var(--ease),box-shadow .5s var(--ease),transform .5s var(--ease)}
.rn-dot svg{width:23px;height:23px;color:var(--navy);opacity:.85;transition:opacity .5s var(--ease),color .4s var(--ease)}
.rn-lab{position:relative;width:100%;min-height:32px}
.rn-lab b,.rn-lab i{position:absolute;left:-6px;right:-6px;top:0;text-align:center;transition:opacity .5s var(--ease)}
.rn-lab b{font-size:11.5px;font-weight:700;line-height:1.3}
.rn-lab i{font-style:normal;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:8.5px;line-height:1.55;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-40);opacity:0}
.rn:hover .rn-dot{border-color:rgba(200,114,46,.6);box-shadow:0 10px 26px -18px rgba(15,27,39,.5);transform:scale(1.06)}
.rn:hover .rn-dot svg{color:var(--copper);opacity:1}
.stage.off .syn{stroke-dasharray:64 40;opacity:.42}
.stage.off .brk{opacity:.9}
.stage.off .ring{background:radial-gradient(circle at 50% 50%,rgba(27,42,58,.055),transparent 64%)}
.stage.off .flow{opacity:0}
.stage.off .chaos{opacity:.3}
.stage.off .hub-mk{opacity:0;transform:scale(.92)}
.stage.off .hub-off{opacity:1;transform:none}
.stage.off .rn{--r:44cqw}
.stage.off .rn-dot{background:transparent;border-style:dashed;border-color:var(--ink-20)}
.stage.off .rn-dot svg{opacity:0}
.stage.off .rn-lab b{opacity:0}
.stage.off .rn-lab i{opacity:1;color:var(--ink-62)}
.rn-dot::after{content:attr(data-alt);position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:10px;text-align:center;font-family:"JetBrains Mono",ui-monospace,monospace;font-size:9.5px;line-height:1.4;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-62);opacity:0;transition:opacity .5s var(--ease)}
.stage.off .rn-dot{width:12.8cqw;border-color:rgba(27,42,58,.3)}
.stage.off .rn-dot::after{opacity:1}
.stage.off .rn-lab{opacity:0;transition:opacity .4s var(--ease)}

.partner{display:inline-flex;align-items:center;gap:16px;padding:11px 16px;border:1px solid var(--ink-12);background:var(--cream);margin-bottom:22px}
.partner-logo{width:132px;height:34px;flex:0 0 auto}
.partner .mono{padding-left:16px;border-left:1px solid var(--ink-12)}

/* switch + caption — bölüm başlığının sağ üstünde */
.odoo-top{display:grid;grid-template-columns:minmax(0,1fr) 460px;gap:clamp(20px,4vw,56px);align-items:end;margin-bottom:clamp(36px,4.4vw,64px)}
.odoo-ctrl{display:flex;flex-direction:column;align-items:stretch;gap:14px;text-align:left;padding:18px 22px;border:1px solid var(--ink-12);background:var(--cream)}
.odoo-ctrl .switch{flex-direction:row-reverse;justify-content:space-between;width:100%;gap:16px}
.odoo-ctrl .stage-cap{max-width:none;white-space:nowrap;padding-top:13px;border-top:1px solid var(--ink-12)}
.switch{display:inline-flex;align-items:center;gap:14px;min-height:44px;cursor:pointer;user-select:none}
.switch input{position:absolute;opacity:0;width:0;height:0}
.track{position:relative;width:52px;height:28px;border-radius:999px;background:rgba(27,42,58,.14);transition:background .35s var(--ease)}
.track i{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:var(--cream);box-shadow:0 1px 3px rgba(15,27,39,.28);transition:transform .38s var(--ease)}
.switch input:checked+.track{background:var(--copper)}
.switch input:checked+.track i{transform:translateX(24px)}
.switch input:focus-visible+.track{outline:2px solid var(--copper);outline-offset:3px}
.switch-l{font-size:14.5px;font-weight:700}
.stage-cap{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-40);transition:color .4s var(--ease)}
.stage-cap.off{color:var(--copper)}
.odoo-ctrl:has(.stage-cap.off){border-color:rgba(200,114,46,.45)}

/* sectors (v1 structure) */
.sectors{display:flex;flex-direction:column;border-top:1px solid var(--ink-12);margin-top:clamp(40px,4.6vw,68px)}
.sector{display:flex;align-items:baseline;gap:clamp(16px,3vw,44px);padding:clamp(18px,2.1vw,28px) 4px;border-bottom:1px solid var(--ink-12);transition:padding-left .4s var(--ease),color .35s var(--ease)}
.sector:hover{padding-left:14px;color:var(--copper)}
.sector-n{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11.5px;letter-spacing:.12em;color:var(--ink-40);flex:0 0 auto}
.sector h3{font-size:clamp(20px,2.3vw,30px);letter-spacing:-.028em}
.sector p{margin-left:auto;font-size:14.5px;color:var(--ink-62);text-align:right;max-width:34ch}
.sector:hover p{color:inherit;opacity:.75}


@media(max-width:1080px){
  .odoo-top{grid-template-columns:1fr}
  .odoo-ctrl{max-width:460px}
}
@media(max-width:820px){
  .odoo-top{grid-template-columns:1fr}
  .odoo-ctrl{align-items:stretch;text-align:left}
}
@media(max-width:600px){
  .hub{width:34cqw;min-width:74px}
  .hub-mk svg{width:80%}
  .hub-off{padding:6px}
  .hub-off b{font-size:9px;margin-bottom:3px}
  .hub-off span{font-size:7.5px}
  .rn{width:20cqw;min-width:0;gap:6px}
  .rn-dot{width:17cqw;min-width:44px}
  .rn-dot svg{width:16px;height:16px}
  .rn-lab{min-height:22px}
  .rn-lab b{font-size:9px;line-height:1.2}
  .rn-lab i{font-size:6.5px}
  .stage.off .rn-dot{width:19cqw}
  .stage.off .rn-dot::after{font-size:7px;padding:6px;line-height:1.25}
  .stage.off .rn{--r:46cqw}
}
@media(max-width:960px){
  .sol-top{grid-template-columns:1fr}
  .sol-mk-s{justify-content:flex-start;order:-1}
  .sol-mk-s svg{width:min(38%,160px)}
  .cards{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .odoo-ctrl{max-width:none;padding:16px 18px}
  .odoo-ctrl .stage-cap{white-space:normal;font-size:10px}
  .cards{grid-template-columns:1fr}
  .sector{flex-wrap:wrap;row-gap:6px}
  .sector p{margin-left:0;text-align:left;max-width:100%;flex:1 1 100%}
}