/* ==========================================================
   GITARAM HIGHER SECONDARY SCHOOL
   COMMON INNER PAGE DESIGN SYSTEM

   Font  : Instrument Sans
   Theme : White + Midnight Blue #191970
========================================================== */

:root {

    --hs-blue: #191970;
    --hs-blue-dark: #10105d;

    --hs-white: #ffffff;

    --hs-text: #292938;
    --hs-muted: #666674;

    --hs-soft: #f5f5fa;
    --hs-soft-2: #eeeeF6;

    --hs-border:
        rgba(25, 25, 112, 0.14);

    --hs-container: 1180px;
}


/* ==========================================================
   BASE
========================================================== */

.hs-inner-page,
.hs-inner-page * {
    box-sizing: border-box;
}


.hs-inner-page {

    width: 100%;

    margin: 0;
    padding: 0;

    overflow-x: hidden;

    background: var(--hs-white);

    color: var(--hs-text);

    font-family:
        "Instrument Sans",
        Arial,
        sans-serif;
}


.hs-container {

    width:
        min(
            var(--hs-container),
            calc(100% - 48px)
        );

    margin-left: auto;
    margin-right: auto;
}


.hs-inner-page img {

    max-width: 100%;
}


/* ==========================================================
   TYPOGRAPHY
========================================================== */

.hs-label {

    margin:
        0
        0
        16px;

    color: var(--hs-blue);

    font-size: 12px;

    line-height: 1;

    font-weight: 750;

    letter-spacing: 2px;

    text-transform: uppercase;
}


.hs-heading {

    margin: 0;

    color:
        var(--hs-blue)
        !important;

    font-family:
        "Instrument Sans",
        Arial,
        sans-serif;

    font-size:
        clamp(
            34px,
            4vw,
            55px
        );

    line-height: 1.07;

    font-weight: 600;

    letter-spacing: -1.8px;
}


.hs-subheading {

    margin:
        0
        0
        18px;

    color:
        var(--hs-blue)
        !important;

    font-family:
        "Instrument Sans",
        Arial,
        sans-serif;

    font-size:
        clamp(
            25px,
            3vw,
            38px
        );

    line-height: 1.14;

    font-weight: 600;

    letter-spacing: -1px;
}


.hs-lead {

    margin:
        0
        0
        21px;

    color: #2b2b3b;

    font-size: 20px;

    line-height: 1.68;
}


.hs-copy p {

    margin:
        0
        0
        19px;

    color: var(--hs-muted);

    font-size: 16px;

    line-height: 1.82;
}


.hs-copy p:last-child {

    margin-bottom: 0;
}


.hs-copy ul,
.hs-copy ol {

    margin: 20px 0;

    padding-left: 22px;
}


.hs-copy li {

    margin-bottom: 9px;

    color: var(--hs-muted);

    font-size: 16px;

    line-height: 1.72;
}


/* ==========================================================
   NORMAL SOLID BLUE BACKGROUND

   Only elements intentionally using .hs-blue
   receive white text.

   This does NOT affect normal white sections.
========================================================== */

.hs-blue {

    color: #ffffff;
}


.hs-blue h1,
.hs-blue h2,
.hs-blue h3,
.hs-blue h4,
.hs-blue h5,
.hs-blue h6,
.hs-blue p,
.hs-blue li,
.hs-blue span,
.hs-blue strong,
.hs-blue small {

    color:
        #ffffff
        !important;
}


.hs-blue .hs-heading,
.hs-blue .hs-subheading {

    color:
        #ffffff
        !important;
}


.hs-blue .hs-label {

    color:
        rgba(
            255,
            255,
            255,
            .72
        )
        !important;
}


/* ==========================================================
   INNER PAGE HERO WITH IMAGE
========================================================== */

.hs-page-hero {

    position: relative;

    min-height: 360px;

    display: flex;

    align-items: flex-end;

    overflow: hidden;

    background: var(--hs-blue);
}


.hs-page-hero-image {

    position: absolute;

    inset: 0;

    z-index: 0;
}


