/* ═══════════════════════════════════════════════════════════════════════════
   Hub Header + Hero — company.liquid-themes.com tasarımı (2026-10-15)
   Ölçüler getComputedStyle ile çıkarıldı: docs/research/components/hub-header.spec.md,
   hub-hero.spec.md. Renk/font panelden: --accent (palet), --font-display / --font-ui (font çifti).
   site.css'ten SONRA yüklenir (header yüksekliği ve global link kurallarını ezer).
   ═══════════════════════════════════════════════════════════════════════════ */

:root {
    --header-h: 65px;
    /* Renkler SİSTEMDEN (Ayarlar → Görünüm): demodaki sabit petrol tonları yerine vurgudan türetilir. */
    --hub-deep: color-mix(in srgb, var(--accent) 22%, #0e1013);   /* koyu yüzeyler: footer, bant, yorumlar */
    --hub-dark: var(--hub-deep);                                   /* buton yazısı (açık vurgu) / hover zemini */
    --hub-ink: var(--text, #1d1d1f);                               /* beyaz header üstündeki yazı */
    --hub-overlay: color-mix(in srgb, var(--hub-deep) 48%, transparent);
    --hub-line: rgba(0, 0, 0, .05);                                /* zemin dikey çizgileri */
    --hub-display: var(--font-display, inherit);
    --hub-ui: var(--font-ui, inherit);
}
@media (min-width: 1200px) { :root { --header-h: 121px; } }

/* ─── Header ───────────────────────────────────────────────────────────── */

.hub-header {
    /* Varsayılan: beyaz header (iç sayfalar, sticky, mobil) */
    --hh-bg: #fff;
    --hh-fg: var(--hub-ink);
    --hh-line: rgba(16, 32, 32, .08);
    --hh-num: var(--hub-ink);
    --hh-active: var(--hub-ink);
    --hh-logo-light: none;
    --hh-logo-dark: block;

    position: fixed;
    top: var(--ann-h, 0px);
    left: 0;
    right: 0;
    z-index: 1040;
    font-family: var(--hub-display);
}

/* Anasayfa hero'su ya da iç sayfa başlığı sayfanın başındaysa header şeffaf, üstüne biner (≥1200px). */
@media (min-width: 1200px) {
    body:has(#main-content > .hub-hero:first-child) .hub-header:not(.is-stuck),
    body:has(#main-content > .hub-sayfa-bas:first-child) .hub-header:not(.is-stuck) {
        --hh-bg: transparent;
        --hh-fg: #fff;
        --hh-line: rgba(255, 255, 255, .14);
        --hh-num: var(--accent);
        --hh-active: var(--accent);
        --hh-logo-light: block;
        --hh-logo-dark: none;
    }
}

/* Üst bar */
.hub-topbar { display: none; }
@media (min-width: 1200px) {
    .hub-topbar {
        display: block;
        max-height: 49px;
        background: var(--hh-bg);
        border-bottom: 1px solid var(--hh-line);
        transition: max-height .3s ease, opacity .2s ease, background-color .3s, border-color .3s;
    }
    .hub-header.is-stuck .hub-topbar {
        max-height: 0;
        opacity: 0;
        overflow: hidden;
        border-bottom-width: 0;
    }
}

.hub-topbar__inner {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    height: 48px;
    padding: 0 2%;
}

.hub-topbar__info {
    display: flex;
    align-items: center;
    gap: 47px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.hub-topbar__info li,
.hub-topbar__info a {
    display: inline-flex;
    align-items: center;
    gap: 11px;
    font-size: 13px;
    font-weight: 400;
    line-height: 13px;
    color: var(--hh-fg);
    text-decoration: none;
    transition: color .3s;
}
.hub-topbar__info i { font-size: 13px; line-height: 1; }
.hub-topbar__info a:hover { color: var(--accent); opacity: 1; }

.hub-topbar__links { display: flex; align-items: stretch; }
.hub-topbar__cell { display: flex; align-items: center; padding: 0 20px; }
.hub-topbar__cell + .hub-topbar__cell { border-left: 1px solid var(--hh-line); }
.hub-topbar__cell:last-child { padding-right: 0; }
.hub-topbar__link {
    font-size: 14px;
    font-weight: 400;
    line-height: 16px;
    color: var(--hh-fg);
    text-decoration: none;
    transition: color .3s;
}
.hub-topbar__link:hover { color: var(--accent); opacity: 1; }
.hub-topbar__link.is-active { color: var(--hh-active); }

.hub-lang__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    background: none;
    border: 0;
    font: 500 13px/1 var(--hub-display);
    color: var(--hh-fg);
    transition: color .3s;
}
.hub-lang__btn:hover { color: var(--accent); }
.hub-lang__btn i { font-size: 9px; margin-left: 1px; }
.hub-lang .dropdown-menu {
    min-width: 120px;
    margin-top: 12px !important;
    padding: 6px;
    border: 0;
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .12);
    font-size: 13px;
}
.hub-lang .dropdown-item { padding: 6px 10px; border-radius: 3px; color: var(--hub-ink); }
.hub-lang .dropdown-item:hover { background: color-mix(in srgb, var(--accent) 14%, transparent); opacity: 1; }
.hub-lang .dropdown-item.active,
.hub-lang .dropdown-item:active { background: var(--accent); color: var(--accent-on, var(--hub-dark)); }

.hub-search-btn {
    display: inline-flex;
    padding: 0;
    background: none;
    border: 0;
    font-size: 15px;
    line-height: 1;
    color: var(--hh-fg);
    transition: color .3s;
}
.hub-search-btn:hover { color: var(--accent); }

/* Ana satır */
.hub-mainbar {
    position: relative;
    background: var(--hh-bg);
    transition: background-color .3s, box-shadow .3s;
}
.hub-header.is-stuck .hub-mainbar { box-shadow: -2px 3px 90px -20px rgba(0, 0, 0, .25); }
@media (min-width: 1200px) {
    .hub-header.is-stuck .hub-mainbar { animation: hubSlideDown .3s cubic-bezier(.3, .8, .35, 1); }
}
@keyframes hubSlideDown { from { transform: translateY(-100%); } to { transform: none; } }

.hub-mainbar__inner {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 65px;
    padding: 0 20px;
}
@media (min-width: 1200px) {
    .hub-mainbar__inner { gap: 0; height: 72px; padding: 0 2%; }
}

.hub-logo {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    margin-right: auto;
    text-decoration: none;
}
.hub-logo img { display: block; width: auto; height: auto; max-height: 75px; max-width: 200px; }
@media (min-width: 1200px) { .hub-logo img { max-width: 220px; } }
.hub-logo .hub-logo__light { display: var(--hh-logo-light); }
.hub-logo .hub-logo__dark { display: var(--hh-logo-dark); filter: contrast(0.5); }
.hub-logo__text { font-size: 20px; font-weight: 700; color: var(--hh-fg); }

/* Menü */
.hub-nav { display: none; }
@media (min-width: 1200px) { .hub-nav { display: block; } }
.hub-nav__list { display: flex; align-items: stretch; margin: 0; padding: 0; list-style: none; }
.hub-nav__item { position: relative; display: flex; }
.hub-nav__link {
    display: flex;
    align-items: center;
    height: 72px;
    padding: 25px 15px 6px;
    font-family: var(--hub-display);
    font-size: 14px;
    font-weight: 700;
    line-height: 27.88px;
    color: var(--hh-fg);
    text-decoration: none;
    white-space: nowrap;
    transition: color .3s, padding .3s;
}
.hub-header.is-stuck .hub-nav__link { padding-bottom: 12px; }
.hub-nav__item.is-active > .hub-nav__link { color: var(--hh-active); }
.hub-nav__item:hover > .hub-nav__link,
.hub-nav__link:focus-visible { color: var(--accent); opacity: 1; }
.hub-nav__num {
    display: block;
    position: relative;
    top: -13.125px;
    left: 8.75px;
    font-size: 8.75px;
    font-weight: 700;
    line-height: 8.75px;
    vertical-align: baseline;
    color: var(--hh-num);
    transition: color .3s;
}

.hub-nav__dd {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
    min-width: 220px;
    margin: 0;
    padding: 12px 0;
    list-style: none;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity .25s, transform .25s, visibility .25s;
}
.hub-nav__item:hover > .hub-nav__dd,
.hub-nav__item:focus-within > .hub-nav__dd { opacity: 1; visibility: visible; transform: none; }
.hub-nav__ddlink {
    display: block;
    padding: 8px 24px;
    font-family: var(--hub-ui);
    font-size: 14px;
    font-weight: 500;
    color: var(--hub-ink);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .2s, color .2s;
}
.hub-nav__ddlink:hover { color: var(--hub-ink); background: color-mix(in srgb, var(--accent) 14%, transparent); opacity: 1; }

/* "Bizi arayın" */
.hub-call { display: none; }
@media (min-width: 1200px) {
    .hub-call {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        margin-left: 20px;
        text-decoration: none;
    }
}
.hub-call:hover { opacity: 1; }
.hub-call__label {
    font-family: var(--hub-display);
    font-size: 13px;
    font-weight: 700;
    line-height: 24px;
    color: var(--hh-fg);
    transition: color .3s;
}
.hub-call__num {
    font-family: var(--hub-display);
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
    white-space: nowrap;
    color: var(--accent);
}

/* Mobil: arama + hamburger */
.hub-msearch,
.hub-burger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    background: none;
    border: 0;
    color: var(--hub-ink);
}
.hub-msearch { font-size: 18px; }
.hub-burger { flex-direction: column; gap: 5px; margin-right: -9px; }
.hub-burger span {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transition: transform .3s, opacity .2s;
}
.hub-header.is-menu-open .hub-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.hub-header.is-menu-open .hub-burger span:nth-child(2) { opacity: 0; }
.hub-header.is-menu-open .hub-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.hub-mpanel {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    max-height: calc(100vh - var(--header-h) - var(--ann-h, 0px));
    max-height: calc(100dvh - var(--header-h) - var(--ann-h, 0px));
    overflow-y: auto;
    background: #fff;
    box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .2);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-8px);
    transition: opacity .25s, transform .25s, visibility .25s;
}
.hub-header.is-menu-open .hub-mpanel { opacity: 1; visibility: visible; transform: none; }
.hub-mpanel__list,
.hub-mpanel__sub { margin: 0; padding: 0; list-style: none; }
.hub-mpanel__row {
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, .05);
}
.hub-mpanel__link {
    flex: 1;
    display: block;
    padding: 15px 25px;
    font-family: var(--hub-ui);
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    color: #000;
    text-decoration: none;
}
.hub-mpanel__link:hover { color: #000; opacity: 1; background: rgba(0, 0, 0, .02); }
.hub-mpanel__sub .hub-mpanel__link { padding-left: 40px; font-size: 13px; border-bottom: 1px solid rgba(0, 0, 0, .05); }
.hub-mpanel__exp {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    margin-right: 25px;
    background: #f2f2f2;
    border: 0;
    border-radius: 3px;
    font-size: 12px;
    color: #000;
}
.hub-mpanel__exp i { transition: transform .25s; }
.hub-mpanel__exp[aria-expanded="true"] i { transform: rotate(180deg); }
.hub-mpanel__call { display: flex; flex-direction: column; padding: 18px 25px 22px; text-decoration: none; }
.hub-mpanel__call:hover { opacity: 1; }

@media (min-width: 1200px) {
    .hub-msearch, .hub-burger, .hub-mpanel { display: none !important; }
    /* Dil seçici header'ın üst barında — yüzen dil butonu masaüstünde gereksiz */
    body:has(.hub-lang) .dil-fab { display: none !important; }
}

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

.hub-hero {
    position: relative;
    overflow: hidden;
    height: calc(100vh - var(--header-h) - var(--ann-h, 0px));
    height: calc(100dvh - var(--header-h) - var(--ann-h, 0px));
    min-height: 560px;
    padding: 0;                        /* site.css'teki genel section padding'i burada yok */
    background: #0b1b1f;
    color: #fff;
}
@media (min-width: 1200px) {
    .hub-hero {
        height: calc(100vh - var(--ann-h, 0px));
        height: calc(100dvh - var(--ann-h, 0px));
        min-height: 640px;
    }
    #main-content > .hub-hero:first-child { margin-top: calc(-1 * var(--header-h)); }
}

.hub-hero__carousel,
.hub-hero__carousel .carousel-inner,
.hub-hero__slide { height: 100%; }
.hub-hero__slide { position: relative; }

.hub-hero__media { position: absolute; inset: 0; z-index: 0; }
.hub-hero__media picture { display: block; width: 100%; height: 100%; }
.hub-hero__media img,
.hub-hero__media video {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
}
.hub-hero__overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: var(--hub-overlay);
    pointer-events: none;
}

