/* ================================================================
   Solid Medya — Container & Layout System (2026-06-27)
   Sayfalar arası içerik genişliği, hizalama ve responsive tutarlılık
   ================================================================ */

:root {
    --sm-cw-content: 1230px;
    --sm-cw-wide: 1330px;
    --sm-cw-service: 1430px;
    --sm-cw-portfolio: 1830px;
    --sm-cw-contact-wide: 1750px;
    --sm-cw-kurumsal: 1350px;
    --sm-cx: clamp(12px, 2.5vw, 30px);
    --sm-cx-tight: clamp(10px, 2vw, 20px);
}

/* ── Temel container davranışı ── */
.container,
.container-fluid,
[class*="container-"] {
    box-sizing: border-box;
}

.container:not([class*="container-"]),
.container-fluid {
    width: 100%;
    max-width: 100%;
}

.container:not([class*="container-"]) {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

main .container:not([class*="container-"]) {
    max-width: var(--sm-cw-content);
    padding-left: var(--sm-cx);
    padding-right: var(--sm-cx);
}

/* ── Numaralı container genişlikleri ── */
.container.container-1030,
.container-1030 { max-width: 1030px; }
.container.container-1200,
.container-1200 { max-width: 1200px; }
.container.container-1230,
.container-1230 { max-width: var(--sm-cw-content); }
.container.container-1300,
.container-1300 { max-width: 1300px; }
.container.container-1320,
.container-1320 { max-width: 1320px; }
.container.container-1330,
.container-1330 { max-width: var(--sm-cw-wide); }
.container.container-1350,
.container-1350 { max-width: var(--sm-cw-kurumsal); }
.container.container-1430,
.container-1430 { max-width: var(--sm-cw-service); }
.container.container-1460,
.container-1460 { max-width: 1460px; }
.container.container-1550,
.container-1550 { max-width: 1550px; }
.container.container-1580,
.container-1580 { max-width: 1580px; }
.container.container-1630,
.container-1630 { max-width: 1630px; }
.container.container-1680,
.container-1680 { max-width: 1680px; }
.container.container-1730,
.container-1730 { max-width: 1730px; }
.container.container-1750,
.container-1750 { max-width: var(--sm-cw-contact-wide); }
.container.container-1800,
.container-1800 { max-width: 1800px; }
.container.container-1830,
.container-1830 { max-width: var(--sm-cw-portfolio); }

.container[class*="container-"] {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--sm-cx);
    padding-right: var(--sm-cx);
}

/* ── Hizmet detay: numarasız container → service tier ── */
[class*="page-hizmet-"] main .container:not([class*="container-"]),
.page-islerdetay main .container:not([class*="container-"]) {
    max-width: var(--sm-cw-service);
}

/* ── Hub / listeleme: breadcrumb + içerik hizası ── */
main .tp-breadcrumb-area .container:not([class*="container-"]),
main .tp-contact-us-ptb .container:not([class*="container-"]),
.page-videogaleri main .tp-breadcrumb-area .container,
.page-sss main .tp-breadcrumb-area .container {
    max-width: var(--sm-cw-content);
}

/* ── SEO lead / breadcrumb blokları ── */
.sm-seo-lead .container,
.sm-seo-lead .container.container-1230,
.sm-seo-lead__inner.container {
    max-width: var(--sm-cw-content);
    padding-left: var(--sm-cx);
    padding-right: var(--sm-cx);
}

/* ── Main içerik bölümleri ── */
main > div > .container[class*="container-"],
main > section > .container[class*="container-"],
main .container[class*="container-"] {
    width: 100%;
}

/* ── Hub sayfalarında breadcrumb ile grid aynı hizada ── */
.page-haberler .news-grid-section > .container.container-1330,
[class*="page-haber-"] main .container.container-1330 {
    max-width: var(--sm-cw-content);
}

.page-fotogaleri .tp-blog-list-ptb > .container,
body[class*="page-fotogaleri"] .foto-hub > .container,
body[class*="page-fotogaleri"] .foto-detail > .container,
.page-referanslar .tp-brand-inner-area > .container,
.page-hizmetler .container.container-1230 {
    max-width: var(--sm-cw-content);
}

