/* =========================================================================
   00 — Yazı tipleri ve tasarım jetonları
   Kaynak: Claude Design "Alotesis Su Tesisatı Website Tasarımı"
   ========================================================================= */

/* Anton — başlıklar. Türkçe için latin-ext ŞART (ğ ş ı İ ç ö ü). */
@font-face {
	font-family: 'Anton';
	src: url('../fonts/anton-latin-ext.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Anton';
	src: url('../fonts/anton-latin.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Figtree — gövde. Değişken yazı tipi, 400-800 tek dosyada. */
@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-latin-ext.woff2') format('woff2');
	font-weight: 400 800;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
	font-family: 'Figtree';
	src: url('../fonts/figtree-latin.woff2') format('woff2');
	font-weight: 400 800;
	font-style: normal;
	font-display: swap;
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
	/* Renkler */
	--at-mavi: #0E7BDD;
	--at-mavi-koyu: #0B5FB6;
	--at-mavi-acik: #2FA4FF;
	--at-turuncu: #E9490D;
	--at-turuncu-acik: #FF8A1E;
	--at-turuncu-vurgu: #FFA34D;
	--at-turuncu-solgun: #FFB36B;
	--at-lacivert: #0A1C30;
	--at-lacivert-koyu: #071527;
	--at-metin: #17293D;
	--at-metin-orta: #33475C;
	--at-metin-koyu-orta: #45586E;
	--at-metin-ikincil: #5A6E84;
	--at-metin-solgun: #8296AB;
	--at-zemin: #F4F7FB;
	--at-zemin-acik: #F4F8FC;
	--at-beyaz: #fff;
	--at-kenar: #E1E9F2;
	--at-kenar-orta: #D5E2EF;
	--at-kenar-vurgu: #BFD6EC;
	--at-yesil: #1EBE5D;
	--at-yesil-canli: #2ED573;

	/* Koyu zemin üstü metinler */
	--at-koyu-metin: #B9CBDE;
	--at-koyu-metin-acik: #DDE8F2;
	--at-koyu-metin-nav: #D8E4EF;
	--at-koyu-metin-govde: #C6D8EA;
	--at-koyu-metin-solgun: #A9BFD4;
	--at-koyu-metin-cip: #E4EEF7;
	--at-koyu-metin-alt: #8FA6BC;
	--at-koyu-metin-telif: #5F768D;

	/* Gradyanlar */
	--at-grad-hero: linear-gradient(120deg, #0B5FB6 0%, #083D79 55%, #0A2C56 100%);
	--at-grad-cta: linear-gradient(135deg, #FF8A1E, #E9490D);
	--at-grad-cta-yatay: linear-gradient(120deg, #FF8A1E, #E9490D);
	--at-grad-mavi: linear-gradient(120deg, #0B5FB6, #083D79);
	--at-grad-elmas-mavi: linear-gradient(135deg, #2FA4FF, #0E5FB0);

	/* Ölçüler */
	--at-kap: 1180px;
	--at-kap-dar: 860px;
	--at-bosluk: 24px;

	/* Köşe yarıçapları */
	--at-r-cip: 100px;
	--at-r-dugme: 14px;
	--at-r-dugme-kucuk: 12px;
	--at-r-kart: 16px;
	--at-r-kart-kucuk: 14px;
	--at-r-panel: 24px;
	--at-r-panel-buyuk: 26px;
	--at-r-gorsel: 18px;

	/* Gölgeler */
	--at-golge-nav: 0 2px 14px rgba(4, 15, 28, .35);
	--at-golge-kart: 0 12px 28px rgba(10, 44, 86, .12);
	--at-golge-kart-kucuk: 0 8px 20px rgba(10, 44, 86, .1);
	--at-golge-cta: 0 10px 24px rgba(233, 73, 13, .4);
	--at-golge-cta-kucuk: 0 6px 16px rgba(233, 73, 13, .35);
	--at-golge-beyaz: 0 10px 24px rgba(120, 30, 0, .25);
	--at-golge-rozet: 0 8px 24px rgba(4, 15, 28, .3);
	--at-golge-yuzen: 0 10px 26px rgba(120, 30, 0, .35);
	--at-golge-yuzen-yesil: 0 10px 26px rgba(10, 60, 30, .35);

	/* Yazı tipleri */
	--at-font-baslik: 'Anton', 'Arial Narrow', Impact, sans-serif;
	--at-font-govde: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
}
/* =========================================================================
   10 — Temel: sıfırlama, tipografi, erişilebilirlik
   ========================================================================= */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		transition-duration: .01ms !important;
	}
}

body {
	margin: 0;
	padding: 0;
	background: var(--at-zemin);
	font-family: var(--at-font-govde);
	font-size: 16px;
	line-height: 1.6;
	color: var(--at-metin);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-wrap: break-word;
}

img,
svg,
video {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: var(--at-mavi);
	text-decoration: none;
	transition: color .15s ease;
}

a:hover,
a:focus-visible {
	color: var(--at-turuncu);
}

:focus-visible {
	outline: 3px solid var(--at-turuncu-acik);
	outline-offset: 2px;
}

h1,
h2,
h3,
h4 {
	margin: 0;
	line-height: 1.15;
}

p {
	margin: 0 0 1em;
}

p:last-child {
	margin-bottom: 0;
}

ul,
ol {
	margin: 0 0 1em;
	padding-left: 1.25em;
}

/* Anton başlıklar — tasarımda tüm büyük başlıklar bu yazı tipiyle */
.at-anton {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	letter-spacing: .4px;
}

/* Bölüm üstü küçük turuncu etiket */
.at-etiket {
	color: var(--at-turuncu);
	font-weight: 800;
	font-size: 13px;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.at-etiket--ortala {
	display: block;
	text-align: center;
}

/* 45° döndürülmüş elmas süsü — tasarımdaki kare işaretçiler */
.at-elmas {
	width: 12px;
	height: 12px;
	display: inline-block;
	transform: rotate(45deg);
	border-radius: 2px;
	background: var(--at-grad-cta);
	flex-shrink: 0;
}

.at-elmas--mavi {
	background: var(--at-grad-elmas-mavi);
}

.at-yildiz {
	color: var(--at-turuncu-acik);
	letter-spacing: 2px;
	font-size: 15px;
	line-height: 1;
}

.at-ikon {
	flex-shrink: 0;
}

/* Ekran okuyucu metni */
.at-gizli,
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* İçeriğe atlama bağlantısı — mobil taşma taramasında HARİÇ TUTULUR */
.at-atla {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100;
	background: var(--at-turuncu);
	color: #fff;
	font-weight: 800;
	padding: 12px 20px;
	border-radius: 0 0 var(--at-r-dugme-kucuk) 0;
}

.at-atla:focus {
	left: 0;
	color: #fff;
}

/* Sayfalama */
.at-ana .pagination,
.at-ana .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 32px;
	justify-content: center;
}

.at-ana .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	min-height: 42px;
	padding: 0 12px;
	border: 1px solid var(--at-kenar-orta);
	border-radius: var(--at-r-dugme-kucuk);
	background: var(--at-beyaz);
	font-weight: 700;
	color: var(--at-metin);
}

.at-ana .page-numbers.current {
	background: var(--at-mavi);
	border-color: var(--at-mavi);
	color: #fff;
}
/* =========================================================================
   20 — Düzen: kapsayıcı, bölüm, ızgara, düğme, çip, kart
   ========================================================================= */

.at-kap {
	max-width: var(--at-kap);
	margin: 0 auto;
	padding-left: var(--at-bosluk);
	padding-right: var(--at-bosluk);
}

.at-kap--dar {
	max-width: var(--at-kap-dar);
}

.at-bolum {
	padding-top: 72px;
}

.at-bolum--sik {
	padding-top: 64px;
}

.at-bolum--ince {
	padding-top: 22px;
}

.at-bolum__bas {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	margin-bottom: 28px;
}

.at-bolum__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 40px;
	letter-spacing: .4px;
	margin: 8px 0 0;
}

.at-bolum__baslik--kucuk {
	font-size: 34px;
}

.at-bolum__baslik--mini {
	font-size: 30px;
}

.at-bolum__bag {
	color: var(--at-mavi);
	font-weight: 700;
	font-size: 15px;
	white-space: nowrap;
	/* Dokunma hedefi. */
	display: inline-flex;
	align-items: center;
	min-height: 40px;
}

/* --- Izgaralar --------------------------------------------------------- */

.at-izgara {
	display: grid;
	gap: 18px;
}

.at-izgara--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.at-izgara--3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.at-izgara--4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.at-ikili {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 56px;
	align-items: center;
}

/* --- Düğmeler ---------------------------------------------------------- */

.at-dugme {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: inherit;
	font-weight: 800;
	text-align: center;
	border: none;
	border-radius: var(--at-r-dugme);
	cursor: pointer;
	transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
	min-height: 44px;
}

.at-dugme:hover {
	transform: translateY(-1px);
}

.at-dugme:active {
	transform: translateY(0);
}

.at-dugme--ara {
	background: var(--at-grad-cta);
	color: #fff;
	font-size: 19px;
	padding: 16px 28px;
	box-shadow: var(--at-golge-cta);
}

.at-dugme--ara:hover,
.at-dugme--ara:focus-visible {
	color: #fff;
}

.at-dugme--wa {
	background: var(--at-yesil);
	color: #fff;
	font-weight: 700;
	font-size: 17px;
	padding: 16px 24px;
}

.at-dugme--wa:hover,
.at-dugme--wa:focus-visible {
	color: #fff;
	background: #17a350;
}

.at-dugme--beyaz {
	background: #fff;
	color: var(--at-turuncu);
	font-size: 20px;
	padding: 16px 30px;
	box-shadow: var(--at-golge-beyaz);
}

.at-dugme--beyaz:hover,
.at-dugme--beyaz:focus-visible {
	color: var(--at-turuncu);
}

.at-dugme--hayalet {
	background: rgba(255, 255, 255, .14);
	border: 1.5px solid rgba(255, 255, 255, .6);
	color: #fff;
	font-weight: 700;
	font-size: 17px;
	padding: 16px 26px;
}

.at-dugme--hayalet:hover,
.at-dugme--hayalet:focus-visible {
	color: #fff;
	background: rgba(255, 255, 255, .24);
}

.at-dugme-grup {
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	align-items: center;
}

.at-dugme-grup--ortala {
	justify-content: center;
}

/* --- Çipler ------------------------------------------------------------ */

.at-cipler {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.at-cip {
	display: inline-block;
	border: 1px solid var(--at-kenar-orta);
	background: var(--at-zemin-acik);
	color: var(--at-metin);
	font-weight: 600;
	font-size: 14.5px;
	padding: 9px 16px;
	border-radius: var(--at-r-cip);
	transition: border-color .15s ease, color .15s ease;
}

a.at-cip:hover,
a.at-cip:focus-visible {
	border-color: var(--at-mavi);
	color: var(--at-mavi);
}

.at-cip--beyaz {
	background: var(--at-beyaz);
	font-size: 14px;
	padding: 8px 15px;
}

/* Koyu panel üstündeki çipler */
.at-cip--koyu {
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .14);
	color: var(--at-koyu-metin-cip);
	font-size: 14.5px;
	padding: 10px 18px;
}

/* Hero üstündeki yarı saydam güven çipleri */
.at-cip--guven {
	background: rgba(255, 255, 255, .1);
	border: none;
	color: var(--at-koyu-metin-cip);
	font-size: 13px;
	font-weight: 600;
	padding: 7px 13px;
}

/* Rozet — hero üstündeki ince çerçeveli etiket */
.at-rozet {
	display: inline-block;
	background: rgba(255, 138, 30, .16);
	border: 1px solid rgba(255, 163, 77, .45);
	color: var(--at-turuncu-solgun);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 1.2px;
	padding: 7px 14px;
	border-radius: var(--at-r-cip);
}

.at-rozet--acik {
	background: rgba(233, 73, 13, .08);
	border-color: rgba(233, 73, 13, .3);
	color: var(--at-turuncu);
}

/* --- Kartlar ----------------------------------------------------------- */

.at-kart {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart);
	padding: 24px;
	color: var(--at-metin);
	transition: box-shadow .15s ease, border-color .15s ease;
}

a.at-kart:hover,
a.at-kart:focus-visible {
	box-shadow: var(--at-golge-kart);
	border-color: var(--at-kenar-vurgu);
	color: var(--at-metin);
}

/* --- Paneller ---------------------------------------------------------- */

.at-panel {
	border-radius: var(--at-r-panel);
	padding: 44px 48px;
}

.at-panel--koyu {
	background: var(--at-lacivert);
	color: #fff;
}

.at-panel--beyaz {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
}

.at-panel--turuncu {
	background: var(--at-grad-cta-yatay);
	color: #fff;
	text-align: center;
	padding: 48px 56px;
}

.at-panel--koyu .at-panel__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 32px;
	color: #fff;
	margin: 0 0 8px;
	letter-spacing: .4px;
}

.at-panel--koyu .at-panel__alt {
	color: var(--at-koyu-metin-solgun);
	font-size: 15px;
	margin: 0 0 22px;
}

/* --- Görsel çerçevesi -------------------------------------------------- */

.at-gorsel {
	position: relative;
	min-width: 0;
	border-radius: var(--at-r-gorsel);
	overflow: hidden;
}

.at-gorsel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.at-gorsel--hero {
	height: 430px;
}

.at-gorsel--ic {
	height: 420px;
}

.at-gorsel--yan {
	height: 400px;
}

.at-gorsel--bolge {
	height: 360px;
}

/* Görselin üstündeki beyaz not kartı */
.at-foto-not {
	position: absolute;
	left: 16px;
	bottom: 16px;
	background: #fff;
	border-radius: var(--at-r-dugme-kucuk);
	padding: 10px 16px;
	box-shadow: var(--at-golge-rozet);
	pointer-events: none;
	max-width: calc(100% - 32px);
}

.at-foto-not__baslik {
	font-weight: 800;
	font-size: 14.5px;
	color: var(--at-metin);
}

.at-foto-not__alt {
	font-size: 13px;
	color: var(--at-metin-ikincil);
	margin-top: 2px;
}

.at-foto-not--puan {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
}

.at-foto-not--puan .at-foto-not__baslik {
	white-space: nowrap;
}
/* =========================================================================
   30 — Sayfa çerçevesi: üst bant, gezinme, kırıntı, alt bilgi, yüzen CTA

   ÖNEMLİ: Yalnız mobilde görünecek öğeler (.at-nav__ac, .at-nav__panel,
   .at-alt-cubuk) BURADA display:none ile tanımlanır; 90-responsive.css
   içinde açılır. Kuralı sadece @media (max-width:…) içine yazmak yetmez —
   sorgu dışında öğe varsayılan display değeriyle render olur ve masaüstünde
   görünür kalır.
   ========================================================================= */

/* --- Üst bant ---------------------------------------------------------- */

.at-ust-bant {
	background: var(--at-lacivert-koyu);
	color: var(--at-koyu-metin);
	font-size: 13.5px;
}

.at-ust-bant__ic {
	max-width: var(--at-kap);
	margin: 0 auto;
	padding: 8px var(--at-bosluk);
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}

.at-ust-bant__durum {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	color: var(--at-koyu-metin-acik);
}

.at-ust-bant__nokta {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--at-yesil-canli);
	display: inline-block;
	flex-shrink: 0;
}

