/* =====================================================================
   MAKTEK AVRASYA 2026 — FUAR DETAY SAYFASI
   =====================================================================
   Yalnızca /maktek-avrasya-2026 sayfasında yüklenir.
   Tüm seçiciler .fx- ön ekiyle izole edilmiştir; site.css'teki hiçbir
   kural ezilmez, hiçbir global sınıf yeniden tanımlanmaz.

   Marka kaynağı: site.css :root (--brand-*, --ink-*, --font-*)
   ===================================================================== */

.fx-page {
    /* =================================================================
       AÇIK ZEMİN TİPOGRAFİSİ — ölçülmüş kontrast (beyaz / buz #F3F7FA)
       ================================================================= */
    --fx-navy:      #0B1B2B;   /* ana başlık      17.41:1 / 16.17:1 */
    --fx-navy-soft: #334155;   /* gövde metni     10.35:1 /  9.61:1 */
    --fx-muted:     #4A5A70;   /* ikincil/etiket   7.03:1 /  6.53:1 */

    /* =================================================================
       KOYU ZEMİN TİPOGRAFİSİ — koyu CTA bölümü için
       Koyu zeminde ASLA koyu lacivert başlık kullanılmaz.
       ================================================================= */
    --fx-dark-a:     #0E2438;  /* zemin: koyu lacivert (siyaha yakın değil) */
    --fx-dark-b:     #134A6B;  /* zemin: kontrollü açık maviye geçiş */
    --fx-on-dark:    #FFFFFF;  /* başlık   15.81:1 / 9.46:1 */
    --fx-on-dark-2:  #E2E8F0;  /* alt metin 12.83:1 / 7.67:1 */
    --fx-on-dark-3:  #CBD5E1;  /* gövde     10.65:1 / 6.37:1 */
    --fx-ice:       #F3F7FA;
    --fx-ice-2:     #E8F0F6;
    --fx-line:      #D8E3EC;
    --fx-line-soft: #E9F0F6;

    --fx-blue:      var(--brand-600);    /* birincil buton · vurgu */
    --fx-blue-dk:   var(--brand-700);
    --fx-blue-lt:   var(--brand-500);
    --fx-spark:     var(--brand-spark);  /* ince teknik çizgi · glow */

    --fx-amber:     #E4750E;   /* kontrollü turuncu — çizgi/işaret */
    --fx-amber-ink: #A85206;   /* turuncu metin (beyaz üzerinde AA) */

    --fx-shell:     1200px;
    --fx-sec-pad:   112px;

    color: var(--fx-navy-soft);
    background: #fff;
    /* Yatay kaydırmayı kökten engelle (sticky header etkilenmez) */
    overflow-x: clip;
}

/* =====================================================================
   OKUNABİLİRLİK GÜVENCESİ — scroll-reveal'in opacity bağımlılığı kaldırıldı
   =====================================================================
   site.css'teki genel reveal kuralı [data-reveal] elemanlarını opacity:0
   yapar ve görünür olmaları JavaScript'in IntersectionObserver'ı
   tetiklemesine bağlıdır. Gözlemci herhangi bir nedenle çalışmazsa
   BAŞLIKLAR TAMAMEN GÖRÜNMEZ kalır — koyu CTA bölümünde yaşanan sorun budur.

   Bu sayfada reveal yalnızca hafif bir KAYMA efektidir; opacity daima 1'dir.
   Böylece JS çalışmasa bile tek bir metin dahi kaybolmaz.
   Seçici site.css'ten daha spesifik olduğu için !important gerekmez. */
html.js-reveal .fx-page [data-reveal] {
    opacity: 1;
    transform: translateY(14px);
}
html.js-reveal .fx-page [data-reveal="scale"] { transform: scale(0.988); }
html.js-reveal .fx-page [data-reveal].is-revealed { transform: none; }

/* Başlıklar için TABAN katman.
   DİKKAT — burada :is() KULLANILMAZ. :is(h1,h2,h3) kendi içindeki en
   spesifik argümanın (tip seçici) değerini taşıdığı için bu kural
   (0,1,1) oluyordu ve tek sınıflı bileşen kurallarını (0,1,0) eziyordu.
   Sonuç: .fx-final__title { color:#fff } hiçbir zaman uygulanmıyor,
   koyu CTA başlığı koyu lacivert kalıyordu (kontrast 1.10:1).

   :where() specificity taşımaz → kural (0,1,0)'da kalır: site.css'teki
   element düzeyi `h2` kuralını (0,0,1) hâlâ ezer, ancak bileşen
   sınıflarının rengi artık taban katmanı geçersiz kılabilir. */
.fx-page :where(h1, h2, h3) {
    font-family: var(--font-heading);
    color: var(--fx-navy);
    letter-spacing: -0.022em;
    margin: 0;
}

.fx-page p { margin: 0; }
.fx-page ul, .fx-page ol { margin: 0; padding: 0; list-style: none; }

/* ---------------------------------------------------------------------
   ORTAK TİPOGRAFİ
   ------------------------------------------------------------------ */
.fx-overline {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--font-family);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--fx-blue-dk);
}
.fx-overline__tick {
    width: 28px;
    height: 1px;
    background: var(--fx-amber);
    flex: none;
}

.fx-h1 {
    font-size: clamp(2rem, 3.5vw, 3.35rem);
    line-height: 1.08;
    font-weight: 700;
}
.fx-h2 {
    font-size: clamp(1.6rem, 2.6vw, 2.5rem);
    line-height: 1.14;
    font-weight: 700;
}
.fx-lead {
    font-size: clamp(1rem, 1.15vw, 1.125rem);
    line-height: 1.75;
    color: var(--fx-navy-soft);
    max-width: 62ch;
}

.fx-head { margin-bottom: 56px; }
.fx-head .fx-h2 { margin-top: 18px; }
.fx-head--wide .fx-h2 { max-width: 20ch; }
.fx-head--center { text-align: center; }
.fx-head--center .fx-h2 { margin-inline: auto; }

.fx-sec { padding: var(--fx-sec-pad) 0; }
.fx-sec:focus { outline: none; }

