/*
 * CB Territory Lille
 * Bridge vers les vrais composants de la home.
 * Pas de redesign parallèle.
 */


/* ==========================================================
   CONTENEURS
   ========================================================== */

body.cb-territory-page
.cb-territory-homearch
.cb-section > .cb-tha-container,

body.cb-territory-page
.cb-territory-home-gallery > .cb-tha-container,

body.cb-territory-page
.cb-territory-home-proof > .cb-tha-container {
    width:min(1180px,calc(100% - 48px));
    margin-inline:auto;
}


/* ==========================================================
   APPROCHE
   ========================================================== */

body.cb-territory-page
.cb-territory-home-approach
.cb-tha-two-cols {
    display:grid;
    grid-template-columns:.9fr 1.1fr;
    gap:clamp(48px,8vw,130px);
    align-items:start;
}


body.cb-territory-page
.cb-territory-home-copy {
    max-width:650px;

    color:#4e4945;

    font-family:Manrope,system-ui,sans-serif;
    font-size:clamp(16px,1.25vw,19px);
    line-height:1.76;
}


body.cb-territory-page
.cb-territory-home-copy p:first-child {
    margin-top:0;
}


body.cb-territory-page
.cb-territory-home-copy p:last-child {
    margin-bottom:0;
}


/* ==========================================================
   PREUVES
   ========================================================== */

body.cb-territory-page
.cb-territory-home-proof {
    padding:clamp(82px,9vw,138px) 0;
}


body.cb-territory-page
.cb-territory-home-proof
#cb-conversion-proof-title {
    max-width:1000px;
}


body.cb-territory-page
.cb-territory-proof-lead {
    max-width:700px;
    margin:28px 0 0;

    font-family:Manrope,system-ui,sans-serif;
    font-size:16px;
    line-height:1.72;
}


body.cb-territory-page
.cb-territory-proof-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);

    gap:1px;

    margin-top:clamp(52px,6vw,80px);
}


body.cb-territory-page
.cb-territory-proof-grid article {
    padding:30px 26px;
}


body.cb-territory-page
.cb-territory-proof-grid strong {
    display:block;

    margin-bottom:8px;

    font-family:"Cormorant Garamond",Georgia,serif;
    font-size:clamp(34px,4vw,52px);
    font-weight:500;
    line-height:1;
}


body.cb-territory-page
.cb-territory-proof-grid span {
    font-family:Manrope,system-ui,sans-serif;
    font-size:13px;
    line-height:1.5;
}


/* ==========================================================
   ACCOMPAGNEMENT
   ========================================================== */

body.cb-territory-page
.cb-territory-home-accompaniment
.cb-gallery-heading {
    margin-bottom:50px;
}


body.cb-territory-page
.cb-territory-home-accompaniment
.cb-steps {
    margin-top:48px;
}


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

@media(max-width:760px) {

    body.cb-territory-page
    .cb-territory-homearch
    .cb-section > .cb-tha-container,

    body.cb-territory-page
    .cb-territory-home-gallery > .cb-tha-container,

    body.cb-territory-page
    .cb-territory-home-proof > .cb-tha-container {
        width:calc(100% - 34px);
    }


    body.cb-territory-page
    .cb-territory-home-approach
    .cb-tha-two-cols,

    body.cb-territory-page
    .cb-territory-gallery-heading {
        grid-template-columns:1fr;

        gap:28px;
    }


    body.cb-territory-page
    .cb-territory-proof-grid {
        grid-template-columns:1fr;
    }


    body.cb-territory-page
    .cb-territory-gallery-grid {
        grid-template-columns:1fr 1fr;

        gap:7px;
    }


    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item,
    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item:nth-child(1),
    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item:nth-child(2),
    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item:nth-child(3),
    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item:nth-child(4),
    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item:nth-child(n+5) {
        grid-column:auto;

        min-height:250px;
    }


    body.cb-territory-page
    .cb-territory-gallery-grid .grid-item:first-child {
        grid-column:1 / -1;

        min-height:410px;
    }

}