.at-ust-bant__sag {
	display: flex;
	align-items: center;
	gap: 18px;
}

.at-ust-bant__tel {
	color: var(--at-turuncu-solgun);
	font-weight: 700;
	/* Dokunma hedefi: satır içi bağlantı 19px kalıyordu. */
	display: inline-block;
	padding: 5px 0;
	min-height: 26px;
}

.at-ust-bant__tel:hover,
.at-ust-bant__tel:focus-visible {
	color: #fff;
}

/* --- Gezinme ----------------------------------------------------------- */

.at-nav {
	background: var(--at-lacivert);
	position: sticky;
	top: 0;
	z-index: 40;
	box-shadow: var(--at-golge-nav);
}

.at-nav__ic {
	max-width: var(--at-kap);
	margin: 0 auto;
	padding: 14px var(--at-bosluk);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}

.at-nav__logo {
	display: flex;
	align-items: center;
	/* flex-shrink:0 VERİLMEZ: dar ekranda logo küçülebilmeli, yoksa
	   flex-wrap devreye girip başlık iki satıra çıkar. */
	min-width: 0;
	/* Metin yedeğinde bağlantı 27px kalıyordu; dokunma hedefi. */
	min-height: 40px;
}

.at-nav__logo img {
	height: 52px;
	width: auto;
	max-width: 100%;
	display: block;
}