/* ---------------------------------------------------------------------
   GÖRSEL SAHNESİ  (gerçek görsel veya teknik zemin — oran her hâlükârda
   sabit olduğu için layout shift oluşmaz)
   ------------------------------------------------------------------ */
.fx-scene {
    position: relative;
    margin: 0;
    overflow: hidden;
    background: var(--fx-ice-2);
}
.fx-scene--cover {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}
.fx-scene__img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fx-scene__frame {
    position: absolute;
    inset: 0;
    pointer-events: none;
    box-shadow: inset 0 0 0 1px rgba(14, 26, 44, 0.06);
}

/* Görsel dosyası henüz eklenmediğinde: markaya uygun mühendislik zemini */
.fx-scene__ph {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #FFFFFF 0%, #EFF6FB 44%, #DCE8F2 100%);
}
.fx-scene__ph-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(10, 134, 180, 0.10) 1px, transparent 1px),
        linear-gradient(90deg, rgba(10, 134, 180, 0.10) 1px, transparent 1px);
    background-size: 54px 54px;
}
.fx-scene__ph-arc {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 62%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px solid rgba(10, 134, 180, 0.22);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.7),
        inset 0 0 90px rgba(255, 255, 255, 0.65);
}
.fx-scene__ph-glow {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(52% 62% at 62% 42%, rgba(255, 255, 255, 0.85), transparent 70%),
        radial-gradient(28% 40% at 28% 74%, rgba(228, 117, 14, 0.10), transparent 72%);
}
.fx-scene__ph--turbine .fx-scene__ph-arc { width: 46%; border-style: dashed; }
.fx-scene__ph--aero    .fx-scene__ph-arc { width: 74%; left: 66%; }
.fx-scene__ph--cad     .fx-scene__ph-grid { background-size: 34px 34px; }
.fx-scene__ph--cad     .fx-scene__ph-arc { width: 52%; border-color: rgba(228, 117, 14, 0.28); }

/* ---------------------------------------------------------------------
   LOGO KİLİDİ  (oran korunur — yalnızca yükseklik sınırlanır)
   ------------------------------------------------------------------ */
.fx-logo { display: inline-flex; align-items: center; }
.fx-logo img { display: block; width: auto; max-width: 200px; }
.fx-logo--company img { height: 38px; }
.fx-logo--fair img { height: 34px; }
.fx-logo--type {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 0.9rem;
    letter-spacing: 0.02em;
    color: var(--fx-navy);
    white-space: nowrap;
}
.fx-lockup__x {
    width: 1px;
    height: 26px;
    background: var(--fx-line);
    flex: none;
}

/* ---------------------------------------------------------------------
   BUTONLAR
   ------------------------------------------------------------------ */
.fx-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 56px;
    padding: 0 28px;
    border: 1px solid transparent;
    border-radius: 10px;
    font-family: var(--font-family);
    font-size: 0.9375rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    transition: background-color 0.22s ease, border-color 0.22s ease,
                color 0.22s ease, transform 0.22s ease, box-shadow 0.22s ease;
}
.fx-btn i { font-size: 1rem; line-height: 1; }
.fx-btn:hover { transform: translateY(-1px); }
.fx-btn:focus-visible {
    outline: 3px solid var(--fx-blue);
    outline-offset: 3px;
}

/* Zemin --brand-700: beyaz yazı ile 5.72:1 → küçük metinde de AA geçer
   (--brand-600 yalnızca 4.13:1 verdiği için buton zemini olarak kullanılmadı) */
