/* =====================================================================
   Varsayılan Tema — Site Stili
   Renkler /tema.css içinden CSS değişkeni olarak gelir (F008)
   ===================================================================== */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
    margin: 0;
    font-family: var(--font-body, system-ui), sans-serif;
    font-size: var(--font-size-base, 16px);
    line-height: 1.6;
    color: var(--c-text, #0F172A);
    background: var(--c-background, #fff);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
    font-family: var(--font-heading, system-ui), sans-serif;
    line-height: 1.2;
    margin: 0 0 .6em;
    font-weight: 700;
}
h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
h2 { font-size: clamp(1.4rem, 3vw, 1.9rem); }
h3 { font-size: 1.2rem; }

p { margin: 0 0 1em; }

a { color: var(--c-primary, #0F766E); text-decoration: none; }
a:hover { text-decoration: underline; }

img { max-width: 100%; height: auto; display: block; }

.kap { width: 100%; max-width: var(--container, 1280px); margin-inline: auto; padding-inline: 1.25rem; }

.atla { position: absolute; left: -9999px; }
.atla:focus { left: 0; top: 0; z-index: 999; background: var(--c-primary); color: #fff; padding: .7rem 1.2rem; }

.gizli {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

/* ---------- Header ---------- */

.ustbar {
    background: var(--c-background, #fff);
    border-bottom: 1px solid var(--c-border, #E2E8F0);
    z-index: 50;
}
.ustbar.sabit { position: sticky; top: 0; }

.ustbar-ic { display: flex; align-items: center; gap: 1.25rem; min-height: 68px; }

.marka { display: flex; align-items: center; color: var(--c-text); font-size: 1.1rem; }
.marka:hover { text-decoration: none; }

.ana-menu { display: flex; gap: 1.25rem; margin-inline-start: auto; }
.ana-menu a { color: var(--c-text); font-weight: 500; font-size: .95rem; }
.ana-menu a:hover { color: var(--c-primary); text-decoration: none; }

.ustbar-sag { display: flex; align-items: center; gap: .6rem; }

.ikon-dugme {
    position: relative; display: grid; place-items: center;
    width: 38px; height: 38px; border-radius: 50%;
    border: 1px solid var(--c-border); background: none; color: var(--c-text); cursor: pointer;
}
.ikon-dugme .sayac {
    position: absolute; top: -2px; inset-inline-end: -2px;
    min-width: 17px; height: 17px; padding: 0 4px;
    background: var(--c-accent, #F59E0B); color: #fff;
    border-radius: 9px; font-size: 10px; font-weight: 700;
    display: grid; place-items: center;
}

.tel-dugme {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .45rem .9rem; border-radius: 999px;
    background: var(--c-primary); color: #fff; font-weight: 600; font-size: .9rem;
}
.tel-dugme:hover { text-decoration: none; filter: brightness(1.08); }

.secici { position: relative; }
.secici-dugme {
    display: flex; align-items: center; gap: .3rem;
    padding: .4rem .7rem; border: 1px solid var(--c-border); border-radius: var(--radius, 10px);
    background: none; color: var(--c-text); font: inherit; font-size: .85rem; cursor: pointer;
}
.secici-liste {
    display: none; position: absolute; inset-inline-end: 0; top: calc(100% + 6px);
    min-width: 165px; background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius); box-shadow: var(--shadow); padding: .3rem; z-index: 60;
}
.secici.acik .secici-liste { display: block; }
.secici-liste a { display: block; padding: .45rem .65rem; border-radius: 6px; color: var(--c-text); font-size: .875rem; }
.secici-liste a:hover { background: var(--c-surface); text-decoration: none; }

.mobil-menu-dugme { display: none; flex-direction: column; gap: 4px; background: none; border: 0; padding: .5rem; cursor: pointer; }
.mobil-menu-dugme span { width: 22px; height: 2px; background: var(--c-text); border-radius: 2px; }

/* ---------- Hero ---------- */

.hero { position: relative; min-height: 480px; display: grid; place-items: center; text-align: center; color: #fff; overflow: hidden; }
.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(15,23,42,.35), rgba(15,23,42,.65)); }
.hero-gorsel { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-ic { position: relative; z-index: 2; padding: 4rem 1.25rem; max-width: 780px; }
.hero h1 { color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.35); }
.hero p { font-size: 1.1rem; opacity: .95; }

/* ---------- Arama kutusu ---------- */

.arama-kutusu {
    background: var(--c-background, #fff);
    border: 1px solid var(--c-border, #e2e8f0);
    border-radius: 18px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
    padding: 1rem 1.25rem;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr auto;
    gap: 1rem;
    align-items: end;
}
.arama-kutusu label { display: block; font-size: .78rem; font-weight: 600; color: var(--c-muted, #64748b); margin-bottom: .3rem; }
.arama-kutusu input, .arama-kutusu select {
    width: 100%; padding: .72rem .85rem; font: inherit; font-size: .92rem;
    border: 1px solid var(--c-border, #e2e8f0); border-radius: 12px;
    background: var(--c-background, #fff); color: var(--c-text, #0f172a);
    transition: border-color .15s, box-shadow .15s;
}
.arama-kutusu input:focus, .arama-kutusu select:focus {
    outline: none; border-color: var(--c-primary, #0f766e);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-primary) 18%, transparent);
}
.arama-kutusu .dugme.birincil { min-height: 46px; padding-inline: 1.6rem; }
.arama-alan { position: relative; }
.oneri-liste {
    position: absolute; top: calc(100% + 4px); inset-inline: 0; z-index: 20;
    background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius); box-shadow: var(--shadow); max-height: 300px; overflow-y: auto;
}
.oneri-liste button {
    display: block; width: 100%; padding: .55rem .8rem; border: 0; background: none;
    text-align: start; font: inherit; cursor: pointer; color: var(--c-text);
}
.oneri-liste button:hover { background: var(--c-surface); }

/* ---------- Düğmeler ---------- */

.dugme {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    padding: .65rem 1.3rem; border: 1px solid transparent; border-radius: var(--radius, 10px);
    font: inherit; font-weight: 600; cursor: pointer; white-space: nowrap;
    background: var(--c-surface); color: var(--c-text); border-color: var(--c-border);
}
.dugme:hover { text-decoration: none; filter: brightness(.97); }
.dugme.birincil { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.dugme.birincil:hover { filter: brightness(1.08); }
.dugme.vurgu { background: var(--c-accent); color: #fff; border-color: var(--c-accent); }
.dugme.hayalet { background: none; border-color: currentColor; }
.dugme.genis { width: 100%; }

/* ---------- Villa kartı ---------- */

.villa-izgara {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1.5rem;
}

/* Anasayfa vitrin/otomatik satırlar: az kayıt varken sola yaslı kalmasın,
   sabit genişlikli kartlarla ortalansın (blog ızgarasıyla aynı davranış). */
.bolum-vitrin .villa-izgara {
    grid-template-columns: repeat(auto-fit, minmax(280px, 340px));
    justify-content: center;
}

.villa-kart {
    background: var(--c-background);
    border: 1px solid var(--c-border);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow);
    transition: transform .2s, box-shadow .2s;
    display: flex; flex-direction: column;
}
.villa-kart:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(15,23,42,.14); }

.villa-kart-gorsel { position: relative; aspect-ratio: 4 / 3; background: var(--c-surface); overflow: hidden; }
.villa-kart-gorsel img { width: 100%; height: 100%; object-fit: cover; }

.villa-rozet {
    position: absolute; top: .7rem; inset-inline-start: .7rem;
    padding: .25rem .6rem; border-radius: 999px;
    background: var(--c-accent); color: #fff; font-size: .74rem; font-weight: 700;
}
.villa-favori {
    position: absolute; top: .7rem; inset-inline-end: .7rem;
    width: 34px; height: 34px; border-radius: 50%; border: 0;
    background: rgba(255,255,255,.9); display: grid; place-items: center; cursor: pointer;
}
.villa-favori.aktif { color: #E11D48; }

.villa-kart-govde { padding: .9rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .4rem; flex: 1; }
.villa-kart-govde h3 { margin: 0; font-size: 1.02rem; }
.villa-kart-govde h3 a { color: var(--c-text); }
.villa-konum { font-size: .85rem; color: var(--c-muted); }

.villa-ozet { display: flex; gap: .9rem; font-size: .82rem; color: var(--c-muted); flex-wrap: wrap; }

.villa-puan { display: flex; align-items: center; gap: .3rem; font-size: .85rem; }
.villa-puan strong { color: var(--c-text); }

.villa-fiyat { margin-top: auto; padding-top: .6rem; border-top: 1px solid var(--c-border); display: flex; align-items: baseline; gap: .45rem; flex-wrap: wrap; }
.villa-fiyat .tutar { font-size: 1.15rem; font-weight: 700; color: var(--c-primary); }
.villa-fiyat .eski { text-decoration: line-through; color: var(--c-muted); font-size: .85rem; }
.villa-fiyat .birim { font-size: .8rem; color: var(--c-muted); }

/* Kart stilleri (tema ayarı) */
.tema-kart-minimal .villa-kart { border: 0; box-shadow: none; }
.tema-kart-minimal .villa-kart-govde { padding-inline: 0; }
.tema-kart-wide-image .villa-kart-gorsel { aspect-ratio: 16 / 9; }
.tema-kart-list .villa-izgara { grid-template-columns: 1fr; gap: 1rem; }
.tema-kart-list .villa-kart { flex-direction: row; }
.tema-kart-list .villa-kart-gorsel { width: 300px; flex-shrink: 0; aspect-ratio: 4 / 3; }
.tema-kart-list .villa-kart-govde { flex: 1; }
.tema-kart-list .villa-fiyat { justify-content: flex-start; }
@media (max-width: 640px) {
    .tema-kart-list .villa-kart { flex-direction: column; }
    .tema-kart-list .villa-kart-gorsel { width: 100%; aspect-ratio: 16 / 10; }
}

/* ---------- Bölüm ---------- */

.bolum { padding: 3.5rem 0; }
.bolum-baslik { text-align: center; margin-bottom: 2rem; }
.bolum-baslik p { color: var(--c-muted); max-width: 620px; margin-inline: auto; }

/* ---------- Filtreler ---------- */

.arama-duzen { display: grid; grid-template-columns: 280px 1fr; gap: 2rem; align-items: start; }
.filtre-panel {
    background: var(--c-surface); border: 1px solid var(--c-border);
    border-radius: var(--radius); padding: 1.1rem; position: sticky; top: 84px;
}
.filtre-grup { padding-block: .9rem; border-bottom: 1px solid var(--c-border); }
.filtre-grup:last-child { border-bottom: 0; }
.filtre-grup h4 { margin: 0 0 .6rem; font-size: .9rem; }
.filtre-secenek { display: flex; align-items: center; gap: .5rem; padding: .18rem 0; font-size: .88rem; }

/* ---------- Galeri ---------- */

.galeri { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: .5rem; border-radius: var(--radius); overflow: hidden; }
.galeri img { width: 100%; height: 100%; object-fit: cover; cursor: pointer; aspect-ratio: 4/3; }
.galeri img:first-child { grid-row: span 2; aspect-ratio: 1; }

/* ---------- Villa detay ---------- */

.detay-duzen { display: grid; grid-template-columns: 1fr 380px; gap: 2.5rem; align-items: start; }
.rezervasyon-kutu {
    background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius); box-shadow: var(--shadow);
    padding: 1.25rem; position: sticky; top: 84px;
}
.fiyat-satir { display: flex; justify-content: space-between; padding: .35rem 0; font-size: .92rem; }
.fiyat-satir.toplam { border-top: 1px solid var(--c-border); margin-top: .5rem; padding-top: .7rem; font-weight: 700; font-size: 1.05rem; }

.ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .6rem; }
.ozellik { display: flex; align-items: center; gap: .5rem; font-size: .9rem; }

.mesafe-tablo { width: 100%; border-collapse: collapse; font-size: .9rem; }
.mesafe-tablo td { padding: .45rem 0; border-bottom: 1px solid var(--c-border); }
.mesafe-tablo td:last-child { text-align: end; color: var(--c-muted); }

/* ---------- Sosyal kanıt (F065) ---------- */

.sosyal-kanit {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .35rem .75rem; border-radius: 999px;
    background: color-mix(in srgb, var(--c-accent) 14%, transparent);
    color: #92400E; font-size: .82rem; font-weight: 600;
}
.sosyal-kanit .nokta { width: 7px; height: 7px; border-radius: 50%; background: #16A34A; animation: nabiz 2s infinite; }
@keyframes nabiz { 0%,100% { opacity: 1; } 50% { opacity: .35; } }

/* ---------- Yorumlar ---------- */

.puan-ozet { display: grid; grid-template-columns: 160px 1fr; gap: 2rem; align-items: center; }
.puan-buyuk { font-size: 3rem; font-weight: 800; line-height: 1; color: var(--c-primary); }
.puan-cubuk { display: grid; grid-template-columns: 40px 1fr 44px; gap: .6rem; align-items: center; font-size: .82rem; margin-bottom: .3rem; }
.puan-cubuk .dolgu { height: 7px; background: var(--c-border); border-radius: 4px; overflow: hidden; }
.puan-cubuk .dolgu span { display: block; height: 100%; background: var(--c-accent); }

.yorum { padding: 1.1rem 0; border-bottom: 1px solid var(--c-border); }
.yorum-ust { display: flex; align-items: center; gap: .7rem; margin-bottom: .5rem; }
.yorum-avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--c-surface); display: grid; place-items: center; font-weight: 700; }
.yorum-cevap { margin-top: .8rem; padding: .8rem 1rem; background: var(--c-surface); border-radius: var(--radius); font-size: .9rem; }

/* ---------- WhatsApp (F058) ---------- */

.wa-yuzen { position: fixed; inset-block-end: 1.25rem; inset-inline-end: 1.25rem; z-index: 80; }
.wa-dugme {
    width: 56px; height: 56px; border-radius: 50%; border: 0;
    background: #25D366; color: #fff; display: grid; place-items: center;
    box-shadow: 0 6px 20px rgba(37,211,102,.4); cursor: pointer;
}
.wa-liste {
    display: none; position: absolute; inset-block-end: 68px; inset-inline-end: 0;
    width: 280px; background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden;
}
.wa-yuzen.acik .wa-liste { display: block; }
.wa-temsilci { display: flex; align-items: center; gap: .7rem; padding: .7rem .9rem; border-bottom: 1px solid var(--c-border); color: var(--c-text); }
.wa-temsilci:hover { background: var(--c-surface); text-decoration: none; }
.wa-temsilci img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.wa-temsilci small { color: var(--c-muted); display: block; font-size: .78rem; }
.wa-basit { text-decoration: none; }
.wa-basit .wa-dugme { transition: transform .18s, box-shadow .18s; }
.wa-basit:hover .wa-dugme { transform: scale(1.06); box-shadow: 0 8px 26px rgba(37,211,102,.55); }

/* ---------- Popup (F051) ---------- */

.popup-perde {
    position: fixed; inset: 0; background: rgba(15,23,42,.62);
    backdrop-filter: blur(3px);
    display: grid; place-items: center; z-index: 1000; padding: 1.25rem;
    animation: popup-fade .25s ease;
}
/* KRİTİK: hidden özniteliği display:grid'i ezmesin — açma/kapama bu kurala bağlı */
.popup-perde[hidden] { display: none; }
@keyframes popup-fade { from { opacity: 0; } to { opacity: 1; } }

.popup-kutu {
    background: var(--c-background); color: var(--c-text);
    border-radius: 18px; max-width: 440px; width: 100%;
    overflow: hidden; position: relative;
    box-shadow: 0 30px 70px rgba(0,0,0,.35);
    animation: popup-in .3s cubic-bezier(.16,1,.3,1);
}
@keyframes popup-in { from { transform: translateY(16px) scale(.97); opacity: 0; } to { transform: none; opacity: 1; } }

.popup-kapat {
    position: absolute; top: .75rem; inset-inline-end: .75rem; z-index: 3;
    width: 34px; height: 34px; border-radius: 50%; border: 0;
    background: rgba(15,23,42,.55); color: #fff; cursor: pointer;
    font-size: 1.25rem; line-height: 1; display: grid; place-items: center;
    transition: background .15s, transform .15s;
}
.popup-kapat:hover { background: rgba(15,23,42,.8); transform: rotate(90deg); }

.popup-gorsel { width: 100%; display: block; max-height: 220px; object-fit: cover; }
.popup-govde { padding: 1.75rem 1.5rem; text-align: center; }
.popup-baslik { margin: 0 0 .6rem; font-size: 1.3rem; }
.popup-metin { margin: 0 0 1.25rem; color: var(--c-muted); line-height: 1.6; }
.popup-metin :last-child { margin-bottom: 0; }
.popup-govde .dugme { width: 100%; }
.popup-bulten { display: flex; flex-direction: column; gap: .6rem; margin-top: 1rem; }
.popup-bulten input[type="email"] {
    width: 100%; padding: .7rem .9rem; font: inherit;
    border: 1px solid var(--c-border); border-radius: 10px;
    background: var(--c-background); color: var(--c-text); text-align: center;
}
.popup-bulten input[type="email"]:focus { outline: none; border-color: var(--c-primary); }

/* Köşe / üst-bar / slide-in varyantları için konum */
.popup-kose { place-items: end; padding: 1.5rem; }
.popup-kose .popup-kutu { max-width: 340px; }
.popup-ust-bar { place-items: start stretch; padding: 0; background: transparent; backdrop-filter: none; }
.popup-ust-bar .popup-kutu { max-width: 100%; border-radius: 0; }

.ust-bar-bildirim { background: var(--c-primary); color: #fff; padding: .6rem 1.25rem; text-align: center; font-size: .9rem; position: relative; }

/* ---------- Harita (F048) ---------- */

/* Modern düzen: liste SOLDA (dar, kayan) · harita SAĞDA (geniş, sabit) */
.harita-duzen { display: grid; grid-template-columns: minmax(360px, 460px) 1fr; height: calc(100vh - 132px); }
/* position:relative ZORUNLU — karolar/pinler absolute; yoksa harita sola kayar */
#harita { position: relative; overflow: hidden; width: 100%; height: 100%; background: var(--c-surface); }
#harita img { max-width: none; }
.harita-liste { order: -1; overflow-y: auto; padding: 1rem 1.1rem; border-inline-end: 1px solid var(--c-border); }
.harita-liste .villa-izgara { grid-template-columns: 1fr; gap: 1rem; }
.harita-liste .sonuc-sayac { font-size: .95rem; margin: .25rem 0 1rem; }
.harita-pin {
    background: var(--c-background); border: 2px solid var(--c-primary);
    border-radius: 999px; padding: .2rem .55rem; font-size: .78rem; font-weight: 700;
    color: var(--c-primary); white-space: nowrap; box-shadow: var(--shadow);
}
.harita-pin.aktif { background: var(--c-primary); color: #fff; }

/* ---------- Karşılaştırma (F049) ---------- */

.karsilastirma { width: 100%; border-collapse: collapse; font-size: .9rem; }
.karsilastirma th, .karsilastirma td { padding: .7rem; border: 1px solid var(--c-border); text-align: center; }
.karsilastirma th:first-child, .karsilastirma td:first-child { text-align: start; background: var(--c-surface); font-weight: 600; }
.karsilastirma tr.farkli { background: color-mix(in srgb, var(--c-accent) 8%, transparent); }
.karsilastirma .var { color: var(--c-success, #16A34A); font-weight: 700; }
.karsilastirma .yok { color: var(--c-muted); }

/* ---------- Footer ---------- */

.altbar { background: var(--c-surface); border-top: 1px solid var(--c-border); padding: 3rem 0 1.5rem; margin-top: 4rem; }

.bulten {
    display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
    padding: 1.5rem; background: var(--c-primary); color: #fff;
    border-radius: var(--radius); margin-bottom: 2.5rem;
}
.bulten h3 { color: #fff; margin: 0 0 .25rem; }
.bulten p { margin: 0; opacity: .9; font-size: .92rem; }
.bulten-form { display: flex; gap: .5rem; flex: 1; min-width: 280px; max-width: 440px; }
.bulten-form input { flex: 1; padding: .65rem .9rem; border: 0; border-radius: var(--radius); font: inherit; }
.bulten-form .dugme { background: var(--c-accent); color: #fff; border-color: var(--c-accent); }

.altbar-sutunlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 2rem; }
.altbar-sutun h4 { font-size: .95rem; margin-bottom: .8rem; }
.altbar-sutun ul { list-style: none; margin: 0; padding: 0; }
.altbar-sutun li { margin-bottom: .4rem; }
.altbar-sutun a, .altbar-sutun p { color: var(--c-muted); font-size: .9rem; }

.sosyal { display: flex; gap: .6rem; margin-top: 2rem; }
.sosyal a { width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--c-border); display: grid; place-items: center; color: var(--c-muted); }
.sosyal a:hover { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }

.altbar-son { margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--c-border); color: var(--c-muted); font-size: .85rem; }

/* ---------- Duyarlı ---------- */

@media (max-width: 1024px) {
    .arama-duzen, .detay-duzen { grid-template-columns: 1fr; }
    .filtre-panel, .rezervasyon-kutu { position: static; }
    .arama-kutusu { grid-template-columns: 1fr 1fr; }
    .harita-duzen { grid-template-columns: 1fr; height: auto; }
    #harita { height: 55vh; }
}

@media (max-width: 768px) {
    .ana-menu {
        display: none; position: absolute; top: 100%; inset-inline: 0;
        flex-direction: column; gap: 0; background: var(--c-background);
        border-bottom: 1px solid var(--c-border); padding: .5rem 1.25rem 1rem;
    }
    .ana-menu.acik { display: flex; }
    .ana-menu a { padding: .7rem 0; border-bottom: 1px solid var(--c-border); }
    .mobil-menu-dugme { display: flex; }
    .tel-dugme span:last-child { display: none; }
    .arama-kutusu { grid-template-columns: 1fr; }
    .galeri { grid-template-columns: 1fr 1fr; }
    .galeri img:first-child { grid-row: auto; aspect-ratio: 4/3; }
    .tema-kart-list .villa-kart { flex-direction: column; }
    .tema-kart-list .villa-kart-gorsel { width: 100%; }
    .puan-ozet { grid-template-columns: 1fr; text-align: center; }
    .bolum { padding: 2.25rem 0; }
}

@media print {
    .ustbar, .altbar, .wa-yuzen, .popup-perde, .dugme, .filtre-panel { display: none !important; }
    body { background: #fff; font-size: 11pt; }
}

/* =====================================================================
   Sayfa şablonları — anasayfa, villa detayı, bölge, koleksiyon,
   fırsatlar, rezervasyon akışı ve ödeme sayfaları.
   (Bu blok sonradan eklendi; üstteki temel stiller değiştirilmedi.)
   ===================================================================== */

/* ---------- Ortak yardımcılar ---------- */

.dar-kap { max-width: 820px; }

.ikon { display: inline-block; width: 1em; height: 1em; flex-shrink: 0; }

.bolum-eylem { margin-top: 1.5rem; display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; }
.hero-eylem { margin-top: 1.5rem; display: flex; gap: .6rem; flex-wrap: wrap; justify-content: center; }

.hizli-secim { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; justify-content: center; }
.hizli-secim .dugme { padding: .45rem 1rem; font-size: .85rem; border-radius: 999px; }

.kart-kutu {
    background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1.5rem;
}
.kart-kutu h2 { font-size: 1.15rem; }
.kart-kutu h3 { font-size: 1rem; }

.metin-icerik { line-height: 1.75; }
.metin-icerik img { border-radius: var(--radius); margin-block: 1rem; }
.metin-icerik ul, .metin-icerik ol { padding-inline-start: 1.25rem; }

.yol-izi { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .85rem; color: var(--c-muted); margin-bottom: 1.25rem; }
.yol-izi a { color: var(--c-muted); }
.yol-izi a:hover { color: var(--c-primary); }
.yol-izi .pasif { opacity: .55; }

.uyari {
    background: color-mix(in srgb, var(--c-warning, #F59E0B) 12%, transparent);
    border-inline-start: 3px solid var(--c-warning, #F59E0B);
    padding: .6rem .9rem; border-radius: 6px; font-size: .88rem; margin-block: .6rem;
}
.uyari-liste { margin: .5rem 0 0; padding-inline-start: 1.2rem; font-size: .9rem; }

.bos-sonuc { text-align: center; padding: 3rem 1.25rem; border: 1px dashed var(--c-border); border-radius: var(--radius); }
.bos-sonuc h2, .bos-sonuc h3 { margin-bottom: .5rem; }
.bos-sonuc p { color: var(--c-muted); }

.sonuc-ust { display: flex; flex-wrap: wrap; gap: .6rem 1.2rem; align-items: baseline; margin-bottom: 1.25rem; }
.sonuc-sayac { margin: 0; }
.sonuc-not { margin: 0; font-size: .85rem; color: var(--c-muted); }

.sayfalama { margin-top: 2rem; }
.sayfalama ul { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: 0; padding: 0; justify-content: center; }
.sayfalama a, .sayfalama span {
    display: block; min-width: 38px; text-align: center;
    padding: .45rem .7rem; border: 1px solid var(--c-border);
    border-radius: var(--radius); font-size: .88rem; color: var(--c-text);
}
.sayfalama a:hover { background: var(--c-surface); text-decoration: none; }
.sayfalama .aktif { background: var(--c-primary); border-color: var(--c-primary); color: #fff; font-weight: 700; }
.sayfalama .pasif { opacity: .45; }

.etiket-bulutu { display: flex; flex-wrap: wrap; gap: .45rem; margin-block: 1rem; }
.etiket {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .3rem .75rem; border: 1px solid var(--c-border); border-radius: 999px;
    font-size: .85rem; color: var(--c-text); background: var(--c-surface);
}
.etiket:hover, .etiket.aktif { background: var(--c-primary); border-color: var(--c-primary); color: #fff; text-decoration: none; }
.etiket .sayac { font-size: .74rem; opacity: .7; }

.kapak-yok, .bolge-kapak-yok {
    display: block; width: 100%; aspect-ratio: 4 / 3;
    background: linear-gradient(135deg, var(--c-surface), var(--c-border));
}

.yukleniyor { opacity: .55; pointer-events: none; transition: opacity .15s; }

/* ---------- Anasayfa: bölgeler ---------- */

.bolge-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 280px)); gap: 1.25rem; justify-content: center; }
.bolge-kart {
    position: relative; display: block; overflow: hidden;
    border-radius: var(--radius); box-shadow: var(--shadow); color: var(--c-text);
    transition: transform .2s;
}
.bolge-kart:hover { text-decoration: none; transform: translateY(-3px); }
.bolge-kart img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.bolge-kart-govde {
    position: absolute; inset-inline: 0; inset-block-end: 0;
    padding: 1.5rem .9rem .8rem; color: #fff;
    background: linear-gradient(180deg, transparent, rgba(15,23,42,.78));
}
.bolge-kart-govde strong { display: block; font-size: 1.02rem; }
.bolge-kart-govde small { font-size: .8rem; opacity: .9; }

/* ---------- Anasayfa: neden biz ---------- */

.nedenbiz-kart {
    background: var(--c-surface); border: 1px solid var(--c-border);
    border-radius: var(--radius); padding: 1.1rem;
}
.nedenbiz-kart h3 { font-size: 1rem; margin-bottom: .35rem; }
.nedenbiz-kart p { margin: 0; font-size: .9rem; color: var(--c-muted); }
.bolum-nedenbiz .ozellik-izgara { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

/* ---------- Anasayfa: yorumlar ---------- */

.yorum-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1.5rem; }
.yorum-kart {
    border: 1px solid var(--c-border); border-radius: var(--radius);
    padding: 1.1rem 1.2rem; background: var(--c-background);
}
.yorum-kart h3 { font-size: 1rem; }
.yorum-kart p { font-size: .92rem; }

/* ---------- Blog kartları (anasayfa + blog listesi) ---------- */

.yazi-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 360px)); gap: 1.5rem; justify-content: center; }
.yazi-kart {
    display: flex; flex-direction: column; overflow: hidden;
    border: 1px solid var(--c-border); border-radius: var(--radius);
    background: var(--c-background); box-shadow: var(--shadow);
}
.yazi-kapak { display: block; background: var(--c-surface); }
.yazi-kapak img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.yazi-govde { padding: .9rem 1rem 1.1rem; display: flex; flex-direction: column; gap: .45rem; flex: 1; }
.yazi-govde h2, .yazi-govde h3 { margin: 0; font-size: 1.05rem; }
.yazi-govde h2 a, .yazi-govde h3 a { color: var(--c-text); }
.yazi-kategori { font-size: .76rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.yazi-meta { margin-top: auto; padding-top: .6rem; border-top: 1px solid var(--c-border); display: flex; gap: .8rem; font-size: .8rem; color: var(--c-muted); }

/* ---------- Anasayfa: hakkımızda ve çağrı bandı ---------- */

.hakkimizda-duzen { display: grid; grid-template-columns: 1fr 1fr; gap: 2.5rem; align-items: center; }
.hakkimizda-gorsel img { border-radius: var(--radius); width: 100%; object-fit: cover; }

.cta-bant {
    display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
    padding: 2rem; border-radius: var(--radius);
    background: var(--c-primary); color: #fff;
}
.cta-bant h2 { color: #fff; margin-bottom: .35rem; }
.cta-bant p { margin: 0; opacity: .92; }
.cta-eylem { display: flex; gap: .6rem; flex-wrap: wrap; }
/* Arka plan görselli CTA */
.cta-bant.cta-gorselli {
    position: relative; overflow: hidden; background: #0f172a;
    background-image: var(--cta-gorsel); background-size: cover; background-position: center;
    padding: 3rem 2.5rem;
}
.cta-bant.cta-gorselli .cta-perde { position: absolute; inset: 0; background: linear-gradient(100deg, rgba(15,23,42,.8), rgba(15,23,42,.35)); }
.cta-bant.cta-gorselli > *:not(.cta-perde) { position: relative; z-index: 2; }

.paylas-alan { margin-block: 2rem; }
.paylas-kutu { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-block: 1.5rem; }
.paylas-etiket { font-size: .85rem; font-weight: 600; color: var(--c-muted); }
.dugme.kucuk { padding: .4rem .8rem; font-size: .82rem; }
.dugme.sade { background: var(--c-surface); }

/* ---------- Villa detayı ---------- */

.detay-baslik { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-block: 1.5rem 1rem; }
.detay-baslik h1 { margin-bottom: .35rem; }
.detay-ozet { list-style: none; margin: 0 0 1.25rem; padding: 0; gap: 1.1rem; font-size: .9rem; }
.galeri-not { font-size: .82rem; color: var(--c-muted); margin-top: .5rem; }

.detay-blok { padding-block: 2rem; border-top: 1px solid var(--c-border); }
.detay-blok h2 { font-size: 1.3rem; }
.detay-blok h3 { font-size: 1rem; margin-block: 1.2rem .6rem; }

.sosyal-kanit-satir { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.5rem; }
.sosyal-kanit[hidden] { display: none; }

.ozellik small { display: block; color: var(--c-muted); font-size: .8rem; }
.kriter-izgara .ozellik { justify-content: space-between; padding: .4rem .6rem; background: var(--c-surface); border-radius: 6px; }

.oda-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.1rem; }
.oda-kart {
    border: 1px solid var(--c-border); border-radius: 16px; padding: 1.25rem 1.35rem;
    background: var(--c-surface); transition: box-shadow .2s, transform .2s;
}
.oda-kart:hover { box-shadow: 0 10px 26px rgba(15, 23, 42, .09); transform: translateY(-2px); }
.oda-kart h3 { margin: 0 0 .15rem; font-size: 1.1rem; }
.oda-kart > .villa-konum { font-size: .82rem; color: var(--c-muted); margin: 0 0 1rem; }
.yatak-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.yatak-liste li { display: flex; align-items: center; gap: .65rem; font-size: .9rem; padding: 0; border: 0; }
.yatak-adet {
    flex: 0 0 auto; display: grid; place-items: center;
    min-width: 30px; height: 30px; padding: 0 .3rem; border-radius: 9px;
    background: color-mix(in srgb, var(--c-primary) 12%, transparent);
    color: var(--c-primary); font-weight: 700; font-size: .9rem;
    font-variant-numeric: tabular-nums;
}
.yatak-ad { line-height: 1.25; }
.yatak-liste small { display: block; color: var(--c-muted); font-size: .78rem; }

/* Bilgilendirme — ikon kartları */
.bilgi-kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.bilgi-kart {
    display: flex; flex-direction: column; align-items: flex-start; gap: .5rem;
    padding: 1.25rem 1.35rem; border: 1px solid var(--c-border); border-radius: 16px; background: var(--c-surface);
}
.bilgi-ikon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px;
    background: color-mix(in srgb, var(--c-primary) 12%, transparent); color: var(--c-primary); }
.bilgi-etiket { color: var(--c-muted); font-size: .82rem; }
.bilgi-deger { font-size: 1.25rem; font-variant-numeric: tabular-nums; }

.villa-harita {
    width: 100%; border-radius: var(--radius); overflow: hidden;
    background: var(--c-surface); border: 1px solid var(--c-border);
}
.villa-harita iframe { width: 100%; height: 340px; display: block; border: 0; }
.villa-harita-atif { margin-top: .75rem; }
.villa-harita-atif .dugme { display: inline-flex; align-items: center; gap: .4rem; }

/* ---------- Rezervasyon kutusu ve formlar ---------- */

.rezervasyon-kutu h2 { font-size: 1.1rem; }
.rezervasyon-not { font-size: .8rem; color: var(--c-muted); margin-block: .8rem 0; }

.rezervasyon-form label { display: block; font-size: .8rem; font-weight: 600; color: var(--c-muted); margin: .8rem 0 .25rem; }
.rezervasyon-form input,
.rezervasyon-form select,
.rezervasyon-form textarea {
    width: 100%; padding: .6rem .75rem; font: inherit; font-size: .92rem;
    border: 1px solid var(--c-border); border-radius: var(--radius);
    background: var(--c-background); color: var(--c-text);
}
.rezervasyon-form textarea { resize: vertical; }
.rezervasyon-form fieldset { border: 0; padding: 0; margin: 0 0 1.5rem; }
.rezervasyon-form legend { font-weight: 700; font-size: 1rem; padding: 0; margin-bottom: .3rem; }
.rezervasyon-form .filtre-secenek input { width: auto; }
.rezervasyon-form .dugme { margin-top: 1.25rem; }
.rezervasyon-form small.uyari { display: block; padding: .3rem .5rem; font-size: .78rem; }

.form-satir { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem; }

.fiyat-dokum-kap { margin-block: 1rem; }
.fiyat-dokum-kap.yukleniyor { opacity: .5; }

/* Fiyatlandırma modülünün fiyat dökümü site kutusunda da okunaklı olsun */
.fiyat-dokum-kap .fiyat-dokum table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.fiyat-dokum-kap .fiyat-dokum th,
.fiyat-dokum-kap .fiyat-dokum td { padding: .3rem 0; border-bottom: 1px solid var(--c-border); text-align: start; font-weight: 400; }
.fiyat-dokum-kap .fiyat-dokum .metin-sag { text-align: end; }
.fiyat-dokum-kap .fiyat-dokum .metin-kalin { font-weight: 700; }
.fiyat-dokum-kap .fiyat-dokum .metin-kucuk { font-size: .78rem; }
.fiyat-dokum-kap .fiyat-dokum .metin-sonuk { color: var(--c-muted); }
.fiyat-dokum-kap .fiyat-dokum .tablo-kap { max-height: 220px; overflow-y: auto; }
.fiyat-dokum-kap .fiyat-dokum .etiket { padding: .1rem .45rem; font-size: .72rem; }

/* ---------- Durum kartları (rezervasyon / ödeme sonucu) ---------- */

.durum-kart {
    border: 1px solid var(--c-border); border-inline-start-width: 4px;
    border-radius: var(--radius); padding: 1.5rem; margin-bottom: 1.5rem; text-align: center;
}
.durum-kart h1, .durum-kart h2 { margin-bottom: .5rem; }
.durum-basarili { border-inline-start-color: var(--c-success, #16A34A); background: color-mix(in srgb, var(--c-success, #16A34A) 8%, transparent); }
.durum-hata     { border-inline-start-color: var(--c-danger, #DC2626);  background: color-mix(in srgb, var(--c-danger, #DC2626) 8%, transparent); }
.durum-uyari    { border-inline-start-color: var(--c-warning, #F59E0B); background: color-mix(in srgb, var(--c-warning, #F59E0B) 8%, transparent); }
.durum-bilgi    { border-inline-start-color: var(--c-info, #0284C7);    background: color-mix(in srgb, var(--c-info, #0284C7) 8%, transparent); }

.pnr-kod { font-size: 1.6rem; letter-spacing: .12em; margin: .3rem 0 1rem; }
.pnr-barkod { display: flex; justify-content: center; margin-block: 1rem; }
.pnr-barkod svg { max-width: 100%; height: auto; }

/* ---------- Ödeme ---------- */

.ilerleme { height: 8px; border-radius: 4px; background: var(--c-border); overflow: hidden; margin-bottom: 1rem; }
.ilerleme span { display: block; height: 100%; background: var(--c-success, #16A34A); }

.banka-kart { padding: .9rem 0; border-bottom: 1px solid var(--c-border); }
.banka-kart:last-of-type { border-bottom: 0; }
.banka-kart h3 { margin-bottom: .4rem; }
.banka-kart code { font-size: .88rem; word-break: break-all; }

.odeme-cerceve { border: 1px solid var(--c-border); border-radius: var(--radius); overflow: hidden; min-height: 520px; }
.odeme-cerceve iframe { width: 100%; min-height: 520px; border: 0; display: block; }

/* ---------- Fırsatlar / kampanyalar ---------- */

.firsat-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.5rem; }
.firsat-kart {
    display: flex; flex-direction: column; overflow: hidden;
    border: 1px solid var(--c-border); border-radius: var(--radius);
    background: var(--c-background); box-shadow: var(--shadow);
}
.firsat-gorsel { position: relative; display: block; background: var(--c-surface); }
.firsat-gorsel img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.firsat-govde { padding: 1rem; display: flex; flex-direction: column; gap: .45rem; flex: 1; }
.firsat-govde h2 { margin: 0; font-size: 1.05rem; }
.firsat-govde h2 a { color: var(--c-text); }
.firsat-govde .bolum-eylem { margin-top: auto; }
.firsat-kapak, .koleksiyon-kapak {
    width: 100%; max-height: 380px; object-fit: cover;
    border-radius: var(--radius); margin-bottom: 1.5rem;
}

/* ---------- Bölge / koleksiyon ---------- */

.bolge-aciklama, .koleksiyon-aciklama { max-width: 760px; margin-bottom: 2rem; }
.alt-bolgeler { margin-bottom: 2rem; }
.hero-bolge { min-height: 340px; }
.koleksiyon-liste .villa-izgara { grid-template-columns: 1fr; }

/* ---------- Duyarlı düzeltmeler ---------- */

@media (max-width: 1024px) {
    .hakkimizda-duzen { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
    .detay-baslik { flex-direction: column; }
    .cta-bant { padding: 1.5rem; }
    .odeme-cerceve, .odeme-cerceve iframe { min-height: 620px; }
    .bolge-izgara { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
}

/* =====================================================================
   Başlık birleşik dil/para seçici + mobil alt navigasyon
   ===================================================================== */

/* Dil + para birimi tek düğmede */
.tercih-secici .secici-dugme { gap: .4rem; padding: .45rem .7rem; }
.tercih-secici .bayrak { font-size: 1.05rem; line-height: 1; }
.tercih-secici .para-kod { font-weight: 600; font-size: .82rem; }
.tercih-secici .ok-ikon { font-size: .7rem; opacity: .6; }
.tercih-liste { min-width: 210px; padding: .5rem; }
.tercih-grup { padding: .35rem 0; }
.tercih-grup + .tercih-grup { border-top: 1px solid var(--c-border); margin-top: .35rem; }
.tercih-baslik {
    display: block; font-size: .7rem; text-transform: uppercase; letter-spacing: .04em;
    color: var(--c-muted); padding: .2rem .65rem .35rem; font-weight: 700;
}
.tercih-liste a { display: flex; align-items: center; gap: .5rem; border-radius: 8px; }
.tercih-liste a.aktif { background: color-mix(in srgb, var(--c-primary) 12%, transparent); color: var(--c-primary); font-weight: 600; }

.ikon-dugme svg { display: block; }
.ikon-dugme .sayac {
    position: absolute; top: -3px; inset-inline-end: -3px;
    min-width: 17px; height: 17px; padding: 0 4px;
    background: var(--c-accent); color: #fff; border-radius: 9px;
    font-size: 10px; font-weight: 700; display: grid; place-items: center;
}

/* ---------- Mobil alt navigasyon (bottom nav) ---------- */

.alt-nav { display: none; }

@media (max-width: 860px) {
    /* Üst menü mobilde alt-nav'a taşınır; hamburger yok */
    .ana-menu { display: none !important; }
    .mobil-menu-dugme { display: none !important; }
    .masaustu-only { display: none !important; }

    /* Logo SOLDA, kontroller SAĞDA — absolute konum yok, üst üste binme yok */
    .ustbar-ic { position: static; justify-content: space-between; gap: .5rem; min-height: 58px; }
    .marka { position: static; flex: 0 1 auto; min-width: 0; overflow: hidden; }
    .marka img { max-height: 34px; width: auto; display: block; }
    .marka strong {
        font-size: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block;
    }
    .ustbar-sag {
        position: static; transform: none;
        gap: .3rem; flex: 0 0 auto; align-items: center;
    }
    .ustbar-sag .ikon-dugme { width: 38px; height: 38px; }
    .hesap-giris-dugme { padding: .42rem .75rem; font-size: .82rem; }
    .tercih-secici .secici-dugme { padding: .38rem .5rem; }

    /* -------- Liquid glass yüzen alt navigasyon -------- */
    .alt-nav {
        display: flex;
        position: fixed;
        inset-inline: 12px;
        inset-block-end: calc(10px + env(safe-area-inset-bottom, 0));
        z-index: 90;
        border-radius: 26px;
        padding: .35rem .3rem;
        background: rgba(255, 255, 255, .68);
        -webkit-backdrop-filter: saturate(180%) blur(22px);
        backdrop-filter: saturate(180%) blur(22px);
        border: 1px solid rgba(255, 255, 255, .55);
        box-shadow: 0 10px 34px rgba(15, 23, 42, .22), inset 0 1px 0 rgba(255, 255, 255, .7);
    }
    .alt-nav-oge {
        flex: 1; display: flex; flex-direction: column; align-items: center; gap: .12rem;
        padding: .5rem .2rem; color: var(--c-muted, #64748b); font-size: .66rem; font-weight: 600;
        position: relative; text-decoration: none; border-radius: 18px;
        transition: color .18s, background .18s;
    }
    .alt-nav-oge svg { stroke-width: 1.7; transition: stroke-width .18s, transform .18s; }
    .alt-nav-oge.aktif {
        color: var(--c-primary, #0f766e);
        background: rgba(15, 118, 110, .12);
    }
    .alt-nav-oge.aktif svg { stroke-width: 2.3; transform: translateY(-1px); }
    .alt-nav-sayac {
        position: absolute; top: .25rem; inset-inline-start: 54%;
        min-width: 16px; height: 16px; padding: 0 4px;
        background: var(--c-accent, #e11d48); color: #fff; border-radius: 8px;
        font-size: 9px; font-weight: 700; display: grid; place-items: center;
        box-shadow: 0 2px 6px rgba(225, 29, 72, .45);
    }

    /* Yüzen nav içeriği örtmesin */
    body { padding-bottom: 92px; }
    .wa-yuzen { inset-block-end: calc(88px + env(safe-area-inset-bottom, 0)); }
}

@media (max-width: 860px) and (prefers-color-scheme: dark) {
    .alt-nav {
        background: rgba(17, 24, 39, .72);
        border-color: rgba(255, 255, 255, .12);
        box-shadow: 0 10px 34px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 255, 255, .08);
    }
    .alt-nav-oge.aktif { background: rgba(45, 212, 191, .18); }
}

/* ---------- Paylaş (tek düğme + popup) ---------- */
.paylas-kutu { position: relative; display: inline-block; }
.paylas-ac { gap: .4rem; }
.paylas-liste {
    position: absolute; inset-inline-end: 0; top: calc(100% + 6px); z-index: 70;
    min-width: 210px; background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius); box-shadow: 0 12px 32px rgba(15,23,42,.16); padding: .4rem;
}
.paylas-secenek {
    display: flex; align-items: center; gap: .7rem; width: 100%; padding: .6rem .7rem;
    border: 0; background: none; border-radius: 8px; font: inherit; font-size: .9rem;
    color: var(--c-text); text-align: start; cursor: pointer;
}
.paylas-secenek:hover { background: var(--c-surface); }
.paylas-ikon { width: 22px; height: 22px; border-radius: 6px; flex-shrink: 0; background: var(--c-surface); }
.paylas-whatsapp { background: #25D366; }
.paylas-facebook { background: #1877F2; }
.paylas-x        { background: #0F1419; }
.paylas-telegram { background: #229ED9; }
.paylas-mail     { background: #EA4335; }
.paylas-kopyala  { background: var(--c-muted); }

/* ---------- Hızlı seçim düğmeleri (Hafta sonu / Fırsatlar vb.) ortala ---------- */
.hizli-secim, .esnek-secim, .arama-hizli {
    display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin: 1rem 0;
}
.hizli-secim .dugme, .esnek-secim .dugme { flex: 0 0 auto; }

/* ---------- Bölge kartları (bölgeler listesi) ---------- */
.bolge-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 280px)); gap: 1.25rem; justify-content: center; }
.bolge-kart { position: relative; border-radius: var(--radius); overflow: hidden; color: #fff; display: block; box-shadow: var(--shadow); }
.bolge-kart:hover { text-decoration: none; }
.bolge-kart-gorsel { position: relative; aspect-ratio: 4/3; background: var(--c-secondary); }
.bolge-kart-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.bolge-kart:hover .bolge-kart-gorsel img { transform: scale(1.06); }
.bolge-kart-bos { position: absolute; inset: 0; display: grid; place-items: center; font-size: 3rem; font-weight: 800; opacity: .35; }
.bolge-kart-perde { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(15,23,42,.72)); }
.bolge-kart-ic { position: absolute; inset-block-end: 0; inset-inline: 0; padding: 1rem; display: flex; flex-direction: column; gap: .15rem; z-index: 2; }
.bolge-kart-ic strong { font-size: 1.1rem; }
.bolge-kart-sayi { font-size: .82rem; opacity: .9; }

/* ---------- Footer belge alanı (TÜRSAB / işletme belgesi) ---------- */
.altbar-belge { display: flex; align-items: center; gap: 1rem; margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--c-border); flex-wrap: wrap; }
.altbar-belge-gorsel { height: 56px; width: auto; border-radius: 6px; background: #fff; padding: 4px; }
.altbar-belge-metin { display: flex; flex-direction: column; gap: .2rem; font-size: .85rem; color: var(--c-muted); }

/* ---------- SVG ikon hizalama (kart/detay/özellikler) ---------- */
.villa-ozet span { display: inline-flex; align-items: center; gap: .35rem; }
.villa-ozet .ikon { flex-shrink: 0; color: var(--c-muted); }
.villa-puan .yildiz-dolu { color: #F59E0B; fill: #F59E0B; }
.villa-favori .ikon { transition: fill .15s; }
.villa-favori.aktif .ikon { fill: #E11D48; color: #E11D48; }

/* =====================================================================
   Villa detay — modern düzen, ikonlar, takvim, video, yorumlar
   ===================================================================== */

/* Galeri header'a yapışmasın */
.detay-duzen { padding-top: 2rem; }
main > .kap > .galeri, .villa-galeri { margin-top: 1.5rem; margin-bottom: 2rem; }
.detay-baslik { margin-bottom: 1.25rem; }

/* Kapasite şeridi — ikonlu kartlar */
.detay-ozet {
    list-style: none; margin: 0 0 1.75rem; padding: 1.1rem; display: flex; flex-wrap: wrap; gap: 1.5rem;
    background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius);
}
.detay-ozet li { display: flex; align-items: center; gap: .6rem; font-size: .95rem; }
.detay-ozet .ikon { color: var(--c-primary); flex-shrink: 0; }
.detay-ozet strong { font-size: 1.1rem; font-weight: 700; }
.detay-ozet span { color: var(--c-muted); }

/* Özellikler — ikonlu, ferah */
.detay-blok { margin-bottom: 2.5rem; }
.detay-blok > h2 { margin-bottom: 1.1rem; font-size: 1.35rem; }
.detay-blok > h3 { margin: 1.25rem 0 .75rem; font-size: 1rem; color: var(--c-muted); }
.ozellik-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .85rem; }
.ozellik { display: flex; align-items: center; gap: .65rem; padding: .7rem .85rem; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--radius); font-size: .92rem; }
.ozellik-ikon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: color-mix(in srgb, var(--c-primary) 12%, transparent); color: var(--c-primary); flex-shrink: 0; }
.ozellik small { display: block; color: var(--c-muted); font-size: .8rem; }

/* Video */
.video-cerceve { position: relative; aspect-ratio: 16/9; border-radius: var(--radius); overflow: hidden; background: #000; }
.video-cerceve iframe, .video-cerceve video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* Müsaitlik takvimi */
.takvim-aciklama { display: flex; gap: 1.25rem; font-size: .85rem; color: var(--c-muted); margin-bottom: 1rem; align-items: center; }
.takvim-nokta { display: inline-block; width: 12px; height: 12px; border-radius: 3px; vertical-align: -1px; margin-inline-end: .35rem; }
.takvim-nokta.dolu { background: color-mix(in srgb, var(--c-danger) 30%, transparent); border: 1px solid var(--c-danger); }
.takvim-nokta.bos { background: color-mix(in srgb, var(--c-success) 18%, transparent); border: 1px solid color-mix(in srgb, var(--c-success) 50%, transparent); }
.musaitlik-takvim { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.5rem; }
.takvim-ay-baslik { font-weight: 650; margin-bottom: .6rem; text-align: center; }
.takvim-izgara { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.takvim-baslik { text-align: center; font-size: .7rem; color: var(--c-muted); font-weight: 600; padding-bottom: .3rem; }
.takvim-gun { aspect-ratio: 1; display: grid; place-items: center; font-size: .82rem; border-radius: 7px; }
.takvim-gun.bos { background: color-mix(in srgb, var(--c-success) 12%, transparent); color: var(--c-text); }
.takvim-gun.dolu { background: color-mix(in srgb, var(--c-danger) 12%, transparent); color: var(--c-danger); text-decoration: line-through; }
.takvim-gun.gecmis { color: color-mix(in srgb, var(--c-muted) 50%, transparent); }

/* Yorumlar — Instagram tarzı */
.yorum-kimlik { display: flex; flex-direction: column; gap: .2rem; }
.yorum-yildiz { display: inline-flex; align-items: center; gap: 1px; }
.yorum-yildiz .yildiz-dolu { color: #F59E0B; fill: #F59E0B; }
.yorum-yildiz .yildiz-bos { color: var(--c-border); }
.yorum-yildiz small { color: var(--c-muted); margin-inline-start: .5rem; font-size: .78rem; }
.yorum-baslik { font-size: 1rem; margin: .5rem 0 .25rem; }
.yorum-gorseller { display: flex; gap: .6rem; margin-top: .75rem; flex-wrap: wrap; }
.yorum-foto { display: block; width: 72px; height: 72px; border-radius: 50%; overflow: hidden; border: 3px solid var(--c-primary); padding: 2px; }
.yorum-foto img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.yorum .rozet.iyi .ikon { vertical-align: -2px; }

@media (max-width: 768px) {
    .detay-ozet { gap: 1rem 1.25rem; justify-content: space-between; }
    .detay-ozet li { flex-direction: column; gap: .2rem; text-align: center; flex: 1 0 25%; }
    .musaitlik-takvim { grid-template-columns: 1fr; }
}

/* =====================================================================
   Anasayfa hero — şeffaf header, hero header'a kadar, glass efekt
   ===================================================================== */
/* Hero sayfalarında header ABSOLUTE — sayfayla birlikte yukarı kayıp gider,
   sabit/sticky KALMAZ (kullanıcı isteği). */
body:has(.hero) .ustbar {
    position: absolute; inset-inline: 0; top: 0; z-index: 50;
    background: transparent; border-bottom-color: transparent;
}
body:has(.hero) .ustbar.sabit { position: absolute; }
body:has(.hero) .ustbar .marka,
body:has(.hero) .ustbar .marka strong,
body:has(.hero) .ustbar .ana-menu a { color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.35); }
body:has(.hero) .ustbar .ikon-dugme,
body:has(.hero) .ustbar .secici-dugme {
    color: #fff; border-color: rgba(255,255,255,.35);
    background: rgba(255,255,255,.12); backdrop-filter: blur(6px);
}

/* Hero metni glass panel içinde — okunabilirlik */
.hero-ic {
    background: rgba(15,23,42,.32);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 22px;
    padding: 2.75rem 2.5rem;
    box-shadow: 0 20px 60px rgba(0,0,0,.3);
}
.hero-eylem { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin: 0; }
.hero .dugme.hayalet {
    background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.6);
    color: #fff; backdrop-filter: blur(6px);
}
.hero .dugme.hayalet:hover { background: rgba(255,255,255,.28); }
.hero .dugme.birincil { box-shadow: 0 8px 24px rgba(0,0,0,.3); }

@media (max-width: 768px) {
    .hero-ic { padding: 1.75rem 1.25rem; margin-inline: 1rem; }
    /* Mobilde header ortada logo zaten şeffaf üstte durur */
    body:has(.hero) .ustbar:not(.kaydirildi) { padding-top: env(safe-area-inset-top, 0); }
}

/* =====================================================================
   Anasayfa — Sıkça Sorulan Sorular (accordion, native <details>)
   ===================================================================== */
.bolum-sss .sss-liste {
    max-width: 820px; margin: 0 auto;
    display: flex; flex-direction: column; gap: .75rem;
}
.sss-oge {
    border: 1px solid var(--c-border); border-radius: 14px;
    background: var(--c-background); overflow: hidden;
    transition: border-color .2s, box-shadow .2s;
}
.sss-oge[open] { border-color: color-mix(in srgb, var(--c-primary) 45%, var(--c-border)); box-shadow: 0 6px 20px rgba(15,23,42,.06); }
.sss-oge summary {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1.1rem 1.25rem; cursor: pointer; font-weight: 600;
    list-style: none; color: var(--c-text);
}
.sss-oge summary::-webkit-details-marker { display: none; }
.sss-oge summary:hover { color: var(--c-primary); }
.sss-ok { flex: 0 0 auto; transition: transform .25s; color: var(--c-primary); }
.sss-oge[open] .sss-ok { transform: rotate(90deg); }
.sss-cevap {
    padding: 0 1.25rem 1.2rem; color: var(--c-text-soft, #64748b);
    line-height: 1.7;
}
.sss-cevap :is(p, ul, ol):first-child { margin-top: 0; }
.sss-cevap :is(p, ul, ol):last-child { margin-bottom: 0; }
.sss-daha { text-align: center; margin-top: 1.5rem; }

/* =====================================================================
   İletişim sayfası — modern iki sütun + konum haritası
   ===================================================================== */
.iletisim-sayfa .bolum-baslik { text-align: center; margin-bottom: 2rem; }
.iletisim-duzen {
    display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: stretch;
}
.iletisim-form {
    background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius, 16px); padding: 1.75rem;
    box-shadow: 0 8px 30px rgba(15,23,42,.05);
}
.iletisim-bilgi {
    background: linear-gradient(160deg, color-mix(in srgb, var(--c-primary) 10%, var(--c-background)), var(--c-background));
    border: 1px solid var(--c-border); border-radius: var(--radius, 16px); padding: 1.75rem;
    display: flex; flex-direction: column;
}
.iletisim-bilgi h2 { margin-top: 0; }
.iletisim-kanal { list-style: none; padding: 0; margin: 1.25rem 0; display: flex; flex-direction: column; gap: 1rem; }
.iletisim-kanal li { display: flex; align-items: center; gap: .85rem; }
.kanal-ikon {
    flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px;
    display: grid; place-items: center;
    background: color-mix(in srgb, var(--c-primary) 14%, transparent); color: var(--c-primary);
}
.iletisim-kanal small { display: block; color: var(--c-text-soft, #64748b); font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; }
.iletisim-kanal a { color: var(--c-text); font-weight: 600; }
.iletisim-kanal a:hover { color: var(--c-primary); }
.iletisim-hizli { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: 1rem; }

.iletisim-harita {
    margin-top: 1.5rem; border: 1px solid var(--c-border);
    border-radius: var(--radius, 16px); overflow: hidden; background: var(--c-surface);
    flex: 1; display: flex; flex-direction: column; min-height: 300px;
}
.iletisim-harita iframe { width: 100%; flex: 1; min-height: 260px; display: block; }
.harita-atif {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: .75rem 1rem; flex-wrap: wrap;
}
.harita-atif small { color: var(--c-text-soft, #64748b); font-size: .75rem; }
.harita-atif .dugme { display: inline-flex; align-items: center; gap: .4rem; }

@media (max-width: 820px) {
    .iletisim-duzen { grid-template-columns: 1fr; }
}

/* =====================================================================
   Villalar sayfası — filtre paneli + sıralama toolbar (modern)
   ===================================================================== */
.filtre-panel-baslik {
    display: flex; align-items: center; justify-content: space-between;
    padding-bottom: .5rem; margin-bottom: .25rem; border-bottom: 1px solid var(--c-border);
}
.filtre-panel-baslik h3 { margin: 0; display: flex; align-items: center; gap: .5rem; font-size: 1.05rem; }
.filtre-temizle { font-size: .82rem; color: var(--c-primary); font-weight: 600; }

/* Panel içindeki form kontrolleri */
.filtre-panel select,
.filtre-panel input[type="number"] {
    width: 100%; padding: .5rem .6rem; font: inherit; font-size: .88rem;
    border: 1px solid var(--c-border); border-radius: 10px;
    background: var(--c-background); color: var(--c-text);
}
.filtre-secenek input[type="checkbox"],
.filtre-secenek input[type="radio"] { accent-color: var(--c-primary); width: 16px; height: 16px; }
.filtre-secenek:has(select) { flex-direction: column; align-items: stretch; gap: .3rem; }
.filtre-secenek:has(select) > span { font-size: .8rem; color: var(--c-muted); }
.filtre-secenek:hover { color: var(--c-primary); }
.fiyat-slider { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.fiyat-slider input[type="range"] { grid-column: 1 / -1; width: 100%; accent-color: var(--c-primary); }

/* Sonuç araç çubuğu — tek satır, düzenli kart görünümü */
.sonuc-arac {
    display: flex; align-items: center; gap: .75rem;
    margin-bottom: 1.4rem; flex-wrap: wrap;
    background: var(--c-surface, #f7f4ef);
    border: 1px solid var(--c-border);
    border-radius: 14px;
    padding: .55rem .7rem;
}

/* Sıralama grubu — "Sırala" etiketi + yatay kaydırılabilir pill şeridi */
.sirala-grup {
    display: flex; align-items: center; gap: .6rem;
    flex: 1 1 auto; min-width: 0;
}
.sirala-etiket {
    display: inline-flex; align-items: center; gap: .3rem;
    font-size: .78rem; font-weight: 700; letter-spacing: .02em;
    color: var(--c-muted); white-space: nowrap; flex-shrink: 0;
    text-transform: uppercase;
}
.siralama-butonlar {
    display: flex; align-items: center; gap: .4rem;
    flex-wrap: nowrap; overflow-x: auto; min-width: 0;
    padding-bottom: 2px; scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
.siralama-butonlar::-webkit-scrollbar { display: none; }
.siralama-btn {
    padding: .42rem .85rem; font: inherit; font-size: .82rem; font-weight: 600;
    border: 1px solid var(--c-border); border-radius: 999px;
    background: var(--c-background); color: var(--c-muted); cursor: pointer;
    white-space: nowrap; flex: 0 0 auto;
    transition: background .15s, color .15s, border-color .15s;
}
.siralama-btn:hover { color: var(--c-text); border-color: var(--c-text); }
.siralama-btn.aktif {
    background: var(--c-primary, #b8895a); color: #fff; border-color: var(--c-primary, #b8895a);
}

/* Görünüm — grid / liste ikonlu toggle */
.gorunum-toggle {
    display: inline-flex; align-items: center; gap: 0;
    border: 1px solid var(--c-border); border-radius: 999px; overflow: hidden;
    flex-shrink: 0; background: var(--c-background);
}
.gorunum-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .45rem .7rem; background: transparent; color: var(--c-muted);
    border: 0; cursor: pointer; transition: background .15s, color .15s;
}
.gorunum-btn + .gorunum-btn { border-inline-start: 1px solid var(--c-border); }
.gorunum-btn:hover { color: var(--c-text); }
.gorunum-btn.aktif { background: var(--c-primary, #b8895a); color: #fff; }
.filtre-ac-mobil { display: none; }

@media (max-width: 860px) {
    /* Mobilde: filtre butonu + görünüm üstte, sıralama şeridi altta tam genişlik */
    .filtre-ac-mobil { order: 1; flex-shrink: 0; }
    .gorunum-toggle { order: 2; margin-inline-start: auto; }
    .sirala-grup { order: 3; flex-basis: 100%; }
}

/* Yükleniyor durumu */
.arama-sonuc.yukleniyor { opacity: .55; pointer-events: none; transition: opacity .15s; }

@media (max-width: 860px) {
    .filtre-ac-mobil { display: inline-flex; }
    .filtre-panel {
        position: fixed; inset: 0; z-index: 200; margin: 0; border-radius: 0;
        overflow-y: auto; transform: translateX(-100%); transition: transform .25s;
        max-width: 340px; box-shadow: 0 0 40px rgba(0,0,0,.25);
    }
    .filtre-panel.acik { transform: translateX(0); }
}

/* Filtre paneli kapat butonu — sadece mobilde görünür */
.filtre-kapat { display: none; background: none; border: 0; cursor: pointer; color: var(--c-muted); padding: .25rem; }
@media (max-width: 860px) { .filtre-kapat { display: inline-flex; } }

/* =====================================================================
   Blog listesi — iki sütun düzen + yan panel (eksik düzen CSS'i)
   ===================================================================== */
.blog-duzen { display: grid; grid-template-columns: 1fr 300px; gap: 2rem; align-items: start; }
.blog-ana { min-width: 0; }
.blog-yan { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 1.25rem; }

.blog-arama { display: flex; gap: .5rem; }
.blog-arama input {
    flex: 1; min-width: 0; padding: .6rem .8rem; font: inherit; font-size: .9rem;
    border: 1px solid var(--c-border); border-radius: 999px;
    background: var(--c-background); color: var(--c-text);
}
.blog-arama input:focus { outline: none; border-color: var(--c-primary); }
.blog-arama .dugme { border-radius: 999px; }

.yan-blok {
    background: var(--c-surface); border: 1px solid var(--c-border);
    border-radius: var(--radius); padding: 1.1rem 1.25rem;
}
.yan-blok h3 { margin: 0 0 .8rem; font-size: 1rem; }
.yan-blok ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .1rem; }
.yan-blok li a {
    display: flex; align-items: center; justify-content: space-between; gap: .5rem;
    padding: .45rem .55rem; border-radius: 8px; color: var(--c-text); font-size: .9rem;
}
.yan-blok li a:hover { background: var(--c-background); color: var(--c-primary); text-decoration: none; }
.yan-blok li a[aria-current="page"] { background: color-mix(in srgb, var(--c-primary) 12%, transparent); color: var(--c-primary); font-weight: 600; }
.yan-blok .sayac {
    flex: 0 0 auto; min-width: 22px; text-align: center; font-size: .72rem; font-weight: 700;
    background: var(--c-border); color: var(--c-muted); border-radius: 999px; padding: .05rem .4rem;
}
.yazi-govde h2 a:hover, .yazi-kategori:hover { color: var(--c-primary); }
.yazi-kart { transition: transform .2s, box-shadow .2s; }
.yazi-kart:hover { transform: translateY(-3px); box-shadow: 0 12px 28px rgba(15,23,42,.12); }

@media (max-width: 860px) {
    .blog-duzen { grid-template-columns: 1fr; }
    .blog-yan { position: static; order: -1; }
}

/* =====================================================================
   Villa detay — üst/alt boşluk, galeri ile içerik arası nefes
   ===================================================================== */
.villa-detay { padding-block: 1.75rem 3.5rem; }
.villa-detay .galeri { margin-top: .25rem; }
.villa-detay .galeri-not { margin-top: .6rem; font-size: .85rem; color: var(--c-muted); }
.villa-detay .detay-duzen { margin-top: 2.25rem; }
.detay-baslik h1 { margin-bottom: .35rem; }
.villa-detay .villa-konum { display: flex; align-items: center; gap: .35rem; color: var(--c-muted); margin: 0 0 .5rem; }
.villa-detay .villa-konum a { color: var(--c-muted); }
.villa-detay .villa-konum a:hover { color: var(--c-primary); }
.villa-puan { display: inline-flex; align-items: center; gap: .35rem; }
.yildiz-dolu { color: #f59e0b; }

/* =====================================================================
   Müşteri hesapları — giriş / kayıt / panel (F079)
   ===================================================================== */
.hesap-sayfa { padding-block: 2.25rem 3.5rem; }
.hesap-sayfa .kap-dar { max-width: 460px; }

.hesap-kutu {
    background: var(--c-background);
    border: 1px solid var(--c-border);
    border-radius: var(--radius, 16px);
    padding: 2rem 1.75rem;
    box-shadow: 0 8px 30px rgba(15, 23, 42, .05);
}
.hesap-baslik { margin-bottom: 1.5rem; text-align: center; }
.hesap-baslik h1 { margin-bottom: .35rem; font-size: 1.5rem; }
.hesap-baslik p { color: var(--c-muted); font-size: .92rem; margin: 0; }

.hesap-form { display: flex; flex-direction: column; gap: 1rem; }
.hesap-form-genis { max-width: 560px; }

.form-alan { display: flex; flex-direction: column; gap: .3rem; }
.form-alan label { font-size: .82rem; font-weight: 600; color: var(--c-muted); }
.form-alan label span { color: var(--c-danger, #DC2626); }
.form-alan input[type="text"],
.form-alan input[type="email"],
.form-alan input[type="tel"],
.form-alan input[type="password"] {
    width: 100%; padding: .65rem .8rem; font: inherit; font-size: .95rem;
    border: 1px solid var(--c-border); border-radius: var(--radius, 10px);
    background: var(--c-background); color: var(--c-text);
}
.form-alan input:focus {
    outline: none; border-color: var(--c-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-primary) 18%, transparent);
}
.form-alan small.ipucu { font-size: .76rem; color: var(--c-muted); }
.form-alan small.hata { font-size: .78rem; color: var(--c-danger, #DC2626); }

.form-alan.onay { flex-direction: row; align-items: flex-start; gap: .5rem; }
.form-alan.onay label { font-weight: 400; color: var(--c-text); font-size: .88rem; display: flex; gap: .5rem; align-items: flex-start; }
.form-alan.onay input[type="checkbox"] { margin-top: .2rem; accent-color: var(--c-primary); width: 16px; height: 16px; flex: 0 0 auto; }

.hesap-gonder { width: 100%; margin-top: .35rem; }
.hesap-alt { text-align: center; margin-top: 1.25rem; font-size: .9rem; color: var(--c-muted); }
.hesap-alt a { font-weight: 600; }
.hesap-giris-dugme { white-space: nowrap; }

/* ---- Panel ---- */
.hesap-ust {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    flex-wrap: wrap; margin-bottom: 1.75rem;
}
.hesap-ust h1 { margin: 0 0 .2rem; font-size: 1.6rem; }
.hesap-eposta { color: var(--c-muted); margin: 0; font-size: .92rem; }
.hesap-cikis { margin: 0; }

.hesap-kart-izgara {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem; margin-bottom: 2rem;
}
.hesap-ozet-kart {
    display: flex; flex-direction: column; gap: .25rem;
    padding: 1.15rem 1.25rem; border: 1px solid var(--c-border);
    border-radius: var(--radius, 14px); background: var(--c-surface);
    color: var(--c-text); transition: border-color .15s ease, transform .15s ease;
}
.hesap-ozet-kart:hover { border-color: var(--c-primary); transform: translateY(-2px); text-decoration: none; }
.hesap-ozet-etiket { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--c-muted); }
.hesap-ozet-deger { font-size: 1.6rem; font-weight: 800; color: var(--c-primary); line-height: 1.1; }
.hesap-ozet-alt { font-size: .8rem; color: var(--c-muted); }

.hesap-bolum { margin-top: 2.25rem; }
.hesap-bolum h2 { font-size: 1.2rem; margin-bottom: 1rem; }

.tablo-sarmal { overflow-x: auto; border: 1px solid var(--c-border); border-radius: var(--radius, 12px); }
.hesap-tablo { width: 100%; border-collapse: collapse; font-size: .9rem; }
.hesap-tablo th, .hesap-tablo td { padding: .7rem .85rem; border-bottom: 1px solid var(--c-border); text-align: start; }
.hesap-tablo thead th { background: var(--c-surface); font-weight: 600; color: var(--c-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .02em; }
.hesap-tablo tbody tr:last-child td { border-bottom: 0; }
.hesap-tablo .sag { text-align: end; }
.hesap-rozet {
    display: inline-block; padding: .18rem .5rem; border-radius: 999px;
    background: color-mix(in srgb, var(--c-primary) 12%, transparent);
    color: var(--c-primary); font-size: .76rem; font-weight: 600;
}
.hesap-rozet.talep {
    background: color-mix(in srgb, #f59e0b 16%, transparent); color: #b45309;
    margin-inline-start: .35rem;
}

/* Rezervasyon boş durumu */
.hesap-bos {
    text-align: center; padding: 2rem 1.25rem;
    border: 1px dashed var(--c-border); border-radius: 14px;
    background: var(--c-surface, #f7f4ef);
}
.hesap-bos p { margin: 0 auto .6rem; max-width: 480px; }
.hesap-bos .ipucu { font-size: .85rem; color: var(--c-muted); }
.hesap-bos .dugme { margin-top: .5rem; }

@media (max-width: 560px) {
    .hesap-ust { flex-direction: column; align-items: flex-start; }
}

/* =====================================================================
   Instagram hikaye — şerit (balonlar) + tam ekran görüntüleyici (F064)
   ===================================================================== */
.hikaye-serit {
    display: flex; gap: 1rem; overflow-x: auto; padding: .5rem .25rem 1rem;
    margin-bottom: 1rem; scrollbar-width: thin;
}
.hikaye-balon {
    flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: .4rem;
    background: none; border: 0; cursor: pointer; width: 76px;
}
.hikaye-halka {
    display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%;
    padding: 3px; background: conic-gradient(from 210deg, #f59e0b, #e11d48, #7c3aed, #f59e0b);
}
.hikaye-halka img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; border: 2px solid var(--c-background); }
.hikaye-halka.kucuk { width: 40px; height: 40px; padding: 2px; }
.hikaye-ad {
    font-size: .74rem; color: var(--c-text); max-width: 74px; overflow: hidden;
    text-overflow: ellipsis; white-space: nowrap; text-align: center;
}
.hikaye-balon:hover .hikaye-ad { color: var(--c-primary); }

/* Tam ekran görüntüleyici */
.hikaye-goruntuleyici[hidden] { display: none; }
.hikaye-goruntuleyici {
    position: fixed; inset: 0; z-index: 1000;
    display: flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,.92); backdrop-filter: blur(4px);
}
.hikaye-sahne {
    position: relative; width: min(430px, 94vw); height: min(88vh, 780px);
    background: #000; border-radius: 14px; overflow: hidden;
    display: flex; flex-direction: column;
}
.hikaye-ilerleme { display: flex; gap: 4px; padding: .6rem .6rem 0; }
.hikaye-seg { flex: 1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.35); overflow: hidden; }
.hikaye-seg > i { display: block; height: 100%; width: 0; background: #fff; }
.hikaye-basyazi { display: flex; align-items: center; gap: .6rem; padding: .7rem .8rem; color: #fff; }
.hikaye-basyazi strong { display: block; font-size: .9rem; }
.hikaye-basyazi .yorum-yildiz .yildiz-dolu { color: #f59e0b; }
.hikaye-basyazi .yorum-yildiz .yildiz-bos { color: rgba(255,255,255,.4); }
.hikaye-foto-kap { flex: 1; display: grid; place-items: center; overflow: hidden; }
.hikaye-foto { width: 100%; height: 100%; object-fit: cover; cursor: pointer; }
.hikaye-metin {
    position: absolute; inset-inline: 0; bottom: 0; padding: 2.5rem 1rem 1rem; color: #fff;
    background: linear-gradient(transparent, rgba(0,0,0,.75));
}
.hikaye-metin strong { display: block; margin-bottom: .2rem; }
.hikaye-metin p { margin: 0 0 .3rem; font-size: .92rem; line-height: 1.5; max-height: 8em; overflow: hidden; }
.hikaye-metin small { opacity: .8; font-size: .76rem; }
.hikaye-kapat {
    position: absolute; top: 1rem; inset-inline-end: 1rem; z-index: 3;
    background: rgba(0,0,0,.4); border: 0; color: #fff; cursor: pointer;
    width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center;
}
.hikaye-gez {
    position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
    background: rgba(255,255,255,.15); border: 0; color: #fff; cursor: pointer;
    width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center;
}
.hikaye-onceki { inset-inline-start: max(1rem, calc(50vw - 300px)); }
.hikaye-sonraki { inset-inline-end: max(1rem, calc(50vw - 300px)); }
@media (max-width: 560px) {
    .hikaye-gez { display: none; }
    .hikaye-sahne { width: 100vw; height: 100vh; border-radius: 0; }
}

/* =====================================================================
   Teklif sonuç ekranı (F036) — tema uyumlu, ikonlu
   ===================================================================== */
.teklif-sonuc {
    max-width: 560px; margin: 2rem auto; text-align: center;
    background: var(--c-background); border: 1px solid var(--c-border);
    border-radius: var(--radius, 18px); padding: 2.5rem 2rem;
    box-shadow: 0 10px 40px rgba(15,23,42,.06);
}
.teklif-sonuc-ikon {
    display: grid; place-items: center; width: 76px; height: 76px; margin: 0 auto 1.25rem;
    border-radius: 50%; color: var(--c-primary);
    background: color-mix(in srgb, var(--c-primary) 12%, transparent);
}
.teklif-sonuc.basarili .teklif-sonuc-ikon { color: #059669; background: color-mix(in srgb, #059669 14%, transparent); }
.teklif-sonuc h1 { margin-bottom: .5rem; }
.teklif-sonuc-metin { color: var(--c-muted); line-height: 1.65; }
.teklif-pnr {
    display: inline-flex; flex-direction: column; gap: .2rem; margin: 1.25rem 0;
    padding: .75rem 1.5rem; border-radius: 12px;
    background: color-mix(in srgb, #059669 12%, transparent); color: #065f46;
}
.teklif-pnr small { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; opacity: .8; }
.teklif-pnr strong { font-size: 1.35rem; letter-spacing: .08em; }
.teklif-no { color: var(--c-muted); font-size: .9rem; }
.teklif-sonuc-eylem { display: flex; gap: .6rem; justify-content: center; flex-wrap: wrap; margin-top: 1.5rem; }

/* ---------- Footer iletişim sütunu (ikonlu, modern) ---------- */
.altbar-iletisim .altbar-aciklama { opacity: .8; font-size: .88rem; line-height: 1.6; margin-bottom: 1rem; }
.altbar-iletisim-liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .7rem; }
.altbar-iletisim-liste li { display: flex; align-items: flex-start; gap: .6rem; font-size: .9rem; }
.altbar-iletisim-liste a { color: inherit; }
.altbar-iletisim-liste a:hover { color: var(--c-primary); }
.altbar-ikon {
    flex: 0 0 auto; display: grid; place-items: center; width: 30px; height: 30px;
    border-radius: 8px; background: rgba(255,255,255,.08); color: currentColor; opacity: .95;
}

/* =====================================================================
   Villa yorum yap formu (F064)
   ===================================================================== */
.yorum-yap-blok { border-top: 1px solid var(--c-border); padding-top: 1.75rem; margin-top: 1.75rem; }
.yorum-form { max-width: 720px; }
.yorum-form .alan-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.yorum-form .form-satir { margin-bottom: 1rem; }
.yorum-form label { display: block; font-weight: 600; font-size: .9rem; margin-bottom: .35rem; }
.yorum-form input[type="text"], .yorum-form input[type="email"], .yorum-form select, .yorum-form textarea {
    width: 100%; padding: .6rem .75rem; font: inherit; font-size: .95rem;
    border: 1px solid var(--c-border); border-radius: 10px; background: var(--c-background); color: var(--c-text);
}
.yorum-form input:focus, .yorum-form select:focus, .yorum-form textarea:focus { outline: none; border-color: var(--c-primary); }
.yorum-form .onay label { font-weight: 400; display: flex; gap: .5rem; align-items: flex-start; font-size: .88rem; }
.yorum-form .onay input { width: 18px; height: 18px; margin-top: .1rem; accent-color: var(--c-primary); }
.yorum-form-satir { margin-bottom: 1rem; }

/* Yıldız seçici (ters sıralı radio hilesi) */
.yildiz-secici { display: inline-flex; flex-direction: row-reverse; justify-content: flex-end; gap: .1rem; }
.yildiz-secici input { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; }
.yildiz-secici label { cursor: pointer; color: var(--c-border); display: inline-flex; margin: 0; }
.yildiz-secici input:checked ~ label,
.yildiz-secici label:hover,
.yildiz-secici label:hover ~ label { color: #f59e0b; }
.yildiz-secici input:checked ~ label svg,
.yildiz-secici label:hover svg,
.yildiz-secici label:hover ~ label svg { fill: #f59e0b; }
.yildiz-secici input:focus-visible + label { outline: 2px solid var(--c-primary); border-radius: 4px; }

@media (max-width: 560px) { .yorum-form .alan-izgara { grid-template-columns: 1fr; } }

/* =====================================================================
   SSS sayfası (F050) — kategori pill menü + akordiyon
   ===================================================================== */
.sss-sayfa .bolum-baslik { text-align: center; margin-bottom: 2rem; }
.sss-kategori-menu {
    display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center;
    position: sticky; top: 76px; z-index: 10; padding: .75rem 0; margin-bottom: 1.5rem;
    background: color-mix(in srgb, var(--c-background) 88%, transparent); backdrop-filter: blur(6px);
}
.sss-kategori-menu a {
    padding: .45rem 1rem; border-radius: 999px; font-size: .88rem; font-weight: 600;
    background: var(--c-surface); color: var(--c-text); border: 1px solid var(--c-border);
}
.sss-kategori-menu a:hover { background: var(--c-primary); color: #fff; border-color: var(--c-primary); text-decoration: none; }

.sss-grup { max-width: 820px; margin: 0 auto 2.5rem; scroll-margin-top: 130px; }
.sss-grup > h2 { display: flex; align-items: center; gap: .5rem; font-size: 1.35rem; margin-bottom: 1rem; padding-bottom: .5rem; border-bottom: 2px solid var(--c-border); }

.akordiyon { display: flex; flex-direction: column; gap: .75rem; }
.akordiyon-oge {
    border: 1px solid var(--c-border); border-radius: 14px; background: var(--c-background);
    overflow: hidden; transition: border-color .2s, box-shadow .2s;
}
.akordiyon-oge[open] { border-color: color-mix(in srgb, var(--c-primary) 45%, var(--c-border)); box-shadow: 0 6px 20px rgba(15,23,42,.06); }
.akordiyon-oge summary {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    padding: 1.1rem 1.25rem; cursor: pointer; font-weight: 600; color: var(--c-text); list-style: none;
}
.akordiyon-oge summary::-webkit-details-marker { display: none; }
.akordiyon-oge summary::after {
    content: '+'; flex: 0 0 auto; font-size: 1.4rem; font-weight: 400; color: var(--c-primary);
    transition: transform .2s; line-height: 1;
}
.akordiyon-oge[open] summary::after { transform: rotate(45deg); }
.akordiyon-oge summary:hover { color: var(--c-primary); }
.akordiyon-govde { padding: 0 1.25rem 1.25rem; color: var(--c-text-soft, #64748b); line-height: 1.7; }
.akordiyon-govde :is(p, ul, ol):first-child { margin-top: 0; }
.akordiyon-govde :is(p, ul, ol):last-child { margin-bottom: 0; }
.sss-oy {
    display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
    margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--c-border); font-size: .85rem;
}
.sss-oy span { color: var(--c-muted); }

/* =====================================================================
   Blog — üst şerit (arama + kategoriler yatay), tam genişlik yazılar
   ===================================================================== */
.blog-liste .bolum-baslik { text-align: center; margin-bottom: 1.5rem; }
.blog-ust {
    display: flex; flex-direction: column; gap: 1rem; align-items: center;
    margin-bottom: 2rem;
}
.blog-ust .blog-arama { display: flex; gap: .5rem; width: 100%; max-width: 560px; }
.blog-ust .blog-arama input {
    flex: 1; min-width: 0; padding: .7rem 1rem; font: inherit;
    border: 1px solid var(--c-border); border-radius: 999px; background: var(--c-background); color: var(--c-text);
}
.blog-ust .blog-arama input:focus { outline: none; border-color: var(--c-primary); }
.blog-ust .blog-arama .dugme { border-radius: 999px; }

.blog-kategori-serit { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; }
.blog-kategori-serit a {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .45rem 1rem; border-radius: 999px; font-size: .88rem; font-weight: 600;
    background: var(--c-surface); color: var(--c-text); border: 1px solid var(--c-border);
}
.blog-kategori-serit a:hover { border-color: var(--c-primary); color: var(--c-primary); text-decoration: none; }
.blog-kategori-serit a.aktif { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.blog-kategori-serit .serit-sayi {
    font-size: .72rem; font-weight: 700; padding: .05rem .4rem; border-radius: 999px;
    background: color-mix(in srgb, currentColor 15%, transparent);
}
.blog-etiket-alan { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid var(--c-border); text-align: center; }
.blog-etiket-alan h3 { font-size: 1rem; margin-bottom: .8rem; }
.blog-etiket-alan .etiket-bulutu { justify-content: center; }

/* =====================================================================
   Harita sayfası — modern düzen + araç çubuğu (F048)
   ===================================================================== */
.harita-sayfa { display: flex; flex-direction: column; height: calc(100vh - 68px); }
.harita-arac-cubugu { flex: 0 0 auto; padding-block: .85rem 1rem; border-bottom: 1px solid var(--c-border); }
.harita-duzen { flex: 1; min-height: 0; height: auto; }

/* Araç çubuğu — arama + kontroller */
.harita-arac-cubugu .arama-kutusu { box-shadow: none; border: 1px solid var(--c-border); margin-bottom: .75rem; }
.harita-araclar {
    display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
}
.harita-araclar .filtre-secenek {
    display: inline-flex; align-items: center; gap: .5rem; margin: 0;
    padding: .35rem .7rem; border: 1px solid var(--c-border); border-radius: 999px;
    font-size: .85rem; background: var(--c-background); white-space: nowrap;
}
.harita-araclar .filtre-secenek input[type="checkbox"] { accent-color: var(--c-primary); }
.harita-araclar select[data-mesafe-filtre] {
    border: 0; background: none; font: inherit; font-size: .85rem; font-weight: 600;
    color: var(--c-primary); cursor: pointer; padding: 0 .2rem;
}
.harita-araclar select[data-mesafe-filtre]:focus { outline: none; }
/* Katman geçişi — segmented control */
.harita-araclar .dugme[data-katman] { padding: .4rem .9rem; font-size: .82rem; border-radius: 999px; }
.harita-araclar .dugme[data-katman].aktif { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.harita-araclar .dugme[data-cizim], .harita-araclar a.dugme { padding: .4rem .9rem; font-size: .82rem; border-radius: 999px; }
.harita-araclar a.dugme[href] { margin-inline-start: auto; }

@media (max-width: 860px) {
    .harita-sayfa { height: auto; }
    .harita-duzen { display: block; }
    .harita-liste { order: 0; border-inline-end: 0; max-height: none; }
    #harita { height: 55vh; }
    .harita-araclar a.dugme[href] { margin-inline-start: 0; }
}

/* =====================================================================
   İletişim formu — modern alanlar (label üstte, çerçeveli input)
   ===================================================================== */
.iletisim-form .form-satir { display: block; margin-bottom: 1.1rem; }
.iletisim-form .form-satir.ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.iletisim-form label {
    display: block; font-weight: 600; font-size: .88rem; margin-bottom: .4rem; color: var(--c-text);
}
.iletisim-form label span[aria-hidden] { color: #e11d48; }
.iletisim-form input[type="text"],
.iletisim-form input[type="tel"],
.iletisim-form input[type="email"],
.iletisim-form input[type="date"],
.iletisim-form input[type="number"],
.iletisim-form select,
.iletisim-form textarea {
    width: 100%; padding: .72rem .9rem; font: inherit; font-size: .95rem;
    border: 1px solid var(--c-border); border-radius: 12px;
    background: var(--c-background); color: var(--c-text); transition: border-color .15s, box-shadow .15s;
}
.iletisim-form input:focus,
.iletisim-form select:focus,
.iletisim-form textarea:focus {
    outline: none; border-color: var(--c-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--c-primary) 18%, transparent);
}
.iletisim-form input::placeholder, .iletisim-form textarea::placeholder { color: var(--c-muted); opacity: .8; }
.iletisim-form textarea { resize: vertical; min-height: 120px; }
.iletisim-form .form-satir.onay { background: var(--c-surface); border-radius: 12px; padding: .9rem 1rem; }
.iletisim-form .form-satir.onay label {
    display: flex; align-items: flex-start; gap: .6rem; font-weight: 400; font-size: .88rem; margin: 0; line-height: 1.5;
}
.iletisim-form .form-satir.onay input[type="checkbox"] {
    width: 18px; height: 18px; margin-top: .1rem; flex: 0 0 auto; accent-color: var(--c-primary);
}
.iletisim-form small.hata { display: block; color: #e11d48; font-size: .8rem; margin-top: .3rem; }
.iletisim-form > button[type="submit"] { width: 100%; padding: .85rem; font-size: 1rem; margin-top: .5rem; }

/* =====================================================================
   Anasayfa HERO — tam ekran, yatay arama, tip kartları (referans tasarım)
   ===================================================================== */
.hero-ana { min-height: 100vh; display: block; }
.hero-ana::after { background: linear-gradient(180deg, rgba(15,23,42,.28) 0%, rgba(15,23,42,.15) 45%, rgba(15,23,42,.45) 100%); }
.hero-govde {
    position: relative; z-index: 2; display: flex; flex-direction: column;
    min-height: 100vh; padding: 128px 1.25rem 6.5rem; gap: 1.75rem;
}

/* Orta blok — üst yazı, başlık, arama */
.hero-orta { text-align: center; }
.hero-eyebrow { color: #fff; font-size: 1.05rem; font-weight: 500; opacity: .95; margin: 0 0 .5rem; line-height: 1.4; text-shadow: 0 1px 8px rgba(0,0,0,.4); }
.hero-ana h1 { color: #fff; font-size: clamp(2rem, 4.5vw, 3.2rem); margin: 0 0 1.75rem; text-shadow: 0 2px 16px rgba(0,0,0,.4); }

/* Yatay arama çubuğu */
.hero-arama {
    display: flex; align-items: stretch; gap: 0; max-width: 780px; margin: 0 auto;
    background: #fff; border-radius: 999px; padding: .55rem .55rem .55rem 1.25rem;
    box-shadow: 0 18px 50px rgba(0,0,0,.28);
}
.hero-arama-seg {
    display: flex; align-items: center; gap: .55rem; padding: .35rem 1.1rem; flex: 1;
    border-inline-end: 1px solid #e5e9f0; color: #64748b; position: relative;
}
.hero-arama-seg:first-child { padding-inline-start: 0; }
.hero-arama-seg svg { flex: 0 0 auto; color: #f59e0b; }
.hero-arama-seg input {
    width: 100%; min-width: 0; border: 0; background: none; font: inherit; font-size: .95rem;
    color: #0f172a; padding: 0; outline: none;
}
.hero-arama-seg input::placeholder { color: #94a3b8; }
.hero-arama-tarih { flex: 1.3; }
.hero-arama-tarih input { width: auto; flex: 1; }
.hero-arama-tarih span { color: #cbd5e1; }
.hero-arama-btn {
    flex: 0 0 auto; width: 54px; height: 54px; border-radius: 50%; border: 0; cursor: pointer;
    background: #f59e0b; color: #fff; display: grid; place-items: center; margin-inline-start: .5rem;
    transition: filter .15s, transform .15s;
}
.hero-arama-btn:hover { filter: brightness(1.08); transform: scale(1.05); }
.hero-arama .oneri-liste { top: calc(100% + 14px); border-radius: 14px; }

.hero-tum {
    display: inline-flex; align-self: center; margin-top: 1.25rem;
    background: rgba(255,255,255,.95); color: #0f172a; border: 0; font-weight: 600; padding: .7rem 1.6rem;
}
.hero-tum:hover { background: #fff; }

/* Villa tipi kartları */
/* Referans: etiket SOLDA, kartlar sağda EŞİT genişlikte tek sıra */
.hero-tipler { display: flex; align-items: center; gap: 1.75rem; margin-top: auto; }
.hero-tipler-etiket { flex: 0 0 auto; color: #fff; font-size: 1.35rem; font-weight: 700; line-height: 1.2; text-shadow: 0 2px 10px rgba(0,0,0,.4); }
.hero-tip-kartlar { display: flex; gap: .85rem; flex: 1; min-width: 0; }
.hero-tip-kart {
    flex: 1 1 0; min-width: 0; display: flex; align-items: center; gap: .7rem;
    background: #fff; border-radius: 14px; padding: 1rem 1.1rem; color: #0f172a; font-weight: 600;
    font-size: .86rem; line-height: 1.25; box-shadow: 0 10px 28px rgba(0,0,0,.16); transition: transform .15s;
}
.hero-tip-kart:hover { transform: translateY(-3px); text-decoration: none; }
.hero-tip-kart svg { flex: 0 0 auto; color: var(--c-primary); }
.hero-tip-kart span { min-width: 0; }

/* Sosyal + telefon */
.hero-alt { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.5rem; flex-wrap: wrap; }
.hero-sosyal { display: flex; gap: .5rem; }
.hero-sosyal a { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: rgba(255,255,255,.2); color: #fff; }
.hero-sosyal a:hover { background: #fff; color: var(--c-primary); }
.hero-tel { display: flex; align-items: center; gap: .75rem; color: #fff; }
.hero-tel svg { color: #fff; opacity: .85; }
.hero-tel small { display: block; font-size: .78rem; opacity: .85; }
.hero-tel a { display: block; color: #fff; font-weight: 700; font-size: 1.05rem; }

/* İstatistik bandı — hero'nun altına taşar */
.hero-istatistik { margin-top: -70px; margin-bottom: 3rem; position: relative; z-index: 5; }
.istatistik-izgara { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem; }
.istatistik-kart {
    display: flex; align-items: center; gap: 1rem; background: var(--c-background);
    border-radius: 16px; padding: 1.35rem 1.5rem; box-shadow: 0 12px 40px rgba(15,23,42,.1);
}
.istatistik-ikon { flex: 0 0 auto; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 14px; background: color-mix(in srgb, var(--c-primary) 12%, transparent); color: var(--c-primary); }
.istatistik-kart strong { display: block; font-size: 1.35rem; color: var(--c-text); line-height: 1.1; }
.istatistik-kart small { color: var(--c-muted); font-size: .85rem; }

@media (max-width: 960px) {
    .hero-arama { flex-wrap: wrap; border-radius: 24px; padding: 1rem; gap: .5rem; }
    .hero-arama-seg { flex: 1 1 100%; border-inline-end: 0; border-bottom: 1px solid #e5e9f0; padding: .6rem .5rem; }
    .hero-arama-btn { width: 100%; border-radius: 12px; margin: 0; }
    .hero-tipler { flex-direction: column; align-items: stretch; gap: .85rem; }
    .hero-tip-kartlar { flex-wrap: wrap; }
    .hero-tip-kart { flex: 1 1 140px; }
    .istatistik-izgara { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
    .hero-govde { padding-top: 100px; }
    .istatistik-izgara { grid-template-columns: 1fr; }
    .hero-istatistik { margin-top: -30px; }
}

/* =====================================================================
   Hero — video arka plan + modern arama popup (tarih/kişi) + kampanyalar
   ===================================================================== */
.hero-video { position: absolute; inset: 0; overflow: hidden; z-index: 0; }
.hero-video iframe {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.78vh; border: 0; pointer-events: none;
}
video.hero-gorsel { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* Arama segmentleri açılır panel */
.hero-pop { position: relative; }
.hero-pop-tetik {
    width: 100%; min-width: 0; border: 0; background: none; font: inherit; font-size: .95rem;
    color: #0f172a; cursor: pointer; text-align: start; padding: 0; white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
}
.hero-pop-panel {
    position: absolute; top: calc(100% + 18px); inset-inline-start: 0; z-index: 40;
    background: #fff; border-radius: 18px; box-shadow: 0 24px 60px rgba(15,23,42,.28);
    padding: 1.1rem; display: none; color: #0f172a;
}
.hero-pop.acik .hero-pop-panel { display: block; }

/* Kişi sayacı */
.hero-kisi-panel { min-width: 280px; }
.kisi-satir { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; }
.kisi-satir + .kisi-satir { border-top: 1px solid #eef1f5; }
.kisi-satir strong { display: block; color: #0f172a; font-size: .95rem; }
.kisi-satir small { color: #94a3b8; font-size: .76rem; }
.stepper { display: flex; align-items: center; gap: .8rem; }
.stepper button {
    width: 36px; height: 36px; border-radius: 50%; border: 1.5px solid #cbd5e1; background: #fff;
    color: #0f172a; font-size: 1.15rem; cursor: pointer; display: grid; place-items: center; line-height: 1;
}
.stepper button:hover { border-color: var(--c-primary); color: var(--c-primary); }
.stepper span { min-width: 22px; text-align: center; font-weight: 700; }

/* Tarih aralığı takvimi (çift ay) */
.hero-takvim { min-width: 640px; }
.hero-takvim .tv-ust { display: flex; justify-content: space-between; margin-bottom: -1.9rem; position: relative; z-index: 2; }
.hero-takvim .tv-nav { width: 34px; height: 34px; border-radius: 50%; border: 1px solid #e5e9f0; background: #fff; cursor: pointer; font-size: 1.05rem; color: #0f172a; }
.hero-takvim .tv-nav:hover { border-color: var(--c-primary); color: var(--c-primary); }
.hero-takvim .tv-aylar { display: flex; gap: 1.75rem; }
.hero-takvim .tv-ay { flex: 1; }
.hero-takvim .tv-baslik { text-align: center; font-weight: 700; margin-bottom: .5rem; color: #0f172a; font-size: .95rem; }
.hero-takvim .tv-izgara { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.hero-takvim .tv-gunad { text-align: center; font-size: .7rem; color: #94a3b8; padding: .25rem 0; font-weight: 600; }
.hero-takvim .tv-gun { aspect-ratio: 1; border: 0; background: none; border-radius: 9px; cursor: pointer; font: inherit; font-size: .85rem; color: #0f172a; }
.hero-takvim .tv-gun:hover:not(.pasif):not(:disabled) { background: #f1f5f9; }
.hero-takvim .tv-gun.pasif, .hero-takvim .tv-gun:disabled { color: #cbd5e1; cursor: default; }
.hero-takvim .tv-gun.aralik { background: color-mix(in srgb, var(--c-primary) 14%, transparent); border-radius: 0; }
.hero-takvim .tv-gun.sec { background: var(--c-primary); color: #fff; font-weight: 700; }

/* Kampanyalar — ikili kartlar */
.kampanya-ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; }
.kampanya-kart {
    position: relative; display: block; border-radius: 18px; overflow: hidden; min-height: 210px;
    color: #fff; background-size: cover; background-position: center; background-image: var(--kmp-gorsel);
    box-shadow: 0 10px 30px rgba(15,23,42,.1);
}
.kampanya-perde { position: absolute; inset: 0; background: linear-gradient(120deg, rgba(15,23,42,.78), rgba(15,23,42,.12)); }
.kampanya-ic { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; gap: .45rem; padding: 1.6rem; height: 100%; justify-content: flex-end; min-height: 210px; }
.kampanya-ic strong { font-size: 1.35rem; line-height: 1.15; }
.kampanya-rozet { background: #f59e0b; color: #fff; font-size: .72rem; font-weight: 700; padding: .22rem .65rem; border-radius: 999px; text-transform: uppercase; letter-spacing: .02em; }
.kampanya-metin { font-size: .9rem; opacity: .92; }
.kampanya-btn { display: inline-flex; align-items: center; gap: .35rem; font-weight: 700; margin-top: .35rem; }
.kampanya-kart:hover { text-decoration: none; transform: translateY(-3px); transition: transform .2s; }

/* Kampanya — yatay bant */
.bolum-kampanya-yatay { padding-block: 1rem 2.5rem; }
.kampanya-yatay {
    position: relative; display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
    border-radius: 22px; overflow: hidden; min-height: 190px; padding: 2.25rem 2.75rem; color: #fff;
    background-size: cover; background-position: center; background-image: var(--kmp-gorsel); box-shadow: 0 14px 40px rgba(15,23,42,.14);
}
.kampanya-yatay .kampanya-perde { background: linear-gradient(100deg, rgba(15,23,42,.8) 30%, rgba(15,23,42,.1)); }
.kampanya-yatay-ic { position: relative; z-index: 2; max-width: 62%; }
.kampanya-yatay-ic strong { display: block; font-size: 1.7rem; margin: .35rem 0; line-height: 1.15; }
.kampanya-yatay .kampanya-btn.birincil { position: relative; z-index: 2; background: #fff; color: var(--c-primary); padding: .75rem 1.5rem; border-radius: 999px; white-space: nowrap; }
.kampanya-yatay:hover { text-decoration: none; }

@media (max-width: 960px) {
    .hero-takvim { min-width: 300px; }
    .hero-takvim .tv-aylar { flex-direction: column; gap: 1rem; }
    .hero-takvim .tv-ay-ikinci { display: none; }
    .hero-pop-panel { position: fixed; inset-inline: 1rem; inset-block-start: auto; width: auto; }
}
@media (max-width: 768px) {
    .kampanya-ikili { grid-template-columns: 1fr; }
    .kampanya-yatay { flex-direction: column; text-align: center; align-items: center; }
    .kampanya-yatay-ic { max-width: 100%; }
}

/* Kampanya detay modalı */
.kampanya-modal[hidden] { display: none; }
.kampanya-modal {
    position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
    background: rgba(15,23,42,.7); backdrop-filter: blur(4px); padding: 1.25rem;
}
.kampanya-modal-kutu {
    background: var(--c-background); border-radius: 20px; overflow: hidden; max-width: 520px; width: 100%;
    position: relative; box-shadow: 0 30px 70px rgba(0,0,0,.4); animation: popup-in .3s cubic-bezier(.16,1,.3,1);
}
.kampanya-modal-kapat {
    position: absolute; top: .75rem; inset-inline-end: .75rem; z-index: 3; width: 36px; height: 36px;
    border-radius: 50%; border: 0; background: rgba(15,23,42,.55); color: #fff; cursor: pointer; display: grid; place-items: center;
}
.kampanya-modal-gorsel { position: relative; background: var(--c-surface); }
.kampanya-modal-gorsel img { width: 100%; height: 240px; object-fit: cover; display: block; }
.kampanya-modal-gorsel .kampanya-rozet { position: absolute; top: 1rem; inset-inline-start: 1rem; }
.kampanya-modal-govde { padding: 1.75rem; }
.kampanya-modal-govde h2 { margin: 0 0 .6rem; }
.kampanya-modal-govde p { color: var(--c-muted); line-height: 1.65; margin-bottom: 1.25rem; }
.kampanya-modal-govde .dugme { display: inline-flex; align-items: center; gap: .4rem; }
/* Kart butonları link gibi görünsün (buton reset) */
button.kampanya-kart, button.kampanya-yatay { border: 0; cursor: pointer; text-align: start; font: inherit; width: 100%; }

/* =====================================================================
   Blog DETAY sayfası — okunabilir makale düzeni
   ===================================================================== */
.yazi-detay { padding-block: 2rem 3.5rem; }
.yazi-detay .yol-izi { max-width: 800px; margin-inline: auto; }
.yazi-basligi { max-width: 800px; margin: 1rem auto 1.25rem; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1.15; }
.yazi-detay .yazi-meta {
    max-width: 800px; margin: 0 auto 1.5rem; display: flex; gap: 1rem; align-items: center;
    flex-wrap: wrap; color: var(--c-muted); font-size: .9rem; border: 0; padding: 0;
}
.yazar { display: inline-flex; align-items: center; gap: .5rem; font-weight: 600; color: var(--c-text); }
.yazi-kapak-buyuk {
    max-width: 1000px; margin: 0 auto 2rem; border-radius: 18px; overflow: hidden; background: var(--c-surface);
}
.yazi-kapak-buyuk img { width: 100%; height: auto; max-height: 480px; object-fit: cover; display: block; }

/* Makale gövdesi — prose */
.icerik-govde { max-width: 760px; margin: 0 auto; font-size: 1.08rem; line-height: 1.8; color: var(--c-text); }
.icerik-govde > *:first-child { margin-top: 0; }
.icerik-govde h2 { font-size: 1.6rem; margin: 2rem 0 .8rem; }
.icerik-govde h3 { font-size: 1.3rem; margin: 1.75rem 0 .6rem; }
.icerik-govde p { margin: 0 0 1.25rem; }
.icerik-govde a { color: var(--c-primary); text-decoration: underline; }
.icerik-govde ul, .icerik-govde ol { margin: 0 0 1.25rem; padding-inline-start: 1.5rem; }
.icerik-govde li { margin-bottom: .5rem; }
.icerik-govde img { max-width: 100%; height: auto; border-radius: 12px; margin: 1.5rem 0; }
.icerik-govde blockquote {
    margin: 1.5rem 0; padding: .75rem 1.25rem; border-inline-start: 4px solid var(--c-primary);
    background: var(--c-surface); border-radius: 0 10px 10px 0; color: var(--c-muted); font-style: italic;
}
.icerik-govde table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; }
.icerik-govde th, .icerik-govde td { border: 1px solid var(--c-border); padding: .6rem .8rem; text-align: start; }
.icerik-govde code { background: var(--c-surface); padding: .1rem .35rem; border-radius: 5px; font-size: .9em; }

/* İlgili yazılar */
.ilgili-yazilar { max-width: 1000px; margin: 3rem auto 0; padding-top: 2rem; border-top: 1px solid var(--c-border); }
.ilgili-yazilar > h2 { font-size: 1.4rem; margin-bottom: 1.25rem; text-align: center; }

/* ---------- Villa galeri butonları + "+N daha" + lightbox ---------- */
.galeri .galeri-oge { padding: 0; border: 0; cursor: pointer; background: none; position: relative; overflow: hidden; }
.galeri .galeri-oge img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 4/3; transition: transform .3s; }
.galeri .galeri-oge:hover img { transform: scale(1.04); }
.galeri .galeri-oge:first-child { grid-row: span 2; }
.galeri .galeri-oge:first-child img { aspect-ratio: 1; }
.galeri-daha {
    position: absolute; inset: 0; display: grid; place-items: center;
    background: rgba(15,23,42,.55); color: #fff; font-weight: 700; font-size: 1.1rem;
}
.galeri-lightbox[hidden] { display: none; }
.galeri-lightbox {
    position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,.92); padding: 1rem;
}
.gl-sahne { margin: 0; max-width: 92vw; max-height: 88vh; text-align: center; }
.gl-sahne img { max-width: 92vw; max-height: 82vh; object-fit: contain; border-radius: 8px; }
.gl-sayac { color: #fff; margin-top: .75rem; font-size: .9rem; opacity: .85; }
.gl-kapat { position: absolute; top: 1rem; inset-inline-end: 1.25rem; background: rgba(255,255,255,.15); border: 0; color: #fff; width: 44px; height: 44px; border-radius: 50%; font-size: 1.6rem; cursor: pointer; }
.gl-gez { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.15); border: 0; color: #fff; width: 52px; height: 52px; border-radius: 50%; font-size: 2rem; cursor: pointer; }
.gl-gez:hover, .gl-kapat:hover { background: rgba(255,255,255,.3); }
.gl-onceki { inset-inline-start: 1.25rem; }
.gl-sonraki { inset-inline-end: 1.25rem; }
@media (max-width: 560px) { .gl-gez { width: 40px; height: 40px; font-size: 1.5rem; } }

/* ---------- Villa: Havuz ölçüleri + Bilgilendirme ---------- */
.olcu-izgara { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 1rem; }
.olcu-kart { display: flex; flex-direction: column; align-items: center; gap: .3rem; padding: 1.25rem 1rem; border: 1px solid var(--c-border); border-radius: 14px; text-align: center; }
.olcu-kart svg { color: var(--c-primary); }
.olcu-kart strong { font-size: 1.25rem; }
.olcu-kart span { color: var(--c-muted); font-size: .85rem; }
.bilgi-liste { list-style: none; margin: 0 0 1rem; padding: 0; }
.bilgi-liste li { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .8rem 0; border-bottom: 1px solid var(--c-border); }
.bilgi-liste li:last-child { border-bottom: 0; }
.bilgi-liste span { color: var(--c-muted); }
.bilgi-liste strong { font-size: 1.05rem; }
.bilgi-iptal { padding-top: .5rem; }
.bilgi-iptal h3 { font-size: 1.05rem; margin-bottom: .4rem; }
.bilgi-iptal p { color: var(--c-text-soft, #64748b); line-height: 1.7; }

/* ------------------------------------------------------------------ */
/* Site flash bildirim bandı (login / kayıt / profil geri bildirimi)  */
/* ------------------------------------------------------------------ */
/* Yüzen toast — sağ üstte açılır, kendiliğinden kaybolur */
.site-bildirimler {
    position: fixed;
    top: 1rem;
    inset-inline-end: 1rem;
    z-index: 1200;
    width: min(400px, calc(100vw - 2rem));
    margin: 0;
    pointer-events: none;
}
.site-bildirimler .kap { display: flex; flex-direction: column; gap: .6rem; padding: 0; max-width: none; }
.site-bildirim {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .95rem 2.75rem .95rem 1.05rem;
    border-radius: 14px;
    border: 1px solid transparent;
    font-size: .95rem;
    line-height: 1.5;
    box-shadow: 0 12px 30px rgba(15, 23, 42, .18);
    pointer-events: auto;
    animation: toast-gir .32s cubic-bezier(.16,.84,.44,1);
}
.site-bildirim.kapaniyor { animation: toast-cik .3s ease forwards; }
@keyframes toast-gir { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: none; } }
@keyframes toast-cik { to { opacity: 0; transform: translateX(24px); } }
.site-bildirim span { flex: 1; }
.site-bildirim strong { display: block; margin-bottom: .2rem; }
.site-bildirim ul { margin: .35rem 0 0; padding-left: 1.1rem; }
.site-bildirim li { margin: .15rem 0; }
.site-bildirim-basari { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
/* Hata/uyarı → sarı amber badge (kullanıcı isteği) */
.site-bildirim-hata,
.site-bildirim-uyari  { background: #fffbeb; border-color: #fcd34d; color: #92400e; }
.site-bildirim-bilgi  { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
.site-bildirim-kapat {
    position: absolute;
    top: .55rem;
    right: .6rem;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    opacity: .6;
    transition: opacity .15s;
}
.site-bildirim-kapat:hover { opacity: 1; }

/* ------------------------------------------------------------------ */
/* Favoriler — karşılaştır + paylaşım araç çubuğu (F049)              */
/* ------------------------------------------------------------------ */
.favori-araclar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.75rem;
    background: var(--c-surface, #f8fafc);
    border: 1px solid var(--c-border, #e2e8f0);
    border-radius: var(--radius, 14px);
}
.favori-araclar .satir-ici {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .55rem;
    margin: 0;
}
.favori-araclar .satir-ici input[type="text"] {
    min-width: 200px;
    padding: .6rem .85rem;
    border: 1px solid var(--c-border, #e2e8f0);
    border-radius: var(--radius, 10px);
    background: var(--c-background, #fff);
    color: var(--c-text, #0f172a);
    font: inherit;
    font-size: .92rem;
}
.favori-araclar .satir-ici input[type="text"]:focus {
    outline: none;
    border-color: var(--c-primary, #0f766e);
    box-shadow: 0 0 0 3px rgba(15, 118, 110, .12);
}

.paylasim-sonuc {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem;
    padding: 1.1rem 1.25rem;
    margin-bottom: 1.75rem;
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-radius: var(--radius, 14px);
}
.paylasim-sonuc[hidden] { display: none; }
.paylasim-sonuc p { width: 100%; margin: 0 0 .2rem; font-weight: 600; color: #065f46; }
.paylasim-sonuc input[data-paylasim-url] {
    flex: 1 1 260px;
    min-width: 0;
    padding: .6rem .85rem;
    border: 1px solid #6ee7b7;
    border-radius: var(--radius, 10px);
    background: #fff;
    color: var(--c-text, #0f172a);
    font: inherit;
    font-size: .9rem;
}
.paylasim-sonuc .dugme { white-space: nowrap; }

@media (max-width: 640px) {
    .favori-araclar { flex-direction: column; align-items: stretch; }
    .favori-araclar > .dugme { text-align: center; }
    .favori-araclar .satir-ici { flex-direction: column; align-items: stretch; }
    .favori-araclar .satir-ici input[type="text"],
    .favori-araclar .satir-ici .dugme { width: 100%; }
}

/* ================================================================== */
/* Villa detay — mobil düzeltmeler (galeri, başlık, özellikler)       */
/* Dosya sonunda: base kuralları eşit özgüllükte geçersiz kılar.      */
/* ================================================================== */
@media (max-width: 768px) {
    /* Galeri: ilk foto tam genişlik, diğerleri 2'li ızgara (alt alta değil) */
    .galeri { grid-template-columns: 1fr 1fr; gap: .45rem; }
    .galeri .galeri-oge:first-child { grid-column: 1 / -1; grid-row: auto; }
    .galeri .galeri-oge:first-child img { aspect-ratio: 16 / 10; }
    .galeri .galeri-oge img { aspect-ratio: 1 / 1; }

    /* Başlık + konum solda, kalp SAĞ ÜSTTE kalır — dikey yığılıp boşluk bırakmaz */
    .detay-baslik {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between;
        gap: .75rem;
        margin-block: 1.25rem .75rem;
    }
    .detay-baslik > div { min-width: 0; flex: 1; }
    .detay-baslik h1 { font-size: 1.4rem; line-height: 1.25; }
    .detay-baslik .villa-konum { font-size: .88rem; }
    .detay-baslik .ikon-dugme {
        flex: 0 0 auto; width: 42px; height: 42px;
        border: 1px solid var(--c-border); border-radius: 50%;
    }

    /* Özet (kişi/yatak/banyo/m²) tek satır, eşit dağılım */
    .detay-ozet { display: flex; flex-wrap: wrap; }

    /* Özellikler: svg ikonlu kartlar 2 sütun (tek sütun kalmasın) */
    .ozellik-izgara { grid-template-columns: 1fr 1fr; gap: .55rem; }
    .ozellik { padding: .6rem .65rem; font-size: .84rem; gap: .5rem; }
    .ozellik-ikon { width: 30px; height: 30px; }
    .ozellik small { font-size: .72rem; }

    /* Blok başlıkları ve metin okunaklı hizada */
    .detay-blok { margin-bottom: 1.75rem; padding-block: 1.5rem; }
    .detay-blok > h2 { font-size: 1.2rem; margin-bottom: .85rem; }
}

/* ================================================================== */
/* MODERN FOOTER — referans (myvillacity) düzeni                      */
/* ================================================================== */
.altbar-modern {
    background: #1f2a31;
    color: #c7d0d9;
    border-top: 0;
    margin-top: 4rem;
    padding: 2.75rem 0 1.5rem;
}
.altbar-modern a { color: inherit; }
.altbar-modern h3, .altbar-modern h4, .altbar-modern strong { color: #fff; }

/* --- 1) Yardım bandı --- */
.altbar-yardim {
    position: relative; overflow: hidden;
    display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
    background: #fae3cf; color: #33271c;
    border-radius: 22px; padding: 2rem 2.5rem; margin-bottom: 3rem;
}
.altbar-yardim-metin { max-width: 640px; position: relative; z-index: 2; }
.altbar-yardim-ikon { position: relative; z-index: 2; }
.altbar-yardim h3 { font-size: 1.55rem; margin: 0 0 .45rem; color: #33271c; }
.altbar-yardim p { margin: 0 0 1.25rem; color: #7a6a5a; font-size: .96rem; }
/* Özgüllük: .altbar-modern a { color: inherit } kuralını yenmek için iki sınıf */
.altbar-modern .altbar-yardim-dugme {
    display: inline-block; background: #1f2a31; color: #fff; border: 0;
    border-radius: 999px; padding: .72rem 1.7rem; font-weight: 600; font-size: .95rem;
}
.altbar-modern .altbar-yardim-dugme:hover { background: #12191e; color: #fff; text-decoration: none; }
.altbar-yardim-ikon {
    flex: 0 0 auto; width: 86px; height: 86px; border-radius: 50%;
    background: #1f2a31; color: #fae3cf; display: grid; place-items: center;
    box-shadow: 0 10px 26px rgba(0,0,0,.18);
}

/* Fotoğraflı yardım bandı — arka plan görseli + karartma katmanı */
.altbar-yardim-fotolu { color: #fff; }
.altbar-yardim-fotolu::before {
    content: ""; position: absolute; inset: 0; z-index: 0;
    background-image: var(--yardim-foto);
    background-size: cover; background-position: center;
}
.altbar-yardim-fotolu::after {
    content: ""; position: absolute; inset: 0; z-index: 1;
    background: linear-gradient(90deg, rgba(15,21,26,.82) 0%, rgba(15,21,26,.55) 60%, rgba(15,21,26,.35) 100%);
}
.altbar-yardim-fotolu h3 { color: #fff; }
.altbar-yardim-fotolu p { color: rgba(255,255,255,.85); }
.altbar-modern .altbar-yardim-fotolu .altbar-yardim-dugme { background: #fff; color: #1f2a31; }
.altbar-modern .altbar-yardim-fotolu .altbar-yardim-dugme:hover { background: #f1f5f9; color: #1f2a31; }
.altbar-yardim-fotolu .altbar-yardim-ikon { background: rgba(255,255,255,.15); color: #fff; }

/* --- 2) Ana bölüm --- */
.altbar-ana {
    display: grid;
    grid-template-columns: 1.1fr 1.1fr 1.5fr;
    gap: 1.4rem;
    margin-bottom: 2.25rem;
}
.altbar-modern .altbar-kart {
    background: #26313a;
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 16px;
    padding: 1.75rem;
}

/* Marka kartı */
.altbar-logo { display: inline-block; margin-bottom: 1rem; }
.altbar-logo img { display: block; height: 40px; width: auto; }
.altbar-logo strong { font-size: 1.25rem; letter-spacing: .5px; }
.altbar-adres { color: #9aa6b1; font-size: .9rem; line-height: 1.6; margin: 0 0 1.1rem; }
.altbar-tel { display: flex; align-items: center; gap: .7rem; margin-bottom: .9rem; }
.altbar-tel-ikon {
    flex: 0 0 auto; width: 40px; height: 40px; border-radius: 50%;
    background: rgba(255,255,255,.07); color: #cfd8e0; display: grid; place-items: center;
}
.altbar-tel small { display: block; color: #8b97a2; font-size: .74rem; }
.altbar-tel strong { font-size: 1.02rem; }
.altbar-eposta { display: inline-block; color: #9aa6b1; font-size: .9rem; margin-bottom: 1.1rem; }
.altbar-eposta:hover { color: #fff; }
.altbar-sosyal { display: flex; gap: .55rem; margin-top: .35rem; }
.altbar-sosyal a {
    width: 36px; height: 36px; border-radius: 50%;
    border: 1px solid rgba(255,255,255,.16); color: #c7d0d9;
    display: grid; place-items: center; transition: background .18s, color .18s, border-color .18s;
}
.altbar-sosyal a:hover { background: #fff; color: #1f2a31; border-color: #fff; }
.altbar-sosyal a svg { width: 17px; height: 17px; display: block; }

/* Bağlantılar kartı */
.altbar-baglantilar { display: flex; gap: 2.5rem; }
.altbar-baglantilar h4 { font-size: .98rem; margin: 0 0 1rem; }
.altbar-baglantilar ul { list-style: none; margin: 0; padding: 0; }
.altbar-baglantilar li { margin-bottom: .6rem; }
.altbar-baglantilar a { color: #9aa6b1; font-size: .9rem; }
.altbar-baglantilar a:hover { color: #fff; }

/* Villa kategorileri */
.altbar-kategoriler { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; align-content: start; }
.altbar-kategori {
    display: flex; align-items: center; gap: .7rem;
    padding: .55rem .6rem; border-radius: 12px;
    color: #c7d0d9; transition: background .18s;
}
.altbar-kategori:hover { background: rgba(255,255,255,.05); text-decoration: none; }
.altbar-kategori-ikon {
    flex: 0 0 auto; width: 42px; height: 42px; border-radius: 12px;
    background: rgba(255,255,255,.06); color: #d6dde4;
    display: grid; place-items: center;
}
.altbar-kategori-ikon .ikon { width: 22px; height: 22px; }
.altbar-kategori span:last-child { font-size: .86rem; line-height: 1.3; font-weight: 500; }

/* --- 3) Güven satırı --- */
.altbar-guven {
    display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
    flex-wrap: wrap;
    padding: 1.5rem 0; margin-top: .5rem;
    border-top: 1px solid rgba(255,255,255,.08);
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.altbar-ssl { display: flex; align-items: center; gap: .6rem; color: #9aa6b1; font-size: .88rem; }
.altbar-ssl svg { color: #7fb895; flex: 0 0 auto; }
.altbar-modern .altbar-belge {
    display: flex; align-items: center; gap: .9rem; margin: 0; padding: 0; border: 0;
    flex-wrap: nowrap;
}
.altbar-modern .altbar-belge img { height: 60px; width: auto; border-radius: 8px; background: #fff; padding: 4px; }
.altbar-modern .altbar-belge span { color: #9aa6b1; font-size: .82rem; }
.altbar-odeme { display: flex; gap: .5rem; flex-wrap: wrap; }
.odeme-rozet {
    background: #fff; color: #1f2a31; border-radius: 6px;
    padding: .35rem .6rem; font-size: .72rem; font-weight: 800; letter-spacing: .3px;
    box-shadow: 0 1px 4px rgba(0,0,0,.2);
}

/* --- 4) Telif --- */
.altbar-modern .altbar-son {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem;
    flex-wrap: wrap; margin: 0; padding: 1.5rem 0 0; border: 0;
    color: #8b97a2; font-size: .84rem;
}
.altbar-yasal { display: flex; gap: 1.25rem; flex-wrap: wrap; }
.altbar-yasal a { color: #9aa6b1; text-decoration: underline; text-underline-offset: 3px; }
.altbar-yasal a:hover { color: #fff; }
.altbar-kredi { color: #6f7b86; font-weight: 600; letter-spacing: .5px; }
.altbar-kredi a:hover { color: #fff; }

/* --- Mobil --- */
@media (max-width: 900px) {
    .altbar-ana { grid-template-columns: 1fr 1fr; }
    .altbar-kategoriler { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .altbar-yardim { flex-direction: column; text-align: center; padding: 1.75rem 1.25rem; }
    .altbar-yardim-metin { max-width: none; }
    .altbar-ana { grid-template-columns: 1fr; }
    .altbar-kategoriler { grid-template-columns: 1fr 1fr; }
    .altbar-guven { justify-content: center; text-align: center; gap: 1.25rem; }
    .altbar-modern .altbar-son { flex-direction: column; text-align: center; gap: .75rem; }
    .altbar-yasal { justify-content: center; }
}

/* ================================================================== */
/* Villa detay — yeni bölümler (fiyat/para birimi, kurallar, dahil,    */
/* belge, oturma planı özellikleri)                                    */
/* ================================================================== */

/* Sağ sütun: rezervasyon + belge kutusu birlikte sticky */
.detay-yan { position: sticky; top: 84px; display: flex; flex-direction: column; gap: 1rem; align-self: start; }
.detay-yan .rezervasyon-kutu { position: static; top: auto; }

/* Fiyat başlığı + para birimi */
.villa-fiyat-blok { margin-bottom: 1.1rem; }
.fiyat-baslangic { margin: .1rem 0 .8rem; font-size: .8rem; color: var(--c-muted); }
.para-secici { display: inline-flex; gap: 2px; padding: 3px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 10px; }
.para-secici a {
    padding: .28rem .6rem; border-radius: 7px; font-size: .8rem; font-weight: 600;
    color: var(--c-muted); transition: background .15s, color .15s;
}
.para-secici a:hover { color: var(--c-text); text-decoration: none; }
.para-secici a.aktif { background: var(--c-primary); color: #fff; }

/* Ön ödeme bilgisi */
.on-odeme-bilgi {
    display: flex; align-items: flex-start; gap: .6rem;
    margin-top: .9rem; padding: .75rem .85rem;
    background: color-mix(in srgb, var(--c-primary) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--c-primary) 25%, transparent);
    border-radius: 12px; font-size: .86rem; line-height: 1.45;
}
.on-odeme-ikon { color: var(--c-primary); flex: 0 0 auto; margin-top: 1px; }

/* Belge kutusu */
.belge-kutu {
    display: flex; align-items: center; gap: .75rem;
    padding: .9rem 1rem; background: var(--c-background);
    border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: var(--shadow);
}
.belge-ikon { flex: 0 0 auto; color: #16a34a; }
.belge-metin { display: flex; flex-direction: column; }
.belge-metin small { color: var(--c-muted); font-size: .76rem; }
.belge-metin strong { font-size: .95rem; }

/* Fiyata dahil olanlar */
.dahil-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .55rem .9rem; }
.dahil-liste li { display: flex; align-items: center; gap: .55rem; font-size: .92rem; }
.dahil-tik { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: color-mix(in srgb, #16a34a 14%, transparent); color: #16a34a; flex: 0 0 auto; }

/* Ev kuralları */
.kural-liste { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .7rem; }
.kural-oge { display: flex; align-items: center; gap: .7rem; padding: .7rem .85rem; border: 1px solid var(--c-border); border-radius: 12px; background: var(--c-surface); }
.kural-ikon { flex: 0 0 auto; color: var(--c-text-soft, #64748b); }
.kural-ad { flex: 1; font-size: .9rem; font-weight: 500; }
.kural-durum { flex: 0 0 auto; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; }
.kural-oge.izinli .kural-durum { background: color-mix(in srgb, #16a34a 15%, transparent); color: #16a34a; }
.kural-oge.yasak .kural-durum { background: color-mix(in srgb, #dc2626 13%, transparent); color: #dc2626; }
.kural-oge.yasak .kural-ikon { color: #dc2626; }

/* Oturma planı — oda özellikleri */
.oda-ozellik-liste { list-style: none; margin: .6rem 0 0; padding: .6rem 0 0; border-top: 1px dashed var(--c-border); display: flex; flex-wrap: wrap; gap: .4rem .9rem; }
.oda-ozellik-liste li { display: flex; align-items: center; gap: .35rem; font-size: .84rem; color: var(--c-text-soft, #475569); }
.oda-ozellik-liste li .ikon { color: var(--c-primary); }

@media (max-width: 860px) {
    .detay-yan { position: static; }
}

/* ================================================================== */
/* Rezervasyon sayfası — seçilen villa kartı + modern özet            */
/* ================================================================== */
.rez-villa-kart {
    border: 1px solid var(--c-border); border-radius: 16px; overflow: hidden;
    margin-bottom: 1.5rem; background: var(--c-background);
}
.rez-villa-gorsel { aspect-ratio: 16 / 9; background: var(--c-surface); overflow: hidden; }
.rez-villa-gorsel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rez-villa-govde { padding: 1rem 1.1rem 1.15rem; }
.rez-villa-ad { font-size: 1.1rem; margin: 0 0 .3rem; line-height: 1.25; }
.rez-villa-bolge { display: flex; align-items: center; gap: .35rem; color: var(--c-muted); font-size: .85rem; margin: 0 0 .7rem; }
.rez-villa-bolge .ikon { color: var(--c-primary); }
.rez-villa-ozet { list-style: none; margin: 0 0 .85rem; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1rem; }
.rez-villa-ozet li { display: flex; align-items: center; gap: .35rem; font-size: .85rem; color: var(--c-text-soft, #475569); }
.rez-villa-ozet .ikon { color: var(--c-primary); }
.rez-villa-tarih {
    display: flex; align-items: center; gap: .75rem; justify-content: space-between;
    padding: .75rem .9rem; border-radius: 12px; background: var(--c-surface);
}
.rez-villa-tarih small { display: block; color: var(--c-muted); font-size: .72rem; }
.rez-villa-tarih strong { font-size: .92rem; }
.rez-villa-ok { color: var(--c-primary); font-size: 1.1rem; flex: 0 0 auto; }
.rez-villa-gece { text-align: center; margin: .6rem 0 0; font-size: .82rem; color: var(--c-muted); }
.rezervasyon-sayfa .fiyat-satir.toplam { font-size: 1.15rem; }

/* ===================================================================
   Villa kartı eylem butonları + Müsaitlik takvimi popup (F045 ek)
   =================================================================== */
.villa-kart-eylem { display: flex; gap: .5rem; margin-top: .7rem; }
.villa-takvim-btn {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
    padding: .5rem .6rem; font: inherit; font-size: .8rem; font-weight: 600;
    background: var(--c-surface, #f7f4ef); color: var(--c-text); cursor: pointer;
    border: 1px solid var(--c-border); border-radius: 10px;
    transition: background .15s, border-color .15s, color .15s;
}
.villa-takvim-btn:hover { background: var(--c-background); border-color: var(--c-primary, #b8895a); color: var(--c-primary, #b8895a); }
.villa-takvim-btn svg { flex-shrink: 0; }
.villa-detay-btn {
    display: inline-flex; align-items: center; justify-content: center;
    padding: .5rem .9rem; font-size: .8rem; font-weight: 700;
    background: var(--c-primary, #b8895a); color: #fff; border-radius: 10px;
    text-decoration: none; white-space: nowrap;
}
.villa-detay-btn:hover { filter: brightness(.94); }

.takvim-modal {
    position: fixed; inset: 0; z-index: 1300;
    background: rgba(20, 16, 12, .55);
    display: flex; align-items: flex-start; justify-content: center;
    padding: 4vh 1rem; overflow-y: auto; animation: takvim-fade .18s ease;
}
.takvim-modal[hidden] { display: none; }
@keyframes takvim-fade { from { opacity: 0; } to { opacity: 1; } }
.takvim-modal-ic {
    position: relative; background: var(--c-background, #fff); color: var(--c-text);
    border-radius: 18px; padding: 1.5rem 1.5rem 1.75rem;
    width: 100%; max-width: 720px; box-shadow: 0 24px 60px rgba(0,0,0,.3);
}
.takvim-kapat {
    position: absolute; top: .8rem; right: .9rem;
    background: none; border: 0; font-size: 1.6rem; line-height: 1;
    color: var(--c-muted); cursor: pointer; padding: .2rem .4rem;
}
.takvim-kapat:hover { color: var(--c-text); }

/* ÖNEMLİ: Tüm takvim içerik kuralları .takvim-modal ALTINDA scope'lanır.
   Villa detay sayfasının kendi müsaitlik takvimi de .takvim-ay / .takvim-gun /
   .takvim-aciklama / .takvim-nokta / .takvim-baslik sınıflarını kullanır; scope
   olmadan popup stilleri o takvime sızıp bozar ("iç içe" görünüm). */
.takvim-modal .takvim-baslik { margin: 0 2rem .4rem 0; font-size: 1.15rem; }
.takvim-modal .takvim-aciklama { display: flex; gap: 1.1rem; font-size: .82rem; color: var(--c-muted); margin-bottom: 1.1rem; }
.takvim-modal .takvim-aciklama span { display: inline-flex; align-items: center; gap: .4rem; }
.takvim-modal .takvim-nokta { width: 12px; height: 12px; border-radius: 4px; display: inline-block; }
.takvim-modal .takvim-nokta.musait { background: #e8f5e9; border: 1px solid #9ccc9f; }
.takvim-modal .takvim-nokta.dolu { background: #fdecea; border: 1px solid #e6a29b; }
.takvim-govde { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.2rem 1.5rem; }
.takvim-modal .takvim-ay-adi { font-weight: 700; font-size: .92rem; text-align: center; margin-bottom: .5rem; }
.takvim-modal .takvim-hafta, .takvim-modal .takvim-gunler { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.takvim-modal .takvim-gun-adi { text-align: center; font-size: .68rem; color: var(--c-muted); font-weight: 600; padding-bottom: .2rem; }
.takvim-modal .takvim-gun {
    aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
    font-size: .78rem; border-radius: 7px;
}
.takvim-modal .takvim-gun.musait { background: #e8f5e9; color: #2e7d32; }
.takvim-modal .takvim-gun.dolu { background: #fdecea; color: #b64b41; text-decoration: line-through; }
.takvim-modal .takvim-gun.gecmis { color: #cbcbcb; }
.takvim-modal .takvim-yukleniyor { grid-column: 1 / -1; text-align: center; color: var(--c-muted); padding: 2rem 0; }
@media (max-width: 560px) { .takvim-govde { grid-template-columns: 1fr; } }

/* Kategori/özellik SEO açıklama bloğu (filtre sayfaları altı) */
.kategori-seo {
    margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid var(--c-border);
    color: var(--c-text); line-height: 1.75; font-size: .95rem; max-width: 920px;
}
.kategori-seo h1, .kategori-seo h2, .kategori-seo h3, .kategori-seo h4 {
    color: var(--c-text); line-height: 1.3; margin: 1.7rem 0 .6rem; font-weight: 700;
}
.kategori-seo h1 { font-size: 1.55rem; }
.kategori-seo h2 { font-size: 1.28rem; }
.kategori-seo h3 { font-size: 1.08rem; }
.kategori-seo h4 { font-size: .98rem; }
.kategori-seo > :first-child { margin-top: 0; }
.kategori-seo p { margin: 0 0 1rem; color: var(--c-muted); }
.kategori-seo ul, .kategori-seo ol { margin: 0 0 1rem 1.2rem; color: var(--c-muted); }
.kategori-seo li { margin-bottom: .4rem; }
.kategori-seo a { color: var(--c-primary, #b8895a); }
.kategori-seo strong { color: var(--c-text); }