.hs-page-hero-image img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;
}


.hs-page-hero-overlay {

    position: absolute;

    inset: 0;

    z-index: 1;

    background:

        linear-gradient(

            90deg,

            rgba(
                9,
                9,
                57,
                .94
            )
            0%,

            rgba(
                25,
                25,
                112,
                .80
            )
            42%,

            rgba(
                25,
                25,
                112,
                .42
            )
            70%,

            rgba(
                10,
                10,
                45,
                .10
            )
            100%

        );
}


.hs-page-hero-content {

    position: relative;

    z-index: 2;

    width: 100%;

    padding:
        72px
        0
        48px;
}


/* ==========================================================
   IMPORTANT:
   ONLY HERO TEXT OVER IMAGE = PURE WHITE
========================================================== */

.hs-page-hero-content,
.hs-page-hero-content h1,
.hs-page-hero-content h2,
.hs-page-hero-content h3,
.hs-page-hero-content p,
.hs-page-hero-content span,
.hs-page-hero-content strong,
.hs-page-hero-content small,
.hs-page-hero-content .hs-label,
.hs-page-hero-content .hs-heading,
.hs-page-hero-content .hs-subheading {

    color:
        #ffffff
        !important;
}


.hs-page-hero-content .hs-label {

    color:
        #ffffff
        !important;
}


.hs-page-hero h1 {

    max-width: 820px;

    margin: 0;

    color:
        #ffffff
        !important;

    font-family:
        "Instrument Sans",
        Arial,
        sans-serif;

    font-size:
        clamp(
            43px,
            6vw,
            72px
        );

    line-height: .99;

    font-weight: 600;

    letter-spacing: -2.8px;
}


.hs-page-hero p {

    max-width: 680px;

    margin:
        22px
        0
        0;

    color:
        #ffffff
        !important;

    font-size: 17px;

    line-height: 1.7;
}


/* ==========================================================
   SIMPLE HERO
   No photograph
========================================================== */

.hs-page-hero-simple {

    padding:
        65px
        0
        55px;

    background:
        var(--hs-blue);

    color: #ffffff;
}


.hs-page-hero-simple h1 {

    margin: 0;

    color:
        #ffffff
        !important;

    font-size:
        clamp(
            42px,
            6vw,
            70px
        );

    line-height: 1;

    font-weight: 600;

    letter-spacing: -2.7px;
}


.hs-page-hero-simple p {

    max-width: 680px;

    margin:
        22px
        0
        0;

    color:
        #ffffff
        !important;

    font-size: 17px;

    line-height: 1.7;
}


/* ==========================================================
   BREADCRUMB
========================================================== */

.hs-breadcrumb {

    background:
        #ffffff;

    border-bottom:
        1px
        solid
        var(--hs-border);
}


.hs-breadcrumb-inner {

    min-height: 49px;

    display: flex;

    align-items: center;

    flex-wrap: wrap;

    gap: 9px;

    font-size: 13px;
}


.hs-breadcrumb a {

    color:
        var(--hs-blue)
        !important;

    text-decoration: none;

    font-weight: 700;
}


.hs-breadcrumb span {

    color: #85858f;
}


/* ==========================================================
   STANDARD SECTIONS
========================================================== */

.hs-section {

    padding:
        78px
        0;

    background:
        #ffffff;

    color:
        var(--hs-text);
}


.hs-section-small {

    padding:
        50px
        0;
}


.hs-section-soft {

    padding:
        78px
        0;

    background:
        var(--hs-soft);
}


.hs-section-blue {

    padding:
        78px
        0;

    background:
        var(--hs-blue);

    color:
        #ffffff;
}


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

.hs-intro-grid {

    display: grid;

    grid-template-columns:

        minmax(
            0,
            .82fr
        )

        minmax(
            0,
            1.18fr
        );

    gap:
        clamp(
            45px,
            7vw,
            82px
        );

    align-items: start;
}


/* ==========================================================
   TWO COLUMN
========================================================== */

