/* ASoftware v3 — ortak stiller (ana sayfa, projeler, proje detay, tarihçe) */
:root{
  --bg:#0b0c10; --bg2:#12131a; --bg3:#181a22; --line:rgba(226,232,255,.09); --line2:rgba(226,232,255,.18);
  --tx:#eef0f6; --mu:#a3a7b6; --di:#6c7080;
  --ac:#6b8cff; --ac2:#38c6f4;
  --acg:linear-gradient(100deg,#7a7cff 0%,#4f9dff 55%,#38c6f4 100%);
  --serif:'Instrument Serif',Georgia,serif; --sans:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif; --mono:'Geist Mono',ui-monospace,Consolas,monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);scroll-behavior:smooth;scroll-padding-top:76px}
body{background:var(--bg);color:var(--tx);font:16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.w{max-width:1240px;margin:0 auto;padding:0 32px}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:.02em;color:var(--di)}
.gt{background:var(--acg);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em;margin-right:-.06em}
.it{font-style:italic}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:48px;padding:0 22px;border:1px solid var(--line2);border-radius:999px;font-size:15px;font-weight:500;white-space:nowrap;transition:border-color .2s,background .2s,transform .2s}
.btn:hover{border-color:rgba(143,176,255,.6)}
.btn.solid{background:var(--acg);border-color:transparent;color:#fff;font-weight:600}
.btn.solid:hover{transform:translateY(-1px)}
.btn.sm{height:40px;padding:0 16px;font-size:14px}
.arr{color:#8fb0ff}

/* logo rozeti: logo her yerde siyah yuvarlak içinde */
.logo-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#000;border:1px solid rgba(255,255,255,.14);flex:none;overflow:hidden}
.logo-badge img{width:74%;height:74%;object-fit:contain}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(11,12,16,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.site-header .w{display:flex;align-items:center;height:76px;gap:40px}
.site-header .brand{display:flex;align-items:center;gap:12px;font-weight:600;letter-spacing:-.01em}
.site-header .brand .logo-badge{width:50px;height:50px}
.wordmark{font:600 26px/1 var(--sans);letter-spacing:-.02em;color:var(--tx);display:inline-flex;align-items:baseline;white-space:nowrap}
.wordmark b{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.72em;line-height:.7;margin-right:.01em;background:var(--acg);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em}
.site-nav{display:flex;gap:30px;font-size:15px;color:var(--mu);margin-left:auto}
.site-nav a:hover,.site-nav a.on{color:var(--tx)}
.site-header .btn{height:42px;font-size:14.5px}
.menu-btn{display:none;margin-left:auto;background:none;border:1px solid var(--line2);color:var(--tx);height:40px;padding:0 14px;border-radius:999px;font:500 14px var(--sans)}
.mobile-menu{display:none}

/* bölüm başlığı */
.sh{display:flex;align-items:end;justify-content:space-between;gap:40px;padding:120px 0 44px}
.sh h2{font-family:var(--serif);font-weight:400;font-size:76px;line-height:.95;letter-spacing:-.015em}
.sh p{max-width:420px;color:var(--mu);font-size:16px}

/* HERO: ekran yüksekliğine tam sığar; ölçüler vh ile ölçeklenir */
.hero{--hh:calc(100svh - 76px);position:relative;height:var(--hh);min-height:540px;max-height:1000px;display:flex;align-items:center;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(700px 520px at 78% 50%, rgba(79,140,255,.10), transparent 70%)}
.hero .w{width:100%;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;position:relative;z-index:1}
.kicker{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:13px;color:var(--mu);padding:7px 14px;border:1px solid var(--line2);border-radius:999px}
.kicker i{width:7px;height:7px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 3px rgba(61,220,132,.18)}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(56px,min(13.5vh,8.6vw),124px);line-height:.92;letter-spacing:-.025em;margin-top:clamp(14px,2.6vh,28px)}
.hero h1 em{font-style:italic}
.hero p.lead{margin-top:clamp(14px,2.6vh,28px);max-width:540px;font-size:clamp(16px,2.4vh,19px);line-height:1.55;color:var(--mu)}
.hero p.lead b{color:var(--tx);font-weight:500}
.hero .ctas{display:flex;gap:12px;margin-top:clamp(16px,3.2vh,34px);flex-wrap:wrap}
.hero .facts{display:flex;gap:40px;margin-top:clamp(18px,4vh,52px);padding-top:clamp(12px,2.2vh,24px);border-top:1px solid var(--line);max-width:540px}
.hero .facts b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(30px,5vh,44px);line-height:1}
.hero .facts span{font-size:13.5px;color:var(--mu)}
.hero .scroll-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:2;font-family:var(--mono);font-size:12px;color:var(--di);display:flex;flex-direction:column;align-items:center;gap:6px}
.hero .scroll-hint i{width:1px;height:26px;background:linear-gradient(var(--line2),transparent);animation:hint 2.2s ease-in-out infinite}
@keyframes hint{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}
/* yörünge: boyutu hero yüksekliğine göre, uydular yüzdeyle konumlanır */
.orbit{--o:min(560px,calc(var(--hh) - 90px),40vw);position:relative;width:var(--o);height:var(--o);justify-self:center}
.orbit .ring{position:absolute;border-radius:50%;border:1px solid var(--line2)}
.orbit .r1{inset:0;border-color:rgba(107,140,255,.22)}
.orbit .r2{inset:16%;border:1.5px solid rgba(107,140,255,.55);box-shadow:inset 0 0 0 1px rgba(56,198,244,.15)}
.orbit .core{position:absolute;inset:26.8%;border-radius:50%;background:#000;border:1px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 14px rgba(0,0,0,.35)}
.orbit .core img{width:66%}
.orbit .spin{position:absolute;inset:0;animation:orbit 90s linear infinite}
.orbit .sat{position:absolute;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:18px;background:var(--bg2);border:1px solid var(--line2);display:flex;align-items:center;justify-content:center;box-shadow:0 14px 30px rgba(0,0,0,.4);animation:orbit 90s linear infinite reverse}
.orbit .sat img{width:44px;height:44px;border-radius:10px}
.orbit .sat:hover{border-color:rgba(143,176,255,.7)}
@keyframes orbit{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.orbit .spin,.orbit .sat,.lane,.hero .scroll-hint i{animation:none!important}}

/* yumuşak bölüm geçişi: yalnızca bölüm başına yakın bırakılırsa oraya oturur, zorlamaz */
html.snap{scroll-snap-type:y proximity}
html.snap .hero,html.snap .slider,html.snap main > section{scroll-snap-align:start}

/* SLIDER */
.slider{padding-top:24px}
.slider .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.slider .viewport{overflow:hidden;border-radius:22px}
.slider .track{display:flex;gap:20px;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.slider .slide{flex:none;width:88%;border-radius:22px;overflow:hidden;border:1px solid var(--line2);background:var(--bg2);transition:opacity .4s}
.slider .slide:not(.on){opacity:.45}
.slider .slide img{display:block;width:100%;height:auto}
.ctrl{display:flex;align-items:center;gap:10px}
.ctrl button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line2);background:transparent;color:var(--tx);font-size:16px;cursor:pointer}
.ctrl button:hover{border-color:rgba(143,176,255,.6)}
.dots{display:flex;gap:6px;margin-right:10px}
.dots i{width:7px;height:7px;border-radius:999px;background:var(--line2);cursor:pointer;transition:width .3s}
.dots i.on{width:24px;background:var(--acg)}