.hub-hero__container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    height: 100%;
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
}
@media (min-width: 768px) { .hub-hero__container { padding: 0 45px; } }
@media (min-width: 1200px) { .hub-hero__container { padding: 0 10px; } }
.hub-hero__content { min-width: 0; }

.hub-hero__title {
    margin: 0 0 .15em;
    font-family: var(--hub-display);
    font-size: clamp(36px, 13vw, 50.7px);
    font-weight: 700;
    line-height: .9;
    letter-spacing: -.2px;
    color: #f8f8f8;
    text-wrap: balance;               /* son kelime tek başına alt satıra düşmesin */
}
@media (min-width: 768px) { .hub-hero__title { font-size: clamp(60px, 8.2vw, 84px); } }
@media (min-width: 1200px) { .hub-hero__title { font-size: 88px; } }

/* İlk kelime: fırça izli vurgu */
.hub-hl {
    position: relative;
    display: inline-block;
    padding: 0 .125em;
    background: none;
    color: inherit;
    isolation: isolate;
}
.hub-hl__txt { position: relative; z-index: 1; }
.hub-hl__brush {
    position: absolute;
    top: .7em;
    left: 0;
    z-index: 0;
    width: 100%;
    height: .2em;
    overflow: visible;
    color: var(--accent);
    pointer-events: none;
}

