/* ─── Apple-style Design System ─────────────────────────────────────── */

:root {
    --bg: #fbfbfd;
    --surface: #fff;
    --text: #1d1d1f;
    --muted: #86868b;
    --accent: #0071e3;
    --border: rgba(0, 0, 0, .08);
    --radius: 18px;
    --shadow: 0 1px 3px rgba(0, 0, 0, .04), 0 8px 24px rgba(0, 0, 0, .06);

    --bs-primary: var(--accent);
    --bs-body-bg: var(--bg);
    --bs-body-color: var(--text);
    --bs-font-sans-serif: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", "Segoe UI", Roboto, sans-serif;
    --bs-border-radius: var(--radius);
    --bs-card-border-color: var(--border);
    --bs-card-bg: var(--surface);
}

/* ─── Base ───────────────────────────────────────────────────────────── */

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

html { scroll-behavior: smooth; }

body {
    font-family: 'Inter', var(--bs-font-sans-serif);
    background: var(--bg);
    color: var(--text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transition: background .3s cubic-bezier(.4, 0, .2, 1), color .3s cubic-bezier(.4, 0, .2, 1);
}

a {
    color: var(--accent);
    text-decoration: none;
    transition: color .25s cubic-bezier(.4, 0, .2, 1);
}

a:hover { color: var(--accent); opacity: .8; }

img { max-width: 100%; display: block; }

/* ─── Glass effect ───────────────────────────────────────────────────── */

.glass {
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    background: rgba(255, 255, 255, .72);
    border: 1px solid var(--border);
}

/* ─── Bootstrap overrides ────────────────────────────────────────────── */

.card {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    transition: box-shadow .3s cubic-bezier(.4, 0, .2, 1), transform .3s cubic-bezier(.4, 0, .2, 1);
}

.card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, .06), 0 16px 40px rgba(0, 0, 0, .1);
    transform: translateY(-2px);
}

.card-body { padding: 1.75rem; }

.btn {
    border-radius: 999px;
    font-weight: 500;
    letter-spacing: -.01em;
    padding: .55rem 1.4rem;
    transition: transform .3s cubic-bezier(.4, 0, .2, 1), box-shadow .3s cubic-bezier(.4, 0, .2, 1), background .2s, border-color .2s;
}

.btn:hover { transform: scale(1.02); }
.btn:active { transform: scale(.98); }

.btn-primary {
    background: var(--accent);
    border-color: var(--accent);
    border-radius: 999px;
    color: #fff;
}

.btn-primary:hover {
    background: var(--accent);
    border-color: var(--accent);
    opacity: .88;
    box-shadow: 0 4px 16px rgba(0, 113, 227, .35);
}

.btn-outline-primary {
    color: var(--accent);
    border-color: var(--accent);
    border-radius: 999px;
}

.btn-outline-primary:hover {
    background: var(--accent);
    border-color: var(--accent);
    transform: scale(1.02);
}

.btn-secondary {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text);
    border-radius: 999px;
}

.btn-secondary:hover {
    background: var(--bg);
    border-color: var(--muted);
    color: var(--text);
    transform: scale(1.02);
}

/* ─── Form controls ──────────────────────────────────────────────────── */

.form-control,
.form-select {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    color: var(--text);
    transition: border-color .25s, box-shadow .25s;
}

.form-control:focus,
.form-select:focus {
    background: var(--surface);
    border-color: var(--accent);
    color: var(--text);
    box-shadow: 0 0 0 3px rgba(0, 113, 227, .15);
}

.form-control::placeholder { color: var(--muted); }

/* ─── Navbar ─────────────────────────────────────────────────────────── */

.navbar {
    background: rgba(255, 255, 255, .8) !important;
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border-bottom: 1px solid var(--border);
    transition: background .3s;
}

.navbar-brand {
    font-weight: 700;
    letter-spacing: -.02em;
    color: var(--text) !important;
}

.nav-link {
    color: var(--text) !important;
    font-weight: 400;
    opacity: .85;
    transition: opacity .2s;
    border-radius: 8px;
    padding: .4rem .75rem !important;
}

.nav-link:hover { opacity: 1; background: var(--border); }
.nav-link.active { opacity: 1; font-weight: 600; }

/* ─── Dropdown ───────────────────────────────────────────────────────── */

.dropdown-menu {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow);
    padding: .5rem;
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
}

.dropdown-item {
    color: var(--text);
    border-radius: 8px;
    padding: .45rem .85rem;
    font-size: .9375rem;
    transition: background .15s;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--bg);
    color: var(--text);
}

/* ─── Section / Container helpers ───────────────────────────────────── */

section {
    padding: 5rem 0;
}

.section-sm { padding: 3rem 0; }
.section-lg { padding: 8rem 0; }

.section-title {
    font-size: clamp(1.75rem, 4vw, 2.75rem);
    font-weight: 700;
    letter-spacing: -.03em;
    line-height: 1.15;
    color: var(--text);
}

.section-subtitle {
    font-size: 1.125rem;
    color: var(--muted);
    line-height: 1.6;
}

/* ─── Typography ─────────────────────────────────────────────────────── */

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.2;
    color: var(--text);
}

h1 { font-size: clamp(2.25rem, 5vw, 3.5rem); letter-spacing: -.04em; }
h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); letter-spacing: -.03em; }
h3 { font-size: clamp(1.375rem, 2.5vw, 2rem); }
h4 { font-size: 1.375rem; }

p { line-height: 1.75; }

.text-muted { color: var(--muted) !important; }

/* ─── Hero ───────────────────────────────────────────────────────────── */

.hero {
    padding: 7rem 0 6rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% -10%, rgba(0, 113, 227, .12) 0%, transparent 70%);
    pointer-events: none;
}

.hero-title {
    font-size: clamp(2.5rem, 6vw, 4.5rem);
    font-weight: 800;
    letter-spacing: -.05em;
    line-height: 1.05;
}

.hero-lead {
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    color: var(--muted);
    max-width: 640px;
    margin: 1.25rem auto 2.5rem;
    line-height: 1.6;
}

/* ─── Product card ───────────────────────────────────────────────────── */

.product-card {
    border-radius: var(--radius);
    overflow: hidden;
    transition: box-shadow .3s cubic-bezier(.4, 0, .2, 1), transform .3s cubic-bezier(.4, 0, .2, 1);
}

.product-card:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, .06), 0 16px 40px rgba(0, 0, 0, .12) !important;
    transform: translateY(-4px);
}

.product-card img {
    transition: transform .5s cubic-bezier(.4, 0, .2, 1);
}

.product-card:hover img { transform: scale(1.04); }

/* ─── Category card ──────────────────────────────────────────────────── */

.category-card {
    border-radius: var(--radius);
    overflow: hidden;
    transition: transform .3s cubic-bezier(.4, 0, .2, 1), box-shadow .3s cubic-bezier(.4, 0, .2, 1);
}

.category-card:hover {
    transform: translateY(-6px) scale(1.01);
    box-shadow: 0 8px 32px rgba(0, 0, 0, .14) !important;
}

/* ─── Badge ──────────────────────────────────────────────────────────── */

.badge {
    border-radius: 999px;
    font-weight: 500;
    letter-spacing: .01em;
    padding: .35em .75em;
}

.badge-accent {
    background: rgba(0, 113, 227, .1);
    color: var(--accent);
}

/* ─── Blog ───────────────────────────────────────────────────────────── */

.blog-content h1,
.blog-content h2,
.blog-content h3 {
    margin-top: 2rem;
    margin-bottom: .75rem;
}

.blog-content p { line-height: 1.85; }

.blog-content img { border-radius: 14px; margin: 1.5rem 0; }

.blog-content a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

/* ─── Prose ──────────────────────────────────────────────────────────── */

.prose img { border-radius: 14px; }

/* ─── Footer ─────────────────────────────────────────────────────────── */

footer {
    background: var(--surface);
    border-top: 1px solid var(--border);
    padding: 3.5rem 0 2rem;
    color: var(--muted);
    font-size: .9375rem;
}

footer a { color: var(--muted); transition: color .2s; }
footer a:hover { color: var(--text); }

/* ─── Divider ────────────────────────────────────────────────────────── */

hr {
    border: none;
    border-top: 1px solid var(--border);
    opacity: 1;
}

/* ─── Scrollbar (webkit) ─────────────────────────────────────────────── */

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border); border-radius: 999px; }
::-webkit-scrollbar-thumb:hover { background: var(--muted); }

/* ─── Utilities ──────────────────────────────────────────────────────── */

.surface { background: var(--surface); }
.bg-surface { background: var(--surface) !important; }
.text-accent { color: var(--accent) !important; }
.border-subtle { border-color: var(--border) !important; }
.radius { border-radius: var(--radius) !important; }
.radius-sm { border-radius: 10px !important; }
.radius-xs { border-radius: 6px !important; }
.shadow-card { box-shadow: var(--shadow) !important; }

/* ─── Alert ──────────────────────────────────────────────────────────── */

.alert {
    border-radius: 14px;
    border: 1px solid var(--border);
    background: var(--surface);
}

/* ─── Table ──────────────────────────────────────────────────────────── */

.table {
    color: var(--text);
}

.table > :not(caption) > * > * {
    background-color: transparent;
    border-bottom-color: var(--border);
    color: var(--text);
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    background-color: rgba(0, 0, 0, .02);
    color: var(--text);
}

/* ─── Modal ──────────────────────────────────────────────────────────── */

.modal-content {
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: 0 25px 60px rgba(0, 0, 0, .25);
}

.modal-header {
    border-bottom-color: var(--border);
}

.modal-footer {
    border-top-color: var(--border);
}

/* ─── Pagination ─────────────────────────────────────────────────────── */

.page-link {
    background: var(--surface);
    border-color: var(--border);
    color: var(--text);
    border-radius: 8px !important;
    margin: 0 2px;
    transition: background .2s, color .2s;
}

.page-link:hover {
    background: var(--bg);
    border-color: var(--accent);
    color: var(--accent);
}

.page-item.active .page-link {
    background: var(--accent);
    border-color: var(--accent);
}

/* ─── Responsive grid helpers ────────────────────────────────────────── */

@media (max-width: 575.98px) {
    section { padding: 3rem 0; }
    .hero { padding: 4rem 0 3rem; }
    .card-body { padding: 1.25rem; }
    h1 { letter-spacing: -.03em; }
}

@media (max-width: 767.98px) {
    .section-lg { padding: 5rem 0; }
    .navbar .btn { display: none; }
}

@media (min-width: 992px) {
    .hero { padding: 9rem 0 7rem; }
}

/* ─── Smooth page transition ─────────────────────────────────────────── */

@media (prefers-reduced-motion: no-preference) {
    .fade-up {
        opacity: 0;
        transform: translateY(24px);
        transition: opacity .5s cubic-bezier(.4, 0, .2, 1), transform .5s cubic-bezier(.4, 0, .2, 1);
    }

    .fade-up.visible {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
    }
}

/* ─── Header: üst iletişim çubuğu + beyaz ana çubuk ─────────────────── */

/* --topbar-h: üst iletişim çubuğu (yalnız desktop). --navbar-h: logo/menü satırı.
   --header-h: ikisinin toplamı — hero bileşenleri (hero-v2, HeroSlider) bu değerle header altına kayar. */
:root { --topbar-h: 0px; --navbar-h: 64px; --logo-h: calc(var(--navbar-h) * .9); --header-h: calc(var(--topbar-h) + var(--navbar-h)); --ann-h: 0px; }
@media (min-width: 992px) { :root { --topbar-h: 36px; --navbar-h: 100px; } }

/* --ann-h: header üstü duyuru çubuğu yüksekliği. Çubuk yoksa 0 (DuyuruCubugu bileşeni aktifken
   :root'u 44px'e çeker; kapatılınca JS 0'a döndürür). Header ve body bu değişkenle kayar. */
body { padding-top: calc(var(--header-h) + var(--ann-h)); }

/* Header sayfayla birlikte kayar (absolute, sabit değil); beyaz zeminiyle hero'nun üstüne biner. */
.site-header {
    position: absolute;
    top: var(--ann-h);
    left: 0;
    right: 0;
    z-index: 1040;
    background: var(--surface);
    border-bottom: 1px solid var(--border);
}

/* Tam genişlik: logo / iletişim sola, sosyal ikonlar / arama sağa yaslanır; yalnız kenar boşluğu kalır. */
.site-header-inner {
    width: 100%;
    padding: 0 1.5rem;
}
@media (min-width: 992px) { .site-header-inner { padding: 0 3rem; } }

/* ── Üst çubuk: telefon + e-posta (sol), sosyal ikonlar (sağ) — yalnız desktop ── */
.site-topbar {
    height: var(--topbar-h);
    border-bottom: 1px solid var(--border);
    font-size: .8125rem;
}
.site-topbar-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    height: var(--topbar-h);
}
.site-topbar-contact { display: flex; align-items: center; min-width: 0; }
.site-topbar-item {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: 0 1.25rem;
    border-right: 1px solid var(--border);
    color: var(--text);
    text-decoration: none !important;
    white-space: nowrap;
    transition: color .15s;
}
.site-topbar-item:first-child { padding-left: 0; }
.site-topbar-item svg { color: var(--accent); flex-shrink: 0; }
.site-topbar-item:hover { color: var(--accent); opacity: 1; }

.site-topbar-social { display: flex; align-items: center; gap: 1.125rem; }
.site-topbar-social a {
    display: inline-flex;
    align-items: center;
    color: var(--text);
    font-size: .9375rem;
    line-height: 1;
    text-decoration: none !important;
    transition: color .15s;
}
.site-topbar-social a:hover { color: var(--accent); opacity: 1; }

/* ── Ana çubuk: logo (sol) + menü (orta) + arama / hamburger (sağ) ── */
.site-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    height: var(--navbar-h);
}
@media (min-width: 992px) { .site-header-row { gap: 1.5rem; } }

.site-header-logo { flex-shrink: 0; display: inline-flex; align-items: center; text-decoration: none !important; }
/* Logo yüksekliği çubuğa orantılı: --logo-h = navbar'ın %90'ı (mobil ~58px, masaüstü 90px). */
.site-header-logo img { height: var(--logo-h); width: auto; }

/* Menü sığmazsa (çok öğe / dar ekran) logo ve arama ikonunun üstüne binmez; kendi içinde yatay kayar. */
.site-header-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 2.25rem;
    align-items: center;
    flex: 1;
    justify-content: center;
    justify-content: safe center;
    min-width: 0;
    overflow-x: auto;
    scrollbar-width: none;
}
.site-header-menu::-webkit-scrollbar { display: none; }
/* Masaüstünde dropdown (Hizmetler) menünün dışına taşar; overflow-x:auto onu kırpıyordu. 6 öğe sığdığı için kaydırma gerekmez. */
@media (min-width: 992px) { .site-header-menu { overflow: visible; } }

