/*
|--------------------------------------------------------------------------
| HARDKING
| COBERTURA + SPEED TEST
|--------------------------------------------------------------------------
*/

/* ==========================================================
   SEÇÃO
========================================================== */

.hk-coverage-section {

    padding: 50px 0  10px;

    background: #ffffff;

    position: relative;

}

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

.hk-coverage-card,
.hk-speedtest-card {

    background: #ffffff;

    border: 1px solid rgba(57, 212, 0, .12);

    border-radius: 24px;

    padding: 32px;

    height: 100%;

    overflow: hidden;

    box-shadow:
        0 10px 30px rgba(0, 0, 0, .04);

    transition: .3s ease;

}

.hk-coverage-card:hover,
.hk-speedtest-card:hover {

    transform: translateY(-5px);

    box-shadow:
        0 18px 40px rgba(0, 0, 0, .08);

}

/* ==========================================================
   TAGS
========================================================== */

.hk-section-tag {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 8px 16px;

    border-radius: 999px;

    background: rgba(57, 212, 0, .10);

    color: var(--hk-primary);

    font-size: .80rem;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;

    margin-bottom: 18px;

}

/* ==========================================================
   TÍTULOS
========================================================== */

.hk-coverage-title,
.hk-speedtest-title {

    font-size: 2rem;

    font-weight: 700;

    line-height: 1.15;

    color: #111;

    margin-bottom: 18px;

}

/* ==========================================================
   TEXTOS
========================================================== */

.hk-coverage-text,
.hk-speedtest-text {

    font-size: .95rem;

    line-height: 1.8;

    color: #666;

    margin-bottom: 24px;

}

/* ==========================================================
   BOTÕES
========================================================== */

.hk-btn-outline {

    border: 2px solid var(--hk-primary);

    color: var(--hk-primary);

    border-radius: 50px;

    padding: 12px 24px;

    font-weight: 600;

    transition: .3s ease;

}

.hk-btn-outline:hover {

    background: var(--hk-primary);

    color: #fff;

}

.hk-btn-primary {

    background: var(--hk-primary);

    border: none;

    color: #fff;

    border-radius: 50px;

    padding: 12px 28px;

    font-weight: 600;

    transition: .3s ease;

}

.hk-btn-primary:hover {

    background: var(--hk-primary-hover);

    color: #fff;

}

/* ==========================================================
   MAPA COBERTURA
========================================================== */

.hk-coverage-map {

    width: 100%;

    max-width: 520px;

    height: auto;

    display: block;

    margin: 0 auto;

}

/* ==========================================================
   IMAGEM SPEED TEST
========================================================== */

.hk-speedtest-image {

    width: 180px;

    max-width: 100%;

    height: auto;

}

/* ==========================================================
   MODAL
========================================================== */

#coverageModal .modal-content {

    border: none;

    border-radius: 20px;

}

#coverageModal .modal-header {

    border-bottom: 1px solid rgba(0, 0, 0, .08);

}

#coverageModal .modal-title {

    font-weight: 700;

}

#coverageModal ul {

    margin: 0;

    padding: 0;

}

#coverageModal li {

    margin-bottom: 8px;

    color: #555;

}

/* ==========================================================
   NOTEBOOK
========================================================== */

@media (max-width: 1366px) {

    .hk-coverage-card,
    .hk-speedtest-card {

        padding: 28px;

    }

    .hk-coverage-title,
    .hk-speedtest-title {

        font-size: 1.75rem;

    }

    .hk-coverage-map {

        max-width: 460px;

    }

}

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

@media (max-width: 991px) {

    .hk-coverage-section {

        padding: 70px 0;

    }

    .hk-coverage-card,
    .hk-speedtest-card {

        padding: 30px;

    }

    .hk-coverage-title,
    .hk-speedtest-title {

        font-size: 1.6rem;

    }

    .hk-coverage-map {

        max-width: 380px;

        margin-top: 25px;

    }

    .hk-speedtest-image {

        width: 140px;

    }

}

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

@media (max-width: 767px) {

    .hk-coverage-section {

        padding: 60px 0;

    }

    .hk-coverage-card,
    .hk-speedtest-card {

        padding: 24px;

        border-radius: 20px;

    }

    .hk-section-tag {

        font-size: .75rem;

    }

    .hk-coverage-title,
    .hk-speedtest-title {

        font-size: 1.4rem;

    }

    .hk-coverage-text,
    .hk-speedtest-text {

        font-size: .90rem;

    }

    .hk-coverage-map {

        max-width: 100%;

        margin-top: 20px;

    }

    .hk-speedtest-image {

        width: 120px;

        margin-top: 15px;

    }

    .hk-btn-outline,
    .hk-btn-primary {

        width: 100%;

        justify-content: center;

    }

}