.fx-btn--primary {
    background: var(--fx-blue-dk);
    color: #fff;
    box-shadow: 0 10px 24px rgba(10, 92, 124, 0.24);
}
.fx-btn--primary:hover { background: var(--brand-800); color: #fff; }

.fx-btn--ghost {
    background: rgba(255, 255, 255, 0.72);
    border-color: var(--fx-line);
    color: var(--fx-navy);
    backdrop-filter: blur(8px);
}
.fx-btn--ghost:hover {
    background: #fff;
    border-color: var(--fx-blue-lt);
    color: var(--fx-navy);
}

.fx-btn--outline {
    background: transparent;
    border-color: var(--fx-line);
    color: var(--fx-navy);
}
.fx-btn--outline:hover { border-color: var(--fx-blue); color: var(--fx-blue-dk); }

.fx-btn--light {
    background: #fff;
    color: var(--fx-navy);
}
.fx-btn--light:hover { background: var(--fx-ice); color: var(--fx-navy); }
.fx-btn--light:focus-visible { outline-color: #fff; }

.fx-btn--sm { min-height: 48px; padding: 0 20px; font-size: 0.875rem; }

/* --- Koyu zemin varyantları ---------------------------------------
   Birincil: logo tonu zemin + koyu lacivert metin = 6.80:1 (AA).
   Marka mavisi + beyaz kombinasyonu yalnızca 4.13:1 verdiği ve normal
   metin için AA'yı geçemediği için CTA zemini olarak kullanılmadı. */
.fx-btn--accent {
    min-height: 52px;
    background: #0EA5E9;
    color: #071827;                    /* 6.48:1 */
    -webkit-text-fill-color: #071827;
    font-weight: 750;
    box-shadow: 0 12px 28px rgba(14, 165, 233, 0.26);
}
.fx-btn--accent:hover {
    background: #38BDF8;               /* 8.39:1 */
    color: #071827;
}
.fx-btn--accent:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 3px; }

/* İkincil: koyu zeminde yarı saydam, metin saf beyaz (9.10:1) */
.fx-btn--onDark {
    min-height: 52px;
    background: transparent;
    border-color: rgba(255, 255, 255, 0.45);
    color: #FFFFFF;
    -webkit-text-fill-color: #FFFFFF;
}
.fx-btn--onDark:hover {
    background: rgba(255, 255, 255, 0.10);
    border-color: #FFFFFF;
    color: #FFFFFF;
}
.fx-btn--onDark:focus-visible { outline: 3px solid #FFFFFF; outline-offset: 3px; }

/* =====================================================================
   HERO
   ================================================================== */
.fx-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: clamp(760px, 86vh, 1000px);
    background: var(--fx-ice);
    overflow: hidden;
    isolation: isolate;
}
.fx-hero__media { position: absolute; inset: 0; z-index: 0; }

.fx-hero__wash {
    position: absolute;
    inset: 0;
    z-index: 1;
    background:
        linear-gradient(100deg,
            rgba(255, 255, 255, 0.975) 0%,
            rgba(255, 255, 255, 0.935) 28%,
            rgba(244, 249, 252, 0.74)  46%,
            rgba(240, 247, 251, 0.26)  64%,
            rgba(255, 255, 255, 0)     84%),
        linear-gradient(to top, rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0) 40%);
}
.fx-hero__grid {
    position: absolute;
    inset: 0;
    z-index: 1;
    background-image:
        linear-gradient(rgba(14, 26, 44, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(14, 26, 44, 0.05) 1px, transparent 1px);
    background-size: 108px 108px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 52%, #000 100%);
            mask-image: linear-gradient(90deg, transparent 0%, #000 52%, #000 100%);
}
/* Yatay ölçü çizgisi — kompozisyonu tek parçaya bağlayan teknik detay */
.fx-hero__rule {
    position: absolute;
    left: 0;
    right: 0;
    top: 30%;
    z-index: 1;
    height: 9px;
    background:
        linear-gradient(to right, transparent, rgba(4, 179, 231, 0.42) 22%, rgba(4, 179, 231, 0.42) 78%, transparent) 0 0 / 100% 1px no-repeat,
        repeating-linear-gradient(90deg, rgba(4, 179, 231, 0.34) 0 1px, transparent 1px 64px) 0 0 / 100% 9px no-repeat;
    opacity: 0.75;
}

.fx-hero__inner {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    padding-top: 72px;
    padding-bottom: 88px;
}
.fx-hero__content { width: 100%; }

.fx-hero__lockup {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
}

.fx-hero__overline {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 9px 16px 9px 14px;
    background: rgba(255, 255, 255, 0.78);
    border: 1px solid var(--fx-line);
    border-radius: 999px;
    backdrop-filter: blur(8px);
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--fx-navy);
}

.fx-hero__title {
    margin: 26px 0 0;
    max-width: 17ch;
    font-size: clamp(2.4rem, 5.1vw, 4.9rem);
    line-height: 1.03;
    font-weight: 800;
    letter-spacing: -0.03em;
}
.fx-hero__title-a,
.fx-hero__title-b { display: block; }
.fx-hero__title-a { color: var(--fx-navy); }
.fx-hero__title-b {
    position: relative;
    width: -moz-fit-content;
    width: fit-content;
    color: var(--fx-blue);
    padding-bottom: 0.14em;
}
.fx-hero__title-b::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 92px;
    height: 3px;
    background: var(--fx-amber);
}

.fx-hero__lead {
    margin-top: 28px;
    max-width: 54ch;
    font-size: clamp(1rem, 1.2vw, 1.1875rem);
    line-height: 1.72;
    color: var(--fx-navy-soft);
}
.fx-hero__invite {
    position: relative;
    margin-top: 22px;
    padding-left: 20px;
    max-width: 52ch;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.65;
    color: var(--fx-navy);
}
.fx-hero__invite-bar {
    position: absolute;
    left: 0;
    top: 4px;
    bottom: 4px;
    width: 3px;
    background: linear-gradient(to bottom, var(--fx-blue-lt), var(--fx-amber));
}

.fx-hero__cta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 38px;
}

/* Kaydırma göstergesi */
.fx-cue {
    position: absolute;
    right: 12px;
    bottom: 8px;
    z-index: 3;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    color: var(--fx-muted);
    font-size: 0.6875rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    text-decoration: none;
}
.fx-cue:hover { color: var(--fx-blue-dk); }
.fx-cue:focus-visible { outline: 2px solid var(--fx-blue); outline-offset: 4px; }
.fx-cue__line {
    width: 1px;
    height: 46px;
    background: linear-gradient(to bottom, transparent, var(--fx-blue-lt));
    overflow: hidden;
}
.fx-cue__line::after {
    content: "";
    display: block;
    width: 1px;
    height: 14px;
    background: var(--fx-amber);
    animation: fx-cue-run 2.4s var(--ease-out) infinite;
}
@keyframes fx-cue-run {
    0%   { transform: translateY(-16px); opacity: 0; }
    35%  { opacity: 1; }
    100% { transform: translateY(46px); opacity: 0; }
}

/* Hero alt bilgi şeridi */
.fx-hero__rail {
    position: relative;
    z-index: 2;
    border-top: 1px solid rgba(216, 227, 236, 0.9);
    background: rgba(255, 255, 255, 0.74);
    backdrop-filter: blur(16px);
}
.fx-hero__rail-in {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.fx-railitem {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 24px 26px 26px;
    border-left: 1px solid var(--fx-line);
    min-width: 0;
}
.fx-railitem:first-child { border-left: 0; padding-left: 0; }
.fx-railitem__k {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fx-muted);
}
.fx-railitem__v {
    font-family: var(--font-heading);
    font-size: 1.0625rem;
    font-weight: 600;
    line-height: 1.35;
    color: var(--fx-navy);
    overflow-wrap: anywhere;
}
.fx-railitem--accent .fx-railitem__v { color: var(--fx-amber-ink); }

/* =====================================================================
   1 — FUARA DAVET
   ================================================================== */
.fx-invite { padding-top: 128px; }
.fx-invite__grid {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 72px;
    align-items: start;
}
.fx-invite__type .fx-h1 { margin-top: 22px; max-width: 15ch; }
.fx-invite__body { padding-top: 104px; }   /* kasıtlı asimetri */
.fx-invite__mini {
    display: flex;
    gap: 48px;
    margin: 36px 0 0;
    padding-top: 26px;
    border-top: 1px solid var(--fx-line);
}
.fx-invite__mini dt {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fx-muted);
    margin-bottom: 6px;
}
.fx-invite__mini dd {
    margin: 0;
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--fx-navy);
}

