
.fohnHero{
    position: relative;

    height: 75vh;

    padding: 16px 16px 0px 16px;

    background-image:
        linear-gradient(
            90deg,
            rgba(0, 3, 10, 0.96) 0%,
            rgba(22, 18, 51, 0.82) 45%,
            rgba(22, 18, 51, 0.55) 100%
        ),
        url('../images/hero-woman.png');

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    overflow: hidden;
}

/* =========================
   HERO RESPONSIVE FIX
========================= */

@media (max-width: 980px){

    .fohnHero{
        height: auto;
        min-height: 75vh;

        padding: 120px 30px 40px 30px;
    }

    .fohnHero > div:first-child,
    .fohnHero > div:last-child{
        position: relative !important;

        left: auto !important;
        right: auto !important;
        bottom: auto !important;
    }

    .fohnHero > div:first-child{
        margin-bottom: 30px;

        max-width: 700px;

        font-size: 50px !important;

        line-height: 1.1;
    }

    .fohnHero > div:last-child{
        max-width: 420px;
    }
}

@media (max-width: 640px){

    .fohnHero{
        padding: 100px 20px 20px 20px;
    }

    .fohnHero > div:first-child{
        font-size: 38px !important;

        line-height: 1.15;
    }

    .fohnHero > div:last-child{
        max-width: 100%;
    }
}

/* =========================
   FOHN CONTACT SECTION
========================= */

.fohn-contact-section{
    padding: 90px 40px;

    background: #f4f8fc;

    font-family: 'Roboto', sans-serif;
}

.fohn-contact-container{
    max-width: 1400px;

    margin: 0 auto;

    display: grid;

    grid-template-columns: 1.1fr 0.9fr;

    background: #ffffff;

    border-radius: 10px;

    overflow: hidden;

    box-shadow: 0 10px 40px rgba(0,0,0,0.08);
}

/* =========================
   LEFT CONTENT
========================= */

.fohn-contact-content{
    padding: 70px;
}

.fohn-contact-kicker{
    display: inline-block;

    font-size: 15px;
    font-weight: 600;

    letter-spacing: 1px;

    text-transform: uppercase;

    color: #1e5bb8;

    margin-bottom: 16px;
}

.fohn-contact-content h2{
    font-size: 48px;

    line-height: 1.1;

    font-weight: 500;

    color: #194384;

    margin: 0 0 20px 0;
}

.fohn-contact-intro{
    font-size: 18px;

    line-height: 1.7;

    color: #5f6b7a;

    margin-bottom: 40px;

    max-width: 680px;
}

/* =========================
   FORM
========================= */

.fohn-contact-form{
    width: 100%;
}

.fohn-form-row{
    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 24px;
}

.fohn-form-group{
    margin-bottom: 24px;
}

.fohn-form-group label{
    display: block;

    margin-bottom: 10px;

    font-size: 15px;
    font-weight: 500;

    color: #194384;
}

.fohn-form-group input,
.fohn-form-group select,
.fohn-form-group textarea{
    width: 100%;

    border: 1px solid #d7e2ef;

    border-radius: 6px;

    padding: 14px 16px;

    font-size: 16px;

    background: #ffffff;

    transition: 0.2s ease;

    outline: none;
}

.fohn-form-group input:focus,
.fohn-form-group select:focus,
.fohn-form-group textarea:focus{
    border-color: #1e5bb8;

    box-shadow: 0 0 0 3px rgba(30,91,184,0.12);
}

.fohn-form-group textarea{
    resize: vertical;

    min-height: 140px;
}

.fohn-submit-btn{
    display: inline-block;

    background: #1e5bb8;

    color: #ffffff;

    border: none;

    border-radius: 6px;

    padding: 16px 28px;

    font-size: 16px;
    font-weight: 600;

    cursor: pointer;

    transition: 0.2s ease;
}

.fohn-submit-btn:hover{
    background: #194384;
}

/* =========================
   IMAGE
========================= */

.fohn-contact-image{
    position: relative;

    min-height: 100%;
}

.fohn-contact-image img{
    width: 100%;
    height: 100%;

    object-fit: cover;

    display: block;
}

/* subtle overlay */

.fohn-contact-image::after{
    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            to bottom,
            rgba(25,67,132,0.08),
            rgba(25,67,132,0.18)
        );
}

/* =========================
   RESPONSIVE
========================= */

@media (max-width:1124px){

    .topMenuSmall{
        display:none;
        width:100%;
        background:#0073BC;
        position:relative;
        z-index:9999;
        overflow:hidden;
    }

    .topMenuSmall.open{
        display:block !important;
    }

    .topMenuSmall .links{
        height:auto !important;
        margin:0;
        padding:0;
    }

    .topMenuSmall .links li{
        list-style:none;
    }

}

@media (max-width: 1100px){

    .fohn-contact-container{
        grid-template-columns: 1fr;
    }

    .fohn-contact-image{
        height: 400px;
    }
}

@media (max-width: 768px){

    .fohn-contact-section{
        padding: 60px 20px;
    }

    .fohn-contact-content{
        padding: 40px 28px;
    }

    .fohn-contact-content h2{
        font-size: 38px;
    }

    .fohn-form-row{
        grid-template-columns: 1fr;

        gap: 0;
    }
}