.at-nav__logo-metin {
	font-family: var(--at-font-baslik);
	font-size: 24px;
	color: #fff;
	letter-spacing: .5px;
	white-space: nowrap;
}

.at-nav__menu {
	display: flex;
	align-items: center;
	gap: 26px;
	font-weight: 600;
	font-size: 15px;
	list-style: none;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.at-nav__menu a {
	color: var(--at-koyu-metin-nav);
	white-space: nowrap;
}

.at-nav__menu a:hover,
.at-nav__menu a:focus-visible,
.at-nav__menu .current-menu-item > a,
.at-nav__menu .current_page_item > a,
.at-nav__menu .at-aktif > a {
	color: var(--at-turuncu-vurgu);
}

.at-nav__cta {
	background: var(--at-grad-cta);
	color: #fff;
	font-weight: 800;
	padding: 12px 22px;
	border-radius: var(--at-r-dugme-kucuk);
	font-size: 15.5px;
	box-shadow: var(--at-golge-cta-kucuk);
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
}

.at-nav__cta:hover,
.at-nav__cta:focus-visible {
	color: #fff;
}

/* Mobil menü düğmesi ve paneli — TEMEL kuralda gizli, medya sorgusunda açılır */
.at-nav__ac {
	display: none;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: var(--at-r-dugme-kucuk);
	color: #fff;
	cursor: pointer;
	flex-shrink: 0;
}

.at-nav__panel {
	display: none;
	background: var(--at-lacivert);
	border-top: 1px solid rgba(255, 255, 255, .1);
	padding: 12px var(--at-bosluk) 20px;
}

.at-nav__panel ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 2px;
}

.at-nav__panel a {
	display: block;
	padding: 13px 4px;
	color: var(--at-koyu-metin-nav);
	font-weight: 700;
	font-size: 16px;
	border-bottom: 1px solid rgba(255, 255, 255, .07);
}

.at-nav__panel a:hover,
.at-nav__panel a:focus-visible {
	color: var(--at-turuncu-vurgu);
}

.at-menu-acik {
	overflow: hidden;
}

/* --- Kırıntı ----------------------------------------------------------- */

.at-kirinti {
	font-size: 13.5px;
	color: var(--at-metin-solgun);
	margin-bottom: 18px;
}