.hs-two-column {

    display: grid;

    grid-template-columns:

        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap:
        clamp(
            40px,
            6vw,
            70px
        );

    align-items: center;
}


.hs-two-column-top {

    align-items: start;
}


/* ==========================================================
   STANDARD IMAGE + TEXT
========================================================== */

.hs-image-text {

    display: grid;

    grid-template-columns:

        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap:
        clamp(
            40px,
            6vw,
            70px
        );

    align-items: center;
}


.hs-image-text.reverse
.hs-image-box {

    order: 2;
}


.hs-image-text.reverse
.hs-copy {

    order: 1;
}


.hs-image-box {

    overflow: hidden;

    background:
        var(--hs-soft);
}


.hs-image-box img {

    width: 100%;
    height: auto;

    display: block;

    object-fit: cover;
}


/* ==========================================================
   FULL IMAGE FEATURE

   Growing With Purpose
   GitaRam Today

   TEXT APPEARS DIRECTLY ON IMAGE
========================================================== */

.hs-media-feature {

    position: relative;

    width: 100%;

    aspect-ratio:
        16 / 7;

    min-height: 420px;

    overflow: hidden;

    background:
        var(--hs-blue);
}


/* IMAGE */

.hs-media-feature-image {

    position: absolute;

    inset: 0;

    z-index: 0;
}


.hs-media-feature-image img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    object-position: center;

    transform:
        scale(1.01);

    transition:

        transform
        1.15s
        cubic-bezier(
            .2,
            .7,
            .2,
            1
        );
}


.hs-media-feature:hover
.hs-media-feature-image img {

    transform:
        scale(1.04);
}


/* ==========================================================
   LEFT SIDE IMAGE GRADIENT
========================================================== */

.hs-media-feature::after {

    content: "";

    position: absolute;

    inset: 0;

    z-index: 1;

    background:

        linear-gradient(

            90deg,

            rgba(
                8,
                8,
                48,
                .90
            )
            0%,

            rgba(
                25,
                25,
                112,
                .73
            )
            34%,

            rgba(
                25,
                25,
                112,
                .34
            )
            63%,

            rgba(
                0,
                0,
                0,
                .03
            )
            100%

        );
}


/* ==========================================================
   RIGHT SIDE IMAGE GRADIENT
========================================================== */

.hs-media-feature-right::after {

    background:

        linear-gradient(

            270deg,

            rgba(
                8,
                8,
                48,
                .90
            )
            0%,

            rgba(
                25,
                25,
                112,
                .73
            )
            34%,

            rgba(
                25,
                25,
                112,
                .34
            )
            63%,

            rgba(
                0,
                0,
                0,
                .03
            )
            100%

        );
}


/* ==========================================================
   IMAGE OVERLAY CONTENT
========================================================== */

.hs-media-feature-content {

    position: relative;

    z-index: 2;

    width:
        min(
            var(--hs-container),
            calc(100% - 70px)
        );

    min-height: inherit;

    margin-left: auto;
    margin-right: auto;

    padding:
        55px
        0;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: flex-start;
}


.hs-media-feature-right
.hs-media-feature-content {

    align-items: flex-end;
}


.hs-media-feature-inner {

    width:
        min(
            550px,
            52%
        );
}


.hs-media-feature-right
.hs-media-feature-inner {

    width:
        min(
            550px,
            52%
        );
}


/* ==========================================================
   CRITICAL FIX

   ONLY TEXT WHICH IS OVER THE IMAGE
   IS PURE WHITE.

   This does NOT affect normal page text.
========================================================== */

.hs-media-feature-content,
.hs-media-feature-content h1,
.hs-media-feature-content h2,
.hs-media-feature-content h3,
.hs-media-feature-content h4,
.hs-media-feature-content h5,
.hs-media-feature-content h6,
.hs-media-feature-content p,
.hs-media-feature-content span,
.hs-media-feature-content strong,
.hs-media-feature-content small,
.hs-media-feature-content a,
.hs-media-feature-content li,
.hs-media-feature-content .hs-label,
.hs-media-feature-content .hs-heading,
.hs-media-feature-content .hs-subheading {

    color:
        #ffffff
        !important;
}