/* ÜRÜNLER */
.serveo{background:linear-gradient(180deg,#131626,#0f111a);border:1px solid rgba(107,140,255,.22);border-radius:28px;display:grid;grid-template-columns:1fr 1.25fr;gap:40px;padding:56px 0 0 56px;overflow:hidden}
.serveo .badge{display:inline-flex;gap:10px;align-items:center;font-family:var(--mono);font-size:12.5px;color:#c2d0ff;background:rgba(107,140,255,.12);border:1px solid rgba(107,140,255,.3);padding:6px 12px 6px 6px;border-radius:999px}
.serveo .badge img{height:20px;width:20px;border-radius:50%}
.serveo h3{font-family:var(--serif);font-weight:400;font-size:96px;line-height:.9;margin-top:24px}
.serveo p{color:var(--mu);font-size:17.5px;margin-top:22px;max-width:440px}
.serveo .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px;max-width:470px}
.serveo .chips span{font-size:13.5px;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.04);border:1px solid var(--line2);color:#dfe3f0}
.serveo .links{display:flex;gap:12px;margin:34px 0 56px;flex-wrap:wrap}
.serveo .shots{position:relative;align-self:end}
.serveo .desk{border-radius:14px 0 0 0;overflow:hidden;border:1px solid var(--line2);border-right:0;border-bottom:0}
.serveo .desk img{display:block;width:100%}
.serveo .phone{position:absolute;left:-60px;bottom:28px;width:200px;border-radius:30px;background:#000;padding:7px;border:1px solid var(--line2);box-shadow:0 30px 70px rgba(0,0,0,.6)}
.serveo .phone img{display:block;width:100%;border-radius:24px;aspect-ratio:9/18.5;object-fit:cover;object-position:top}
.prods{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:20px}
.prod{background:var(--bg2);border:1px solid var(--line);border-radius:24px;overflow:hidden;display:block;transition:border-color .2s,transform .2s}
.prod:hover{border-color:rgba(143,176,255,.45);transform:translateY(-2px)}
.prod .vis{height:280px;overflow:hidden;position:relative;border-bottom:1px solid var(--line);background:#10121a}
.prod .vis img.ss{position:absolute;left:36px;top:36px;width:calc(100% - 36px);border-radius:10px 0 0 0;border:1px solid var(--line2)}
.prod .body{padding:24px 28px 28px;display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:start}
.prod .body img{width:46px;height:46px}
.prod h4{font-size:20px;font-weight:600}
.prod p{color:var(--mu);font-size:15px;margin-top:4px}
.prod .tag{font-family:var(--mono);font-size:12.5px;color:var(--di);padding-top:4px}
.v-askilit{background:linear-gradient(#17233b,#101a2c)!important}
.v-askilit .lock{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;gap:34px}
.v-askilit .lock img{width:140px}
.v-askilit .lock ul{list-style:none;font-size:15px;color:#cfdcff;min-width:190px}
.v-askilit .lock li{padding:6px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.v-code pre{position:absolute;left:36px;top:36px;right:0;font:14.5px/1.75 var(--mono);color:#d8dcef;background:#141621;border:1px solid var(--line2);border-right:0;border-radius:10px 0 0 0;padding:22px 26px;white-space:pre}
.v-code .k{color:#8fb0ff}.v-code .s{color:#7fe0c8}.v-code .c{color:#5d6380}

/* şerit */
.ticker{margin-top:120px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:24px 0}
.lane{display:flex;width:max-content;animation:slide 45s linear infinite}
.lane span{font-family:var(--serif);font-style:italic;font-size:52px;line-height:1;padding:0 26px;white-space:nowrap}
.lane span:nth-child(even){font-family:var(--sans);font-style:normal;font-size:26px;color:var(--ac2);padding:0 4px;align-self:center}
@keyframes slide{to{transform:translateX(-50%)}}

/* PROJE KARTLARI (ana sayfa + projeler sayfası) */
.tools{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills button{font:14px var(--sans);padding:7px 14px;border-radius:999px;border:1px solid var(--line2);color:var(--mu);background:none;cursor:pointer}
.pills button b{font-family:var(--mono);font-weight:400;font-size:12px;margin-left:6px;color:var(--di)}
.pills button.on{background:var(--tx);color:var(--bg);border-color:var(--tx)}
.pills button.on b{color:#555a6a}
.tools .right{display:flex;gap:10px;align-items:center}
.search{height:38px;width:220px;border-radius:999px;border:1px solid var(--line2);background:transparent;color:var(--tx);padding:0 16px;font:14px var(--sans)}
.search::placeholder{color:var(--di)}
.view{display:flex;border:1px solid var(--line2);border-radius:12px;overflow:hidden}
.view button{width:40px;height:36px;display:flex;align-items:center;justify-content:center;color:var(--di);font-size:15px;background:none;border:0;cursor:pointer}
.view button.on{background:var(--bg3);color:var(--tx)}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pcard{background:var(--bg2);border:1px solid var(--line);border-radius:18px;padding:20px 20px 18px;display:flex;flex-direction:column;gap:12px;transition:border-color .2s,transform .2s}
.pcard:hover{border-color:rgba(143,176,255,.45);transform:translateY(-2px)}
.pcard .top{display:flex;gap:14px;align-items:center}
.pcard .top img{width:46px;height:46px;flex:none;border-radius:12px;object-fit:contain}
.pcard h4{font-size:16.5px;font-weight:600;line-height:1.25}
.pcard .st{font-family:var(--mono);font-size:11.5px;color:var(--di);margin-top:2px}
.pcard p{font-size:14px;color:var(--mu);line-height:1.5;flex:1}
.pcard .bot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:12px;border-top:1px solid var(--line)}
.pcard .tags{font-family:var(--mono);font-size:12px;color:var(--di);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge-st{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:11.5px;padding:3px 9px;border-radius:999px;border:1px solid rgba(107,140,255,.4);color:#b4c6ff;white-space:nowrap}
.badge-st i{width:6px;height:6px;border-radius:50%;background:#6b8cff}
.badge-st.active i{background:#3ddc84}.badge-st.paused i{background:#f5b84a}.badge-st.stopped i{background:#f0616d}
.pgrid.list{grid-template-columns:1fr;gap:0;border-top:1px solid var(--line2)}
.pgrid.list .pcard{flex-direction:row;align-items:center;border-radius:0;border:0;border-bottom:1px solid var(--line);background:none;padding:16px 4px;gap:24px}
.pgrid.list .pcard:hover{transform:none;background:rgba(255,255,255,.02)}
.pgrid.list .pcard .top{width:330px;flex:none}
.pgrid.list .pcard p{flex:1}
.pgrid.list .pcard .bot{border:0;padding:0;width:330px;flex:none}
.pmore{display:flex;justify-content:center;margin-top:28px}
.empty{display:none;text-align:center;color:var(--mu);padding:40px 0}

/* HİZMETLER */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svc > div{background:var(--bg2);border:1px solid var(--line);border-radius:24px;padding:34px 32px 30px}
.svc .num{font-family:var(--serif);font-size:72px;line-height:.8}
.svc h4{font-family:var(--serif);font-weight:400;font-size:36px;line-height:1.05;margin-top:30px}
.svc p{color:var(--mu);font-size:15.5px;margin-top:14px}
.svc ul{list-style:none;margin-top:22px;border-top:1px solid var(--line)}
.svc li{padding:11px 0;border-bottom:1px solid var(--line);font-size:15px;display:flex;justify-content:space-between}
.svc li::after{content:"→";color:var(--di)}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:20px}
.steps div{border:1px dashed var(--line2);border-radius:18px;padding:20px 22px}
.steps b{display:block;font-weight:600;font-size:16px;margin-top:6px}
.steps span{font-size:14px;color:var(--mu)}

/* TARİHÇE (yatay, ana sayfa) */
.history{position:relative;overflow:hidden}
.history .big22{position:absolute;right:-40px;top:-30px;font-family:var(--serif);font-size:360px;line-height:.8;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1px rgba(107,140,255,.14);pointer-events:none;z-index:0}
.history .sh,.history .tline,.history .note{position:relative;z-index:1}
.history .sh p{background:var(--bg);padding:6px 0 6px 12px}
.tline{display:grid;grid-template-columns:repeat(var(--n,6),1fr);position:relative;margin-top:10px}
.tline::before{content:"";position:absolute;left:0;right:0;top:136px;height:1px;background:linear-gradient(90deg,rgba(107,140,255,.6),rgba(56,198,244,.6) 85%,transparent)}
.ev{padding-right:22px;position:relative}
.ev .d{font-family:var(--serif);font-size:104px;line-height:1;height:104px;display:inline-block}
.ev .m{font-family:var(--mono);font-size:13px;color:var(--mu);margin-top:4px}
.ev .dot{width:11px;height:11px;border-radius:50%;background:var(--bg);border:2px solid var(--ac);margin:6px 0 22px;position:relative;z-index:1}
.ev h4{font-size:17px;font-weight:600}
.ev p{font-size:14.5px;color:var(--mu);margin-top:6px}
.ev.future .d{color:var(--di);font-size:64px;line-height:104px}
.ev.future .dot{border-style:dashed;border-color:var(--di)}
.history .note{display:flex;justify-content:space-between;align-items:center;margin-top:44px;padding:20px 24px;border:1px solid var(--line2);border-radius:18px;background:var(--bg2)}
.history .note b{font-family:var(--serif);font-weight:400;font-size:28px}

/* HAKKINDA */
.about{display:grid;grid-template-columns:440px 1fr;gap:64px;align-items:center}
.about .ph{border-radius:28px;overflow:hidden;border:1px solid var(--line2);background:linear-gradient(180deg,#151824,#0f111a);height:560px;position:relative}
.about .ph img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:96%;width:auto;max-width:none}
.about blockquote{font-family:var(--serif);font-size:44px;line-height:1.12;margin-top:16px}
.about .txt{color:var(--mu);font-size:17px;margin-top:24px;max-width:620px}
.about .meta{display:grid;grid-template-columns:repeat(3,1fr);margin-top:36px;border-top:1px solid var(--line2)}
.about .meta div{padding:18px 18px 0 0}
.about .meta b{display:block;font-weight:500}
.about .meta span{font-size:14px;color:var(--mu)}
.about .links{display:flex;gap:12px;margin-top:32px;flex-wrap:wrap}

/* İLETİŞİM */
.cta{margin-top:140px;background:linear-gradient(120deg,#26307f 0%,#1d4f9c 55%,#0f6e9e 100%);position:relative;overflow:hidden}
.cta .w{padding-top:100px;padding-bottom:100px;display:grid;grid-template-columns:1.4fr 1fr;gap:40px;align-items:end;position:relative;z-index:1}
.cta h2{font-family:var(--serif);font-weight:400;font-size:140px;line-height:.88;letter-spacing:-.025em}
.cta h2 em{font-style:italic;background:linear-gradient(100deg,#c3ccff,#9be6ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.cta p{font-size:18px;color:#d6e1ff}
.cta .mail{display:block;font-size:28px;font-weight:600;margin-top:18px;border-bottom:2px solid rgba(255,255,255,.7);padding-bottom:6px;width:max-content;max-width:100%}
.cta .row{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}
.cta .btn{border-color:rgba(255,255,255,.35)}
.cta .btn.white{background:#fff;color:#1d2f7a;border-color:#fff;font-weight:600}

/* FOOTER */
.site-footer{border-top:1px solid var(--line)}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:40px;padding:56px 0 44px}
.fgrid .logo-badge{width:64px;height:64px}
.fgrid .about-f{color:var(--mu);font-size:14.5px;margin-top:14px;max-width:300px}
.fgrid h5{font-family:var(--mono);font-weight:400;font-size:12.5px;color:var(--di);margin-bottom:14px}
.fgrid ul{list-style:none}
.fgrid li{font-size:14.5px;padding:4px 0;color:#cfd3e0}
.fgrid li a:hover{color:#fff}
.fgrid li span{color:var(--di)}
.social{display:flex;gap:8px;margin-top:18px}
.social a{width:38px;height:38px;border-radius:12px;border:1px solid var(--line2);display:flex;align-items:center;justify-content:center;color:var(--mu)}
.social a:hover{color:#fff;border-color:rgba(143,176,255,.6)}
.social svg{width:17px;height:17px}
.fbar{display:flex;justify-content:space-between;gap:20px;padding:18px 0 30px;border-top:1px solid var(--line)}

/* ALT SAYFALAR */
.page-hero{padding:96px 0 40px;border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.page-hero h1{font-family:var(--serif);font-weight:400;font-size:96px;line-height:.95;letter-spacing:-.02em;margin-top:18px}
.page-hero p{color:var(--mu);font-size:18px;max-width:620px;margin-top:20px}
.page-body{padding-top:48px}

/* proje detay */
.detail-hero{padding:72px 0 48px;border-bottom:1px solid var(--line)}
.crumb{font-family:var(--mono);font-size:13px;color:var(--di)}
.crumb a:hover{color:var(--tx)}
.detail-hero .head{display:grid;grid-template-columns:auto 1fr;gap:32px;align-items:center;margin-top:28px}
.detail-hero .icon{width:120px;height:120px;border-radius:30px;background:var(--bg2);border:1px solid var(--line2);display:flex;align-items:center;justify-content:center}
.detail-hero .icon img{width:84px;height:84px;object-fit:contain;border-radius:18px}
.detail-hero h1{font-family:var(--serif);font-weight:400;font-size:84px;line-height:.95;letter-spacing:-.02em}
.detail-hero .short{color:var(--mu);font-size:18px;margin-top:14px;max-width:760px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:13px;padding:5px 11px;border-radius:999px;border:1px solid var(--line2);color:#d6dae7}
.chip.feat{border-color:rgba(245,184,74,.5);color:#f5cf86}
.detail-hero .meta{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;align-items:center}
.detail-hero .links{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.detail-body{display:grid;grid-template-columns:1fr 300px;gap:56px;padding-top:56px}
.prose{font-size:17px;line-height:1.75;color:#d3d7e3;max-width:760px}
.prose strong{color:#fff}
.prose a{color:#8fb0ff;border-bottom:1px solid rgba(143,176,255,.35)}
.prose code{font-family:var(--mono);font-size:14px;background:var(--bg3);border:1px solid var(--line);padding:2px 7px;border-radius:7px}
.aside{border:1px solid var(--line);border-radius:20px;padding:22px;background:var(--bg2);align-self:start;position:sticky;top:100px}
.aside dl div{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:14px}
.aside dl div:last-child{border-bottom:0}
.aside dt{color:var(--di)}
.aside dd{text-align:right}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:16px;margin-top:24px}
.gallery button{border:1px solid var(--line);border-radius:16px;overflow:hidden;aspect-ratio:9/16;background:var(--bg2);cursor:zoom-in;padding:0;transition:border-color .2s,transform .2s}
.gallery button:hover{border-color:rgba(143,176,255,.5);transform:translateY(-2px)}
.gallery img{width:100%;height:100%;object-fit:cover;display:block}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(5,6,9,.94);display:none;align-items:center;justify-content:center}
.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:12px}
.lightbox button{position:absolute;background:rgba(255,255,255,.08);border:1px solid var(--line2);color:#fff;width:46px;height:46px;border-radius:50%;font-size:18px;cursor:pointer}
.lightbox .x{top:22px;right:22px}.lightbox .pv{left:22px}.lightbox .nx{right:22px}

/* tarihçe sayfası (dikey) */
.vtl{position:relative;padding:40px 0 20px}
.vrow{display:grid;grid-template-columns:260px 1fr;gap:40px;padding:34px 0;border-bottom:1px solid var(--line);align-items:start}
.vrow .when .d{font-family:var(--serif);font-size:140px;line-height:.85;display:inline-block}
.vrow .when .m{font-family:var(--mono);font-size:14px;color:var(--mu);margin-top:8px}
.vrow h3{font-family:var(--serif);font-weight:400;font-size:44px;line-height:1.05}
.vrow p{color:var(--mu);font-size:17px;margin-top:12px;max-width:640px}
.vrow.future .when .d{color:var(--di);font-size:90px}

/* MOBİL */
@media (max-width:980px){
  .hero .w{grid-template-columns:1.2fr 1fr}
}
@media (max-width:760px){
  .w{padding:0 20px}
  .site-nav,.site-header .btn.cta-top{display:none}
  .menu-btn{display:block}
  .site-header .w{height:68px}
  .site-header .brand .logo-badge{width:44px;height:44px}
  .wordmark{font-size:22px}
  html.snap{scroll-snap-type:none}
  .hero .scroll-hint{display:none}
  .mobile-menu{position:fixed;inset:68px 0 auto 0;background:rgba(11,12,16,.97);border-bottom:1px solid var(--line);padding:12px 20px 22px;z-index:49}
  .mobile-menu.open{display:block}
  .mobile-menu a{display:block;padding:14px 4px;border-bottom:1px solid var(--line);font-size:17px}
  .hero{height:auto;min-height:0;max-height:none}
  .hero .w{grid-template-columns:1fr;padding-top:40px;padding-bottom:48px}
  .hero h1{font-size:72px}
  .hero .facts{gap:22px}.hero .facts b{font-size:32px}
  .orbit{--o:300px;margin-top:10px}
  .orbit .core{box-shadow:0 0 0 8px rgba(0,0,0,.35)}
  .orbit .sat{width:46px;height:46px;border-radius:13px;margin:-23px 0 0 -23px}.orbit .sat img{width:32px;height:32px}
  .slider .slide{width:100%}
  .sh{flex-direction:column;align-items:start;padding:80px 0 30px;gap:14px}
  .sh h2{font-size:52px}
  .serveo{grid-template-columns:1fr;padding:32px 0 0 24px}
  .serveo h3{font-size:64px}
  .serveo .links{margin:28px 0 8px}
  .serveo .phone{width:120px;left:auto;right:16px;bottom:12px}
  .prods,.svc,.pgrid{grid-template-columns:1fr}
  .prod .vis{height:210px}.prod .body{grid-template-columns:auto 1fr}.prod .tag{display:none}
  .v-askilit .lock img{width:96px}.v-askilit .lock ul{font-size:13px;min-width:150px}
  .tools .right{width:100%}.search{flex:1;width:auto}
  .view{display:none}
  .pgrid.list .pcard{flex-direction:column;align-items:stretch;gap:10px}
  .pgrid.list .pcard .top,.pgrid.list .pcard .bot{width:auto}
  .lane span{font-size:36px}
  .steps{grid-template-columns:1fr 1fr}
  .history .big22{font-size:220px;top:60px}
  .tline{grid-template-columns:1fr 1fr;row-gap:30px}
  .tline::before{display:none}
  .ev .d{font-size:72px;height:76px}.ev.future .d{font-size:44px;line-height:76px}
  .history .note{flex-direction:column;align-items:start;gap:10px}
  .about{grid-template-columns:1fr;gap:36px}
  .about .ph{height:420px}
  .about blockquote{font-size:31px}
  .about .meta{grid-template-columns:1fr}
  .cta .w{grid-template-columns:1fr;padding-top:72px;padding-bottom:72px}
  .cta h2{font-size:76px}
  .cta .mail{font-size:20px}
  .fgrid{grid-template-columns:1fr 1fr;gap:28px}
  .fgrid > div:first-child{grid-column:1/-1}
  .fbar{flex-direction:column;gap:6px}
  .page-hero{padding:60px 0 30px}
  .page-hero h1{font-size:58px}
  .detail-hero .head{grid-template-columns:1fr;gap:20px}
  .detail-hero .icon{width:92px;height:92px;border-radius:24px}.detail-hero .icon img{width:64px;height:64px}
  .detail-hero h1{font-size:56px}
  .detail-body{grid-template-columns:1fr;gap:36px}
  .aside{position:static}
  .gallery{grid-template-columns:repeat(2,1fr);gap:10px}
  .vrow{grid-template-columns:1fr;gap:10px}
  .vrow .when .d{font-size:96px}
  .vrow h3{font-size:34px}
}
.pills a{font:14px var(--sans);padding:7px 14px;border-radius:999px;border:1px solid var(--line2);color:var(--mu)}
.pills a b{font-family:var(--mono);font-weight:400;font-size:12px;margin-left:6px;color:var(--di)}
.pills a:hover{border-color:rgba(143,176,255,.6);color:var(--tx)}
.pills a.on{background:var(--tx);color:var(--bg);border-color:var(--tx)}
.pills a.on b{color:#555a6a}
