/* ============================================================
   THEME VARIABLES
   ============================================================ */
:root {
  --primary:#0096c7;
  --accent:#90e0ef;
  --ink:#1e293b;
  --ink-2:#475569;
  --bg:#ffffff;
  --bg-alt:#f7fbff;
  --radius:1.25rem;
  --shadow:0 8px 20px rgba(0,0,0,.06);
  --section-y:56px;
  --section-y-lg:72px;
}

/* ============================================================
   BASE
   ============================================================ */
html, body { height:100%; }

body {
  font-family:'Nunito Sans',system-ui,-apple-system,Segoe UI,Roboto,Ubuntu;
  color:var(--ink);
  background:var(--bg);
  overflow-x:hidden;
  font-size:1.05rem;
  line-height:1.7;
}

h1,h2,h3,h4,h5,h6 { margin:0 0 .75rem; }
p { margin:0 0 .75rem; }

.section-title { font-weight:700; letter-spacing:.1px; }
.section-lead { color:var(--ink-2); }

.container { max-width:1140px; }

section { padding:var(--section-y) 0; }
@media(min-width:992px){ section{ padding:var(--section-y-lg) 0; }}

/* ============================================================
   TOPBAR
   ============================================================ */
.topbar {
  background:var(--primary);
  color:#fff;
  font-size:.95rem;
}
.topbar a { color:#fff; text-decoration:none; }
.topbar .vr { height:16px; }

/* ============================================================
   NAVBAR
   ============================================================ */
.navbar {
  transition:all .28s ease;
  backdrop-filter:saturate(160%) blur(6px);
  background:rgba(255,255,255,.9);
}
.navbar.scrolled {
  background:#fff !important;
  box-shadow:0 3px 12px rgba(0,0,0,.06);
}
.navbar-brand img { height:40px; transition:transform .2s; }
.navbar-nav .nav-link {
  color:var(--ink-2);
  font-weight:600;
  margin:0 .25rem;
}
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active { color:var(--primary); }
.dropdown-menu img { width:20px; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn-cta {
  background:var(--primary);
  color:#fff !important;
  border:none;
  border-radius:999px;
  padding:.6rem 1.1rem;
  font-weight:700;
  box-shadow:0 4px 12px rgba(0,150,199,.18);
  transition:transform .2s;
}
.btn-cta:hover {
  transform:translateY(-2px);
  background:#0284a8;
}

/* ============================================================
   ANIMATIONS (Fade Up)
   ============================================================ */
[data-anim] {
  opacity:0;
  transform:translateY(36px);
  transition:all .9s cubic-bezier(.25,.6,.3,1);
}
[data-anim].visible {
  opacity:1;
  transform:translateY(0);
}

/* ============================================================
   CARDS
   ============================================================ */
.service-card,
.info-card,
.blog-card {
  border:none;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  transition:transform .25s ease, box-shadow .25s ease;
}
.service-card:hover,
.info-card:hover,
.blog-card:hover {
  transform:translateY(-4px);
  box-shadow:0 12px 26px rgba(0,0,0,.09);
}

.service-card .icon {
  width:56px;
  height:56px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:var(--primary);
  color:#fff;
  font-size:1.3rem;
}

/* ============================================================
   GALLERY
   ============================================================ */
.gallery-img {
  height:200px;
  object-fit:cover;
  border-radius:1rem;
  cursor:pointer;
  transition:transform .3s;
}
.gallery-img:hover { transform:scale(1.02); }

.lightbox {
  display:none;
  position:fixed;
  z-index:1050;
  inset:0;
  background:rgba(0,0,0,.85);
  align-items:center;
  justify-content:center;
}
.lightbox img {
  max-width:90%;
  max-height:90%;
  border-radius:1rem;
  box-shadow:0 0 20px rgba(0,0,0,.4);
}
.lightbox.active { display:flex; }

/* ============================================================
   FOOTER
   ============================================================ */
.footer {
  background:#f0f6fb;
  color:#334155;
}
.footer a { color:#334155; transition:color .22s; }
.footer a:hover { color:var(--primary); }

/* ============================================================
   UTILITIES
   ============================================================ */
.mb-tight { margin-bottom:.5rem!important; }
.mt-tight { margin-top:.5rem!important; }
.bg-alt { background:var(--bg-alt); }

/* ============================================================
   BACK TO TOP BUTTON
   ============================================================ */
.back-to-top {
  position:fixed;
  right:18px;
  bottom:18px;
  width:48px;
  height:48px;
  border:none;
  border-radius:999px;
  background:var(--primary);
  color:#fff;
  display:grid;
  place-items:center;
  box-shadow:0 10px 22px rgba(0,0,0,.15);
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(12px);
  transition:opacity .25s, transform .25s, visibility .25s;
  z-index:1080;
}
.back-to-top:hover { background:#0284a8; }
.back-to-top.show {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

/* ============================================================
   HERO & SLIDER
   ============================================================ */
#hero .carousel-caption {
  opacity:1 !important;
  z-index:3;
}

.carousel-item {
  height:600px !important;
}
.carousel-item img {
  transition:transform 8s ease-in-out;
}
.carousel-item.active img { transform:scale(1.08); }

.carousel-item.active .animate-text,
.carousel-item.active .animate-btn {
  opacity:1 !important;
  transform:translateY(0) !important;
}

/* Responsive Height */
#hero .carousel-item { height:620px !important; }
@media(max-width:992px){ #hero .carousel-item{ height:520px !important; }}
@media(max-width:768px){ #hero .carousel-item{ height:460px !important; }}
@media(max-width:576px){ 
  #hero .carousel-item{ height:420px !important; }

      .topbar .container {
        flex-direction: column;
        gap: 6px;
        text-align: center;
    }

    .topbar-left {
        justify-content: center;
        gap: 8px 16px;
        width: 100%;
    }

    .topbar-social {
        justify-content: center;
        width: 100%;
        margin-top: 2px;
    }

    .topbar .vr {
        display: none !important;
    }

    .topbar a span {
        font-size: 0.85rem;
    }
}

/* Stronger object-fit */
.slider-image,
#hero .carousel-item picture {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover !important;
  object-position:center !important;
}


/* Hero */
.sub-hero{
  position:relative;
  min-height:300px;
  display:grid;
  place-items:center;
  color:#fff;
  
}
.sub-hero::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.35));
}
.sub-hero-inner{position:relative;z-index:2}
.breadcrumb a{ text-decoration:none }


/* Utilities */
.small-muted{font-size:.95rem;color:var(--ink-2)}
.rounded-20{border-radius:1.25rem}
.map-embed{min-height:360px;border:0;border-radius:1rem;box-shadow:var(--shadow);width:100%}
.contact-list li{margin-bottom:.5rem}
.text-ink-2{color:var(--ink-2)}
.icon-badge{
  width:48px;height:48px;border-radius:14px;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;font-size:1.25rem
}


/* ============================================================
   DOCTOR CARD
   ============================================================ */
.doctor-card {
  border:none;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
  background:#fff;
  transition:transform .25s ease, box-shadow .25s ease;
}
.doctor-card:hover {
  transform:translateY(-4px);
  box-shadow:0 12px 26px rgba(0,0,0,.09);
}
.doctor-photo {
  width:100%;
  height:320px;
  object-fit:contain;
}
.doctor-info { padding:1.5rem; }
.doctor-info h3 {
  font-size:1.3rem;
  font-weight:700;
  margin-bottom:.25rem;
}
.doctor-info small {
  color:var(--primary);
  font-weight:600;
}
.doctor-detail {
  background:var(--bg-alt);
  border-radius:var(--radius);
  padding:1.5rem;
  margin-top:1rem;
}

/* ============================================================
   BLOG TAGS
   ============================================================ */
.tag {
  display:inline-block;
  padding:.35rem .6rem;
  border-radius:999px;
  background:#e9f7fb;
  color:#03607a;
  font-weight:600;
  font-size:.85rem;
  margin:.25rem .35rem .25rem 0;
  cursor:pointer;
  user-select:none;
}
.tag.active { background:#0096c7; color:#fff; }



/* Institution Cards */
.institution-card {
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    background: #fff;
    transition: all .25s ease;
}
.institution-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 26px rgba(0,0,0,.10);
}

/* Icon alanı */
.inst-icon {
    width: 64px;
    height: 64px;
    border-radius: 18px;
    font-size: 1.6rem;
    color: #fff;
    background: linear-gradient(135deg, var(--primary), var(--accent));
}

/* Kurum "chip" etiketleri */
.inst-list {
    display: flex;
    flex-direction: column;
    gap: .55rem;
}

.inst-chip {
    display: flex;
    align-items: center;
    padding: .55rem .75rem;
    background: var(--bg-alt);
    border-radius: 12px;
    font-size: .95rem;
    color: var(--ink-2);
    border: 1px solid #e1eef7;
    transition: all .25s ease;
}

.inst-chip:hover {
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(0,0,0,.06);
    transform: translateX(4px);
    color: var(--ink);
}






/* HERO icon */
.hero-icon {
    font-size: 3rem;
    color: var(--accent);
}

/* About image container */
.about-img-box {
    overflow: hidden;
    border-radius: 22px;
}
.about-main-img {
    transition: transform .6s ease;
}
.about-main-img:hover {
    transform: scale(1.05);
}

/* Icon circle */
.icon-circle {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary), var(--accent));
    color: #fff;
    display: grid;
    place-items: center;
    font-size: 1.2rem;
    box-shadow: 0 3px 8px rgba(0,0,0,.15);
}

