/*
Theme Name: APT CCTV
Author: APT CCTV
Version: 33.0
*/
/* ================================
   BÀI VIẾT LIÊN QUAN
================================ */

.related-posts {
    max-width: 1150px;
    margin: 70px auto 50px;
    padding: 45px 40px 50px;
    background: #f7fbfe;
    border: 1px solid #e1e6e3;
    border-radius: 22px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

/* Tiêu đề */

.related-posts-header {
    text-align: center;
    margin-bottom: 38px;
}

.related-posts-header h2 {
    margin: 0;
    color: #2877a8;
    font-size: 30px;
    font-weight: 700;
}

.related-posts-header span {
    display: block;
    width: 55px;
    height: 4px;
    margin: 15px auto 10px;
    background: #e8b84a;
    border-radius: 10px;
}

.related-posts-header p {
    margin: 0;
    color: #777;
    font-size: 15px;
}

/* GRID 6 BÀI */

.related-posts-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
}

/* CARD */

.related-post-card {
    background: #fff;
    border: 1px solid #e2e2e2;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.07);
    transition: all 0.25s ease;
}

.related-post-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.12);
}

/* ẢNH ĐỒNG NHẤT */

.related-post-image {
    display: block;
    width: 100%;
    height: 205px;
    overflow: hidden;
    background: #eee;
}

.related-post-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s ease;
}

.related-post-card:hover .related-post-image img {
    transform: scale(1.04);
}

/* Không có ảnh */

.related-post-no-image {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #2877a8;
    color: #e8b84a;
    font-weight: 700;
    font-size: 20px;
}

/* NỘI DUNG */

.related-post-content {
    padding: 20px;
}

.related-post-date {
    font-size: 13px;
    color: #999;
    margin-bottom: 10px;
}

.related-post-content h3 {
    margin: 0 0 12px;
    font-size: 19px;
    line-height: 1.4;
}

.related-post-content h3 a {
    color: #2877a8;
    text-decoration: none;
}

.related-post-content h3 a:hover {
    color: #c7952f;
}

.related-post-content p {
    margin: 0 0 18px;
    color: #666;
    font-size: 14px;
    line-height: 1.7;
}

/* LINK */

.related-post-link {
    color: #3b9ad9;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}

.related-post-link:hover {
    color: #c7952f;
}


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

@media (max-width: 900px) {

    .related-posts {
        margin: 50px 20px;
        padding: 35px 25px;
    }

    .related-posts-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 22px;
    }

}


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

