/*
Theme Name: NIS
Theme URI: https://nativeitsolution.com/
Author: Native IT Solution
Author URI: https://nativeitsolution.com/
Description: Giao diện WordPress tự viết cho Native IT Solution — cung ứng linh kiện CNTT, dịch vụ quản trị hạ tầng và phần mềm quản trị doanh nghiệp niserp. Không dùng theme cha, không phụ thuộc plugin trả phí.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nis
Tags: business, custom-logo, custom-menu, featured-images, translation-ready, dark-mode-support
*/

/* ============================================================
   1. THIẾT KẾ GỐC — giữ nguyên 100% từ bản mockup tĩnh
   ============================================================ */

:root{
  --nis:#8C1D40; --nis-2:#6E1533; --nis-3:#B0526C;
  --gold:#C6952F; --gold-2:#A87F27;
  --hero:#14181F; --hero-2:#1E242E;
  --paper:#F4EDF0; --surface:#EAE2E7; --raise:#FFFFFF;
  --ink:#241A1E; --t2:#5B4F54; --t3:#7E7378;
  --line:#E7DFE3; --line-2:#EFE8EB;
  --ok:#2F8F6B;
  --r:14px; --r-sm:9px;
  --sh:0 1px 2px rgba(40,10,25,.04),0 8px 28px rgba(40,10,25,.07);
  --sh-lg:0 18px 60px rgba(40,10,25,.16);
  --mono:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
  --ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --nis:#C4657F; --nis-2:#A23F5D; --nis-3:#D18FA3; --gold:#D4AA55; --gold-2:#B98F35;
  --hero:#0E1116; --hero-2:#171C24;
  --paper:#141013; --surface:#1B1519; --raise:#221A1E;
  --ink:#F0E9EB; --t2:#B0A2A7; --t3:#82757A;
  --line:#332A2E; --line-2:#2A2226;
  --ok:#4FA98A;
  --sh:0 1px 2px rgba(0,0,0,.4),0 8px 28px rgba(0,0,0,.4); --sh-lg:0 18px 60px rgba(0,0,0,.6);
}}
:root[data-theme="dark"]{
  --nis:#C4657F; --nis-2:#A23F5D; --nis-3:#D18FA3; --gold:#D4AA55; --gold-2:#B98F35;
  --hero:#0E1116; --hero-2:#171C24;
  --paper:#141013; --surface:#1B1519; --raise:#221A1E;
  --ink:#F0E9EB; --t2:#B0A2A7; --t3:#82757A;
  --line:#332A2E; --line-2:#2A2226;
  --ok:#4FA98A;
  --sh:0 1px 2px rgba(0,0,0,.4),0 8px 28px rgba(0,0,0,.4); --sh-lg:0 18px 60px rgba(0,0,0,.6);
}
:root[data-theme="light"]{
  --nis:#8C1D40; --nis-2:#6E1533; --nis-3:#B0526C; --gold:#C6952F; --gold-2:#A87F27;
  --hero:#14181F; --hero-2:#1E242E;
  --paper:#F4EDF0; --surface:#EAE2E7; --raise:#FFFFFF;
  --ink:#241A1E; --t2:#5B4F54; --t3:#7E7378;
  --line:#E7DFE3; --line-2:#EFE8EB;
  --ok:#2F8F6B;
  --sh:0 1px 2px rgba(40,10,25,.04),0 8px 28px rgba(40,10,25,.07); --sh-lg:0 18px 60px rgba(40,10,25,.16);
}
*{box-sizing:border-box}
/* Thanh nav dính cao ~70px: bù trừ để nhảy mỏ neo không chui xuống dưới nav. */
html{scroll-padding-top:5.5rem}
body{margin:0;font-family:var(--ui);background:var(--paper);color:var(--ink);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
/* Màn hình lớn: nới container + phóng chữ để không bị trống hai bên.
   Khối chữ vẫn giữ max-width theo ch nên không bị giãn quá rộng khó đọc. */
@media (min-width:1500px){
  .wrap{max-width:1320px}
  .hero .wrap{padding-top:88px;padding-bottom:84px}
  .hero h1{font-size:clamp(34px,4.6vw,66px)}
  .hero p.lead{font-size:18px}
  .hero-txt{max-width:64ch}
  .sec-lead{font-size:17px}
}
@media (min-width:1900px){
  .wrap{max-width:1440px}
  body{font-size:17px}
  .hero h1{font-size:72px}
}
h1,h2,h3{letter-spacing:-.025em;text-wrap:balance;margin:0}
a{color:inherit}
.todo{background:rgba(198,149,47,.18);color:var(--gold-2);border-bottom:1px dashed var(--gold);padding:0 4px;border-radius:3px;font-style:normal}
:root[data-theme="dark"] .todo,:root:not([data-theme]) .todo{color:var(--gold)}
@media (prefers-color-scheme:light){:root:not([data-theme]) .todo{color:var(--gold-2)}}

/* logo */
.wm{display:inline-flex;align-items:center;font-weight:800;font-size:21px;letter-spacing:.3px;line-height:1}
.wm .sl{width:7px;height:20px;background:var(--gold);transform:skewX(-14deg);border-radius:1px;margin:0 3px}
.wm.on-dark{color:#fff}
.wm.on-light{color:var(--nis)}
.lockup{display:flex;align-items:center;gap:11px}
.lockup .nm{font-size:12.5px;line-height:1.25;font-weight:600}
.lockup .nm span{display:block;font-weight:400;opacity:.62;font-size:11.5px}

/* nav */
.nav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;gap:14px;height:70px}
.nav nav{display:flex;gap:2px;margin-left:24px}
.nav nav a{text-decoration:none;color:var(--t2);font-size:14.5px;font-weight:500;padding:9px 14px;border-radius:20px}
.nav nav a:hover{color:var(--ink);background:var(--surface)}
.sp{flex:1}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 22px;border-radius:var(--r-sm);border:1px solid var(--nis);background:var(--nis);color:#fff;font-weight:600;cursor:pointer;font-family:var(--ui);font-size:14.5px;text-decoration:none;white-space:nowrap}
.btn:hover{background:var(--nis-2);border-color:var(--nis-2)}
.btn.sm{height:40px;padding:0 17px;font-size:14px}
.btn.ghost{background:transparent;color:var(--nis)}
.btn.ghost:hover{background:rgba(140,29,64,.07)}
.btn.on-dark{background:var(--nis);border-color:var(--nis);color:#fff}
.btn.on-dark:hover{background:var(--nis-2);border-color:var(--nis-2)}
.btn.line-dark{background:transparent;border-color:var(--line);color:var(--ink)}
.btn.line-dark:hover{background:var(--surface);border-color:var(--nis-3);color:var(--nis)}
.icobtn{height:40px;width:40px;border-radius:var(--r-sm);border:1px solid var(--line);background:transparent;color:var(--t2);cursor:pointer;font-size:15px;display:grid;place-items:center;flex:none}
.icobtn:hover{color:var(--nis);border-color:var(--nis-3)}
.burger{display:none}
.drawer{display:none;border-top:1px solid var(--line);background:var(--paper)}
.drawer.open{display:block}
.drawer a{display:block;padding:14px 24px;text-decoration:none;color:var(--ink);font-weight:600;border-bottom:1px solid var(--line-2)}
.drawer a:last-child{border-bottom:0}
.drawer a:hover{background:var(--surface);color:var(--nis)}
/* nút chính ở nền tối: dùng vàng cho tương phản đủ, đồng bộ với hero */
:root[data-theme="dark"] .btn:not(.ghost):not(.line-dark){background:var(--gold);border-color:var(--gold);color:#2A1D05}
:root[data-theme="dark"] .btn:not(.ghost):not(.line-dark):hover{background:var(--gold-2);border-color:var(--gold-2)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme]) .btn:not(.ghost):not(.line-dark){background:var(--gold);border-color:var(--gold);color:#2A1D05}
  :root:not([data-theme]) .btn:not(.ghost):not(.line-dark):hover{background:var(--gold-2);border-color:var(--gold-2)}
}

/* hero — nền sáng */
.hero{background:
    radial-gradient(760px 420px at 78% 26%, rgba(198,149,47,.10), transparent 66%),
    radial-gradient(680px 400px at 12% 6%, rgba(140,29,64,.06), transparent 62%),
    var(--paper);
  color:var(--ink);position:relative;overflow:hidden;border-bottom:1px solid var(--line)}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(var(--line-2) 1px,transparent 1px),linear-gradient(90deg,var(--line-2) 1px,transparent 1px);
  background-size:58px 58px;mask-image:radial-gradient(880px 470px at 68% 44%,#000,transparent 76%)}
.hero .wrap{position:relative;z-index:1;padding-top:74px;padding-bottom:70px}
.hero-txt{max-width:60ch}
.kicker{display:inline-flex;align-items:center;gap:9px;font-size:12px;text-transform:uppercase;letter-spacing:.13em;font-weight:700;color:var(--nis);margin-bottom:20px}
.kicker::before{content:"";width:26px;height:2px;background:var(--gold)}
.hero h1{font-size:clamp(34px,5vw,58px);line-height:1.09;font-weight:800;margin-bottom:18px}
.hero h1 em{font-style:normal;color:var(--nis)}
.hero p.lead{font-size:17px;color:var(--t2);max-width:50ch;margin:0 0 28px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.hero-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}
.hero-facts a{display:block;font-size:12.5px;color:var(--t2);text-decoration:none;padding:14px 15px;border:1px solid var(--line);border-radius:10px;background:var(--raise);box-shadow:var(--sh);transition:.15s}
.hero-facts a:hover{border-color:var(--nis-3);box-shadow:var(--sh)}
.hero-facts b{display:block;color:var(--ink);font-size:14px;margin-bottom:5px;font-weight:700}
.hero-facts a:hover b{color:var(--nis)}


/* sections */
section{padding:82px 0}
.sec-surface{background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.13em;font-weight:700;color:var(--nis);margin-bottom:14px}
h2{font-size:clamp(27px,3.1vw,37px);font-weight:800;line-height:1.15;margin-bottom:14px}
.sec-lead{color:var(--t2);font-size:16.5px;max-width:60ch;margin:0 0 44px}

/* hai mảng — bất đối xứng */
.lines{display:grid;grid-template-columns:1fr 1fr;gap:24px}
/* dải sản phẩm — trình bày khác hẳn dịch vụ */
.product{background:linear-gradient(155deg,var(--hero-2),var(--hero) 70%);color:#fff;position:relative;overflow:hidden}
.product::after{content:"";position:absolute;inset:0;opacity:.4;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:56px 56px;mask-image:radial-gradient(760px 400px at 22% 46%,#000,transparent 76%)}
.product .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.05fr .95fr;gap:52px;align-items:center}
.product .eyebrow{color:var(--gold)}
.product h2{color:#fff}
.product .sec-lead{color:rgba(255,255,255,.74);margin-bottom:26px}
.pbadge{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(198,149,47,.16);color:var(--gold);border:1px solid rgba(198,149,47,.4);padding:5px 13px;border-radius:20px;margin-bottom:20px}
.pbadge i{width:6px;height:6px;border-radius:50%;background:var(--gold)}
.pmods{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:28px}
.pmod{display:flex;gap:11px;align-items:flex-start;padding:13px 15px;border:1px solid rgba(255,255,255,.13);border-radius:9px;background:rgba(255,255,255,.04)}
.pmod .pi{font-size:16px;line-height:1;flex:none;margin-top:1px}
.pmod b{display:block;font-size:14px;font-weight:600;color:#fff;margin-bottom:2px}
.pmod span{font-size:12.5px;color:rgba(255,255,255,.6);line-height:1.45}
.pwhy{display:flex;flex-direction:column;gap:13px;margin-bottom:28px}
.pwhy li{list-style:none;position:relative;padding-left:26px;font-size:14.5px;color:rgba(255,255,255,.74)}
.pwhy li::before{content:"";position:absolute;left:0;top:9px;width:12px;height:2px;background:var(--gold);border-radius:2px}
.pwhy b{color:#fff;font-weight:600}
/* ảnh sản phẩm */
.pshot{border:1px solid rgba(255,255,255,.15);border-radius:var(--r);background:rgba(255,255,255,.04);box-shadow:var(--sh-lg);overflow:hidden}
.pshot-bar{height:34px;background:rgba(255,255,255,.06);border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;padding:0 13px;gap:6px}
.pshot-bar i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2)}
.pshot-bar span{margin-left:9px;font-family:var(--mono);font-size:10.5px;color:rgba(255,255,255,.42)}
.pshot-in{display:grid;grid-template-columns:44px 1fr}
.pshot-side{border-right:1px solid rgba(255,255,255,.1);padding:12px 9px;display:flex;flex-direction:column;gap:9px}
.pshot-side i{height:6px;border-radius:3px;background:rgba(255,255,255,.14)}
.pshot-side i.on{background:var(--gold)}
.pshot-main{padding:14px;display:flex;flex-direction:column;gap:11px}
.pshot-k{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.pshot-k div{border:1px solid rgba(255,255,255,.11);border-radius:8px;padding:9px 10px}
.pshot-k em{display:block;width:15px;height:3px;border-radius:2px;background:var(--gold);margin-bottom:7px}
.pshot-k b{font-family:var(--mono);font-size:11.5px;color:#fff;font-weight:600;letter-spacing:-.01em}
.pshot-k s{display:block;text-decoration:none;font-size:9.5px;color:rgba(255,255,255,.42);margin-top:2px}
.pshot-rows{display:flex;flex-direction:column;gap:8px;padding-top:2px}
.pshot-rows i{height:9px;border-radius:4px;background:rgba(255,255,255,.09)}
.pshot-rows i:nth-child(2){width:82%}.pshot-rows i:nth-child(3){width:66%}
.line-card{border:1px solid var(--line);border-radius:var(--r);background:var(--raise);box-shadow:var(--sh);overflow:hidden;display:flex;flex-direction:column;position:relative}
.line-card .top{padding:28px 26px 0}
.line-card .num{font-family:var(--mono);font-size:12px;color:var(--t3);letter-spacing:.1em;margin-bottom:16px}
.line-card h3{font-size:23px;font-weight:800;margin-bottom:10px}
.line-card .tagline{font-size:13.5px;font-weight:600;color:var(--nis);margin-bottom:12px;letter-spacing:-.005em}
.line-card.b .tagline{color:var(--gold-2)}
.line-card .desc{color:var(--t2);font-size:15px;margin:0 0 22px}
/* Body chảy ngay sau mô tả (không neo cả khối xuống đáy — card ngắn sẽ hở lỗ);
   chỉ NÚT neo đáy để hai card vẫn thẳng hàng nút với nhau. */
.line-card .body{padding:0 26px 28px;display:flex;flex-direction:column;flex:1}
.line-card .body .btn{margin-top:auto;align-self:flex-start}
.chiplist{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:22px}
.chip{font-size:12.5px;padding:5px 11px;border-radius:20px;background:var(--surface);border:1px solid var(--line);color:var(--t2);font-family:var(--mono)}
.line-card.a{border-top:3px solid var(--nis)}
.line-card.b{border-top:3px solid var(--gold)}
.line-card.b .chip{background:rgba(198,149,47,.09);border-color:rgba(198,149,47,.28)}
ul.ticks{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-direction:column;gap:11px}
ul.ticks li{position:relative;padding-left:26px;font-size:14.5px;color:var(--t2)}
ul.ticks li::before{content:"";position:absolute;left:0;top:8px;width:11px;height:2px;background:var(--nis);border-radius:2px}
.line-card.b ul.ticks li::before{background:var(--gold)}
ul.ticks b{color:var(--ink);font-weight:600}

/* quy trình */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:s}
.step{position:relative;padding-top:26px;border-top:2px solid var(--line)}
.step::before{counter-increment:s;content:"0" counter(s);position:absolute;top:-13px;left:0;background:var(--paper);padding-right:12px;font-family:var(--mono);font-size:13px;font-weight:700;color:var(--nis);letter-spacing:.04em}
.sec-surface .step::before{background:var(--surface)}
.step h4{margin:0 0 7px;font-size:16px;font-weight:700}
.step p{margin:0;color:var(--t2);font-size:14px}

/* vì sao */
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.why div{border-left:2px solid var(--gold);padding-left:20px}
.why h4{margin:0 0 8px;font-size:16.5px;font-weight:700}
.why p{margin:0;color:var(--t2);font-size:14.5px}

/* liên hệ */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:start}
.infobox{border:1px solid var(--line);border-radius:var(--r);padding:28px;background:var(--raise);box-shadow:var(--sh)}
.info-row{display:flex;gap:14px;padding:15px 0;border-bottom:1px solid var(--line-2);align-items:flex-start}
.info-row:last-child{border-bottom:0;padding-bottom:0}
.info-row .lb{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--t3);width:96px;flex:none;padding-top:2px;font-weight:600}
.info-row .vl{font-weight:600;font-size:15px}
.info-row .vl small{display:block;font-weight:400;color:var(--t2);font-size:13px;margin-top:2px}
.form label{display:block;font-weight:600;font-size:13.5px;margin-bottom:6px}
.form .fld{margin-bottom:16px}
.form input,.form select,.form textarea{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);padding:11px 13px;font-family:var(--ui);font-size:15px}
.form textarea{min-height:110px;resize:vertical}
.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.note{font-size:12.5px;color:var(--t3);margin-top:12px}

footer{background:var(--hero);color:rgba(255,255,255,.62);padding:56px 0 26px;font-size:14px}
footer .fg{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:32px;margin-bottom:36px}
footer .fg.fg-noproduct{grid-template-columns:1.5fr 1fr 1.2fr}
/* Link pháp lý: cách nhau bằng gap (không dùng ký tự · — xuống dòng sẽ rớt dấu mồ côi) */
.flegal{display:inline-flex;flex-wrap:wrap;column-gap:18px}
footer h5{color:#fff;font-size:12px;text-transform:uppercase;letter-spacing:.1em;margin:0 0 14px;font-weight:700}
footer a{display:block;color:rgba(255,255,255,.62);text-decoration:none;padding:4px 0}
footer a:hover{color:var(--gold)}
.fbottom{border-top:1px solid rgba(255,255,255,.11);padding-top:20px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:13px}


/* ==== cụm nút kênh liên hệ nổi ==== */
.dock{position:fixed;right:20px;bottom:20px;z-index:60;display:flex;flex-direction:column;gap:12px;align-items:flex-end}
.dk{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.3);cursor:pointer;border:0;position:relative;text-decoration:none;transition:transform .16s}
.dk:hover{transform:scale(1.08)}
.dk svg{width:27px;height:27px}
.dk .lbl{position:absolute;right:64px;top:50%;transform:translateY(-50%);background:var(--ink);color:var(--paper);font-size:12.5px;font-weight:600;padding:7px 12px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .16s;box-shadow:var(--sh)}
.dk:hover .lbl{opacity:1}
.dk.zalo{background:#0068FF}
.dk.mess{background:linear-gradient(45deg,#0099FF,#A033FF 60%,#FF5280)}
.dk.tele{background:#229ED9}
.dk.call{background:var(--nis)}
.dk.zalo b{color:#fff;font-weight:800;font-size:16px;letter-spacing:-.03em;font-style:italic}
.dk::before{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid currentColor;opacity:0;animation:ping 2.6s ease-out infinite}
.dk.zalo::before{color:#0068FF}.dk.tele::before{color:#229ED9}.dk.mess::before{color:#A033FF}.dk.call::before{color:var(--nis)}
@keyframes ping{0%{opacity:.5;transform:scale(.92)}70%{opacity:0;transform:scale(1.24)}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.dk::before{animation:none}.dk:hover{transform:none}}

/* ==== thẻ kênh trong khối liên hệ ==== */
.chgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:28px}
.ch{display:flex;align-items:center;gap:13px;padding:16px 17px;border:1px solid var(--line);border-radius:var(--r);background:var(--raise);text-decoration:none;transition:.15s}
.ch:hover{border-color:var(--nis-3);box-shadow:var(--sh);transform:translateY(-2px)}
.ch .ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:none}
.ch .ic svg{width:23px;height:23px}
.ch b{display:block;font-size:14.5px;font-weight:700;margin-bottom:2px}
.ch span{font-size:12.5px;color:var(--t3)}

/* chấm vàng: chỗ chưa gắn địa chỉ thật (bản mockup — theme không dùng nữa,
   kênh nào chưa điền URL trong Tùy biến thì ẩn hẳn) */
.todo-link{position:relative}
.todo-link::after{content:"";position:absolute;right:-1px;top:-1px;width:11px;height:11px;border-radius:50%;background:var(--gold);border:2px solid var(--paper);z-index:2}
.ch.todo-link::after{right:9px;top:9px}

@media (max-width:920px){
  .hero .wrap,.product .wrap{grid-template-columns:1fr;gap:40px;padding-top:56px;padding-bottom:56px}
  .product .wrap{padding-top:0;padding-bottom:0}
  .lines,.contact{grid-template-columns:1fr}
  .steps,.why{grid-template-columns:1fr 1fr}
  footer .fg{grid-template-columns:1fr 1fr}
  .nav nav{display:none}
  .burger{display:grid}
  .hero-facts{grid-template-columns:1fr}
  section{padding:60px 0}
}
@media (max-width:600px){
  .steps,.why,footer .fg,.form .two,.pmods,.chgrid{grid-template-columns:1fr}
  body{font-size:15px}
  .dock{right:12px;bottom:12px;gap:9px}
  .dk{width:46px;height:46px}.dk svg{width:23px;height:23px}
  .dk .lbl{display:none}
}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

/* ============================================================
   2. TÍCH HỢP WORDPRESS
   Phần bổ sung cho nội dung do WordPress sinh ra (trang, bài viết,
   kết quả tìm kiếm, phân trang, bình luận). Chỉ dùng lại biến màu
   và khoảng cách đã có ở trên — không thay đổi thiết kế gốc.
   ============================================================ */

/* trợ năng */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.skip-link{position:absolute;left:-9999px;top:0;z-index:100}
.skip-link:focus{left:12px;top:12px;background:var(--nis);color:#fff;padding:10px 16px;border-radius:var(--r-sm);font-weight:600;font-size:14px;text-decoration:none}

/* logo tải lên thay cho biểu trưng chữ */
.custom-logo{display:block;max-height:44px;width:auto;height:auto}
.custom-logo-link{display:inline-flex;align-items:center;flex:none}
a.lockup{text-decoration:none;color:inherit}

/* mô tả dịch vụ soạn bằng trình soạn thảo */
.line-card .desc p{margin:0 0 12px}
.line-card .desc p:last-child{margin-bottom:0}
.line-card .desc ul,.line-card .desc ol{margin:0 0 12px;padding-left:20px}

/* nội dung bài viết / trang */
.entry{max-width:74ch}
.entry-meta{font-family:var(--mono);font-size:12px;color:var(--t3);letter-spacing:.06em;margin-bottom:22px}
.entry-meta a{text-decoration:none}
.entry-meta a:hover{color:var(--nis)}
.entry>*:first-child{margin-top:0}
.entry h2,.entry h3,.entry h4,.entry h5{margin:34px 0 12px;font-weight:700;line-height:1.25}
.entry h2{font-size:25px}
.entry h3{font-size:20px}
.entry h4{font-size:17px}
.entry p,.entry ul,.entry ol{color:var(--t2);margin:0 0 18px}
.entry ul,.entry ol{padding-left:22px}
.entry li{margin-bottom:8px}
.entry a{color:var(--nis);text-decoration:underline;text-underline-offset:3px}
.entry img,.entry iframe,.entry video{max-width:100%;height:auto;border-radius:var(--r)}
.entry figure{margin:0 0 22px}
.entry figcaption,.wp-caption-text{font-size:12.5px;color:var(--t3);margin-top:8px}
.entry blockquote{margin:0 0 22px;padding:2px 0 2px 20px;border-left:2px solid var(--gold);color:var(--t2)}
.entry code{font-family:var(--mono);font-size:13.5px;background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:1px 5px}
.entry pre{font-family:var(--mono);font-size:13.5px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:16px;overflow:auto;margin:0 0 22px}
.entry pre code{background:none;border:0;padding:0}
.entry table{width:100%;border-collapse:collapse;margin:0 0 22px;font-size:14.5px}
.entry th,.entry td{border:1px solid var(--line);padding:10px 12px;text-align:left}
.entry th{background:var(--surface);font-weight:700}
.entry hr{border:0;border-top:1px solid var(--line);margin:32px 0}
.alignleft{float:left;margin:0 22px 14px 0}
.alignright{float:right;margin:0 0 14px 22px}
.aligncenter{display:block;margin-left:auto;margin-right:auto}
.entry .alignwide,.entry .alignfull{max-width:none}

/* danh sách bài viết dùng lại thẻ .line-card */
.card-link{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.card-link:hover h3{color:var(--nis)}
.thumb{display:block;width:100%;height:auto;border-bottom:1px solid var(--line)}
.pager{display:flex;gap:8px;flex-wrap:wrap;margin-top:40px}
.pager .nav-links{display:flex;gap:8px;flex-wrap:wrap}
.pager .page-numbers,.pager>a,.pager>span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-sm);text-decoration:none;color:var(--t2);font-size:14px}
.pager .page-numbers:hover,.pager>a:hover{border-color:var(--nis-3);color:var(--nis)}
.pager .page-numbers.current{background:var(--nis);border-color:var(--nis);color:#fff}
.post-nav{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:40px;padding-top:24px;border-top:1px solid var(--line);font-size:14px}
.post-nav a{color:var(--nis);text-decoration:none;font-weight:600}

/* biểu mẫu tìm kiếm */
.searchform{display:flex;gap:10px;max-width:520px}
.searchform input[type="search"]{flex:1;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);padding:11px 13px;font-family:var(--ui);font-size:15px}

/* thông báo biểu mẫu liên hệ */
.form-msg{border-radius:var(--r-sm);padding:12px 14px;font-size:14px;font-weight:600;margin-bottom:18px;border:1px solid var(--line)}
.form-msg.ok{background:rgba(47,143,107,.10);border-color:rgba(47,143,107,.35);color:var(--ok)}
.form-msg.err{background:rgba(140,29,64,.08);border-color:var(--nis-3);color:var(--nis)}
.nis-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden}

/* bình luận */
.comments{margin-top:48px;padding-top:32px;border-top:1px solid var(--line)}
.comments h3{font-size:20px;font-weight:700;margin-bottom:20px}
.comment-list{list-style:none;padding:0;margin:0 0 32px}
.comment-list li{padding:16px 0;border-bottom:1px solid var(--line-2)}
.comment-list .children{list-style:none;padding-left:24px;margin:12px 0 0}
.comment-meta{font-size:12.5px;color:var(--t3);margin-bottom:6px}
.comment-body p{color:var(--t2);margin:0 0 10px;font-size:14.5px}
.comment-form label{display:block;font-weight:600;font-size:13.5px;margin-bottom:6px}
.comment-form input[type="text"],.comment-form input[type="email"],.comment-form input[type="url"],.comment-form textarea{width:100%;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--paper);color:var(--ink);padding:11px 13px;font-family:var(--ui);font-size:15px}
.comment-form p{margin:0 0 16px}
.comment-form .submit{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 22px;border-radius:var(--r-sm);border:1px solid var(--nis);background:var(--nis);color:#fff;font-weight:600;cursor:pointer;font-family:var(--ui);font-size:14.5px}