.at-kirinti ol {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.at-kirinti a {
	color: var(--at-metin-solgun);
}

.at-kirinti a:hover,
.at-kirinti a:focus-visible {
	color: var(--at-mavi);
}

.at-kirinti__ayrac {
	color: var(--at-kenar-orta);
}

.at-kirinti li[aria-current='page'] {
	color: var(--at-metin);
	font-weight: 600;
}

/* --- Ana içerik -------------------------------------------------------- */

.at-ana {
	display: block;
	padding-top: 44px;
	padding-bottom: 0;
}

.at-ana--sifir {
	padding-top: 0;
}

/* --- Alt bilgi --------------------------------------------------------- */

.at-alt {
	background: var(--at-lacivert-koyu);
	margin-top: 72px;
}

.at-alt__ic {
	max-width: var(--at-kap);
	margin: 0 auto;
	padding: 56px var(--at-bosluk) 0;
	display: grid;
	grid-template-columns: 1.2fr 1fr 1fr;
	gap: 48px;
}

.at-alt__logo img {
	height: 48px;
	width: auto;
}

.at-alt__logo-metin {
	font-family: var(--at-font-baslik);
	font-size: 24px;
	color: #fff;
	letter-spacing: .5px;
}

.at-alt__ozet {
	color: var(--at-koyu-metin-alt);
	font-size: 14.5px;
	line-height: 1.65;
	margin: 16px 0 18px;
	max-width: 320px;
}

.at-alt__tel {
	font-family: var(--at-font-baslik);
	font-size: 26px;
	color: var(--at-turuncu-vurgu);
	letter-spacing: .5px;
	display: inline-block;
}

.at-alt__tel:hover,
.at-alt__tel:focus-visible {
	color: #fff;
}

.at-alt__baslik {
	color: #fff;
	font-weight: 800;
	font-size: 15px;
	margin: 0 0 14px;
}

.at-alt__liste {
	display: grid;
	gap: 9px;
	font-size: 14.5px;
	list-style: none;
	margin: 0;
	padding: 0;
	color: var(--at-koyu-metin-alt);
}

.at-alt__liste a {
	color: var(--at-koyu-metin-alt);
}

.at-alt__liste a:hover,
.at-alt__liste a:focus-visible {
	color: var(--at-turuncu-vurgu);
}

.at-alt__liste strong a,
.at-alt__vurgu {
	color: var(--at-koyu-metin-acik);
	font-weight: 700;
}

.at-alt__bag {
	color: var(--at-turuncu-vurgu);
	font-weight: 700;
	margin-top: 4px;
	/* Dokunma hedefi. */
	display: inline-flex;
	align-items: center;
	min-height: 40px;
}

.at-alt__telif {
	max-width: var(--at-kap);
	margin: 40px auto 0;
	padding: 20px var(--at-bosluk);
	border-top: 1px solid rgba(255, 255, 255, .08);
	display: flex;
	justify-content: space-between;
	gap: 16px;
	color: var(--at-koyu-metin-telif);
	font-size: 13px;
	flex-wrap: wrap;
}

.at-alt__telif a {
	color: var(--at-turuncu-vurgu);
	font-weight: 700;
}

/* --- Yüzen çağrı düğmeleri (masaüstü) ---------------------------------- */

.at-yuzen {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 60;
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-end;
}

.at-yuzen a {
	color: #fff;
	font-weight: 800;
	font-size: 15px;
	padding: 14px 22px;
	border-radius: var(--at-r-cip);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 48px;
}

.at-yuzen__wa {
	background: var(--at-yesil);
	box-shadow: var(--at-golge-yuzen-yesil);
}

.at-yuzen__ara {
	background: var(--at-grad-cta);
	box-shadow: var(--at-golge-yuzen);
}

.at-yuzen a:hover,
.at-yuzen a:focus-visible {
	color: #fff;
}

/* --- Mobil alt çubuk — TEMEL kuralda gizli ----------------------------- */

.at-alt-cubuk {
	display: none;
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 60;
	grid-template-columns: 1fr 1fr;
	gap: 1px;
	background: rgba(7, 21, 39, .2);
	box-shadow: 0 -4px 18px rgba(4, 15, 28, .25);
}

.at-alt-cubuk--tek {
	grid-template-columns: 1fr;
}

.at-alt-cubuk a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 56px;
	color: #fff;
	font-weight: 800;
	font-size: 16px;
}

.at-alt-cubuk a:hover,
.at-alt-cubuk a:focus-visible {
	color: #fff;
}

.at-alt-cubuk__ara {
	background: var(--at-grad-cta);
}

.at-alt-cubuk__wa {
	background: var(--at-yesil);
}
/* =========================================================================
   40 — Anasayfa bölümleri
   ========================================================================= */

/* --- Hero -------------------------------------------------------------- */

.at-hero {
	padding-top: 28px;
}

.at-hero__panel {
	background: var(--at-grad-hero);
	border-radius: var(--at-r-panel-buyuk);
	padding: 52px 56px;
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	gap: 48px;
	align-items: center;
	overflow: hidden;
}

.at-hero__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	color: #fff;
	font-size: clamp(32px, 4.6vw, 56px);
	line-height: 1.06;
	margin: 20px 0 0;
	letter-spacing: .5px;
}

.at-hero__vurgu {
	color: var(--at-turuncu-vurgu);
	display: block;
}

.at-hero__ozet {
	color: var(--at-koyu-metin-govde);
	font-size: 17.5px;
	line-height: 1.65;
	margin: 18px 0 0;
	max-width: 520px;
}

.at-hero__dugmeler {
	margin-top: 28px;
}

.at-hero__cipler {
	margin-top: 26px;
}

/* --- Rakamlar şeridi --------------------------------------------------- */

.at-istatistik {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart);
	padding: 22px 24px;
}

.at-istatistik__sayi {
	font-family: var(--at-font-baslik);
	font-size: 32px;
	color: var(--at-mavi);
	line-height: 1.1;
}

.at-istatistik__metin {
	color: var(--at-metin-ikincil);
	font-size: 14.5px;
	margin-top: 4px;
}

/* --- Hizmet kartları --------------------------------------------------- */

.at-hizmet-kart {
	display: block;
}

.at-hizmet-kart__baslik {
	font-size: 18px;
	font-weight: 800;
	margin: 14px 0 8px;
}

.at-hizmet-kart__ozet {
	font-size: 14.5px;
	line-height: 1.55;
	color: var(--at-metin-ikincil);
	margin: 0;
}

.at-hizmet-kart__devam {
	display: inline-block;
	margin-top: 14px;
	font-weight: 700;
	font-size: 14px;
	color: var(--at-mavi);
}

.at-hizmet-kart__gorsel {
	border-radius: var(--at-r-kart-kucuk);
	overflow: hidden;
	margin-bottom: 14px;
	aspect-ratio: 3 / 2;
}

.at-hizmet-kart__gorsel img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* --- Nasıl çalışır ----------------------------------------------------- */

.at-adimlar {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px;
}

.at-adim__no {
	font-family: var(--at-font-baslik);
	font-size: 42px;
	color: var(--at-turuncu-vurgu);
	line-height: 1;
}

.at-adim__baslik {
	color: #fff;
	font-size: 19px;
	font-weight: 800;
	margin: 10px 0 8px;
}

.at-adim__metin {
	color: var(--at-koyu-metin-solgun);
	font-size: 15px;
	line-height: 1.6;
	margin: 0;
}

.at-nasil__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 36px;
	color: #fff;
	margin: 0 0 34px;
	letter-spacing: .4px;
}

/* --- Neden biz --------------------------------------------------------- */

.at-neden__liste {
	display: grid;
	gap: 20px;
}

.at-neden__oge {
	display: flex;
	gap: 14px;
}

.at-neden__oge .at-elmas {
	width: 10px;
	height: 10px;
	margin-top: 7px;
}

.at-neden__baslik {
	font-weight: 800;
	font-size: 17px;
}

.at-neden__metin {
	color: var(--at-metin-ikincil);
	font-size: 15px;
	line-height: 1.6;
	margin-top: 3px;
}