/* ── Portföy detay: hero + grid hizası ── */
.page-isler .tp-portfolio-inner-ptb > .container.container-1830,
.page-isler .tp-portfolio-inner-ptb > .container.container-1430 {
    max-width: var(--sm-cw-service);
}

.page-islerdetay .tp-portfolio-inner-ptb > .container.container-1430,
body[class*="page-islerdetay"] .tp-portfolio-inner-ptb > .container.container-1430 {
    max-width: var(--sm-cw-service);
}

/* ── İletişim geniş alan (harita) korunur ── */
.page-videogaleri .video-gallery-wrapper > .container.container-1330,
body[class*="page-videogaleri"] .video-gallery-wrapper > .container.container-1330 {
    max-width: var(--sm-cw-content);
}

.page-iletisim .cn-contactform-support-area .container:not([class*="container-"]) {
    max-width: var(--sm-cw-content);
}

.page-iletisim .container.container-1750 {
    max-width: var(--sm-cw-contact-wide);
}

.page-markalarimiz main .tp-breadcrumb-area .container:not([class*="container-"]),
.page-markalarimiz main > div > .container:not([class*="container-"]) {
    max-width: var(--sm-cw-content);
}

/* ── Hizmet detay: mobil taşma koruması ── */
[class*="page-hizmet-"] main,
[class*="page-hizmet-"] main > div,
[class*="page-hizmet-"] main > section {
    max-width: 100%;
    overflow-x: clip;
}

@media (max-width: 767px) {
    [class*="page-hizmet-"] main .container[class*="container-"],
    [class*="page-hizmet-"] main .container:not([class*="container-"]) {
        width: 100%;
        max-width: 100%;
    }
}

/* ── İletişim: mobil taşma koruması ── */
.page-iletisim main .tp-breadcrumb-area {
    overflow-x: clip;
}

.page-iletisim .container.container-1330,
.page-iletisim .container.container-1230 {
    max-width: 100%;
}

/* ── SSS okunabilirlik genişliği ── */
.page-sss .faq-container-width {
    max-width: min(100%, var(--sm-cw-content));
    padding-left: var(--sm-cx);
    padding-right: var(--sm-cx);
}

/* ── Section / row taşma koruması ── */
main,
main > div,
main > section {
    max-width: 100%;
}

main .row {
    margin-left: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
    margin-right: calc(var(--bs-gutter-x, 1.5rem) * -0.5);
}

/* ── 100vw yatay taşma önleme ── */
[style*="100vw"],
.full-bleed,
.w-100vw {
    max-width: 100% !important;
}

/* ── Form alanları container içinde kalsın ── */
main .tp-contact-us-form-wrapper,
main .form-control-custom,
main .cn-contactform-wrap,
main .dm-input,
main .s-input {
    max-width: 100%;
}

/* ── Responsive kırılımlar ── */
@media (max-width: 767px) {
    :root {
        --sm-cx: clamp(12px, 4vw, 20px);
    }

    .container[class*="container-"],
    main .container:not([class*="container-"]) {
        padding-left: var(--sm-cx);
        padding-right: var(--sm-cx);
    }

    main .tp-breadcrumb-title,
    main .tp-career-title,
    main .tp-blog-title {
        padding-left: 0;
        padding-right: 0;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .container[class*="container-"],
    main .container:not([class*="container-"]) {
        padding-left: clamp(16px, 3vw, 24px);
        padding-right: clamp(16px, 3vw, 24px);
    }
}

@media (min-width: 992px) {
    .container.container-1230,
    .container-1230 {
        padding-left: clamp(20px, 2.5vw, 30px);
        padding-right: clamp(20px, 2.5vw, 30px);
    }
}

@media (min-width: 1400px) {
    .container.container-1230,
    .container-1230 {
        padding-left: var(--sm-cx-tight);
        padding-right: var(--sm-cx-tight);
    }
}

@media (min-width: 1920px) {
    .container[class*="container-"] {
        padding-left: var(--sm-cx-tight);
        padding-right: var(--sm-cx-tight);
    }
}