.hub-hero__sub {
    max-width: 800px;
    margin: 0 0 1.5em;
    font-family: var(--hub-ui);
    font-size: 19px;
    font-weight: 400;
    line-height: 1.5;
    color: rgba(255, 255, 255, .7);
}
@media (min-width: 768px) { .hub-hero__sub { font-size: 23px; line-height: 1.6; } }
@media (min-width: 1200px) { .hub-hero__sub { max-width: 575px; } }
.hub-hero__desc {
    max-width: 575px;
    margin: -.75em 0 2em;
    font-family: var(--hub-ui);
    font-size: 16px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .6);
}

.hub-hero__actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 29px;
}
@media (min-width: 768px) {
    .hub-hero__actions { flex-direction: row; align-items: center; gap: 79px; }
}

.hub-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 55px;
    border-radius: 4px;
    background: var(--accent);
    font-family: var(--hub-display);
    font-size: 16px;
    font-weight: 700;
    line-height: 27.88px;
    color: var(--accent-on, var(--hub-dark));   /* koyu vurguda beyaz (GorunumKatalogu) */
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .3s, color .3s, transform .3s, box-shadow .3s;
}
.hub-btn__txt { position: relative; z-index: 1; transition: transform .5s cubic-bezier(0, .71, .4, 1); }
.hub-btn__icon {
    position: absolute;
    top: 50%;
    right: 30px;
    font-size: 18px;
    line-height: 1;
    opacity: 0;
    transform: translate(-10px, -50%);
    transition: opacity .25s cubic-bezier(0, .71, .4, 1), transform .5s cubic-bezier(0, .71, .4, 1);
}
.hub-btn:hover,
.hub-btn:focus-visible {
    background: var(--hub-dark);
    color: #fff;
    opacity: 1;
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, .12);
}
.hub-btn:hover .hub-btn__txt,
.hub-btn:focus-visible .hub-btn__txt { transform: translateX(-20px); }
.hub-btn:hover .hub-btn__icon,
.hub-btn:focus-visible .hub-btn__icon { opacity: 1; transform: translate(0, -50%); }

