/*
Theme Name: Flatsome Child
Theme URI: http://example.com/flatsome-child/
Description: Đây là child theme của Flatsome
Author: Tên của anh
Author URI: http://example.com
Template: flatsome
Version: 1.0.0
Text Domain: flatsome-child
*/
:root {
    --1-color: rgb(0 0 0 /1);
    --2-color: rgb(249 115 22);;
    --3-color: #fff;
    --4-color: rgb(156 163 175);
    --5-color: green;
}

/* Import CSS từ theme parent */
@import url("../flatsome/style.css");

/* Thêm CSS tùy chỉnh của anh ở dưới đây */

.lh-1 a, .lh-2 a {
    color: var(--2-color);
}

.lh-2 .accordion-inner {
    padding: 0;
}

.lh-1 img {
    border-radius: 12px;
}

.chtg-2 .icon-box {
    margin-bottom: 12px;
}

.kh-1 .icon-box-img img {
    height: 150px;
    object-fit: cover;
    border-radius: 8px;
}

.gt-2 .icon-box-img img, .icon-box-img svg, .bt-3 .icon-box-img img {
    border-radius: 12px;
    box-shadow: rgb(102, 255, 102) 0px 20px 30px -10px;
}

.gt-3 p, .bt-1 p {
    color: var(--2-color);
}

.gt-2 p, .gt-2 h3, .bt-3 h3, .bt-3 p, .kh-1 p, .lh-1 p, .lh-2 p {
    color: var(--3-color);
}

.gt-3 img, .bt-1 img {
    border-radius: 12px;
}

.gt-1 img, .bt-2 img, .bt-4 img {
    border-radius: .75rem;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px, rgba(17, 17, 26, 0.1) 0px 24px 80px;
}

.ntg-baiviet .col-inner, .ntg-baiviet .image-cover {
    border-radius: 12px;
}

.ntg-sanpham .banner {
    background-image: url("/wp-content/uploads/2025/04/4.webp");
    background-size: cover;
    background-position: center bottom;
    height: 100%;
}

.ntg-sanpham h3, .ntg-sanpham p {
    color: orange;
}

.ntg-sanpham strong {
    padding: 4px;
    border-radius: 10px;
    background-color: #d9d9d9;
}

.ntg-hant img {
    width: 100%;
    object-fit: cover;
    height: 360px;
    border-radius: 12px;
}

.ntg-hant .img-inner {
    border-radius: 12px;
    padding: 0 12px;
}

.ntg-formlienhe .name-phone-row, .lh-2 .name-phone-row {
    display: flex;
    gap: 15px;
    text-align: left;
}

.ntg-formlienhe input:focus, .ntg-formlienhe textarea:focus, .lh-2 textarea:focus, .lh-2 input:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
    background-color: var(--1-color);
    box-shadow: rgba(255, 204, 0, 1) 2px 3px 8px;
}

.ntg-formlienhe .row, .lh-2 .row {
    justify-content: center;
}

.ntg-formlienhe p {
    text-align: left;
}

.ntg-formlienhe .ux-timer span {
    background-color: var(--2-color);
}

.ntg-formlienhe .ux-timer {
    margin-bottom: 2.5rem;
}

.ntg-formlienhe h5 {
    color: var(--5-color);
}

.ntg-formlienhe form {
    margin-bottom: 0;
}

.ntg-formlienhe .wpcf7-submit, .gt-3 a, .bt-1 a, .lh-2 .wpcf7-submit {
    margin-bottom: 0;
    width: auto;
    display: inline;
    outline: 2px solid transparent;
    outline-offset: 2px;
    font-size: 1rem;
    color: var(--3-color);
    line-height: 1.5rem;
    font-weight: 600;
    text-align: left;
    background-color: var(--2-color);
    border-radius: .5rem;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: .75rem;
    padding-bottom: .75rem;
    cursor: pointer;
}

.ntg-formlienhe input, .ntg-formlienhe textarea, .lh-2 input, .lh-2 textarea, .wpcf7-response-output {
    color: var(--3-color);
    padding-top: .5rem;
    padding-bottom: .5rem;
    padding-left: .75rem;
    padding-right: .75rem;
    background-color: var(--1-color);
    border-width: 1px;
    border-radius: .25rem;
    width: 100%;
}
.ntg-formlienhe input:valid , .ntg-formlienhe textarea:valid , .lh-2 input:valid , .lh-2 textarea:valid {
    color: var(--3-color);
}

.ntg-formlienhe label span, .lh-2 label span {
    color: red;
}

.ntg-formlienhe label, .lh-2 label {
    font-size: 1rem;
    line-height: 1.5rem;
    color: var(--3-color);
}

.ntg-formlienhe .name-phone-row .wpcf7-form-control-wrap, .lh-2 .name-phone-row .wpcf7-form-control-wrap {
    flex: 1; /* Chia đều không gian */
}

