.elementor-50 .elementor-element.elementor-element-e2f7d58{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}:root{--page-title-display:none;}/* Start custom CSS for html, class: .elementor-element-4a7f9e8 *//* =========================================================
   MIGLOX — SUSTAINABILITY PAGE
========================================================= */

.miglox-sustainability {

    --green-dark: #0b1714;
    --green: #17352e;
    --green-soft: #4d7166;

    --black: #080b0c;
    --graphite: #171c1e;

    --ivory: #f0eee8;
    --stone: #e0e3df;

    --silver: #bdc3c1;
    --muted: #77817f;

    --gold: #c0b69e;

    color: #171c1d;

    overflow: hidden;

    font-family:
        "Inter",
        "Helvetica Neue",
        Arial,
        sans-serif;

}


.miglox-sustainability *,
.miglox-sustainability *::before,
.miglox-sustainability *::after {

    box-sizing: border-box;

}


.miglox-sustainability a {

    text-decoration: none;

}


.ms-container {

    width:
        min(1440px, 92%);

    margin:
        0 auto;

}


/* =========================================================
   COMMON LABEL
========================================================= */

.ms-section-label {

    display:
        flex;

    align-items:
        center;

    gap:
        14px;

    color:
        #777f7e;

    font-size:
        9px;

    font-weight:
        600;

    letter-spacing:
        2.8px;

}


.ms-section-label span {

    color:
        #9aa19f;

    font-size:
        8px;

}


.ms-section-label.light {

    color:
        #87928f;

}


.ms-section-label.light span {

    color:
        #bdc6c2;

}


/* =========================================================
   HERO
========================================================= */

.ms-hero {

    position:
        relative;

    min-height:
        820px;

    padding:
        215px 0 120px;

    display:
        flex;

    align-items:
        flex-end;

    overflow:
        hidden;

    color:
        #ffffff;

    background:
        #07100e;

}


.ms-hero-image {

    position:
        absolute;

    inset:
        0;

    background-image:
        url("https://images.unsplash.com/photo-1497435334941-8c899ee9e8e9?auto=format&fit=crop&w=2200&q=90");

    background-size:
        cover;

    background-position:
        center;

    opacity:
        .40;

    filter:
        saturate(.72)
        contrast(1.08);

    transform:
        scale(1.04);

}


.ms-hero-overlay {

    position:
        absolute;

    inset:
        0;

    background:

        linear-gradient(
            90deg,
            rgba(4,11,9,.97),
            rgba(4,11,9,.70),
            rgba(4,11,9,.25)
        ),

        linear-gradient(
            0deg,
            rgba(4,10,8,.96),
            transparent 65%
        );

}


.ms-hero-grid {

    position:
        absolute;

    inset:
        0;

    opacity:
        .045;

    background-image:

        linear-gradient(
            rgba(184,212,201,.14) 1px,
            transparent 1px
        ),

        linear-gradient(
            90deg,
            rgba(184,212,201,.14) 1px,
            transparent 1px
        );

    background-size:
        100px 100px;

}


.ms-eyebrow {

    position:
        relative;

    z-index:
        2;

    display:
        flex;

    align-items:
        center;

    gap:
        15px;

    margin-bottom:
        45px;

    color:
        #9ba6a2;

    font-size:
        9px;

    letter-spacing:
        3px;

}


.ms-eyebrow span {

    width:
        43px;

    height:
        1px;

    background:
        linear-gradient(
            90deg,
            #c7d2ce,
            transparent
        );

}


.ms-hero-content {

    position:
        relative;

    z-index:
        2;

    display:
        grid;

    grid-template-columns:
        1.15fr .55fr;

    gap:
        100px;

    align-items:
        end;

}


.ms-hero h1 {

    margin:
        0;

    font-size:
        clamp(75px, 10vw, 145px);

    line-height:
        .82;

    letter-spacing:
        -9px;

    font-weight:
        300;

}


.ms-hero h1 span {

    color:
        #b7c9c1;

    font-weight:
        500;

}


.ms-hero-side {

    padding-bottom:
        5px;

}


.ms-hero-mark {

    color:
        #a7b7b1;

    font-size:
        8px;

    line-height:
        1.5;

    letter-spacing:
        2px;

}


