/* Destech Hasar Çözümleri — site stili (framework yok; tüm sayfalar bu dosyayı kullanır) */

:root {
	--kirmizi: #d12326;
	--kirmizi-koyu: #a8181b;
	--koyu: #15181d;
	--koyu-2: #20242b;
	--metin: #2b2f36;
	--soluk: #5f6673;
	--cizgi: #e6e8ec;
	--zemin: #f5f6f8;
	--beyaz: #fff;
	--radius: 14px;
	--golge: 0 10px 30px rgba(21, 24, 29, .08);
	--golge-buyuk: 0 20px 50px rgba(21, 24, 29, .14);
	--kap: 1200px;
	--baslik-font: "Montserrat", system-ui, sans-serif;
	--govde-font: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	font: 400 16px/1.65 var(--govde-font);
	color: var(--metin);
	background: var(--beyaz);
	-webkit-font-smoothing: antialiased;
}
img, svg, video, iframe { max-width: 100%; }
img { display: block; height: auto; }
a { color: var(--kirmizi); text-decoration: none; }
a:hover { color: var(--kirmizi-koyu); }
h1, h2, h3, h4 { font-family: var(--baslik-font); color: var(--koyu); line-height: 1.25; margin: 0 0 .6em; }
h1 { font-size: clamp(2rem, 4.5vw, 3.25rem); font-weight: 700; }
h2 { font-size: clamp(1.6rem, 3vw, 2.25rem); font-weight: 700; }
h3 { font-size: 1.2rem; font-weight: 600; }
p { margin: 0 0 1em; }
.ikon { width: 1.25em; height: 1.25em; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.gizli { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.kap { width: 100%; max-width: var(--kap); margin: 0 auto; padding: 0 20px; }

/* Butonlar */
.btn {
	display: inline-flex; align-items: center; gap: .5em;
	padding: .85em 1.5em; border-radius: 999px; border: 2px solid transparent;
	font: 600 .95rem/1 var(--govde-font); cursor: pointer; transition: .2s;
	white-space: nowrap;
}
.btn-ana { background: var(--kirmizi); color: var(--beyaz); }
.btn-ana:hover { background: var(--kirmizi-koyu); color: var(--beyaz); transform: translateY(-1px); }
.btn-cizgi { border-color: rgba(255, 255, 255, .55); color: var(--beyaz); }
.btn-cizgi:hover { background: var(--beyaz); color: var(--koyu); }
.btn-acik { border-color: var(--cizgi); color: var(--koyu); background: var(--beyaz); }
.btn-acik:hover { border-color: var(--kirmizi); color: var(--kirmizi); }
.btn:disabled { opacity: .6; cursor: wait; }

/* Üst menü */
.ust {
	position: sticky; top: 0; z-index: 50;
	background: rgba(21, 24, 29, .92); backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid rgba(255, 255, 255, .06);
}
.ust .kap { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 74px; }
.logo img { height: 34px; width: auto; }
.menu { display: flex; align-items: center; gap: 4px; margin: 0; padding: 0; list-style: none; }
.menu a {
	display: block; padding: .55em .9em; border-radius: 8px;
	color: rgba(255, 255, 255, .82); font-weight: 500; font-size: .95rem;
}
.menu a:hover, .menu a[aria-current="page"] { color: var(--beyaz); background: rgba(255, 255, 255, .08); }
.menu a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--kirmizi); border-radius: 8px 8px 0 0; }
.menu .btn { margin-left: 8px; padding: .7em 1.2em; }
.menu .btn-ana, .menu .btn-ana:hover { color: var(--beyaz); background: var(--kirmizi); box-shadow: none; }
.menu-ac { display: none; background: none; border: 0; color: var(--beyaz); padding: 8px; cursor: pointer; }
.menu-ac .ikon { width: 28px; height: 28px; }

