/* Kiểu landing "dg" — Độ chìa khóa gập: "trước / sau", nền sáng, tiêu đề canh giữa, so sánh 2 cột có mũi tên. */
.thk-dg-wrap > * + * { margin-top: clamp(28px, 3vw, 44px) !important; }
.thk-dg-head { max-width: 760px; margin-inline: auto !important; text-align: center; }
.thk-dg-head > * { margin: 0 !important; }
.thk-dg-head > * + * { margin-top: 10px !important; }
.thk-dg-lead { color: var(--muted); }
.thk-dg-hero { padding-block: clamp(32px, 4vw, 64px); background: linear-gradient(180deg, #fff 0%, #fff4f4 100%); }
.thk-dg-hero__in { display: grid; grid-template-columns: .95fr 1.05fr; gap: clamp(28px, 4vw, 72px); align-items: center; }
.thk-dg-hero__img { margin: 0 !important; }
.thk-dg-hero__img img { width: 100%; aspect-ratio: 1100 / 776; object-fit: cover; border-radius: 24px 24px 24px 4px; box-shadow: 0 24px 48px rgba(18, 19, 23, .14); }
.thk-dg-hero__text > * { margin: 0 !important; }
.thk-dg-hero__text > * + * { margin-top: 20px !important; }
.thk-dg-hero__title { font-size: clamp(2rem, 1.4rem + 2.2vw, 3.2rem); line-height: 1.15; }
.thk-dg-hero__title span { display: block; color: var(--rd); font-size: .6em; margin-top: 8px; }
.thk-dg-hero__lead { font-size: 1.1rem; color: var(--muted); }
@media (max-width: 900px) { .thk-dg-hero__in { grid-template-columns: 1fr; } .thk-dg-hero__text { order: -1; } }
.thk-dg-compare { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; gap: 64px; position: relative; max-width: 1100px; margin-inline: auto !important; }
.thk-dg-col { margin: 0 !important; padding: clamp(24px, 3vw, 36px); border-radius: 18px; }
.thk-dg-col > * { margin: 0 !important; }
.thk-dg-col h3 { margin-bottom: 16px !important; font-size: 1.2rem; }
.thk-dg-col--before { background: #f1f2f4; color: var(--muted); }
.thk-dg-col--after { background: var(--ink); color: rgba(255, 255, 255, .88); }
.thk-dg-col--after h3 { color: #fff; }
.thk-dg-compare::after { content: ""; position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 48px; height: 48px; border-radius: 50%; background: var(--r) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M5 12h14m-6-6l6 6-6 6'/%3E%3C/svg%3E") center / 22px no-repeat; box-shadow: 0 0 0 8px #fff; z-index: 1; }
.thk-dg-x, .thk-dg-ok { list-style: none; padding: 0; display: grid; gap: 12px; }
.thk-dg-x li, .thk-dg-ok li { position: relative; padding-left: 30px; }
.thk-dg-x li::before { content: "✕"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: #d9dbe0; color: #555; font-size: 11px; display: grid; place-items: center; font-weight: 700; }
.thk-dg-ok li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 20px; height: 20px; border-radius: 50%; background: var(--r); color: #fff; font-size: 12px; display: grid; place-items: center; font-weight: 700; }
@media (max-width: 800px) { .thk-dg-compare { grid-template-columns: 1fr; gap: 64px; } .thk-dg-compare::after { rotate: 90deg; } }
.thk-dg-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); }
.thk-dg-fit { margin: 0 !important; position: relative; padding: 28px 26px 26px; background: #fff; border-radius: var(--rad); border-top: 4px solid var(--r); box-shadow: var(--shadow); }
.thk-dg-fit > * { margin: 0 !important; }
.thk-dg-fit h3 { padding-left: 40px; min-height: 28px; font-size: 1.1rem; margin-bottom: 10px !important; }
.thk-dg-fit p { color: var(--muted); }
.thk-dg-fit::before { content: ""; position: absolute; left: 26px; top: 28px; width: 26px; height: 26px; background: var(--r); -webkit-mask: var(--ico) center / contain no-repeat; mask: var(--ico) center / contain no-repeat; }
@media (max-width: 900px) { .thk-dg-grid { grid-template-columns: 1fr; } }
.thk-dg-steps { list-style: none; padding: 0; counter-reset: dg; display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--gap); max-width: 1200px; margin-inline: auto !important; }
.thk-dg-steps li { counter-increment: dg; text-align: center; color: var(--muted); padding: 0 8px; }
.thk-dg-steps li strong { display: block; color: var(--ink); font-family: var(--hf); margin-bottom: 4px; }
.thk-dg-steps li::before { content: counter(dg); display: grid; place-items: center; width: 56px; height: 56px; margin: 0 auto 16px; border-radius: 50%; border: 2px dashed var(--r); color: var(--rd); font: 700 1.3rem var(--hf); }
@media (max-width: 900px) { .thk-dg-steps { grid-template-columns: repeat(2, 1fr); row-gap: 28px; } }
.thk-dg-pricebox { margin-inline: auto !important; max-width: 900px; padding: clamp(28px, 3vw, 44px); border-radius: 20px; border: 2px solid var(--ink); }
.thk-dg-pricebox > * { margin: 0 !important; }
.thk-dg-pricebox > * + * { margin-top: 16px !important; }
.thk-dg-faqsec .thk-lp-faq, .thk-dg-more { max-width: 900px; margin-inline: auto !important; }
.thk-dg-more { color: var(--muted); text-align: center; }