.ms-hero-mark span {

    display:
        block;

    margin-bottom:
        8px;

    color:
        #e0e5e2;

    font-size:
        48px;

    font-weight:
        200;

    line-height:
        1;

    letter-spacing:
        -2px;

}


.ms-hero-side p {

    max-width:
        390px;

    margin:
        25px 0;

    color:
        #899590;

    font-size:
        12px;

    line-height:
        1.9;

}


.ms-hero-link {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        16px;

    color:
        #c7cfcc;

    font-size:
        8px;

    font-weight:
        600;

    letter-spacing:
        1.7px;

    text-transform:
        uppercase;

}


.ms-hero-link b {

    width:
        32px;

    height:
        32px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    border:
        1px solid
        rgba(205,220,214,.25);

    font-weight:
        400;

}


/* =========================================================
   INTRO
========================================================= */

.ms-intro {

    padding:
        140px 0;

    background:
        linear-gradient(
            135deg,
            #f2f0e9,
            #e1e6e2
        );

}


.ms-intro-grid {

    display:
        grid;

    grid-template-columns:
        1fr .72fr;

    gap:
        120px;

    margin-top:
        65px;

}


.ms-intro h2 {

    margin:
        0;

    font-size:
        clamp(52px, 6vw, 86px);

    line-height:
        .92;

    letter-spacing:
        -5px;

    font-weight:
        300;

}


.ms-intro h2 span {

    color:
        #61736e;

    font-weight:
        400;

}


.ms-intro-copy {

    padding-top:
        5px;

}


.ms-intro-copy p {

    margin:
        0 0 23px;

    color:
        #727c79;

    font-size:
        12px;

    line-height:
        1.9;

}


.ms-intro-copy .ms-lead {

    color:
        #35423e;

    font-size:
        17px;

    line-height:
        1.65;

}


/* =========================================================
   PILLARS
========================================================= */

.ms-pillars {

    padding:
        120px 0 145px;

    color:
        #ffffff;

    background:
        #0a110f;

}


.ms-pillars-heading {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        flex-end;

    padding-bottom:
        50px;

    border-bottom:
        1px solid
        rgba(205,220,214,.10);

}


.ms-pillars-heading p {

    max-width:
        330px;

    margin:
        0;

    color:
        #737f7b;

    font-size:
        11px;

    line-height:
        1.8;

}


.ms-pillars-grid {

    display:
        grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap:
        2px;

    margin-top:
        2px;

}


.ms-pillar {

    position:
        relative;

    min-height:
        550px;

    overflow:
        hidden;

}


.ms-pillar-image {

    position:
        absolute;

    inset:
        0;

}


.ms-pillar-image img {

    width:
        100%;

    height:
        100%;

    display:
        block;

    object-fit:
        cover;

    filter:
        saturate(.68)
        contrast(1.05);

    transition:
        transform .8s ease,
        filter .5s ease;

}


.ms-pillar:hover
.ms-pillar-image img {

    transform:
        scale(1.07);

    filter:
        saturate(.95)
        contrast(1.05);

}


.ms-pillar-overlay {

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            0deg,
            rgba(5,12,10,.97),
            rgba(5,12,10,.10) 75%
        );

}


.ms-pillar-content {

    position:
        absolute;

    z-index:
        2;

    left:
        42px;

    right:
        42px;

    bottom:
        40px;

}


.ms-pillar-number {

    position:
        absolute;

    right:
        0;

    bottom:
        0;

    color:
        rgba(203,218,212,.16);

    font-size:
        80px;

    font-weight:
        200;

    line-height:
        .8;

}


.ms-pillar-tag {

    display:
        block;

    margin-bottom:
        15px;

    color:
        #b7c3bd;

    font-size:
        8px;

    font-weight:
        600;

    letter-spacing:
        2.5px;

}


.ms-pillar h3 {

    position:
        relative;

    z-index:
        2;

    margin:
        0 0 20px;

    color:
        #e1e7e4;

    font-size:
        clamp(38px, 4vw, 58px);

    line-height:
        .92;

    letter-spacing:
        -3px;

    font-weight:
        300;

}


.ms-pillar h3 em {

    color:
        #93a69e;

    font-style:
        normal;

    font-weight:
        400;

}


.ms-pillar p {

    position:
        relative;

    z-index:
        2;

    max-width:
        440px;

    margin:
        0;

    color:
        #899590;

    font-size:
        11px;

    line-height:
        1.85;

}