/* =====================================================================
   2 — FUAR BİLGİLERİ ŞERİDİ
   ================================================================== */
.fx-facts { padding-top: 0; }
.fx-facts__strip {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    background: linear-gradient(180deg, #fff 0%, var(--fx-ice) 100%);
    border: 1px solid var(--fx-line);
    border-radius: 14px;
    overflow: hidden;
}
.fx-fact {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 38px 32px 40px;
    border-left: 1px solid var(--fx-line);
    min-width: 0;
}
.fx-fact:first-child { border-left: 0; }
.fx-fact__ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
    border-radius: 9px;
    background: #fff;
    border: 1px solid var(--fx-line);
    color: var(--fx-blue);
    font-size: 1.0625rem;
}
.fx-fact__k {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fx-muted);
}
.fx-fact__v {
    font-family: var(--font-heading);
    font-size: 1.1875rem;
    font-weight: 700;
    line-height: 1.35;
    color: var(--fx-navy);
    overflow-wrap: anywhere;
}
.fx-fact__s { font-size: 0.875rem; color: var(--fx-muted); }

/* =====================================================================
   3 — NELERİ KEŞFEDECEKSİNİZ (editorial liste)
   ================================================================== */
.fx-list { border-top: 1px solid var(--fx-line); }
.fx-list__item {
    position: relative;
    display: grid;
    grid-template-columns: 108px minmax(0, 1fr) auto 40px;
    align-items: center;
    gap: 28px;
    padding: 34px 8px 34px 0;
    border-bottom: 1px solid var(--fx-line);
    transition: background-color 0.3s var(--ease-out);
}
.fx-list__item::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 0;
    height: 1px;
    background: var(--fx-blue-lt);
    transition: width 0.5s var(--ease-out);
}
.fx-list__item:hover::before { width: 100%; }
.fx-list__num {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    /* Eskiden --fx-line (#D8E3EC) idi: beyaz üzerinde yalnızca 1.30:1 —
       "hayalet numara" okunamayacak kadar soluktu. 3.09:1 ile büyük metin
       eşiğini geçen, yine de ikincil kalan bir ton kullanılıyor. */
    color: #8095AB;
    transition: color 0.3s ease, transform 0.35s var(--ease-out);
}
.fx-list__item:hover .fx-list__num { color: var(--fx-blue); transform: translateX(4px); }
.fx-list__body { min-width: 0; }
.fx-list__title {
    font-size: clamp(1.0625rem, 1.5vw, 1.375rem);
    font-weight: 600;
    line-height: 1.35;
}
.fx-list__text {
    margin-top: 8px;
    font-size: 0.9375rem;
    line-height: 1.65;
    color: var(--fx-muted);
    max-width: 62ch;
}
.fx-list__sliver {
    display: block;
    width: 148px;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid var(--fx-line);
    background: var(--fx-ice-2);
}
.fx-list__sliver img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s var(--ease-out);
}
.fx-list__item:hover .fx-list__sliver img { transform: scale(1.05); }
.fx-list__arrow {
    justify-self: end;
    /* --fx-blue-lt beyaz üzerinde 2.91:1 ile ikon eşiğinin (3:1) altında
       kaldığı için bir ton koyulaştırıldı → 4.13:1 */
    color: var(--fx-blue);
    opacity: 0;
    transform: translateX(-8px);
    transition: opacity 0.3s ease, transform 0.35s var(--ease-out);
}
.fx-list__item:hover .fx-list__arrow { opacity: 1; transform: translateX(0); }

/* =====================================================================
   4 — HASSASİYETTEN GELECEĞE
   ================================================================== */
.fx-precision { padding: 0; }
.fx-precision__stage {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 660px;
    padding: 96px 0;
    background: linear-gradient(90deg, var(--fx-ice) 0%, #fff 46%, transparent 46.01%);
}
.fx-precision__media {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 64%;
    overflow: hidden;
}
.fx-precision__media::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.28) 22%, transparent 50%);
    pointer-events: none;
}
.fx-precision__wrap { position: relative; z-index: 2; }
.fx-panel {
    max-width: 560px;
    padding: 52px 52px 46px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid var(--fx-line-soft);
    border-radius: 16px;
    box-shadow: 0 28px 64px rgba(14, 26, 44, 0.12);
    backdrop-filter: blur(14px);
}
.fx-panel .fx-h2 { margin-top: 18px; }
.fx-panel__text {
    margin-top: 20px;
    font-size: 1.0625rem;
    line-height: 1.75;
    color: var(--fx-navy-soft);
}
.fx-panel__rule {
    display: block;
    width: 64px;
    height: 2px;
    margin: 30px 0 18px;
    background: var(--fx-amber);
}
.fx-panel__meta {
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--fx-muted);
}

/* =====================================================================
   5 — SEKTÖRLER ARASI TEKNOLOJİ
   ================================================================== */
.fx-sectors { padding-bottom: 0; }
.fx-sectors__band {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 620px;
    overflow: hidden;
}
.fx-sectors__media { position: absolute; inset: 0; }
.fx-sectors__wash {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top,
        rgba(255, 255, 255, 0.97) 0%,
        rgba(255, 255, 255, 0.86) 26%,
        rgba(255, 255, 255, 0.22) 58%,
        rgba(255, 255, 255, 0) 100%);
}
.fx-sectors__listwrap { position: relative; z-index: 2; padding-bottom: 12px; }
.fx-sectors__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    border-top: 1px solid var(--fx-line);
}
.fx-sectors__item {
    display: flex;
    align-items: baseline;
    gap: 14px;
    padding: 26px 24px 26px 0;
    border-bottom: 1px solid var(--fx-line);
    min-width: 0;
}
.fx-sectors__item:nth-child(3n) { padding-right: 0; }
.fx-sectors__idx {
    font-family: var(--font-heading);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--fx-amber-ink);
    flex: none;
}
.fx-sectors__name {
    font-family: var(--font-heading);
    font-size: clamp(1.0625rem, 1.6vw, 1.4375rem);
    font-weight: 600;
    color: var(--fx-navy);
    overflow-wrap: anywhere;
}