.hub-hero__call { display: flex; flex-direction: column; text-decoration: none; }
.hub-hero__call:hover { opacity: 1; }
.hub-hero__call-label {
    font-family: var(--hub-display);
    font-size: 13px;
    font-weight: 700;
    line-height: 24px;
    color: #fff;
}
.hub-hero__call-num {
    font-family: var(--hub-display);
    font-size: 19px;
    font-weight: 700;
    line-height: 24px;
    white-space: nowrap;
    color: var(--accent);
}

/* Carousel göstergeleri (yalnız slayt > 1) */
.hub-hero__dots.carousel-indicators { z-index: 3; margin: 0 0 32px; gap: 8px; }
.hub-hero__dots.carousel-indicators [data-bs-target] {
    width: 30px;
    height: 2px;
    margin: 0;
    border: 0;
    background: #fff;
    opacity: .4;
    transition: opacity .3s, background-color .3s;
}
.hub-hero__dots.carousel-indicators .active { opacity: 1; background: var(--accent); }

/* ─── İç sayfa başlığı (components/Breadcrumb.cshtml) ───────────────────────
   Demo iç sayfaları (What We Do / News / Contact): tam genişlik görsel + koyu örtü, ortada başlık, alt metin
   ve aşağı ok. Header ≥1200px üstüne şeffaf biner. Yükseklik: kisa / orta / uzun (panel). */