/* --- Yorumlar ---------------------------------------------------------- */

.at-yorum {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart);
	padding: 26px;
}

.at-yorum__metin {
	font-size: 15px;
	line-height: 1.65;
	color: var(--at-metin-orta);
	margin: 14px 0 18px;
}

.at-yorum__ad {
	font-weight: 800;
	font-size: 14.5px;
}

.at-yorum__etiket {
	color: var(--at-metin-solgun);
	font-size: 13px;
	margin-top: 2px;
}

/* --- Bölgeler ---------------------------------------------------------- */

.at-bolgeler__ozet {
	color: var(--at-metin-ikincil);
	font-size: 15.5px;
	margin: 0 0 22px;
}

/* --- SSS --------------------------------------------------------------- */

.at-sss {
	display: grid;
	gap: 12px;
}

.at-sss__oge {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart-kucuk);
	padding: 18px 22px;
}

.at-sss__soru {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	cursor: pointer;
	font-weight: 800;
	font-size: 16.5px;
	list-style: none;
}

.at-sss__soru::-webkit-details-marker {
	display: none;
}

.at-sss__isaret {
	color: var(--at-turuncu);
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
	flex-shrink: 0;
	transition: transform .15s ease;
}

.at-sss__oge[open] .at-sss__isaret {
	transform: rotate(45deg);
}

.at-sss__cevap {
	color: var(--at-metin-ikincil);
	font-size: 15px;
	line-height: 1.65;
	margin: 12px 0 0;
}

/* --- CTA bandı --------------------------------------------------------- */

.at-cta__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: clamp(28px, 3.6vw, 44px);
	color: #fff;
	margin: 0;
	letter-spacing: .6px;
}

.at-cta__alt {
	color: rgba(255, 255, 255, .92);
	font-size: 17px;
	margin: 14px 0 26px;
}

/* --- SEO metni --------------------------------------------------------- */

.at-seo-metin {
	max-width: var(--at-kap-dar);
}

.at-seo-metin h2 {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 30px;
	margin: 8px 0 14px;
	letter-spacing: .4px;
}

.at-seo-metin h3 {
	font-size: 17px;
	font-weight: 800;
	margin: 22px 0 8px;
}

.at-seo-metin p {
	color: var(--at-metin-ikincil);
	font-size: 15px;
	line-height: 1.75;
	margin: 0 0 16px;
}

.at-seo-metin p:last-child {
	margin-bottom: 0;
}
/* =========================================================================
   50 — İç sayfalar: hizmet, bölge, arşiv, arama, 404, genel sayfa
   ========================================================================= */

/* --- Hizmet / bölge hero ----------------------------------------------- */

.at-ic-hero {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
	gap: 52px;
	align-items: center;
}

.at-ic-hero__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: clamp(30px, 4vw, 50px);
	line-height: 1.08;
	margin: 18px 0 0;
	letter-spacing: .5px;
}

.at-ic-hero__vurgu {
	color: var(--at-turuncu);
}

.at-ic-hero__ozet {
	color: var(--at-metin-koyu-orta);
	font-size: 17px;
	line-height: 1.65;
	margin: 16px 0 0;
	max-width: 520px;
}

.at-ic-hero__artilar {
	display: grid;
	gap: 10px;
	margin: 20px 0 0;
	max-width: 480px;
	list-style: none;
	padding: 0;
}

.at-ic-hero__arti {
	display: flex;
	gap: 10px;
	align-items: center;
	font-size: 15.5px;
	font-weight: 600;
}

.at-ic-hero__onay {
	color: var(--at-mavi);
	font-weight: 800;
	flex-shrink: 0;
}

.at-ic-hero__dugmeler {
	margin-top: 26px;
}

.at-ic-hero__puan {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 18px;
	font-size: 14px;
	font-weight: 700;
	color: var(--at-metin-koyu-orta);
}

/* Bölge hero'su gradyan panelin içinde */
.at-bolge-hero {
	background: var(--at-grad-hero);
	border-radius: var(--at-r-panel-buyuk);
	padding: 48px 56px;
	display: grid;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
	gap: 48px;
	align-items: center;
}

.at-bolge-hero__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	color: #fff;
	font-size: clamp(28px, 3.9vw, 48px);
	line-height: 1.08;
	margin: 18px 0 0;
	letter-spacing: .5px;
}

.at-bolge-hero__vurgu {
	color: var(--at-turuncu-vurgu);
	display: block;
}

.at-bolge-hero__ozet {
	color: var(--at-koyu-metin-govde);
	font-size: 16.5px;
	line-height: 1.65;
	margin: 16px 0 0;
	max-width: 500px;
}

.at-bolge-hero__puan {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 20px;
	font-size: 14px;
	font-weight: 700;
	color: var(--at-koyu-metin-acik);
}

/* --- Süreç adımları (beyaz kart) --------------------------------------- */

.at-surec__kart {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart);
	padding: 26px;
}

.at-surec__no {
	font-family: var(--at-font-baslik);
	font-size: 36px;
	color: var(--at-turuncu);
	line-height: 1;
}

.at-surec__baslik {
	font-size: 18px;
	font-weight: 800;
	margin: 10px 0 6px;
}

.at-surec__metin {
	color: var(--at-metin-ikincil);
	font-size: 14.5px;
	line-height: 1.6;
	margin: 0;
}

/* --- Fiyat bölümü ------------------------------------------------------ */

.at-fiyat {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-panel);
	padding: 44px 48px;
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
	gap: 48px;
	align-items: center;
}

.at-fiyat__liste {
	display: grid;
	gap: 12px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.at-fiyat__oge {
	display: flex;
	gap: 12px;
	font-size: 15.5px;
	color: var(--at-metin-orta);
}

.at-fiyat__oge .at-elmas {
	width: 10px;
	height: 10px;
	margin-top: 6px;
}

.at-fiyat__not {
	color: var(--at-metin-ikincil);
	font-size: 14.5px;
	line-height: 1.6;
	margin: 18px 0 0;
}

.at-fiyat__kutu {
	background: var(--at-grad-cta-yatay);
	border-radius: var(--at-r-gorsel);
	padding: 34px;
	text-align: center;
}

.at-fiyat__kutu-baslik {
	font-family: var(--at-font-baslik);
	font-size: 26px;
	color: #fff;
	letter-spacing: .4px;
	line-height: 1.15;
}

.at-fiyat__kutu-alt {
	color: rgba(255, 255, 255, .92);
	font-size: 14.5px;
	margin: 10px 0 20px;
}

.at-fiyat__kutu-tel {
	display: inline-block;
	background: #fff;
	color: var(--at-turuncu);
	font-weight: 800;
	font-size: 18px;
	padding: 14px 26px;
	border-radius: var(--at-r-dugme-kucuk);
	min-height: 44px;
}

.at-fiyat__kutu-tel:hover,
.at-fiyat__kutu-tel:focus-visible {
	color: var(--at-turuncu);
}

/* --- Detaylı bilgi ----------------------------------------------------- */

.at-detay {
	max-width: var(--at-kap-dar);
}

.at-detay__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 30px;
	margin: 8px 0 4px;
	letter-spacing: .4px;
}

