:root {
    --ecm103-green:#61d72f;
    --ecm103-green-light:#8ce642;
    --ecm103-dark:#06100c;
    --ecm103-dark2:#0b1711;
    --ecm103-border:#dfe4e1;
}

.ecm-original-header-hidden {
    display:none !important;
}

#ecm-modern-header {
    position:relative;
    z-index:1000;
    width:100%;
    background:#fff;
    font-family:Montserrat,Arial,sans-serif;
    box-shadow:0 3px 12px rgba(0,0,0,.09);
}

/* ==========================================================
   LIGNE 1 - BARRE NOIRE COMPACTE
   ========================================================== */

#ecm-modern-header .ecm-v103-top {
    display:grid;

    grid-template-columns:
        1.05fr
        .9fr
        1.12fr
        1.02fr
        .82fr
        .78fr;

    align-items:center;

    min-height:58px;

    padding:0 3.2%;

    background:#050e0b;

    color:#fff;

    border-bottom:
        1px solid rgba(255,255,255,.16);
}

#ecm-modern-header .ecm-v103-trust,
#ecm-modern-header .ecm-v103-reviews,
#ecm-modern-header .ecm-v103-contact {
    display:flex;
    align-items:center;

    gap:9px;

    min-width:0;

    padding:0 15px;
}

#ecm-modern-header .ecm-v103-trust + .ecm-v103-trust,
#ecm-modern-header .ecm-v103-reviews,
#ecm-modern-header .ecm-v103-contact {
    border-left:
        1px solid rgba(255,255,255,.13);
}

#ecm-modern-header .ecm-v103-top img {
    width:30px;
    height:30px;
}

#ecm-modern-header .ecm-v103-top strong {
    display:block;

    color:#fff;

    font-size:12px;

    line-height:1.12;
}

#ecm-modern-header .ecm-v103-top small {
    display:block;

    margin-top:3px;

    color:#dadfdb;

    font-size:10px;
}

#ecm-modern-header .ecm-v103-trust:first-child small {
    color:var(--ecm103-green);

    font-weight:700;
}

#ecm-modern-header .ecm-v103-stars {
    color:#ffc928;

    font-size:15px;

    letter-spacing:1px;

    white-space:nowrap;
}

#ecm-modern-header .ecm-v103-contact {
    justify-content:center;

    color:#fff !important;

    text-decoration:none !important;
}

/* ==========================================================
   LIGNE 2 - FOND HERBE
   ========================================================== */

#ecm-modern-header .ecm-v103-main {
    display:grid;

    grid-template-columns:
        minmax(290px,.75fr)
        minmax(540px,1.65fr)
        minmax(330px,.82fr);

    align-items:center;

    gap:26px;

    min-height:128px;

    padding:15px 3.3%;

    color:#fff;

    background-image:
        linear-gradient(
            90deg,
            rgba(4,14,9,.91) 0%,
            rgba(7,25,11,.37) 48%,
            rgba(3,12,8,.86) 100%
        ),
        url("../img/grass-v103.jpg");

    background-size:cover;

    background-position:center;

    background-repeat:no-repeat;
}

/* ==========================================================
   LOGO
   ========================================================== */

#ecm-modern-header .ecm-v103-logo {
    display:block;

    color:#fff !important;

    text-decoration:none !important;
}

#ecm-modern-header .ecm-v103-logo img {
    display:block;

    width:auto;

    max-width:280px;

    max-height:74px;

    object-fit:contain;
}

#ecm-modern-header .ecm-v103-logo small {
    display:block;

    margin-top:7px;

    color:#fff;

    font-size:8px;

    letter-spacing:3px;

    text-shadow:
        0 1px 4px rgba(0,0,0,.8);
}

/* ==========================================================
   RECHERCHE
   ========================================================== */

#ecm-modern-header .ecm-v103-search form {
    display:grid;

    grid-template-columns:
        54px
        minmax(0,1fr)
        182px;

    align-items:center;

    height:58px;

    padding:3px;

    background:#fff;

    border-radius:32px;

    box-shadow:
        0 5px 16px rgba(0,0,0,.22);
}

#ecm-modern-header .ecm-v103-search-icon {
    display:flex;

    align-items:center;

    justify-content:center;
}

#ecm-modern-header .ecm-v103-search-icon img {
    width:28px;

    height:28px;

    filter:brightness(0);
}

#ecm-modern-header .ecm-v103-search input {
    width:100%;

    height:100%;

    border:0;

    outline:0;

    padding:0 10px;

    color:#4b4b4b;

    font-size:14px;

    background:#fff;
}

#ecm-modern-header .ecm-v103-search button {
    display:flex;

    align-items:center;

    justify-content:center;

    gap:7px;

    height:52px;

    border:0;

    border-radius:28px;

    background:
        linear-gradient(
            90deg,
            #38b91e,
            #68db31
        );

    color:#fff;

    font-size:14px;

    font-weight:800;

    cursor:pointer;
}

#ecm-modern-header .ecm-v103-search button img {
    width:21px;

    height:21px;

    filter:
        brightness(0)
        invert(1);
}

