/*
 * ANA SAYFA TELEFON - AIRBNB DUZENI, "SECENEK 3" (5 Ekim 2026, sahibi secti).
 *
 * Yalnizca ana sayfada yuklenir (layouts/main.php), app.css'in USTUNE yazar.
 * O kurallar ayni kaldigi icin bu dosya kaldirilinca sayfa eski haline doner.
 *
 * Duzen: ustte fotograf (parsel isareti sade: pembe sinir + tek beyaz etiket),
 * altta fotografin ustune kayan beyaz sayfa; baslik, arama ve pembe dugme o
 * sayfada. Masaustune dokunmaz: her kural 859 px altinda.
 *
 * Kadraj yuksekligi: gorunen kat (--fold-h, app.js olcer) + ust bar payi
 * eksi beyaz sayfanin ihtiyaci (~372 px). Kisa telefonda fotograf kuculur,
 * baslik ve dugme her zaman ilk ekranda kalir.
 */
@media (max-width: 859px) {
    body.page-home-landing {
        --ab-rausch: #FF385C;
        --ab-grad: linear-gradient(90deg, #E61E4D 0%, #E31C5F 50%, #D70466 100%);
        --ab-ink: #222222;
        --ab-muted: #6A6A6A;
        --ab-line: #DDDDDD;
        --ab-kadraj: max(250px, calc(var(--fold-h, calc(100dvh - 70px)) + var(--hdr-h, 56px) - 372px));
        /* Baslik vurgusu pembe: harfler yine dalga gibi kalkiyor, renk
           kelime boyunca akiyor (app.css fxRenkAkis). */
        --fx-grad: linear-gradient(90deg, #E61E4D 0%, #FF385C 30%, #D70466 55%, #FF5A75 78%, #E61E4D 100%);
        background: #fff;
    }

    /* Alt sekme cubugu varken (body.tabli) kadraj biraz kisalir; baslik,
       arama ve dugme yine ilk ekranda kalir. 5 Ekim 2026: sahibi "beyaz kisim
       biraz asagi insin" dedi, 422 -> 390 (32 px asagi) ve sayfa ici iki
       bosluk sikilasti. */
    body.page-home-landing.tabli .hero h1 { margin-bottom: 4px; }
    body.page-home-landing.tabli .search-card { gap: 10px; padding-top: 14px; }
    body.page-home-landing.tabli {
        --ab-kadraj: max(250px, calc(var(--fold-h, calc(100dvh - 70px)) + var(--hdr-h, 56px) - 390px));
    }

    /* --- Kat: once fotograf, sonra beyaz sayfa --- */
    body.page-home-landing .home-fold { background: #fff; }
    body.page-home-landing .hero { display: flex; flex-direction: column; flex: 0 0 auto; }
    body.page-home-landing .hero-visual {
        order: 0; position: relative; left: auto; right: auto; top: auto; bottom: auto;
        height: var(--ab-kadraj); min-height: 0;
        margin-top: calc(-1 * var(--hdr-h, 56px));
        -webkit-mask-image: none; mask-image: none;
    }
    /* Ustte yalniz kisa bir koyu gecis: logo ve menu fotografta okunsun. */
    body.page-home-landing .hero-visual:before {
        height: calc(var(--hdr-h, 56px) + 56px);
        background: linear-gradient(180deg, rgba(0, 0, 0, .34) 0%, rgba(0, 0, 0, 0) 100%);
    }
    body.page-home-landing .hv-vig { background: linear-gradient(180deg, rgba(0,0,0,0) 70%, rgba(0,0,0,.14) 100%); }

    /* Beyaz sayfa: fotografin alt kenarina 24 px biner, kose yuvarlak. */
    body.page-home-landing .hero-copy {
        order: 1; z-index: 8; margin-top: -24px;
        padding: 24px 24px 0; background: #fff; color: var(--ab-ink);
        border-radius: 24px 24px 0 0;
        box-shadow: 0 -8px 20px rgba(0, 0, 0, .08);
    }
    body.page-home-landing .hero h1 {
        color: var(--ab-ink); text-shadow: none;
        font-size: clamp(1.86rem, 8.6vw, 2.2rem); line-height: 1.08; letter-spacing: -.035em;
        font-weight: 800; margin: 0 0 8px;
        --h1-wave: var(--ab-ink);
    }
    body.page-home-landing .hero h1 i { color: var(--ab-rausch); }
    /* Iki satirlik basliklar (2. ve 3. sahne) uc satirlik hucrenin ortasinda
       dursun; boslugun hepsi alta, alt yazinin ustune yigilmasin. */
    body.page-home-landing .hd-sahne { align-self: center; }
    body.page-home-landing .hero-copy .hero-sub {
        display: block; margin: 0; font-size: .94rem; font-weight: 500; letter-spacing: 0;
        text-transform: none; color: var(--ab-muted);
    }
    body.page-home-landing .hero-lead { display: none; }

    /* --- Parsel isareti: sade --- */
    body.page-home-landing .hv-card,
    body.page-home-landing .hv-chip,
    body.page-home-landing .hv-wires,
    body.page-home-landing .hv-dot,
    body.page-home-landing .hv-edge,
    body.page-home-landing .hv-scan,
    body.page-home-landing .hv-comet,
    body.page-home-landing .hero-visual .hv-script { display: none !important; }
    body.page-home-landing .hv-shape .hv-fill { fill: rgba(255, 56, 92, .30); }
    body.page-home-landing .hv-shape .hv-line { stroke: #FF385C; }
    body.page-home-landing .hv-shape .hv-line-base { stroke: rgba(255, 255, 255, .55); }
    body.page-home-landing .hv-vtx circle { fill: #fff; stroke: #FF385C; }

    /* Alan etiketi: Airbnb haritasindaki beyaz fiyat hapi, altinda kucuk ok. */
    body.page-home-landing .hv-area {
        padding: 7px 13px; gap: 0; border-radius: 999px; border: 0;
        background: #fff; color: var(--ab-ink);
        box-shadow: 0 2px 10px rgba(0, 0, 0, .28);
    }
    body.page-home-landing .hv-area:after {
        content: ""; position: absolute; left: 50%; bottom: -6px; width: 12px; height: 7px;
        transform: translateX(-50%); background: #fff;
        clip-path: polygon(0 0, 100% 0, 50% 100%);
    }
    body.page-home-landing .hv-area .pin { display: none; }
    body.page-home-landing .hv-s { display: flex; align-items: baseline; gap: 6px; }
    body.page-home-landing .hv-s b { font-size: .84rem; font-weight: 800; color: var(--ab-ink); }
    body.page-home-landing .hv-s i { font-size: .8rem; font-weight: 500; color: var(--ab-muted); }
    body.page-home-landing .hv-s2 b { color: var(--ab-ink); }

    /* Konum hapi: fotografin sol altinda, beyaz sayfanin hemen ustunde. */
    body.page-home-landing .hv-loc {
        display: inline-flex; top: auto; left: 16px; bottom: 40px; z-index: 9;
        gap: 6px; padding: 7px 12px 7px 10px; border-radius: 999px;
        background: #fff; color: var(--ab-ink); text-shadow: none;
        box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
    }
    body.page-home-landing .hv-loc > svg { width: 13px; height: 13px; color: var(--ab-ink); }
    body.page-home-landing .hv-loc span { display: flex; align-items: baseline; gap: 5px; padding: 0; border: 0; }
    body.page-home-landing .hv-loc b { font-size: .76rem; font-weight: 700; }
    body.page-home-landing .hv-loc small { font-size: .72rem; font-weight: 500; color: var(--ab-muted); opacity: 1; }
    body.page-home-landing .hv-loc small:before { content: "· "; }

    /* --- Arama: beyaz sayfanin devami, kart cercevesi yok --- */
    body.page-home-landing .search-card {
        margin: 0; padding: 16px 24px 0; gap: 12px;
        background: #fff; border-radius: 0; box-shadow: none; z-index: 8;
    }
    body.page-home-landing .search-bar {
        height: 58px; padding: 0 8px 0 18px; gap: 12px;
        background: #fff; border: 1px solid var(--ab-line); border-radius: 999px;
        box-shadow: 0 3px 12px rgba(0, 0, 0, .08);
    }
    body.page-home-landing .search-bar:hover,
    body.page-home-landing .search-bar:focus-visible { border-color: var(--ab-line); box-shadow: 0 4px 16px rgba(0, 0, 0, .14); }
    body.page-home-landing .search-ico { flex: 0 0 22px; width: 22px; height: 22px; background: none; color: var(--ab-ink); }
    body.page-home-landing .search-ico svg { width: 21px; height: 21px; }
    body.page-home-landing .search-body {
        display: grid; gap: 1px; height: auto; padding: 0; background: none; border: 0; border-radius: 0;
    }
    body.page-home-landing .search-body strong { display: block; font-size: .9rem; font-weight: 700; color: var(--ab-ink); }
    body.page-home-landing .search-body small { font-size: .76rem; font-weight: 400; color: var(--ab-muted); letter-spacing: 0; }
    body.page-home-landing .search-body small .st-ek { display: none; }
    body.page-home-landing .search-tools { gap: 6px; }
    body.page-home-landing .search-tool {
        flex: 0 0 38px; width: 38px; height: 38px;
        background: #fff; border: 1px solid var(--ab-line); color: var(--ab-ink);
    }
    body.page-home-landing .search-tool svg { width: 18px; height: 18px; }

    body.page-home-landing .search-card .home-go {
        height: 54px; border-radius: 12px; padding: 0 16px; gap: 10px;
        font-size: 1.06rem; font-weight: 700; letter-spacing: -.01em; text-transform: none;
        background: var(--ab-grad); background-image: var(--ab-grad);
    }
    body.page-home-landing .search-card .home-go:hover { filter: brightness(1.04); }
    body.page-home-landing .search-card .home-go b { font-weight: 700; }
    body.page-home-landing .search-card .home-go span { word-spacing: normal; }
    body.page-home-landing .search-card .home-go .go-find svg { width: 22px; height: 22px; }
    body.page-home-landing .search-card .home-go .go-find .ok { fill: #E31C5F; }
    body.page-home-landing .search-card .search-alt,
    body.page-home-landing .search-card .search-alt a { color: var(--ab-ink); font-size: .82rem; }
    body.page-home-landing .search-card .search-alt a svg { color: var(--ab-ink); }
    body.page-home-landing .search-card .search-alt a b { color: var(--ab-ink); text-decoration: underline; font-weight: 700; }
}

/* Cok kisa ekran (iPhone SE): baslik bir tik kuculur. */
@media (max-width: 859px) and (max-height: 700px) {
    body.page-home-landing .hero h1 { font-size: 1.7rem; }
    body.page-home-landing .search-card { margin-top: 0; }
    /* Baslik kuculunce beyaz sayfa ayni boyda kaliyordu: "haritadan
       secebilirim" ile alt cubuk arasinda ~45 px bos bant. Sayfa da o kadar
       kisalir, fotograf buyur (sahibi istedi, 5 Ekim 2026). */
    body.page-home-landing.tabli {
        --ab-kadraj: max(250px, calc(var(--fold-h, calc(100dvh - 70px)) + var(--hdr-h, 56px) - 366px));
    }
}