@charset "UTF-8";
/* ==========================================================================
   Türev Yazılım — turevweb.com  |  Tasarım Sistemi v2 (2026)
   Bağımsız CSS. Bootstrap / jQuery / font-icon paketi gerektirmez.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokenlar
   -------------------------------------------------------------------------- */
:root{
	--brand:#5b4bff;
	--brand-600:#4a38f0;
	--brand-700:#3b2ad0;
	--brand-400:#8b7cff;
	--violet:#8b2ae0;
	--cyan:#22d3ee;
	--emerald:#10b981;
	--amber:#f59e0b;
	--rose:#f43f5e;
	--sky:#38bdf8;

	/* Her iki temada da koyu kalan yüzey (hero, CTA bantları) */
	--ink:#0b0d1a;
	--ink-2:#151935;
	--ink-text:#eef0ff;
	--ink-muted:#a5accd;
	--ink-border:rgba(255,255,255,.12);

	--bg:#ffffff;
	--bg-soft:#f5f7fc;
	--surface:#ffffff;
	--surface-2:#f1f4fb;
	--text:#0e1020;
	--text-muted:#5b6079;
	--border:#e4e8f3;

	--shadow-sm:0 1px 2px rgba(14,16,32,.05), 0 2px 6px rgba(14,16,32,.05);
	--shadow-md:0 10px 30px -12px rgba(14,16,32,.20);
	--shadow-lg:0 30px 70px -25px rgba(14,16,32,.30);
	--ring:0 0 0 4px rgba(91,75,255,.18);

	--radius-sm:10px;
	--radius:16px;
	--radius-lg:26px;
	--container:1180px;

	--font-body:"Inter","Segoe UI",Roboto,system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
	--font-head:"Plus Jakarta Sans","Inter","Segoe UI",Roboto,system-ui,sans-serif;

	--ease:cubic-bezier(.22,.61,.36,1);
	--header-h:74px;
}

:root[data-theme="dark"]{
	--bg:#090b16;
	--bg-soft:#0d1022;
	--surface:#12162c;
	--surface-2:#181d38;
	--text:#edf0ff;
	--text-muted:#99a1c4;
	--border:rgba(255,255,255,.10);
	--shadow-sm:0 1px 2px rgba(0,0,0,.4);
	--shadow-md:0 12px 34px -14px rgba(0,0,0,.7);
	--shadow-lg:0 34px 80px -28px rgba(0,0,0,.8);
	--ring:0 0 0 4px rgba(139,124,255,.28);
	color-scheme:dark;
}

@media (prefers-color-scheme:dark){
	:root:not([data-theme="light"]){
		--bg:#090b16;
		--bg-soft:#0d1022;
		--surface:#12162c;
		--surface-2:#181d38;
		--text:#edf0ff;
		--text-muted:#99a1c4;
		--border:rgba(255,255,255,.10);
		--shadow-sm:0 1px 2px rgba(0,0,0,.4);
		--shadow-md:0 12px 34px -14px rgba(0,0,0,.7);
		--shadow-lg:0 34px 80px -28px rgba(0,0,0,.8);
		--ring:0 0 0 4px rgba(139,124,255,.28);
		color-scheme:dark;
	}
}