/* Label on image */

.hs-media-feature-content
.hs-label {

    color:
        #ffffff
        !important;
}


/* Heading on image */

.hs-media-feature-content
.hs-heading {

    margin-bottom: 20px;

    color:
        #ffffff
        !important;

    font-size:
        clamp(
            30px,
            3.3vw,
            46px
        );
}


/* Paragraph on image */

.hs-media-feature-content p {

    margin:
        0
        0
        14px;

    color:
        #ffffff
        !important;

    font-size: 16px;

    line-height: 1.72;
}


.hs-media-feature-content p:last-child {

    margin-bottom: 0;
}


/* White decorative line */

.hs-media-feature-line {

    width: 52px;

    height: 2px;

    margin:
        0
        0
        20px;

    background:
        #ffffff
        !important;
}


/* ==========================================================
   CARDS
========================================================== */

.hs-card-grid,
.hs-card-grid-2,
.hs-card-grid-4 {

    display: grid;

    border-top:
        1px
        solid
        var(--hs-border);

    border-left:
        1px
        solid
        var(--hs-border);
}


.hs-card-grid {

    grid-template-columns:

        repeat(
            3,
            minmax(
                0,
                1fr
            )
        );
}


.hs-card-grid-2 {

    grid-template-columns:

        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );
}


.hs-card-grid-4 {

    grid-template-columns:

        repeat(
            4,
            minmax(
                0,
                1fr
            )
        );
}


.hs-card {

    padding:
        33px
        31px
        37px;

    background:
        #ffffff;

    border-right:
        1px
        solid
        var(--hs-border);

    border-bottom:
        1px
        solid
        var(--hs-border);
}


.hs-card-number {

    margin-bottom: 32px;

    color:
        rgba(
            25,
            25,
            112,
            .40
        );

    font-size: 12px;

    font-weight: 750;
}


.hs-card h3 {

    margin:
        0
        0
        12px;

    color:
        var(--hs-blue)
        !important;

    font-size: 22px;

    line-height: 1.2;

    font-weight: 600;
}


.hs-card p {

    margin: 0;

    color:
        var(--hs-muted);

    font-size: 15px;

    line-height: 1.7;
}


/* ==========================================================
   BLUE CARDS
========================================================== */

