/**
 * MAGNA GLOBAL SECTIONS
 * Homepage jaisa section layout + headings — poori website par.
 */


/* ========== SECTION SPACING & BACKGROUND ========== */

.products-section,
.applications-section,
.challenges-section,
.supporting-section,
.features-section,
.industries-section,
.why-choose-section,
.explore-section,
.explore-industries,
.split-section,
.magna-how-work-section,
.trusted-section,
.prod-intro,
.prod-grid,
.about-intro,
.about-vm,
.about-why,
.about-supply,
.magna-featured-insights,
.magna-explore-topics,
.magna-download-center,
.magna-latest-articles,
.magna-case-studies,
.media-highlights,
.media-moments,
.media-action,
.media-events,
.spec-section,
.ind-intro,
.ind-grid-section,
.ind-cta {
    padding: var(--magna-section-padding) !important;
}

.products-section,
.applications-section,
.features-section,
.industries-section,
.why-choose-section,
.magna-how-work-section,
.about-intro,
.magna-featured-insights,
.media-highlights,
.ind-intro {
    background-color: var(--magna-section-bg) !important;
}


/* ========== CONTAINER (homepage width) ========== */

.magna-about-wrapper>.container,
.magna-about-wrapper .container,
.section .container,
.section .container-fluid,
.magna-how-work-section .container-fluid,
.magna-featured-insights .container,
.media-highlights .container,
.footer-container {
    max-width: var(--magna-container-max) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}


/* ========== SECTION HEADING — light (homepage HOW WE WORK style) ========== */

.section-heading {
    text-align: center !important;
    margin-bottom: 50px !important;
}

.section-heading h2,
.trusted-title {
    font-family: var(--magna-font-family) !important;
    font-size: var(--magna-fs-h2) !important;
    font-weight: 700 !important;
    color: var(--magna-color-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    position: relative !important;
    display: inline-block !important;
    margin-bottom: 30px !important;
    line-height: var(--magna-lh-tight) !important;
}

.section-heading h2::after,
.trusted-title::after {
    content: '' !important;
    position: absolute !important;
    bottom: -15px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 4px !important;
    background-color: var(--magna-strip-blue) !important;
    border-radius: 2px !important;
    display: block !important;
    margin: 0 !important;
}

.section-heading p {
    font-family: var(--magna-font-family) !important;
    font-size: var(--magna-fs-body) !important;
    color: var(--magna-text-secondary) !important;
    max-width: 700px;
    margin: 20px auto 0 !important;
    line-height: var(--magna-lh-normal) !important;
}


/* Dark homepage sections — white heading + orange strip */

.section.courses .section-heading h2,
.section.video .section-heading h2,
.section.industries .section-heading h2 {
    color: #ffffff !important;
}

.section.courses .section-heading h2::after,
.section.video .section-heading h2::after,
.section.industries .section-heading h2::after {
    background-color: var(--magna-strip-orange) !important;
}


/* ========== STRIP SECTION TITLES (h2/h3 with underline) ========== */

.section-title,
h2.section-title,
h3.section-title,
.magna-section-label,
.media-section-label {
    font-family: var(--magna-font-family) !important;
    font-size: var(--magna-fs-strip) !important;
    font-weight: 700 !important;
    line-height: var(--magna-lh-strip) !important;
    color: var(--magna-color-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    position: relative !important;
    text-align: center !important;
    margin-bottom: 40px !important;
    display: block !important;
}

.section-title::after,
h2.section-title::after,
h3.section-title::after,
.magna-section-label::after,
.media-section-label::after {
    content: '' !important;
    position: absolute !important;
    bottom: -12px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 50px !important;
    height: 3px !important;
    background: var(--magna-strip-orange) !important;
    border-radius: 2px !important;
}


/* Left-aligned strip labels (products sub-sections) */

.section-header h2,
.why-choose-header h2,
.industries-section .section-header h2,
.split-title,
.main-title,
.content-area .section-title {
    font-family: var(--magna-font-family) !important;
    font-size: var(--magna-fs-strip) !important;
    font-weight: 700 !important;
    line-height: var(--magna-lh-strip) !important;
    color: var(--magna-color-heading) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    position: relative !important;
}

.section-header h2,
.why-choose-header h2,
.industries-section .section-header h2,
.split-title {
    text-align: left !important;
    display: inline-block !important;
    padding-bottom: 12px !important;
    margin-bottom: 24px !important;
    letter-spacing: 1.5px !important;
}

.section-header h2::after,
.why-choose-header h2::after,
.industries-section .section-header h2::after,
.split-title::after {
    left: 0 !important;
    transform: none !important;
    bottom: 0 !important;
    width: 40px !important;
    height: 3px !important;
    background: var(--magna-strip-blue) !important;
}

.magna-how-work-section .section-heading h2::after {
    background-color: var(--magna-strip-blue) !important;
}


/* ========== FEATURES STRIP (homepage operational support) ========== */

.features-container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    max-width: var(--magna-container-max) !important;
    width: 100% !important;
    margin: 0 auto !important;
    background-color: #f0f3f7 !important;
    padding: 20px 5px !important;
    border-radius: 8px !important;
}


/* ========== MOBILE ========== */

@media (max-width: 768px) {

    .products-section,
    .applications-section,
    .challenges-section,
    .supporting-section,
    .features-section,
    .industries-section,
    .why-choose-section,
    .magna-how-work-section,
    .trusted-section,
    .prod-intro,
    .about-intro,
    .media-highlights {
        padding: var(--magna-section-padding-mobile) !important;
    }

    .section-heading h2,
    .trusted-title {
        font-size: var(--magna-fs-h2-mobile) !important;
        letter-spacing: 1px !important;
    }

    .section-title,
    h2.section-title,
    h3.section-title,
    .magna-section-label,
    .media-section-label {
        font-size: var(--magna-fs-category) !important;
    }

    .features-container {
        flex-direction: column !important;
        padding: 30px 20px !important;
    }
}