/* Sub-cards */
.about-card-enhanced {
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    transition: .25s ease;
}
.about-card-enhanced:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(0,0,0,.1);
}

/* Text */
.about-text p {
    margin-bottom: .7rem;
}







.modern-hero {
    padding: 90px 0;
    position: relative;
}

.modern-hero::after {
    content:"";
    position:absolute;
    inset:0;
    backdrop-filter: blur(4px);
}

.sub-hero-inner {
    position: relative;
    z-index: 2;
}

.modern-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255,255,255,.35);
}

.section-heading i {
    background: linear-gradient(135deg, var(--primary), var(--accent));
    -webkit-background-clip: text;
    color: transparent;
}

.image-frame {
    border-radius: 1.2rem;
    overflow: hidden;
}

.image-frame img {
    transition: transform .5s ease;
}

.image-frame:hover img {
    transform: scale(1.04);
}

.content-text p {
    margin-bottom: .75rem;
}







/* ============================================================
   LOADING OVERLAY
   ============================================================ */
.loader-overlay {
  position:fixed;
  inset:0;
  z-index:2000;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg,var(--bg),var(--bg-alt));
  transition:opacity .5s, visibility .5s;
}
.loader-card {
  width:min(420px,92vw);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  background:#fff;
  padding:28px 24px 22px;
  text-align:center;
}
.loader-logo { height:40px; margin-bottom:14px; }
.loader-title { font-weight:700; color:var(--ink); margin-bottom:8px; }
.loader-sub { font-size:.95rem; color:var(--ink-2); margin-bottom:18px; }