.hs-blue-card-grid {

    display: grid;

    grid-template-columns:

        repeat(
            3,
            minmax(
                0,
                1fr
            )
        );

    border-top:
        1px
        solid
        rgba(
            255,
            255,
            255,
            .22
        );

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


.hs-blue-card {

    padding:
        34px
        31px;

    border-right:
        1px
        solid
        rgba(
            255,
            255,
            255,
            .22
        );

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


.hs-blue-card h3 {

    margin:
        0
        0
        12px;

    color:
        #ffffff
        !important;

    font-size: 22px;

    font-weight: 600;
}


.hs-blue-card p {

    margin: 0;

    color:
        #ffffff
        !important;

    font-size: 15px;

    line-height: 1.7;
}


/* ==========================================================
   HIGHLIGHT
========================================================== */

.hs-highlight {

    padding: 35px;

    border-left:
        4px
        solid
        var(--hs-blue);

    background:
        var(--hs-soft);
}


.hs-highlight p {

    margin: 0;

    color:
        var(--hs-blue);

    font-size:
        clamp(
            21px,
            2.4vw,
            28px
        );

    line-height: 1.45;

    font-weight: 520;
}


/* ==========================================================
   QUOTE
========================================================== */

.hs-quote {

    padding: 42px;

    background:
        var(--hs-blue);

    color:
        #ffffff;
}


.hs-quote p {

    margin: 0;

    color:
        #ffffff
        !important;

    font-size:
        clamp(
            22px,
            2.7vw,
            31px
        );

    line-height: 1.44;

    font-weight: 500;
}


/* ==========================================================
   INFORMATION LIST
========================================================== */

.hs-info-list {

    margin: 0;

    padding: 0;

    list-style: none;

    border-top:
        1px
        solid
        var(--hs-border);
}


.hs-info-list li {

    display: grid;

    grid-template-columns:
        45px
        1fr;

    gap: 20px;

    padding:
        21px
        0;

    border-bottom:
        1px
        solid
        var(--hs-border);

    color:
        var(--hs-muted);

    font-size: 16px;

    line-height: 1.7;
}


.hs-info-list-number {

    color:
        var(--hs-blue);

    font-size: 12px;

    font-weight: 750;
}


/* ==========================================================
   TABLE
========================================================== */

.hs-table-wrap {

    width: 100%;

    overflow-x: auto;

    border:
        1px
        solid
        var(--hs-border);
}


.hs-table {

    width: 100%;

    border-collapse:
        collapse;

    background:
        #ffffff;
}


.hs-table th {

    padding:
        15px
        18px;

    background:
        var(--hs-blue);

    color:
        #ffffff
        !important;

    text-align: left;

    font-size: 13px;

    font-weight: 700;
}


.hs-table td {

    padding:
        14px
        18px;

    border-bottom:
        1px
        solid
        var(--hs-border);

    color:
        var(--hs-muted);

    font-size: 15px;

    line-height: 1.55;
}


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

.hs-cta {

    padding:
        60px
        0;

    background:
        var(--hs-soft);
}


.hs-cta-inner {

    display: flex;

    align-items: center;

    justify-content:
        space-between;

    gap: 40px;
}


.hs-cta .hs-heading {

    max-width: 700px;

    color:
        var(--hs-blue)
        !important;

    font-size:
        clamp(
            29px,
            3.4vw,
            43px
        );
}


.hs-button {

    flex-shrink: 0;

    display:
        inline-flex;

    align-items: center;

    justify-content: center;

    gap: 13px;

    min-height: 52px;

    padding:
        0
        26px;

    background:
        var(--hs-blue);

    border:
        1px
        solid
        var(--hs-blue);

    color:
        #ffffff
        !important;

    text-decoration:
        none
        !important;

    font-size: 13px;

    font-weight: 750;

    letter-spacing: .5px;

    text-transform:
        uppercase;

    transition:
        background
        .25s
        ease,
        color
        .25s
        ease;
}


.hs-button:hover {

    background:
        #ffffff;

    color:
        var(--hs-blue)
        !important;
}


.hs-button-white {

    background:
        #ffffff;

    border-color:
        #ffffff;

    color:
        var(--hs-blue)
        !important;
}


.hs-button-white:hover {

    background:
        transparent;

    color:
        #ffffff
        !important;
}


/* ==========================================================
   FORMS
========================================================== */

.hs-form {

    display: grid;

    gap: 20px;
}


.hs-form-row {

    display: grid;

    grid-template-columns:

        repeat(
            2,
            minmax(
                0,
                1fr
            )
        );

    gap: 20px;
}


.hs-form label {

    display: block;

    margin-bottom: 7px;

    color:
        var(--hs-blue);

    font-size: 13px;

    font-weight: 700;
}


.hs-form input,
.hs-form textarea,
.hs-form select {

    width: 100%;

    padding:
        14px
        15px;

    border:
        1px
        solid
        var(--hs-border);

    border-radius: 0;

    background:
        #ffffff;

    color:
        var(--hs-text);

    font-family:
        "Instrument Sans",
        Arial,
        sans-serif;

    font-size: 15px;

    outline: none;
}


.hs-form input:focus,
.hs-form textarea:focus,
.hs-form select:focus {

    border-color:
        var(--hs-blue);
}


/* ==========================================================
   EMPTY STATE
========================================================== */

.hs-empty-state {

    padding:
        50px
        28px;

    border:
        1px
        solid
        var(--hs-border);

    background:
        var(--hs-soft);

    text-align: center;
}


.hs-empty-state h3 {

    margin:
        0
        0
        10px;

    color:
        var(--hs-blue);

    font-size: 23px;

    font-weight: 600;
}


.hs-empty-state p {

    margin: 0;

    color:
        var(--hs-muted);

    font-size: 15px;

    line-height: 1.7;
}


/* ==========================================================
   GALLERY
========================================================== */

.hs-gallery-grid {

    display: grid;

    grid-template-columns:

        repeat(
            3,
            minmax(
                0,
                1fr
            )
        );

    gap: 18px;
}


.hs-gallery-item {

    position: relative;

    aspect-ratio:
        4 / 3;

    overflow: hidden;

    background:
        var(--hs-soft);
}


.hs-gallery-item img {

    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform
        .55s
        ease;
}


.hs-gallery-item:hover img {

    transform:
        scale(1.035);
}


/* ==========================================================
   ANIMATION
========================================================== */

.hs-js
.hs-reveal,

.hs-js
.hs-reveal-left,

.hs-js
.hs-reveal-right,

.hs-js
.hs-media-feature-inner {

    opacity: 0;

    transition:

        opacity
        .8s
        ease,

        transform
        .8s
        cubic-bezier(
            .2,
            .7,
            .2,
            1
        );
}


.hs-js
.hs-reveal {

    transform:
        translateY(25px);
}


.hs-js
.hs-reveal-left {

    transform:
        translateX(-35px);
}


.hs-js
.hs-reveal-right {

    transform:
        translateX(35px);
}


.hs-js
.hs-media-feature-inner {

    transform:
        translateY(30px);
}


.hs-js
.hs-reveal.is-visible,

.hs-js
.hs-reveal-left.is-visible,

.hs-js
.hs-reveal-right.is-visible,

.hs-js
.hs-media-feature.is-visible
.hs-media-feature-inner {

    opacity: 1;

    transform:
        translate3d(
            0,
            0,
            0
        );
}


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

@media
(max-width: 1000px) {

    .hs-card-grid-4 {

        grid-template-columns:

            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }

}


@media
(max-width: 900px) {


    .hs-container {

        width:
            calc(
                100%
                - 36px
            );
    }


    .hs-intro-grid,
    .hs-two-column,
    .hs-image-text {

        grid-template-columns:
            1fr;

        gap: 34px;
    }


    .hs-image-text.reverse
    .hs-image-box,

    .hs-image-text.reverse
    .hs-copy {

        order: initial;
    }


    .hs-card-grid,
    .hs-card-grid-2,
    .hs-blue-card-grid {

        grid-template-columns:
            1fr;
    }


    .hs-gallery-grid {

        grid-template-columns:

            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }


    .hs-media-feature {

        aspect-ratio:
            16 / 9;

        min-height:
            400px;
    }


    .hs-media-feature-content {

        width:
            calc(
                100%
                - 50px
            );

        padding:
            48px
            0;
    }


    .hs-media-feature-inner,
    .hs-media-feature-right
    .hs-media-feature-inner {

        width:
            min(
                510px,
                67%
            );
    }


    .hs-cta-inner {

        flex-direction:
            column;

        align-items:
            flex-start;
    }


    .hs-js
    .hs-reveal-left,

    .hs-js
    .hs-reveal-right {

        transform:
            translateY(
                25px
            );
    }

}


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

@media
(max-width: 600px) {


    .hs-container {

        width:
            calc(
                100%
                - 30px
            );
    }


    .hs-page-hero {

        min-height:
            285px;
    }


    .hs-page-hero-content {

        padding:
            52px
            0
            35px;
    }


    .hs-page-hero h1 {

        font-size:
            41px;

        letter-spacing:
            -1.5px;
    }


    .hs-page-hero p {

        font-size:
            15.5px;
    }


    .hs-section,
    .hs-section-soft,
    .hs-section-blue {

        padding:
            56px
            0;
    }


    .hs-section-small {

        padding:
            38px
            0;
    }


    .hs-heading {

        font-size:
            33px;

        letter-spacing:
            -1.1px;
    }


    .hs-lead {

        font-size:
            18px;
    }


    .hs-card,
    .hs-blue-card {

        padding:
            28px
            25px;
    }


    .hs-card-grid-4 {

        grid-template-columns:
            1fr;
    }


    .hs-gallery-grid {

        grid-template-columns:
            1fr;
    }


    .hs-form-row {

        grid-template-columns:
            1fr;
    }


    .hs-highlight,
    .hs-quote {

        padding:
            28px
            23px;
    }


    .hs-cta {

        padding:
            48px
            0;
    }


    /* ===============================================
       IMAGE TEXT SECTION MOBILE
    =============================================== */

    .hs-media-feature {

        aspect-ratio:
            auto;

        min-height:
            430px;
    }


    .hs-media-feature-content,

    .hs-media-feature-right
    .hs-media-feature-content {

        width:
            calc(
                100%
                - 34px
            );

        min-height:
            430px;

        padding:
            38px
            0;

        justify-content:
            flex-end;

        align-items:
            flex-start;
    }


    .hs-media-feature-inner,

    .hs-media-feature-right
    .hs-media-feature-inner {

        width: 100%;

        max-width: 100%;
    }


    .hs-media-feature-content
    .hs-heading {

        color:
            #ffffff
            !important;

        font-size:
            30px;
    }


    .hs-media-feature-content p {

        color:
            #ffffff
            !important;

        font-size:
            15px;

        line-height:
            1.68;
    }


    .hs-media-feature-content
    .hs-label {

        color:
            #ffffff
            !important;
    }


    /*
       Mobile uses bottom gradient because
       text sits towards bottom of image.
    */

    .hs-media-feature::after,

    .hs-media-feature-right::after {

        background:

            linear-gradient(

                0deg,

                rgba(
                    8,
                    8,
                    55,
                    .97
                )
                0%,

                rgba(
                    25,
                    25,
                    112,
                    .78
                )
                47%,

                rgba(
                    25,
                    25,
                    112,
                    .12
                )
                100%

            );
    }

}


/* ==========================================================
   REDUCED MOTION
========================================================== */

@media
(prefers-reduced-motion: reduce) {


    .hs-js
    .hs-reveal,

    .hs-js
    .hs-reveal-left,

    .hs-js
    .hs-reveal-right,

    .hs-js
    .hs-media-feature-inner {

        opacity:
            1
            !important;

        transform:
            none
            !important;

        transition:
            none
            !important;
    }


    .hs-media-feature-image img,

    .hs-gallery-item img {

        transition:
            none
            !important;
    }

}
/* ==========================================================
   FORCE ALL HERO IMAGE TEXT TO PURE WHITE
========================================================== */

html body .hs-page-hero .hs-page-hero-content,
html body .hs-page-hero .hs-page-hero-content *,
html body .hs-page-hero .hs-page-hero-content h1,
html body .hs-page-hero .hs-page-hero-content h2,
html body .hs-page-hero .hs-page-hero-content h3,
html body .hs-page-hero .hs-page-hero-content h4,
html body .hs-page-hero .hs-page-hero-content h5,
html body .hs-page-hero .hs-page-hero-content h6,
html body .hs-page-hero .hs-page-hero-content p,
html body .hs-page-hero .hs-page-hero-content span,
html body .hs-page-hero .hs-page-hero-content strong,
html body .hs-page-hero .hs-page-hero-content small,
html body .hs-page-hero .hs-page-hero-content a,
html body .hs-page-hero .hs-page-hero-content li,
html body .hs-page-hero .hs-page-hero-content .hs-label,
html body .hs-page-hero .hs-page-hero-content .hs-heading,
html body .hs-page-hero .hs-page-hero-content .hs-subheading {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* HERO LABEL */

html body .hs-page-hero
.hs-page-hero-content
.hs-label {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* HERO MAIN HEADING */

html body .hs-page-hero
.hs-page-hero-content h1 {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* HERO PARAGRAPH */

html body .hs-page-hero
.hs-page-hero-content p {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* HERO LINKS */

html body .hs-page-hero
.hs-page-hero-content a,
html body .hs-page-hero
.hs-page-hero-content a:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}