.ntg-cauhoi .accordion-title, .ntg-cauhoi .accordion-title.active, .lh-2 .accordion-title, .lh-2 .accordion-title.active {
    color: var(--2-color);
}

.ntg-cauhoi .accordion-title {
    padding: 1.6em 2.3em;
}

.ntg-cauhoi .accordion-inner {
    padding: 0 2.3em;
}

.ntg-cauhoi .accordion .toggle {
    top: 1.3em;
}

.ntg-cauhoi h3, .lh-2 h3 {
    font-weight: 700;
    margin-bottom: 3.5rem;
    line-height: 1.25;
    font-size: 2.25rem;
    color: var(--3-color);
}

.gt-3 h2, .bt-1 h1, .kh-1 h1 {
    font-weight: 700;
    font-size: 2.25rem;
    line-height: 2.5rem;
    color: var(--3-color);
    margin-bottom: 3rem;
}

.kh-1 h2, .kh-2 h2, .kh-3 h2, .kh-4 h2, .chtg-2 h2 {
    font-weight: 700;
    line-height: 1.25;
    font-size: 2.25rem;
    color: var(--2-color);
}

.ntg-formlienhe h2, .ntg-baiviet h2, .gt-1 h1, .bt-2 h2, .bt-4 h2, .chtg-1 h1, .lh-2 h1, .lh-2 h2 {
    font-weight: 700;
    line-height: 1.25;
    font-size: 2.25rem;
    color: var(--3-color);
}

.ntg-lienhe h3 {
    color: var(--4-color);
    font-weight: 100;
    font-size: 16px;
}

.ntg-lienhe p {
    color: var(--2-color);
    font-weight: bold;
}

.ntg-lienhe .icon-inner img {
    padding: 10px;
    border-radius: 8px;
    background-color: var(--3-color);
}

.ntg-lienhe .icon-box:nth-of-type(2) {
    margin-bottom: 2rem;
}

.ntg-lienhe .icon-box:nth-of-type(3) {
    margin-bottom: 2rem;
}

.ntg-visao .text:hover, .gt-1 .text:hover, .bt-2 .text:hover, .bt-4 .text:hover {
    background-color: rgb(31 41 55/1);
}

.ntg-visao p, .gt-1 p, .bt-2 p, .ntg-cauhoi p, .ntg-danhgia p, .bt-4 p, .chtg-2 p {
    margin-top: .25rem;
    color: var(--4-color);
    margin-bottom: 0;
}

.ntg-danhgia .testimonial-meta, .kh-2, .kh-3 .testimonial-meta {
    color: var(--3-color);
}

.ntg-visao .text, .gt-1 .text, .bt-2 .text, .bt-4 .text {
    border-radius: .75rem;
    padding: 1.25rem;
}

.ntg-visao h3, .gt-1 h3, .bt-2 h3, .bt-4 h3, .kh-1 h3, .chtg-1 h3, .chtg-2 h3 {
    font-size: 18px;
    line-height: 1.75rem;
    font-weight: 600;
    color: var(--3-color);
}

.ntg-visao .section-title-normal span, .ntg-lienhe .section-title-normal span, .ntg-danhgia .section-title-normal span,
.ntg-hant .section-title-normal span, .ntg-baiviet .section-title-normal span, .gt-1 .section-title-normal span, .bt-2 .section-title-normal span,
.bt-4 .section-title-normal span, .lh-2 .section-title-normal span, .chtg-2 .section-title-normal span {
    border-bottom: 2px solid var(--2-color);
}

#main, #wrapper {
    background-color: var(--1-color);
}


.ntg-visao img, .ntg-lienhe img {
    border-radius: .75rem;
}

.ntg-visao h2, .ntg-lienhe h2, .ntg-danhgia h2, .ntg-hant h2 {
    font-weight: 700;
    font-size: 1.875rem !important;
    line-height: 2.25rem !important;
    color: var(--3-color);
}