.hub-sayfa-bas {
    --hsb-h: 300px;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    min-height: var(--hsb-h);
    padding: 70px 0 64px;
    background: var(--hub-deep);
    color: #fff;
    isolation: isolate;
}
.hub-sayfa-bas--kisa { --hsb-h: 240px; }
.hub-sayfa-bas--uzun { --hsb-h: 420px; }
@media (min-width: 1200px) {
    .hub-sayfa-bas { --hsb-h: 450px; padding: calc(var(--header-h) + 40px) 0 70px; }
    .hub-sayfa-bas--kisa { --hsb-h: 360px; }
    .hub-sayfa-bas--uzun { --hsb-h: 600px; }
    #main-content > .hub-sayfa-bas:first-child { margin-top: calc(-1 * var(--header-h)); }
}
.hub-sayfa-bas__medya { position: absolute; inset: 0; z-index: -2; }
.hub-sayfa-bas__medya picture { display: block; width: 100%; height: 100%; }
.hub-sayfa-bas__medya img,
.hub-sayfa-bas__medya video { display: block; width: 100%; height: 100%; object-fit: cover; }
.hub-sayfa-bas__ortu { position: absolute; inset: 0; z-index: -1; background: var(--hub-deep); pointer-events: none; }
.hub-sayfa-bas__in {
    position: relative;
    width: 100%;
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
}
@media (min-width: 1200px) { .hub-sayfa-bas__in { padding: 0 10px; } }
.hub-sayfa-bas--sol .hub-sayfa-bas__in { text-align: left; }
.hub-sayfa-bas--sag .hub-sayfa-bas__in { text-align: right; }
.hub-sayfa-bas__iz {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin: 0 0 14px;
    font-family: var(--hub-display);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;
    color: rgba(255, 255, 255, .72);
}
.hub-sayfa-bas--sol .hub-sayfa-bas__iz { justify-content: flex-start; }
.hub-sayfa-bas--sag .hub-sayfa-bas__iz { justify-content: flex-end; }
/* Dikey dolgu + eşit negatif pay: dokunma alanı ~33px, satır yüksekliği değişmez */
.hub-sayfa-bas__iz a { margin: -6px 0; padding: 6px 0; color: inherit; text-decoration: none; transition: color .3s; }
.hub-sayfa-bas__iz a:hover { color: var(--accent); opacity: 1; }
.hub-sayfa-bas__iz [aria-current] { color: #fff; }
.hub-sayfa-bas__h {
    max-width: 900px;
    margin: 0 auto;
    font-family: var(--hub-display);
    font-size: clamp(34px, 7vw, 60px);
    font-weight: 700;
    line-height: 1.12;
    letter-spacing: -.5px;
    color: #fff;
    overflow-wrap: anywhere;
    text-wrap: balance;
}
.hub-sayfa-bas--sol .hub-sayfa-bas__h, .hub-sayfa-bas--sol .hub-sayfa-bas__p { margin-left: 0; }
.hub-sayfa-bas--sag .hub-sayfa-bas__h, .hub-sayfa-bas--sag .hub-sayfa-bas__p { margin-right: 0; }
.hub-sayfa-bas__p {
    max-width: 640px;
    margin: 22px auto 0;
    font-family: var(--hub-display);
    font-size: clamp(16px, 1.6vw, 18px);
    font-weight: 600;
    line-height: 1.55;
    color: rgba(255, 255, 255, .62);
}
.hub-sayfa-bas__ok {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;                       /* dokunma alanı: ikon 20px, hedef 44px */
    height: 44px;
    margin-top: 22px;                  /* ikonun görsel konumu eski 34px payla aynı */
    font-size: 20px;
    line-height: 1;
    color: rgba(255, 255, 255, .55);
    text-decoration: none;
    transition: color .3s, transform .3s;
}
.hub-sayfa-bas__ok:hover { color: #fff; opacity: 1; transform: translateY(3px); }
.hub-sayfa-bas__capa { display: block; scroll-margin-top: var(--header-h); }

/* ─── Giriş animasyonu ─────────────────────────────────────────────────────
   .hub-anim: HeroSlider içindeki satır içi betik ekler (hareketi azalt tercihi yoksa).
   .is-ready: hub.js başlığı harflere böldü. JS çalışmazsa 2.5 sn sonra her şey görünür. */
.hub-w { display: inline-block; white-space: nowrap; }
.hub-c { display: inline-block; }

.hub-anim .hub-hero:not(.is-ready) :is(.hub-hero__title, .hub-hero__sub, .hub-hero__desc, .hub-hero__actions) {
    opacity: 0;
    animation: hubGoster 0s linear 2.5s forwards;
}
@keyframes hubGoster { to { opacity: 1; } }

.hub-anim .hub-hero.is-ready .hub-c {
    opacity: 0;
    transform: translateY(.45em);
    transition: opacity .55s cubic-bezier(.3, .8, .35, 1), transform .65s cubic-bezier(.3, .8, .35, 1);
}
.hub-anim .hub-hero.is-ready .is-in .hub-c { opacity: 1; transform: none; transition-delay: var(--d, 0ms); }

.hub-anim .hub-hero.is-ready :is(.hub-hero__sub, .hub-hero__desc, .hub-hero__actions) {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .6s ease, transform .7s cubic-bezier(.3, .8, .35, 1);
}
.hub-anim .hub-hero.is-ready .is-in :is(.hub-hero__sub, .hub-hero__desc, .hub-hero__actions) { opacity: 1; transform: none; }
.hub-anim .hub-hero.is-ready .is-in .hub-hero__sub { transition-delay: .85s; }
.hub-anim .hub-hero.is-ready .is-in .hub-hero__desc { transition-delay: .95s; }
.hub-anim .hub-hero.is-ready .is-in .hub-hero__actions { transition-delay: 1.05s; }

.hub-anim .hub-hero.is-ready .hub-hl__brush {
    clip-path: inset(0 100% 0 0);
    transition: clip-path .85s cubic-bezier(.22, .61, .36, 1);
}
.hub-anim .hub-hero.is-ready .is-in .hub-hl__brush { clip-path: inset(0 0 0 0); transition-delay: 1.1s; }

/* Slayt tekrar oynatılırken başlangıç durumuna geçişsiz dön */
.hub-reset,
.hub-reset * { transition: none !important; }

/* ─── Footer ───────────────────────────────────────────────────────────────
   Spec: docs/research/components/hub-footer.spec.md */

.hub-footer {
    --hf-bg: var(--hub-deep);           /* sistem renginden türetilir (demoda #143331) */
    --hf-muted: rgba(255, 255, 255, .48);
    --hf-line: rgba(255, 255, 255, .13);
    position: relative;
    margin: 0;
    padding: 0;                        /* site.css'teki genel footer padding/çizgisi burada yok */
    border-top: 0;
    background: var(--hf-bg);
    color: var(--hf-muted);
    font-family: var(--hub-ui);
    font-size: 16px;
}

.hub-footer__container,
.hub-kapsayici {                       /* footer ile aynı genişlik: yasal sayfalar, "İlgili İçerikler" */
    max-width: 1340px;
    margin: 0 auto;
    padding: 0 20px;
}
@media (min-width: 1200px) { .hub-footer__container, .hub-kapsayici { padding: 0 10px; } }

.hub-footer__main { padding: 60px 0 70px; }

.hub-footer__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px 30px;
}
.hub-footer__brand { grid-column: 1 / -1; }
@media (min-width: 768px) {
    .hub-footer__grid { grid-template-columns: repeat(2, 1fr); gap: 50px 40px; }
    .hub-footer__brand { grid-column: auto; }
}
@media (min-width: 1200px) {
    .hub-footer__grid { grid-template-columns: 440px 320px 190px 1fr; gap: 0; }
}
@media (max-width: 767.98px) {
    /* Mobil: iletişim tam genişlik, iki link listesi yan yana */
    .hub-footer__col:has(.hub-footer__contact) { grid-column: 1 / -1; }
}

.hub-footer__logo { display: inline-flex; margin-top: 5px; text-decoration: none; }
.hub-footer__logo img { display: block; width: auto; height: auto; max-height: 44px; max-width: 200px; }
.hub-footer__logo span { font-family: var(--hub-display); font-size: 22px; font-weight: 700; color: #fff; }

.hub-footer__desc {
    max-width: 310px;
    margin: 36px 0 0;
    font-size: 17px;
    font-weight: 400;
    line-height: 27.88px;
    color: rgba(255, 255, 255, .482);
}

.hub-footer__social { display: flex; flex-wrap: wrap; gap: 27px; margin-top: 52px; }
.hub-footer__social a {
    display: inline-flex;
    font-size: 24px;
    line-height: 1;
    color: #849493;
    text-decoration: none;
    transition: color .3s;
}
.hub-footer__social a:hover { color: #fff; opacity: 1; }

.hub-footer__title {
    margin: 0 0 32px;
    font-family: var(--hub-display);
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    color: #fff;
}

.hub-footer__contact { margin: 0; padding: 0; list-style: none; }
.hub-footer__contact li { display: flex; align-items: flex-start; gap: 25px; }
.hub-footer__contact li + li { margin-top: 40px; }
.hub-footer__contact i { flex-shrink: 0; margin-top: 4px; font-size: 20px; line-height: 1; color: var(--accent); }
.hub-footer__contact div { display: flex; flex-direction: column; min-width: 0; }
.hub-footer__label {
    margin-bottom: 2px;
    font-family: var(--hub-display);
    font-size: 13px;
    font-weight: 400;
    line-height: 13px;
    color: rgba(255, 255, 255, .47);
}
.hub-footer__value {
    font-size: 16px;
    line-height: 27.88px;
    color: #fff;
    text-decoration: none;
    overflow-wrap: anywhere;
    transition: color .3s;
}
a.hub-footer__value:hover { color: var(--accent); opacity: 1; }

.hub-footer__links { margin: 0; padding: 0; list-style: none; }
.hub-footer__links li + li { margin-top: 10px; }
.hub-footer__links a,
.hub-footer__legal a {
    font-size: 14px;
    font-weight: 400;
    line-height: 27.88px;
    color: var(--hf-muted);
    text-decoration: none;
    transition: color .3s;
}
.hub-footer__links a:hover,
.hub-footer__legal a:hover { color: #fff; opacity: 1; }

/* Bülten satırı */
.hub-footer__news { padding: 34px 0; border-top: 1px solid var(--hf-line); }
.hub-footer__news-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 20px 40px;
}
.hub-footer__news-text .hub-footer__title { margin-bottom: 6px; }
.hub-footer__news-text p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--hf-muted); }
.hub-footer__news-form { flex: 0 1 470px; min-width: 0; }
.hub-footer__news-form form { position: relative; display: flex; flex-wrap: wrap; gap: 10px; }
.hub-footer__input {
    flex: 1 1 220px;
    min-width: 0;
    height: 52px;
    padding: 0 18px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid var(--hf-line);
    border-radius: 4px;
    font-size: 15px;
    color: #fff;
    transition: border-color .3s;
}
/* Dokunmatikte 16px: iOS 16px altı form alanına odaklanınca sayfayı yakınlaştırır */
@media (pointer: coarse) { .hub-footer__input { font-size: 16px; } }
.hub-footer__input::placeholder { color: var(--hf-muted); }
.hub-footer__input:focus { outline: none; border-color: var(--accent); }
.hub-footer__submit {
    height: 52px;
    padding: 0 28px;
    background: var(--accent);
    border: 0;
    border-radius: 4px;
    font-family: var(--hub-display);
    font-size: 14px;
    font-weight: 700;
    color: var(--accent-on, var(--hub-dark));
    transition: background-color .3s, color .3s;
}
.hub-footer__submit:hover { background: #fff; color: var(--hub-dark); }
.hub-footer__turnstile { flex-basis: 100%; }
.hub-footer__news-result { margin-top: 8px; font-size: 14px; }
.hub-footer__news-result.is-ok { color: #8fd19e; }
.hub-footer__news-result.is-warn { color: var(--accent); }
.hub-footer__news-result.is-err { color: #f1a7a7; }

/* Alt bar */
.hub-footer__bottom { position: relative; padding: 30px 0; border-top: 1px solid var(--hf-line); }
.hub-footer__bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 30px;
}
.hub-footer__copy { margin: 0; font-size: 13px; line-height: 27.88px; color: var(--hf-muted); }
.hub-footer__legal {
    display: flex;
    flex-wrap: wrap;
    gap: 0 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.hub-footer__top {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    margin: 20px 20px 0 auto;
    padding: 0;
    background: #fff;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .15);
    font-size: 15px;
    color: var(--hub-ink);
    transition: transform .3s;
}
.hub-footer__top:hover { transform: translateY(-3px); }
@media (min-width: 1200px) {
    .hub-footer__top { position: absolute; top: 50%; right: 50px; margin: -22.5px 0 0; }
}
@media (max-width: 1199.98px) {
    .hub-footer__bottom { display: flex; flex-direction: column; }
}

/* Reveal: footer içeriğin arkasından açılır (≥1200px, footer ekrana sığıyorsa — js/hub.js).
   main'e z-index VERİLMEZ: içindeki Bootstrap modal'ları body'deki backdrop'un altında kalırdı.
   body stacking context olur; footer -1 ile main'in (konumlanmamış blok) zemininin altına iner. */
@media (min-width: 1200px) {
    body.hub-reveal { position: relative; z-index: 0; }
    body.hub-reveal #main-content { background: var(--bg, #fff); box-shadow: 0 10px 25px -10px rgba(0, 0, 0, .1); }
    body.hub-reveal .hub-footer { position: sticky; bottom: 0; z-index: -1; }
}