.site-header-link {
    font-size: .9375rem;
    font-weight: 600;
    color: var(--text);
    text-decoration: none !important;
    white-space: nowrap;
    transition: color .15s;
}
.site-header-link:hover { color: var(--accent); opacity: 1; }

/* ── Hakkımızda dropdown ("Ayrı Sayfalar" düzeni) — hover/klavye odağıyla açılır ── */
.site-header-dd { position: relative; }
.site-header-dd-toggle { display: inline-flex; align-items: center; gap: .3rem; }
.site-header-dd-caret { transition: transform .2s; }
.site-header-dd:hover .site-header-dd-caret,
.site-header-dd:focus-within .site-header-dd-caret { transform: rotate(180deg); }

.site-header-dd-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, 10px);
    min-width: 230px;
    margin: 0;
    padding: .5rem;
    list-style: none;
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, .14);
    opacity: 0;
    visibility: hidden;
    transition: opacity .2s, transform .2s, visibility .2s;
    z-index: 1050;
}
/* Link ile panel arasındaki boşlukta hover kopmasın (görünmez köprü) */
.site-header-dd-menu::before {
    content: "";
    position: absolute;
    top: -12px;
    left: 0;
    right: 0;
    height: 12px;
}
.site-header-dd:hover .site-header-dd-menu,
.site-header-dd:focus-within .site-header-dd-menu {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 4px);
}

.site-header-dd-link {
    display: block;
    padding: .5rem .75rem;
    border-radius: 8px;
    font-size: .9rem;
    font-weight: 500;
    color: var(--text);
    text-decoration: none !important;
    white-space: nowrap;
    transition: background .15s, color .15s;
}
.site-header-dd-link:hover { background: var(--border); color: var(--accent); }

.site-header-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-shrink: 0;
}

/* ── Header butonları (Banner Yönetimi "header"): arama ikonunun yanında iki .site-cta — aynı yapı, header ölçüsü.
   Slot 0 açık (ince çerçeveli), slot 1 koyu ana buton (--ana). Masaüstünde çubukta; mobilde menü panelinin üstünde. ── */
.site-header-ctas { display: none; align-items: center; gap: .5rem; margin-left: .25rem; }
@media (min-width: 992px) { .site-header-ctas { display: flex; } }

.site-cta.site-header-cta {
    min-height: 40px;
    gap: .625rem;
    padding: .25rem .25rem .25rem .875rem;
    border-radius: 12px;
    font-size: .875rem;
    white-space: nowrap;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .05);
}
.site-header-cta .site-cta-icon { width: 32px; height: 32px; border-radius: 9px; }
/* Ana buton: .site-cta'nın ters (koyu) hali — hover'da yükselir, parlama süpürülür, ok kayar */
.site-cta.site-header-cta--ana {
    background: var(--text);
    color: #fff;
    box-shadow: 0 8px 18px -10px rgba(0, 0, 0, .6);
}
.site-header-cta--ana .site-cta-icon { background: #fff; color: var(--text); }
.site-cta.site-header-cta:hover { transform: translateY(-1px); box-shadow: 0 10px 22px -12px rgba(0, 0, 0, .55); }
.site-cta.site-header-cta:active { transform: scale(.98); }
/* Hesap makinesi ikonu ok gibi kaymaz; hafifçe büyür */
.site-cta.site-header-cta:hover .site-cta-icon .site-header-cta-glyph { transform: scale(1.1); }
@media (prefers-reduced-motion: reduce) {
    .site-cta.site-header-cta:hover,
    .site-cta.site-header-cta:hover .site-cta-icon .site-header-cta-glyph { transform: none; }
}
/* Dar masaüstü: menüye yer kalsın diye kademeli sıkışır (.has-ctas = butonlar basıldıysa).
   <1280 ikon kutuları gizlenir (yalnız metin); <1200 menü aralığı daralır; <1100 menü yazısı ve boşluklar küçülür. */
@media (min-width: 992px) and (max-width: 1279.98px) {
    .site-header-ctas .site-header-cta { padding: .25rem .875rem; }
    .site-header-ctas .site-cta-icon { display: none; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    .site-header-row.has-ctas .site-header-menu { gap: 1.5rem; }
}
@media (min-width: 992px) and (max-width: 1099.98px) {
    .site-header-row.has-ctas { gap: 1rem; }
    .site-header-row.has-ctas .site-header-menu { gap: 1.125rem; }
    .site-header-row.has-ctas .site-header-link { font-size: .875rem; }
    .site-header-ctas .site-header-cta { padding: .25rem .75rem; }
}

.site-header-burger {
    background: none;
    border: none;
    padding: .25rem .375rem;
    cursor: pointer;
    color: var(--text);
    line-height: 1;
    border-radius: 6px;
}
.site-header-burger:hover { background: var(--border); }

/* Mobil panel header'ın altında açılır; uzun menüde ekranı aşmasın diye kendi içinde kayar */
.site-header-mobile-panel {
    overflow: hidden;
    max-height: 0;
    border-top: 1px solid transparent;
    transition: max-height .35s cubic-bezier(.4,0,.2,1), border-color .35s;
}
.site-header-mobile-panel.open {
    max-height: calc(100vh - var(--header-h) - var(--ann-h));
    overflow-y: auto;
    border-top-color: var(--border);
}

/* Mobil panelin üstünde header butonları: yan yana, sığmazsa alt alta tam genişlik */
.site-header-mobile-ctas { display: flex; flex-wrap: wrap; gap: .625rem; padding: 1rem 0 .25rem; }
.site-header-mobile-ctas .site-header-cta {
    flex: 1 1 0;
    min-width: max-content; /* .site-cta overflow:hidden → esnek öğe içeriğinin altına sıkışıp kırpılmasın, alt satıra geçsin */
    min-height: 48px;
    justify-content: space-between;
    gap: .5rem;
    padding-left: .75rem;
}
.site-header-mobile-ctas .site-cta-icon { width: 40px; height: 40px; border-radius: 10px; }

.site-header-mobile-menu {
    list-style: none;
    padding: .75rem 0 .25rem;
    margin: 0;
}
.site-header-mobile-link {
    display: block;
    color: var(--muted);
    font-size: .9375rem;
    padding: .625rem 0;
    text-decoration: none !important;
    border-bottom: 1px solid var(--border);
    transition: color .15s;
}
.site-header-mobile-link:hover { color: var(--text); opacity: 1; }
.site-header-mobile-sublink { padding-left: 1.5rem; font-size: .875rem; }
/* Alt linkli mobil menü öğesi: satır (bağlantı + ok), alt liste kapalı gelir */
.site-header-mobile-row { display: flex; align-items: center; border-bottom: 1px solid var(--border); }
.site-header-mobile-row .site-header-mobile-link { flex: 1; border-bottom: 0; }
.site-header-mobile-caret { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; margin-right: -10px; border: 0; background: none; color: var(--muted); cursor: pointer; border-radius: 10px; transition: background .15s, color .15s; }
.site-header-mobile-caret:hover { background: var(--border); color: var(--text); }
.site-header-mobile-caret svg { transition: transform .2s; }
.site-header-mobile-group.is-open .site-header-mobile-caret svg { transform: rotate(180deg); }
.site-header-mobile-sub { list-style: none; margin: 0; padding: 0; background: #f7f8fa; border-radius: 0 0 10px 10px; }
.site-header-mobile-sub .site-header-mobile-sublink { padding-left: 1.25rem; padding-right: .5rem; }
.site-header-mobile-sub li:last-child .site-header-mobile-link { border-bottom: 0; }

/* Mobil panel altı: telefon / e-posta / sosyal ikonlar (üst çubuk mobilde gizli) */
.site-header-mobile-contact {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1.25rem;
    padding: .875rem 0 1rem;
    font-size: .875rem;
}
.site-header-mobile-contact a {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    color: var(--text);
    text-decoration: none !important;
}
.site-header-mobile-contact a svg { color: var(--accent); flex-shrink: 0; }
.site-header-mobile-contact .site-topbar-social { margin-left: auto; }

.site-header-mobile-auth { padding: .75rem 0 .25rem; }

/* ─── Hero v2 (video / image background) ────────────────────────────── */

.hero-v2 {
    position: relative;
    overflow: hidden;
    background: var(--bg);
    margin-top: calc(-1 * var(--header-h));
    padding-top: calc(var(--header-h) + 3rem);
    padding-bottom: 5rem;
    min-height: 100vh;
}

@media (min-width: 768px)  { .hero-v2 { padding-top: calc(var(--header-h) + 5rem); padding-bottom: 7rem; } }
@media (min-width: 992px)  { .hero-v2 { padding-top: calc(var(--header-h) + 10rem); padding-bottom: 9rem; } }

/* Tam kanat (full-bleed): köşe yuvarlama ve çerçeve yok. */
.hero-v2-bg {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.hero-v2-bg video {
    width: 100%; height: 100%; object-fit: cover; display: block;
    opacity: .5; filter: invert(1);
}

.hero-v2-bg img {
    width: 100%; height: 100%; object-fit: cover; display: block; opacity: .3;
}

.hero-v2-content {
    position: relative;
    z-index: 10;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}
@media (min-width: 992px) { .hero-v2-content { padding: 0 3rem; } }

.hero-v2-text { max-width: 42rem; text-align: center; margin: 0 auto; }
@media (min-width: 992px) { .hero-v2-text { text-align: left; margin: 0; max-width: 100%; } }

.hero-v2-h1 {
    font-size: clamp(2.5rem, 5vw, 4.5rem);
    font-weight: 700;
    letter-spacing: -.05em;
    line-height: 1.05;
    max-width: 32rem;
    margin: 0 auto 2rem;
    color: var(--text);
}
@media (min-width: 992px) { .hero-v2-h1 { margin: 0 0 2rem; } }

.hero-v2-lead {
    font-size: 1.125rem;
    line-height: 1.65;
    color: var(--muted);
    max-width: 36rem;
    margin: 0 auto 2.5rem;
}
@media (min-width: 992px) { .hero-v2-lead { margin: 0 0 2.5rem; } }

.hero-v2-btns {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    margin-bottom: 0;
}
@media (min-width: 576px) { .hero-v2-btns { flex-direction: row; justify-content: center; } }
@media (min-width: 992px) { .hero-v2-btns { justify-content: flex-start; } }

/* ─── Hero caption (carousel): sol hizalı, dikey ortalı, premium CTA ───── */

/* Scrim: soldan sağa açılan koyu geçiş; beyaz metin videonun açık karelerinde de 4.5:1 kontrastı korur. */
.hero-caption-scrim {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.40) 45%, rgba(0,0,0,0) 80%);
}

/* Caption slaytı kaplar ama tıklamayı geçirir (prev/next okları altta kalmasın); yalnız CTA tıklanır. */
.hero-caption {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    color: #fff;
    text-align: left;
    pointer-events: none;
}
@media (min-width: 992px) { .hero-caption { padding: 0 3rem; } }

.hero-caption-inner { max-width: 40rem; }
.hero-caption-inner > :last-child { margin-bottom: 0; }

.hero-caption-line {
    display: block;
    width: 56px;
    height: 3px;
    border-radius: 2px;
    background: var(--accent);
    margin-bottom: 1.25rem;
}

.hero-caption-title {
    font-size: clamp(2.25rem, 5.2vw, 4.25rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -.03em;
    color: #fff;
    margin: 0 0 1rem;
    text-wrap: balance;
    text-shadow: 0 2px 24px rgba(0,0,0,.35);
}

.hero-caption-lead {
    font-size: clamp(1.0625rem, 1.5vw, 1.375rem);
    font-weight: 500;
    line-height: 1.4;
    color: rgba(255,255,255,.92);
    margin: 0 0 .75rem;
}

.hero-caption-text {
    font-size: clamp(.9375rem, 1.1vw, 1.0625rem);
    line-height: 1.65;
    color: rgba(255,255,255,.78);
    max-width: 34rem;
    margin: 0 0 1.75rem;
}

/* ─── SİTE GENELİ BUTON: .site-cta (= hero'daki .hero-cta, birebir aynı) ─────────────────
   Yeni eklenen HER buton bu yapıyı kullanır:
     <a class="site-cta"><span>Metin</span><span class="site-cta-icon" aria-hidden="true"><svg ok/></span></a>
   Beyaz, hafif yuvarlatılmış; koyu kutu içinde ok. Hover'da zemin/metin TERS döner (koyu zemin, beyaz yazı,
   beyaz ok kutusu), 2px yükselir, üstünden bir parlama süpürülür. Vurgu rengine bağımlı değil. */
:is(.hero-cta, .site-cta) {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    gap: .875rem;
    min-height: 52px;
    padding: .375rem .375rem .375rem 1.5rem;
    border-radius: 14px;
    background: #fff;
    color: var(--text);
    font-weight: 600;
    font-size: .9375rem;
    letter-spacing: .01em;
    text-decoration: none !important;
    cursor: pointer;
    pointer-events: auto;
    box-shadow: 0 10px 30px -12px rgba(0,0,0,.45);
    transition: transform .22s ease-out, box-shadow .22s ease-out, background .22s ease-out, color .22s ease-out;
}
/* Parlama: hover'da soldan sağa süpürülen açık bant */
:is(.hero-cta, .site-cta)::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.28) 50%, transparent 70%);
    transform: translateX(-130%);
    transition: transform .65s ease-out;
    pointer-events: none;
}
:is(.hero-cta-icon, .site-cta-icon) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--text);
    color: #fff;
    flex-shrink: 0;
    transition: background .22s ease-out, color .22s ease-out;
}
:is(.hero-cta-icon, .site-cta-icon) svg { transition: transform .22s ease-out; }
:is(.hero-cta, .site-cta):hover {
    opacity: 1; /* genel a:hover { opacity: .8 } kuralını ez — buton soluklaşmasın */
    background: var(--text);
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 18px 40px -14px rgba(0,0,0,.65);
}
:is(.hero-cta, .site-cta):hover::after { transform: translateX(130%); }
:is(.hero-cta, .site-cta):hover :is(.hero-cta-icon, .site-cta-icon) { background: #fff; color: var(--text); }
:is(.hero-cta, .site-cta):hover :is(.hero-cta-icon, .site-cta-icon) svg { transform: translateX(3px); }
:is(.hero-cta, .site-cta):active { transform: translateY(0) scale(.98); }
:is(.hero-cta, .site-cta):focus-visible { outline: 3px solid rgba(255,255,255,.85); outline-offset: 3px; }
/* Açık zeminde (hero dışı) odak halkası vurgu rengiyle görünür kalsın */
.site-cta:focus-visible { outline-color: color-mix(in srgb, var(--accent) 60%, transparent); }

/* Giriş: aktif slaytta caption öğeleri 60ms kademeli fade-up (reduced-motion'da kapalı). */
@media (prefers-reduced-motion: no-preference) {
    .carousel-item.active .hero-caption-inner > * {
        animation: heroCaptionIn .6s cubic-bezier(.22, 1, .36, 1) both;
    }
    .carousel-item.active .hero-caption-inner > :nth-child(2) { animation-delay: .06s; }
    .carousel-item.active .hero-caption-inner > :nth-child(3) { animation-delay: .12s; }
    .carousel-item.active .hero-caption-inner > :nth-child(4) { animation-delay: .18s; }
    .carousel-item.active .hero-caption-inner > :nth-child(5) { animation-delay: .24s; }
}
@keyframes heroCaptionIn {
    from { opacity: 0; transform: translateY(18px); }
    to   { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
    :is(.hero-cta, .site-cta), :is(.hero-cta-icon, .site-cta-icon), :is(.hero-cta-icon, .site-cta-icon) svg,
    :is(.hero-cta, .site-cta)::after { transition: none; }
    :is(.hero-cta, .site-cta):hover { transform: none; }
}

/* ─── Hero sağ panel: Hızlı Teklif kartı + hizmet slider'ı ───────────── */

.hero-wrap { position: relative; }

/* <992px: panel hero'nun altında normal akışta (koyu zemin). ≥992px: carousel'in sağına absolute biner;
   kısa ekranlarda taşmasın diye kendi içinde kayar (görünmez kaydırma çubuğu). */
.hero-side {
    background: #0f1115;
    padding: 1.5rem;
    display: grid;
    gap: 1rem;
    --hero-side-w: 420px;
}
@media (min-width: 992px) {
    .hero-side {
        position: absolute;
        /* Carousel header'ın altına kaydığı için görünür alan header altından başlar: o alanda ortala */
        top: calc(50% + var(--header-h) / 2);
        right: 3rem;
        transform: translateY(-50%);
        width: var(--hero-side-w);
        max-height: calc(100vh - var(--header-h) - var(--ann-h) - 2rem);
        overflow-y: auto;
        scrollbar-width: none;
        background: none;
        padding: 0;
        z-index: 2;
    }
    .hero-side::-webkit-scrollbar { display: none; }
    /* Caption sağ panelin altına girmesin */
    .hero-caption { right: calc(var(--hero-side-w) + 3rem + 2.5rem); }
}
@media (min-width: 1400px) { .hero-side { --hero-side-w: 460px; } }

/* Hızlı Teklif kartı: yüksek kontrastlı beyaz kart (buzlu cam), 16px köşe, ince kenarlık */
.quote-card {
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 16px;
    padding: 1.25rem;
    box-shadow: 0 24px 60px -24px rgba(0,0,0,.55);
    color: var(--text);
}
.quote-card-head { margin-bottom: .875rem; }
.quote-card-title { font-size: 1.25rem; font-weight: 700; letter-spacing: -.02em; margin: 0 0 .125rem; color: var(--text); }
.quote-card-sub { font-size: .8125rem; color: var(--muted); margin: 0; }

/* İki sütunlu kompakt alanlar: 48px yükseklik, yüzen etiket (etiket her zaman görünür) */
.quote-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.quote-span { grid-column: 1 / -1; }
.quote-grid .form-floating > .form-select {
    height: 48px;
    min-height: 48px;
    padding: 1.2rem 2.25rem .3rem .75rem;
    font-size: .9rem;
    border-radius: 10px;
    border-color: rgba(0,0,0,.12);
    background-color: #fff;
    box-shadow: none;
    cursor: pointer;
}
.quote-grid .form-floating > .form-select ~ label {
    transform: scale(.78) translateY(-.6rem) translateX(.15rem);
    opacity: 1;
}
.quote-grid .form-floating > .form-select:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}
.quote-grid .form-floating > .form-control {
    height: 48px;
    min-height: 48px;
    padding: 1.2rem .75rem .3rem;
    font-size: .9rem;
    border-radius: 10px;
    border-color: rgba(0,0,0,.12);
    background: #fff;
    box-shadow: none;
}
.quote-grid .form-floating > label {
    padding: .8rem .75rem;
    font-size: .85rem;
    color: var(--muted);
}
.quote-grid .form-floating > .form-control:focus ~ label,
.quote-grid .form-floating > .form-control:not(:placeholder-shown) ~ label {
    transform: scale(.78) translateY(-.6rem) translateX(.15rem);
    opacity: 1;
    color: var(--muted);
}
.quote-grid .form-floating > .form-control:focus,
.quote-grid .form-floating > .form-control:not(:placeholder-shown) {
    padding-top: 1.2rem;
    padding-bottom: .3rem;
}
.quote-grid .form-floating > .form-control:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}