/* --------------------------------------------------------------------------
   2. Sıfırlama & temel
   -------------------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
/* Satır içi ikonlar için güvenli varsayılan boyut — daha özel kurallar ezer. */
svg{width:1.15em;height:1.15em;flex:0 0 auto}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{
	margin:0;
	background:var(--bg);
	color:var(--text);
	font-family:var(--font-body);
	font-size:16.5px;
	line-height:1.72;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	/* DİKKAT: overflow-x:hidden kullanılmaz — position:sticky üst şeridi bozar.
	   "clip" kaydırma bağlamı oluşturmadığı için sticky çalışmaya devam eder. */
	overflow-x:clip;
}
html{overflow-x:clip}
body.is-locked{overflow:hidden}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:var(--brand);text-decoration:none;transition:color .18s var(--ease)}
a:hover{color:var(--brand-600)}
:root[data-theme="dark"] a{color:var(--brand-400)}
button,input,textarea,select{font:inherit;color:inherit}
ul,ol{margin:0;padding:0}
li{list-style:none}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}
h1,h2,h3,h4,h5,h6{
	font-family:var(--font-head);
	margin:0 0 .55em;
	line-height:1.18;
	letter-spacing:-.022em;
	font-weight:750;
	color:var(--text);
}
h1{font-size:clamp(2.1rem,1.35rem + 2.6vw,3.5rem)}
h2{font-size:clamp(1.7rem,1.15rem + 1.8vw,2.55rem)}
h3{font-size:clamp(1.15rem,1.02rem + .55vw,1.45rem)}
h4{font-size:1.08rem}
hr{border:0;border-top:1px solid var(--border);margin:2.5rem 0}
:focus-visible{outline:none;box-shadow:var(--ring);border-radius:8px}
::selection{background:rgba(91,75,255,.22)}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:22px}
.container-wide{max-width:1400px}
.visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--brand);color:#fff;padding:12px 20px;border-radius:0 0 10px 0}
.skip-link:focus{left:0;color:#fff}

/* --------------------------------------------------------------------------
   3. Yardımcılar
   -------------------------------------------------------------------------- */
.section{padding:clamp(58px,7vw,104px) 0}
.section-sm{padding:clamp(42px,5vw,72px) 0}
.section-soft{background:var(--bg-soft)}
.section-ink{
	position:relative;overflow:hidden;color:var(--ink-text);
	background:
		radial-gradient(50% 60% at 12% 0%,rgba(91,75,255,.30),transparent 62%),
		radial-gradient(45% 55% at 92% 100%,rgba(139,42,224,.26),transparent 66%),
		linear-gradient(160deg,#101430 0%,var(--ink) 55%,#0d1128 100%);
	border-block:1px solid rgba(255,255,255,.08);
}
.section-ink>*{position:relative;z-index:2}
.section-ink h1,.section-ink h2,.section-ink h3,.section-ink h4{color:#fff}
.section-ink p{color:var(--ink-muted)}

.text-center{text-align:center}
.mt-0{margin-top:0}
.mt-2{margin-top:.75rem}
.mt-3{margin-top:1.25rem}
.mt-4{margin-top:2rem}
.mt-5{margin-top:3rem}
.mb-0{margin-bottom:0}
.muted{color:var(--text-muted)}
.lead{font-size:1.09rem;color:var(--text-muted);line-height:1.75}
.max-60{max-width:60ch}
.mx-auto{margin-inline:auto}

.eyebrow svg{width:1.05em;height:1.05em}
.tag svg{width:.95em;height:.95em}
.eyebrow{
	display:inline-flex;align-items:center;gap:.5rem;
	font-family:var(--font-head);
	font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
	color:var(--brand);
	background:rgba(91,75,255,.10);
	border:1px solid rgba(91,75,255,.20);
	padding:.4rem .85rem;border-radius:999px;
	margin-bottom:1.05rem;
}
.eyebrow.on-ink{color:#cfc7ff;background:rgba(255,255,255,.07);border-color:var(--ink-border)}
:root[data-theme="dark"] .eyebrow{color:var(--brand-400);background:rgba(139,124,255,.12);border-color:rgba(139,124,255,.22)}

.section-head{max-width:720px;margin:0 auto clamp(34px,4vw,58px);text-align:center}
.section-head p{color:var(--text-muted);font-size:1.06rem;margin-bottom:0}
.section-head.left{margin-inline:0;text-align:left}

.grid{display:grid;gap:clamp(18px,2.2vw,28px)}
/* fr sütunlarının içerik genişliğine kilitlenmesini engeller (görsel taşması) */
.grid>*,.split>*,.hero-grid>*,.gallery>*,.footer-grid>*{min-width:0}
.g-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;gap:clamp(28px,4vw,64px);grid-template-columns:1fr 1fr;align-items:center}
@media (max-width:980px){
	.g-3,.g-4{grid-template-columns:repeat(2,minmax(0,1fr))}
	.split{grid-template-columns:1fr}
	.split .split-media{order:2}
}
@media (max-width:620px){
	.g-2,.g-3,.g-4{grid-template-columns:1fr}
}

/* --------------------------------------------------------------------------
   4. Butonlar
   -------------------------------------------------------------------------- */
.btn{
	display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
	font-family:var(--font-head);font-weight:650;font-size:.97rem;line-height:1;
	padding:.92rem 1.6rem;border-radius:999px;border:1px solid transparent;
	cursor:pointer;white-space:nowrap;text-align:center;
	transition:transform .18s var(--ease),box-shadow .22s var(--ease),background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease);
}
.btn:active{transform:translateY(1px)}
.btn svg{width:1.05em;height:1.05em;flex:0 0 auto}
.btn-primary{
	background:linear-gradient(120deg,var(--brand) 0%,var(--violet) 100%);
	color:#fff;box-shadow:0 12px 26px -12px rgba(91,75,255,.75);
}
.btn-primary:hover{color:#fff;transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(91,75,255,.85)}
.btn-line{background:transparent;border-color:var(--border);color:var(--text)}
.btn-line:hover{border-color:var(--brand);color:var(--brand);transform:translateY(-2px)}
.btn-ink{background:rgba(255,255,255,.08);border-color:var(--ink-border);color:#fff;backdrop-filter:blur(8px)}
.btn-ink:hover{background:rgba(255,255,255,.16);color:#fff;transform:translateY(-2px)}
.btn-light{background:#fff;color:#14162b}
.btn-light:hover{color:#14162b;transform:translateY(-2px);box-shadow:0 16px 32px -16px rgba(0,0,0,.55)}
.btn-sm{padding:.62rem 1.1rem;font-size:.88rem}
.btn-lg{padding:1.05rem 2rem;font-size:1.02rem}
.btn-block{width:100%}

.link-arrow{
	display:inline-flex;align-items:center;gap:.4rem;
	font-family:var(--font-head);font-weight:650;font-size:.94rem;color:var(--brand);
}
.link-arrow svg{width:1em;height:1em;transition:transform .2s var(--ease)}
.link-arrow:hover svg{transform:translateX(4px)}
:root[data-theme="dark"] .link-arrow{color:var(--brand-400)}

/* --------------------------------------------------------------------------
   5. Kartlar
   -------------------------------------------------------------------------- */
.card{
	background:var(--surface);
	border:1px solid var(--border);
	border-radius:var(--radius);
	padding:clamp(22px,2.4vw,30px);
	box-shadow:var(--shadow-sm);
	transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease);
	height:100%;
}
.card-hover:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:rgba(91,75,255,.34)}
.card h3{margin-bottom:.45rem}
.card p{color:var(--text-muted);font-size:.98rem}
.card-glass{
	background:rgba(255,255,255,.055);
	border:1px solid var(--ink-border);
	backdrop-filter:blur(14px);
	-webkit-backdrop-filter:blur(14px);
	color:var(--ink-text);
	box-shadow:none;
}
.card-glass h3{color:#fff}
.card-glass p{color:var(--ink-muted)}
.card-flush{padding:0;overflow:hidden}

.icon-badge{
	width:52px;height:52px;border-radius:15px;
	display:inline-flex;align-items:center;justify-content:center;
	margin-bottom:1.1rem;
	background:rgba(91,75,255,.12);color:var(--brand);
}
.icon-badge svg{width:25px;height:25px}
.icon-badge.c-violet{background:rgba(139,42,224,.13);color:var(--violet)}
.icon-badge.c-cyan{background:rgba(34,211,238,.14);color:#0891b2}
.icon-badge.c-emerald{background:rgba(16,185,129,.14);color:#059669}
.icon-badge.c-amber{background:rgba(245,158,11,.15);color:#d97706}
.icon-badge.c-rose{background:rgba(244,63,94,.13);color:#e11d48}
.icon-badge.c-sky{background:rgba(56,189,248,.15);color:#0284c7}
:root[data-theme="dark"] .icon-badge.c-cyan{color:var(--cyan)}
:root[data-theme="dark"] .icon-badge.c-emerald{color:#34d399}
:root[data-theme="dark"] .icon-badge.c-amber{color:#fbbf24}
:root[data-theme="dark"] .icon-badge.c-rose{color:#fb7185}
:root[data-theme="dark"] .icon-badge.c-sky{color:var(--sky)}
:root[data-theme="dark"] .icon-badge{color:var(--brand-400)}
.card-glass .icon-badge{background:rgba(255,255,255,.10);color:#fff}

/* Rozet / etiket */
.tag{
	display:inline-flex;align-items:center;gap:.35rem;
	font-size:.76rem;font-weight:650;font-family:var(--font-head);
	letter-spacing:.03em;padding:.28rem .68rem;border-radius:999px;
	background:var(--surface-2);color:var(--text-muted);border:1px solid var(--border);
}
.tag-new{background:linear-gradient(120deg,var(--brand),var(--violet));color:#fff;border-color:transparent}
.tag-free{background:rgba(16,185,129,.14);color:#047857;border-color:rgba(16,185,129,.25)}
:root[data-theme="dark"] .tag-free{color:#34d399}

/* Madde listeleri */
.list-check{display:grid;gap:.75rem;margin:1.25rem 0 0}
.list-check li{position:relative;padding-left:2rem;color:var(--text-muted);line-height:1.6}
.list-check li::before{
	content:"";position:absolute;left:0;top:.28em;width:1.3rem;height:1.3rem;border-radius:50%;
	background:rgba(91,75,255,.13) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235b4bff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center/.78rem no-repeat;
}
.list-check.on-ink li{color:var(--ink-muted)}
.list-check.on-ink li::before{background-color:rgba(255,255,255,.12);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a5b4fc' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E")}
.list-dot{display:grid;gap:.6rem;margin-top:1rem}
.list-dot li{position:relative;padding-left:1.35rem;color:var(--text-muted)}
.list-dot li::before{content:"";position:absolute;left:.2rem;top:.72em;width:6px;height:6px;border-radius:50%;background:var(--brand-400)}

/* --------------------------------------------------------------------------
   6. Üst menü
   -------------------------------------------------------------------------- */
.site-header{position:sticky;top:0;z-index:90;transition:background .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease)}
.site-header::before{content:"";position:absolute;inset:0;background:var(--bg);opacity:0;transition:opacity .25s var(--ease);pointer-events:none}
.site-header.is-stuck::before{opacity:.97;backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4)}
.site-header.is-stuck{box-shadow:0 1px 0 var(--border),0 10px 30px -22px rgba(14,16,32,.5)}
.nav{position:relative;display:flex;align-items:center;gap:1.25rem;height:var(--header-h)}

.brand{display:inline-flex;align-items:center;gap:.6rem;flex:0 0 auto;color:var(--text)}
.brand:hover{color:var(--text)}
.brand img{height:34px;width:auto}
.brand-text{font-family:var(--font-head);font-weight:800;font-size:1.16rem;letter-spacing:-.02em;line-height:1}
.brand-sub{display:block;font-family:var(--font-body);font-weight:500;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);margin-top:.18rem}

.nav-menu{display:flex;align-items:center;gap:.15rem;margin-inline:auto}
.nav-item{position:relative}
.nav-link{
	display:inline-flex;align-items:center;gap:.32rem;white-space:nowrap;
	font-family:var(--font-head);font-weight:600;font-size:.95rem;
	padding:.6rem .8rem;border-radius:10px;color:var(--text);
	transition:background .18s var(--ease),color .18s var(--ease);
}
.nav-link:hover,.nav-item.is-open>.nav-link{background:var(--surface-2);color:var(--brand)}
.nav-link[aria-current="page"]{color:var(--brand)}
.nav-link .chev{width:.85em;height:.85em;transition:transform .2s var(--ease)}
.nav-item.is-open>.nav-link .chev{transform:rotate(180deg)}

.dropdown{
	position:absolute;top:calc(100% + 10px);left:0;min-width:270px;
	background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
	box-shadow:var(--shadow-lg);padding:.55rem;
	opacity:0;visibility:hidden;transform:translateY(10px);
	transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s;
}
.nav-item.is-open>.dropdown{opacity:1;visibility:visible;transform:translateY(0)}
.dropdown a{
	display:flex;flex-direction:column;gap:.1rem;
	padding:.6rem .8rem;border-radius:11px;color:var(--text);font-size:.94rem;font-weight:550;
	transition:background .16s var(--ease),color .16s var(--ease);
}
.dropdown a:hover{background:var(--surface-2);color:var(--brand)}
.dropdown a small{color:var(--text-muted);font-size:.79rem;font-weight:450;line-height:1.45}
.dropdown-sep{height:1px;background:var(--border);margin:.4rem .6rem}

/* Mega menü — web sayfası örnekleri */
.nav-item-mega{position:static}
.mega{
	position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%,10px);
	width:min(1080px,calc(100vw - 44px));
	background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);
	box-shadow:var(--shadow-lg);padding:1.4rem;
	opacity:0;visibility:hidden;
	transition:opacity .22s var(--ease),transform .22s var(--ease),visibility .22s;
}
.nav-item.is-open>.mega{opacity:1;visibility:visible;transform:translate(-50%,0)}
.mega-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.mega-card{display:block;border-radius:14px;overflow:hidden;border:1px solid var(--border);background:var(--surface-2);transition:transform .2s var(--ease),border-color .2s var(--ease)}
.mega-card:hover{transform:translateY(-4px);border-color:var(--brand)}
.mega-card img{aspect-ratio:16/11;object-fit:cover;width:100%}
.mega-card span{display:block;padding:.6rem .8rem;font-family:var(--font-head);font-weight:650;font-size:.9rem;color:var(--text)}
.mega-foot{margin-top:1.1rem;padding-top:1rem;border-top:1px solid var(--border);display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:space-between}
.mega-foot p{margin:0;color:var(--text-muted);font-size:.92rem}

.nav-actions{display:flex;align-items:center;gap:.5rem;flex:0 0 auto}
.icon-btn{
	width:42px;height:42px;border-radius:12px;border:1px solid var(--border);
	background:var(--surface);display:inline-flex;align-items:center;justify-content:center;
	cursor:pointer;color:var(--text);
	transition:background .18s var(--ease),color .18s var(--ease),border-color .18s var(--ease);
}
.icon-btn:hover{color:var(--brand);border-color:var(--brand)}
.icon-btn svg{width:19px;height:19px}
.lang-btn{
	display:inline-flex;align-items:center;justify-content:center;
	min-width:42px;height:42px;padding:0 .7rem;border-radius:12px;
	border:1px solid var(--border);background:var(--surface);
	font-family:var(--font-head);font-weight:700;font-size:.85rem;letter-spacing:.04em;
	color:var(--text);
	transition:color .18s var(--ease),border-color .18s var(--ease),background .18s var(--ease);
}
.lang-btn:hover{color:var(--brand);border-color:var(--brand)}
.site-header:not(.is-stuck) .lang-btn{background:rgba(255,255,255,.08);border-color:var(--ink-border);color:#fff}
.site-header:not(.is-stuck) .lang-btn:hover{background:rgba(255,255,255,.18);color:#fff}
.site-header:not(.is-stuck) .icon-btn{background:rgba(255,255,255,.08);border-color:var(--ink-border);color:#fff}
.site-header:not(.is-stuck) .icon-btn:hover{background:rgba(255,255,255,.18);color:#fff}
.theme-toggle .i-moon{display:none}
:root[data-theme="dark"] .theme-toggle .i-moon{display:block}
:root[data-theme="dark"] .theme-toggle .i-sun{display:none}
@media (prefers-color-scheme:dark){
	:root:not([data-theme="light"]) .theme-toggle .i-moon{display:block}
	:root:not([data-theme="light"]) .theme-toggle .i-sun{display:none}
}
.nav-toggle{display:none}

/* Üst şerit, sayfa başındayken koyu hero'nun üzerindedir:
   sayfa kaydırılana (is-stuck) kadar açık renkli yazı kullanılır. */
.site-header:not(.is-stuck) .brand,
.site-header:not(.is-stuck) .brand-text,
.site-header:not(.is-stuck) .nav-link,
.site-header:not(.is-stuck) .icon-btn{color:#fff}
.site-header:not(.is-stuck) .brand-sub{color:rgba(255,255,255,.62)}
.site-header:not(.is-stuck) .nav-link:hover,
.site-header:not(.is-stuck) .nav-item.is-open>.nav-link{background:rgba(255,255,255,.12);color:#fff}
.site-header:not(.is-stuck) .nav-link[aria-current="page"]{color:#fff}
.site-header:not(.is-stuck) .icon-btn{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.18)}
.site-header:not(.is-stuck) .icon-btn:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.32);color:#fff}
/* Açılan menülerin içi her zaman normal yüzey renklerini kullanır. */
.site-header .dropdown a,
.site-header .mega-card span,
.site-header .mega-foot p{color:var(--text)}
.site-header .dropdown a:hover{color:var(--brand)}

@media (max-width:1100px){
	.nav-menu{display:none}
	.nav-toggle{display:inline-flex}
	.nav-cta{display:none}
}

/* Aktif sayfa işareti */
.nav-link{position:relative}
.nav-item.is-current>.nav-link{color:var(--brand)}
.nav-item.is-current>.nav-link::after{
	content:"";position:absolute;left:.8rem;right:.8rem;bottom:.28rem;
	height:2px;border-radius:2px;background:currentColor;opacity:.9;
}
.site-header:not(.is-stuck) .nav-item.is-current>.nav-link{color:#fff;background:rgba(255,255,255,.14)}
.site-header .dropdown a[aria-current="page"]{background:var(--surface-2);color:var(--brand);font-weight:700}
.site-header .dropdown a[aria-current="page"] small{color:var(--text-muted)}
.m-panel a[aria-current="page"]{color:var(--brand);font-weight:700}
.m-toggle.is-current{color:var(--brand)}

/* Mobil çekmece */
.drawer{
	position:fixed;inset:0;z-index:120;visibility:hidden;
}
.drawer.is-open{visibility:visible}
.drawer-backdrop{position:absolute;inset:0;background:rgba(8,10,22,.55);opacity:0;transition:opacity .3s var(--ease);backdrop-filter:blur(3px)}
.drawer.is-open .drawer-backdrop{opacity:1}
.drawer-panel{
	position:absolute;top:0;right:0;height:100%;width:min(400px,88vw);
	background:var(--bg);border-left:1px solid var(--border);
	transform:translateX(102%);transition:transform .34s var(--ease);
	display:flex;flex-direction:column;
}
.drawer.is-open .drawer-panel{transform:none}
.drawer-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}
.drawer-body{padding:1rem 1.25rem 2rem;overflow-y:auto;flex:1}
.drawer-foot{padding:1.1rem 1.25rem;border-top:1px solid var(--border);display:grid;gap:.6rem}
.m-group+.m-group{margin-top:.35rem}
.m-toggle{
	display:flex;align-items:center;justify-content:space-between;width:100%;
	background:none;border:0;padding:.85rem .25rem;cursor:pointer;
	font-family:var(--font-head);font-weight:700;font-size:1rem;color:var(--text);
	border-bottom:1px solid var(--border);
}
.m-toggle svg{width:1em;height:1em;transition:transform .22s var(--ease);color:var(--text-muted)}
.m-toggle[aria-expanded="true"] svg{transform:rotate(180deg)}
.m-panel{display:grid;overflow:hidden;max-height:0;transition:max-height .3s var(--ease)}
.m-panel a{padding:.62rem .25rem .62rem 1rem;color:var(--text-muted);font-size:.96rem;border-bottom:1px solid var(--border)}
.m-panel a:hover{color:var(--brand)}
.m-link{display:block;padding:.85rem .25rem;font-family:var(--font-head);font-weight:700;font-size:1rem;color:var(--text);border-bottom:1px solid var(--border)}

/* --------------------------------------------------------------------------
   7. Hero
   -------------------------------------------------------------------------- */
.hero{
	position:relative;overflow:hidden;
	background:var(--ink);
	color:var(--ink-text);
	padding:clamp(60px,7vw,104px) 0 clamp(70px,8vw,120px);
	margin-top:calc(var(--header-h) * -1);
	padding-top:calc(var(--header-h) + clamp(50px,6vw,86px));
}
.hero::before{
	content:"";position:absolute;inset:-25% -10% auto -10%;height:130%;
	background:
		radial-gradient(52% 46% at 18% 8%,rgba(91,75,255,.55) 0%,rgba(91,75,255,0) 62%),
		radial-gradient(45% 40% at 88% 12%,rgba(139,42,224,.42) 0%,rgba(139,42,224,0) 65%),
		radial-gradient(40% 40% at 62% 96%,rgba(34,211,238,.20) 0%,rgba(34,211,238,0) 70%);
	pointer-events:none;
}
.hero::after{
	content:"";position:absolute;inset:0;pointer-events:none;
	background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
	background-size:64px 64px;
	-webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000 0%,transparent 78%);
	mask-image:radial-gradient(70% 60% at 50% 30%,#000 0%,transparent 78%);
}
.hero>.container{position:relative;z-index:2}
.hero h1{color:#fff;margin-bottom:.55em}
.hero h1 .grad{
	background:linear-gradient(100deg,#a5b4fc 0%,#c4a4ff 42%,#67e8f9 100%);
	-webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-lead{font-size:clamp(1.03rem,.98rem + .4vw,1.2rem);color:var(--ink-muted);max-width:56ch}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,4vw,56px);align-items:center}
@media (max-width:980px){.hero-grid{grid-template-columns:1fr}}
.hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.9rem}
.hero-note{display:flex;flex-wrap:wrap;gap:1.4rem;margin-top:2.1rem;color:var(--ink-muted);font-size:.9rem}
.hero-note span{display:inline-flex;align-items:center;gap:.45rem}
.hero-note svg{width:1.05em;height:1.05em;color:#67e8f9}
.hero-media{position:relative}
.hero-media img{border-radius:var(--radius-lg);position:relative;z-index:2}
.hero-media .glow{position:absolute;inset:8% 6%;background:radial-gradient(50% 50% at 50% 50%,rgba(91,75,255,.55),transparent 70%);filter:blur(48px);z-index:1}

/* Hero slider */
.hero-slider{position:relative}
.hero-track{display:grid}
.hero-slide{
	grid-area:1 / 1;
	opacity:0;visibility:hidden;transform:translateY(14px);
	transition:opacity .55s var(--ease),transform .55s var(--ease),visibility .55s;
	pointer-events:none;
}
.hero-slide.is-active{opacity:1;visibility:visible;transform:none;pointer-events:auto}
.slide-title{color:#fff;margin-bottom:.55em;font-size:clamp(2.1rem,1.35rem + 2.6vw,3.5rem);line-height:1.15;font-weight:750;letter-spacing:-.022em}
.slide-title .grad{
	background:linear-gradient(100deg,#a5b4fc 0%,#c4a4ff 42%,#67e8f9 100%);
	-webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-media-shot img{
	border-radius:var(--radius);border:1px solid rgba(255,255,255,.16);
	box-shadow:0 34px 70px -30px rgba(0,0,0,.85);
}

/* Slider denetimleri */
.hero-controls{
	display:flex;align-items:center;gap:.75rem;
	margin-top:clamp(24px,3vw,38px);position:relative;z-index:3;
}
.hero-arrow{
	flex:0 0 auto;width:42px;height:42px;border-radius:13px;
	border:1px solid var(--ink-border);background:rgba(255,255,255,.08);
	color:#fff;cursor:pointer;display:grid;place-items:center;
	transition:background .18s var(--ease),transform .18s var(--ease);
}
.hero-arrow:hover{background:rgba(255,255,255,.18)}
.hero-arrow svg{width:19px;height:19px}
.hero-arrow[data-slide-prev] svg{transform:rotate(90deg)}
.hero-arrow[data-slide-next] svg{transform:rotate(-90deg)}
.hero-dots{display:flex;flex-wrap:wrap;gap:.5rem;flex:1 1 auto}
.hero-dot{
	position:relative;flex:1 1 0;min-width:0;
	border:0;background:none;padding:.55rem 0 0;cursor:pointer;text-align:left;
	color:var(--ink-muted);font-family:var(--font-head);font-weight:650;font-size:.82rem;
	transition:color .2s var(--ease);
}
.hero-dot:hover{color:#fff}
.hero-dot.is-active{color:#fff}
.hero-dot-bar{
	display:block;height:3px;border-radius:3px;background:rgba(255,255,255,.18);
	overflow:hidden;position:relative;
}
.hero-dot.is-active .hero-dot-bar{background:rgba(255,255,255,.24)}
.hero-dot-bar::after{
	content:"";position:absolute;inset:0 100% 0 0;border-radius:3px;
	background:linear-gradient(90deg,var(--brand-400),#67e8f9);
}
.hero-dot.is-active .hero-dot-bar::after{animation:trvSlideBar var(--slide-delay,7000ms) linear forwards}
.hero-slider.is-paused .hero-dot.is-active .hero-dot-bar::after{animation-play-state:paused}
@keyframes trvSlideBar{from{inset:0 100% 0 0}to{inset:0 0 0 0}}
.hero-dot-text{display:block;margin-top:.45rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:760px){
	.hero-dot-text{display:none}
	.hero-dot{flex:1 1 0;padding-top:.4rem}
}
@media (prefers-reduced-motion:reduce){
	.hero-dot.is-active .hero-dot-bar::after{animation:none;inset:0 0 0 0}
}

/* Hero altındaki sayaç şeridi */
.stat-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--ink-border);border:1px solid var(--ink-border);border-radius:var(--radius);overflow:hidden;margin-top:clamp(38px,5vw,64px);position:relative;z-index:2}
.stat-strip div{background:rgba(255,255,255,.035);padding:1.25rem 1.35rem;backdrop-filter:blur(8px)}
.stat-strip strong{display:block;font-family:var(--font-head);font-size:1.55rem;font-weight:800;color:#fff;line-height:1.2}
.stat-strip span{font-size:.88rem;color:var(--ink-muted)}
@media (max-width:760px){.stat-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Sayfa başlığı bandı (iç sayfalar) */
.page-hero{
	position:relative;overflow:hidden;background:var(--ink);color:var(--ink-text);
	margin-top:calc(var(--header-h) * -1);
	padding:calc(var(--header-h) + clamp(44px,5vw,72px)) 0 clamp(44px,5vw,72px);
}
.page-hero::before{
	content:"";position:absolute;inset:-40% -10% auto -10%;height:170%;
	background:radial-gradient(46% 46% at 22% 10%,rgba(91,75,255,.50),transparent 62%),radial-gradient(42% 42% at 84% 20%,rgba(139,42,224,.38),transparent 65%);
	pointer-events:none;
}
.page-hero>.container{position:relative;z-index:2}
.page-hero h1{color:#fff;margin-bottom:.4em;max-width:22ch}
.page-hero .lead{color:var(--ink-muted);max-width:62ch}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;font-size:.86rem;color:var(--ink-muted);margin-bottom:1.1rem}
.crumbs a{color:#c7c2ff}
.crumbs a:hover{color:#fff}
.crumbs li{display:inline-flex;align-items:center;gap:.5rem}
.crumbs li+li::before{content:"/";opacity:.45}

/* --------------------------------------------------------------------------
   8. Özel bloklar
   -------------------------------------------------------------------------- */
/* Adım / süreç */
.steps{display:grid;gap:1.5rem;counter-reset:step}
.step{position:relative;display:grid;grid-template-columns:auto 1fr;gap:1.25rem;align-items:start}
.step-num{
	counter-increment:step;flex:0 0 auto;
	width:46px;height:46px;border-radius:14px;
	display:grid;place-items:center;
	font-family:var(--font-head);font-weight:800;font-size:1.02rem;
	background:linear-gradient(140deg,var(--brand),var(--violet));color:#fff;
	box-shadow:0 10px 22px -12px rgba(91,75,255,.9);
}
.step-num::before{content:counter(step,decimal-leading-zero)}
.step h3{margin-bottom:.3rem}
.step p{color:var(--text-muted);margin-bottom:0}
.step::after{content:"";position:absolute;left:23px;top:56px;bottom:-1.5rem;width:2px;background:linear-gradient(var(--border),transparent)}
.step:last-child::after{display:none}

/* Akordiyon */
.accordion{display:grid;gap:.75rem}
.acc-item{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:hidden;transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.acc-item.is-open{border-color:rgba(91,75,255,.42);box-shadow:var(--shadow-md)}
.acc-btn{
	width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;
	background:none;border:0;cursor:pointer;text-align:left;
	padding:1.15rem 1.35rem;
	font-family:var(--font-head);font-weight:650;font-size:1.02rem;color:var(--text);
}
.acc-btn .plus{position:relative;flex:0 0 auto;width:22px;height:22px}
.acc-btn .plus::before,.acc-btn .plus::after{content:"";position:absolute;background:var(--brand);border-radius:2px;transition:transform .25s var(--ease),opacity .25s var(--ease)}
.acc-btn .plus::before{left:0;top:10px;width:22px;height:2px}
.acc-btn .plus::after{left:10px;top:0;width:2px;height:22px}
.acc-item.is-open .acc-btn .plus::after{transform:rotate(90deg);opacity:0}
.acc-panel{max-height:0;overflow:hidden;transition:max-height .3s var(--ease)}
.acc-panel-inner{padding:0 1.35rem 1.3rem;color:var(--text-muted)}

/* Sekmeli filtre + galeri */
.filter-bar{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:2.2rem}
.filter-btn{
	border:1px solid var(--border);background:var(--surface);color:var(--text-muted);
	font-family:var(--font-head);font-weight:600;font-size:.92rem;
	padding:.55rem 1.15rem;border-radius:999px;cursor:pointer;
	transition:all .2s var(--ease);
}
.filter-btn:hover{color:var(--brand);border-color:var(--brand)}
.filter-btn.is-active{background:linear-gradient(120deg,var(--brand),var(--violet));border-color:transparent;color:#fff}
.gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.35rem}
@media (max-width:980px){.gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){.gallery{grid-template-columns:1fr}}
.shot{
	border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--surface);
	box-shadow:var(--shadow-sm);transition:transform .25s var(--ease),box-shadow .25s var(--ease);
}
.shot.is-hidden{display:none}
.shot:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)}
.shot-fig{position:relative;display:block;background:var(--surface-2);cursor:zoom-in}
.shot-fig img{width:100%;aspect-ratio:16/10;object-fit:cover}
.shot-fig::after{
	content:"";position:absolute;inset:0;background:rgba(11,13,26,.42) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M21 21l-4.3-4.3M11 8v6M8 11h6'/%3E%3C/svg%3E") center/34px no-repeat;
	opacity:0;transition:opacity .22s var(--ease);
}
.shot-fig:hover::after{opacity:1}
.shot-body{padding:1rem 1.15rem 1.2rem}
.shot-body h3{font-size:1.03rem;margin-bottom:.15rem}
.shot-body p{margin:0;font-size:.88rem;color:var(--text-muted)}

/* Lightbox */
.lightbox{position:fixed;inset:0;z-index:150;display:none;place-items:center;background:rgba(6,8,18,.9);padding:24px;backdrop-filter:blur(6px)}
.lightbox.is-open{display:grid}
.lightbox img{max-width:min(1200px,94vw);max-height:88vh;border-radius:14px;box-shadow:0 40px 100px -30px #000}
.lightbox-close{position:absolute;top:20px;right:22px;width:46px;height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;cursor:pointer;display:grid;place-items:center}
.lightbox-close svg{width:20px;height:20px}

/* Logo / marka şeridi */
.chip-row{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}
.chip{
	display:inline-flex;align-items:center;gap:.5rem;
	padding:.6rem 1.05rem;border-radius:999px;
	border:1px solid var(--border);background:var(--surface);
	font-family:var(--font-head);font-weight:600;font-size:.92rem;color:var(--text);
	box-shadow:var(--shadow-sm);
}
.chip svg{width:1.05em;height:1.05em;color:var(--brand)}

/* CTA bandı */
.cta{
	position:relative;overflow:hidden;border-radius:var(--radius-lg);
	background:linear-gradient(120deg,#3b2ad0 0%,#5b4bff 45%,#8b2ae0 100%);
	color:#fff;padding:clamp(34px,4.5vw,62px);
	text-align:center;
}
.cta::after{
	content:"";position:absolute;inset:0;pointer-events:none;
	background:radial-gradient(40% 60% at 12% 100%,rgba(34,211,238,.35),transparent 70%),radial-gradient(35% 55% at 90% 0%,rgba(255,255,255,.22),transparent 70%);
}
.cta>*{position:relative;z-index:2}
.cta h2{color:#fff;max-width:22ch;margin-inline:auto}
.cta p{color:rgba(255,255,255,.82);max-width:56ch;margin-inline:auto}
.cta-actions{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1.8rem}

/* Yan yana medya bloğu */
.media-frame{
	border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);
	background:var(--surface-2);box-shadow:var(--shadow-md);
}
.media-frame img{width:100%}
.media-soft{
	position:relative;padding:clamp(14px,2vw,26px);border-radius:var(--radius-lg);
	background:linear-gradient(140deg,rgba(91,75,255,.13),rgba(139,42,224,.10));
}
.media-soft img{border-radius:var(--radius);}

/* Fiyat / karşılaştırma tablosu */
.table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
table.tbl{width:100%;border-collapse:collapse;min-width:620px}
table.tbl th,table.tbl td{padding:.9rem 1.1rem;text-align:left;border-bottom:1px solid var(--border);font-size:.95rem}
table.tbl th{font-family:var(--font-head);font-weight:700;background:var(--surface-2);color:var(--text)}
table.tbl tr:last-child td{border-bottom:0}

/* Bilgi kutusu */
.note{
	display:flex;gap:.85rem;align-items:flex-start;
	padding:1rem 1.15rem;border-radius:var(--radius-sm);
	background:rgba(245,158,11,.09);border:1px solid rgba(245,158,11,.24);
	color:var(--text-muted);font-size:.93rem;
}
.note svg{width:20px;height:20px;flex:0 0 auto;color:#d97706;margin-top:.15rem}
.note p{margin:0}
.note-brand{background:rgba(91,75,255,.08);border-color:rgba(91,75,255,.22)}
.note-brand svg{color:var(--brand)}

/* Otomatik hasar tespiti görseli (inc/gorsel-hasar.php) */
.hasar-gorsel{
	margin:0;border-radius:var(--radius-lg);overflow:hidden;
	border:1px solid var(--border);background:var(--ink);
	box-shadow:var(--shadow-md);
}
.hasar-gorsel .hasar-zoom{
	display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;line-height:0;
}
.hasar-gorsel img{width:100%;height:auto;display:block;transition:transform .5s var(--ease)}
.hasar-gorsel .hasar-zoom:hover img{transform:scale(1.02)}
.hasar-gorsel figcaption{
	padding:.85rem 1.1rem;font-size:.85rem;line-height:1.55;
	color:var(--ink-muted);background:var(--ink);border-top:1px solid rgba(255,255,255,.08);
}
.hasar-gorsel-tam{max-width:520px;margin-inline:auto}

/* Hasar türü rozetleri */
.hasar-turleri{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.25rem}
.hasar-turleri li{
	display:inline-flex;align-items:center;gap:.45rem;
	padding:.5rem 1rem;border-radius:999px;
	border:1px solid rgba(34,211,238,.32);background:rgba(34,211,238,.10);
	font-family:var(--font-head);font-weight:650;font-size:.9rem;color:var(--text);
}
.hasar-turleri li::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cyan)}

/* Sohbet maketi (TÜREV-AI) */
.chat-mock{
	border-radius:var(--radius-lg);
	border:1px solid var(--ink-border);
	background:linear-gradient(170deg,rgba(255,255,255,.10),rgba(255,255,255,.03));
	backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
	box-shadow:0 40px 90px -40px rgba(0,0,0,.85);
	overflow:hidden;
}
.chat-mock-head{display:flex;align-items:center;gap:.45rem;padding:.85rem 1.1rem;border-bottom:1px solid var(--ink-border)}
.chat-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.22)}
.chat-title{margin-left:.7rem;display:inline-flex;align-items:center;gap:.45rem;font-family:var(--font-head);font-weight:700;font-size:.88rem;color:#fff}
.chat-title svg{width:17px;height:17px;color:#a5b4fc}
.chat-mock-body{padding:1.15rem;display:grid;gap:.7rem}
.bubble{
	margin:0;max-width:88%;padding:.72rem 1rem;border-radius:16px;
	font-size:.94rem;line-height:1.6;
}
.bubble.user{justify-self:end;background:linear-gradient(120deg,var(--brand),var(--violet));color:#fff;border-bottom-right-radius:5px}
.bubble.bot{justify-self:start;background:rgba(255,255,255,.09);border:1px solid var(--ink-border);color:var(--ink-text);border-bottom-left-radius:5px}
.bubble.bot strong{color:#fff}
.bubble.typing{display:inline-flex;gap:5px;align-items:center;padding:.9rem 1.05rem}
.bubble.typing span{width:7px;height:7px;border-radius:50%;background:#a5b4fc;animation:trvBlink 1.3s infinite ease-in-out}
.bubble.typing span:nth-child(2){animation-delay:.18s}
.bubble.typing span:nth-child(3){animation-delay:.36s}
@keyframes trvBlink{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* --------------------------------------------------------------------------
   9. Formlar
   -------------------------------------------------------------------------- */
.form-grid{display:grid;gap:1rem}
.field label{display:block;font-family:var(--font-head);font-weight:600;font-size:.9rem;margin-bottom:.4rem}
.field .req{color:var(--rose)}
.form-control{
	width:100%;padding:.85rem 1.05rem;
	border:1px solid var(--border);border-radius:12px;
	background:var(--surface);color:var(--text);
	transition:border-color .18s var(--ease),box-shadow .18s var(--ease);
}
.form-control::placeholder{color:var(--text-muted);opacity:.75}
.form-control:focus{outline:none;border-color:var(--brand);box-shadow:var(--ring)}
textarea.form-control{min-height:150px;resize:vertical}
.form-consent{display:flex;gap:.6rem;align-items:flex-start;font-size:.85rem;color:var(--text-muted)}
.form-consent input{margin-top:.35rem;accent-color:var(--brand);width:16px;height:16px}
.form-alert{
	display:flex;gap:.75rem;align-items:flex-start;
	padding:1rem 1.15rem;border-radius:var(--radius-sm);margin-bottom:1.5rem;
	background:rgba(16,185,129,.10);border:1px solid rgba(16,185,129,.28);color:var(--text);
}
.form-alert svg{width:22px;height:22px;color:#059669;flex:0 0 auto}
.form-alert.is-error{background:rgba(244,63,94,.09);border-color:rgba(244,63,94,.26)}
.form-alert.is-error svg{color:#e11d48}

/* İletişim kartları */
.contact-card{display:flex;gap:1rem;align-items:flex-start}
.contact-card .icon-badge{margin-bottom:0}
.contact-card h3{font-size:1.02rem;margin-bottom:.2rem}
.contact-card p,.contact-card a{font-size:.96rem;color:var(--text-muted);margin:0}
.contact-card a:hover{color:var(--brand)}
.map-frame{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--border);box-shadow:var(--shadow-md);line-height:0}
.map-frame iframe{width:100%;height:420px;border:0;display:block}

/* Uzun metin (KVKK vb.) */
.prose{max-width:78ch}
.prose h2{margin-top:2.2rem}
.prose h2:first-child{margin-top:0}
.prose p,.prose li{color:var(--text-muted)}
.prose ol{counter-reset:pr;display:grid;gap:.85rem;margin-top:1rem}
.prose ol li{position:relative;padding-left:2.2rem}
.prose ol li::before{counter-increment:pr;content:counter(pr);position:absolute;left:0;top:.15em;width:1.6rem;height:1.6rem;border-radius:8px;display:grid;place-items:center;font-size:.78rem;font-weight:700;font-family:var(--font-head);background:var(--surface-2);color:var(--brand);border:1px solid var(--border)}

/* --------------------------------------------------------------------------
   10. Alt bilgi
   -------------------------------------------------------------------------- */
.site-footer{background:var(--ink);color:var(--ink-muted);padding-top:clamp(50px,6vw,80px);position:relative;overflow:hidden}
.site-footer::before{content:"";position:absolute;inset:-60% -20% auto -20%;height:150%;background:radial-gradient(40% 40% at 20% 0%,rgba(91,75,255,.30),transparent 65%),radial-gradient(35% 35% at 82% 6%,rgba(139,42,224,.22),transparent 68%);pointer-events:none}
.site-footer>*{position:relative;z-index:2}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.35fr;gap:clamp(24px,3vw,44px)}
@media (max-width:980px){.footer-grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.footer-grid{grid-template-columns:1fr}}
.site-footer h3{color:#fff;font-size:.86rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;margin-bottom:1.1rem}
.site-footer .brand{color:#fff}
.site-footer .brand:hover{color:#fff}
.site-footer .brand-sub{color:var(--ink-muted)}
.footer-about{margin-top:1rem;font-size:.95rem;max-width:34ch}
.footer-menu{display:grid;gap:.6rem}
.footer-menu a{color:var(--ink-muted);font-size:.95rem}
.footer-menu a:hover{color:#fff}
.footer-contact{display:grid;gap:.85rem;font-size:.95rem}
.footer-contact li{display:flex;gap:.7rem;align-items:flex-start}
.footer-contact svg{width:18px;height:18px;flex:0 0 auto;margin-top:.22rem;color:var(--brand-400)}
.footer-contact a{color:var(--ink-muted)}
.footer-contact a:hover{color:#fff}
.footer-bottom{margin-top:clamp(38px,4vw,58px);border-top:1px solid var(--ink-border);padding:1.4rem 0;display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;font-size:.88rem}
.footer-bottom a{color:var(--ink-muted)}
.footer-bottom a:hover{color:#fff}
.footer-legal{display:flex;flex-wrap:wrap;gap:1.2rem}

/* Yukarı çık */
.to-top{
	position:fixed;right:20px;bottom:20px;z-index:80;
	width:46px;height:46px;border-radius:14px;border:1px solid var(--border);
	background:var(--surface);color:var(--text);cursor:pointer;
	display:grid;place-items:center;box-shadow:var(--shadow-md);
	opacity:0;visibility:hidden;transform:translateY(12px);
	transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
}
.to-top.is-visible{opacity:1;visibility:visible;transform:none}
.to-top svg{width:19px;height:19px}
.to-top:hover{color:var(--brand);border-color:var(--brand)}

/* --------------------------------------------------------------------------
   11. Hareket
   -------------------------------------------------------------------------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.is-in{opacity:1;transform:none}
.reveal[data-d="1"]{transition-delay:.08s}
.reveal[data-d="2"]{transition-delay:.16s}
.reveal[data-d="3"]{transition-delay:.24s}
.reveal[data-d="4"]{transition-delay:.32s}
.reveal[data-d="5"]{transition-delay:.40s}

@media (prefers-reduced-motion:reduce){
	html{scroll-behavior:auto}
	*,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
	.reveal{opacity:1;transform:none}
}

/* --------------------------------------------------------------------------
   12. Yazdırma
   -------------------------------------------------------------------------- */
@media print{
	.site-header,.drawer,.to-top,.hero-actions,.cta,.lightbox{display:none!important}
	body{background:#fff;color:#000}
	.section{padding:12px 0}
}

/* =============================================================================
   UZAK DESTEK ŞERİDİ                                          (25.08.2026)
   -----------------------------------------------------------------------------
   Menünün ÜSTÜNDE duran ince şerit: TurevUzak · TürevRustDesk · AnyDesk + telefon.

   ⚠ Yüzey --ink ailesinden seçildi; bu tokenlar açık temada da koyu kalıyor
     (hero ve CTA bantlarıyla aynı aile). Şerit hero'nun devamı gibi görünür ve
     ziyaretçi temayı değiştirince rengi zıplamaz.
   ⚠ Şerit sticky DEĞİL: .site-header yapışkan, şerit sayfayla kayıp gider.
     Böylece --header-h hesabı ve hero'nun negatif margin'i bozulmaz.
   ⚠ Mobil indirgeme CSS ile: 900px altında üç .exe bağlantısı gizlenir, yerine
     teknik destek sayfasına giden tek düğme çıkar. JS yok.
   ============================================================================= */
.topbar{background:var(--ink);color:var(--ink-muted);font-size:.8rem;border-bottom:1px solid var(--ink-border)}
.topbar-in{display:flex;align-items:center;gap:10px;min-height:38px}
.topbar svg{width:1.1em;height:1.1em;flex:none}

.topbar-label{display:inline-flex;align-items:center;gap:7px;color:var(--ink-text);font-weight:600;white-space:nowrap}

.topbar-links{display:flex;align-items:center;gap:2px;min-width:0}
/* ⚠ `.topbar a.topbar-link` — sade `.topbar-link` YETMEZ: temanin
   `:root[data-theme="dark"] a{color:var(--brand-400)}` kurali (0,2,1) daha
   ozgul, baglantilar mor cikiyordu. Ayni ozgullukte + dosyanin sonunda. */
.topbar a.topbar-link{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border-radius:999px;color:var(--ink-muted);text-decoration:none;white-space:nowrap;transition:background .18s var(--ease),color .18s var(--ease)}
.topbar a.topbar-link:hover,.topbar a.topbar-link:focus-visible{color:#fff;background:rgba(255,255,255,.10)}

/* Program başına renk noktası — üç bağlantı yazıyı okumadan ayırt edilsin. */
.topbar-dot{width:7px;height:7px;border-radius:50%;flex:none;box-shadow:0 0 0 3px rgba(255,255,255,.06)}
.topbar-dot.u-sky{background:var(--sky)}
.topbar-dot.u-cyan{background:var(--cyan)}
.topbar-dot.u-rose{background:var(--rose)}

.topbar a.topbar-more{color:rgba(255,255,255,.5)}

.topbar a.topbar-phone{margin-left:auto;display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border-radius:999px;color:var(--ink-text);font-weight:600;text-decoration:none;white-space:nowrap;transition:background .18s var(--ease),color .18s var(--ease)}
.topbar a.topbar-phone:hover,.topbar a.topbar-phone:focus-visible{background:rgba(255,255,255,.10);color:#fff}
.topbar a.topbar-phone svg{color:var(--emerald)}

.topbar a.topbar-mini{display:none}

@media (max-width:899px){
	.topbar .topbar-full{display:none}
	.topbar a.topbar-mini{display:inline-flex}
}
@media (max-width:479px){
	.topbar-in{gap:6px}
	.topbar-label span{display:none}          /* yalnızca kulaklık ikonu kalır */
	.topbar a.topbar-link,.topbar a.topbar-phone{padding:5px 8px}
}
