/* ==================================================
   OPEN MASTER
   Design System
================================================== */

:root {

    --om-blue-dark: #0B1F3A;
    --om-blue: #1266D6;
    --om-blue-light: #3B82F6;

    --om-white: #FFFFFF;
    --om-background: #F8FAFC;

    --om-text: #111827;
    --om-text-muted: #667085;

    --om-border: #E5E7EB;

    --om-radius: 18px;
    --om-radius-sm: 12px;

    --om-shadow:
        0 20px 50px rgba(15, 23, 42, 0.08);

}


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

html {
    scroll-behavior: smooth;
}

body {

    margin: 0;

    background: var(--om-white);

    color: var(--om-text);

    font-family: "Inter", sans-serif;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    text-decoration: none;
}

::selection {
    background: var(--om-blue);
    color: var(--om-white);
}


/* ==================================================
   HEADER
================================================== */

.om-header {

    position: relative;

    background: var(--om-white);

    border-bottom: 1px solid rgba(229, 231, 235, 0.75);

    z-index: 1000;
}

.om-header .navbar {

    min-height: 82px;

    padding-top: 12px;
    padding-bottom: 12px;
}


/* Logo */

.om-brand {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    font-size: 18px;

    font-weight: 800;

    letter-spacing: -0.7px;
}

.om-brand-open {
    color: var(--om-blue-dark);
}

.om-brand-open-white {
    color: var(--om-white); 
}

.om-brand-master {
    color: var(--om-blue);
}


/* Navigation */

.om-header .nav-link {

    position: relative;

    padding: 8px 15px !important;

    color: var(--om-text-muted);

    font-size: 14px;

    font-weight: 500;

    transition:
        color 0.2s ease;
}

.om-header .nav-link:hover {
    color: var(--om-blue);
}


/* Mobile menu */

.om-navbar-toggler {

    border: 0;

    padding: 6px;

    color: var(--om-blue-dark);

    font-size: 27px;
}

.om-navbar-toggler:focus {
    box-shadow: none;
}


/* ==================================================
   BUTTONS
================================================== */

.om-btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    border-radius: 10px;

    font-size: 14px;

    font-weight: 600;

    padding: 11px 18px;

    transition:
        transform 0.2s ease,
        background-color 0.2s ease,
        border-color 0.2s ease,
        color 0.2s ease,
        box-shadow 0.2s ease;
}

.om-btn:hover {
    transform: translateY(-1px);
}


.om-btn-primary {

    background: var(--om-blue);

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

    color: var(--om-white);

    box-shadow:
        0 8px 20px rgba(18, 102, 214, 0.18);
}

.om-btn-primary:hover {

    background: #0F5BBB;

    border-color: #0F5BBB;

    color: var(--om-white);

    box-shadow:
        0 10px 25px rgba(18, 102, 214, 0.25);
}