@media (max-width: 960px) {
	.menu-ac { display: block; }
	.menu {
		position: absolute; top: 74px; left: 0; right: 0;
		flex-direction: column; align-items: stretch; gap: 0;
		padding: 12px 20px 20px; background: var(--koyu);
		border-bottom: 1px solid rgba(255, 255, 255, .08);
		display: none;
	}
	.ust.acik .menu { display: flex; }
	.menu a { padding: .9em .5em; border-radius: 0; border-bottom: 1px solid rgba(255, 255, 255, .06); }
	.menu a[aria-current="page"] { box-shadow: inset 3px 0 0 var(--kirmizi); }
	.menu .btn { margin: 12px 0 0; justify-content: center; border-bottom: 0; }
}

/* Hero (ana sayfa) */
.hero {
	position: relative; isolation: isolate; color: var(--beyaz);
	min-height: min(88vh, 760px); display: flex; align-items: center;
	background: var(--koyu);
}
.hero-gorsel { position: absolute; inset: 0; z-index: -2; }
.hero-gorsel img { width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: 0; transition: opacity 1.2s ease; position: absolute; inset: 0; }
.hero-gorsel img.aktif { opacity: 1; }
.hero::after {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(100deg, rgba(21, 24, 29, .92) 0%, rgba(21, 24, 29, .7) 45%, rgba(21, 24, 29, .25) 100%);
}
.hero-icerik { max-width: 640px; padding: 80px 0; }
.hero h1 { color: var(--beyaz); }
.hero h1 span { color: var(--kirmizi); }
.hero p { font-size: 1.15rem; color: rgba(255, 255, 255, .82); max-width: 560px; }
.etiket {
	display: inline-block; margin-bottom: 18px; padding: .35em .9em; border-radius: 999px;
	background: rgba(209, 35, 38, .16); color: #ff8a8c; font: 600 .78rem/1.4 var(--govde-font);
	letter-spacing: .12em; text-transform: uppercase;
}
.hero-butonlar { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

/* Rakamlar */
.rakamlar { position: relative; z-index: 2; margin-top: -56px; }
.rakamlar .kap > div {
	display: grid; grid-template-columns: repeat(4, 1fr);
	background: var(--beyaz); border-radius: var(--radius); box-shadow: var(--golge-buyuk); overflow: hidden;
}
.rakam { padding: 28px 24px; border-right: 1px solid var(--cizgi); }
.rakam:last-child { border-right: 0; }
.rakam strong { display: block; font: 700 1.9rem/1.1 var(--baslik-font); color: var(--kirmizi); }
.rakam span { color: var(--soluk); font-size: .92rem; }
@media (max-width: 760px) {
	.rakamlar .kap > div { grid-template-columns: repeat(2, 1fr); }
	.rakam:nth-child(2) { border-right: 0; }
	.rakam:nth-child(-n+2) { border-bottom: 1px solid var(--cizgi); }
}

/* Bölümler */
.bolum { padding: 96px 0; }
.bolum-gri { background: var(--zemin); }
.bolum-koyu { background: var(--koyu); color: rgba(255, 255, 255, .8); }
.bolum-koyu h2, .bolum-koyu h3 { color: var(--beyaz); }
.bolum-baslik { max-width: 680px; margin: 0 auto 52px; text-align: center; }
.bolum-baslik p { color: var(--soluk); font-size: 1.08rem; }
.bolum-baslik .ust-baslik, .ust-baslik {
	display: block; margin-bottom: 10px; color: var(--kirmizi);
	font: 600 .8rem/1 var(--govde-font); letter-spacing: .16em; text-transform: uppercase;
}
@media (max-width: 760px) { .bolum { padding: 64px 0; } }

.izgara { display: grid; gap: 24px; }
.izgara-2 { grid-template-columns: repeat(2, 1fr); }
.izgara-3 { grid-template-columns: repeat(3, 1fr); }
.izgara-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 960px) { .izgara-3, .izgara-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .izgara-2, .izgara-3, .izgara-4 { grid-template-columns: 1fr; } }