/* =====================================================================
   6 — TASARIMDAN ÜRETİME  (CAD → işlenmiş parça geçişi)
   ================================================================== */
.fx-eng__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr);
    gap: 76px;
    align-items: center;
}
.fx-eng__type .fx-h2 { margin: 18px 0 22px; }

.fx-phases {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 0;
    margin-top: 40px;
    border-top: 1px solid var(--fx-line);
    padding-top: 26px;
}
.fx-phases__item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding-right: 26px;
    margin-right: 26px;
    min-width: 0;
}
.fx-phases__item:not(:last-child)::after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    width: 14px;
    height: 1px;
    background: var(--fx-line);
}
.fx-phases__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--fx-blue-lt);
    flex: none;
}
.fx-phases__n {
    font-family: var(--font-heading);
    font-size: 0.6875rem;
    font-weight: 700;
    color: var(--fx-amber-ink);
}
.fx-phases__t {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--fx-navy);
    white-space: nowrap;
}

.fx-eng__stage {
    --fx-wipe: 50%;
    position: relative;
    aspect-ratio: 4 / 3;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid var(--fx-line);
    background: var(--fx-ice-2);
}
/* Sol taraf: teknik çizim katmanı — sağ taraf: işlenmiş parça */
.fx-eng__blueprint {
    position: absolute;
    inset: 0;
    z-index: 2;
    clip-path: inset(0 calc(100% - var(--fx-wipe)) 0 0);
    background:
        linear-gradient(rgba(10, 134, 180, 0.16) 1px, transparent 1px) 0 0 / 100% 30px,
        linear-gradient(90deg, rgba(10, 134, 180, 0.16) 1px, transparent 1px) 0 0 / 30px 100%,
        linear-gradient(rgba(10, 134, 180, 0.30) 1px, transparent 1px) 0 0 / 100% 150px,
        linear-gradient(90deg, rgba(10, 134, 180, 0.30) 1px, transparent 1px) 0 0 / 150px 100%,
        linear-gradient(160deg, #F7FBFD 0%, #E4EFF7 100%);
    transition: clip-path 0.18s linear;
}
.fx-eng__blueprint::after {
    content: "";
    position: absolute;
    left: 42%;
    top: 50%;
    width: 46%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    border: 1px dashed rgba(10, 110, 148, 0.55);
    border-radius: 50%;
    box-shadow: inset 0 0 0 22px rgba(255, 255, 255, 0.45);
}
.fx-eng__seam {
    position: absolute;
    top: 0;
    bottom: 0;
    left: var(--fx-wipe);
    z-index: 3;
    width: 1px;
    background: var(--fx-spark);
    box-shadow: 0 0 14px rgba(4, 179, 231, 0.75);
    transition: left 0.18s linear;
}
.fx-eng__tagl,
.fx-eng__tagr {
    position: absolute;
    bottom: 18px;
    z-index: 4;
    padding: 6px 12px;
    border-radius: 999px;
    font-family: var(--font-heading);
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.14em;
}
.fx-eng__tagl {
    left: 18px;
    background: rgba(255, 255, 255, 0.86);
    border: 1px solid var(--fx-line);
    color: var(--fx-blue-dk);
}
.fx-eng__tagr {
    right: 18px;
    background: rgba(14, 26, 44, 0.72);
    color: #fff;
    backdrop-filter: blur(6px);
}

/* =====================================================================
   7 — FUAR İSTATİSTİKLERİ
   ================================================================== */
.fx-stats { background: var(--fx-ice); }
.fx-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0;
    border-top: 1px solid var(--fx-line);
}
.fx-stat,
.fx-statement {
    padding: 44px 32px 44px 0;
    border-right: 1px solid var(--fx-line);
    min-width: 0;
}
.fx-stat:first-child { padding-left: 0; }
.fx-stat { display: flex; flex-direction: column; }
.fx-stat__num {
    font-family: var(--font-heading);
    font-size: clamp(2.75rem, 5.4vw, 4.75rem);
    font-weight: 800;
    line-height: 1;
    letter-spacing: -0.04em;
    color: var(--fx-navy);
    font-variant-numeric: tabular-nums;
}
/* Sayı ve eki aynı taban çizgisinde tut: "30'dan fazla" tek satır okunur,
   kesme işareti satır başına düşmez */
.fx-stat__val {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0;   /* "30'dan fazla" — kesme işaretinden önce boşluk olmamalı */
}
.fx-stat__suffix {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--fx-blue-dk);
}
.fx-stat__label {
    margin-top: 14px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fx-muted);
}
.fx-statement {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 16px;
    padding-left: 32px;
    font-family: var(--font-heading);
    font-size: clamp(1.0625rem, 1.5vw, 1.3125rem);
    font-weight: 600;
    line-height: 1.4;
    color: var(--fx-navy);
}
.fx-statement:last-child { border-right: 0; padding-right: 0; }
.fx-statement__bar {
    width: 40px;
    height: 2px;
    background: var(--fx-amber);
}

/* =====================================================================
   8 — ZİYARET PLANI
   ================================================================== */
.fx-visit__grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 72px;
    align-items: start;
}
.fx-visit__type .fx-h2 { margin: 18px 0 20px; }
.fx-visit__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; }
.fx-visit__card {
    padding: 12px 40px 20px;
    background: linear-gradient(180deg, #fff 0%, var(--fx-ice) 100%);
    border: 1px solid var(--fx-line);
    border-radius: 16px;
}
.fx-deflist { margin: 0; }
.fx-deflist__row {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 20px;
    align-items: baseline;
    padding: 22px 0;
    border-bottom: 1px solid var(--fx-line);
}
.fx-deflist__row:last-child { border-bottom: 0; }
.fx-deflist dt {
    font-size: 0.6875rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--fx-muted);
}
.fx-deflist dd {
    margin: 0;
    font-family: var(--font-heading);
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--fx-navy);
    overflow-wrap: anywhere;
}