.om-btn-outline {

    background: var(--om-white);

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

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

.om-btn-outline:hover {

    background: var(--om-background);

    border-color: #CBD5E1;

    color: var(--om-blue-dark);
}


.om-btn-lg {

    min-height: 52px;

    padding: 14px 22px;

    border-radius: 11px;
}


/* ==================================================
   HERO
================================================== */

.om-hero {

    position: relative;

    overflow: hidden;

    padding:
        110px 0
        120px;

    background:
        radial-gradient(
            circle at 85% 30%,
            rgba(59, 130, 246, 0.08),
            transparent 30%
        ),
        var(--om-white);
}


.om-hero-content {
    position: relative;
    z-index: 2;
}


/* Eyebrow */

.om-eyebrow {

    display: inline-flex;

    align-items: center;

    gap: 9px;

    margin-bottom: 22px;

    color: var(--om-blue);

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 0.7px;

    text-transform: uppercase;
}

.om-eyebrow span {

    width: 7px;
    height: 7px;

    border-radius: 50%;

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


/* Hero title */

.om-hero-title {

    max-width: 780px;

    margin: 0;

    color: var(--om-blue-dark);

    font-size: clamp(42px, 5vw, 68px);

    font-weight: 800;

    line-height: 1.05;

    letter-spacing: -3px;
}

.om-hero-title span {
    display: block;
    color: var(--om-blue);
}


/* Hero text */

.om-hero-text {

    max-width: 650px;

    margin: 28px 0 0;

    color: var(--om-text-muted);

    font-size: 18px;

    line-height: 1.75;
}


/* Hero actions */

.om-hero-actions {

    display: flex;

    flex-wrap: wrap;

    gap: 12px;

    margin-top: 34px;
}


/* ==================================================
   HERO VISUAL
================================================== */

.om-hero-visual {

    position: relative;

    min-height: 470px;

    width: 100%;
}


.om-hero-visual::before {

    content: "";

    position: absolute;

    width: 330px;
    height: 330px;

    top: 50%;
    left: 50%;

    transform:
        translate(-50%, -50%);

    border-radius: 50%;

    background:
        rgba(18, 102, 214, 0.06);
}


/* Visual cards */

.om-visual-card {

    position: absolute;

    display: flex;

    align-items: center;

    gap: 15px;

    background: rgba(255, 255, 255, 0.96);

    border: 1px solid rgba(226, 232, 240, 0.9);

    border-radius: var(--om-radius);

    box-shadow: var(--om-shadow);

    backdrop-filter: blur(10px);
}


.om-visual-card-main {

    width: 280px;

    padding: 25px;

    top: 80px;
    left: 50%;

    transform: translateX(-50%);

    z-index: 3;
}


.om-visual-icon {

    display: flex;

    align-items: center;
    justify-content: center;

    flex: 0 0 auto;

    width: 52px;
    height: 52px;

    border-radius: 14px;

    background: rgba(18, 102, 214, 0.09);

    color: var(--om-blue);

    font-size: 23px;
}


.om-visual-card-main span {

    display: block;

    margin-bottom: 5px;

    color: var(--om-text-muted);

    font-size: 11px;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: 0.6px;
}


.om-visual-card-main strong {

    display: block;

    color: var(--om-blue-dark);

    font-size: 14px;

    line-height: 1.4;
}


/* Small cards */

.om-visual-card-small {

    width: 205px;

    padding: 15px 17px;

    z-index: 4;
}


.om-visual-card-small > i {

    display: flex;

    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border-radius: 10px;

    background: var(--om-background);

    color: var(--om-blue);

    font-size: 17px;
}


.om-visual-card-small small {

    display: block;

    margin-bottom: 2px;

    color: var(--om-text-muted);

    font-size: 9px;

    font-weight: 600;

    text-transform: uppercase;

    letter-spacing: 0.4px;
}


.om-visual-card-small strong {

    color: var(--om-blue-dark);

    font-size: 12px;
}


.om-visual-sites {

    top: 245px;
    left: 0;
}


.om-visual-sistemas {

    top: 315px;
    right: 0;
}


.om-visual-produtos {

    bottom: 15px;
    left: 50%;

    transform: translateX(-50%);
}


/* ==================================================
   GENERAL SECTIONS
================================================== */

.om-section {

    padding:
        110px 0;
}


.om-section-label {

    display: inline-block;

    margin-bottom: 15px;

    color: var(--om-blue);

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 0.8px;

    text-transform: uppercase;
}


.om-section-title {

    margin: 0;

    color: var(--om-blue-dark);

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

    font-weight: 800;

    line-height: 1.1;

    letter-spacing: -2px;
}


.om-section-text {

    max-width: 680px;

    margin:
        20px 0 0;

    color: var(--om-text-muted);

    font-size: 16px;

    line-height: 1.75;
}


/* ==================================================
   SOLUTIONS
================================================== */

.om-solutions {

    background: var(--om-background);
}


.om-solution-card {

    position: relative;

    height: 100%;

    padding: 30px;

    background: var(--om-white);

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

    border-radius: var(--om-radius);

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease,
        border-color 0.25s ease;
}


.om-solution-card:hover {

    transform: translateY(-5px);

    border-color:
        rgba(18, 102, 214, 0.22);

    box-shadow:
        0 20px 45px rgba(15, 23, 42, 0.08);
}


/* Card icon */

.om-card-icon {

    display: flex;

    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;

    margin-bottom: 25px;

    border-radius: 13px;

    background:
        rgba(18, 102, 214, 0.08);

    color: var(--om-blue);

    font-size: 20px;
}


/* Card number */

.om-card-number {

    display: block;

    margin-bottom: 9px;

    color: #98A2B3;

    font-size: 11px;

    font-weight: 700;

    letter-spacing: 0.7px;
}


.om-solution-card h3 {

    margin: 0;

    color: var(--om-blue-dark);

    font-size: 20px;

    font-weight: 700;

    letter-spacing: -0.5px;
}


.om-solution-card p {

    margin:
        14px 0 25px;

    color: var(--om-text-muted);

    font-size: 13px;

    line-height: 1.7;
}


/* Card link */

.om-card-link {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    color: var(--om-blue);

    font-size: 12px;

    font-weight: 700;

    transition:
        gap 0.2s ease;
}

.om-card-link:hover {
    gap: 10px;
}


/* ==================================================
   RESPONSIVE
================================================== */

@media (max-width: 991.98px) {

    .om-header .navbar-collapse {

        padding:
            18px 0
            10px;
    }

    .om-header .nav-link {
        padding:
            10px 0 !important;
    }

    .om-header .om-btn {
        margin-top: 10px;
        width: 100%;
    }


    .om-hero {

        padding:
            80px 0
            90px;
    }


    .om-hero-visual {

        max-width: 500px;

        min-height: 420px;

        margin:
            20px auto
            0;
    }

}


@media (max-width: 575.98px) {

    .om-header .navbar {
        min-height: 72px;
    }


    .om-hero {

        padding:
            65px 0
            70px;
    }


    .om-hero-title {

        font-size: 41px;

        letter-spacing: -2px;
    }


    .om-hero-text {

        font-size: 16px;
    }


    .om-hero-actions {

        flex-direction: column;
    }


    .om-hero-actions .om-btn {

        width: 100%;
    }


    .om-hero-visual {

        min-height: 430px;

        transform:
            scale(0.92);

        transform-origin:
            center top;
    }


    .om-visual-card-main {

        width: 265px;
    }


    .om-visual-sites {

        left: -5px;
    }


    .om-visual-sistemas {

        right: -5px;
    }


    .om-section {

        padding:
            75px 0;
    }


    .om-section-title {

        letter-spacing: -1.5px;
    }


    .om-solution-card {

        padding: 26px;
    }

}


/* ==================================================
   FOOTER
================================================== */

.om-footer {

    padding:
        65px 0
        30px;

    background: var(--om-blue-dark);

    color: var(--om-white);
}


.om-footer-brand {
    font-size: 17px;
}


.om-footer-description {

    margin:
        18px 0 0;

    max-width: 360px;

    color:
        rgba(255, 255, 255, 0.65);

    font-size: 13px;

    line-height: 1.7;
}


.om-footer-links {

    display: flex;

    justify-content: flex-end;

    flex-wrap: wrap;

    gap: 25px;
}


.om-footer-links a {

    color:
        rgba(255, 255, 255, 0.75);

    font-size: 13px;

    font-weight: 500;

    transition:
        color 0.2s ease;
}


.om-footer-links a:hover {
    color: var(--om-white);
}


.om-footer-divider {

    margin:
        45px 0
        25px;

    border-color:
        rgba(255, 255, 255, 0.12);

    opacity: 1;
}


.om-footer-copy {

    margin: 0;

    color:
        rgba(255, 255, 255, 0.45);

    font-size: 11px;

    line-height: 1.6;
}


/* ==================================================
   FOOTER RESPONSIVE
================================================== */

@media (max-width: 991.98px) {

    .om-footer-links {
        justify-content: flex-start;
    }

}


@media (max-width: 575.98px) {

    .om-footer {
        padding:
            50px 0
            25px;
    }


    .om-footer-links {

        flex-direction: column;

        gap: 13px;
    }


    .om-footer-divider {
        margin:
            35px 0
            20px;
    }

}


/* ==================================================
   PROBLEM → SOLUTION
================================================== */

.om-problem {

    padding:
        110px 0;

    background:
        var(--om-white);
}


.om-problem-wrapper {

    position: relative;

    overflow: hidden;

    padding:
        75px;

    background:
        var(--om-blue-dark);

    border-radius:
        28px;
}


/*
   Pequeno detalhe visual no fundo
*/

.om-problem-wrapper::before {

    content: "";

    position: absolute;

    width: 420px;
    height: 420px;

    top: -220px;
    right: -120px;

    border-radius: 50%;

    background:
        rgba(59, 130, 246, 0.12);

    pointer-events: none;
}


.om-problem-wrapper::after {

    content: "";

    position: absolute;

    width: 250px;
    height: 250px;

    bottom: -150px;
    left: 35%;

    border-radius: 50%;

    background:
        rgba(18, 102, 214, 0.12);

    pointer-events: none;
}


/* Conteúdo */

.om-problem .om-section-label {

    color:
        #6EA8FF;
}


.om-problem-title {

    position: relative;

    z-index: 2;

    max-width: 720px;

    margin: 0;

    color:
        var(--om-white);

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

    font-weight: 800;

    line-height: 1.1;

    letter-spacing:
        -2px;
}


.om-problem-title span {

    display: block;

    color:
        #6EA8FF;
}


.om-problem-text {

    position: relative;

    z-index: 2;

    max-width: 650px;

    margin:
        24px 0 0;

    color:
        rgba(255, 255, 255, 0.68);

    font-size:
        15px;

    line-height:
        1.8;
}


.om-problem-highlight {

    position: relative;

    z-index: 2;

    margin:
        28px 0 0;

    color:
        var(--om-white);

    font-size:
        20px;

    font-weight:
        700;

    letter-spacing:
        -0.4px;
}


/* Botão */

.om-problem .om-btn-primary {

    position: relative;

    z-index: 2;

    margin-top: 30px;

    background:
        var(--om-blue);

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


/* ==================================================
   PROBLEM VISUAL
================================================== */

.om-problem-visual {

    position: relative;

    z-index: 2;

    padding:
        35px;

    background:
        rgba(255, 255, 255, 0.06);

    border:
        1px solid rgba(255, 255, 255, 0.12);

    border-radius:
        22px;

    backdrop-filter:
        blur(10px);
}


.om-problem-icon {

    display: flex;

    align-items: center;
    justify-content: center;

    width: 55px;
    height: 55px;

    margin-bottom: 25px;

    border-radius:
        15px;

    background:
        rgba(59, 130, 246, 0.16);

    color:
        #6EA8FF;

    font-size:
        24px;
}


.om-problem-visual-title {

    color:
        var(--om-white);

    font-size:
        21px;

    font-weight:
        700;

    letter-spacing:
        -0.5px;
}


.om-problem-visual-text {

    margin-top:
        7px;

    color:
        rgba(255, 255, 255, 0.58);

    font-size:
        14px;
}


/* Fluxo */

.om-problem-flow {

    display: flex;

    align-items: center;

    gap: 12px;

    margin-top:
        40px;
}


.om-problem-flow-item {

    flex: 1;

    min-width: 0;
}


.om-problem-flow-item span {

    display: block;

    margin-bottom: 5px;

    color:
        #6EA8FF;

    font-size:
        10px;

    font-weight:
        700;

    letter-spacing:
        0.7px;
}


.om-problem-flow-item strong {

    display: block;

    color:
        rgba(255, 255, 255, 0.9);

    font-size:
        11px;

    font-weight:
        600;
}


.om-problem-flow > i {

    flex: 0 0 auto;

    color:
        rgba(255, 255, 255, 0.25);

    font-size:
        13px;
}


/* ==================================================
   PROBLEM RESPONSIVE
================================================== */

@media (max-width: 991.98px) {

    .om-problem-wrapper {

        padding:
            55px;
    }


    .om-problem-visual {

        max-width:
            500px;

        margin:
            10px auto
            0;
    }

}


@media (max-width: 575.98px) {

    .om-problem {

        padding:
            75px 0;
    }


    .om-problem-wrapper {

        padding:
            40px 25px;

        border-radius:
            20px;
    }


    .om-problem-title {

        font-size:
            34px;

        letter-spacing:
            -1.5px;
    }


    .om-problem-text {

        font-size:
            14px;
    }


    .om-problem-highlight {

        font-size:
            18px;
    }


    .om-problem .om-btn {

        width:
            100%;
    }


    .om-problem-visual {

        padding:
            27px 22px;
    }


    .om-problem-flow {

        gap:
            7px;
    }


    .om-problem-flow > i {

        font-size:
            10px;
    }


    .om-problem-flow-item strong {

        font-size:
            10px;
    }

}



/* ==================================================
   EXPERIENCE
================================================== */

.om-experience {

    padding:
        120px 0;

    background:
        var(--om-white);
}


.om-experience .om-section-title {

    max-width:
        600px;
}


.om-title-highlight {

    display: block;

    color:
        var(--om-blue);
}


.om-experience-text {

    max-width:
        580px;

    margin:
        25px 0 0;

    color:
        var(--om-text-dark);

    font-size:
        16px;

    font-weight:
        600;

    line-height:
        1.7;
}


/* Link */

.om-text-link {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-top:
        30px;

    color:
        var(--om-blue);

    font-size:
        13px;

    font-weight:
        600;

    text-decoration:
        none;

    transition:
        gap 0.2s ease;
}


.om-text-link:hover {

    gap:
        14px;

    color:
        var(--om-blue);
}


/* ==================================================
   EXPERIENCE STATS
================================================== */

.om-experience-stats {

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap:
        1px;

    overflow:
        hidden;

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

    border-radius:
        20px;

    background:
        var(--om-border);
}


.om-stat {

    min-height:
        190px;

    padding:
        35px;

    background:
        var(--om-white);

    transition:
        background 0.2s ease;
}


.om-stat:hover {

    background:
        #F8FAFD;
}


.om-stat strong {

    display: block;

    margin-bottom:
        14px;

    color:
        var(--om-blue-dark);

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

    font-weight:
        800;

    letter-spacing:
        -1.5px;

    line-height:
        1;
}


.om-stat span {

    display: block;

    max-width:
        180px;

    color:
        var(--om-text-muted);

    font-size:
        12px;

    line-height:
        1.6;
}


/* ==================================================
   EXPERIENCE RESPONSIVE
================================================== */

@media (max-width: 767.98px) {

    .om-experience {

        padding:
            80px 0;
    }


    .om-experience-stats {

        grid-template-columns:
            1fr;
    }


    .om-stat {

        min-height:
            auto;

        padding:
            30px;
    }

}


/* ==================================================
   PRODUCTS
================================================== */

.om-products {

    padding:
        120px 0;

    background:
        #F7F9FC;
}


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

.om-product-card {

    position: relative;

    height: 100%;

    min-height:
        390px;

    padding:
        40px;

    overflow: hidden;

    background:
        var(--om-white);

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

    border-radius:
        22px;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}


.om-product-card:hover {

    transform:
        translateY(-4px);

    box-shadow:
        0 18px 45px rgba(3, 11, 30, 0.08);
}


/*
   Elemento decorativo
*/

.om-product-card::after {

    content: "";

    position: absolute;

    width: 230px;
    height: 230px;

    right: -120px;
    bottom: -120px;

    border-radius: 50%;

    background:
        rgba(32, 118, 185, 0.05);

    pointer-events: none;
}


/* ==================================================
   PRODUCT TOP
================================================== */

.om-product-top {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    margin-bottom:
        45px;
}


.om-product-icon {

    display: flex;

    align-items: center;

    justify-content: center;

    width: 58px;
    height: 58px;

    border-radius:
        16px;

    background:
        rgba(32, 118, 185, 0.09);

    color:
        var(--om-blue);

    font-size:
        24px;
}


.om-product-type {

    color:
        var(--om-text-muted);

    font-size:
        10px;

    font-weight:
        600;

    text-transform:
        uppercase;

    letter-spacing:
        0.8px;
}


/* ==================================================
   PRODUCT CONTENT
================================================== */

.om-product-content {

    position: relative;

    z-index: 2;
}


.om-product-content h3 {

    margin:
        0;

    color:
        var(--om-blue-dark);

    font-size:
        30px;

    font-weight:
        800;

    letter-spacing:
        -1.2px;
}


.om-product-content h4 {

    margin:
        10px 0 0;

    color:
        var(--om-text-dark);

    font-size:
        17px;

    font-weight:
        600;

    letter-spacing:
        -0.3px;
}


.om-product-content p {

    max-width:
        500px;

    margin:
        18px 0 0;

    color:
        var(--om-text-muted);

    font-size:
        13px;

    line-height:
        1.75;
}


/* ==================================================
   PRODUCT LINK
================================================== */

.om-product-link {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-top:
        28px;

    color:
        var(--om-blue);

    font-size:
        12px;

    font-weight:
        700;

    text-decoration:
        none;

    transition:
        gap 0.2s ease;
}


.om-product-link:hover {

    gap:
        14px;

    color:
        var(--om-blue);
}


/* ==================================================
   ATENDAON STATUS
================================================== */

.om-product-status {

    display: inline-flex;

    align-items: center;

    gap: 7px;

    color:
        var(--om-text-muted);

    font-size:
        10px;

    font-weight:
        600;

    text-transform:
        uppercase;

    letter-spacing:
        0.7px;
}


.om-product-status span {

    display: block;

    width: 7px;
    height: 7px;

    border-radius:
        50%;

    background:
        #E8A317;
}


.om-product-link-disabled {

    color:
        var(--om-text-muted);

    cursor:
        default;
}


.om-product-link-disabled:hover {

    gap:
        10px;

    color:
        var(--om-text-muted);
}


/* ==================================================
   PRODUCTS RESPONSIVE
================================================== */

@media (max-width: 575.98px) {

    .om-products {

        padding:
            80px 0;
    }


    .om-product-card {

        min-height:
            auto;

        padding:
            30px;

        border-radius:
            18px;
    }


    .om-product-top {

        margin-bottom:
            35px;
    }


    .om-product-content h3 {

        font-size:
            27px;
    }


    .om-product-content h4 {

        font-size:
            16px;
    }

}


/* ==================================================
   CONTACT
================================================== */

.om-contact {

    padding:
        120px 0;

    background:
        var(--om-white);
}


/* ==================================================
   CONTACT TEXT
================================================== */

.om-contact-title {

    margin:
        0;

    color:
        var(--om-blue-dark);

    font-size:
        clamp(38px, 4.5vw, 58px);

    font-weight:
        800;

    line-height:
        1.05;

    letter-spacing:
        -2.5px;
}


.om-contact-title span {

    color:
        var(--om-blue);
}


.om-contact-text {

    max-width:
        470px;

    margin:
        28px 0 0;

    color:
        var(--om-text-muted);

    font-size:
        15px;

    line-height:
        1.8;
}


/* ==================================================
   CONTACT NOTE
================================================== */

.om-contact-note {

    display:
        flex;

    gap:
        18px;

    max-width:
        500px;

    margin-top:
        45px;

    padding-top:
        30px;

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


.om-contact-note-icon {

    display:
        flex;

    align-items:
        center;

    justify-content:
        center;

    flex:
        0 0 auto;

    width:
        48px;

    height:
        48px;

    border-radius:
        14px;

    background:
        rgba(32, 118, 185, 0.09);

    color:
        var(--om-blue);

    font-size:
        19px;
}


.om-contact-note strong {

    display:
        block;

    color:
        var(--om-blue-dark);

    font-size:
        14px;

    font-weight:
        700;
}


.om-contact-note p {

    margin:
        8px 0 0;

    color:
        var(--om-text-muted);

    font-size:
        12px;

    line-height:
        1.7;
}


/* ==================================================
   CONTACT FORM
================================================== */

.om-contact-form-wrapper {

    padding:
        40px;

    background:
        #F7F9FC;

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

    border-radius:
        22px;
}


.om-form-label {

    display:
        block;

    margin-bottom:
        8px;

    color:
        var(--om-blue-dark);

    font-size:
        11px;

    font-weight:
        700;
}


.om-form-control {

    min-height:
        52px;

    padding:
        13px 15px;

    color:
        var(--om-text-dark);

    background:
        var(--om-white);

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

    border-radius:
        10px;

    font-family:
        inherit;

    font-size:
        13px;

    box-shadow:
        none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


.om-form-control::placeholder {

    color:
        #A1A8B3;
}


.om-form-control:focus {

    color:
        var(--om-text-dark);

    background:
        var(--om-white);

    border-color:
        var(--om-blue);

    box-shadow:
        0 0 0 3px rgba(32, 118, 185, 0.10);
}


.om-form-textarea {

    min-height:
        150px;

    resize:
        vertical;
}


.om-contact-submit {

    width:
        100%;

    min-height:
        54px;

    margin-top:
        8px;
}


/* ==================================================
   CONTACT RESPONSIVE
================================================== */

@media (max-width: 991.98px) {

    .om-contact {

        padding:
            90px 0;
    }


    .om-contact-title {

        font-size:
            45px;
    }


    .om-contact-form-wrapper {

        margin-top:
            10px;
    }

}


@media (max-width: 575.98px) {

    .om-contact {

        padding:
            75px 0;
    }


    .om-contact-title {

        font-size:
            38px;

        letter-spacing:
            -1.5px;
    }


    .om-contact-text {

        font-size:
            14px;
    }


    .om-contact-note {

        margin-top:
            35px;
    }


    .om-contact-form-wrapper {

        padding:
            25px 20px;

        border-radius:
            18px;
    }


    .om-contact-submit {

        font-size:
            12px;
    }

}