/*
|=============================================================================
| 1e1 DERS — JOURNEY CANVAS v1.5
|=============================================================================
| Düzeltmeler:
| - Görsel yatayda gerçek merkeze alınır; solda boşluk bırakmaz.
| - Görsel genişliği viewport'u kaplayacak biçimde JS tarafından garanti edilir.
| - Footer her zaman Journey Canvas'ın önündedir.
| - Görsel ölçeklenmez; alt bölümlerde merkeze daralma engellenir.
| - Zirve footer gelmeden önce kilitlenir ve kadraj yukarı alınır.
*/

.e1e1-homepage-main {
    position: relative;
    isolation: isolate;
    background: #f9f4eb;
}

.e1e1-journey-canvas {
    position: fixed;
    inset: 0;
    z-index: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    pointer-events: none;
}

.e1e1-journey-canvas-viewport {
    position: absolute;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
}

.e1e1-journey-canvas-image {
    position: absolute;
    left: 50%;
    top: 0;
    display: block;
    max-width: none !important;
    width: auto;
    height: 142vh;
    object-fit: contain;
    transform-origin: 50% 50%;
    /* JS yüklenmeden önce güvenli merkezleme. */
    transform: translate3d(-50%, calc(100vh - 142vh), 0) scale(1);
    opacity: 1;
    visibility: visible;
    filter: saturate(.99) contrast(1.01);
    will-change: transform, opacity;
}

/* Sayfa içeriği Journey Canvas'ın önünde kalır. */
.e1e1-homepage-main > section,
.e1e1-homepage-main > .e1e1-home-finale {
    position: relative;
    z-index: 2;
}

/* Footer kesinlikle canvas'ın üstünde görünür. */
#colophon,
.site-footer,
footer.site-footer,
.e1e1-site-footer,
body > footer {
    position: relative;
    z-index: 20;
    isolation: isolate;
}

/* Önceki geçici çizimleri kapat. */
.e1e1-home-opening-stage,
.e1e1-home-visual-stage,
.e1e1-home-summit-symbol,
.e1e1-home-finale-atmosphere {
    background: transparent !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

.e1e1-home-stage-glow,
.e1e1-home-sign,
.e1e1-home-bag-mark,
.e1e1-home-opening-stage > p,
.e1e1-home-stage-label,
.e1e1-home-stage-people,
.e1e1-home-visual-stage > p,
.e1e1-home-summit-symbol,
.e1e1-home-finale-atmosphere {
    opacity: 0 !important;
    visibility: hidden !important;
}

/* Hero net; metnin altında okunabilir bir sol perde, sağda açık görüntü. */
.e1e1-home-hero {
    background: linear-gradient(
        90deg,
        rgba(252,248,241,.99) 0%,
        rgba(252,248,241,.96) 32%,
        rgba(252,248,241,.40) 48%,
        rgba(252,248,241,.06) 64%,
        rgba(252,248,241,0) 76%
    );
}

.e1e1-home-story {
    background: linear-gradient(
        90deg,
        rgba(255,255,255,.10) 0 42%,
        rgba(255,255,255,.88) 56%,
        rgba(255,255,255,.96) 100%
    );
}

/* Orta bölüm artık resmi neredeyse yok etmeyecek. */
.e1e1-home-process {
    background: rgba(247,239,226,.74);
    backdrop-filter: blur(.6px);
}

.e1e1-home-platform {
    background: linear-gradient(105deg, rgba(7,31,62,.96), rgba(14,67,91,.89));
}

.e1e1-home-finale {
    background: linear-gradient(
        180deg,
        rgba(250,242,225,0),
        rgba(247,229,190,.03) 56%,
        rgba(20,48,42,.10)
    );
}

.e1e1-home-opening-stage { min-height: 590px; }
.e1e1-home-visual-stage { min-height: 545px; }
.e1e1-home-finale-stage { padding-top: 360px; }

.e1e1-home-finale-copy {
    position: relative;
    z-index: 4;
    padding: 30px 34px 18px;
    border-radius: 28px;
    background: rgba(250,246,238,.66);
    box-shadow: 0 24px 60px rgba(14,36,31,.10);
    backdrop-filter: blur(3px);
}

@media (max-width: 850px) {
    .e1e1-home-hero {
        background: linear-gradient(
            180deg,
            rgba(252,248,241,.98) 0 39%,
            rgba(252,248,241,.38) 65%,
            rgba(252,248,241,0) 82%
        );
    }

    .e1e1-home-story { background: rgba(255,255,255,.84); }
    .e1e1-home-process { background: rgba(247,239,226,.78); }
}

@media (max-width: 620px) {
    .e1e1-home-finale-stage { padding-top: 300px; }

    .e1e1-home-finale-copy {
        padding: 24px 18px 14px;
        background: rgba(250,246,238,.76);
    }
}

@media (prefers-reduced-motion: reduce) {
    .e1e1-journey-canvas-image { transition: none !important; }
}