/* =========================================================
   ENERGY
========================================================= */

.ms-energy {

    position:
        relative;

    min-height:
        750px;

    padding:
        130px 0;

    display:
        flex;

    align-items:
        center;

    overflow:
        hidden;

    color:
        #ffffff;

    background:
        #0b1110;

}


.ms-energy-image {

    position:
        absolute;

    inset:
        0;

    background-image:
        url("https://miglox.com/wp-content/uploads/2026/06/2.jpg");

    background-size:
        cover;

    background-position:
        center;

    opacity:
        .34;

    filter:
        saturate(.65);

}


.ms-energy-overlay {

    position:
        absolute;

    inset:
        0;

    background:
        linear-gradient(
            90deg,
            #08100e,
            rgba(8,16,14,.70),
            rgba(8,16,14,.30)
        );

}


.ms-energy-content {

    position:
        relative;

    z-index:
        2;

    max-width:
        900px;

}


.ms-energy-content h2 {

    margin:
        45px 0 30px;

    font-size:
        clamp(55px, 7vw, 100px);

    line-height:
        .9;

    letter-spacing:
        -6px;

    font-weight:
        300;

}


.ms-energy-content h2 span {

    color:
        #8da79e;

    font-weight:
        400;

}


.ms-energy-content p {

    max-width:
        570px;

    margin:
        0 0 18px;

    color:
        #818d88;

    font-size:
        12px;

    line-height:
        1.9;

}


.ms-dark-button {

    display:
        inline-flex;

    align-items:
        center;

    gap:
        15px;

    margin-top:
        22px;

    min-height:
        50px;

    padding:
        0 7px 0 20px;

    color:
        #16201d;

    background:
        linear-gradient(
            135deg,
            #dce4e0,
            #8ca19a
        );

    font-size:
        8px;

    font-weight:
        700;

    letter-spacing:
        1.4px;

    text-transform:
        uppercase;

}


.ms-dark-button span {

    width:
        35px;

    height:
        35px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    background:
        rgba(0,0,0,.10);

    font-size:
        15px;

}


/* =========================================================
   INDUSTRY
========================================================= */

.ms-industry {

    padding:
        140px 0;

    background:
        #e9ebe8;

}


.ms-industry-grid {

    display:
        grid;

    grid-template-columns:
        1fr .75fr;

    gap:
        120px;

    margin-top:
        65px;

}


.ms-industry-title h2 {

    margin:
        0;

    font-size:
        clamp(50px, 6vw, 84px);

    line-height:
        .93;

    letter-spacing:
        -5px;

    font-weight:
        300;

}


.ms-industry-title h2 span {

    color:
        #60716c;

}


.ms-industry-copy > p {

    margin:
        0 0 35px;

    color:
        #737c79;

    font-size:
        12px;

    line-height:
        1.9;

}


.ms-industry-points {

    border-top:
        1px solid
        rgba(28,39,35,.15);

}


.ms-industry-points div {

    min-height:
        58px;

    display:
        flex;

    align-items:
        center;

    gap:
        25px;

    border-bottom:
        1px solid
        rgba(28,39,35,.15);

}


.ms-industry-points strong {

    width:
        28px;

    color:
        #9aa19e;

    font-size:
        8px;

    font-weight:
        500;

}


.ms-industry-points span {

    color:
        #394440;

    font-size:
        11px;

    font-weight:
        500;

}


/* =========================================================
   LONG TERM
========================================================= */

.ms-longterm {

    position:
        relative;

    min-height:
        700px;

    padding:
        130px 0;

    display:
        flex;

    align-items:
        center;

    color:
        #ffffff;

    background:

        radial-gradient(
            circle at 70% 40%,
            rgba(47,88,75,.35),
            transparent 35%
        ),

        linear-gradient(
            135deg,
            #07100d,
            #101917
        );

}


.ms-longterm-inner {

    max-width:
        1000px;

}


.ms-longterm h2 {

    margin:
        45px 0 28px;

    font-size:
        clamp(60px, 8vw, 110px);

    line-height:
        .86;

    letter-spacing:
        -7px;

    font-weight:
        300;

}


.ms-longterm h2 em {

    color:
        #a5b8af;

    font-style:
        normal;

}


