/* =============================================================================
   Üst Bölüm — Header (eh-*) + Anasayfa Hero (ehr-*)
   • Header koyu ve şeffaf: solda logo, ortada üstten sarkan buzlu menü alanı (çentik),
     sağda dil seçici + talep formu butonu. Kaydırınca / iç sayfalarda tam genişlik buzlu bar.
   • "Ürünler" açılır paneli: sol görsel (üzerine gelinen kategori), orta numaralı liste,
     sağ kart, alt iletişim satırı. Metinler Banner Yönetimi'nden gelir.
   • Hero: çapraz geçişli tam ekran slaytlar, sol sayaç, sağ alt küçük başlık + butonlar.
   ========================================================================== */

:root { --header-h: 74px; }
@media (min-width: 601px) { :root { --header-h: 94px; } }

.eh, .ehr {
    --eh-ink: #101820;
    --eh-ice: #d0edff;
    --eh-rule: #d0edff24;
    --eh-sans: "Montserrat", Arial, sans-serif;
    --eh-serif: "Newsreader", Georgia, "Times New Roman", serif;
}

/* ─── Header ─────────────────────────────────────────────────────────────── */
/* Header renkleri SİSTEMDEN: koyu zemin = --text, vurgu = --accent, butonlar = sistemin birincil butonu (.btn-primary);
   açık tonlar beyazın saydamlıkları. (Hero .ehr kendi değişkenlerini kullanmaya devam eder.) */