.at-detay h3 {
	font-size: 17px;
	font-weight: 800;
	margin: 22px 0 8px;
}

.at-detay p {
	color: var(--at-metin-ikincil);
	font-size: 15px;
	line-height: 1.75;
	margin: 0;
}

/* --- Diğer hizmetler --------------------------------------------------- */

.at-diger {
	display: flex;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
}

.at-diger__etiket {
	font-weight: 800;
	font-size: 15px;
	color: var(--at-metin-koyu-orta);
}

/* --- Bölge sayfası ----------------------------------------------------- */

.at-mahalleler {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-panel);
	padding: 40px 48px;
}

.at-mahalleler__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 30px;
	margin: 0 0 8px;
	letter-spacing: .4px;
}

.at-mahalleler__ozet {
	color: var(--at-metin-ikincil);
	font-size: 15px;
	margin: 0 0 20px;
}

/* Bölge hizmet bağlantı kartları */
.at-bolge-hizmet {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart-kucuk);
	padding: 20px 22px;
	color: var(--at-metin);
	font-weight: 800;
	font-size: 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	transition: box-shadow .15s ease, border-color .15s ease;
	min-height: 60px;
}

.at-bolge-hizmet:hover,
.at-bolge-hizmet:focus-visible {
	border-color: var(--at-kenar-vurgu);
	box-shadow: var(--at-golge-kart-kucuk);
	color: var(--at-metin);
}

.at-bolge-hizmet__ok {
	color: var(--at-turuncu);
	flex-shrink: 0;
}

.at-bolge-ozel {
	max-width: var(--at-kap-dar);
}

.at-bolge-ozel p {
	color: var(--at-metin-ikincil);
	font-size: 15.5px;
	line-height: 1.75;
}

/* --- Arşiv ve liste ---------------------------------------------------- */

.at-arsiv__giris {
	color: var(--at-metin-ikincil);
	font-size: 16px;
	line-height: 1.7;
	max-width: 720px;
	margin: 0 0 28px;
}

.at-arsiv__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: clamp(30px, 4vw, 46px);
	letter-spacing: .4px;
	margin: 8px 0 10px;
}

.at-liste {
	display: grid;
	gap: 18px;
}

.at-liste__oge {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-kart);
	padding: 24px;
}

.at-liste__baslik {
	font-size: 20px;
	font-weight: 800;
	margin: 0 0 8px;
}

.at-liste__ozet {
	color: var(--at-metin-ikincil);
	font-size: 15px;
	line-height: 1.6;
}

.at-bos {
	color: var(--at-metin-ikincil);
	font-size: 16px;
}

/* --- Sayfa içeriği (page.php, single.php) ------------------------------ */

.at-icerik {
	max-width: var(--at-kap-dar);
	font-size: 16px;
	line-height: 1.75;
	color: var(--at-metin-orta);
}

.at-icerik h2 {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 30px;
	margin: 32px 0 12px;
	letter-spacing: .4px;
	color: var(--at-metin);
}

.at-icerik h3 {
	font-size: 19px;
	font-weight: 800;
	margin: 26px 0 8px;
	color: var(--at-metin);
}

.at-icerik ul,
.at-icerik ol {
	margin: 0 0 1em;
	padding-left: 1.3em;
}

.at-icerik li {
	margin-bottom: .4em;
}

.at-sayfa__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: clamp(30px, 4vw, 46px);
	letter-spacing: .4px;
	margin: 8px 0 24px;
}

/* --- 404 --------------------------------------------------------------- */

.at-404 {
	text-align: center;
	max-width: 720px;
	margin: 0 auto;
}

.at-404__kod {
	font-family: var(--at-font-baslik);
	font-size: clamp(64px, 14vw, 140px);
	color: var(--at-kenar-vurgu);
	line-height: 1;
}

.at-404__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: clamp(26px, 4vw, 40px);
	letter-spacing: .4px;
	margin: 8px 0 12px;
}

.at-404__metin {
	color: var(--at-metin-ikincil);
	font-size: 16.5px;
	margin: 0 0 28px;
}

/* --- Arama ------------------------------------------------------------- */

.at-arama {
	display: flex;
	gap: 10px;
	max-width: 520px;
	margin: 0 auto;
}

.at-arama__alan {
	flex: 1 1 auto;
	min-width: 0;
	padding: 13px 14px;
	border: 1px solid var(--at-kenar-orta);
	border-radius: var(--at-r-dugme-kucuk);
	font-family: inherit;
	font-size: 15px;
	background: #FBFDFF;
	min-height: 46px;
}

.at-arama__gonder {
	background: var(--at-grad-cta);
	color: #fff;
	font-weight: 800;
	font-size: 15px;
	padding: 0 22px;
	border: none;
	border-radius: var(--at-r-dugme-kucuk);
	cursor: pointer;
	font-family: inherit;
	min-height: 46px;
	flex-shrink: 0;
}
/* =========================================================================
   60 — İletişim sayfası ve form
   ========================================================================= */

.at-iletisim {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
	align-items: start;
}

.at-iletisim__sol {
	display: grid;
	gap: 16px;
}

.at-iletisim__acil {
	background: var(--at-grad-mavi);
	border-radius: var(--at-r-gorsel);
	padding: 28px 30px;
}

.at-iletisim__acil-etiket {
	color: #9DC4E8;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 1.5px;
}

.at-iletisim__acil-tel {
	font-family: var(--at-font-baslik);
	font-size: clamp(28px, 4vw, 38px);
	color: #fff;
	letter-spacing: 1px;
	display: inline-block;
	margin-top: 8px;
	line-height: 1.1;
}

.at-iletisim__acil-tel:hover,
.at-iletisim__acil-tel:focus-visible {
	color: var(--at-turuncu-vurgu);
}

.at-iletisim__acil-alt {
	color: var(--at-koyu-metin-govde);
	font-size: 14px;
	margin: 10px 0 0;
}

.at-iletisim__kutu {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-gorsel);
	padding: 24px 30px;
}

.at-iletisim__kutu--satir {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}

.at-iletisim__kutu-baslik {
	font-weight: 800;
	font-size: 16.5px;
}

.at-iletisim__kutu-alt {
	color: var(--at-metin-ikincil);
	font-size: 14px;
	margin-top: 3px;
}

.at-iletisim__kutu-metin {
	color: var(--at-metin-ikincil);
	font-size: 14.5px;
	line-height: 1.6;
	margin: 6px 0 10px;
}