#ecm-modern-header .ecm-v103-examples {
    margin-top:7px;

    color:#fff;

    text-align:center;

    font-size:10px;

    text-shadow:
        0 1px 3px rgba(0,0,0,.85);
}

/* ==========================================================
   ACTIONS
   ========================================================== */

#ecm-modern-header .ecm-v103-actions {
    display:flex;

    align-items:center;

    justify-content:flex-end;

    gap:25px;
}

#ecm-modern-header .ecm-v103-actions > a {
    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    color:#fff !important;

    text-decoration:none !important;

    text-align:center;
}

#ecm-modern-header .ecm-v103-actions img {
    width:34px;

    height:34px;

    margin-bottom:4px;

    filter:
        brightness(0)
        invert(1);
}

#ecm-modern-header .ecm-v103-actions > a > span {
    color:#fff;

    font-size:11px;

    font-weight:700;
}

#ecm-modern-header .ecm-v103-help {
    flex-direction:row !important;

    gap:8px;

    padding-left:20px;

    border-left:
        1px solid rgba(255,255,255,.28);

    text-align:left !important;
}

#ecm-modern-header .ecm-v103-help img {
    margin-bottom:0;
}

#ecm-modern-header .ecm-v103-help strong {
    display:block;

    font-size:11px;
}

#ecm-modern-header .ecm-v103-help small {
    display:block;

    margin-top:2px;

    color:#ddd;

    font-size:9px;
}

/* ==========================================================
   LIGNE 3 - NAV
   ========================================================== */

#ecm-modern-header .ecm-v103-nav {
    display:grid;

    grid-template-columns:
        1.18fr
        .95fr
        1.03fr
        .92fr
        .88fr
        1.02fr;

    min-height:58px;

    background:#fff;
}

#ecm-modern-header .ecm-v103-nav > a {
    display:flex;

    align-items:center;

    justify-content:center;

    gap:9px;

    min-width:0;

    padding:0 15px;

    border-right:
        1px solid #e4e8e5;

    color:#111711 !important;

    font-size:12px;

    font-weight:800;

    text-decoration:none !important;

    white-space:nowrap;
}

#ecm-modern-header .ecm-v103-nav > a:hover {
    background:#f4fff0;
}

#ecm-modern-header .ecm-v103-nav img {
    width:29px;

    height:29px;
}

#ecm-modern-header .ecm-v103-nav b {
    color:#239d21;

    font-size:15px;
}

#ecm-modern-header .ecm-v103-nav-main {
    justify-content:flex-start !important;

    padding-left:34px !important;

    background:
        linear-gradient(
            90deg,
            #67df31,
            #92e942
        );
}

#ecm-modern-header .ecm-v103-second-life {
    color:#fff !important;

    background:
        linear-gradient(
            108deg,
            #65dd31 0 8%,
            #06100c 8% 100%
        ) !important;
}

#ecm-modern-header .ecm-v103-second-life span {
    color:#fff;

    line-height:1.18;
}

#ecm-modern-header .ecm-v103-second-life img {
    width:33px;

    height:33px;
}

/* ==========================================================
   ECRANS INTERMEDIAIRES
   ========================================================== */

@media (max-width:1350px) {

    #ecm-modern-header .ecm-v103-top {
        grid-template-columns:repeat(3,1fr);

        row-gap:8px;

        padding-top:8px;

        padding-bottom:8px;
    }

    #ecm-modern-header .ecm-v103-main {
        grid-template-columns:1fr;

        text-align:center;

        padding-top:14px;

        padding-bottom:14px;
    }

    #ecm-modern-header .ecm-v103-logo img {
        margin:0 auto;
    }

    #ecm-modern-header .ecm-v103-actions {
        justify-content:center;
    }

    #ecm-modern-header .ecm-v103-nav {
        grid-template-columns:repeat(3,1fr);
    }
}

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

@media (max-width:767px) {

    #ecm-modern-header .ecm-v103-top {
        display:none;
    }

    #ecm-modern-header .ecm-v103-main {
        min-height:0;

        padding:14px 10px;
    }

    #ecm-modern-header .ecm-v103-logo img {
        max-width:230px;

        max-height:65px;
    }

    #ecm-modern-header .ecm-v103-logo small {
        display:none;
    }

    #ecm-modern-header .ecm-v103-search form {
        grid-template-columns:
            42px
            minmax(0,1fr);

        height:48px;

        margin-bottom:50px;

        border-radius:7px;
    }

    #ecm-modern-header .ecm-v103-search button {
        grid-column:1 / -1;

        height:43px;

        margin-top:7px;

        border-radius:7px;
    }

    #ecm-modern-header .ecm-v103-examples {
        display:none;
    }

    #ecm-modern-header .ecm-v103-help {
        display:none !important;
    }

    #ecm-modern-header .ecm-v103-nav {
        grid-template-columns:1fr 1fr;
    }

    #ecm-modern-header .ecm-v103-nav > a {
        min-height:54px;

        padding:6px;

        font-size:10px;

        white-space:normal;
    }

    #ecm-modern-header .ecm-v103-nav-main {
        justify-content:center !important;

        padding-left:6px !important;
    }

    #ecm-modern-header .ecm-v103-nav img {
        width:25px;

        height:25px;
    }
}