/* =====================================================================
   Bootstrap 5.3 ailesi — sıra: bootstrap.min.css -> site.css -> bu dosya (data-aile="bootstrap").
   Bootstrap değişkenleri temanın renklerine bağlanır; carousel, offcanvas, navbar, modal ve accordion
   bileşenleri Bootstrap JS ile çalışır.
   data-carousel: fade | slide | kucukresim | bolunmus | kenburns
   ===================================================================== */

[data-aile="bootstrap"] {
    --bs-body-bg: var(--zemin);
    --bs-body-color: var(--metin);
    --bs-emphasis-color: var(--metin);
    --bs-secondary-color: var(--metin2);
    --bs-heading-color: var(--metin);
    --bs-border-color: var(--cizgi);
    --bs-border-radius: var(--kose);
    --bs-link-color: var(--vurgu);
    --bs-link-hover-color: var(--vurgu);
    --bs-font-sans-serif: var(--f-govde);
    --bs-body-font-family: var(--f-govde);
    --bs-tertiary-bg: var(--yuzey2);
    --bs-secondary-bg: var(--yuzey2);
}
[data-aile="bootstrap"][data-buton="hap"] .dugme { border-radius: 999px; padding-left: 1.8em; padding-right: 1.8em; }
[data-aile="bootstrap"] .ust-yazi { letter-spacing: .18em; }