/* =====================================================================
   9 — SON CTA
   ================================================================== */
.fx-final {
    position: relative;
    padding: 108px 0 116px;
    /* Siyaha yakın DEĞİL: koyu laciverte kontrollü açık mavi geçişi */
    background:
        radial-gradient(circle at 70% 20%, rgba(14, 165, 233, 0.16), transparent 42%),
        linear-gradient(135deg, #0B2239 0%, #123E5C 55%, #164D6B 100%);
    overflow: hidden;
    text-align: center;
}
.fx-final__grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 118px 118px;
    -webkit-mask-image: radial-gradient(64% 78% at 50% 46%, #000, transparent 100%);
            mask-image: radial-gradient(64% 78% at 50% 46%, #000, transparent 100%);
}
/* Dekoratif katmanlar: z-index 0 ve tıklamayı engellemez */
.fx-final__grid,
.fx-final__glow {
    z-index: 0;
    pointer-events: none;
}
.fx-final__glow {
    position: absolute;
    inset: 0;
    background: radial-gradient(58% 80% at 50% 8%, rgba(14, 165, 233, 0.10), transparent 70%);
}
/* İçerik katmanı her zaman dekoratif katmanların üstünde */
.fx-final__in { position: relative; z-index: 1; }

/* =====================================================================
   KOYU CTA BAŞLIĞI — KESİN KURAL
   =====================================================================
   Specificity (0,3,0): taban başlık katmanını (0,1,0) ve site.css'teki
   element kuralını (0,0,1) kesin olarak geçer. !important gerekmez.
   Gradient text / transparent text-fill / blend / filter ihtimallerine
   karşı hepsi açıkça sıfırlanır. */
.fx-page .fx-final .fx-final__title {
    color: #FFFFFF;
    -webkit-text-fill-color: #FFFFFF;
    background: none;
    background-image: none;
    -webkit-background-clip: border-box;
            background-clip: border-box;
    opacity: 1;
    filter: none;
    mix-blend-mode: normal;
    text-shadow: none;
    position: relative;
    z-index: 1;
}

.fx-final__overline {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 22px;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--fx-on-dark-2);
}
.fx-final__tick {
    width: 28px;
    height: 2px;
    background: var(--fx-amber);
    flex: none;
}

.fx-final__title {
    max-width: 900px;
    margin: 0 auto;
    font-size: clamp(42px, 4.5vw, 76px);
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -0.02em;
    text-wrap: balance;   /* satır kırılmasını dengeler */
}
.fx-final__text {
    max-width: 850px;
    margin: 26px auto 0;
    font-size: clamp(17px, 1.4vw, 21px);
    line-height: 1.7;
    color: #E2E8F0;
}

/* Bilgi satırı — kutu değil, ince ayırıcılı tek şerit */
.fx-final__facts {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px 28px;
    margin: 34px auto 0;
    padding-top: 26px;
    max-width: 860px;
    border-top: 1px solid rgba(255, 255, 255, 0.22);
}
.fx-final__fact {
    position: relative;
    font-family: var(--font-heading);
    font-size: 0.9375rem;
    font-weight: 600;
    color: #FFFFFF;
}
/* Ayırıcı noktalar turuncu */
.fx-final__fact + .fx-final__fact::before {
    content: "·";
    position: absolute;
    left: -17px;
    top: 50%;
    transform: translateY(-50%);
    color: #F97316;
    font-size: 1.25rem;
    line-height: 1;
}

.fx-final__cta {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    margin-top: 38px;
}

/* =====================================================================
   10 — SIK SORULAN SORULAR
   ================================================================== */
.fx-faq__list { border-top: 1px solid var(--fx-line); max-width: 940px; }
.fx-faq__item { border-bottom: 1px solid var(--fx-line); }
.fx-faq__q {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 26px 0;
    cursor: pointer;
    list-style: none;
}
.fx-faq__q::-webkit-details-marker { display: none; }
.fx-faq__q:focus-visible { outline: 2px solid var(--fx-blue); outline-offset: 4px; }
.fx-faq__qt {
    font-family: var(--font-heading);
    font-size: clamp(1rem, 1.3vw, 1.1875rem);
    font-weight: 600;
    color: var(--fx-navy);
    line-height: 1.45;
}
.fx-faq__sign {
    position: relative;
    flex: none;
    width: 34px;
    height: 34px;
    border: 1px solid var(--fx-line);
    border-radius: 50%;
    transition: border-color 0.25s ease, background-color 0.25s ease;
}
.fx-faq__sign::before,
.fx-faq__sign::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 12px;
    height: 1.5px;
    background: var(--fx-blue-dk);
    transform: translate(-50%, -50%);
    transition: transform 0.28s var(--ease-out), opacity 0.2s ease;
}
.fx-faq__sign::after { transform: translate(-50%, -50%) rotate(90deg); }
.fx-faq__item[open] .fx-faq__sign { border-color: var(--fx-blue-lt); background: var(--fx-ice); }
.fx-faq__item[open] .fx-faq__sign::after { transform: translate(-50%, -50%) rotate(0deg); opacity: 0; }
.fx-faq__q:hover .fx-faq__sign { border-color: var(--fx-blue-lt); }
.fx-faq__a {
    padding: 0 64px 28px 0;
    max-width: 74ch;
    font-size: 0.9375rem;
    line-height: 1.75;
    color: var(--fx-navy-soft);
}

/* =====================================================================
   MOBİL SABİT DAVETİYE ÇUBUĞU
   ================================================================== */
.fx-sticky {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1080;
    display: none;
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, 0.94);
    border-top: 1px solid var(--fx-line);
    backdrop-filter: blur(14px);
    box-shadow: 0 -8px 24px rgba(14, 26, 44, 0.1);
    transform: translateY(100%);
    transition: transform 0.32s var(--ease-out);
}
.fx-sticky.is-on { transform: translateY(0); }
.fx-sticky__in {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}
.fx-sticky__meta {
    font-family: var(--font-heading);
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--fx-navy);
    min-width: 0;
}
.fx-sticky .fx-btn { flex: none; }