@media (max-width: 600px) {

    .related-posts {
        margin: 40px 15px;
        padding: 30px 15px;
        border-radius: 18px;
    }

    .related-posts-header h2 {
        font-size: 25px;
    }

    @media (max-width: 600px) {

    .related-posts-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .related-post-image {
        height: 210px;
    }

    .related-post-content {
        padding: 17px 18px 19px;
    }

    .related-post-date {
        font-size: 13px;
    }

    .related-post-content h3 {
        font-size: 19px;
        line-height: 1.4;
    }

    .related-post-content p {
        font-size: 14px;
        line-height: 1.6;
    }

    .related-post-link {
        font-size: 14px;
    }

}

    .related-post-image {
        height: 125px;
    }

    .related-post-content {
        padding: 13px;
    }

    .related-post-date {
        font-size: 11px;
    }

    .related-post-content h3 {
        font-size: 15px;
        line-height: 1.35;
    }

    .related-post-content p {
        font-size: 12px;
        line-height: 1.55;
    }

    .related-post-link {
        font-size: 12px;
    }

}
/* APT CCTV - light blue statistics cards */
.apt-stats-light { background:#eaf6ff; border:1px solid #d7ebf8; }
@media (max-width:900px){
  .apt-stats-light-grid{grid-template-columns:repeat(2,1fr)!important}
}
@media (max-width:600px){
  .apt-stats-light-grid{grid-template-columns:1fr!important;gap:12px!important}
}


/* APT CCTV V7 - Typography */
html, body, body *, button, input, textarea, select {
    font-family: "Times New Roman", Times, serif !important;
}

/* Giữ icon font nếu theme/plugin sử dụng font icon */
[class*="icon"], [class^="icon-"], .dashicons, .fa, .fas, .far, .fab {
    font-family: inherit !important;
}

/* V22 - Trang giới thiệu APT CCTV */
.apt-about-page{background:#fff;color:#173b62}
.about-hero{padding:55px 0 72px;background:linear-gradient(180deg,#f5faff 0%,#fff 100%)}
.about-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:55px;align-items:center}
.about-hero-copy h1{font-family:"Times New Roman",Times,serif;font-size:48px;line-height:1.14;color:#173b62;font-weight:600;margin:8px 0 20px}
.about-hero-copy p{font-size:18px;line-height:1.75;color:#59687a;max-width:620px;margin:0 0 26px}
.about-hero-image img{width:100%;height:360px;object-fit:cover;border-radius:18px;display:block;box-shadow:0 12px 30px rgba(23,59,98,.10)}
.about-hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.about-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 25px;border-radius:5px;text-decoration:none;font-weight:700;font-family:"Times New Roman",Times,serif;transition:.2s}
.about-btn-primary{background:#f4c33f;color:#173b62;border:1px solid #f4c33f}
.about-btn-primary:hover{background:#eab72b;color:#173b62}
.about-btn-outline{background:#fff;color:#176a9f;border:1px solid #b9d9ed}
.about-btn-outline:hover{background:#f3f9fd}
.about-intro{padding:82px 0}
.about-intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:58px;align-items:center}
.about-intro-image img{width:100%;height:390px;object-fit:cover;border-radius:16px;display:block}
.about-intro-copy h2,.about-coverage h2{font-family:"Times New Roman",Times,serif;color:#173b62;font-size:38px;line-height:1.25;font-weight:600;margin:6px 0 17px}
.about-intro-copy p{font-size:16px;line-height:1.8;color:#59687a;margin:0 0 15px}
.about-check-list{list-style:none;padding:0;margin:22px 0 0}
.about-check-list li{position:relative;padding-left:27px;margin:0 0 12px;color:#315e7f;font-size:16px}
.about-check-list li:before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;border-radius:50%;background:#f4c33f}
.about-values{padding:82px 0;background:#f5faff}
.about-heading{text-align:center;margin-bottom:40px}
.about-heading h2{font-family:"Times New Roman",Times,serif;font-size:38px;line-height:1.25;color:#173b62;font-weight:600;margin:5px auto 0}
.about-value-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.about-value-card{background:#fff;border:1px solid #cfe4f2;border-radius:14px;padding:30px 28px;box-shadow:0 7px 18px rgba(28,58,92,.045)}
.about-value-number{color:#d5a820;font-size:25px;font-weight:700;margin-bottom:12px}
.about-value-card h3{font-family:"Times New Roman",Times,serif;color:#173b62;font-size:24px;margin:0 0 10px;font-weight:600}
.about-value-card p{color:#59687a;line-height:1.7;margin:0;font-size:15px}
.about-solutions{padding:82px 0}
.about-solution-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.about-solution-card{display:block;background:#fff;border:1px solid #cfe4f2;border-radius:14px;overflow:hidden;text-decoration:none;box-shadow:0 7px 18px rgba(28,58,92,.045)}
.about-solution-card img{width:100%;height:220px;object-fit:cover;display:block}
.about-solution-card div{padding:18px 20px 21px}
.about-solution-card h3{font-family:"Times New Roman",Times,serif;color:#173b62;font-size:21px;margin:0 0 8px;font-weight:600}
.about-solution-card p{color:#59687a;font-size:15px;line-height:1.6;margin:0}
.about-coverage{padding:52px 0;background:#f5faff;border-top:1px solid #d9e8f3}
.about-coverage-inner{display:flex;align-items:center;justify-content:space-between;gap:35px}
.about-coverage h2{font-size:30px;margin:4px 0 8px}
.about-coverage p{margin:0;color:#59687a;line-height:1.7;max-width:820px}
@media(max-width:900px){
 .about-hero-grid,.about-intro-grid{grid-template-columns:1fr;gap:32px}
 .about-hero-copy h1{font-size:40px}
 .about-hero-image img,.about-intro-image img{height:320px}
 .about-value-grid,.about-solution-grid{grid-template-columns:1fr 1fr}
 .about-coverage-inner{flex-direction:column;align-items:flex-start}
}
@media(max-width:600px){
 .about-hero{padding:38px 0 55px}
 .about-hero-copy h1{font-size:31px}
 .about-hero-copy p{font-size:15px;line-height:1.65}
 .about-hero-image img,.about-intro-image img{height:220px;border-radius:12px}
 .about-intro,.about-values,.about-solutions{padding:58px 0}
 .about-intro-copy h2,.about-heading h2{font-size:29px}
 .about-value-grid,.about-solution-grid{grid-template-columns:1fr}
 .about-value-card{padding:24px 20px}
 .about-solution-card img{height:190px}
 .about-coverage h2{font-size:26px}
 .about-btn{width:100%}
}

/* V22 - Trang Liên hệ APT CCTV */
.apt-contact-page{background:#fff;color:#173b62}
.contact-hero{padding:58px 0 70px;background:linear-gradient(180deg,#f5faff 0%,#fff 100%)}
.contact-hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:55px;align-items:center}
.contact-hero-copy h1{font-family:"Times New Roman",Times,serif;font-size:48px;line-height:1.14;color:#173b62;font-weight:600;margin:8px 0 20px}
.contact-hero-copy p{font-size:18px;line-height:1.75;color:#59687a;max-width:680px;margin:0 0 26px}
.contact-hero-actions{display:flex;gap:14px;flex-wrap:wrap}
.contact-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 25px;border-radius:5px;text-decoration:none;font-weight:700;font-family:"Times New Roman",Times,serif;transition:.2s}
.contact-btn-primary{background:#f4c33f;color:#173b62;border:1px solid #f4c33f}
.contact-btn-primary:hover{background:#eab72b;color:#173b62}
.contact-btn-outline{background:#fff;color:#176a9f;border:1px solid #b9d9ed}
.contact-btn-outline:hover{background:#f3f9fd}
.contact-hero-card{background:#fff;border:1px solid #cfe4f2;border-top:4px solid #f4c33f;border-radius:15px;padding:35px 34px;box-shadow:0 10px 28px rgba(23,59,98,.07)}
.contact-hero-card-label{color:#b48b14;font-size:15px;font-weight:700;letter-spacing:.4px;margin-bottom:8px}
.contact-hotline{display:block;color:#173b62;font-size:36px;font-weight:700;text-decoration:none;margin-bottom:10px}
.contact-hero-card p{color:#59687a;margin:0 0 24px;line-height:1.6}
.contact-quick-row{display:flex;justify-content:space-between;gap:15px;padding-top:18px;border-top:1px solid #dcebf5;color:#59687a}
.contact-quick-row strong{color:#173b62}
.contact-main{padding:78px 0}
.contact-main-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:stretch}
.contact-info-card,.contact-form-card{background:#fff;border:1px solid #cfe4f2;border-radius:15px;padding:34px 35px;box-shadow:0 7px 20px rgba(28,58,92,.045)}
.contact-info-card h2,.contact-form-card h2,.contact-map-copy h2{font-family:"Times New Roman",Times,serif;color:#173b62;font-size:34px;line-height:1.25;font-weight:600;margin:5px 0 13px}
.contact-lead,.contact-form-card>p{color:#59687a;line-height:1.7;margin:0 0 24px}
.contact-detail{padding:16px 0;border-top:1px solid #e1edf5;display:flex;flex-direction:column;gap:5px}
.contact-detail strong{font-size:13px;color:#b48b14;letter-spacing:.4px}
.contact-detail a,.contact-detail span{color:#315e7f;text-decoration:none;line-height:1.55;font-size:16px}
.contact-detail a{font-weight:700;color:#176a9f}
.contact-note{margin-top:20px;padding:17px 18px;background:#f5faff;border-left:3px solid #f4c33f;display:flex;flex-direction:column;gap:4px}
.contact-note b{color:#173b62}.contact-note span{color:#59687a;line-height:1.55}
.contact-form-real input,.contact-form-real textarea{width:100%;box-sizing:border-box;border:1px solid #c9deed;background:#fff;border-radius:5px;padding:13px 15px;color:#173b62;font-family:"Times New Roman",Times,serif;font-size:16px;outline:none;margin:0 0 14px}
.contact-form-real input:focus,.contact-form-real textarea:focus{border-color:#6faed1;box-shadow:0 0 0 2px rgba(111,174,209,.12)}
.contact-form-real textarea{min-height:150px;resize:vertical}
.contact-form-two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.contact-form-two input{margin:0}
.contact-form-real button{min-height:48px;padding:0 28px;border:1px solid #f4c33f;background:#f4c33f;color:#173b62;border-radius:5px;font-family:"Times New Roman",Times,serif;font-weight:700;font-size:16px;cursor:pointer}
.contact-success,.contact-error{margin:0 auto 25px;padding:14px 18px;border-radius:6px;font-weight:700}
.contact-success{background:#eef9f1;border:1px solid #bfe3c7;color:#2b6b3a}.contact-error{background:#fff2f0;border:1px solid #efc2bb;color:#9a392e}
.contact-area{padding:78px 0;background:#f5faff}
.contact-heading{text-align:center;margin-bottom:36px}.contact-heading h2{font-family:"Times New Roman",Times,serif;font-size:38px;color:#173b62;font-weight:600;margin:5px 0 0}
.contact-area-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.contact-area-card{background:#fff;border:1px solid #cfe4f2;border-radius:14px;padding:28px 25px;text-decoration:none;box-shadow:0 7px 18px rgba(28,58,92,.045);display:flex;flex-direction:column;gap:8px}
.contact-area-card strong{color:#173b62;font-size:22px}.contact-area-card span{color:#59687a;line-height:1.6}
.contact-map-section{padding:78px 0}.contact-map-frame{display:grid;grid-template-columns:.9fr 1.1fr;border:1px solid #cfe4f2;border-radius:15px;overflow:hidden;min-height:310px;box-shadow:0 7px 18px rgba(28,58,92,.045)}
.contact-map-copy{padding:42px;background:#fff}.contact-map-copy p{color:#59687a;line-height:1.7;max-width:500px;margin:0 0 25px}.contact-map-placeholder{background:#eaf6ff;display:flex;align-items:center;justify-content:center;text-align:center;color:#176a9f;font-weight:700;line-height:1.6}
.contact-map-placeholder small{font-weight:400}
@media(max-width:900px){.contact-hero-grid,.contact-main-grid,.contact-map-frame{grid-template-columns:1fr;gap:25px}.contact-area-grid{grid-template-columns:1fr 1fr}.contact-hero-copy h1{font-size:40px}.contact-map-placeholder{min-height:240px}}
@media(max-width:600px){.contact-hero{padding:38px 0 55px}.contact-hero-copy h1{font-size:31px}.contact-hero-copy p{font-size:15px}.contact-hero-card{padding:27px 22px}.contact-hotline{font-size:30px}.contact-quick-row{flex-direction:column}.contact-main,.contact-area,.contact-map-section{padding:58px 0}.contact-info-card,.contact-form-card{padding:25px 20px}.contact-info-card h2,.contact-form-card h2,.contact-map-copy h2{font-size:29px}.contact-form-two,.contact-area-grid{grid-template-columns:1fr}.contact-btn{width:100%}.contact-map-copy{padding:28px 20px}}

/* APT CCTV V27 */
.header-nav .nav > li > a, .nav > li > a { white-space:nowrap; }

/* =========================================
   APT CCTV V28 — FLOATING CONTACT
   Phong cách nút liên hệ nổi kiểu Pallet H&H
========================================= */
.apt-floating-contact{
    position:fixed;
    right:24px;
    bottom:82px;
    z-index:99999;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
}
.apt-float-btn{
    width:60px;
    height:60px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    text-decoration:none!important;
    box-shadow:0 5px 16px rgba(0,0,0,.18);
    transition:transform .2s ease, box-shadow .2s ease;
}
.apt-float-btn:hover{
    transform:translateY(-3px) scale(1.04);
    box-shadow:0 8px 22px rgba(0,0,0,.23);
}
.apt-float-zalo{
    background:#fff;
    border:1px solid #e6edf4;
}
.apt-zalo-mark{
    width:34px;
    height:34px;
    border:3px solid #1677ff;
    border-radius:50%;
    color:#1677ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:Arial,sans-serif!important;
    font-weight:800;
    font-size:21px;
    line-height:1;
}
.apt-float-call{
    background:#ffc72c;
    color:#0a557e;
}
.apt-phone-mark{
    font-family:Arial,sans-serif!important;
    font-size:29px;
    font-weight:700;
    line-height:1;
}
@media(max-width:600px){
    .apt-floating-contact{
        right:12px;
        bottom:72px;
        gap:8px;
    }
    .apt-float-btn{
        width:52px;
        height:52px;
    }
    .apt-zalo-mark{
        width:29px;
        height:29px;
        font-size:18px;
    }
    .apt-phone-mark{font-size:25px}
}