/* ---------- Offcanvas menülü üst bölüm (görselin üzerinde saydam) ---------- */
.bs-ust-offcanvas { position: fixed; left: 0; right: 0; top: var(--demo-h, 0px); background: transparent; color: #fff; border-bottom: 1px solid rgb(255 255 255 / .16); }
.bs-ust-offcanvas.kaydi { background: color-mix(in srgb, var(--koyu) 94%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.bs-ust-offcanvas .logo-ad { color: #fff; }
.bs-ust-offcanvas .logo-alt { color: var(--vurgu2); }
.bs-ust-offcanvas .logo-renkli:not(:only-child) { display: none; }
.bs-ust-offcanvas .logo-beyaz { display: block; }
.bs-ust-offcanvas .dugme { background: transparent; border-color: rgb(255 255 255 / .5); color: #fff; }
.bs-ust-offcanvas .dugme:hover { background: var(--vurgu2); border-color: var(--vurgu2); color: #111; }
.bs-menu-ac { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; padding: 0 16px; border: 1px solid rgb(255 255 255 / .4); border-radius: var(--kose); background: transparent; color: inherit; font-weight: 600; cursor: pointer; }
.bs-menu-yazi { font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; }
.bs-menu-ac i { font-size: 1.1rem; }
@media (max-width: 559px) { .bs-ust-offcanvas .ust-eylem .dugme-kucuk { display: none; } .bs-menu-yazi { display: none; } }

[data-ust="bs-offcanvas"] .sayfa-basi { background: var(--koyu); color: var(--koyu-metin); padding-top: calc(var(--ust-yukseklik) + clamp(48px, 7vw, 88px)); border-bottom: 0; }
[data-ust="bs-offcanvas"] .sayfa-basi h1 { color: var(--koyu-metin); }
[data-ust="bs-offcanvas"] .sayfa-basi h1 em { color: var(--vurgu2); }
[data-ust="bs-offcanvas"] .sayfa-basi-aciklama, [data-ust="bs-offcanvas"] .kirinti ol { color: color-mix(in srgb, var(--koyu-metin) 75%, transparent); }
[data-ust="bs-offcanvas"] .ani-ust, [data-ust="bs-offcanvas"] .bolum.hata-sayfa { padding-top: calc(var(--ust-yukseklik) + 48px); }

/* Offcanvas paneli */
.bs-offcanvas { --bs-offcanvas-width: 440px; --bs-offcanvas-height: auto; --bs-offcanvas-bg: var(--yuzey); --bs-offcanvas-color: var(--metin); --bs-offcanvas-padding-x: 28px; }
.bs-offcanvas .offcanvas-title { font-size: 1.2rem; margin: 0; }
.bs-menu-liste { list-style: none; padding: 0; margin: 0 0 24px; }
.bs-menu-liste a { display: flex; align-items: baseline; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--cizgi); font: 500 1.3rem/1.2 var(--f-baslik); text-decoration: none; color: var(--metin); transition: color .2s, padding .2s; }
.bs-menu-liste small { font: 700 .7rem var(--f-govde); letter-spacing: .1em; color: var(--vurgu2); min-width: 22px; }
.bs-menu-liste a:hover, .bs-menu-liste a[aria-current] { color: var(--vurgu); padding-left: 6px; }
.bs-menu-alt { display: grid; gap: 10px; align-content: start; }
.bs-menu-alt .sosyal { font-size: 1.15rem; gap: 16px; padding-top: 6px; }
/* Bootstrap'ın .offcanvas kuralındaki bottom:0, üstten açılan panelde yüksekliği ekran boyuna uzatır; içerik kadar kalsın */
.offcanvas-top.bs-offcanvas { bottom: auto; max-height: 92vh; }
@media (min-width: 900px) {
    .offcanvas-top.bs-offcanvas .offcanvas-body { display: grid; grid-template-columns: 1fr 320px; gap: 48px; padding: 8px 48px 40px; }
    .offcanvas-top.bs-offcanvas .bs-menu-liste { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 32px; margin: 0; }
}

/* ---------- Navbar (açılır menülü) ---------- */
.ust.bs-ust:not(.bs-ust-offcanvas) { background: var(--yuzey); border-bottom: 1px solid var(--cizgi); }
.bs-ust .navbar { padding: 10px 0; --bs-navbar-color: var(--metin); --bs-navbar-hover-color: var(--vurgu); --bs-navbar-active-color: var(--vurgu); --bs-navbar-toggler-border-color: var(--cizgi); --bs-navbar-nav-link-padding-x: .8rem; }
.bs-navbar-ic { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; min-height: 56px; }
.bs-navbar-ic .logo { margin-right: 16px; }
.bs-ust .navbar-toggler { width: 46px; height: 44px; border-radius: var(--kose); color: var(--metin); }
.bs-ust .nav-link { font-weight: 600; font-size: .94rem; }
.bs-ust .dropdown-menu { --bs-dropdown-bg: var(--yuzey); --bs-dropdown-color: var(--metin); --bs-dropdown-border-color: var(--cizgi); --bs-dropdown-border-radius: var(--kose); --bs-dropdown-link-color: var(--metin); --bs-dropdown-link-hover-bg: var(--yuzey2); --bs-dropdown-link-active-bg: var(--vurgu); --bs-dropdown-link-active-color: var(--vurgu-metin); box-shadow: var(--golge); padding: 8px; }
.bs-ust .dropdown-item { border-radius: calc(var(--kose) * .6); padding: 8px 12px; }
.bs-navbar-cta { margin: 10px 0 6px; }
@media (min-width: 1200px) { .bs-navbar-cta { margin: 0 0 0 16px; } }
@media (max-width: 1199px) { .bs-ust .navbar-collapse { padding: 8px 0 12px; } .bs-ust .navbar-nav { border-top: 1px solid var(--cizgi); padding-top: 8px; } }

/* ---------- Carousel girişi ---------- */
.giris-bs { position: relative; background: var(--koyu); }
.giris-bs .carousel-item { height: min(calc(100svh - var(--demo-h, 0px)), 920px); position: relative; }
[data-ust="bs-navbar"] .giris-bs .carousel-item { height: min(calc(92svh - 76px - var(--demo-h, 0px)), 820px); }
.giris-bs .bs-slayt-resim { width: 100%; height: 100%; object-fit: cover; }
.giris-bs .carousel-item:not(.bs-bolunmus-kap)::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(0 0 0 / .58), rgb(0 0 0 / .12) 72%), linear-gradient(0deg, rgb(0 0 0 / .45), transparent 40%); pointer-events: none; }
.giris-bs .carousel-caption { left: 0; right: 0; bottom: clamp(90px, 16vh, 170px); top: auto; text-align: left; padding: 0; z-index: 2; color: #fff; }
.giris-bs .slayt-baslik { font: 500 clamp(2.3rem, 5.6vw, 4.8rem)/1.08 var(--f-baslik); color: #fff; max-width: 16ch; margin: 0 0 .3em; text-wrap: balance; }
.giris-bs .slayt-baslik em { color: var(--vurgu2); font-style: italic; }
[data-baslik="normal"] .giris-bs .slayt-baslik em { font-style: normal; }
[data-baslik="buyuk"] .giris-bs .slayt-baslik { text-transform: uppercase; letter-spacing: .05em; font-size: clamp(2rem, 4.6vw, 3.9rem); }
[data-baslik="buyuk"] .giris-bs .slayt-baslik em { font-style: normal; }
.giris-bs .slayt-alt { font-size: clamp(1rem, 1.6vw, 1.18rem); max-width: 560px; color: rgb(255 255 255 / .86); margin-bottom: 1.5rem; }
.giris-bs .carousel-caption .ust-yazi { color: var(--vurgu2); }
.giris-bs .carousel-caption .dugme { background: var(--vurgu2); border-color: var(--vurgu2); color: #111; }
.giris-bs .carousel-caption .dugme:hover { background: #fff; border-color: #fff; }
.giris-bs .carousel-item.active .carousel-caption .kap > * { animation: bsYazi .9s cubic-bezier(.2, .7, .2, 1) both; }
.giris-bs .carousel-item.active .carousel-caption .kap > *:nth-child(2) { animation-delay: .12s; }
.giris-bs .carousel-item.active .carousel-caption .kap > *:nth-child(3) { animation-delay: .24s; }
.giris-bs .carousel-item.active .carousel-caption .kap > *:nth-child(4) { animation-delay: .36s; }
@keyframes bsYazi { from { opacity: 0; transform: translateY(24px); } }
.giris-bs .carousel-indicators { margin-bottom: 36px; }
.giris-bs .carousel-indicators [data-bs-target] { width: 44px; height: 3px; border: 0; margin: 0 4px; }
.giris-bs .carousel-control-prev, .giris-bs .carousel-control-next { width: 8%; }
/* Telefonda yazının üstüne binen oklar gizlenir; parmakla kaydırma Bootstrap'ta zaten açık */
@media (max-width: 767px) { .giris-bs .carousel:not(.bs-carousel-bolunmus) .carousel-control-prev, .giris-bs .carousel:not(.bs-carousel-bolunmus) .carousel-control-next { display: none; } }
/* Yavaşça yakınlaşan (kenburns) */
.bs-carousel-kenburns .carousel-item.active .bs-slayt-resim { animation: bsYakin 9s ease-out both; }
@keyframes bsYakin { from { transform: scale(1.14); } to { transform: scale(1); } }
/* Küçük resimli göstergeler */
.giris-bs .bs-kucukresim { margin-bottom: 68px; gap: 8px; }
.giris-bs .bs-kucukresim [data-bs-target] { width: 96px; height: 60px; padding: 0; margin: 0; text-indent: 0; background: none; opacity: .55; border: 2px solid transparent; border-radius: calc(var(--kose) * .6 + 2px); overflow: hidden; transition: opacity .2s, border-color .2s; }
.giris-bs .bs-kucukresim [data-bs-target].active { opacity: 1; border-color: #fff; }
.giris-bs .bs-kucukresim img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bs-carousel-kucukresim .carousel-caption { bottom: clamp(160px, 24vh, 240px); }
.giris-bs .carousel-indicators:not(.bs-kucukresim) { margin-bottom: 64px; }
@media (max-width: 599px) { .giris-bs .bs-kucukresim [data-bs-target] { width: 54px; height: 36px; } }
/* Bölünmüş: yazı solda, görsel sağda */
.bs-carousel-bolunmus .carousel-item { height: auto !important; }
.bs-carousel-bolunmus .carousel-item::after { display: none; }
.bs-bolunmus { display: grid; background: var(--yuzey2); }
.bs-bolunmus-metin { padding: 36px 24px 90px; display: flex; flex-direction: column; justify-content: center; }
.bs-bolunmus-metin .slayt-baslik { color: var(--metin); font-size: clamp(2rem, 4.2vw, 3.6rem); }
.bs-bolunmus-metin .slayt-baslik em { color: var(--vurgu2); font-style: normal; }
.bs-bolunmus-metin .slayt-alt { color: var(--metin2); }
.bs-bolunmus-resim img { width: 100%; height: 100%; min-height: 300px; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.bs-carousel-bolunmus .carousel-indicators { justify-content: flex-start; margin: 0 0 32px 24px; }
.bs-carousel-bolunmus .carousel-indicators [data-bs-target] { background-color: var(--vurgu); }
.bs-carousel-bolunmus .carousel-control-prev, .bs-carousel-bolunmus .carousel-control-next { top: auto; bottom: 20px; width: 48px; height: 48px; border-radius: 50%; background: var(--vurgu); opacity: 1; }
.bs-carousel-bolunmus .carousel-control-prev { left: auto; right: 76px; }
.bs-carousel-bolunmus .carousel-control-next { right: 20px; }
.bs-carousel-bolunmus .carousel-control-prev-icon, .bs-carousel-bolunmus .carousel-control-next-icon { width: 1.2rem; height: 1.2rem; }
@media (min-width: 992px) {
    .bs-bolunmus { grid-template-columns: 1fr 1.25fr; min-height: min(80svh, 760px); }
    .bs-bolunmus-metin { padding: clamp(40px, 6vw, 88px); padding-bottom: 110px; }
    .bs-bolunmus-resim img { aspect-ratio: auto; }
    .bs-carousel-bolunmus .carousel-indicators { margin-left: clamp(40px, 6vw, 88px); }
}

/* ---------- Video arka planlı giriş (Video Salon) ---------- */
[data-aile="bootstrap"] .giris-videolu h1 em { color: var(--vurgu); }
[data-aile="bootstrap"] .giris-videolu .ust-yazi { color: var(--vurgu); }
[data-aile="bootstrap"] .giris-videolu .dugme:not(.dugme-cizgi-acik) { background: var(--vurgu); border-color: var(--vurgu); color: var(--vurgu-metin); }

/* ---------- Müsaitlik bandı ---------- */
[data-aile="bootstrap"] .sorgu-bant-ic { box-shadow: 0 20px 50px -28px rgb(0 0 0 / .4); }
[data-baslik="buyuk"] .sorgu-bant-yazi b { font-size: 1rem; letter-spacing: .04em; }

/* ---------- SSS akordeonu ---------- */
.bs-sss {
    --bs-accordion-bg: var(--yuzey); --bs-accordion-color: var(--metin); --bs-accordion-border-color: var(--cizgi);
    --bs-accordion-border-radius: var(--kose); --bs-accordion-inner-border-radius: var(--kose);
    --bs-accordion-btn-color: var(--metin); --bs-accordion-btn-bg: var(--yuzey); --bs-accordion-active-color: var(--vurgu); --bs-accordion-active-bg: var(--yuzey2);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--vurgu) 25%, transparent);
    --bs-accordion-btn-padding-y: 1.1rem; --bs-accordion-body-padding-y: 1.1rem;
}
.bs-sss .accordion-button { font: 500 1.08rem/1.4 var(--f-baslik); }
.bs-sss .accordion-body { color: var(--metin2); }
.bs-sss .accordion-header { margin: 0; }

/* ---------- Video modalı ---------- */
.video-modal .modal-content { background: #050505; color: #fff; border: 0; border-radius: var(--kose); overflow: hidden; }
.video-modal .modal-header { border-color: rgb(255 255 255 / .1); padding: 12px 18px; }
.video-modal .modal-title { font-size: 1rem; font-family: var(--f-govde); color: #fff; margin: 0; }
.video-modal .btn-close { filter: invert(1) grayscale(1) brightness(2); }
.video-modal video, .video-modal iframe { width: 100%; height: 100%; border: 0; display: block; background: #000; }