/* =====================================================================
   RESPONSIVE
   ================================================================== */

/* --- 1440 / 1280 arası: nefes payını kıs ------------------------- */
@media (max-width: 1399.98px) {
    .fx-page { --fx-sec-pad: 100px; }
    .fx-precision__stage { min-height: 600px; }
}

/* --- 1280 dizüstü ------------------------------------------------ */
@media (max-width: 1279.98px) {
    .fx-page { --fx-sec-pad: 92px; }
    .fx-invite__grid { gap: 56px; }
    .fx-invite__body { padding-top: 76px; }
    .fx-eng__grid { gap: 56px; }
    .fx-visit__grid { gap: 56px; }
    .fx-fact { padding: 32px 24px 34px; }
    .fx-panel { padding: 44px 44px 40px; }
    .fx-list__item { grid-template-columns: 88px minmax(0, 1fr) auto 32px; gap: 22px; }
}

/* --- 1024 tablet yatay ------------------------------------------- */
@media (max-width: 1199.98px) {
    .fx-hero { min-height: clamp(680px, 82vh, 900px); }
    .fx-hero__wash {
        background:
            linear-gradient(100deg,
                rgba(255, 255, 255, 0.98) 0%,
                rgba(255, 255, 255, 0.95) 40%,
                rgba(244, 249, 252, 0.72) 62%,
                rgba(255, 255, 255, 0.24) 86%,
                rgba(255, 255, 255, 0) 100%),
            linear-gradient(to top, rgba(255, 255, 255, 0.94) 0%, rgba(255, 255, 255, 0) 42%);
    }
    .fx-precision__media { width: 58%; }
    .fx-panel { max-width: 500px; }
    .fx-sectors__band { min-height: 540px; }
    .fx-list__sliver { width: 112px; }
}

