/* ===========================================================
   PixoraCo — özel CSS override'ları (main.css'ten SONRA yüklenir)
   Re-skin sırasında temanın üzerine eklenen tüm özel kurallar burada.
   =========================================================== */

/* ---- Referans detay: galeri carousel görselleri ----
   Sabit yükseklik + otomatik genişlik (kırpma yok, en-boy oranı korunur). */
.portfolio-carousel-area .portfolio-carousel-thumb img {
    height: 500px;
    width: auto;
    max-width: none;
    object-fit: cover;
}
.portfolio-carousel-area .panel-four,
.portfolio-carousel-area .project-four-wrapper,
.portfolio-carousel-area .portfolio-carousel-wrapper {
    width: auto;
    max-width: none;
}

@media screen and (max-width: 1799px) {
    .portfolio-carousel-area .portfolio-carousel-thumb img { height: 500px; }
}
@media screen and (max-width: 991px) {
    .portfolio-carousel-area .portfolio-carousel-thumb img { height: 420px; }
}
@media screen and (max-width: 575px) {
    .portfolio-carousel-area .portfolio-carousel-thumb img { height: 300px; }
}

/* ---- İçerik metinlerindeki linkler tema turuncusu ----
   Admin'den gelen zengin HTML içeriğindeki <a>'ler sınıfsız geldiği için
   varsayılan mavi yerine tema turuncusu (main-600) olur.
   Nav/buton/footer linkleri kendi sınıflarıyla stillendiğinden etkilenmez. */
main a:not([class]),
.service-details-icerik a,
.rich-content a {
    color: var(--main-600);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-thickness: 1px;
    transition: color .2s ease;
}
main a:not([class]):hover,
.service-details-icerik a:hover,
.rich-content a:hover {
    color: hsl(var(--main-h), var(--main-s), 33%);
}

/* ---- Blog: tek görsel varken hover swap efektini kaldır ----
   Temanın orijinal CSS'i 2 <img> bekliyor ve nth-child(1) gizliyor.
   .single-thumb class'ı varsa transform/opacity/blur sıfırlanır,
   görsel normal görünür ve hover'da hareket etmez. */
.blog-main-thumb.single-thumb img:nth-child(1) {
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
}
.blog-wrapper:hover .blog-main-thumb.single-thumb img:nth-child(1) {
    transform: none !important;
    opacity: 1 !important;
    filter: none !important;
}

/* ---- Sticky Sidebar ----
   Blog listesi ve hizmet detay sayfalarındaki sidebar,
   sayfa aşağı kaydırılırken ekranda sabit kalır.
   ScrollSmoother aktifken JS ile pin uygulanır;
   fallback olarak position:sticky kullanılır. */
@media (min-width: 992px) {
    .px-sticky-sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 120px;
        align-self: flex-start;
    }
    /* Header scroll edilince küçülürse top offset azalır */
    .header-sticky-active .px-sticky-sidebar {
        top: 90px;
    }
}

/* ---- Blog sidebar: kategori yuvarlakları ----
   Metin 2. satıra indiğinde flex container span'ı dikey uzatıyordu.
   Sabit boyut + flex-shrink:0 ile daima yuvarlak kalır. */
.blog-category-list ul li a span {
    flex-shrink: 0;
    min-width: 18px;
    min-height: 18px;
    max-width: 18px;
    max-height: 18px;
}

/* ---- Brand / Partner Logos Uniform Sizing ----
   Ana sayfadaki marka logolarının taşmasını önler ve görsel olarak dengeli/aynı büyüklükte görünmelerini sağlar. */
.brand-wrapper {
    padding: 15px 25px;
    box-sizing: border-box;
}

.brand-wrapper span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.brand-wrapper img {
    max-width: 100%;
    max-height: 65px; /* Logolar için ortak maksimum dikey sınır */
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.brand-wrapper:hover img {
    transform: scale(1.05); /* Hover'da hafif premium bir yakınlaşma efekti */
}

/* ---- 404 Error Page ---- */
.error-404-number {
    font-size: clamp(6rem, 15vw, 12rem);
    line-height: 1;
    letter-spacing: -2px;
    display: block;
    background: linear-gradient(135deg, #DE6401 0%, #ff8e3c 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 0 20px rgba(222, 100, 1, 0.25));
    animation: pulseGlow 4s infinite alternate;
}

@keyframes pulseGlow {
    0% {
        filter: drop-shadow(0 0 15px rgba(222, 100, 1, 0.25));
        transform: scale(1);
    }
    100% {
        filter: drop-shadow(0 0 35px rgba(222, 100, 1, 0.5));
        transform: scale(1.02);
    }
}
