/* ===================================================================
   SIRYAP GLOBAL — LOGO ÖLÇÜLERİ (TEK KAYNAK)
   Logo boyutunu değiştirmek isterseniz SADECE bu dosyayı düzenleyin.
   Bu dosya tüm sayfalarda style.css'ten SONRA yüklenir.
   Logo tek parça (S monogramı + "SIRYAP GLOBAL" yazısı bir arada).
   Oran: 1222 / 495 = 2.4687  ->  genişlik = yükseklik x 2.4687
   =================================================================== */

.site-header {
    --logo-h:     72px;   /* sayfanın en üstünde (şeffaf header) */
    --logo-box-w: 180px;  /* logo alanının sabit genişliği */
}
.site-header.scrolled {
    --logo-h:     54px;   /* aşağı kaydırınca küçülür */
}

.site-header .header-logo {
    position: relative;
    min-width: 0;
    display: block;
    flex-shrink: 0;
    width: var(--logo-box-w);
    height: var(--logo-h);
    transition: height 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Beyaz ve altın logo üst üste durur, aralarında opacity geçişi olur */
.site-header .header-logo .logo-set {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: auto;
    height: auto;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.site-header .header-logo .logo-full {
    display: block;
    height: var(--logo-h);
    width: auto;
    max-width: none;
    aspect-ratio: 1222 / 495;
    object-fit: contain;
    transition: height 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Durum 1: sayfanın en üstü → BEYAZ logo */
.site-header .header-logo .logo-set-white { opacity: 1; }
.site-header .header-logo .logo-set-gold  { opacity: 0; }
.site-header .header-logo .logo-set-white img {
    filter: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.38));
}

/* Durum 2: aşağı kaydırınca → ALTIN logo */
.site-header.scrolled .header-logo .logo-set-white { opacity: 0; }
.site-header.scrolled .header-logo .logo-set-gold  { opacity: 1; }

/* Footer logosu */
.footer-logo-split .footer-logo-img {
    display: block;
    height: 72px;
    width: auto;
    max-width: none;
    aspect-ratio: 1222 / 495;
    object-fit: contain;
    opacity: 1;
}

/* Mobil menü logosu */
.mnav-logo {
    height: 36px;
    width: auto;
    max-width: none;
    aspect-ratio: 1222 / 495;
    object-fit: contain;
}

@media (max-width: 1280px) {
    .site-header          { --logo-h: 66px; --logo-box-w: 165px; }
    .site-header.scrolled { --logo-h: 50px; }
}
@media (max-width: 768px) {
    .site-header          { --logo-h: 58px; --logo-box-w: 145px; }
    .site-header.scrolled { --logo-h: 46px; }
    .footer-logo-split .footer-logo-img { height: 62px; }
}
@media (max-width: 480px) {
    .site-header          { --logo-h: 50px; --logo-box-w: 125px; }
    .site-header.scrolled { --logo-h: 42px; }
}