.ms-longterm p {

    max-width:
        570px;

    margin:
        0;

    color:
        #7d8984;

    font-size:
        13px;

    line-height:
        1.9;

}


.ms-longterm-line {

    width:
        95px;

    height:
        1px;

    margin:
        42px 0 25px;

    background:
        linear-gradient(
            90deg,
            #a9baaf,
            transparent
        );

}


.ms-longterm-statement {

    color:
        #7e8985;

    font-size:
        8px;

    letter-spacing:
        2.8px;

}


.ms-longterm-statement strong {

    color:
        #b6c5bf;

}


/* =========================================================
   CTA
========================================================= */

.ms-cta {

    padding:
        125px 0;

    background:
        linear-gradient(
            135deg,
            #eeece6,
            #dfe4e1
        );

}


.ms-cta-inner {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        flex-end;

    gap:
        70px;

}


.ms-cta-label {

    color:
        #68736f;

    font-size:
        8px;

    font-weight:
        600;

    letter-spacing:
        3px;

}


.ms-cta h2 {

    margin:
        30px 0 20px;

    font-size:
        clamp(55px, 7vw, 100px);

    line-height:
        .88;

    letter-spacing:
        -6px;

    font-weight:
        300;

}


.ms-cta h2 span {

    color:
        #60736c;

    font-weight:
        500;

}


.ms-cta p {

    margin:
        0;

    color:
        #747d7a;

    font-size:
        11px;

}


.ms-cta-buttons {

    min-width:
        250px;

    display:
        flex;

    flex-direction:
        column;

    gap:
        10px;

}


.ms-primary-btn {

    min-height:
        54px;

    padding:
        0 8px 0 20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    color:
        #edf0ee;

    background:
        #202926;

    font-size:
        8px;

    font-weight:
        700;

    letter-spacing:
        1.3px;

    text-transform:
        uppercase;

}


.ms-primary-btn span {

    width:
        38px;

    height:
        38px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    color:
        #202926;

    background:
        linear-gradient(
            135deg,
            #dce3df,
            #8c9e97
        );

    font-size:
        15px;

}


.ms-secondary-btn {

    min-height:
        50px;

    padding:
        0 20px;

    display:
        flex;

    align-items:
        center;

    justify-content:
        space-between;

    color:
        #343d3a;

    border:
        1px solid
        rgba(31,42,38,.24);

    font-size:
        8px;

    font-weight:
        600;

    letter-spacing:
        1.3px;

    text-transform:
        uppercase;

}


/* =========================================================
   RESPONSIVE
========================================================= */

@media (max-width: 1000px) {

    .ms-hero-content,
    .ms-intro-grid,
    .ms-industry-grid {

        grid-template-columns:
            1fr;

        gap:
            55px;

    }


    .ms-pillars-grid {

        grid-template-columns:
            1fr;

    }


    .ms-cta-inner {

        flex-direction:
            column;

        align-items:
            flex-start;

    }


    .ms-cta-buttons {

        width:
            100%;

        max-width:
            330px;

    }

}


@media (max-width: 600px) {

    .ms-container {

        width:
            90%;

    }


    .ms-hero {

        min-height:
            700px;

        padding:
            165px 0 80px;

    }


    .ms-hero h1 {

        font-size:
            clamp(58px, 15vw, 82px);

        letter-spacing:
            -5px;

    }


    .ms-intro,
    .ms-pillars,
    .ms-industry {

        padding:
            85px 0;

    }


    .ms-intro h2,
    .ms-industry-title h2 {

        font-size:
            clamp(45px, 12vw, 64px);

        letter-spacing:
            -3px;

    }


    .ms-pillar {

        min-height:
            470px;

    }


    .ms-pillar-content {

        left:
            25px;

        right:
            25px;

        bottom:
            28px;

    }


    .ms-pillar h3 {

        font-size:
            40px;

    }


    .ms-energy,
    .ms-longterm {

        min-height:
            620px;

        padding:
            85px 0;

    }


    .ms-energy-content h2,
    .ms-longterm h2 {

        font-size:
            clamp(48px, 12vw, 68px);

        letter-spacing:
            -4px;

    }


    .ms-cta {

        padding:
            85px 0;

    }


    .ms-cta h2 {

        font-size:
            clamp(48px, 12vw, 68px);

        letter-spacing:
            -4px;

    }

}/* End custom CSS */