:root {
    --ink: #0f172a; /* ana metin */
    --muted: #475569; /* ikincil */
    --brand: #2563eb; /* vurgu */
    --card: #ffffff;
    --ring: #e5e7eb;
    --header-h: 72px; /* kendi nav yüksekliğine göre ayarla (60-90px arası) */
}

html, body {
    height: 100%;
    margin: 0;
}
main > *:first-child {
    margin-top: 0 !important;
}

/* Kahraman/hero gibi bölümlerde fazlalık varsa sıfırla */
.hero, .pagecontainer, .container:first-child {
    margin-top: 30px;
}

.section-title {
    font-size: clamp(1.8rem,1.2rem + 1.6vw,2.6rem);
    line-height: 1.2;
    font-weight: 800;
    text-align: center;
    color: #4d5a79;
    position: relative;
    padding-bottom: 16px;
    letter-spacing: .2px;
}

    .section-title::after {
        content: "";
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0;
        width: min(240px,60%);
        height: 3px;
        background: linear-gradient(90deg,transparent,var(--brand),transparent);
        border-radius: 999px;
        opacity: .95;
    }
/* Alt başlık (subtitle) */
.section-subtitle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: clamp(1rem, .9rem + .35vw, 1.125rem);
    font-weight: 600;
    color: var(--muted);
    letter-spacing: .15px;
    margin: 10px auto 28px;
    text-align: center;
}

    .section-subtitle::before,
    .section-subtitle::after {
        content: "";
        height: 2px;
        width: clamp(44px, 8vw, 120px);
        background: linear-gradient(90deg, transparent, var(--brand), transparent);
        border-radius: 999px;
        opacity: .65;
    }

@media (max-width:480px) {
    .section-subtitle {
        gap: 8px;
        margin-bottom: 22px;
    }
}
/* Öne çıkan logolar */
.featured-logos .logo-box {
    height: 160px;
}

/* Grid logo kartları */
.logo-box {
    height: 130px; /* sabit kutu yüksekliği */
    background: #fff;
    border: 1px solid var(--ring);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px 12px;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

    .logo-box:hover {
        border-color: #d1d5db;
        transform: scale(1.05);
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    }

    /* Görseller */
    .logo-box img {
        max-height: 72px; /* kutu içinde ölçekleme */
        width: auto;
    }

.featured-logos img {
    max-height: 100px;
}

/* Satırlar arası dikey aralık bootstrap g-4 ile zaten sağlanıyor;
             ayrıca bölümler arası biraz nefes: */
#products .container {
    padding-top: 8px;
}

/* Küçük ekran iyileştirmeleri */
@media (max-width:768px) {
    .logo-box {
        height: 84px;
    }

        .logo-box img {
            max-height: 64px;
        }
}


.pagecontainer {
    margin: 0 auto;
    background: var(--card);
    padding: 32px 16px 24px;
    border-radius: 16px;
    box-shadow: 0 10px 24px rgba(2,8,23,.04);
}

    .pagecontainer #map {
        height: 700px;
        width: 100%;
        border-radius: 10px;
        margin-top: 70px
    }