/* Gönder: tam genişlik, koyu zemin, 48px; hover'da yükselir; gönderim sırasında pasif */
.quote-submit {
    margin-top: .75rem;
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .625rem;
    border: 0;
    border-radius: 12px;
    background: var(--text);
    color: #fff;
    font-weight: 600;
    font-size: .95rem;
    cursor: pointer;
    transition: transform .2s ease-out, box-shadow .2s ease-out, opacity .2s;
}
.quote-submit svg { transition: transform .2s ease-out; }
.quote-submit:hover { transform: translateY(-1px); box-shadow: 0 12px 24px -12px rgba(0,0,0,.6); }
.quote-submit:hover svg { transform: translateX(3px); }
.quote-submit:disabled { opacity: .6; cursor: progress; transform: none; box-shadow: none; }
.quote-submit:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 60%, transparent); outline-offset: 2px; }
.quote-result { margin: .625rem 0 0; font-size: .8125rem; }
.quote-result.is-ok { color: #157347; }
.quote-result.is-err { color: #b02a37; }

/* Hizmet slider'ı: tek kart görünür, scroll-snap; görsel + alt gölge + büyük harf başlık + firma adı + ok dairesi */
.hero-services { position: relative; min-width: 0; max-width: 100%; }
/* Mobil: hizmet rayı grid öğesini genişletip sayfayı yatay kaydırıyordu (scrollW 408 > 390) */
@media (max-width: 991.98px) { .hero-side { max-width: 100%; overflow: hidden; box-sizing: border-box; } .hero-services-track { width: 100%; } }
.hero-services-track {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    border-radius: 16px;
}
.hero-services-track::-webkit-scrollbar { display: none; }
.hero-service-card {
    position: relative;
    flex: 0 0 100%;
    scroll-snap-align: start;
    aspect-ratio: 16 / 7.4;
    display: block;
    overflow: hidden;
    border-radius: 16px;
    color: #fff;
    text-decoration: none !important;
    isolation: isolate;
    background: #1a1d23;
    cursor: pointer;
    transition: box-shadow .25s ease-out;
}
/* Hover: kart kaymaz (kaydırma rayı keser), içi hareket eder — genel a:hover opaklığı EZİLİR (kart soluklaşmasın) */
.hero-service-card:hover,
.hero-service-card:focus-visible {
    opacity: 1;
    color: #fff;
    box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55);
}
.hero-service-card img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .7s cubic-bezier(.22, 1, .36, 1), filter .35s ease-out;
}
.hero-service-card:hover img { transform: scale(1.07); filter: brightness(1.06) saturate(1.08); }
.hero-service-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.72) 100%);
}
/* Hover'da alt gölge derinleşir (gradient animasyonu yerine ikinci katmanın opaklığı) */
.hero-service-shade::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0) 25%, rgba(0,0,0,.45) 100%);
    opacity: 0;
    transition: opacity .3s ease-out;
}
.hero-service-card:hover .hero-service-shade::after { opacity: 1; }
.hero-service-body {
    position: absolute;
    left: 1.25rem;
    right: 4.5rem;
    bottom: 1.125rem;
    display: flex;
    flex-direction: column;
    gap: .125rem;
    transition: transform .3s cubic-bezier(.22, 1, .36, 1);
}
.hero-service-card:hover .hero-service-body { transform: translateY(-4px); }
.hero-service-title {
    font-size: 1.375rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: -.01em;
    line-height: 1.15;
    color: #fff;
    text-shadow: 0 2px 16px rgba(0,0,0,.4);
}
/* Başlık altı vurgu çizgisi: hover'da 0 → 40px uzar (caption'daki vurgu çizgisiyle aynı dil) */
.hero-service-title::after {
    content: "";
    display: block;
    width: 0;
    height: 2px;
    border-radius: 1px;
    background: var(--accent);
    margin-top: .3rem;
    transition: width .35s cubic-bezier(.22, 1, .36, 1);
}
.hero-service-card:hover .hero-service-title::after { width: 40px; }
.hero-service-sub { font-size: 1rem; font-weight: 500; color: rgba(255,255,255,.9); }
/* Ok düğmesi: hero CTA ile aynı dil — beyaz yuvarlatılmış kutu, koyu ok; hover'da tersine döner (koyu kutu, beyaz ok) */
.hero-service-go {
    position: absolute;
    right: 1.125rem;
    bottom: 1.125rem;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--text);
    background: #fff;
    box-shadow: 0 10px 24px -12px rgba(0,0,0,.6);
    transition: background .22s ease-out, color .22s ease-out, transform .22s ease-out;
}
.hero-service-go svg { transform: rotate(90deg); transition: transform .22s ease-out; }
.hero-service-card:hover .hero-service-go { background: var(--text); color: #fff; }
.hero-service-card:hover .hero-service-go svg { transform: rotate(90deg) translateY(-2px) translateX(2px); }
.hero-service-card:focus-visible { outline: 3px solid rgba(255,255,255,.85); outline-offset: 3px; }

.hero-services-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: .625rem;
}
.hero-services-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.25);
    background: rgba(255,255,255,.08);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s ease-out;
}
.hero-services-btn:hover { background: rgba(255,255,255,.22); }
.hero-services-btn:focus-visible { outline: 3px solid rgba(255,255,255,.85); outline-offset: 2px; }
.hero-services-dots { display: flex; gap: .375rem; }
.hero-services-dots span {
    width: 6px;
    height: 6px;
    border-radius: 3px;
    background: rgba(255,255,255,.35);
    transition: width .2s ease-out, background .2s ease-out;
}
.hero-services-dots span.on { width: 18px; background: #fff; }

@media (prefers-reduced-motion: reduce) {
    .hero-service-card, .hero-service-card img, .hero-service-shade::after, .hero-service-body,
    .hero-service-title::after, .hero-service-go, .hero-service-go svg, .quote-submit, .quote-submit svg { transition: none; }
    .hero-service-card:hover img, .hero-service-card:hover .hero-service-body { transform: none; }
}

/* ─── Hakkımızda bölümü (anasayfa; banner "hakkimizda"): sol metin | sağ görsel ───
   Referans: açık gri zemin, 14px kalın etiket + ince çizgi, 50px başlık (≤1024: 32px, ≤767: 26px),
   440px paragraf, site geneli .site-cta buton; sağda 12px köşeli görsel, 60vh min yükseklik. */
.about-split {
    background: #f7f8fa;
    padding: 9vh 1.5rem;
}
@media (min-width: 992px) { .about-split { padding: 9vh 3rem; } }

.about-split-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 30px;
    align-items: stretch;
}
@media (min-width: 992px) { .about-split-inner { grid-template-columns: 1fr 1fr; } }

/* ── Bölüm giriş bloğu (.sec-intro): etiket + çizgi + başlık + paragraf + .site-cta — About ve Hizmetler ortak ── */
.sec-intro {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
@media (min-width: 992px) { .sec-intro { gap: 30px; } }
.sec-intro > .site-cta { align-self: flex-start; }

.sec-eyebrow {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.14;
    color: var(--text);
}
.sec-divider {
    margin: 0;
    border: 0;
    border-top: 1px solid #e6e9eb;
    opacity: 1;
}
.sec-title {
    margin: 0;
    max-width: 100%;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    color: var(--text);
    text-wrap: balance;
}
@media (min-width: 768px)  { .sec-title { font-size: 32px; } }
@media (min-width: 1025px) { .sec-title { font-size: 50px; } }
.sec-desc {
    margin: 0;
    max-width: 440px;
    font-size: 1rem;
    line-height: 1.5;
    color: #55657f;
    white-space: pre-line;
}

/* About: sol sütun giriş bloğu, sağda görsel için pay */
@media (min-width: 992px) { .about-split-text { padding-right: 5%; } }

.about-split-media {
    position: relative;
    margin: 0;
    min-height: calc(20vw + 20vh);
    border-radius: 12px;
    overflow: hidden;
    background: #dfe3ea;
}
@media (min-width: 992px) { .about-split-media { min-height: 60vh; } }
.about-split-media picture,
.about-split-media .about-split-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.about-split-img { object-fit: cover; display: block; }

/* ─── Hizmetler bölümü (anasayfa; giriş bloğu banner "hizmetler", kartlar Hizmetler modülü) ───
   Referans: beyaz zemin; giriş bloğu .sec-intro (About ile aynı), altında 20px aralıklı kartlar —
   3'lü grid (tablet 2, mobil 1). Kart: beyaz, 12px köşe, 40px 30px iç boşluk, 350px min yükseklik;
   görsel/ikon, 18px başlık, 16px açıklama, altta ok kutusu. Hover: zemin vurgu rengi, yazılar beyaz. */
.svc-section {
    background: var(--surface);
    padding: 9vh 1.5rem;
}
@media (min-width: 992px) { .svc-section { padding: 9vh 3rem; } }
.svc-inner { max-width: 1280px; margin: 0 auto; }
.svc-intro { margin-bottom: 40px; }

.svc-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}
@media (min-width: 768px) { .svc-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px) { .svc-grid { grid-template-columns: repeat(3, 1fr); } }

.svc-card-wrap { display: flex; }
/* Kart: hover efekti YOK (genel a:hover opaklık/renk kuralı etkisizleştirilir); görsel üstte tam genişlik */
.svc-card {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    text-decoration: none !important;
}
.svc-card:hover { opacity: 1; color: var(--text); }
.svc-card:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: 3px; }

/* 16:10 kutu; görsel mutlak konumlu (kaynak görselin oranı kutuyu büyütmesin), cover ile doldurur */
.svc-card-media {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #eef0f4;
}
.svc-card-media picture, .svc-card-img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.svc-card-img { object-fit: cover; }