.at-iletisim__wa-dugme {
	background: var(--at-yesil);
	color: #fff;
	font-weight: 800;
	font-size: 15px;
	padding: 12px 20px;
	border-radius: var(--at-r-dugme-kucuk);
	white-space: nowrap;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
}

.at-iletisim__wa-dugme:hover,
.at-iletisim__wa-dugme:focus-visible {
	color: #fff;
}

/* --- Form -------------------------------------------------------------- */

.at-form-kutu {
	background: var(--at-beyaz);
	border: 1px solid var(--at-kenar);
	border-radius: var(--at-r-gorsel);
	padding: 32px 34px;
}

.at-form-kutu__baslik {
	font-family: var(--at-font-baslik);
	font-weight: 400;
	font-size: 26px;
	margin: 0 0 6px;
	letter-spacing: .4px;
}

.at-form-kutu__alt {
	color: var(--at-metin-ikincil);
	font-size: 14px;
	margin: 0 0 22px;
}

.at-form {
	display: grid;
	gap: 16px;
}

.at-form__ikili {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 14px;
}

.at-form__etiket {
	font-weight: 700;
	font-size: 13.5px;
	display: block;
	margin-bottom: 6px;
}

.at-form__zorunlu {
	color: var(--at-turuncu);
}

.at-form input[type='text'],
.at-form input[type='tel'],
.at-form input[type='email'],
.at-form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 13px 14px;
	border: 1px solid var(--at-kenar-orta);
	border-radius: 10px;
	font-family: inherit;
	font-size: 15px;
	background: #FBFDFF;
	color: var(--at-metin);
	min-height: 46px;
}

.at-form textarea {
	resize: vertical;
	min-height: 110px;
}

.at-form input::placeholder,
.at-form textarea::placeholder {
	color: #9AACBE;
}

.at-form input:focus,
.at-form textarea:focus {
	border-color: var(--at-mavi);
	outline: none;
	box-shadow: 0 0 0 3px rgba(14, 123, 221, .12);
}

.at-form__gonder {
	background: var(--at-grad-cta);
	color: #fff;
	font-weight: 800;
	font-size: 16.5px;
	padding: 15px;
	border: none;
	border-radius: var(--at-r-dugme-kucuk);
	cursor: pointer;
	font-family: inherit;
	box-shadow: 0 8px 20px rgba(233, 73, 13, .3);
	min-height: 52px;
}

.at-form__kvkk {
	color: var(--at-metin-solgun);
	font-size: 12.5px;
	margin: 0;
	text-align: center;
}