/* Kartlar */
.kart {
	position: relative; display: flex; flex-direction: column;
	background: var(--beyaz); border: 1px solid var(--cizgi); border-radius: var(--radius);
	padding: 28px; transition: .25s; height: 100%;
}
.kart:hover { box-shadow: var(--golge); transform: translateY(-3px); border-color: transparent; }
.kart p { color: var(--soluk); }
.kart .devam { margin-top: auto; font-weight: 600; display: inline-flex; align-items: center; gap: .35em; background: none; border: 0; padding: 0; color: var(--kirmizi); cursor: pointer; font-size: .95rem; font-family: inherit; align-self: flex-start; }
.kart-ikon {
	width: 52px; height: 52px; border-radius: 12px; margin-bottom: 20px;
	display: grid; place-items: center; background: rgba(209, 35, 38, .1); color: var(--kirmizi);
}
.kart-ikon .ikon { width: 26px; height: 26px; }

/* Ürün kartları (çözümler) — ikonlar sabit kare kutuda, oran bozulmaz */
.urun { padding: 24px; }
.urun-gorsel {
	width: 88px; aspect-ratio: 1; border-radius: 20px; overflow: hidden; margin-bottom: 20px;
	background: var(--zemin); box-shadow: 0 6px 18px rgba(21, 24, 29, .1);
}
.urun-gorsel img { width: 100%; height: 100%; object-fit: cover; }
.urun ul { margin: 0 0 1em; padding-left: 1.1em; color: var(--soluk); }

/* Görselli iki kolon */
.ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.ikili-gorsel { border-radius: var(--radius); overflow: hidden; box-shadow: var(--golge-buyuk); aspect-ratio: 4 / 3; }
.ikili-gorsel img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 900px) { .ikili { grid-template-columns: 1fr; gap: 36px; } }

.liste-tik { list-style: none; padding: 0; margin: 0 0 1.5em; display: grid; gap: 10px; }
.liste-tik li { display: flex; gap: 10px; align-items: flex-start; }
.liste-tik .ikon { color: var(--kirmizi); margin-top: .2em; }
.liste-tik.iki-kolon { grid-template-columns: 1fr 1fr; }
@media (max-width: 520px) { .liste-tik.iki-kolon { grid-template-columns: 1fr; } }

/* Platform kutuları */
.platform {
	position: relative; overflow: hidden; border-radius: var(--radius); padding: 40px;
	background: var(--koyu-2); color: rgba(255, 255, 255, .8); min-height: 260px;
	display: flex; flex-direction: column; justify-content: flex-end;
}
.platform h3 { color: var(--beyaz); font-size: 1.5rem; }
.platform img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .28; z-index: 0; }
.platform > *:not(img) { position: relative; z-index: 1; }
.platform .btn { align-self: flex-start; }
.platform-kirmizi { background: linear-gradient(135deg, var(--kirmizi), #7d0f12); }

/* Haberler */
.haber { padding: 0; overflow: hidden; }
.haber-gorsel { aspect-ratio: 4 / 3; background: var(--zemin); overflow: hidden; }
.haber-gorsel img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .5s; }
.haber:hover .haber-gorsel img { transform: scale(1.04); }
.haber-gorsel.bos { display: grid; place-items: center; background: linear-gradient(135deg, var(--koyu-2), var(--koyu)); }
.haber-gorsel.bos img { width: 96px; height: auto; object-fit: contain; opacity: .9; }
.haber:hover .haber-gorsel.bos img { transform: none; }
.haber-govde { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.haber-meta { display: flex; gap: 14px; font-size: .82rem; color: var(--soluk); margin-bottom: 10px; }
.haber-meta b { color: var(--kirmizi); font-weight: 600; }
.haber h3 { font-size: 1.1rem; }

/* Alt sayfa başlığı */
.sayfa-baslik {
	position: relative; isolation: isolate; color: var(--beyaz);
	padding: 110px 0 80px; background: var(--koyu);
}
.sayfa-baslik img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.sayfa-baslik::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(21, 24, 29, .92), rgba(21, 24, 29, .55)); }
.sayfa-baslik h1 { color: var(--beyaz); margin-bottom: .3em; }
.sayfa-baslik p { color: rgba(255, 255, 255, .78); max-width: 620px; margin: 0; font-size: 1.08rem; }
.yol { display: flex; gap: 8px; font-size: .85rem; color: rgba(255, 255, 255, .6); margin-bottom: 14px; }
.yol a { color: rgba(255, 255, 255, .75); }
.yol a:hover { color: var(--beyaz); }