#main .bt-2 {
    background-image: url("/wp-content/uploads/2025/04/nen-1.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .bt-1 {
    background-image: url("/wp-content/uploads/2025/04/nen-3.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .bt-4 {
    background-image: url("/wp-content/uploads/2025/04/nen-5.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .gt-1 {
    background-image: url("/wp-content/uploads/2025/04/nen-6.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .ntg-visao {
    background-image: url("/wp-content/uploads/2025/04/nen-2.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .ntg-formlienhe {
    background-image: url("/wp-content/uploads/2025/04/nen-4.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .kh-1 {
    background-image: url("/wp-content/uploads/2025/04/nen-1.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .kh-3 {
    background-image: url("/wp-content/uploads/2025/04/nen-3.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .kh-4 .bg.bg-loaded {
    background-position: center top;
}

#main .chtg-2 {
    background-image: url("/wp-content/uploads/2025/04/nen-6.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

#main .lh-2 {
    background-image: url("/wp-content/uploads/2025/04/nen-4.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

footer .footer-2 {
    background: #020024;
    background: linear-gradient(180deg, rgba(2, 0, 36, 1) 0%, rgba(41, 31, 31, 1) 35%, rgba(214, 136, 19, 1) 100%);
}

#main .ntg-danhgia {
    background-image: url("/wp-content/uploads/2025/04/nen-1.webp");
    height: 100%;
    background-size: cover;
    background-position: center center;
}

.ntg-banner {
    background-image: url("/wp-content/uploads/2025/04/bac-si-chua-suy-than.webp");
    background-size: cover;
    background-position: center center;
    height: 600px;
}

.ntg-banner .banner {
    background-color: var(--1-color);
}

.ntg-banner h1 {
    font-size: 2.25rem;
    line-height: 2.5rem;
    color: var(--2-color);
    font-weight: 500;
}

.ntg-banner p {
    line-height: 1.625;
    margin-bottom: 2rem;
    color: var(--3-color) !important;
}

.ntg-banner a {
    color: var(--3-color) !important;
    padding-top: .5rem !important;
    padding-bottom: .5rem !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    background-color: var(--2-color) !important;
    border-width: 0 !important;
    border-radius: .25rem !important;
    font-size: 18px !important;
    line-height: 1.75rem;
    font-weight: 400;
}
#content {
    color: #e6e6e6;
}
#content a {
    color: var(--2-color);
}
@media (max-width: 575.98px) {
    .chtg-2 .icon-box-img {
        display: none;
    }
    .chtg-1 .col {
        padding-bottom: 12px;
    }
    .kh-4 .flickity-viewport {
        height: 200px!important;
    }
    .kh-4 .banner {
        padding-top: 200px!important;
    }
    #main .kh-3,#main .kh-1, #main .kh-2, #main .kh-4 {
        padding: 30px 0;
    }
    #main .kh-3 .col .col-inner {
        padding: 0;
    }
    .ntg-visao .text, .gt-1 .text, .bt-2 .text, .bt-4 .text {
        padding: 12px 0;
    }
    .kh-1 h2, .kh-2 h2, .kh-3 h2, .kh-4 h2, .chtg-2 h2 {
        font-size: 26px;
    }
    .gt-3 h2, .bt-1 h1, .kh-1 h1 {
        font-size: 30px;
    }
    #main .gt-2 {
        padding: 0;
    }
    .gt-2 .icon-box-img {
        width: 100% !important;
    }
    .gt-2 h3 {
        font-size: 18px;
    }
    .gt-2 p {
        font-size: 16px;
    }
    #main .ntg-hant .flickity-slider .img {
        max-width: 100% !important;
    }
    #main .ntg-banner {
        padding: 0;
        height: 350px;
    }
    /*.ntg-banner .text-box {*/
    /*    padding-left: 20px;*/
    /*}*/
    #main .ntg-visao {
        padding: 0 10px;
    }
    .ntg-sanpham .banner {
        height: 315px;
    }
    .ntg-cauhoi h3, .lh-2 h3 {
        margin-bottom: 1.5rem;
    }
    .ntg-formlienhe h2, .ntg-baiviet h2, .gt-1 h1, .bt-2 h2, .bt-4 h2, .chtg-1 h1, .lh-2 h1, .lh-2 h2 {
        font-size: 1.875rem;
    }
}
@media (min-width: 576px) and (max-width: 767.98px) {
    #main .gt-2 {
        padding: 30px 0;
    }
    .gt-1 .col {
        flex-basis: 100%;
        max-width: 100%;
    }
    #main .ntg-banner {
        padding: 0;
        height: 350px;
    }
    #main .ntg-visao {
        padding: 0 10px;
    }
    .ntg-banner .text-box {
        padding-left: 20px;
    }
    .ntg-visao .col,.ntg-formlienhe .col, .ntg-danhgia .col {
        flex-basis: 100%;
        max-width: 100%;
    }
    .ntg-sanpham .banner {
       height: 315px;
    }
    .ntg-cauhoi h3, .lh-2 h3 {
        margin-bottom: 1.5rem;
    }
    .ntg-formlienhe h2, .ntg-baiviet h2, .gt-1 h1, .bt-2 h2, .bt-4 h2, .chtg-1 h1, .lh-2 h1, .lh-2 h2 {
        font-size: 1.875rem;
    }
    #main .ntg-hant .flickity-slider .img {
        max-width: 100% !important;
    }

}

@media (min-width: 768px) and (max-width: 991.98px) {
    #main .ntg-banner {
        padding: 0;
        height: 350px;
    }
    #main .ntg-visao {
        padding: 0 10px;
    }
    .ntg-banner .text-box {
        padding-left: 20px;
    }
    #main .ntg-banner {
        padding: 0;
        height: 400px;
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    #main .ntg-banner {
        padding: 0;
        height: 400px;
    }

    .ntg-banner .text-box {
        padding-left: 20px;
    }
    .ntg-sanpham .banner {
        height: 615px;
    }

}