.svc-card-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 24px 24px 28px;
}
@media (min-width: 1025px) { .svc-card-body { padding: 28px 30px 32px; } }

/* Görsel yoksa: referanstaki ikon yerine vurgu renkli küçük glyph */
.svc-card-glyph {
    position: relative;
    display: block;
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: var(--accent);
    margin: 0 0 24px;
}
.svc-card-glyph::after {
    content: "";
    position: absolute;
    right: -10px;
    bottom: -8px;
    width: 10px;
    height: 10px;
    border-radius: 2px;
    background: var(--accent);
}

.svc-card-title {
    margin: 0 0 12px;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--text);
}
.svc-card-desc {
    margin: 0 0 24px;
    font-size: 1rem;
    line-height: 1.5;
    color: #55657f;
}
/* Alt ok kutusu: .site-cta-icon ile aynı görünüm; kart hover'ı olmadığından sabit */
.svc-card-go { margin-top: auto; }

/* ─── CTA bant (anasayfa; banner "cta-bant"): tam genişlik görsel, altta üst satır + çizgi + başlık | buton ─── */
.cta-band {
    position: relative;
    isolation: isolate;
    min-height: 60vh;
    display: flex;
    align-items: flex-end;
    padding: 55px 1.5rem 0;
    background: #0f1115;
    color: #fff;
    overflow: hidden;
}
@media (min-width: 992px) { .cta-band { padding: 55px 3rem 0; } }
.cta-band-bg, .cta-band-scrim { position: absolute; inset: 0; z-index: -1; }
/* Parallax katmanı: ekran yüksekliğinde (bant en fazla 100vh); script transform ile bandın konumu kadar ters
   kaydırır → görsel ekrana sabit kalır (background-attachment:fixed eşdeğeri). JS yoksa bantla birlikte kayar. */
.cta-band-bg { top: 0; bottom: auto; height: 100vh; height: 100lvh; will-change: transform; }
.cta-band-bg picture, .cta-band-img { display: block; width: 100%; height: 100%; }
.cta-band-img { object-fit: cover; object-position: center left; }
.cta-band-scrim { background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.35) 55%, rgba(0,0,0,.7) 100%); }
.cta-band-inner { width: 100%; max-width: 1280px; margin: 0 auto; }
.cta-band-top { margin: 0 0 20px; font-size: 14px; font-weight: 700; line-height: 1.14; color: #fff; }
.cta-band-divider { margin: 0; border: 0; border-top: 1px solid rgba(255,255,255,.3); opacity: 1; }
.cta-band-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding: 30px 0;
}
@media (min-width: 768px) { .cta-band-row { flex-direction: row; align-items: center; justify-content: space-between; gap: 30px; } }
.cta-band-title {
    margin: 0;
    max-width: 570px;
    font-size: clamp(26px, 3.2vw, 46px);
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
    text-wrap: balance;
}

/* ─── Neden biz (anasayfa; banner "neden-biz"): sol giriş bloğu | sağ akordeon; görsel varsa orta görsel alanı ─── */
.wc-section { background: var(--surface); padding: 9vh 1.5rem; }
@media (min-width: 992px) { .wc-section { padding: 9vh 3rem; } }
.wc-inner {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 40px;
    align-items: start;
}
@media (min-width: 992px)  { .wc-inner { grid-template-columns: 1fr 1fr; gap: 40px; } }
/* Görsel girilmişse: geniş ekranda üç sütun (35 | 30 | 35), orta sütun görsel */
@media (min-width: 1200px) { .wc-inner--medya { grid-template-columns: 35fr 30fr 35fr; gap: 20px; } }
.wc-intro { gap: 20px; }
.wc-intro .sec-title { max-width: 520px; }

/* Görsel alanı: yalnız görsel varken basılır. Dar ekranda akordeonun altında tam genişlik (order), ≥1200 orta sütun. */
.wc-media {
    position: relative;
    margin: 0;
    aspect-ratio: 16 / 9;
    border-radius: 12px;
    overflow: hidden;
    background: #eef0f4;
    order: 3;
}
@media (min-width: 992px) and (max-width: 1199.98px) { .wc-media { grid-column: 1 / -1; aspect-ratio: 16 / 7; } }
@media (min-width: 1200px) { .wc-media { order: 0; aspect-ratio: 4 / 5; align-self: start; } }
.wc-media picture, .wc-media-img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.wc-media-img { object-fit: cover; }

.wc-acc { width: 100%; }
.wc-item { border-top: 1px solid #e6e9eb; }
.wc-item:last-child { border-bottom: 1px solid #e6e9eb; }
.wc-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 30px 0;
    cursor: pointer;
    list-style: none;
}
.wc-summary::-webkit-details-marker { display: none; }
.wc-summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: 4px; border-radius: 4px; }
.wc-item-title { margin: 0; font-size: 20px; font-weight: 600; line-height: 1.2; color: var(--text); }
/* +/− ikonu: iki çizgi; açıkken dikey çizgi kaybolur */
.wc-icon { position: relative; width: 16px; height: 16px; flex-shrink: 0; }
.wc-icon::before, .wc-icon::after {
    content: "";
    position: absolute;
    left: 0; top: 7px;
    width: 16px; height: 2px;
    background: var(--text);
    transition: transform .2s ease-out, opacity .2s ease-out;
}
.wc-icon::after { transform: rotate(90deg); }
.wc-item[open] .wc-icon::after { transform: rotate(0); opacity: 0; }
.wc-body { padding: 0 40px 30px 0; margin-top: -10px; }
.wc-body p { margin: 0; font-size: 1rem; line-height: 1.5; color: #55657f; white-space: pre-line; }
@media (prefers-reduced-motion: reduce) { .wc-icon::before, .wc-icon::after { transition: none; } }

/* ─── Kelime akışı (anasayfa; banner "kelime-akisi"): etiket + çizgi, solda başlık, sağda akan kelimeler ─── */
.kw-section { background: var(--surface); padding: 7vh 1.5rem; }
@media (min-width: 992px) { .kw-section { padding: 7vh 3rem; } }
.kw-inner { max-width: 1280px; margin: 0 auto; display: flex; flex-direction: column; gap: 20px; }
.kw-row { display: flex; flex-direction: column; gap: 16px; align-items: flex-start; }
@media (min-width: 992px) { .kw-row { flex-direction: row; align-items: center; gap: 40px; } }
.kw-title { margin: 0; flex-shrink: 0; font-size: clamp(22px, 2.2vw, 32px); font-weight: 700; line-height: 1.2; color: var(--text); }
.kw-track-wrap {
    flex: 1;
    min-width: 0;
    width: 100%;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
    mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.kw-track {
    display: flex;
    align-items: center;
    gap: 2.5rem;
    width: max-content;
    margin: 0;
    padding: .5rem 0;
    list-style: none;
    animation: logo-scroll 60s linear infinite; /* hafif akış; mevcut logo-scroll keyframe'i (0 → -50%) */
}
.kw-track:hover { animation-play-state: paused; }
.kw-item {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--text);
    white-space: nowrap;
}
.kw-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--accent); flex-shrink: 0; }
@media (prefers-reduced-motion: reduce) {
    .kw-track { animation: none; width: auto; flex-wrap: wrap; }
    .kw-item[aria-hidden="true"] { display: none; }
    .kw-track-wrap { mask-image: none; -webkit-mask-image: none; }
}