/* Yönetim */
.kisi { display: grid; grid-template-columns: 320px 1fr; gap: 40px; align-items: start; }
.kisi-foto { border-radius: var(--radius); overflow: hidden; aspect-ratio: 4 / 5; box-shadow: var(--golge); }
.kisi-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 35% center; }
.kisi .gorev { color: var(--kirmizi); font-weight: 600; margin-bottom: 1em; }
@media (max-width: 760px) { .kisi { grid-template-columns: 1fr; } .kisi-foto { max-width: 320px; } }

/* İletişim */
.iletisim-izgara { display: grid; grid-template-columns: 1fr 1.15fr; gap: 48px; align-items: start; }
@media (max-width: 960px) { .iletisim-izgara { grid-template-columns: 1fr; } }
.bilgi-liste { display: grid; gap: 14px; margin-bottom: 28px; }
.bilgi { display: flex; gap: 16px; align-items: flex-start; padding: 18px; border: 1px solid var(--cizgi); border-radius: 12px; background: var(--beyaz); }
.bilgi .kart-ikon { margin: 0; width: 44px; height: 44px; flex: none; }
.bilgi .kart-ikon .ikon { width: 22px; height: 22px; }
.bilgi small { display: block; color: var(--soluk); font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.bilgi strong, .bilgi a { color: var(--koyu); font-weight: 600; }
.bilgi a:hover { color: var(--kirmizi); }
.harita { border-radius: var(--radius); overflow: hidden; border: 1px solid var(--cizgi); aspect-ratio: 16 / 10; }
.harita iframe { width: 100%; height: 100%; border: 0; display: block; }
.resmi { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 18px; font-size: .9rem; }
.resmi div { background: var(--zemin); border-radius: 10px; padding: 12px 14px; }
.resmi small { display: block; color: var(--soluk); font-size: .75rem; }
@media (max-width: 520px) { .resmi { grid-template-columns: 1fr; } }

/* Formlar */
.form-kutu { background: var(--beyaz); border-radius: var(--radius); box-shadow: var(--golge-buyuk); padding: 36px; }
@media (max-width: 520px) { .form-kutu { padding: 24px 18px; } }
.alanlar { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.alan { display: flex; flex-direction: column; gap: 6px; }
.alan.tam { grid-column: 1 / -1; }
@media (max-width: 560px) { .alanlar { grid-template-columns: 1fr; } }
.alan label { font-weight: 600; font-size: .88rem; color: var(--koyu); }
.alan input, .alan select, .alan textarea {
	width: 100%; padding: .8em 1em; border: 1.5px solid var(--cizgi); border-radius: 10px;
	font: inherit; color: var(--metin); background: var(--beyaz); transition: border-color .2s, box-shadow .2s;
}
.alan textarea { min-height: 150px; resize: vertical; }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: 0; border-color: var(--kirmizi); box-shadow: 0 0 0 4px rgba(209, 35, 38, .12); }
.onay { display: flex; gap: 10px; align-items: flex-start; font-size: .88rem; color: var(--soluk); }
.onay input { margin-top: .3em; width: 18px; height: 18px; accent-color: var(--kirmizi); flex: none; }
.form-alt { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; justify-content: space-between; margin-top: 8px; }
.g-recaptcha { min-height: 78px; }

.alert { position: relative; padding: 14px 44px 14px 16px; border-radius: 10px; margin-bottom: 18px; font-size: .95rem; }
.alert-success { background: #e9f7ef; color: #17643a; border: 1px solid #b9e4cb; }
.alert-danger { background: #fdecec; color: #8f1416; border: 1px solid #f5c2c3; }
.alert .close { position: absolute; top: 8px; right: 10px; border: 0; background: none; font-size: 1.4rem; line-height: 1; cursor: pointer; color: inherit; opacity: .6; }

/* Yasal metinler */
.metin { max-width: 860px; margin: 0 auto; }
.metin h2 { font-size: 1.5rem; margin-top: 1.8em; }
.metin h3, .metin h4 { margin-top: 1.5em; }
.metin li { margin-bottom: .4em; }
.tablo-kap { overflow-x: auto; margin: 1.5em 0; border: 1px solid var(--cizgi); border-radius: 12px; }
.metin table { width: 100%; border-collapse: collapse; font-size: .9rem; min-width: 560px; }
.metin th, .metin td { padding: 10px 14px; border-bottom: 1px solid var(--cizgi); text-align: left; vertical-align: top; }
.metin th { background: var(--zemin); font-weight: 600; color: var(--koyu); }

/* Modal (dialog) */
dialog.detay {
	width: min(620px, calc(100% - 32px)); border: 0; border-radius: var(--radius);
	padding: 0; box-shadow: var(--golge-buyuk); color: var(--metin);
}
dialog.detay::backdrop { background: rgba(21, 24, 29, .6); backdrop-filter: blur(3px); }
.detay-icerik { padding: 36px; }
.detay-icerik h3 { font-size: 1.4rem; }
.detay-kapat { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--zemin); cursor: pointer; font-size: 1.4rem; line-height: 1; color: var(--koyu); }

/* Çağrı bandı */
.cagri { background: linear-gradient(120deg, var(--kirmizi), #8e1215); color: var(--beyaz); padding: 64px 0; }
.cagri .kap { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.cagri h2 { color: var(--beyaz); margin-bottom: .2em; font-size: clamp(1.4rem, 2.5vw, 2rem); }
.cagri p { margin: 0; color: rgba(255, 255, 255, .85); }
.cagri .btn-acik { border-color: var(--beyaz); }
.cagri .btn-acik:hover { color: var(--kirmizi-koyu); border-color: var(--beyaz); }

/* Footer */
.alt { background: var(--koyu); color: rgba(255, 255, 255, .65); padding: 72px 0 0; font-size: .94rem; }
.alt-izgara { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.3fr; gap: 40px; padding-bottom: 48px; }
@media (max-width: 960px) { .alt-izgara { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .alt-izgara { grid-template-columns: 1fr; } }
.alt h4 { color: var(--beyaz); font-size: .95rem; letter-spacing: .06em; text-transform: uppercase; margin-bottom: 1.1em; }
.alt ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.alt a { color: rgba(255, 255, 255, .72); }
.alt a:hover { color: var(--beyaz); }
.alt .logo img { height: 32px; margin-bottom: 18px; }
.alt-iletisim li { display: flex; gap: 10px; align-items: flex-start; }
.alt-iletisim .ikon { color: var(--kirmizi); margin-top: .25em; }
.sosyal { display: flex; gap: 10px; margin-top: 18px; }
.sosyal a { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .08); }
.sosyal a:hover { background: var(--kirmizi); }
.alt-taban { border-top: 1px solid rgba(255, 255, 255, .08); padding: 22px 0; font-size: .85rem; }
.alt-taban .kap { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; }

.yukari {
	position: fixed; right: 18px; bottom: 18px; z-index: 40; width: 46px; height: 46px; border-radius: 50%;
	border: 0; background: var(--kirmizi); color: var(--beyaz); display: grid; place-items: center; cursor: pointer;
	box-shadow: var(--golge); opacity: 0; pointer-events: none; transition: .25s;
}
.yukari.goster { opacity: 1; pointer-events: auto; }

/* Görünür olunca hafif belirme */
@media (prefers-reduced-motion: no-preference) {
	.js .belir { opacity: 0; transform: translateY(18px); transition: opacity .6s ease, transform .6s ease; }
	.js .belir.gorundu { opacity: 1; transform: none; }
}