/* =========================================================
   GEOSPHERES — MATERIAL IMAGERY
========================================================= */

.geospheres-material-imagery {
    width: 100%;
    background: #f5f5f5;
    padding: 80px 40px;
    box-sizing: border-box;

    font-family: Montserrat, Arial, sans-serif !important;
}

.geospheres-material-container {
    width: 100%;
    max-width: 1720px;
    margin: 0 auto;
}


/* =========================================================
   SECTION LABEL
========================================================= */

.geospheres-material-label {
    margin-bottom: 22px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.2;

    color: #d71920;
    text-transform: uppercase;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.geospheres-material-heading {
    margin: 0;
    max-width: 1500px;

    font-family: Montserrat, Arial, sans-serif;
    font-size: clamp(58px, 6.3vw, 70px);
    font-weight: 700;
    letter-spacing: -3.5px;
    line-height: 0.98;

    color: #111217;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.geospheres-material-description {
    max-width: 1680px;

    margin: 42px 0 44px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.65;

    color: #40566b;
}


/* =========================================================
   IMAGE GRID
========================================================= */

.geospheres-material-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px;
    align-items: stretch;
}


/* =========================================================
   CARD
========================================================= */

.geospheres-material-card {
    overflow: hidden;

    background: #ffffff;

    border: 1px solid #dedede;
    border-radius: 22px;

    box-sizing: border-box;

    font-family: Montserrat, Arial, sans-serif !important;
}


/* =========================================================
   IMAGE
========================================================= */

.geospheres-material-image {
    width: 100%;
    height: 305px;

    overflow: hidden;
    background: #e9e9e9;
}

.geospheres-material-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* =========================================================
   CARD CONTENT
========================================================= */

.geospheres-material-card-content {
    padding: 22px 24px 21px;
}

.geospheres-material-card-content h3 {
    margin: 0 0 8px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.25;

    color: #111217;
}

.geospheres-material-card-content p {
    margin: 0;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.45;

    color: #40566b;
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1100px) {

    .geospheres-material-imagery {
        padding: 70px 30px;
    }

    .geospheres-material-heading {
        font-size: clamp(50px, 6.3vw, 65px);
    }

    .geospheres-material-description {
        font-size: 21px;
        margin-top: 32px;
        margin-bottom: 35px;
    }

    .geospheres-material-image {
        height: 330px;
    }

}


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

@media (max-width: 767px) {

    .geospheres-material-imagery {
        padding: 55px 20px;
    }

    .geospheres-material-label {
        margin-bottom: 18px;

        font-size: 13px;
        letter-spacing: 2.5px;
    }

    .geospheres-material-heading {
        font-size: 43px;
        letter-spacing: -2px;
        line-height: 1;
    }

    .geospheres-material-description {
        margin: 25px 0 30px;

        font-size: 17px;
        line-height: 1.6;
    }

    .geospheres-material-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .geospheres-material-image {
        height: 280px;
    }

    .geospheres-material-card {
        border-radius: 17px;
    }

    .geospheres-material-card-content {
        padding: 19px 20px 20px;
    }

    .geospheres-material-card-content h3 {
        font-size: 20px;
        margin-bottom: 7px;
    }

    .geospheres-material-card-content p {
        font-size: 16px;
        line-height: 1.5;
    }

}


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

@media (max-width: 480px) {

    .geospheres-material-imagery {
        padding: 45px 16px;
    }

    .geospheres-material-heading {
        font-size: 37px;
    }

    .geospheres-material-description {
        font-size: 16px;
    }

    .geospheres-material-image {
        height: 235px;
    }

}

/* =========================================================
   GEOSPHERES — HOLLOW GLASS MICROSPHERE GRADE
========================================================= */

.geospheres-grade-intro {
    width: 100%;
    padding: 80px 40px;
    box-sizing: border-box;

    background: #ffffff;

    font-family: Montserrat, Arial, sans-serif !important;
}

.geospheres-grade-intro-container {
    width: 100%;
    max-width: 1720px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 70px;

    align-items: center;
}


/* =========================================================
   LEFT CONTENT
========================================================= */

.geospheres-grade-intro-content {
    width: 100%;
}


/* =========================================================
   SECTION LABEL
========================================================= */

.geospheres-grade-intro-label {
    margin-bottom: 26px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.2;

    color: #d71920;
    text-transform: uppercase;
}


