/* ÖRNEK VİDEO İLAN PAKETİ (20 Ekim 2026): ana sayfa örnek kartındaki rozet ve
   tam ekran oynatıcıdaki (#vbox) Video · İlan görselleri · İlan metni sekmeleri.
   Airbnb dili: beyaz kart, #222 yazı, ince gri çizgi; vurgu sitenin pembesi. */
.ok-paket{position:absolute;z-index:2;top:12px;left:12px;display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;background:rgba(255,255,255,.95);color:#222;font-size:12.5px;font-weight:700;line-height:1;box-shadow:0 2px 8px rgba(0,0,0,.18)}
.ok-paket svg{width:15px;height:15px;color:#E31C5F}
.vbox-sekme{position:absolute;z-index:3;top:calc(18px + var(--sat,0px));left:14px;display:flex;gap:2px;padding:4px;border-radius:999px;background:rgba(255,255,255,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.vbox-sekme[hidden]{display:none}
.vbox-sekme button{padding:8px 12px;border:0;border-radius:999px;background:none;color:#fff;font:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.vbox-sekme button.on{background:#fff;color:#222}
.vbox.vbox-galeri video{display:none}
.vbox-paket{width:100%;max-height:calc(100dvh - 92px - var(--sat,0px) - var(--sab,0px));margin-top:58px;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:20px 16px 24px;border-radius:18px;background:#fff;color:#222;box-shadow:0 30px 80px rgba(0,0,0,.55)}
.vbox-paket[hidden]{display:none}
.vp-ust{margin:0 0 12px;font-size:13px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;color:#6a6a6a}
.vp-sec{display:inline-flex;gap:4px;margin:0 0 14px;padding:4px;border-radius:999px;background:#f7f7f7;border:1px solid #ebebeb}
.vp-sec button{padding:7px 12px;border:0;border-radius:999px;background:none;color:#6a6a6a;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.vp-sec button small{font-size:11.5px;font-weight:500;opacity:.8}
.vp-sec button.on{background:#fff;color:#222;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.vp-liste{display:grid;grid-template-columns:1fr;gap:12px}
.vp-liste.dikey{grid-template-columns:1fr 1fr}
.vp-liste figure{margin:0}
.vp-liste img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:12px;background:#f2f2f2}
.vp-liste.dikey img{aspect-ratio:9/16}
.vp-liste figcaption{margin-top:6px;font-size:13px;font-weight:600}
.vp-not{margin:16px 0 0;padding:12px 14px;border-radius:12px;background:#f7f7f7;font-size:13.5px;line-height:19px;color:#33424f}
.vp-metin h3{margin:0 0 10px;font-size:18px;line-height:23px;font-weight:700}
.vp-aciklama{white-space:pre-line;font-size:15px;line-height:22px;color:#33424f}
@media (min-width:860px){
  .vbox.vbox-galeri .vbox-in{width:min(100%,760px)}
  .vbox-sekme{top:22px;left:22px}
  .vbox-paket{padding:24px 24px 28px;max-height:calc(100dvh - 110px);margin-top:44px}
  .vp-liste{grid-template-columns:1fr 1fr}
  .vp-liste.dikey{grid-template-columns:repeat(4,1fr)}
}

/* SADECE VİDEO DEĞİL bölümü (ana sayfa, örneklerin altı). Airbnb dili: solda başlık ve
   simgeli maddeler, sağda gerçek ilan görsellerinden kolaj. */
.svd{display:grid;gap:28px;align-items:center;text-align:left}
.svd h2 em{font-style:normal;color:#E31C5F}
.svd-lead{margin:10px 0 18px;font-size:16px;line-height:24px;color:#6a6a6a}
.svd-liste{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:16px}
.svd-liste li{display:flex;gap:14px;align-items:flex-start}
.svd-liste li>span{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:#fff0f4;color:#E31C5F}
.svd-liste svg{width:22px;height:22px}
.svd-liste b{display:block;font-size:16px;line-height:21px;color:#222}
.svd-liste small{display:block;margin-top:2px;font-size:14px;line-height:20px;color:#6a6a6a}
.svd-btn{margin:0}
.svd-kolaj{position:relative;height:clamp(300px,62vw,460px)}
.svd-kolaj img{position:absolute;border-radius:16px;object-fit:cover;background:#f2f2f2;box-shadow:0 12px 32px rgba(0,0,0,.18)}
.svd-y{left:0;top:6%;width:78%;aspect-ratio:16/9}
.svd-d1{right:12%;bottom:0;width:30%;aspect-ratio:9/16;transform:rotate(-4deg)}
.svd-d2{right:0;top:0;width:28%;aspect-ratio:9/16;transform:rotate(5deg)}
.svd-rozet{position:absolute;left:6%;bottom:6%;padding:8px 14px;border-radius:999px;background:#fff;color:#222;font-size:14px;font-weight:700;box-shadow:0 6px 16px rgba(0,0,0,.14)}
@media (min-width:900px){
  .svd{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:56px}
  .svd-kolaj{height:440px}
}
.vp-ac{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