.loader-bar {
  height:10px;
  width:100%;
  background:#eef5fb;
  border-radius:999px;
  overflow:hidden;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.03);
}
.loader-bar > i {
  height:100%;
  width:0%;
  background:linear-gradient(90deg,var(--primary),var(--accent));
  border-radius:999px;
  transition:width .25s;
}
.loader-percent {
  margin-top:10px;
  font-size:.9rem;
  color:var(--ink-2);
}

.loader-spin {
  width:56px;
  height:56px;
  margin:0 auto 12px;
  animation:spin 1.1s linear infinite;
}
@keyframes spin { to{ transform:rotate(360deg); } }

.loader-overlay.is-hidden {
  opacity:0;
  visibility:hidden;
}

@media(prefers-reduced-motion:reduce){
  .loader-spin{ animation:none; }
  .loader-overlay{ transition:none; }
  .loader-bar > i{ transition:none; }
}






    .filter-bar .btn{
      border-radius:999px;
      font-weight:700;
    }
    .filter-bar .btn .count{
      background:var(--bg);
      color:var(--ink-2);
      border:1px solid #e5eef6;
      border-radius:999px;
      padding:.1rem .5rem;
      margin-left:.4rem;
      font-weight:700;
      font-size:.8rem;
    }

    .grid{--gap:14px; display:grid; gap:var(--gap); grid-template-columns:repeat(2,1fr)}
    @media (min-width:768px){ .grid{grid-template-columns:repeat(3,1fr)} }
    @media (min-width:1200px){ .grid{grid-template-columns:repeat(4,1fr)} }

    .card-photo{
      position:relative; overflow:hidden; border-radius:var(--radius); box-shadow:var(--shadow);
      background:#fff;
    }
    .card-photo img{
      width:100%; height:220px; object-fit:cover; display:block; transition:transform .35s ease;
      will-change: transform; /* flicker önler */
    }
    .card-photo:hover img{ transform:scale(1.03) }
    .card-badge{
      position:absolute; left:10px; top:10px; z-index:3;
      background:rgba(0,0,0,.55); color:#fff; font-size:.75rem; padding:.25rem .55rem; border-radius:999px;
      backdrop-filter: blur(2px);
    }
    .card-overlay{
      position:absolute; inset:0; background:linear-gradient(180deg,transparent 40%, rgba(0,0,0,.45));
      opacity:0; transition:opacity .25s ease;
    }
    .card-photo:hover .card-overlay{opacity:1}
    .zoom-icon{
      position:absolute; right:10px; bottom:10px; background:rgba(255,255,255,.9); color:#111; border-radius:999px;
      width:38px; height:38px; display:grid; place-items:center; font-size:1rem; box-shadow:0 4px 14px rgba(0,0,0,.18);
    }

    /* Lightbox */
    .lightbox{
      position:fixed; inset:0; background:rgba(0,0,0,.9); display:none; z-index:1055;
      align-items:center; justify-content:center; padding:24px;
    }
    .lightbox.active{display:flex}
    .lb-inner{width:100%; max-width:1200px; display:flex; flex-direction:column; gap:12px}
    .lb-stage{
      position:relative; background:#000; border-radius:14px; overflow:hidden;
      display:grid; place-items:center; min-height:48vh; max-height:72vh;
    }
    .lb-stage img{
      max-width:100%; max-height:72vh; object-fit:contain; display:block;
      /* görüntü kaybolma-flicker engelleme */
      image-rendering:auto; backface-visibility:hidden; transform:translateZ(0);
    }
    .lb-top{
      display:flex; align-items:center; justify-content:space-between; color:#eaf2f8; font-weight:700;
    }
    .lb-ctrl{
      position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; display:grid; place-items:center;
      background:rgba(0,0,0,.45); color:#fff; border-radius:999px; border:1px solid rgba(255,255,255,.15);
      cursor:pointer; transition:background .2s ease;
    }
    .lb-ctrl:hover{background:rgba(255,255,255,.15)}
    .lb-prev{left:10px}
    .lb-next{right:10px}
    .lb-close{
      background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.2); color:#fff; width:40px; height:40px;
      display:grid; place-items:center; border-radius:999px;
    }

    .lb-thumbs{
      display:flex; gap:8px; overflow-x:auto; padding:8px; background:rgba(255,255,255,.04);
      border-radius:12px; scrollbar-width:thin;
    }
    .lb-thumbs img{
      width:var(--thumb-size); height:var(--thumb-size); object-fit:cover; border-radius:10px;
      opacity:.65; cursor:pointer; border:2px solid transparent; transition:opacity .2s, border-color .2s;
      flex:0 0 auto;
    }
    .lb-thumbs img.active{opacity:1; border-color:#fff}
    .lb-count{color:#cfe8f6; font-weight:700}

    /* Hidden via filter */
    .is-hidden{ display:none !important; }


.lb-thumbs img {
    width: 70px;
    height: 50px;
    object-fit: cover;
    border-radius: 6px;
    margin-right: 6px;
    cursor: pointer;
    opacity: .7;
    transition: opacity .2s, transform .2s;
}

.lb-thumbs img.active {
    opacity: 1;
    transform: scale(1.05);
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}   






/* ===== TOPBAR MOBIL DÜZEN — Desktop görünümüne dokunmadan ===== */
@media (max-width: 768px) {
  /* Topbar container’ı dikey yap, ortala */
  .topbar .container {
    flex-direction: column;
    align-items: center;
    gap: 4px;
  }

  /* Sol blok (tel + mail) daha düzenli sersin */
  .topbar .container > div:first-child {
    flex-wrap: wrap;
    justify-content: center;
    row-gap: 4px;
  }

  /* Telefon linkleri tek satırda kalsın, taşmasın */
  .topbar .container > div:first-child a {
    white-space: nowrap;
  }

  /* Dikey ayraçları mobilde gizle */
  .topbar .vr {
    display: none !important;
  }

  /* Mail satırını telefonların altına tek satır gibi al */
  .topbar .container > div:first-child span.d-flex {
    width: 100%;
    justify-content: center;
    text-align: center;
    font-size: 0.85rem;
  }

  /* Sosyal medya ikonlarını da ortala */
  .topbar .container > div:last-child {
    justify-content: center;
  }
}

/* Daha küçük ekranlarda (opsiyonel küçük düzen) */
@media (max-width: 480px) {
  .topbar {
    font-size: 0.85rem;
  }

  .topbar .container > div:first-child a span {
    font-size: 0.85rem;
  }
}



/* ============================
   REVIEW KARTLARI
   ============================ */
.review-card {
  background:#fff;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  transition:.25s ease;
}
.review-card:hover {
  transform:translateY(-4px);
  box-shadow:0 12px 26px rgba(0,0,0,.1);
}

.review-source {
  display:flex;
  align-items:center;
  gap:6px;
  font-weight:600;
  font-size:.95rem;
  padding:.35rem .7rem;
  border-radius:10px;
  color:#fff;
}
.review-source i { font-size:1.2rem; }

/* Kaynaklara özel renkler */
.review-source.google { background:#ea4335; }
.review-source.insta { background:#d62976; }
.review-source.site { background:var(--primary); }

.review-stars i {
  color:#ffb600;
  font-size:1.2rem;
}

/* Avatar */
.review-avatar {
  width:52px;
  height:52px;
  border-radius:50%;
  overflow:hidden;
}
.review-avatar img {
  width:100%; height:100%; object-fit:cover;
}

.review-text {
  font-size:1.05rem;
  color:var(--ink-2);
  line-height:1.65;
  font-style:italic;
}