/* =========================================================
   MAIN HEADING
========================================================= */

.geospheres-grade-intro-heading {
    max-width: 850px;

    margin: 0 0 42px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: clamp(58px, 6.3vw, 70px);
    font-weight: 700;
    letter-spacing: -3.8px;
    line-height: 0.98;

    color: #111217;
}


/* =========================================================
   MAIN DESCRIPTION
========================================================= */

.geospheres-grade-intro-description {
    max-width: 850px;

    margin: 0 0 30px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.75;

    color: #40566b;
}


/* =========================================================
   SECONDARY TEXT
========================================================= */

.geospheres-grade-intro-text {
    max-width: 850px;

    margin: 0 0 27px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.85;

    color: #40566b;
}


/* =========================================================
   BUTTON
========================================================= */

.geospheres-grade-intro-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 68px;
    padding: 0 32px;

    box-sizing: border-box;

    border-radius: 40px;

    background: #e31b23;
    color: #ffffff;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 800;
    letter-spacing: 0.3px;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;

    transition:
        background 0.25s ease,
        transform 0.25s ease;
}

.geospheres-grade-intro-button:hover {
    background: #c9141b;
    color: #ffffff;

    transform: translateY(-2px);
}


/* =========================================================
   RIGHT IMAGE
========================================================= */

.geospheres-grade-intro-image {
    width: 100%;
    height: 615px;

    overflow: hidden;

    border-radius: 23px;
}