/* --- 992 altı: tek kolona geçiş ---------------------------------- */
@media (max-width: 991.98px) {
    .fx-page { --fx-sec-pad: 76px; }

    .fx-hero { min-height: auto; }
    .fx-hero__inner { padding-top: 56px; padding-bottom: 64px; }
    .fx-hero__wash {
        background:
            linear-gradient(180deg,
                rgba(255, 255, 255, 0.97) 0%,
                rgba(255, 255, 255, 0.93) 46%,
                rgba(247, 251, 253, 0.86) 72%,
                rgba(255, 255, 255, 0.95) 100%);
    }
    .fx-hero__grid { -webkit-mask-image: none; mask-image: none; opacity: 0.6; }
    .fx-hero__rule { top: 22%; }
    .fx-hero__title { max-width: 100%; }
    .fx-cue { display: none; }

    .fx-hero__rail-in { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fx-railitem { padding: 18px 18px 20px; }
    .fx-railitem:first-child,
    .fx-railitem:nth-child(3) { border-left: 0; padding-left: 0; }
    .fx-railitem:nth-child(3),
    .fx-railitem:nth-child(4) { border-top: 1px solid var(--fx-line); }

    .fx-invite { padding-top: var(--fx-sec-pad); }
    .fx-invite__grid { grid-template-columns: minmax(0, 1fr); gap: 34px; }
    .fx-invite__body { padding-top: 0; }

    .fx-facts__strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fx-fact { border-left: 1px solid var(--fx-line); }
    .fx-fact:nth-child(odd) { border-left: 0; }
    .fx-fact:nth-child(n + 3) { border-top: 1px solid var(--fx-line); }

    .fx-list__item { grid-template-columns: 68px minmax(0, 1fr); gap: 18px; padding: 26px 0; }
    .fx-list__num { font-size: 1.625rem; }
    .fx-list__sliver,
    .fx-list__arrow { display: none; }

    .fx-precision__stage {
        display: block;
        min-height: 0;
        padding: 0;
        background: none;
    }
    .fx-precision__media {
        position: relative;
        width: 100%;
        aspect-ratio: 16 / 9;
    }
    .fx-precision__media::after { background: linear-gradient(to bottom, transparent 40%, rgba(255, 255, 255, 0.55) 100%); }
    .fx-precision__wrap { margin-top: -48px; }
    .fx-panel { max-width: 100%; padding: 34px 26px 30px; }

    /* Mobilde metin görselin üzerine binmez: görsel üstte, liste altta */
    .fx-sectors__band { display: block; min-height: 0; }
    .fx-sectors__media {
        position: relative;
        aspect-ratio: 16 / 9;
    }
    .fx-sectors__wash { display: none; }
    .fx-sectors__listwrap { padding-top: 8px; padding-bottom: 0; }
    .fx-sectors__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fx-sectors__item { padding-right: 18px; }
    .fx-sectors__item:nth-child(3n) { padding-right: 18px; }
    .fx-sectors__item:nth-child(2n) { padding-right: 0; }

    .fx-eng__grid { grid-template-columns: minmax(0, 1fr); gap: 38px; }
    .fx-eng__stage { aspect-ratio: 16 / 10; }

    .fx-stats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fx-stat,
    .fx-statement { padding: 32px 22px 32px 0; }
    .fx-stat:nth-child(2n),
    .fx-statement:nth-child(2n) { border-right: 0; padding-right: 0; }
    .fx-statement { padding-left: 0; }
    .fx-statement:nth-child(n + 3) { border-top: 1px solid var(--fx-line); }
    .fx-stat:nth-child(n + 3) { border-top: 1px solid var(--fx-line); }

    .fx-visit__grid { grid-template-columns: minmax(0, 1fr); gap: 36px; }
    .fx-visit__card { padding: 8px 26px 16px; }

    .fx-final { padding: 84px 0 90px; }
    .fx-faq__a { padding-right: 0; }
}

/* --- 768 tablet dikey -------------------------------------------- */
@media (max-width: 767.98px) {
    .fx-page { --fx-sec-pad: 64px; }

    .fx-hero__lockup { gap: 14px; margin-bottom: 24px; }
    .fx-logo--company img { height: 32px; }
    .fx-logo--fair img { height: 28px; }
    .fx-hero__title { font-size: clamp(2rem, 8.4vw, 2.9rem); }
    .fx-hero__title-b::after { width: 68px; height: 2px; }
    .fx-hero__cta { gap: 10px; }
    .fx-hero__cta .fx-btn { flex: 1 1 100%; }

    .fx-facts__strip { grid-template-columns: minmax(0, 1fr); }
    .fx-fact { border-left: 0; }
    .fx-fact:nth-child(n + 2) { border-top: 1px solid var(--fx-line); }

    .fx-invite__mini { gap: 32px; }

    .fx-sectors__list { grid-template-columns: minmax(0, 1fr); }
    .fx-sectors__item,
    .fx-sectors__item:nth-child(3n),
    .fx-sectors__item:nth-child(2n) { padding: 20px 0; }

    .fx-stats__grid { grid-template-columns: minmax(0, 1fr); }
    .fx-stat,
    .fx-statement {
        padding: 28px 0;
        border-right: 0;
        border-top: 1px solid var(--fx-line);
    }
    .fx-stat:first-child { border-top: 0; }
    .fx-statement { padding-left: 0; }

    .fx-visit__cta .fx-btn { flex: 1 1 100%; }
    .fx-final__cta { flex-direction: column; }
    .fx-final__cta .fx-btn { width: 100%; }

    .fx-eng__stage { aspect-ratio: 3 / 2; }
    .fx-phases { gap: 12px 0; }
    .fx-phases__item { padding-right: 18px; margin-right: 18px; }

    /* Sabit davetiye çubuğu yalnızca küçük ekranlarda */
    .fx-sticky { display: block; }
    .fx-page { padding-bottom: 0; }
    body.fx-has-sticky { padding-bottom: 76px; }

    /* Çakışma önleme: sabit çubuk açıkken sitenin mevcut yüzen butonları
       (WhatsApp / telefon / yukarı çık) çubuğun üstüne kaydırılır.
       Kural yalnızca bu sayfanın body sınıfıyla geçerlidir; global stil
       değişmez, diğer sayfalar etkilenmez. */
    /* Üçü de +84px kaydırılır (çubuk 76px + 8px pay); böylece butonların
       birbirine göre mevcut dizilimi aynen korunur.
       Taban değerler: whatsapp 18px · phone 86px · back-to-top 20px */
    body.fx-has-sticky .whatsapp-float { bottom: 102px; }
    body.fx-has-sticky .phone-float    { bottom: 170px; }
    body.fx-has-sticky .back-to-top    { bottom: 104px; }
}

/* --- 390 / 360 mobil --------------------------------------------- */
@media (max-width: 575.98px) {
    .fx-page { --fx-sec-pad: 56px; }

    .fx-hero__inner { padding-top: 40px; padding-bottom: 48px; }
    .fx-hero__overline { letter-spacing: 0.14em; padding: 8px 13px; font-size: 0.6875rem; }
    .fx-hero__title { font-size: clamp(1.85rem, 8.8vw, 2.4rem); line-height: 1.08; }
    .fx-hero__lead { margin-top: 20px; font-size: 0.9688rem; }
    .fx-hero__invite { font-size: 0.9375rem; }
    .fx-hero__cta { margin-top: 28px; }
    .fx-btn { min-height: 52px; padding: 0 20px; font-size: 0.9063rem; }

    .fx-railitem { padding: 14px 12px 16px; }
    .fx-railitem__v { font-size: 0.9375rem; }

    .fx-head { margin-bottom: 34px; }
    .fx-panel { padding: 28px 20px 26px; border-radius: 12px; }
    .fx-precision__wrap { margin-top: -32px; }

    .fx-list__item { grid-template-columns: 46px minmax(0, 1fr); gap: 14px; padding: 22px 0; }
    .fx-list__num { font-size: 1.375rem; }

    .fx-visit__card { padding: 6px 20px 12px; border-radius: 12px; }
    .fx-deflist__row { grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 16px 0; }

    .fx-faq__q { gap: 16px; padding: 20px 0; }
    .fx-faq__sign { width: 30px; height: 30px; }

    .fx-final { padding: 68px 0 74px; }
    .fx-final__facts { gap: 10px 0; }
    /* Mobilde madde işareti yerine alt alta ince ayırıcı */
    .fx-final__fact { width: 100%; }
    .fx-final__fact + .fx-final__fact::before { display: none; }

    .fx-sticky__meta { font-size: 0.75rem; }
}

/* --- 360 ve altı: en dar senaryo --------------------------------- */
@media (max-width: 379.98px) {
    .fx-hero__title { font-size: 1.75rem; }
    .fx-hero__lockup { flex-wrap: wrap; gap: 10px; }
    .fx-lockup__x { display: none; }
    .fx-sticky__meta { display: none; }
    .fx-sticky .fx-btn { flex: 1 1 auto; width: 100%; }
    .fx-phases__item::after { display: none; }
    .fx-phases__item { padding-right: 14px; margin-right: 14px; }
}

/* =====================================================================
   BACKDROP-FILTER DESTEKLENMEYEN TARAYICILAR
   Cam yüzeyler bulanıklaşamadığında zemin opaklaştırılır; böylece
   görsel üzerindeki metinlerde kontrast düşmez.
   ================================================================== */
@supports not ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))) {
    .fx-hero__rail    { background: rgba(255, 255, 255, 0.95); }
    .fx-hero__overline{ background: rgba(255, 255, 255, 0.96); }
    .fx-btn--ghost    { background: rgba(255, 255, 255, 0.95); }
    .fx-panel         { background: #fff; }
    .fx-eng__tagr     { background: rgba(14, 26, 44, 0.92); }
    .fx-sticky        { background: #fff; }
}

/* =====================================================================
   HAREKET TERCİHİ
   ================================================================== */
@media (prefers-reduced-motion: reduce) {
    .fx-page *,
    .fx-sticky,
    .fx-sticky * {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
    .fx-cue__line::after { animation: none; opacity: 1; }
    .fx-btn:hover { transform: none; }
    .fx-precision__media,
    .fx-sectors__media { transform: none !important; }
}