.eh {
    --eh-zemin: var(--text);
    --eh-vurgu-acik: color-mix(in srgb, var(--accent) 62%, #fff);
    --eh-cizgi: rgba(255, 255, 255, .19);
    --eh-hover: rgba(255, 255, 255, .14);
    --eh-hafif: rgba(255, 255, 255, .07);
    --eh-rule: rgba(255, 255, 255, .14);
    --eh-ust: 0px;           /* çentiğin üst boşluğu (tam buzlu durumda menü barın ortasına iner) */
    --eh-mega-top: 74px;     /* açılır panelin header üstünden uzaklığı */
    position: fixed; top: var(--ann-h, 0px); left: 0; right: 0; z-index: 1030;
    height: var(--header-h); padding: 0 4.8%;
    display: flex; align-items: center; justify-content: space-between; gap: 20px;
    color: #fff; font-family: var(--eh-sans); font-size: 13px; font-weight: 400; line-height: 1.4;
    pointer-events: none; isolation: isolate;
}
.eh *, .eh *::before, .eh *::after { box-sizing: border-box; }
.eh :is(a, button, .eh-notch, .eh-mega) { pointer-events: auto; }
.eh a { color: inherit; text-decoration: none; }
.eh button { font: inherit; color: inherit; cursor: pointer; border: 0; background: none; padding: 0; }
.eh svg { flex-shrink: 0; display: block; }
.eh :is(a, button):focus-visible { outline: 2px solid var(--eh-vurgu-acik); outline-offset: 4px; }
.eh :is(a, button):focus:not(:focus-visible) { outline: none; }
.eh .eh-notch :is(a, button):focus-visible {
    outline: none; text-decoration: underline; text-decoration-color: #ffffffb3;
    text-underline-offset: 5px; text-decoration-thickness: 1px;
}

/* Okunurluk perdesi: medyanın üstünde hafif koyu degrade. Tam buzlu durumda cam bara dönüşür. */
.eh::before {
    content: ""; position: absolute; inset: 0 0 -18px; z-index: -2; pointer-events: none;
    background: linear-gradient(color-mix(in srgb, var(--eh-zemin) 66%, transparent), transparent);
}
.eh.eh-hazir { transition: height .35s cubic-bezier(.2,.7,.2,1); }
.eh.eh-hazir::before { transition: background .35s ease, inset .35s ease, box-shadow .35s ease; }

.eh-logo { display: block; flex-shrink: 0; line-height: 0; }
.eh-logo img { display: block; height: 56px; width: auto; }
.eh.eh-hazir .eh-logo img { transition: height .35s cubic-bezier(.2,.7,.2,1); }
.eh-logo-ad { display: block; font-size: 18px; font-weight: 500; letter-spacing: .02em; line-height: 1; }

/* Çentik: cam + kenar çizgisi JS ile menü genişliğine göre çizilir */
.eh-notch {
    position: absolute; top: var(--eh-ust); left: 50%; transform: translateX(-50%);
    max-width: calc(100vw - 44px);
}
.eh.eh-hazir .eh-notch { transition: top .35s cubic-bezier(.2,.7,.2,1); }
.eh-notch-glass, .eh-notch-shape { position: absolute; top: 0; left: -22px; pointer-events: none !important; }
.eh-notch-glass {
    z-index: -2;
    background: linear-gradient(135deg, rgba(255, 255, 255, .12), color-mix(in srgb, var(--eh-zemin) 14%, transparent) 55%, rgba(255, 255, 255, .07));
    -webkit-backdrop-filter: blur(20px) saturate(1.35); backdrop-filter: blur(20px) saturate(1.35);
}
.eh-notch-shape { z-index: -1; overflow: visible; filter: drop-shadow(0 7px 18px #00000024); }
.eh-notch-edge { fill: none; stroke: rgba(255, 255, 255, .3); stroke-width: 1; }
.eh.eh-hazir :is(.eh-notch-glass, .eh-notch-shape) { transition: opacity .35s ease; }
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .eh-notch-glass { background: color-mix(in srgb, var(--eh-zemin) 60%, transparent); }
}
.eh-notch-bar { height: 62px; padding: 6px 12px 8px; display: flex; align-items: center; justify-content: center; gap: 2px; }

/* Ana menü */
.eh-nav { display: flex; gap: 2px; align-items: center; font-size: 13px; }
.eh-nav > a, .eh-dd > a {
    min-height: 44px; padding: 0 17px; display: flex; align-items: center; gap: 9px;
    border-radius: 999px; white-space: nowrap; text-shadow: 0 1px 8px #00000080;
    transition: background .18s, color .18s, box-shadow .18s;
}
.eh-nav-ikon { width: 16px; height: 16px; color: rgba(255, 255, 255, .72); }
.eh-chev { width: 12px; height: 12px; opacity: .55; transition: transform .18s; }
.eh-nav > a:hover, .eh-dd > a:hover, .eh-dd:focus-within > a, .eh-nav a[aria-expanded="true"] {
    background: var(--eh-hover); color: #fff; box-shadow: inset 0 1px 0 #ffffff24;
}
.eh-nav a[aria-expanded="true"] .eh-nav-ikon { color: inherit; }
.eh-nav a[aria-expanded="true"] .eh-chev, .eh-dd:hover > a .eh-chev, .eh-dd:focus-within > a .eh-chev { transform: rotate(180deg); }
.eh-nav a[aria-current="page"]:not([aria-expanded="true"]) { background: var(--eh-hafif); box-shadow: inset 0 1px 0 #ffffff16; }

/* Sığdırma kademeleri (JS menü genişliğini ölçer): kompakt → ikonsuz → mobil */
.eh[data-fit="kompakt"] :is(.eh-nav > a, .eh-dd > a),
.eh[data-fit="ikonsuz"] :is(.eh-nav > a, .eh-dd > a) { padding-inline: 13px; font-size: 12px; }
.eh[data-fit="ikonsuz"] .eh-nav-ikon { display: none; }

/* AI arama — çentiğin sonunda ince ayraçlı yuvarlak ikon */
.eh-ara {
    position: relative; width: 40px; height: 40px; margin-left: 6px; display: grid; place-items: center;
    border-radius: 999px; color: rgba(255, 255, 255, .72); transition: background .18s, color .18s;
}
.eh-ara::before { content: ""; position: absolute; left: -4px; top: 11px; bottom: 11px; width: 1px; background: var(--eh-cizgi); }
.eh-ara:hover { background: var(--eh-hover); color: #fff; }
.eh-ara svg { width: 17px; height: 17px; }

/* Küçük ekran tetikleyicisi */
.eh-mobile-trigger { display: none; }
.eh[data-fit="mobil"] .eh-nav, .eh[data-fit="mobil"] .eh-ara { display: none; }
.eh[data-fit="mobil"] .eh-mobile-trigger {
    display: flex; align-items: center; justify-content: center; gap: 12px;
    min-width: 142px; height: 44px; border-radius: 999px; font-size: 12px;
    transition: background .18s;
}
.eh[data-fit="mobil"] .eh-mobile-trigger:hover,
.eh[data-fit="mobil"] .eh-mobile-trigger[aria-expanded="true"] { background: var(--eh-hover); }
.eh-mobile-trigger[aria-expanded="true"] .eh-chev { transform: rotate(180deg); }
@media (max-width: 1099.98px) {   /* JS'ten önce de doğru görünsün */
    .eh .eh-nav, .eh .eh-ara { display: none; }
    .eh .eh-mobile-trigger {
        display: flex; align-items: center; justify-content: center; gap: 12px;
        min-width: 142px; height: 44px; border-radius: 999px; font-size: 12px;
    }
}

/* Hakkımızda alt sayfaları (yalnız "Ayrı Sayfalar" düzeninde) */
.eh-dd { position: relative; }
.eh-dd-menu {
    position: absolute; top: calc(100% + 14px); left: 50%; transform: translateX(-50%);
    min-width: 230px; padding: 8px; display: flex; flex-direction: column; gap: 2px;
    background: color-mix(in srgb, var(--eh-zemin) 96%, transparent); -webkit-backdrop-filter: blur(26px); backdrop-filter: blur(26px);
    border: 1px solid var(--eh-cizgi); border-radius: 16px; box-shadow: 0 22px 70px #00000055;
    opacity: 0; visibility: hidden; translate: 0 -7px; transition: opacity .2s, translate .2s, visibility 0s .2s;
}
.eh-dd-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.eh-dd:hover .eh-dd-menu, .eh-dd:focus-within .eh-dd-menu { opacity: 1; visibility: visible; translate: 0 0; transition: opacity .2s, translate .2s; }
.eh-dd-menu a { display: flex; align-items: center; min-height: 40px; padding: 9px 12px; border-radius: 8px; font-size: 13px; transition: background .18s; }
.eh-dd-menu a:hover { background: var(--eh-hafif); }

/* Sağ: dil + talep formu */
.eh-actions { display: flex; gap: 20px; align-items: center; margin-left: auto; }
.eh-lang { display: flex; gap: 5px; align-items: center; font-size: 10px; letter-spacing: .04em; }
.eh-lang a { padding: 10px 4px; min-height: 40px; display: flex; align-items: center; opacity: .55; transition: opacity .18s; }
.eh-lang a:hover { opacity: .85; }
.eh-lang a[aria-current="true"] { opacity: 1; text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 1px; }
.eh-lang > span { opacity: .35; }
/* Talep Formu = sistemin birincil butonu (Header.cshtml: btn btn-primary) — renkler .btn-primary'den */
.eh-cta {
    display: flex; align-items: center; gap: 9px; padding: 12px 16px; min-height: 44px;
    border-width: 1px; border-radius: 999px; font-size: 11px; font-weight: 400; line-height: 1.4; white-space: nowrap;
    transition: background-color .18s, border-color .18s, transform .18s;
}
.eh a.btn-primary { color: var(--bs-btn-color); }   /* ".eh a { color: inherit }" butonun sistem yazı rengini ezmesin */
.eh-cta:hover { transform: translateY(-1px); }
.eh-cta svg { width: 15px; height: 15px; }
.eh-cta svg:last-child { width: 13px; height: 13px; }

/* ─── Tam buzlu bar: kaydırınca, iç sayfalarda (hero yok) ─────────────────── */
.eh[data-scrolled="true"]::before, .eh[data-solid="true"]::before {
    inset: 0;
    background: color-mix(in srgb, var(--eh-zemin) 96%, transparent);
    -webkit-backdrop-filter: blur(20px) saturate(1.35); backdrop-filter: blur(20px) saturate(1.35);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .12), 0 14px 34px -20px #000c;
}
.eh[data-scrolled="true"] :is(.eh-notch-glass, .eh-notch-shape),
.eh[data-solid="true"] :is(.eh-notch-glass, .eh-notch-shape) { opacity: 0; }
.eh[data-solid="true"] { --eh-ust: 16px; --eh-mega-top: 90px; }
@supports selector(:has(a)) {
    body:not(:has(.ehr)) .eh::before {
        inset: 0;
        background: color-mix(in srgb, var(--eh-zemin) 96%, transparent);
        -webkit-backdrop-filter: blur(20px) saturate(1.35); backdrop-filter: blur(20px) saturate(1.35);
        box-shadow: 0 1px 0 rgba(255, 255, 255, .12), 0 14px 34px -20px #000c;
    }
    body:not(:has(.ehr)) .eh :is(.eh-notch-glass, .eh-notch-shape) { opacity: 0; }
    body:not(:has(.ehr)) .eh { --eh-ust: 16px; --eh-mega-top: 90px; }
}
@media (min-width: 601px) {
    .eh[data-scrolled="true"] { height: 76px; --eh-ust: 7px; --eh-mega-top: 81px; }
    .eh[data-scrolled="true"] .eh-logo img { height: 48px; }
}

/* ─── Açılır panel ───────────────────────────────────────────────────────── */
.eh-mega {
    position: absolute; top: var(--eh-mega-top); left: 50%; transform: translateX(-50%);
    width: min(1180px, calc(100vw - 64px)); max-height: calc(100dvh - 174px);
    overflow: auto; overscroll-behavior: contain;
    background: color-mix(in srgb, var(--eh-zemin) 96%, transparent); -webkit-backdrop-filter: blur(26px); backdrop-filter: blur(26px);
    border: 1px solid var(--eh-cizgi); border-radius: 24px; box-shadow: 0 22px 70px #00000055; color: #fff;
}
.eh-mega[hidden] { display: none; }
.eh[data-open="true"] .eh-mega { animation: eh-menu-in .22s ease both; }
@keyframes eh-menu-in { from { opacity: 0; translate: 0 -7px; } to { opacity: 1; translate: 0 0; } }

.eh-mega-tabs { display: none; }
.eh[data-fit="mobil"] .eh-mega-tabs { display: flex; flex-wrap: wrap; gap: 6px; padding: 16px 20px 0; }
.eh-mega-tabs :is(a, button) {
    flex: 1 1 auto; min-width: 0; display: flex; align-items: center; justify-content: center; gap: 6px;
    min-height: 40px; padding: 8px 14px; font-size: 11px; line-height: 1.35; border-radius: 999px;
    color: rgba(255, 255, 255, .72); border: 1px solid rgba(255, 255, 255, .12); transition: background .18s, color .18s;
}
.eh-mega-tabs :is(a, button):hover { background: var(--eh-hafif); color: #fff; }
.eh-mega-tabs a[aria-current="page"] { background: #fff; color: var(--eh-zemin); border-color: transparent; }
.eh-mega-tabs svg { width: 14px; height: 14px; }

.eh-mega-body { display: grid; grid-template-columns: 260px minmax(0, 1fr) 244px; gap: 28px; padding: 28px; }

/* Sol görsel: üzerine gelinen kategorinin görseli */
/* Liste uzadıkça görsel de sağdaki kart gibi satır yüksekliğine uzar (en az 252px) */
.eh-mega-film { margin: 0; position: relative; min-width: 0; min-height: 252px; align-self: stretch; border-radius: 14px; background: color-mix(in srgb, #fff 8%, var(--eh-zemin)); overflow: hidden; }
.eh-mega-film::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(transparent 35%, color-mix(in srgb, var(--eh-zemin) 67%, transparent)); pointer-events: none; }
.eh-film-kare { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; }
.eh-film-kare.is-active { opacity: 1; }
.eh-film-kare img {
    position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
    transform: scale(1.04); transition: transform 1.2s cubic-bezier(.2,.7,.2,1);
}
.eh-film-kare.is-active img { transform: scale(1); }
.eh-mega-film figcaption { position: absolute; bottom: 23px; left: 21px; right: 14px; z-index: 2; }
.eh-mega-film figcaption > span { display: block; font-size: 8px; letter-spacing: .17em; margin-bottom: 10px; color: #fff; text-transform: uppercase; }
.eh-mega-film figcaption em {
    display: block; font-family: var(--eh-serif); font-style: italic; font-size: 29px; font-weight: 300;
    letter-spacing: -.8px; line-height: 1.12;
}

/* Orta: numaralı kategori listesi */
.eh-mega-eyebrow { font-size: 9px; letter-spacing: .14em; color: rgba(255, 255, 255, .6); margin: 4px 0 14px; line-height: 1.4; text-transform: uppercase; }
.eh-mega-list { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
.eh-mega-list--iki { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; row-gap: 2px; }
.eh-mega-list a {
    display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 9px 8px; border-radius: 8px;
    line-height: 1.4; transition: background .18s, transform .18s;
}
.eh-mega-list a:hover, .eh-mega-list a:focus-visible { background: var(--eh-hafif); transform: translateX(2px); }
.eh-mega-list a[aria-current="page"] { color: var(--eh-vurgu-acik); background: rgba(255, 255, 255, .04); }
.eh-mega-no { font-size: 8px; color: rgba(255, 255, 255, .5); flex-shrink: 0; font-variant-numeric: tabular-nums; }
.eh-mega-list a > svg { margin-left: auto; color: rgba(255, 255, 255, .55); width: 14px; height: 14px; }
.eh-mega-desc {
    margin: 17px 0 0; padding-top: 17px; border-top: 1px solid var(--eh-rule);
    font-size: 11px; line-height: 1.8; color: rgba(255, 255, 255, .62); max-width: 380px;
}

/* Sağ kart — arka plan görseli varsa koyu, yoksa açık zemin */
.eh-card {
    position: relative; isolation: isolate; min-width: 0; overflow: hidden;
    display: flex; flex-direction: column; padding: 22px 22px 20px;
    background: var(--surface); color: var(--eh-zemin);
    border: 1px solid #ffffff70; border-radius: 16px;
}
.eh-card-bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.eh-card-label { display: block; font-size: 8px; letter-spacing: .16em; color: var(--accent); text-transform: uppercase; }
.eh-card-metin { margin-top: auto; padding-top: 24px; display: flex; flex-direction: column; }
.eh-card-title { margin: 0; font-family: var(--eh-sans); font-size: 22px; font-weight: 300; line-height: 1.18; letter-spacing: -.7px; color: var(--eh-zemin); }
.eh-card-title em { display: block; margin-top: 3px; font-family: var(--eh-serif); font-style: italic; font-size: 24px; font-weight: 300; line-height: 1.13; letter-spacing: -.4px; }
.eh-card-desc { font-size: 10px; line-height: 1.7; margin: 12px 0 18px; color: color-mix(in srgb, var(--eh-zemin) 75%, #fff); }
.eh-card-cta {
    position: relative; padding: 9px 10px 9px 16px; min-height: 48px;
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
    border-width: 1px; border-radius: 999px; box-shadow: 0 3px 8px color-mix(in srgb, var(--accent) 14%, transparent);
    font-size: 11px; font-weight: 500; line-height: 1.3; text-align: left;   /* renkler .btn-primary'den */
    transition: background-color .2s, border-color .2s, box-shadow .2s;
}
.eh-card-ok { display: grid; place-items: center; flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%; background: #ffffff15; transition: background .2s; }
.eh-card-ok svg { width: 15px; height: 15px; transition: transform .2s; }
.eh-card-cta:hover { box-shadow: 0 5px 12px color-mix(in srgb, var(--accent) 24%, transparent); }
.eh-card-cta:hover .eh-card-ok { background: #ffffff24; }
.eh-card-cta:hover svg { transform: translateX(2px); }
.eh-card--gorsel { background: color-mix(in srgb, #fff 6%, var(--eh-zemin)); color: #fff; border-color: var(--eh-cizgi); min-height: 252px; }
.eh-card--gorsel::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(180deg, color-mix(in srgb, var(--eh-zemin) 25%, transparent) 0%, color-mix(in srgb, var(--eh-zemin) 6%, transparent) 32%, color-mix(in srgb, var(--eh-zemin) 78%, transparent) 70%, color-mix(in srgb, var(--eh-zemin) 95%, transparent) 100%);
}
.eh-card--gorsel:hover .eh-card-bg { transform: scale(1.04); }
.eh-card--gorsel .eh-card-label { color: var(--eh-vurgu-acik); }
.eh-card--gorsel .eh-card-title { color: #fff; }
.eh-card--gorsel .eh-card-desc { color: rgba(255, 255, 255, .84); }
.eh-card--gorsel .eh-card-cta { box-shadow: 0 6px 18px -8px #000a; }

/* Alt satır */
.eh-mega-bottom {
    display: flex; justify-content: space-between; align-items: center; gap: 20px;
    padding: 17px 28px; border-top: 1px solid var(--eh-rule); font-size: 10px;
}
.eh-mega-bottom > a { display: flex; align-items: center; gap: 12px; }
.eh-mega-bottom > a > svg { width: 16px; height: 16px; color: var(--eh-vurgu-acik); }
.eh-mega-bottom > a > svg:last-child { width: 14px; height: 14px; }
.eh-mega-bottom strong { font-weight: 400; color: var(--eh-vurgu-acik); margin-left: 5px; }
.eh-mega-bottom > a:hover strong { text-decoration: underline; text-underline-offset: 4px; }
.eh-mega-bottom-sag { display: flex; align-items: center; gap: 12px; margin-left: auto; color: rgba(255, 255, 255, .58); font-size: 9px; }
.eh-mega-iletisim {
    display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 8px 13px;
    border: 1px solid rgba(255, 255, 255, .25); border-radius: 999px; color: #fff !important; font-size: 10px; white-space: nowrap;
    transition: background .18s, border-color .18s;
}
.eh-mega-iletisim:hover { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .44); }
.eh-mega-iletisim svg { width: 13px; height: 13px; }

/* Küçük ekran: tetikleyiciyle açılır, kaydırma kilitlenir */
html:has(.eh[data-open="true"][data-fit="mobil"]) { overflow: hidden; overscroll-behavior: none; }

@media (max-width: 1150px) {
    .eh { padding-inline: 4%; gap: 12px; }
    .eh-actions { gap: 12px; }
    .eh-mega-body { grid-template-columns: 220px minmax(0, 1fr) 244px; gap: 22px; padding: 24px; }
    .eh-mega { width: calc(100vw - 48px); }
}
@media (max-width: 1099.98px) {
    .eh-mega { top: calc(var(--eh-mega-top) - 2px); width: min(720px, calc(100vw - 40px)); }
    .eh-mega-body { grid-template-columns: minmax(0, 1fr) 244px; gap: 22px; }
    .eh-mega-film { grid-column: 1 / -1; height: 168px; min-height: 0; }
    .eh-mega-list--iki { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
    .eh { padding: 0 20px; gap: 8px; --eh-mega-top: 89px; }
    .eh[data-solid="true"] { --eh-ust: 10px; --eh-mega-top: 89px; }
    .eh[data-scrolled="true"] { --eh-ust: 10px; --eh-mega-top: 89px; }
    @supports selector(:has(a)) { body:not(:has(.ehr)) .eh { --eh-ust: 10px; --eh-mega-top: 89px; } }
    .eh-logo img { height: 44px; }
    .eh-notch-bar { height: 54px; padding: 4px 9px 6px; }
    .eh .eh-mobile-trigger, .eh[data-fit="mobil"] .eh-mobile-trigger { min-width: 82px; gap: 8px; font-size: 11px; }
    .eh-actions { margin: 0 0 0 auto; gap: 7px; }
    .eh-cta { min-height: 36px; font-size: 10px; padding: 8px 11px; gap: 6px; }
    .eh-cta svg:first-child { display: none; }
    .eh-lang { position: absolute; right: 28px; top: 55px; gap: 0; font-size: 8px; }
    .eh-lang a { font-size: 8px; padding: 6px; min-height: 25px; }
    .eh-mega { width: calc(100vw - 28px); border-radius: 20px; max-height: calc(100dvh - 175px); box-shadow: 0 20px 50px #0008; }
    .eh[data-fit="mobil"] .eh-mega-tabs { padding: 12px 12px 0; }
    .eh-mega-tabs :is(a, button) { font-size: 10px; padding: 8px 10px; min-height: 36px; }
    .eh-mega-body { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 16px; }
    .eh-mega-film { height: 145px; }
    .eh-mega-film figcaption { left: 17px; bottom: 16px; }
    .eh-mega-film figcaption > span { font-size: 7px; margin-bottom: 6px; }
    .eh-mega-film figcaption em { font-size: 27px; }
    .eh-mega-eyebrow { font-size: 8px; margin: 0 0 8px; }
    .eh-mega-list { font-size: 12px; }
    .eh-mega-list a { min-height: 42px; padding: 9px 4px; }
    .eh-mega-desc { font-size: 10px; line-height: 1.65; margin-top: 12px; padding-top: 12px; }
    .eh-card { padding: 20px; }
    .eh-card--gorsel { min-height: 220px; }
    .eh-mega-bottom { padding: 16px; gap: 12px; font-size: 9px; flex-wrap: wrap; }
    .eh-mega-bottom > a { gap: 8px; }
    .eh-mega-bottom-sag { margin-left: 0; }
}
@media (max-width: 380px) {
    .eh { padding-inline: 14px; }
    .eh-logo img { height: 40px; }
    .eh .eh-mobile-trigger, .eh[data-fit="mobil"] .eh-mobile-trigger { min-width: 64px; gap: 6px; }
    .eh-notch-bar { padding-inline: 7px; }
    .eh-cta { font-size: 9px; padding: 8px 10px; }
    .eh-lang { right: 18px; }
}

/* ─── Hero ───────────────────────────────────────────────────────────────── */
.ehr {
    position: relative; overflow: hidden; isolation: isolate;
    height: calc(100vh - var(--ann-h, 0px)); height: calc(100svh - var(--ann-h, 0px)); min-height: 600px;
    margin-top: calc(-1 * var(--header-h));
    background: #0a232b; color: #fff; font-family: var(--eh-sans); font-weight: 400;
}
.ehr *, .ehr *::before, .ehr *::after { box-sizing: border-box; }
.ehr a { color: inherit; text-decoration: none; }
.ehr :is(a, button):focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.ehr-stage { position: absolute; inset: 0; }

.ehr-panel {
    position: absolute; inset: 0; overflow: hidden; opacity: 0; visibility: hidden;
    transition: opacity 1.2s cubic-bezier(.4,0,.2,1), visibility 0s linear 1.2s;
}
.ehr-panel.is-active { opacity: 1; visibility: visible; z-index: 1; transition: opacity 1.2s cubic-bezier(.4,0,.2,1), visibility 0s; }
.ehr-panel.is-leaving { visibility: visible; }
.ehr-media {
    position: absolute; inset: 0; width: 100%; height: 100%; max-width: none;
    object-fit: cover; transform-origin: 60% 44%;
}
.ehr-panel:is(.is-active, .is-leaving) .ehr-media { animation: ehr-drift 9s cubic-bezier(.25,.1,.25,1) both; }
@keyframes ehr-drift { from { transform: scale(1.055); } to { transform: scale(1); } }

.ehr-shade {
    position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(90deg, #05252b75, transparent 85%), linear-gradient(0deg, #03161dc4, transparent 75%);
}
.ehr-golge { position: absolute; inset: 0; pointer-events: none; }

.ehr-copy { position: absolute; z-index: 2; left: 7%; right: 7%; bottom: 22%; max-width: 1000px; }
.ehr-kicker { margin: 0 0 26px; font-size: 10px; letter-spacing: .2em; line-height: 1.5; text-transform: uppercase; color: #e4edf0c7; }
.ehr-title {
    margin: 0; color: #fff;
    font-family: var(--eh-sans); font-size: clamp(39px, 5.47vw, 84px);   /* 2/3 */ font-weight: 300; line-height: 1; letter-spacing: -.055em;
}
.ehr-title > span { display: block; padding-bottom: .04em; }
.ehr-title em { font-family: var(--eh-serif); font-style: italic; font-weight: 300; letter-spacing: -.035em; }
.ehr-desc { margin: 28px 0 0; max-width: 440px; font-size: 16px; line-height: 1.8; color: #edf6f5d9; }
.ehr-link {
    display: inline-flex; align-items: center; gap: 32px; margin-top: 16px; padding: 14px 0;
    font-size: 14px; border-bottom: 1px solid #ffffff88; transition: gap .25s ease, border-color .25s ease;
}
.ehr-link:hover { gap: 40px; border-color: #fff; }
.ehr-link svg { width: 16px; height: 16px; }

/* Aktif slayt metin girişi */
.ehr-panel.is-active .ehr-kicker { animation: ehr-fade .8s ease .15s both; }
.ehr-panel.is-active .ehr-title > span { animation: ehr-reveal 1s cubic-bezier(.2,.7,.2,1) .3s both; }
.ehr-panel.is-active .ehr-title > span + span { --ehr-dy: 38px; animation-delay: .45s; }
.ehr-panel.is-active :is(.ehr-desc, .ehr-link) { animation: ehr-fade 1s ease .75s both; }
@keyframes ehr-reveal {
    from { clip-path: inset(-.2em -.2em 100% -.2em); transform: translateY(var(--ehr-dy, 24px)); }
    to   { clip-path: inset(-.2em -.2em -.3em -.2em); transform: none; }
}
@keyframes ehr-fade { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* Sol sayaç (yalnız birden çok slaytta) */
.ehr-rail {
    position: absolute; z-index: 3; left: 1.4vw; top: 50%; transform: translateY(-50%);
    width: 34px; display: flex; flex-direction: column; align-items: center; gap: 3px; color: var(--eh-ice);
}
.ehr-rail-count { font-size: 9px; letter-spacing: .1em; margin-bottom: 15px; text-align: center; font-variant-numeric: tabular-nums; }
.ehr-rail-count b { font-weight: 400; }
.ehr-rail-count i { display: block; font-style: normal; font-size: 7px; color: #d0edff60; margin-top: 6px; }
.ehr-rail button {
    position: relative; display: flex; width: 34px; height: 24px; align-items: center; justify-content: center;
    padding: 0; border: 0; background: none; color: inherit; cursor: pointer; font: inherit;
}
.ehr-rail button > i { display: block; width: 1px; height: 14px; background: #d0edff36; transition: height .4s, background .4s, box-shadow .4s; }
.ehr-rail button[aria-current] > i { height: 24px; background: var(--eh-ice); box-shadow: 0 0 9px #d0edff55; }
.ehr-rail button > span {
    position: absolute; left: 31px; white-space: nowrap; font-size: 10px; background: #101820ed; padding: 9px 12px;
    opacity: 0; pointer-events: none; transform: translateX(-5px); transition: opacity .2s, transform .2s;
}
.ehr-rail button:is(:hover, :focus-visible) > span { opacity: 1; transform: none; }
.ehr-rail-name {
    writing-mode: vertical-rl; margin-top: 17px; max-height: 150px; overflow: hidden;
    font-size: 8px; letter-spacing: .13em; text-transform: uppercase; color: #d0edff8a;
}

/* Sağ alt: küçük başlık + butonlar */
.ehr-caption {
    position: absolute; z-index: 3; right: 7%; bottom: 10%; margin: 0; text-align: right;
    font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: #ffffff99;
}
.ehr-actions { position: absolute; z-index: 4; right: 24px; bottom: 18px; display: flex; align-items: center; gap: 10px; }
.ehr-pill {
    display: flex; align-items: center; height: 48px; padding: 2px;
    /* Hero butonları SİSTEM renklerinde: koyu cam = --text, açık buton = sistemin birincil butonu */
    border: 1px solid rgba(255, 255, 255, .21); border-radius: 999px; background: color-mix(in srgb, var(--text) 78%, transparent);
    -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
    box-shadow: inset 0 1px 0 #ffffff12; color: #fff;
}
.ehr-pill > a {
    display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; padding: 0 14px;
    font-family: var(--eh-sans); font-size: 11px; font-weight: 300; line-height: 1; white-space: nowrap;
    border-radius: 999px; transition: background .18s;
}
.ehr-pill > a:hover { background: rgba(255, 255, 255, .08); }
.ehr-pill > a + a { border-left: 1px solid rgba(255, 255, 255, .16); border-radius: 0 999px 999px 0; padding-left: 13px; }
.ehr-pill svg { width: 14px; height: 14px; }
.ehr-cta {
    display: flex; align-items: center; gap: 10px; height: 48px; padding: 0 22px 0 16px;
    border-width: 1px; border-radius: 999px;   /* renkler .btn-primary'den (HeroSlider.cshtml: btn btn-primary) */
    font-family: var(--eh-sans); font-size: 13px; font-weight: 400; line-height: 1; white-space: nowrap;
    box-shadow: 0 14px 34px -14px #000c; transition: background-color .18s, border-color .18s, transform .18s;
}
.ehr a.btn-primary { color: var(--bs-btn-color); }   /* ".ehr a { color: inherit }" sistem yazı rengini ezmesin */
.ehr-cta:hover { transform: translateY(-1px); }
.ehr-cta svg { width: 22px; height: 22px; }

@media (max-width: 700px) {
    .ehr { min-height: 620px; }
    .ehr-copy { left: 6%; right: 6%; bottom: 23%; }
    .ehr-title { font-size: clamp(27px, 7.33vw, 39px); }   /* 2/3 */
    .ehr-kicker { font-size: 10px; line-height: 1.7; margin-bottom: 20px; letter-spacing: .12em; }
    .ehr-desc { font-size: 15px; line-height: 1.75; max-width: 330px; margin-top: 22px; }
    .ehr-link { font-size: 13px; }
    .ehr-caption { display: none; }
    .ehr-rail { left: 0; width: 24px; gap: 2px; }
    .ehr-rail button { width: 24px; height: 26px; }
    .ehr-rail-count { font-size: 7px; }
    .ehr-rail-count i, .ehr-rail-name { display: none; }
    /* Telefonda alt köşeler sitenin yüzen butonlarına (WhatsApp, asistan) ait — butonlar metnin altına,
       o bandın üstüne sola hizalı oturur; metin bloğu da buna göre yukarı alınır. */
    .ehr-actions { left: 6%; right: 6%; bottom: 124px; gap: 8px; justify-content: flex-start; flex-wrap: wrap; }
    .ehr:has(.ehr-actions) .ehr-copy { bottom: 204px; }
    .ehr-pill { height: 46px; padding: 0; }
    .ehr-pill > a { min-height: 44px; font-size: 9px; gap: 5px; padding: 0 9px; }
    .ehr-pill > a + a { padding-left: 9px; }
    .ehr-pill svg { width: 13px; height: 13px; }
    .ehr-cta { height: 46px; font-size: 12px; padding: 0 16px 0 12px; gap: 8px; }
    .ehr-cta svg { width: 18px; height: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .eh, .eh *, .eh::before, .ehr * { transition: none !important; animation: none !important; }
    .ehr-panel { transition: none; }
}

/* ═══ Duyarlılık / kompaktlık — mobil header ve menü yazıları okunur boyutta (yerleşim aynı) ═══ */
@media (max-width: 600px) {
    .eh-lang, .eh-lang a { font-size: 10px; }
    .eh-cta { font-size: 11px; }
    .eh-mega-tabs :is(a, button) { font-size: 11px; }
    .eh-mega-eyebrow { font-size: 10px; }
    .eh-mega-film figcaption > span { font-size: 9px; }
    .eh-mega-desc { font-size: 12px; }
    .eh-mega-bottom { font-size: 11px; }
}
@media (max-width: 380px) {
    .eh-cta { font-size: 10px; }
}