/* ─── Müşteri yorumları (anasayfa; MusteriYorum + banner "yorumlar-arkaplan"): görsel üstünde sağda kart ─── */
.tm-section {
    position: relative;
    isolation: isolate;
    min-height: 60vh;
    display: flex;
    align-items: flex-end;
    padding: 30px 1.5rem;
    background: #1a1d23;
    overflow: hidden;
}
@media (min-width: 992px) { .tm-section { padding: 7vh 3rem; align-items: center; } }
.tm-bg { position: absolute; inset: 0; z-index: -1; }
.tm-bg picture, .tm-img { display: block; width: 100%; height: 100%; }
.tm-img { object-fit: cover; }
.tm-inner { width: 100%; max-width: 1280px; margin: 0 auto; display: flex; justify-content: flex-end; }
.tm-frame {
    position: relative;
    width: 100%;
    max-width: 560px;
    padding: 20px;
    border-radius: 12px;
    background: rgba(255,255,255,.3);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.tm-quote {
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 5;
    display: inline-flex;
    align-items: flex-start;
    justify-content: center;
    padding: 20px 20px 10px;
    border-radius: 12px 0 12px 0;
    background: var(--accent);
    color: #fff;
}
.tm-card {
    border-radius: 12px;
    background: var(--surface);
    padding: 70px 20px 24px;
}
@media (min-width: 768px)  { .tm-card { padding: 80px 30px 28px; } }
@media (min-width: 1025px) { .tm-card { padding: 125px 40px 30px; } }
.tm-item { margin: 0; }
/* Sabit yükseklik: kısa / uzun yoruma göre kart slayt geçişinde zıplamasın. Mobilde 6, ≥768px'te 5 satır;
   taşan metin son satırda "…" ile kesilir. */
.tm-text {
    margin: 0 0 24px;
    font-size: clamp(1rem, 1.25vw, 1.25rem);
    font-weight: 400;
    line-height: 1.5;
    color: var(--text);
    text-wrap: pretty;
    height: 9em; /* 6 satır × 1.5 */
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 6;
    line-clamp: 6;
    overflow: hidden;
}
@media (min-width: 768px) { .tm-text { height: 7.5em; -webkit-line-clamp: 5; line-clamp: 5; } }
.tm-author { display: flex; align-items: center; gap: 14px; }
.tm-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    background: #eef0f4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.tm-avatar picture, .tm-avatar-img { display: block; width: 100%; height: 100%; }
.tm-avatar-img { object-fit: cover; }
.tm-avatar-initial { font-weight: 700; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, #fff); }
.tm-author-text { display: flex; flex-direction: column; gap: 4px; }
.tm-name { font-size: 17px; font-weight: 700; line-height: 1.3; color: var(--text); }
.tm-role { font-size: .875rem; color: #55657f; }
.tm-stars { display: inline-flex; gap: 3px; color: #d9dce3; }
.tm-stars svg.on { color: #f5a623; }
.tm-divider { margin: 28px 0 0; border: 0; border-top: 1px solid #e6e9eb; opacity: 1; }
/* Nokta göstergeleri: Bootstrap carousel-indicators yeniden konumlanır (kart içinde, sol altta) */
.tm-dots.carousel-indicators {
    position: static;
    justify-content: flex-start;
    margin: 20px 0 0;
    gap: 6px;
}
.tm-dots.carousel-indicators [data-bs-target] {
    width: 8px;
    height: 8px;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: color-mix(in srgb, var(--accent) 35%, #fff);
    opacity: 1;
    transition: background .2s ease-out, transform .2s ease-out;
}
.tm-dots.carousel-indicators .active { background: var(--accent); transform: scale(1.25); }

/* ─── 3'lü görsel banner (anasayfa; banner "uclu-banner"): sol büyük | sağ üst 2/3 + sağ alt 1/3 ─── */
.tb-section { background: var(--surface); padding: 7vh 1.5rem; }
@media (min-width: 992px) { .tb-section { padding: 7vh 3rem; } }
.tb-grid {
    max-width: 1280px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}
@media (min-width: 992px) {
    .tb-grid {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: 2fr 1fr;   /* sağ üst 2/3, sağ alt 1/3 */
        height: clamp(520px, 42vw, 680px);
    }
    .tb-card--sol { grid-column: 1; grid-row: 1 / 3; }
    .tb-card--sag-ust { grid-column: 2; grid-row: 1; }
    .tb-card--sag-alt { grid-column: 2; grid-row: 2; }
}
.tb-card {
    position: relative;
    isolation: isolate;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    min-height: 240px;
    aspect-ratio: 16 / 10;
    border-radius: 12px;
    overflow: hidden;
    background: #1a1d23;
    color: #fff;
    text-decoration: none !important;
}
@media (min-width: 992px) { .tb-card { aspect-ratio: auto; min-height: 0; } }
/* Mobil: aspect-ratio + min-height çakışınca kart genişleyip sayfayı taşırıyordu (384px > 342px); dar ekranda oran yeter */
@media (max-width: 991.98px) { .tb-card { min-height: 0; max-width: 100%; } .tb-grid { min-width: 0; } }
a.tb-card:hover { opacity: 1; color: #fff; }
a.tb-card:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 60%, transparent); outline-offset: 3px; }
.tb-media { position: absolute; inset: 0; z-index: -2; }
.tb-media picture, .tb-img { display: block; width: 100%; height: 100%; }
.tb-img { object-fit: cover; transition: transform .7s cubic-bezier(.22, 1, .36, 1); }
a.tb-card:hover .tb-img { transform: scale(1.04); }
.tb-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.72) 100%); }
.tb-body { padding: 24px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
@media (min-width: 1025px) { .tb-card--sol .tb-body { padding: 32px; } }
.tb-title { margin: 0; font-size: 20px; font-weight: 700; line-height: 1.2; color: #fff; text-shadow: 0 2px 16px rgba(0,0,0,.4); }
.tb-card--sol .tb-title { font-size: clamp(22px, 2.2vw, 32px); }
.tb-desc { margin: 0; max-width: 34rem; font-size: .9375rem; line-height: 1.5; color: rgba(255,255,255,.88); }
.tb-card--sag-alt .tb-desc { display: none; }           /* alçak kartta yalnız başlık (+ buton) */
.tb-cta { margin-top: 8px; }
@media (prefers-reduced-motion: reduce) { .tb-img { transition: none; } a.tb-card:hover .tb-img { transform: none; } }

/* ─── Blog bölümü (anasayfa; banner "blog" + Blog modülü): giriş bloğu + 4'lü otomatik karusel ─── */
.blog-section { background: var(--surface); padding: 9vh 1.5rem; }
@media (min-width: 992px) { .blog-section { padding: 9vh 3rem; } }
.blog-inner { max-width: 1280px; margin: 0 auto; }
.blog-intro { margin-bottom: 40px; }
.blog-carousel { position: relative; }
.blog-track {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 100%;
    gap: 20px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding-bottom: 4px;
}
.blog-track::-webkit-scrollbar { display: none; }
@media (min-width: 768px)  { .blog-track { grid-auto-columns: calc((100% - 20px) / 2); } }
@media (min-width: 992px)  { .blog-track { grid-auto-columns: calc((100% - 40px) / 3); } }
@media (min-width: 1200px) { .blog-track { grid-auto-columns: calc((100% - 60px) / 4); } }
.blog-card { scroll-snap-align: start; display: flex; }
.blog-card-link {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    text-decoration: none !important;
}
.blog-card-link:hover { opacity: 1; color: var(--text); }
.blog-card-link:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: 3px; }
.blog-card-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #eef0f4; }
.blog-card-media picture, .blog-card-img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.blog-card-img { object-fit: cover; }
.blog-card-body { flex: 1; display: flex; flex-direction: column; padding: 20px 20px 24px; }
.blog-card-date { display: block; margin-bottom: 10px; font-size: .8125rem; font-weight: 600; color: #55657f; }
.blog-card-title { margin: 0 0 10px; font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--text); }
.blog-card-desc { margin: 0 0 20px; font-size: .9375rem; line-height: 1.5; color: #55657f; }
.blog-card-go { margin-top: auto; }
.blog-nav { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.blog-nav-btn {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background .2s ease-out, color .2s ease-out;
}
.blog-nav-btn:hover { background: var(--text); color: #fff; }
.blog-nav-btn:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: 2px; }

/* ─── Footer (referans SwiftLine): koyu lacivert, 3 satır; CTA blokları | iletişim + menü | telif + yasal + sosyal ─── */
.ft {
    --ft-bg: #02091c;
    --ft-line: rgba(255,255,255,.12);
    --ft-muted: #e6e9eb;
    background: var(--ft-bg);
    color: #fff;
    padding: 0 1.5rem;
}
@media (min-width: 992px) { .ft { padding: 0 3rem; } }
.ft-inner { max-width: 1280px; margin: 0 auto; }
.ft a { color: inherit; text-decoration: none !important; }
.ft a:hover { opacity: 1; }

/* Satırlar: iki yarı; ≥768 yan yana, aralarında dikey çizgi */
.ft-row { display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { .ft-row { grid-template-columns: 1fr 1fr; } }
.ft-half { min-width: 0; }

/* 1) CTA satırı */
.ft-row--cta { padding-top: 55px; }
.ft-row--cta .ft-half { padding: 30px 0; border-bottom: 1px solid var(--ft-line); }
@media (min-width: 768px) {
    .ft-row--cta .ft-half { padding: 7vh 20px 7vh 0; }
    .ft-row--cta .ft-half + .ft-half { padding: 7vh 0 7vh 10%; border-left: 1px solid var(--ft-line); }
}
.ft-cta { display: block; max-width: 520px; color: #fff; }
.ft-cta-head { display: flex; align-items: center; gap: 15px; }
.ft-cta-title {
    margin: 0;
    font-size: clamp(32px, 3.2vw, 50px);
    font-weight: 700;
    line-height: 1.1;
    color: #fff;
}
.ft-cta-arrow { display: inline-flex; color: var(--accent); transition: transform .25s ease-out; }
a.ft-cta:hover .ft-cta-arrow { transform: translate(4px, 4px); }
a.ft-cta:hover .ft-cta-title { color: var(--accent); }
.ft-cta-title { transition: color .2s ease-out; }
.ft-cta-desc { margin: 10px 0 0; max-width: 340px; font-size: 1rem; line-height: 1.5; color: rgba(255,255,255,.88); }
a.ft-cta:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 60%, transparent); outline-offset: 6px; border-radius: 4px; }

/* 2) İletişim + menü satırı */
.ft-row--info .ft-half { padding: 30px 0; border-bottom: 1px solid var(--ft-line); }
@media (min-width: 768px) {
    .ft-row--info .ft-half { padding: 30px 20px 30px 0; }
    .ft-row--info .ft-half + .ft-half { padding: 30px 0 30px 10%; border-left: 1px solid var(--ft-line); }
}
.ft-contacts { display: flex; flex-wrap: wrap; gap: 24px 60px; }
.ft-info { display: inline-flex; flex-direction: column; gap: 4px; }
.ft-info-label { font-size: 14px; line-height: 1.3; color: var(--ft-muted); }
.ft-info-value { font-size: 1rem; font-weight: 700; line-height: 1.3; color: #fff; transition: color .2s ease-out; }
.ft-info:hover .ft-info-value { color: var(--accent); }
.ft-nav { display: flex; align-items: center; }
@media (min-width: 768px) { .ft-nav { justify-content: flex-end; } }
.ft-nav-list { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0; padding: 0; list-style: none; }
@media (min-width: 768px) { .ft-nav-list { justify-content: flex-end; } }
.ft-nav-link { font-size: 15px; line-height: 1.5; color: #fff; white-space: nowrap; transition: color .2s ease-out; }
.ft-nav-link:hover { color: var(--accent); }
/* Footer akordeonu: 992px altında menü ve yasal linkler başlıkla açılır/kapanır; genişte başlık gizli, listeler açık */
.ft-acc-toggle { display: none; }
@media (max-width: 991.98px) {
    .ft-acc-toggle { display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 14px 0; border: 0; border-bottom: 1px solid var(--ft-line); background: none; color: #fff; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
    .ft-acc-toggle svg { transition: transform .2s; color: var(--accent); }
    .ft-acc.is-open .ft-acc-toggle svg { transform: rotate(180deg); }
    .ft-acc .ft-acc-panel { display: none; }
    .ft-acc.is-open .ft-acc-panel { display: flex; flex-direction: column; gap: 0; }
    .ft-acc.is-open .ft-nav-list li, .ft-acc.is-open .ft-legal li { border-bottom: 1px solid var(--ft-line); }
    .ft-acc.is-open .ft-nav-link, .ft-acc.is-open .ft-legal-link { display: block; padding: 12px 0; }
    .ft-nav { display: block; }
    .ft-row--legal { padding: 0; border-bottom: 0; }
    .ft-legal { justify-content: flex-start; }
    .ft-legal li { white-space: normal; }
}

/* 3a) Yasal linkler: tek satır (dar ekranda sarar), altta çizgi */
.ft-row--legal { display: block; padding: 20px 0; border-bottom: 1px solid var(--ft-line); }
.ft-legal { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; margin: 0; padding: 0; list-style: none; }
/* Geniş ekranda TEK satır: sarmaz; çok uzunsa görünmez kaydırma çubuğuyla yatay kayar */
@media (min-width: 992px) { .ft-legal { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .ft-legal::-webkit-scrollbar { display: none; } }
.ft-legal li { white-space: nowrap; }
/* 3b) Alt satır: solda telif, sağda sosyal ikonlar */
.ft-row--bottom {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 30px 0;
}
@media (min-width: 768px) { .ft-row--bottom { flex-direction: row; align-items: center; justify-content: space-between; gap: 30px; } }
.ft-copy { margin: 0; font-size: 1rem; color: rgba(255,255,255,.92); }
.ft-legal-link { font-size: 13px; color: rgba(255,255,255,.85); transition: color .2s ease-out; }
.ft-legal-link:hover { color: var(--accent); }
.ft-social { display: flex; gap: 30px; margin: 0; padding: 0; list-style: none; }
.ft-social a { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; min-height: 24px; font-size: 18px; color: var(--ft-muted); transition: color .2s ease-out; }
.ft-social a:hover { color: var(--accent); }
.ft a:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 60%, transparent); outline-offset: 3px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { .ft-cta-arrow, .ft-cta-title, .ft-info-value, .ft-nav-link, .ft-legal-link, .ft-social a { transition: none; } a.ft-cta:hover .ft-cta-arrow { transform: none; } }

/* ─── Özellik kartları (anasayfa; banner "ozellik-kartlari"; referans "Services"): giriş + ikonlu kartlar ───
   Kart: beyaz, 12px köşe, 350px min yükseklik, 40px 30px iç boşluk; ikon (yüklenen PNG/SVG ya da glyph), 18px başlık,
   16px açıklama. Hover: vurgu zemin, beyaz yazı/glyph, sağ altta beyaz ok sekmesi. 4'lü (≥1200), 3'lü, 2'li, tekli ızgara. */
.fk-section { background: var(--surface); padding: 9vh 1.5rem; }
@media (min-width: 992px) { .fk-section { padding: 9vh 3rem; } }
.fk-inner { max-width: 1280px; margin: 0 auto; }
.fk-intro { margin-bottom: 40px; }

.fk-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px)  { .fk-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 992px)  { .fk-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1200px) { .fk-grid { grid-template-columns: repeat(4, 1fr); } }

.fk-card-wrap { display: flex; }
.fk-card {
    position: relative;
    flex: 1;
    display: flex;
    flex-direction: column;
    min-height: 320px;
    padding: 30px 20px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--surface);
    color: var(--text);
    text-decoration: none !important;
    transition: background .25s ease-out, color .25s ease-out;
}
@media (min-width: 1025px) { .fk-card { min-height: 350px; padding: 40px 30px; } }
a.fk-card { cursor: pointer; }
a.fk-card:hover,
a.fk-card:focus-visible { opacity: 1; background: var(--accent); color: #fff; }
a.fk-card:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: 3px; }

/* İkon: yüklenen görsel (40px yükseklik) */
.fk-icon { display: block; height: 40px; margin: 0 0 24px; }
.fk-icon picture, .fk-icon-img { display: block; height: 40px; width: auto; }
.fk-icon-img { object-fit: contain; }
/* Glyph: büyük kare + sağ altta küçük kare; hover'da beyaz */
.fk-glyph {
    position: relative;
    display: block;
    width: 36px;
    height: 36px;
    border-radius: 7px;
    background: var(--accent);
    margin: 0 0 24px;
    transition: background .25s ease-out;
}
.fk-glyph::after {
    content: "";
    position: absolute;
    right: -12px;
    bottom: -8px;
    width: 12px;
    height: 12px;
    border-radius: 2px;
    background: var(--accent);
    transition: background .25s ease-out;
}
a.fk-card:hover .fk-glyph,
a.fk-card:hover .fk-glyph::after { background: #fff; }

.fk-title { margin: 0 0 24px; font-size: 18px; font-weight: 600; line-height: 1.3; color: var(--text); transition: color .25s ease-out; }
.fk-desc  { margin: 0; font-size: 1rem; line-height: 1.5; color: #55657f; transition: color .25s ease-out; }
a.fk-card:hover .fk-title,
a.fk-card:hover .fk-desc { color: #fff; }

/* Ok sekmesi: sağ alt köşede beyaz kutu (sol üst köşesi yuvarlak), vurgu renkli ok; yalnız hover'da */
.fk-go {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 64px;
    height: 64px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-top-left-radius: 12px;
    background: var(--surface);
    color: var(--accent);
    opacity: 0;
    transform: translate(10px, 10px);
    transition: opacity .25s ease-out, transform .25s ease-out;
}
a.fk-card:hover .fk-go,
a.fk-card:focus-visible .fk-go { opacity: 1; transform: none; }
div.fk-card .fk-go { display: none; }

@media (prefers-reduced-motion: reduce) {
    .fk-card, .fk-glyph, .fk-glyph::after, .fk-title, .fk-desc, .fk-go { transition: none; }
    .fk-go { transform: none; }
}

/* ─── Fiyat Hesapla / Teklif Al sayfaları (.hc-*): sol kart + sağ yan bar; site çizgisi (12px köşe, sec-intro, site-cta) ─── */
button.site-cta { border: 0; font-family: inherit; }
.hc-section { background: var(--bg); padding: 6vh 1.5rem 9vh; }
@media (min-width: 992px) { .hc-section { padding: 6vh 3rem 9vh; } }
.hc-inner { max-width: 1280px; margin: 0 auto; }
.hc-intro { margin-bottom: 28px; }
.hc-eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.hc-eyebrow::before { content: ""; width: 28px; height: 2px; background: var(--accent); }
.hc-card-head { margin-bottom: 28px; padding-bottom: 20px; border-bottom: 1px solid var(--border); }
.hc-card-head .hc-card-title { margin-bottom: 6px; }
.hc-card-sub { margin: 0; font-size: .9375rem; color: #55657f; }
.hc-only-mobile { display: none; }
@media (max-width: 991px) { .hc-only-desktop { display: none; } .hc-only-mobile { display: inline; } }
.hc-lead { margin: 0 0 28px; max-width: 46rem; font-size: 1.0625rem; line-height: 1.6; color: #55657f; }
.hc-intro .hc-lead { margin-bottom: 14px; }
.hc-pills { display: flex; flex-wrap: wrap; gap: 8px 14px; margin: 0; padding: 0; list-style: none; }
.hc-pills li { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); font-size: .875rem; font-weight: 600; color: var(--text); }
.hc-pills li svg { width: 16px; height: 16px; color: var(--accent); }

.hc-layout { display: grid; grid-template-columns: 1fr; gap: 24px; align-items: start; }
@media (min-width: 992px) { .hc-layout { grid-template-columns: minmax(0, 1fr) 380px; gap: 30px; } }
.hc-main { min-width: 0; }
.hc-aside { display: grid; gap: 20px; }

.hc-card { position: relative; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 24px 20px; }
@media (min-width: 768px) { .hc-card { padding: 36px 32px; } }
.hc-card-title { display: flex; align-items: center; gap: 12px; margin: 0 0 24px; font-size: clamp(22px, 2.2vw, 28px); font-weight: 700; color: var(--text); }
.hc-card-title-icon { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 12px; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); }
.hc-sec { margin: 0 0 2px; font-size: 1.0625rem; font-weight: 700; line-height: 1.3; color: var(--text); }
/* Numaralı adım rayı: sol çizgi + daire; odaklanınca ya da tamamlanınca daire dolar */
.hc-steps { list-style: none; margin: 0; padding: 0; }
.hc-step { position: relative; padding: 0 0 30px 52px; }
.hc-step::before { content: ""; position: absolute; left: 17px; top: 42px; bottom: 6px; width: 2px; background: var(--border); }
.hc-step--last { padding-bottom: 8px; }
.hc-step--last::before { display: none; }
.hc-step-no { position: absolute; left: 0; top: 0; display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; border: 2px solid var(--border); background: #fff; font-size: .875rem; font-weight: 800; color: var(--text); transition: background .2s ease-out, color .2s ease-out, border-color .2s ease-out; }
.hc-step:focus-within .hc-step-no, .hc-step.is-done .hc-step-no { background: var(--accent); border-color: var(--accent); color: #fff; }
.hc-step-hint { margin: 0 0 14px; font-size: .875rem; color: #55657f; }
.hc-step .hc-checks { margin-top: 0; }
@media (max-width: 639px) { .hc-step { padding-left: 44px; } .hc-step-no { width: 32px; height: 32px; font-size: .8125rem; } .hc-step::before { left: 15px; top: 38px; } }

.hc-grid2 { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .hc-grid2 { grid-template-columns: 1fr 1fr; } }
.hc-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.hc-label { font-size: .875rem; font-weight: 600; color: var(--text); }
.hc-input, .hc-select {
    width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid rgba(0,0,0,.14); border-radius: 10px;
    background: #fff; color: var(--text); font: inherit; font-size: .95rem; transition: border-color .15s, box-shadow .15s;
}
.hc-select { appearance: none; -webkit-appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>"); background-repeat: no-repeat; background-position: right 14px center; }
.hc-textarea { min-height: 120px; padding: 12px 14px; resize: vertical; }
.hc-input:focus, .hc-select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent); }

/* Konut tipi kutucukları */
.hc-tiles { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin: 0; padding: 0; border: 0; }
@media (min-width: 640px) { .hc-tiles { grid-template-columns: repeat(4, 1fr); } }
.hc-tile-input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.hc-tile {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 64px; padding: 10px 8px; border-radius: 10px;
    border: 1px solid rgba(0,0,0,.12); background: #fff; font-size: .9375rem; font-weight: 600; color: var(--text);
    text-align: center; cursor: pointer; transition: background .18s ease-out, color .18s ease-out, border-color .18s ease-out, transform .18s ease-out;
}
.hc-tile:hover { border-color: var(--accent); transform: translateY(-1px); }
.hc-tile-input:checked + .hc-tile { background: var(--accent); border-color: var(--accent); color: #fff; }
.hc-tile-label { font-weight: 600; }
.hc-tile-hint { font-size: .75rem; font-weight: 500; color: #55657f; font-variant-numeric: tabular-nums; }
.hc-tile-input:checked + .hc-tile .hc-tile-hint { color: rgba(255,255,255,.85); }
.hc-tile-input:focus-visible + .hc-tile { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: 2px; }

/* Kat + asansör */
.hc-floor { display: flex; align-items: center; gap: 14px; }
.hc-floor .hc-input { max-width: 110px; }
.hc-check { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; color: var(--text); cursor: pointer; }
.hc-check input { width: 18px; height: 18px; accent-color: var(--accent); }
.hc-checks { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 0; padding: 0; border: 0; }
.hc-checks legend { width: 100%; margin-bottom: 10px; }
.hc-check--pill { padding: 8px 14px; border: 1px solid rgba(0,0,0,.12); border-radius: 999px; background: #fff; }
.hc-check--pill:has(input:checked) { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, #fff); }
.hc-kvkk { margin-top: 18px; align-items: flex-start; font-size: .875rem; color: #55657f; }
.hc-kvkk a { color: var(--accent); font-weight: 600; }
.hc-card .hc-field { margin-top: 20px; }
.hc-card .hc-grid2 .hc-field { margin-top: 0; }

/* Ek hizmet kartları */
.hc-services { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin: 0; padding: 0; border: 0; }
@media (min-width: 768px) { .hc-services { grid-template-columns: repeat(4, 1fr); } }
.hc-service {
    display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 10px; border-radius: 12px;
    border: 1px solid rgba(0,0,0,.12); background: #fff; text-align: center; cursor: pointer;
    transition: background .18s ease-out, color .18s ease-out, border-color .18s ease-out, transform .18s ease-out;
}
.hc-service:hover { border-color: var(--accent); transform: translateY(-1px); }
.hc-service-icon { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 10px; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); transition: background .18s, color .18s; }
.hc-service-name { font-size: .9375rem; font-weight: 600; line-height: 1.25; color: var(--text); }
.hc-service-hint { font-size: .75rem; color: #55657f; }
.hc-tile-input:checked + .hc-service { background: var(--accent); border-color: var(--accent); }
.hc-tile-input:checked + .hc-service .hc-service-name, .hc-tile-input:checked + .hc-service .hc-service-hint { color: #fff; }
.hc-tile-input:checked + .hc-service .hc-service-icon { background: rgba(255,255,255,.18); color: #fff; }
.hc-tile-input:focus-visible + .hc-service { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: 2px; }

.hc-submit { margin-top: 28px; width: 100%; justify-content: space-between; }
.hc-input[aria-invalid="true"], .hc-select[aria-invalid="true"], .cb-grid .form-control[aria-invalid="true"] { border-color: #b02a37; }
.hc-input[aria-invalid="true"]:focus, .hc-select[aria-invalid="true"]:focus { box-shadow: 0 0 0 3px rgba(176,42,55,.18); }
.hc-field-msg { display: flex; align-items: center; gap: 6px; margin: 2px 0 0; font-size: .8125rem; font-weight: 500; color: #b02a37; }
.hc-field-msg::before { content: ""; flex-shrink: 0; width: 6px; height: 6px; border-radius: 50%; background: #b02a37; }
.hc-kvkk .hc-field-msg { width: 100%; }
.hc-field-msg:empty { display: none; }
.lk-side-list--tek { columns: 1; }
.hc-kvkk:has(input[aria-invalid="true"]) { flex-wrap: wrap; }
.cb-grid .form-floating .hc-field-msg { margin: 4px 0 0; }
.hc-error { margin: 14px 0 0; padding: 12px 14px; border-radius: 10px; background: #fdecec; color: #b02a37; font-size: .9rem; }
.hc-result { margin-top: 24px; padding: 24px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 8%, #fff); border: 1px solid color-mix(in srgb, var(--accent) 30%, #fff); }
.hc-result-label { margin: 0 0 6px; font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.hc-result-price { margin: 0 0 8px; font-size: clamp(28px, 3.6vw, 44px); font-weight: 800; line-height: 1.1; color: var(--text); }
.hc-result-note, .hc-result-text { margin: 0 0 18px; font-size: .95rem; color: #55657f; }
.hc-result-text { margin-bottom: 0; }
.hc-result-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.hc-link { font-weight: 600; color: var(--accent); }
@media (min-width: 992px) { .hc-result--inline { display: none !important; } }

/* Canlı tahmin paneli (masaüstü, yapışkan yan bar) */
@media (min-width: 992px) { .hc-aside--sticky { position: sticky; top: 24px; } }
.hc-live { background: #02091c; color: #fff; border-radius: 12px; padding: 26px 24px; border: 1px solid rgba(255,255,255,.08); }
.hc-live-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.hc-live-icon { display: inline-flex; flex-shrink: 0; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: 12px; background: var(--accent); color: #fff; }
.hc-live-icon svg { width: 24px; height: 24px; }
.hc-live-icon img { width: 26px; height: 26px; object-fit: contain; }
.hc-live-eyebrow { margin: 0 0 2px; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.hc-live-title { margin: 0; font-size: 1.125rem; font-weight: 700; color: #fff; }
.hc-live-empty { margin: 0; font-size: .9375rem; line-height: 1.6; color: rgba(255,255,255,.72); }
.hc-live-price { margin: 0 0 14px; font-size: clamp(28px, 2.4vw, 36px); font-weight: 800; line-height: 1.1; color: #fff; font-variant-numeric: tabular-nums; }
.hc-live-summary { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 0; list-style: none; }
.hc-live-summary li { padding: 5px 10px; border-radius: 999px; background: rgba(255,255,255,.1); font-size: .8125rem; font-weight: 600; color: #fff; }
.hc-live-note { margin: 0 0 18px; font-size: .875rem; line-height: 1.5; color: rgba(255,255,255,.65); }
.hc-live-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.hc-live-wa { font-weight: 600; color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.hc-live-wa:hover { color: #fff; opacity: 1; text-decoration-color: var(--accent); }
.hc-live.is-flash { animation: hcFlash .7s ease-out; }
@keyframes hcFlash { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 70%, transparent); } 100% { box-shadow: 0 0 0 18px transparent; } }
@media (max-width: 991px) { .hc-live { display: none; } }

/* Fiyatı etkileyen faktörler: kartın altında 4'lü şerit, editoryal numara */
.hc-factors { margin-top: 36px; }
.hc-factors-title { display: flex; align-items: center; gap: 10px; margin: 0 0 16px; font-size: 1.125rem; font-weight: 700; color: var(--text); }
.hc-factors-title svg { width: 20px; height: 20px; color: var(--accent); }
.hc-factors-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 640px) { .hc-factors-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1200px) { .hc-factors-grid { grid-template-columns: repeat(4, 1fr); } }
.hc-factor { padding: 22px 20px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); }
.hc-factor-no { display: block; margin-bottom: 10px; font-size: 12px; font-weight: 800; letter-spacing: .1em; color: var(--accent); font-variant-numeric: tabular-nums; }
.hc-factor strong { display: block; margin-bottom: 4px; font-size: 1rem; font-weight: 700; color: var(--text); }
.hc-factor p { margin: 0; font-size: .875rem; line-height: 1.55; color: #55657f; }

/* Yan bar kartları */
.side-card { background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 24px; }
.side-card--soft { background: #f7f8fa; border-color: transparent; }
.side-card--accent { background: var(--accent); border-color: var(--accent); color: #fff; }
.side-card--accent .side-card-title { color: #fff; }
.side-card--dark { background: #02091c; border-color: #02091c; color: #fff; }
.side-card--dark .side-card-title { color: #fff; }
.side-card--dark .side-contact { background: rgba(255,255,255,.08); }
.side-card--dark .side-contact:hover { background: rgba(255,255,255,.16); }
.side-card--dark .side-contact-icon { background: var(--accent); color: #fff; }
.side-card-icon { display: inline-flex; width: 64px; height: 64px; align-items: center; justify-content: center; border-radius: 16px; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); margin-bottom: 16px; }
.side-card-icon svg { width: 32px; height: 32px; }
.side-card-img { width: 32px; height: 32px; object-fit: contain; }
.side-card-title { margin: 0 0 8px; font-size: 1.25rem; font-weight: 700; color: var(--text); }
.side-card-title--sm { display: flex; align-items: center; gap: 8px; font-size: 1.0625rem; margin-bottom: 14px; }
.side-card-title--sm svg { width: 18px; height: 18px; color: var(--accent); }
.side-card-text { margin: 0; font-size: .95rem; line-height: 1.6; color: #55657f; }
.side-list { display: flex; flex-direction: column; gap: 14px; margin: 0; padding: 0; list-style: none; }
.side-list li { display: flex; gap: 10px; align-items: flex-start; font-size: .9375rem; line-height: 1.4; color: var(--text); }
.side-list li strong { display: block; font-weight: 600; }
.side-list li small { display: block; margin-top: 2px; font-size: .8125rem; color: #55657f; }
.side-list-icon { display: inline-flex; flex-shrink: 0; width: 18px; height: 18px; margin-top: 2px; color: var(--accent); }
.side-list-icon svg { width: 18px; height: 18px; }
.side-list-badge { display: inline-flex; flex-shrink: 0; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: var(--accent); color: #fff; }
.side-list-badge svg { width: 20px; height: 20px; }
.side-list--icons li { align-items: center; }
.side-badges { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.side-badge { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 20px 10px; border-radius: 12px; background: #f7f8fa; text-align: center; }
.side-badge-icon { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 10px; background: #fff; color: var(--accent); }
.side-badge-icon svg, .side-badge-img { width: 22px; height: 22px; object-fit: contain; }
.side-badge-text { font-size: .875rem; font-weight: 700; color: var(--text); }
.side-contact { display: flex; align-items: center; gap: 14px; margin-top: 14px; padding: 14px; border-radius: 10px; background: rgba(255,255,255,.14); color: #fff; text-decoration: none !important; transition: background .2s; }
.side-contact:hover { background: rgba(255,255,255,.24); color: #fff; opacity: 1; }
.side-contact-icon { display: inline-flex; flex-shrink: 0; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; background: #fff; color: var(--accent); }
.side-contact--wa .side-contact-icon { background: #25d366; color: #fff; }
.side-contact small { display: block; font-size: .8125rem; opacity: .9; }
.side-contact strong { display: block; font-size: 1.125rem; font-weight: 700; }
.side-hours { display: flex; justify-content: space-between; align-items: center; font-size: .95rem; color: var(--text); }
.side-hours strong { font-weight: 800; color: var(--accent); }
.side-note { display: flex; gap: 6px; margin: 12px 0 0; font-size: .8125rem; line-height: 1.5; color: #55657f; }
.side-note svg { flex-shrink: 0; width: 16px; height: 16px; margin-top: 2px; color: var(--accent); }

/* Fiyat tablosu */
.pt-section { background: var(--surface); padding: 7vh 1.5rem; }
@media (min-width: 992px) { .pt-section { padding: 7vh 3rem; } }
.pt-inner { max-width: 1280px; margin: 0 auto; text-align: center; }
.pt-title { margin: 0 0 8px; font-size: clamp(26px, 3vw, 40px); font-weight: 700; color: var(--text); }
.pt-sub { margin: 0 0 28px; color: #55657f; }
.pt-card { overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; background: #fff; }
.pt-table { width: 100%; border-collapse: collapse; min-width: 560px; }
.pt-table th, .pt-table td { padding: 18px 16px; text-align: left; font-size: .95rem; border-bottom: 1px solid var(--border); }
.pt-table thead th { background: #02091c; color: #fff; font-weight: 700; font-size: .8125rem; letter-spacing: .06em; text-transform: uppercase; }
.pt-table tbody tr { transition: background .15s; }
.pt-table tbody tr:hover { background: color-mix(in srgb, var(--accent) 7%, #fff) !important; }
.pt-table td { font-variant-numeric: tabular-nums; }
.pt-inner .hc-eyebrow { justify-content: center; }
.pt-table tbody th { font-weight: 700; color: var(--text); }
.pt-table tbody tr:last-child th, .pt-table tbody tr:last-child td { border-bottom: 0; }
.pt-table tbody tr:nth-child(even) { background: #fafbfc; }
.pt-note { margin: 16px 0 0; font-size: .875rem; color: #55657f; }

/* Hızlı Fiyat Al — koyu bant üzerinde tek satır "arama çubuğu" (beş alan + site-cta) */
.hq-band { background: #02091c; padding: 7vh 1.5rem; }
@media (min-width: 992px) { .hq-band { padding: 7vh 3rem; } }
.hq-inner { max-width: 1280px; margin: 0 auto; }
.hq-head { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.hq-head-icon { display: inline-flex; flex-shrink: 0; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 12px; background: var(--accent); color: #fff; }
.hq-title { margin: 0; font-size: 1.375rem; font-weight: 700; color: #fff; }
.hq-sub { margin: 2px 0 0; font-size: .9rem; color: rgba(255,255,255,.7); }
.hq-bar { display: grid; grid-template-columns: 1fr; gap: 14px; align-items: stretch; }
@media (min-width: 992px) { .hq-bar { grid-template-columns: minmax(0, 1fr) auto; } }
.hq-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.16); border-radius: 12px; overflow: hidden; }
@media (min-width: 768px) { .hq-fields { grid-template-columns: 1.2fr 1.2fr 1fr .85fr .85fr; } }
.hq-cell { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 12px 16px 10px; background: #fff; transition: background .15s; }
.hq-cell label { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #55657f; }
.hq-cell:focus-within { background: color-mix(in srgb, var(--accent) 6%, #fff); }
.hq-cell:focus-within label { color: var(--accent); }
.hq-cell .hc-field-msg { display: none; }
.hq-cell:has([aria-invalid="true"]) { background: #fdf2f2; }
.hq-cell:has([aria-invalid="true"]) label { color: #b02a37; }
.hq-select { width: 100%; min-height: 32px; padding: 0 26px 0 0; border: 0; border-radius: 0; background: transparent url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>") no-repeat right 2px center; color: var(--text); font: inherit; font-size: 1rem; font-weight: 600; appearance: none; -webkit-appearance: none; cursor: pointer; }
.hq-select:focus { outline: none; }
.hq-go { min-height: 64px; height: 100%; white-space: nowrap; justify-content: space-between; }
@media (max-width: 991px) { .hq-go { width: 100%; } }
.hq-result { display: grid; grid-template-columns: 1fr; gap: 18px; align-items: center; margin-top: 18px; padding: 22px 24px; border-radius: 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); color: #fff; }
@media (min-width: 768px) { .hq-result { grid-template-columns: 1fr auto; } }
.hq-result-label { margin: 0 0 4px; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.65); }
.hq-price { margin: 0 0 4px; font-size: clamp(26px, 3vw, 36px); font-weight: 800; line-height: 1.1; color: #fff; font-variant-numeric: tabular-nums; }
.hq-route { margin: 0; font-size: .95rem; color: rgba(255,255,255,.8); }
.hq-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.hq-reset { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; color: rgba(255,255,255,.85); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.hq-error { margin: 12px 0 0; color: #ffb4b4; font-size: .9rem; }

/* Seni Arayalım */
.cb-section { background: var(--bg); padding: 7vh 1.5rem; }
@media (min-width: 992px) { .cb-section { padding: 7vh 3rem; } }
.cb-card { max-width: 640px; margin: 0 auto; padding: 28px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); }
.cb-head { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.cb-head-icon { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 12px; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); }
.cb-title { margin: 0; font-size: 1.25rem; font-weight: 700; color: var(--text); }
.cb-sub { margin: 2px 0 0; font-size: .875rem; color: #55657f; }
.cb-grid { display: grid; grid-template-columns: 1fr; gap: 10px; }
@media (min-width: 640px) { .cb-grid { grid-template-columns: 1fr 1fr; } }
.cb-grid .form-floating > .form-control { height: 48px; min-height: 48px; padding: 1.2rem .75rem .3rem; font-size: .9rem; border-radius: 10px; border-color: rgba(0,0,0,.12); }
.cb-grid .form-floating > label { padding: .8rem .75rem; font-size: .85rem; color: var(--muted); }
.cb-grid .form-floating > .form-control:focus ~ label, .cb-grid .form-floating > .form-control:not(:placeholder-shown) ~ label { transform: scale(.78) translateY(-.6rem) translateX(.15rem); opacity: 1; }
.cb-grid .form-floating > .form-control:focus, .cb-grid .form-floating > .form-control:not(:placeholder-shown) { padding-top: 1.2rem; padding-bottom: .3rem; }
.cb-slots { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0 0; padding: 0; border: 0; }
.cb-legend { width: 100%; margin-bottom: 8px; font-size: .875rem; font-weight: 600; color: var(--text); }
.cb-slot-input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.cb-slot { padding: 8px 14px; border-radius: 999px; border: 1px solid rgba(0,0,0,.12); background: #fff; font-size: .875rem; font-weight: 600; color: var(--text); cursor: pointer; transition: background .18s, color .18s, border-color .18s; }
.cb-slot-input:checked + .cb-slot { background: var(--accent); border-color: var(--accent); color: #fff; }
.cb-slot-input:focus-visible + .cb-slot { outline: 3px solid color-mix(in srgb, var(--accent) 45%, transparent); outline-offset: 2px; }
.cb-submit { margin-top: 18px; width: 100%; justify-content: space-between; }
.cb-result { margin: 12px 0 0; font-size: .9rem; }
.cb-result.is-ok { color: #157347; } .cb-result.is-err { color: #b02a37; }

@media (prefers-reduced-motion: reduce) {
    .hc-tile, .hc-service, .hc-service-icon, .hc-input, .hc-select, .side-contact, .hq-cell, .cb-slot, .hc-step-no { transition: none; }
    .hc-live.is-flash { animation: none; }
    .hc-tile:hover, .hc-service:hover { transform: none; }
}

/* ─── Açılır listeler (select): ferah, site çizgisinde liste ───────────────────────────────────────
   Chromium 135+ / Edge 135+ "customizable select" (appearance: base-select): liste 12px köşeli beyaz panel,
   seçenekler 10px dikey boşluklu, hover açık mavi, seçili olan accent. Desteklemeyen tarayıcılarda yerel liste
   kalır; option padding/font ile olabildiğince ferahlatılır (Safari yok sayar). */
:is(.hc-select, .hq-select, .quote-grid .form-select) option { padding: 10px 12px; font-size: 15px; line-height: 1.4; }
@supports (appearance: base-select) {
    :is(.hc-select, .hq-select, .quote-grid .form-select),
    :is(.hc-select, .hq-select, .quote-grid .form-select)::picker(select) { appearance: base-select; }
    /* Kapalı kutu: base-select metni üstte bırakır; flex ile dikey ortala, tek satır */
    :is(.hc-select, .hq-select, .quote-grid .form-select) { display: flex; align-items: center; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    :is(.hc-select, .hq-select, .quote-grid .form-select)::picker-icon { display: none; }
    :is(.hc-select, .hq-select, .quote-grid .form-select)::picker(select) {
        margin: 6px 0 0; padding: 6px; border: 1px solid var(--border); border-radius: 12px; background: #fff;
        box-shadow: 0 16px 40px rgba(2, 9, 28, .14); max-height: 320px; overflow: auto; min-width: anchor-size(self-inline);
        scrollbar-width: thin;
    }
    :is(.hc-select, .hq-select, .quote-grid .form-select) option {
        display: flex; align-items: center; gap: 10px; min-height: 42px; padding: 8px 12px; border-radius: 8px;
        font-size: 15px; font-weight: 500; line-height: 1.3; color: var(--text); cursor: pointer; transition: background .12s;
    }
    :is(.hc-select, .hq-select, .quote-grid .form-select) option::checkmark { display: none; }
    :is(.hc-select, .hq-select, .quote-grid .form-select) option:hover,
    :is(.hc-select, .hq-select, .quote-grid .form-select) option:focus-visible { background: color-mix(in srgb, var(--accent) 8%, #fff); outline: none; }
    :is(.hc-select, .hq-select, .quote-grid .form-select) option:checked { background: var(--accent); color: #fff; }
    :is(.hc-select, .hq-select, .quote-grid .form-select) option[value=""] { color: var(--muted); }
    :is(.hc-select, .hq-select, .quote-grid .form-select) option[value=""]:checked { background: transparent; color: var(--muted); }
    :is(.hc-select, .hq-select, .quote-grid .form-select):open { border-color: var(--accent); }
}

/* ─── Hizmet detay gövdesi (.hizmet-govde): admin editöründen gelen HTML için makale tipografisi ─── */
.hizmet-govde { font-size: 1.0625rem; line-height: 1.7; color: #3a4557; }
.hizmet-govde > p:first-child { font-size: 1.1875rem; color: var(--text); }
.hizmet-govde h2 { margin: 2rem 0 .75rem; font-size: 1.5rem; font-weight: 700; line-height: 1.3; color: var(--text); }
.hizmet-govde h3 { margin: 1.5rem 0 .5rem; font-size: 1.1875rem; font-weight: 700; color: var(--text); }
.hizmet-govde p { margin: 0 0 1rem; }
.hizmet-govde ul, .hizmet-govde ol { margin: 0 0 1.25rem; padding-left: 1.4rem; }
.hizmet-govde li { margin-bottom: .45rem; }
.hizmet-govde li::marker { color: var(--accent); font-weight: 700; }
.hizmet-govde a { color: var(--accent); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.hizmet-govde .hizmet-cta { margin-top: 1.5rem; padding: 16px 18px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 7%, #fff); color: var(--text); }
.hizmet-teklif { display: grid; grid-template-columns: 1fr; gap: 18px; align-items: center; margin-top: 2.5rem; padding: 28px; border-radius: 12px; background: #02091c; color: #fff; }
@media (min-width: 768px) { .hizmet-teklif { grid-template-columns: 1fr auto; } }
.hizmet-teklif-eyebrow { margin: 0 0 4px; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.hizmet-teklif-baslik { margin: 0 0 6px; font-size: 1.25rem; font-weight: 700; color: #fff; }
.hizmet-teklif-metin { margin: 0; font-size: .95rem; color: rgba(255,255,255,.75); }
.hizmet-teklif-butonlar { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.hizmet-teklif-link { font-weight: 600; color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.hizmet-teklif-link:hover { color: #fff; opacity: 1; text-decoration-color: var(--accent); }

/* ─── Lokasyon sayfaları (.lk-*): hub kart ızgarası, mahalle etiketleri, taşıma kartları, yan liste ─── */
.lk-grup-title { display: flex; align-items: baseline; gap: 10px; margin: 30px 0 14px; font-size: 1.25rem; font-weight: 700; color: var(--text); }
.lk-grup-title:first-of-type { margin-top: 4px; }
.lk-grup-count { font-size: .8125rem; font-weight: 600; color: #55657f; }
.lk-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
@media (min-width: 640px) { .lk-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 992px) { .lk-grid { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1200px) { .lk-grid { grid-template-columns: repeat(5, 1fr); } }
.lk-card { display: flex; flex-direction: column; gap: 6px; min-height: 120px; padding: 18px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); color: var(--text); text-decoration: none !important; transition: border-color .18s ease-out, transform .18s ease-out; }
.lk-card:hover { border-color: var(--accent); transform: translateY(-2px); color: var(--text); opacity: 1; }
.lk-card-name { font-size: 1.0625rem; font-weight: 700; }
.lk-card-ozet { font-size: .8125rem; line-height: 1.45; color: #55657f; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.lk-card-arrow { display: inline-flex; margin-top: auto; color: var(--accent); }
.lk-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 1.25rem; padding: 0; list-style: none; }
.lk-chips li { padding: 6px 12px; border-radius: 999px; background: #f1f4f8; font-size: .875rem; font-weight: 600; color: var(--text); }
.lk-chips li a { color: inherit; text-decoration: none; font-weight: 600; }
.lk-tasimalar { margin-top: 2.5rem; }
.lk-tasimalar-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.lk-tasimalar-head h2, .lk-sss h2 { margin: 0; font-size: 1.375rem; font-weight: 700; color: var(--text); }
.lk-tasima-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .lk-tasima-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .lk-tasima-grid--3 { grid-template-columns: repeat(3, 1fr); } }
.lk-tasima { display: flex; flex-direction: column; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); overflow: hidden; }
.lk-tasima-media { position: relative; aspect-ratio: 16 / 10; background: #e9edf2; }
.lk-tasima-media img, .lk-tasima-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.lk-tasima-body { padding: 16px 18px 18px; }
.lk-tasima-date { display: block; margin-bottom: 4px; font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent); }
.lk-tasima-title { margin: 0 0 4px; font-size: 1.0625rem; font-weight: 700; color: var(--text); }
.lk-tasima-route { margin: 0 0 6px; font-size: .9rem; color: var(--text); }
.lk-tasima-tag { margin: 0 0 8px; font-size: .8125rem; font-weight: 600; color: #55657f; }
.lk-tasima-text { font-size: .9rem; line-height: 1.55; color: #55657f; }
.lk-tasima-text p:last-child { margin-bottom: 0; }
.lk-sss { margin-top: 2.5rem; }
.lk-sss h2 { margin-bottom: 16px; }
.lk-side-list { margin: 0 0 10px; padding: 0; list-style: none; columns: 2; column-gap: 12px; }
.lk-side-list li { break-inside: avoid; margin-bottom: 6px; font-size: .9rem; }
.lk-side-list a { color: var(--text); text-decoration: none; }
.lk-side-list a:hover { color: var(--accent); opacity: 1; }
.lk-side-more { font-size: .875rem; }
.lk-side-cta { margin-top: 14px; width: 100%; justify-content: space-between; }
@media (prefers-reduced-motion: reduce) { .lk-card { transition: none; } .lk-card:hover { transform: none; } }

/* ─── Site akordeonu (.site-acc): SSS blokları için ortak görünüm — 12px kartlar, + / − rozet, açıkken accent başlık ─── */
.site-acc { display: flex; flex-direction: column; gap: 10px; }
.site-acc .accordion-item { border: 1px solid var(--border) !important; border-radius: 12px !important; background: var(--surface); overflow: hidden; }
.site-acc .accordion-header { margin: 0; }
.site-acc .accordion-button { position: relative; padding: 18px 64px 18px 20px; font-size: 1.0625rem; font-weight: 600; line-height: 1.4; color: var(--text); background: transparent; box-shadow: none; border-radius: 0; }
.site-acc .accordion-button::after { content: ""; position: absolute; right: 16px; top: 50%; width: 34px; height: 34px; margin: -17px 0 0; border-radius: 50%; background: color-mix(in srgb, var(--accent) 10%, #fff) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230071e3' stroke-width='2.5' stroke-linecap='round'><path d='M12 5v14M5 12h14'/></svg>") center / 16px no-repeat; transform: none; transition: background-color .2s ease-out; }
.site-acc .accordion-button:not(.collapsed) { color: var(--accent); background: transparent; box-shadow: none; }
.site-acc .accordion-button:not(.collapsed)::after { background: var(--accent) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round'><path d='M5 12h14'/></svg>") center / 16px no-repeat; transform: none; }
.site-acc .accordion-button:hover { background: #f8f9fb; }
.site-acc .accordion-button:focus { box-shadow: none; }
.site-acc .accordion-button:focus-visible { outline: 3px solid color-mix(in srgb, var(--accent) 35%, transparent); outline-offset: -3px; }
.site-acc .accordion-body { padding: 0 20px 20px; font-size: .95rem; line-height: 1.65; color: #55657f; }
.site-acc .accordion-body p:last-child { margin-bottom: 0; }
.site-acc .accordion-body a { color: var(--accent); font-weight: 600; }

/* ─── Hakkımızda bölümleri (.ab-*): Kurumsal tablosundaki bölüm tipleri site çizgisinde ─── */
.ab-sec { padding: 0 0 56px; }
.ab-sec:last-child { padding-bottom: 0; }
.ab-split { display: grid; grid-template-columns: 1fr; gap: 28px; align-items: center; }
@media (min-width: 992px) { .ab-split { grid-template-columns: 1.05fr 1fr; gap: 56px; } .ab-split--ters .ab-media { order: 2; } }
.ab-media { position: relative; aspect-ratio: 5 / 4; border-radius: 12px; overflow: hidden; background: #eef0f4; }
.ab-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ab-media--genis { aspect-ratio: 21 / 9; margin-bottom: 28px; }
.ab-title { margin: 0 0 16px; font-size: clamp(26px, 3vw, 40px); font-weight: 700; line-height: 1.15; color: var(--text); }
.ab-title--orta { text-align: center; }
.ab-prose { max-width: 46rem; }
.ab-prose--orta { margin: 0 auto; text-align: center; }
.ab-features { display: grid; grid-template-columns: 1fr; gap: 14px; }
@media (min-width: 640px) { .ab-features { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .ab-features { grid-template-columns: repeat(3, 1fr); } }
.ab-feature { padding: 24px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); }
.ab-feature-icon { display: inline-flex; width: 48px; height: 48px; align-items: center; justify-content: center; margin-bottom: 14px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); font-size: 22px; }
.ab-feature h3 { margin: 0 0 6px; font-size: 1.0625rem; font-weight: 700; color: var(--text); }
.ab-feature p { margin: 0; font-size: .9rem; line-height: 1.55; color: #55657f; }
.ab-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 36px 28px; border-radius: 12px; background: #02091c; color: #fff; text-align: center; }
@media (min-width: 768px) { .ab-stats { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); } }
.ab-stat-val { display: block; font-size: clamp(30px, 4vw, 52px); font-weight: 800; line-height: 1.05; color: #fff; font-variant-numeric: tabular-nums; }
.ab-stat-label { display: block; margin-top: 6px; font-size: .9rem; color: rgba(255,255,255,.72); }
.ab-stats-title { grid-column: 1 / -1; margin: 0 0 8px; font-size: 1.25rem; font-weight: 700; color: #fff; }
.ab-quote { max-width: 46rem; margin: 0 auto; padding: 8px 0 8px 24px; border-left: 3px solid var(--accent); }
.ab-quote p { margin: 0 0 10px; font-size: 1.25rem; font-weight: 500; line-height: 1.5; color: var(--text); }
.ab-quote figcaption { font-size: .875rem; font-weight: 600; color: #55657f; }
.ab-sss { max-width: 860px; margin: 0 auto; }

/* ─── Blog listesi (.bl-*) ─── */
.bl-featured { display: grid; grid-template-columns: 1fr; margin-bottom: 32px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); overflow: hidden; }
@media (min-width: 992px) { .bl-featured { grid-template-columns: 1.15fr 1fr; } }
.bl-featured-media { position: relative; aspect-ratio: 16 / 10; background: #eef0f4; }
@media (min-width: 992px) { .bl-featured-media { aspect-ratio: auto; min-height: 360px; } }
.bl-featured-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bl-featured-body { display: flex; flex-direction: column; padding: 28px; }
@media (min-width: 992px) { .bl-featured-body { padding: 40px; } }
.bl-featured-title { margin: 0 0 12px; font-size: clamp(22px, 2.4vw, 32px); font-weight: 700; line-height: 1.2; color: var(--text); }
.bl-featured-title a { color: inherit; text-decoration: none; }
.bl-featured-title a:hover { color: var(--accent); opacity: 1; }
.bl-featured-desc { margin: 0 0 22px; font-size: 1rem; line-height: 1.6; color: #55657f; }
.bl-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 640px) { .bl-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .bl-grid { grid-template-columns: repeat(3, 1fr); } }
.bl-grid .blog-card { display: flex; }
.bl-grid .blog-card-link { width: 100%; }
.bl-kats { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 28px; padding: 0; list-style: none; }
.bl-kats a { display: inline-block; padding: 7px 14px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); font-size: .875rem; font-weight: 600; color: var(--text); text-decoration: none; }
.bl-kats a:hover, .bl-kats a.is-on { background: var(--accent); border-color: var(--accent); color: #fff; opacity: 1; }

/* ─── Blog detayı (.bd-*) ─── */
.bd-meta { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 0 0 22px; font-size: .875rem; font-weight: 600; color: #55657f; }
.bd-meta span { display: inline-flex; align-items: center; gap: 6px; }
.bd-meta svg { width: 16px; height: 16px; color: var(--accent); }
.bd-hero { position: relative; aspect-ratio: 16 / 8; margin-bottom: 26px; border-radius: 12px; overflow: hidden; background: #eef0f4; }
.bd-hero img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bd-lead { margin: 0 0 22px; font-size: 1.1875rem; line-height: 1.6; color: var(--text); }
.bd-recent { margin: 0; padding: 0; list-style: none; }
.bd-recent li { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 14px; }
.bd-recent li:last-child { margin-bottom: 0; }
.bd-recent-img { position: relative; flex-shrink: 0; width: 64px; height: 64px; border-radius: 10px; overflow: hidden; background: #eef0f4; }
.bd-recent-img img { width: 100%; height: 100%; object-fit: cover; }
.bd-recent a { font-size: .9rem; font-weight: 600; line-height: 1.35; color: var(--text); text-decoration: none; }
.bd-recent a:hover { color: var(--accent); opacity: 1; }
.bd-recent time { display: block; margin-top: 4px; font-size: .75rem; font-weight: 600; color: #55657f; }

/* ─── Yasal sayfalar (.ys-*) ─── */
.ys-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 640px) { .ys-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .ys-grid { grid-template-columns: repeat(3, 1fr); } }
.ys-card { display: flex; flex-direction: column; gap: 10px; min-height: 180px; padding: 24px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); color: var(--text); text-decoration: none !important; transition: border-color .18s ease-out, transform .18s ease-out; }
.ys-card:hover { border-color: var(--accent); transform: translateY(-2px); color: var(--text); opacity: 1; }
.ys-card-icon { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 12px; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); }
.ys-card-icon svg { width: 22px; height: 22px; }
.ys-card-title { font-size: 1.0625rem; font-weight: 700; }
.ys-card-text { font-size: .875rem; line-height: 1.5; color: #55657f; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ys-card-go { margin-top: auto; font-size: .875rem; font-weight: 600; color: var(--accent); }
.ys-updated { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 20px; padding: 6px 12px; border-radius: 999px; background: #f1f4f8; font-size: .8125rem; font-weight: 600; color: #55657f; }
.ys-firm { margin-top: 28px; padding: 20px 22px; border-radius: 12px; background: #f7f8fa; }
.ys-firm p { margin: 0 0 10px; font-weight: 700; color: var(--text); }
.ys-firm ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; font-size: .9rem; color: #55657f; }
.ys-firm li { display: flex; gap: 8px; align-items: flex-start; }
.ys-firm svg { flex-shrink: 0; width: 16px; height: 16px; margin-top: 3px; color: var(--accent); }

/* ─── İletişim (.ct-*) ─── */
.ct-info { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 16px; }
.ct-info li { display: flex; gap: 12px; align-items: flex-start; }
.ct-info-icon { display: inline-flex; flex-shrink: 0; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 50%; background: color-mix(in srgb, var(--accent) 10%, #fff); color: var(--accent); }
.ct-info-icon svg { width: 18px; height: 18px; }
.ct-info small { display: block; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #55657f; }
.ct-info strong, .ct-info a { display: block; font-size: .95rem; font-weight: 600; color: var(--text); text-decoration: none; line-height: 1.45; }
.ct-info a:hover { color: var(--accent); opacity: 1; }
.ct-map { margin-top: 28px; border-radius: 12px; overflow: hidden; border: 1px solid var(--border); background: #eef0f4; }
.ct-map iframe { display: block; width: 100%; height: 420px; border: 0; }
.ct-map-link { display: inline-flex; margin-top: 14px; }
.ct-alert { margin: 0 0 18px; padding: 12px 14px; border-radius: 10px; background: #fdecec; color: #b02a37; font-size: .9rem; }

/* ─── SSS sayfası: iki sütunlu akordeon (mobilde tek sütun) ─── */
.faq-cols { display: grid; grid-template-columns: 1fr; gap: 10px 20px; align-items: start; }
@media (min-width: 992px) { .faq-cols { grid-template-columns: 1fr 1fr; } }
.faq-cols + .hizmet-teklif { margin-top: 2.5rem; }

/* ─── Hakkımızda adım kartları (.ab-steps): "Nasıl çalışıyoruz" gibi h3+p çiftleri yan yana numaralı kartlar ─── */
.ab-steps { display: grid; grid-template-columns: 1fr; gap: 14px; margin: 0; padding: 0; list-style: none; counter-reset: none; }
@media (min-width: 640px) { .ab-steps { grid-template-columns: 1fr 1fr; } }
@media (min-width: 992px) { .ab-steps { grid-template-columns: repeat(3, 1fr); } .ab-steps--4 { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1200px) { .ab-steps--5 { grid-template-columns: repeat(5, 1fr); } .ab-steps--6 { grid-template-columns: repeat(3, 1fr); } }
.ab-step { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 26px 22px 24px; border-radius: 12px; background: var(--surface); border: 1px solid var(--border); }
.ab-step::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 3px; border-radius: 0 0 3px 3px; background: var(--accent); opacity: .9; }
.ab-step-no { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; border-radius: 50%; background: #02091c; color: #fff; font-size: .9375rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.ab-step-title { margin: 6px 0 0; font-size: 1.0625rem; font-weight: 700; line-height: 1.3; color: var(--text); }
.ab-step-text { margin: 0; font-size: .9rem; line-height: 1.55; color: #55657f; }

/* ─── Logo Slider ────────────────────────────────────────────────────── */

.logo-slider-section {
    background: var(--bg);
    border-top: 1px solid var(--border);
    padding: .25rem 0 .75rem;
}

.logo-slider-wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
}
@media (min-width: 768px) {
    .logo-slider-wrap { flex-direction: row; padding: 0 3rem; }
}

.logo-slider-label {
    font-size: .8125rem;
    color: var(--muted);
    white-space: nowrap;
    flex-shrink: 0;
}
@media (min-width: 768px) {
    .logo-slider-label { min-width: 8rem; text-align: right; padding-right: 1.5rem; border-right: 1px solid var(--border); }
}

.logo-slider-track-wrap {
    flex: 1;
    overflow: hidden;
    position: relative;
    padding: 1.25rem 0;
    min-width: 0;
}

.logo-slider-track {
    display: flex;
    align-items: center;
    gap: 4rem;
    width: max-content;
    animation: logo-scroll 36s linear infinite;
}
.logo-slider-track:hover { animation-play-state: paused; }

@keyframes logo-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }
}

.logo-slider-track img {
    height: 20px;
    width: auto;
    flex-shrink: 0;
    display: inline-block;
    opacity: .55;
    filter: grayscale(1);
    transition: opacity .2s, filter .2s;
}
.logo-slider-track img:hover { opacity: 1; filter: none; }

.logo-slider-fade-l {
    position: absolute; inset-y: 0; left: 0; width: 4rem;
    background: linear-gradient(to right, var(--bg), transparent);
    pointer-events: none; z-index: 1;
}
.logo-slider-fade-r {
    position: absolute; inset-y: 0; right: 0; width: 4rem;
    background: linear-gradient(to left, var(--bg), transparent);
    pointer-events: none; z-index: 1;
}

/* ─── Faz 8.5: Accessibility (WCAG AA) ─────────────────────────── */
/* Focus ring — keyboard kullanıcıları için belirgin */
:focus-visible {
    outline: 3px solid #0071e3;
    outline-offset: 2px;
    border-radius: 2px;
}
/* Mouse click'te outline gözükmesin */
:focus:not(:focus-visible) {
    outline: none;
}
/* Skip-link odaklanınca görünür */
.visually-hidden-focusable:focus,
.visually-hidden-focusable:focus-within {
    position: fixed !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
}
/* Reduced motion — kullanıcı animasyon istemiyorsa kapat */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
/* Form input renk kontrastı — light mode */
input::placeholder, textarea::placeholder {
    color: #6c757d;
    opacity: 1;
}

/* ── Ürün detay: sağ kenarda sabit hızlı aksiyonlar (Yazdır / Teklif İste) ── */
.urun-fixed-actions {
    position: fixed;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1030;
    flex-direction: column;
    align-items: flex-end;
    gap: .6rem;
    max-width: 100vw;
}
.urun-fixed-actions .uf-print {
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 1.15rem;
    margin-right: 14px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}
.urun-fixed-actions .uf-teklif {
    display: flex;
    align-items: center;
    border-radius: 2rem 0 0 2rem;
    font-weight: 600;
    padding: .7rem 1.2rem;
    white-space: nowrap;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .18);
}

/* ── WhatsApp yüzen buton efekti (SET projesindeki .wa-fab'dan) ──
   Hafif yukarı-aşağı süzülme + yeşil nabız halkası */
.wa-fab { animation: waFloat 3s ease-in-out infinite; }
.wa-fab::before {
    content: ''; position: absolute; inset: 0; border-radius: 50%;
    border: 2px solid #25d366; animation: waPulse 2.4s ease-out infinite; pointer-events: none;
}
@keyframes waFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes waPulse { 0% { transform: scale(1); opacity: .65; } 100% { transform: scale(1.75); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .wa-fab, .wa-fab::before { animation: none; } }

/* Tekil kurumsal sayfa (/sayfa/*): bölüm partial'larının col-lg-9 daralmasını kaldır —
   içerik tam genişlik akar (kullanıcı kararı, "Ayrı Sayfalar" düzeni) */
.icerik-tam .col-lg-9 { flex: 0 0 100%; max-width: 100%; width: 100%; margin-left: 0 !important; margin-right: 0 !important; }

/* Kart görsel placeholder'ı — bg-light yerine tema yüzeyi */
.kart-gorsel-bos {
    display: flex; align-items: center; justify-content: center;
    background: var(--bg);
    color: var(--muted);
}

/* Filtre hapları (tekil sayfa iç-link navigasyonu) — 44px dokunma hedefi */
.filtre-hap {
    border-radius: 999px;
    padding: .55rem 1.25rem;
    min-height: 44px;
    font-weight: 500;
}