.geospheres-grade-intro-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1200px) {

    .geospheres-grade-intro-container {
        gap: 45px;
    }

    .geospheres-grade-intro-heading {
        font-size: clamp(52px, 6.3vw, 66px);
    }

    .geospheres-grade-intro-description {
        font-size: 21px;
        line-height: 1.7;
    }

    .geospheres-grade-intro-image {
        height: 550px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .geospheres-grade-intro {
        padding: 70px 30px;
    }

    .geospheres-grade-intro-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .geospheres-grade-intro-heading {
        max-width: 900px;
    }

    .geospheres-grade-intro-description {
        max-width: 900px;
    }

    .geospheres-grade-intro-text {
        max-width: 900px;
    }

    .geospheres-grade-intro-image {
        height: 500px;
    }

}


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

@media (max-width: 767px) {

    .geospheres-grade-intro {
        padding: 55px 20px;
    }

    .geospheres-grade-intro-container {
        gap: 35px;
    }

    .geospheres-grade-intro-label {
        margin-bottom: 18px;

        font-size: 13px;
        letter-spacing: 2.5px;
    }

    .geospheres-grade-intro-heading {
        margin-bottom: 28px;

        font-size: 43px;
        letter-spacing: -2px;
        line-height: 1;
    }

    .geospheres-grade-intro-description {
        margin-bottom: 24px;

        font-size: 17px;
        line-height: 1.65;
    }

    .geospheres-grade-intro-text {
        margin-bottom: 25px;

        font-size: 16px;
        line-height: 1.65;
    }

    .geospheres-grade-intro-button {
        min-height: 60px;
        padding: 0 27px;

        font-size: 14px;
    }

    .geospheres-grade-intro-image {
        height: 360px;
        border-radius: 17px;
    }

}


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

@media (max-width: 480px) {

    .geospheres-grade-intro {
        padding: 45px 16px;
    }

    .geospheres-grade-intro-heading {
        font-size: 37px;
        letter-spacing: -1.7px;
    }

    .geospheres-grade-intro-description {
        font-size: 16px;
    }

    .geospheres-grade-intro-text {
        font-size: 15px;
    }

    .geospheres-grade-intro-image {
        height: 290px;
    }

}

/* =========================================================
   GEOSPHERES — CEMENTING SCREENING DATA
========================================================= */

.geospheres-screening-data {
    width: 100%;
    padding: 80px 40px;
    box-sizing: border-box;

    background: #ffffff;

    font-family: Montserrat, Arial, sans-serif !important;
}

.geospheres-screening-data-container {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;
}


/* =========================================================
   SECTION LABEL
========================================================= */

.geospheres-screening-data-label {
    margin-bottom: 24px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.2;

    color: #d71920;
    text-transform: uppercase;
}


/* =========================================================
   MAIN TITLE
========================================================= */

.geospheres-screening-data-title {
    margin: 0;
    max-width: 1500px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: clamp(58px, 6.3vw, 70px);
    font-weight: 700;
    letter-spacing: -3.8px;
    line-height: 0.98;

    color: #111217;
}


/* =========================================================
   DESCRIPTION
========================================================= */

.geospheres-screening-data-description {
    max-width: 1740px;

    margin: 42px 0 50px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.75;

    color: #40566b;
}


/* =========================================================
   REFERENCE VALUE GRID
========================================================= */

.geospheres-screening-data-grid {
    display: grid;

    grid-template-columns: repeat(4, minmax(0, 1fr));

    gap: 17px;

    width: 100%;
}


/* =========================================================
   VALUE CARD
========================================================= */

.geospheres-screening-data-card {

    padding: 10px 22px;

    box-sizing: border-box;

    background: #ffffff;

    border: 1px solid #dcdcdc;
    border-radius: 17px;

    display: flex;
    flex-direction: column;
    justify-content: center;

    font-family: Montserrat, Arial, sans-serif !important;
}


/* =========================================================
   CARD LABEL
========================================================= */

.geospheres-screening-data-card-label {
    margin-bottom: 10px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: 0.2px;

    color: #e21b23;

    text-transform: uppercase;
}


/* =========================================================
   CARD VALUE
========================================================= */

.geospheres-screening-data-card-value {
    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 18px;
    font-weight: 800;
    line-height: 1.2;

    color: #111217;
}


/* =========================================================
   TEST BASIS
========================================================= */

.geospheres-screening-data-basis {
    margin-top: 39px;
    padding: 25px 32px;

    box-sizing: border-box;

    border-left: 6px solid #e21b23;

    font-family: Montserrat, Arial, sans-serif !important;
}


.geospheres-screening-data-basis p {
    margin: 0;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.75;

    color: #40566b;
}


.geospheres-screening-data-basis strong {
    font-family: Montserrat, Arial, sans-serif !important;
    font-weight: 700;

    color: #40566b;
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1200px) {

    .geospheres-screening-data-description {
        font-size: 21px;
    }

    .geospheres-screening-data-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .geospheres-screening-data {
        padding: 70px 30px;
    }

    .geospheres-screening-data-title {
        font-size: clamp(50px, 6.3vw, 65px);
    }

    .geospheres-screening-data-description {
        margin-top: 30px;
        margin-bottom: 38px;

        font-size: 20px;
        line-height: 1.65;
    }

    .geospheres-screening-data-card {
        min-height: 120px;
        padding: 26px 28px;
    }

}


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

@media (max-width: 767px) {

    .geospheres-screening-data {
        padding: 55px 20px;
    }

    .geospheres-screening-data-label {
        margin-bottom: 18px;

        font-size: 13px;
        letter-spacing: 2.5px;
    }

    .geospheres-screening-data-title {
        font-size: 43px;
        letter-spacing: -2px;
        line-height: 1;
    }

    .geospheres-screening-data-description {
        margin: 25px 0 30px;

        font-size: 17px;
        line-height: 1.65;
    }

    .geospheres-screening-data-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .geospheres-screening-data-card {
        min-height: auto;
        padding: 24px 22px;
        border-radius: 15px;
    }

    .geospheres-screening-data-card-label {
        margin-bottom: 12px;

        font-size: 14px;
    }

    .geospheres-screening-data-card-value {
        font-size: 20px;
    }

    .geospheres-screening-data-basis {
        margin-top: 30px;
        padding: 20px 20px;
        border-left-width: 5px;
    }

    .geospheres-screening-data-basis p {
        font-size: 15px;
        line-height: 1.65;
    }

}


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

@media (max-width: 480px) {

    .geospheres-screening-data {
        padding: 45px 16px;
    }

    .geospheres-screening-data-title {
        font-size: 37px;
        letter-spacing: -1.7px;
    }

    .geospheres-screening-data-description {
        font-size: 16px;
    }

    .geospheres-screening-data-card {
        padding: 21px 19px;
    }

    .geospheres-screening-data-card-label {
        font-size: 13px;
    }

    .geospheres-screening-data-card-value {
        font-size: 19px;
    }

    .geospheres-screening-data-basis {
        padding: 18px 17px;
    }

    .geospheres-screening-data-basis p {
        font-size: 14px;
    }

}

/* =========================================================
   GEOSPHERES — CEMENTING BENCHMARK COMPARISON
========================================================= */

.geospheres-benchmark-comparison {
    width: 100%;
    padding: 80px 40px;
    box-sizing: border-box;

    background: #101318;

    font-family: Montserrat, Arial, sans-serif !important;
}

.geospheres-benchmark-container {
    width: 100%;
    max-width: 1800px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    gap: 70px;

    align-items: start;
}


/* =========================================================
   LEFT CONTENT
========================================================= */

.geospheres-benchmark-content {
    width: 100%;
    padding-top: 2px;
}


/* =========================================================
   SECTION LABEL
========================================================= */

.geospheres-benchmark-label {
    margin-bottom: 31px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 3px;
    line-height: 1.2;

    color: #ff7b82;
    text-transform: uppercase;
}


/* =========================================================
   MAIN TITLE
========================================================= */

.geospheres-benchmark-title {
    max-width: 700px;

    margin: 0 0 45px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: clamp(58px, 6.3vw, 70px);
    font-weight: 700;
    letter-spacing: -3.8px;
    line-height: 0.98;

    color: #ffffff;
}


/* =========================================================
   MAIN DESCRIPTION
========================================================= */

.geospheres-benchmark-description {
    max-width: 700px;

    margin: 0 0 31px;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 1.82;

    color: #d5e0ed;
}


/* =========================================================
   DISCLAIMER / SECONDARY TEXT
========================================================= */

.geospheres-benchmark-note {
    max-width: 700px;

    margin: 0;

    font-family: Montserrat, Arial, sans-serif !important;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.9;

    color: #b7c9dc;
}


/* =========================================================
   GRAPH CONTAINER
========================================================= */

.geospheres-benchmark-graph {
    width: 100%;

    overflow: hidden;

    border: 1px solid #343a42;
    border-radius: 20px;

    background: #171b20;

    box-sizing: border-box;
}


/* =========================================================
   GRAPH IMAGE
========================================================= */

.geospheres-benchmark-graph img {
    display: block;

    width: 100%;
    height: auto;

    object-fit: cover;
}


/* =========================================================
   LARGE TABLET
========================================================= */

@media (max-width: 1200px) {

    .geospheres-benchmark-container {
        grid-template-columns: minmax(0, 0.75fr) minmax(0, 1.25fr);
        gap: 45px;
    }

    .geospheres-benchmark-title {
        font-size: clamp(52px, 6.3vw, 66px);
    }

    .geospheres-benchmark-description {
        font-size: 21px;
        line-height: 1.7;
    }

    .geospheres-benchmark-note {
        font-size: 16px;
        line-height: 1.75;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .geospheres-benchmark-comparison {
        padding: 70px 30px;
    }

    .geospheres-benchmark-container {
        grid-template-columns: 1fr;
        gap: 45px;
    }

    .geospheres-benchmark-title {
        max-width: 900px;
    }

    .geospheres-benchmark-description {
        max-width: 900px;
    }

    .geospheres-benchmark-note {
        max-width: 900px;
    }

    .geospheres-benchmark-graph {
        border-radius: 18px;
    }

}


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

@media (max-width: 767px) {

    .geospheres-benchmark-comparison {
        padding: 55px 20px;
    }

    .geospheres-benchmark-container {
        gap: 35px;
    }

    .geospheres-benchmark-label {
        margin-bottom: 18px;

        font-size: 13px;
        letter-spacing: 2.5px;
    }

    .geospheres-benchmark-title {
        margin-bottom: 28px;

        font-size: 43px;
        letter-spacing: -2px;
        line-height: 1;
    }

    .geospheres-benchmark-description {
        margin-bottom: 24px;

        font-size: 17px;
        line-height: 1.65;
    }

    .geospheres-benchmark-note {
        font-size: 15px;
        line-height: 1.7;
    }

    .geospheres-benchmark-graph {
        border-radius: 15px;
    }

}


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

@media (max-width: 480px) {

    .geospheres-benchmark-comparison {
        padding: 45px 16px;
    }

    .geospheres-benchmark-title {
        font-size: 37px;
        letter-spacing: -1.7px;
    }

    .geospheres-benchmark-description {
        font-size: 16px;
    }

    .geospheres-benchmark-note {
        font-size: 14px;
    }

}