.ptk-insight-card { height:100%; }
.ptk-insight-card .inner-box { height:100%; display:flex; flex-direction:column; background:#fff; border-radius:24px; overflow:hidden; box-shadow:0 18px 55px rgba(6,17,83,.09); }
.ptk-insight-card .blog-image { aspect-ratio:16/9; overflow:hidden; }
.ptk-insight-card .blog-image > a { display:block; height:100%; }
.ptk-insight-card .blog-image img { width:100%; height:100%; object-fit:cover; }
.ptk-insight-card .blog-content { flex:1; display:flex; flex-direction:column; }
.ptk-insight-card .blog-content .title { margin:10px 0 12px; font-size:25px; line-height:1.22; }
.ptk-insight-card .blog-content p { margin:0; color:#667085; line-height:1.65; }
.ptk-insight-card .blog-meta { margin-top:auto; }
.ptk-card-category { color:#1558e8; font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }

.ptk-article-wrap { padding:80px 20px 110px; background:#f4f7ff; }
.ptk-article { max-width:980px; margin:0 auto; padding:56px; border-radius:30px; background:#fff; box-shadow:0 22px 70px rgba(6,17,83,.08); color:#26334d; }
.ptk-article-header { max-width:850px; margin:0 auto 34px; text-align:center; }
.ptk-article-kicker { color:#1558e8; font-size:13px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.ptk-article-header h1 { margin:16px 0 18px; color:#061153; font-size:clamp(38px,5vw,62px); line-height:1.06; letter-spacing:-.035em; }
.ptk-article-lead { margin:0 auto; color:#5e6b82; font-size:19px; line-height:1.65; }
.ptk-article-author { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:24px; text-align:left; }
.ptk-article-author img { width:52px; height:52px; padding:7px; border:1px solid #dce5fb; border-radius:50%; background:#fff; object-fit:contain; }
.ptk-article-author strong,.ptk-article-author span { display:block; }
.ptk-article-author strong { color:#061153; }
.ptk-article-author span { color:#7a8498; font-size:13px; }
.ptk-article-hero,.ptk-article-inline-image { margin:0 0 36px; }
.ptk-article-hero img,.ptk-article-inline-image img { display:block; width:100%; height:auto; aspect-ratio:16/9; border-radius:24px; object-fit:cover; }
.ptk-article-hero figcaption { margin-top:10px; color:#7a8498; font-size:13px; text-align:center; }
.ptk-answer-box { margin:34px 0; padding:26px 28px; border-left:5px solid #1558e8; border-radius:0 18px 18px 0; background:#edf4ff; }
.ptk-answer-box strong { display:block; margin-bottom:6px; color:#1558e8; text-transform:uppercase; letter-spacing:.06em; }
.ptk-answer-box p { margin:0; color:#142044; font-size:18px; line-height:1.7; }
.ptk-article-intro { color:#142044; font-size:20px; font-weight:500; line-height:1.75; }
.ptk-article-section { margin-top:42px; }
.ptk-article h2 { margin:0 0 16px; color:#061153; font-size:31px; line-height:1.2; letter-spacing:-.02em; }
.ptk-article p { line-height:1.82; }
.ptk-article-inline-image { margin-top:42px; }
.ptk-checklist { margin:44px 0; padding:32px; border-radius:22px; background:#061153; color:#fff; }
.ptk-checklist h2 { color:#fff; }
.ptk-checklist ul { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.ptk-checklist li { position:relative; padding-left:30px; }
.ptk-checklist li::before { content:"✓"; position:absolute; left:0; color:#73e6ff; font-weight:900; }
.ptk-article-faq details { margin:12px 0; padding:18px 20px; border:1px solid #dce5fb; border-radius:16px; }
.ptk-article-faq summary { cursor:pointer; color:#061153; font-weight:800; }
.ptk-article-faq details p { margin:12px 0 0; }
.ptk-hashtags { display:flex; flex-wrap:wrap; gap:10px; margin:32px 0; }
.ptk-hashtags span { padding:9px 14px; border-radius:999px; background:#edf4ff; color:#1558e8; font-weight:800; }
.ptk-article-cta { display:flex; align-items:center; justify-content:space-between; gap:28px; margin-top:44px; padding:32px; border-radius:24px; background:linear-gradient(135deg,#061153,#1558e8); color:#fff; }
.ptk-article-cta span { color:#73e6ff; font-size:12px; font-weight:900; letter-spacing:.1em; }
.ptk-article-cta h2 { margin:8px 0; color:#fff; font-size:28px; }
.ptk-article-cta p { margin:0; color:rgba(255,255,255,.78); }
.ptk-article-cta a { flex:none; padding:14px 22px; border-radius:999px; background:#fff; color:#061153; font-weight:900; }
.ptk-article-nav { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:36px; padding-top:28px; border-top:1px solid #dce5fb; }
.ptk-article-nav a { color:#1558e8; font-weight:800; line-height:1.4; }
.ptk-article-nav a:last-child { text-align:right; }
@media (max-width:767px) {
  .ptk-article-wrap { padding:45px 12px 70px; }
  .ptk-article { padding:28px 20px; border-radius:22px; }
  .ptk-article-header h1 { font-size:38px; }
  .ptk-article-cta { display:block; }
  .ptk-article-cta a { display:inline-flex; margin-top:18px; }
  .ptk-article-nav { grid-template-columns:1fr; }
  .ptk-article-nav a:last-child { text-align:left; }
}

/* --------------------------------------------------------------------------
   Phòng vệ: khối bài viết đứng riêng, không nằm trong .ptk-article

   Bộ tách demo bản <= 2.0.2 cắt nhầm các <section> lồng nhau thành khối cấp
   cao nhất, nên phần thân bài nằm NGOÀI thẻ trắng .ptk-article và trôi trên
   nền trang. Bộ tách đã sửa từ 2.0.3, nhưng bài đã import từ bản cũ vẫn giữ
   cấu trúc phẳng.

   Các quy tắc dưới đây nối những khối rời đó thành một cột trắng liền mạch,
   cùng bề ngang 980px với thẻ trắng phía trên.
   -------------------------------------------------------------------------- */
.ptk-article-section:not(.ptk-article *),
.ptk-article-faq:not(.ptk-article *),
.ptk-answer-box:not(.ptk-article *),
.ptk-hashtags:not(.ptk-article *),
.ptk-article-nav:not(.ptk-article *) {
    max-width: 980px;
    margin: 0 auto;
    padding: 0 56px;
    background: #fff;
    color: #26334d;
}

.ptk-article-section:not(.ptk-article *) {
    padding-top: 6px;
    padding-bottom: 6px;
}

/* Khối tối nằm giữa cột trắng: dùng box-shadow spread để "vẽ" phần lề trắng
   hai bên mà không phải thêm thẻ bọc (Elementor không cho chèn wrapper). */
.ptk-checklist:not(.ptk-article *),
.ptk-article-cta:not(.ptk-article *) {
    max-width: 868px;
    margin: 34px auto;
    box-shadow: 0 0 0 56px #fff;
}

/* Bo góc dưới cho khối cuối để cột trắng kết thúc gọn */
.ptk-article-section:not(.ptk-article *):last-child,
.ptk-article-faq:not(.ptk-article *):last-child {
    padding-bottom: 46px;
    border-radius: 0 0 30px 30px;
}

/* Typography vốn viết dưới dạng .ptk-article h2 / .ptk-article p — bổ sung
   bản độc lập để tiêu đề và đoạn văn không rơi về style mặc định. */
.ptk-article-section:not(.ptk-article *) > h2,
.ptk-checklist:not(.ptk-article *) > h2,
.ptk-article-faq:not(.ptk-article *) > h2 {
    margin: 0 0 16px;
    color: #061153;
    font-size: 31px;
    line-height: 1.2;
    letter-spacing: -.02em;
}

.ptk-checklist:not(.ptk-article *) > h2 {
    color: #fff;
}

.ptk-article-section:not(.ptk-article *) p,
.ptk-article-faq:not(.ptk-article *) p {
    line-height: 1.82;
}

@media (max-width: 767px) {

    .ptk-article-section:not(.ptk-article *),
    .ptk-article-faq:not(.ptk-article *),
    .ptk-answer-box:not(.ptk-article *) {
        padding-right: 20px;
        padding-left: 20px;
    }

    .ptk-checklist:not(.ptk-article *),
    .ptk-article-cta:not(.ptk-article *) {
        max-width: none;
        margin-right: 12px;
        margin-left: 12px;
        padding: 24px 20px;
        box-shadow: none;
    }
}

/* --------------------------------------------------------------------------
   Nội dung bài viết soạn bằng trình soạn thảo WordPress / do AI sinh ra
   (single.php -> .ptk-article-body). Trước đây render trong .container nên
   rộng ~1274px, không có thẻ trắng và thiếu typography -> khác hẳn bài demo.
   -------------------------------------------------------------------------- */
.ptk-article-body {
    color: #26334d;
    font-size: 17px;
    line-height: 1.82;
}

.ptk-article-body > *:first-child {
    margin-top: 0;
}

.ptk-article-body h2 {
    margin: 42px 0 16px;
    color: #061153;
    font-size: 31px;
    line-height: 1.2;
    letter-spacing: -.02em;
}

.ptk-article-body h3 {
    margin: 32px 0 12px;
    color: #061153;
    font-size: 23px;
    line-height: 1.3;
}

.ptk-article-body p {
    margin: 0 0 18px;
}

.ptk-article-body strong {
    color: #061153;
}

.ptk-article-body a {
    color: #1558e8;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Danh sách: trước đây mất bullet nên các ý nằm rời rạc như đoạn văn thường */
.ptk-article-body ul,
.ptk-article-body ol {
    margin: 0 0 20px;
    padding-left: 0;
    list-style: none;
}

.ptk-article-body ul > li,
.ptk-article-body ol > li {
    position: relative;
    margin-bottom: 10px;
    padding-left: 30px;
}

.ptk-article-body ul > li::before {
    content: "";
    position: absolute;
    top: 11px;
    left: 8px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #1558e8;
}

.ptk-article-body ol {
    counter-reset: ptk-ol;
}

.ptk-article-body ol > li {
    counter-increment: ptk-ol;
}

.ptk-article-body ol > li::before {
    content: counter(ptk-ol) ".";
    position: absolute;
    left: 0;
    color: #1558e8;
    font-weight: 800;
}

.ptk-article-body blockquote {
    margin: 30px 0;
    padding: 22px 26px;
    border-left: 5px solid #1558e8;
    border-radius: 0 18px 18px 0;
    background: #edf4ff;
    color: #142044;
}

.ptk-article-body blockquote p:last-child {
    margin-bottom: 0;
}

/* Ảnh chèn trong bài */
.ptk-article-body img,
.ptk-article-body figure img {
    display: block;
    width: 100%;
    height: auto;
    margin: 8px 0;
    border-radius: 20px;
}

.ptk-article-body figure {
    margin: 34px 0;
}

.ptk-article-body figcaption {
    margin-top: 10px;
    color: #7a8498;
    font-size: 13px;
    text-align: center;
}

.ptk-article-body table {
    width: 100%;
    margin: 28px 0;
    border-collapse: collapse;
}

.ptk-article-body th,
.ptk-article-body td {
    padding: 12px 14px;
    border: 1px solid #dce5fb;
    text-align: left;
}

.ptk-article-body th {
    background: #edf4ff;
    color: #061153;
}

@media (max-width: 767px) {

    .ptk-article-body {
        font-size: 16px;
    }

    .ptk-article-body h2 {
        font-size: 25px;
    }

    .ptk-article-body h3 {
        font-size: 20px;
    }

    .ptk-article-body table {
        display: block;
        overflow-x: auto;
    }
}

/* --------------------------------------------------------------------------
   Phân trang danh sách bài viết
   Dùng chung cho widget PTK Blog Grid và template index.php (chuyên mục, tag,
   tìm kiếm, lưu trữ).
   -------------------------------------------------------------------------- */
.ptk-blog-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 54px;
}

.ptk-blog-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    height: 48px;
    padding: 0 14px;
    border: 1px solid #dce5fb;
    border-radius: 14px;
    background: #fff;
    color: #061153;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    transition: all .25s ease;
}

.ptk-blog-pagination a.page-numbers:hover {
    border-color: #1558e8;
    background: #edf4ff;
    color: #1558e8;
}

.ptk-blog-pagination .page-numbers.current {
    border-color: #1053f3;
    background: #1053f3;
    color: #fff;
}

.ptk-blog-pagination .page-numbers.dots {
    border-color: transparent;
    background: transparent;
    color: #7a8498;
}

.ptk-blog-pagination .page-numbers i {
    font-size: 14px;
}

.ptk-blog-pagination a.page-numbers:focus-visible {
    outline: 2px solid #1053f3;
    outline-offset: 2px;
}

/* Mô tả chuyên mục ở đầu trang lưu trữ */
.ptk-archive-description {
    max-width: 760px;
    margin: 14px auto 0;
    color: #5e6b82;
    line-height: 1.7;
    text-align: center;
}

@media (max-width: 575px) {

    .ptk-blog-pagination {
        gap: 8px;
        margin-top: 38px;
    }

    .ptk-blog-pagination .page-numbers {
        min-width: 44px;
        height: 44px;
        padding: 0 10px;
    }
}