/* Bal küpü — mobil taşma taramasında HARİÇ TUTULUR */
.at-kupa {
	position: absolute !important;
	left: -9999px;
	top: 0;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* --- Bildirimler ------------------------------------------------------- */

.at-bildirim {
	border-radius: var(--at-r-dugme-kucuk);
	padding: 14px 18px;
	font-size: 15px;
	line-height: 1.55;
	margin: 0 0 18px;
}

.at-bildirim--basarili {
	background: #E7F8EE;
	border: 1px solid #B6E7CB;
	color: #14663A;
}

.at-bildirim--hata {
	background: #FDECE6;
	border: 1px solid #F6C3B1;
	color: #99310D;
}

.at-bildirim ul {
	margin: 6px 0 0;
	padding-left: 1.2em;
}
/* =========================================================================
   90 — Duyarlı düzen

   Kaynak tasarımın on ekranı da `min-width:1080px` ile çizilmiştir, yani
   mobil sürümü YOKTUR. Acil tesisat aramalarının ezici çoğunluğu telefondan
   geleceği için bu katman tema tarafından eklenmiştir.

   İKİ KURAL:
   1. Yalnız mobilde görünecek öğeler 30-chrome.css içinde `display:none`
      ile tanımlanır, BURADA açılır. Kuralı sadece @media (max-width:…)
      içine yazmak yetmez — sorgu dışında öğe varsayılan display değeriyle
      render olur ve masaüstünde de görünür.
   2. Üst sınırlar `.02px` ile verilir. Tam sayı sınır çifti (760 / 761)
      tarayıcı yakınlaştırmasında kesirli genişlikte boşluk bırakır.
   ========================================================================= */

/* --- ≤ 1180px: kapsayıcı nefes alsın ----------------------------------- */

@media (max-width: 1180px) {
	.at-hero__panel {
		padding: 44px 40px;
		gap: 36px;
	}

	.at-panel {
		padding: 40px 40px;
	}

	.at-panel--turuncu {
		padding: 44px 40px;
	}

	.at-fiyat,
	.at-mahalleler {
		padding: 40px 40px;
	}

	.at-bolge-hero {
		padding: 40px 40px;
		gap: 36px;
	}

	.at-ikili {
		gap: 40px;
	}

	.at-ic-hero {
		gap: 40px;
	}

	.at-nav__menu {
		gap: 20px;
		font-size: 14.5px;
	}
}

/* --- ≤ 980px: tek sütun hero, 3'lü ızgaralar 2 sütun ------------------- */

@media (max-width: 980px) {
	.at-hero__panel,
	.at-bolge-hero,
	.at-ic-hero,
	.at-ikili,
	.at-fiyat {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	/* Metin her zaman üstte kalsın; görsel altına insin. */
	.at-ic-hero__gorsel,
	.at-ikili__gorsel {
		order: 2;
	}

	.at-gorsel--hero,
	.at-gorsel--ic,
	.at-gorsel--yan,
	.at-gorsel--bolge {
		height: 320px;
	}

	.at-izgara--3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.at-adimlar {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px;
	}

	.at-alt__ic {
		grid-template-columns: 1fr 1fr;
		gap: 36px;
	}

	.at-alt__ozet {
		max-width: none;
	}

	.at-bolum {
		padding-top: 56px;
	}

	.at-bolum--sik {
		padding-top: 48px;
	}

	.at-bolum__bas {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
	}

	.at-hero__ozet,
	.at-ic-hero__ozet,
	.at-bolge-hero__ozet {
		max-width: none;
	}

	.at-iletisim {
		grid-template-columns: minmax(0, 1fr);
	}

	/* Masaüstü nav'ı daralt — hamburger 760px'te devreye giriyor. */
	.at-nav__menu {
		gap: 16px;
		font-size: 14px;
	}

	.at-nav__cta {
		font-size: 14.5px;
		padding: 11px 16px;
	}
}

/* --- ≤ 760px: hamburger menü, alt çubuk, tek sütun --------------------- */

@media (max-width: 760px) {
	/* Yalnız-mobil öğeleri AÇ (temel kuralda display:none). */
	.at-nav__ac {
		display: inline-flex;
	}

	/*
	 * :not([hidden]) ŞART. Düz `.at-nav__panel { display: block }` yazmak,
	 * hidden özniteliğinin tarayıcı varsayılanı olan display:none'ını ezer
	 * (yazar stili her zaman UA stilini yener) ve panel kalıcı açık kalır.
	 * Ölçümde bu, yapışkan başlığı 89px yerine 345px yapıyordu.
	 */
	.at-nav__panel:not( [hidden] ) {
		display: block;
	}

	.at-alt-cubuk {
		display: grid;
	}

	/* Masaüstü menüsü ve nav CTA'sı gizlenir — ikisi de alt çubuğa taşındı. */
	.at-nav__menu,
	.at-nav__cta {
		display: none;
	}

	/* Yapışkan başlık yüksekliği bütçesi: üst bant ~30px + nav ~60px = 90px.
	   .at-nav__ic'in üç çocuğu da flex-shrink:0 OLMAMALI; aksi halde
	   flex-wrap taşmayı ikinci satıra çevirir ve başlık iki katına çıkar. */
	.at-nav__ic {
		padding: 8px var(--at-bosluk);
		gap: 12px;
	}

	.at-nav__ac {
		width: 44px;
		height: 44px;
	}

	.at-nav__logo img {
		height: 38px;
	}

	.at-nav__logo-metin {
		font-size: 19px;
	}

	.at-ust-bant {
		font-size: 12.5px;
	}

	.at-ust-bant__ic {
		padding: 5px var(--at-bosluk);
		gap: 10px;
	}

	/*
	 * Üst bantta mobilde YALNIZ durum metni kalır.
	 *
	 * Hizmet bölgesi metni dar ekranda taşırıyor. Telefon bağlantısı ise
	 * hem bandı yükseltiyor hem de 22px'lik yetersiz bir dokunma hedefi
	 * oluşturuyordu; ekranın altında kalıcı duran 56px'lik "Hemen Ara"
	 * çubuğu zaten aynı işi daha erişilebilir biçimde yapıyor.
	 */
	.at-ust-bant__bolge,
	.at-ust-bant__tel {
		display: none;
	}

	/* Sabit alt çubuk içeriğin sonunu örtmesin. */
	body {
		padding-bottom: 56px;
	}

	/* Masaüstü yüzen düğmeleri alt çubukla çakışır. */
	.at-yuzen {
		display: none;
	}

	.at-izgara--2,
	.at-izgara--3,
	.at-izgara--4,
	.at-adimlar {
		grid-template-columns: minmax(0, 1fr);
	}

	.at-alt__ic {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
		padding-top: 44px;
	}

	.at-alt__telif {
		flex-direction: column;
		gap: 8px;
		margin-top: 28px;
	}

	.at-hero {
		padding-top: 20px;
	}

	.at-hero__panel,
	.at-bolge-hero {
		padding: 32px 24px;
		border-radius: var(--at-r-panel);
	}

	.at-panel,
	.at-fiyat,
	.at-mahalleler {
		padding: 32px 24px;
		border-radius: var(--at-r-panel);
	}

	.at-panel--turuncu {
		padding: 36px 24px;
	}

	.at-form-kutu,
	.at-iletisim__kutu,
	.at-iletisim__acil {
		padding: 24px 20px;
	}

	.at-bolum__baslik {
		font-size: 30px;
	}

	.at-bolum__baslik--kucuk {
		font-size: 27px;
	}

	.at-bolum__baslik--mini,
	.at-mahalleler__baslik,
	.at-detay__baslik,
	.at-seo-metin h2 {
		font-size: 25px;
	}

	.at-nasil__baslik {
		font-size: 28px;
		margin-bottom: 24px;
	}

	.at-panel--koyu .at-panel__baslik {
		font-size: 25px;
	}

	.at-gorsel--hero,
	.at-gorsel--ic,
	.at-gorsel--yan,
	.at-gorsel--bolge {
		height: 260px;
	}

	.at-form__ikili {
		grid-template-columns: minmax(0, 1fr);
	}

	.at-sss__soru {
		font-size: 15.5px;
	}
}

/* --- ≤ 560px: düğmeler tam genişlik ------------------------------------ */

@media (max-width: 560px) {
	.at-dugme-grup {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
		gap: 10px;
	}

	.at-dugme-grup .at-dugme {
		width: 100%;
	}

	.at-dugme--ara {
		font-size: 17px;
		padding: 15px 20px;
	}

	.at-dugme--beyaz {
		font-size: 18px;
		padding: 15px 20px;
	}

	.at-dugme--wa,
	.at-dugme--hayalet {
		font-size: 15.5px;
		padding: 15px 20px;
	}

	.at-iletisim__kutu--satir {
		flex-direction: column;
		align-items: flex-start;
	}

	.at-iletisim__wa-dugme {
		width: 100%;
		justify-content: center;
	}

	.at-arama {
		flex-direction: column;
	}

	.at-arama__gonder {
		padding: 14px;
	}
}

/* --- ≤ 430px: en dar telefonlar ---------------------------------------- */

@media (max-width: 430px) {
	:root {
		--at-bosluk: 16px;
	}

	.at-nav__ic {
		padding: 9px var(--at-bosluk);
	}

	.at-nav__logo img {
		height: 34px;
	}

	.at-nav__logo-metin {
		font-size: 17px;
	}

	.at-ust-bant {
		font-size: 12px;
	}

	.at-hero__panel,
	.at-bolge-hero,
	.at-panel,
	.at-fiyat,
	.at-mahalleler {
		padding: 26px 18px;
	}

	.at-panel--turuncu {
		padding: 30px 18px;
	}

	.at-kart,
	.at-yorum,
	.at-surec__kart {
		padding: 20px;
	}

	.at-sss__oge {
		padding: 15px 16px;
	}

	.at-hero__ozet {
		font-size: 16px;
	}

	.at-ic-hero__ozet,
	.at-bolge-hero__ozet {
		font-size: 15.5px;
	}

	.at-fiyat__kutu {
		padding: 24px 18px;
	}

	.at-fiyat__kutu-baslik {
		font-size: 22px;
	}

	.at-alt-cubuk a {
		font-size: 15px;
	}

	/* Çip dokunma hedefi 44px'e tamamlanır (13.5px × 1.6 satır + 2 × 11px). */
	.at-cip,
	.at-cip--koyu {
		font-size: 13.5px;
		padding: 11px 14px;
	}
}

/* --- Bağlantı çipleri: dokunma hedefi ---------------------------------- */

@media (max-width: 760px) {
	a.at-cip {
		display: inline-flex;
		align-items: center;
		min-height: 44px;
	}
}

/* --- Yazdırma ---------------------------------------------------------- */

@media print {
	.at-nav,
	.at-ust-bant,
	.at-yuzen,
	.at-alt-cubuk,
	.at-nav__panel {
		display: none !important;
	}

	body {
		background: #fff;
		padding-bottom: 0;
	}
}
