/**
 * Khu Trung Toan Cau - custom theme
 * Ported 1:1 from the NukeViet redesign (forest/signal palette)
 */

:root{
  --font-heading:'Kodchasan',sans-serif;
  --font-mono:'Kodchasan',sans-serif;
  --ink:#241811; --forest:#2E1F14; --forest-2:#4A3320; --forest-3:#6B4A24;
  --paper:#F6F1E8; --paper-2:#FFFFFF; --muted:#6E5F52; --line:#E5DCCC;
  --signal:#B87715; --signal-dark:#5E3009; --signal-tint:#FBEFD8;
  --mint:#D9932B; --mint-light:#FBEFD8;
  --gold:#D9932B; --gold-dark:#8A5D0A; --gold-tint:#FBEFD8;
  --amber-tint:#FBEFD8; --amber-line:#E8CD96; --amber-ink:#8A5D0A;
  --radius:10px; --maxw:1180px;
}

/* ============ Global typography / chrome (site-wide) ============ */
*,*::before,*::after{box-sizing:border-box;}
body{background:var(--paper);color:var(--ink);font-family:var(--font-heading);-webkit-font-smoothing:antialiased;}
.mono{font-family:var(--font-mono);}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px;}

.reveal{opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .6s ease;}
.reveal.on{opacity:1;transform:translateY(0);}

@keyframes rd-pulse{0%,100%{opacity:1;}50%{opacity:.35;}}

/* ---------- Topbar ---------- */
.topbar{background:linear-gradient(120deg,var(--forest) 0%,#B87715 60%,var(--mint) 100%);color:#E7DCCF;font-size:13px;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:38px;flex-wrap:wrap;}
.topbar-left{display:flex;gap:22px;}
.topbar-right{display:flex;gap:16px;}
.topbar-right a{color:#E7DCCF;}
.topbar-right a:hover{color:#fff;}

/* ---------- Header ---------- */
header.rd-header{background:var(--paper-2);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:200;}
header.rd-header .wrap{display:flex;align-items:center;justify-content:space-between;height:76px;gap:20px;}
.rd-logo{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.rd-logo img{height:52px;width:auto;display:block;}
.rd-logo .name{font-family:var(--font-heading);font-weight:700;font-size:16.5px;color:var(--forest);line-height:1.25;}
.rd-logo .sub{font-size:10px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;}

nav.rd-nav{display:flex;gap:26px;flex-wrap:wrap;}
nav.rd-nav a{font-size:15.5px;font-weight:500;padding:6px 0;border-bottom:2px solid transparent;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:4px;}
nav.rd-nav a:hover{border-color:var(--signal);color:var(--signal-dark);}
nav.rd-nav a.current{border-color:var(--signal);color:var(--signal-dark);}
nav.rd-nav a img{width:16px;height:16px;object-fit:contain;}
.rd-nav-item{position:relative;display:flex;align-items:center;}
.rd-nav-item .rd-nav-caret{font-size:9px;color:var(--muted);}
.rd-nav-caret-btn{display:none;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:6px;margin-left:2px;color:var(--muted);}
.rd-nav-item .rd-dropdown{display:none;position:absolute;top:100%;left:0;margin:0;padding:8px;list-style:none;background:var(--paper-2);border:1px solid var(--line);border-radius:8px;box-shadow:0 16px 32px rgba(0,0,0,.14);min-width:230px;z-index:210;}
.rd-nav-item:hover .rd-dropdown{display:block;}
.rd-nav-item .rd-dropdown li{list-style:none;}
.rd-nav-item .rd-dropdown a{display:block;padding:9px 12px;font-size:13.5px;font-weight:400;color:var(--ink);border-bottom:none;white-space:nowrap;}
.rd-nav-item .rd-dropdown a:hover{background:var(--paper);color:var(--signal-dark);}
@media (max-width:980px){
  .rd-nav-item{flex-direction:row;flex-wrap:wrap;align-items:center;width:100%;position:relative;}
  .rd-nav-item > a{flex:1;}
  .rd-nav-caret-btn{display:flex;}
  .rd-nav-caret-btn .rd-nav-caret{display:inline-block;transition:transform .2s;}
  .rd-nav-item.open .rd-nav-caret-btn .rd-nav-caret{transform:rotate(90deg);}
  .rd-nav-item .rd-dropdown{display:none;position:static;box-shadow:none;border:none;padding:0 0 4px 16px;width:100%;order:3;}
  .rd-nav-item.open .rd-dropdown{display:block;}
}

.rd-header-cta{display:flex;align-items:center;gap:14px;flex-shrink:0;}
.rd-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:6px;font-size:14px;font-weight:600;white-space:nowrap;transition:background .15s,color .15s,border-color .15s;text-decoration:none;}
.rd-btn-primary{background:var(--signal);color:#fff !important;}
.rd-btn-primary:hover{background:var(--signal-dark);}
.rd-btn-outline{border:1.5px solid var(--forest);color:var(--forest) !important;}
.rd-btn-outline:hover{background:var(--forest);color:#fff !important;}
.rd-btn-white{background:#fff;color:var(--signal-dark) !important;}
.rd-btn-white:hover{background:#F6F1E8;}
.rd-btn-ghost-light{border:1.5px solid rgba(255,255,255,.35);color:#fff !important;}
.rd-btn-ghost-light:hover{border-color:#fff;background:rgba(255,255,255,.08);}
.rd-btn-lg{padding:15px 26px;font-size:15px;border-radius:7px;}
.rd-header-phone{display:inline-flex;flex-direction:column;align-items:flex-start;font-family:var(--font-mono);font-weight:600;font-size:15px;color:var(--forest);text-decoration:none;padding:9px 20px;border:1.5px solid var(--forest);border-radius:6px;transition:background .15s,color .15s,border-color .15s;}
.rd-header-phone:hover{background:var(--forest);color:#fff !important;}
.rd-header-phone small{display:block;font-family:var(--font-heading);font-size:10px;color:var(--muted);font-weight:400;}
.rd-header-phone:hover small{color:rgba(255,255,255,.75);}

.rd-nav-toggle{display:none;flex-direction:column;gap:4px;padding:8px;background:none;border:none;cursor:pointer;}
.rd-nav-toggle span{width:22px;height:2px;background:var(--forest);display:block;}

/* ---------- Trending strip ---------- */
.trending{background:linear-gradient(120deg,var(--forest) 0%,#B87715 60%,var(--mint) 100%);padding:10px 0;}
.trending .wrap{display:flex;align-items:center;gap:14px;}
.trending .lbl{flex-shrink:0;font-family:var(--font-mono);font-size:11px;color:#C7B7A6;display:flex;align-items:center;gap:6px;}
.trending .lbl .dot{width:6px;height:6px;border-radius:50%;background:#D9932B;animation:rd-pulse 1.6s infinite;}
.trending-marquee{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 40px,#000 calc(100% - 40px),transparent 100%);}
.trending-chips{display:flex;flex-wrap:nowrap;gap:8px;width:max-content;animation:trending-scroll 38s linear infinite;}
.trending-marquee:hover .trending-chips{animation-play-state:paused;}
.trending-chips .tchip{flex-shrink:0;font-size:11px;color:#E7DCCF;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);padding:5px 12px;border-radius:100px;transition:background .15s,border-color .15s,color .15s;text-decoration:none;display:inline-block;white-space:nowrap;}
.trending-chips .tchip:hover{background:var(--signal);border-color:var(--signal);color:#fff;}
@keyframes trending-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

@media (max-width:980px){
  .topbar{display:none;}
  nav.rd-nav{display:none;position:absolute;top:76px;left:0;right:0;background:var(--paper-2);border-bottom:1px solid var(--line);flex-direction:column;gap:0;padding:8px 32px 16px;box-shadow:0 12px 24px rgba(0,0,0,.08);}
  nav.rd-nav.open{display:flex;}
  nav.rd-nav a{padding:11px 0;border-bottom:1px solid var(--line);}
  /* .rd-header-phone alone had display:none, but its parent .rd-header-cta (empty then)
     still counted as a 3rd flex item in header.rd-header .wrap's space-between layout,
     leaving a blank reserved slot at the far right and pushing the toggle button toward
     the middle instead of flush right. Hide the whole container so the toggle becomes the
     last (right-hand) item. */
  .rd-header-cta{display:none;}
  .rd-nav-toggle{display:flex;}
}

/* ============ Home page redesign (scoped) ============ */
.home-redesign img{max-width:100%;display:block;}
:where(.home-redesign) button{font-family:inherit;cursor:pointer;background:none;border:none;}
.home-redesign section{padding:20px 0;}
.home-redesign .section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:32px;gap:30px;flex-wrap:wrap;}
.home-redesign .section-head .tag-label{font-family:var(--font-mono);font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--signal-dark);margin-bottom:10px;display:block;}
.home-redesign .section-head h2{font-family:var(--font-heading);font-weight:600;letter-spacing:-0.01em;font-size:29px;max-width:560px;margin:0;}
.home-redesign .section-head p{color:var(--muted);font-size:15px;max-width:380px;margin:0;}

/* ---------- Chứng nhận đủ điều kiện (dưới hero) ---------- */
.home-redesign .compliance-banner{padding:15px 0;}
.home-redesign .compliance-banner .wrap{text-align:center;}
.home-redesign .compliance-banner h2{font-family:var(--font-heading);font-weight:700;font-size:19px;text-transform:uppercase;letter-spacing:.03em;color:var(--forest);margin:0 0 14px;position:relative;display:inline-block;padding-bottom:12px;}
.home-redesign .compliance-banner h2::after{content:"";position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:70px;height:3px;background:var(--signal);border-radius:2px;}
.home-redesign .compliance-banner p{max-width:820px;margin:0 auto;color:var(--muted);font-size:13.5px;line-height:1.75;text-transform:uppercase;letter-spacing:.01em;}
@media (max-width:600px){
  .home-redesign .compliance-banner h2{font-size:16px;}
}

/* ---------- Hero / diagnostic ---------- */
.home-redesign .hero{position:relative;background:var(--forest);color:#fff;overflow:hidden;padding:0;}
.home-redesign .hero-slides{position:absolute;inset:0;z-index:0;}
.home-redesign .hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity 1.2s ease;}
.home-redesign .hero-slide.is-active{opacity:1;}
.home-redesign .hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,20,18,.82) 0%,rgba(10,20,18,.62) 42%,rgba(10,20,18,.28) 75%,rgba(10,20,18,.15) 100%);}
.home-redesign .hero-grid{position:absolute;inset:0;z-index:2;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 88%);}
.home-redesign .hero .wrap{position:relative;z-index:3;padding-top:20px;padding-bottom:40px;}

/* Top slide info bar */
.home-redesign .hero-slide-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:rgba(10,20,18,.55);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:12px 18px;margin-bottom:22px;}
.home-redesign .hero-slide-badge{flex-shrink:0;background:var(--forest);border:1px solid rgba(255,255,255,.2);color:#fff;font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.04em;padding:5px 10px;border-radius:5px;}
.home-redesign .hero-slide-title{flex:1;min-width:180px;font-size:13.5px;font-weight:700;letter-spacing:.02em;color:#fff;text-decoration:none;transition:color .15s;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.home-redesign .hero-slide-title:hover{color:var(--mint-light);text-decoration:underline;}
.home-redesign .hero-slide-tag{flex-shrink:0;background:var(--gold-tint);color:var(--gold-dark) !important;font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:100px;text-decoration:none;transition:background .15s;}
.home-redesign .hero-slide-tag:hover{background:var(--gold);color:#fff !important;}
.home-redesign .hero-slide-bar-controls{flex-shrink:0;display:flex;align-items:center;gap:10px;margin-left:auto;}
.home-redesign .hero-slide-dots{display:flex;gap:6px;}
.home-redesign .hero-slide-dots span{width:16px;height:3px;border-radius:2px;background:rgba(255,255,255,.3);cursor:pointer;transition:.2s;}
.home-redesign .hero-slide-dots span.is-active{background:var(--signal);width:24px;}
.home-redesign .hero-slide-arrow{flex-shrink:0;width:28px;height:28px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06);color:#fff;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;transition:.2s;}
.home-redesign .hero-slide-arrow:hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.6);}
@media (max-width:700px){
  .home-redesign .hero-slide-bar{display:none;}
}

.home-redesign .diag-label{display:flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:#D8C4A8;margin-bottom:12px;}
.home-redesign .diag-row{display:flex;gap:22px;flex-wrap:wrap;margin-bottom:24px;}
.home-redesign .diag-col{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.home-redesign .diag-col-label{flex-shrink:0;font-size:11.5px;color:#C7B7A6;}
.home-redesign .diag-group{display:flex;gap:7px;flex-wrap:wrap;}
.home-redesign .dchip{font-size:12px;font-weight:500;padding:7px 14px;border-radius:100px;border:1.5px solid rgba(255,255,255,.22);color:#E5DCCC;transition:.15s;}
.home-redesign .dchip:hover{border-color:rgba(255,255,255,.55);}
.home-redesign .dchip.active{background:var(--signal-dark);border-color:var(--signal-dark);color:#fff;}
.home-redesign .dchip-recommend{background:var(--gold-tint);border-color:var(--gold-tint);color:var(--gold-dark);font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.02em;}
.home-redesign .dchip-recommend:hover{border-color:var(--gold);}
.home-redesign .dchip-recommend.active{background:var(--signal-dark);border-color:var(--signal-dark);color:#fff;}
.home-redesign .dchip-sep{align-self:center;color:rgba(255,255,255,.35);font-weight:300;padding:0 3px;user-select:none;}
.home-redesign .diag-sep{width:1px;background:rgba(255,255,255,.16);margin:0 4px;align-self:stretch;}

.home-redesign .hero-result{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;}
.home-redesign #hero-headline{font-family:var(--font-heading);font-weight:700;font-size:40px;line-height:1.16;color:#fff;margin:0 0 8px;transition:opacity .25s;}
.home-redesign #hero-headline em{font-style:normal;color:#E8B45F;}
.home-redesign #hero-subline{font-family:var(--font-heading);font-size:24px;font-weight:500;color:#F0E9DC;margin:0 0 18px;transition:opacity .25s;}
.home-redesign #hero-desc{font-size:15px;color:#D8C4A8;max-width:540px;margin:0 0 18px;transition:opacity .25s;line-height:1.7;}
.home-redesign #hero-desc b{color:#fff;font-weight:700;}
.home-redesign .urgency-badge{display:inline-flex;align-items:center;gap:8px;font-size:12.5px;color:var(--amber-ink);background:var(--amber-tint);border:1px solid var(--amber-line);padding:7px 14px;border-radius:100px;margin-bottom:22px;}
.home-redesign .hero-actions{display:flex;gap:14px;flex-wrap:wrap;}
/* "Xem thêm" hero link — same soft mint pill language as .match-suggest-badge */
.home-redesign .hero-more-pill{display:inline-flex;align-items:center;margin-top:2px;background:var(--mint-light);color:#B87715;font-size:12.5px;font-weight:600;padding:8px 16px;border-radius:100px;border:1px solid rgba(46,159,71,.3);text-decoration:none;line-height:1.4;transition:background .15s,color .15s;}
.home-redesign .hero-more-pill:hover{background:var(--signal);color:#fff;}
.home-redesign #cta-dynamic{transition:opacity .2s;}

.home-redesign .match-card-wrap{position:relative;padding-top:16px;}
.home-redesign .match-suggest-badge{position:absolute;top:0;right:20px;background:var(--mint-light);color:#B87715;font-size:11.5px;font-weight:600;padding:6px 14px;border-radius:100px;border:1px solid rgba(46,159,71,.3);}
.home-redesign .match-card{background:var(--paper-2);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:0 20px 40px rgba(0,0,0,.18);}
.home-redesign .match-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;}
.home-redesign .match-card .k{font-family:var(--font-mono);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);display:block;}
.home-redesign .match-recommend{flex-shrink:0;background:var(--gold-tint);color:var(--gold-dark);font-size:10.5px;font-weight:700;text-transform:uppercase;padding:5px 10px;border-radius:100px;}
.home-redesign .match-row{display:flex;justify-content:space-between;align-items:center;padding:13px 0;border-bottom:1px solid var(--line);}
.home-redesign .match-note{padding:9px 0 0;font-size:12px;color:var(--muted);font-style:italic;text-align:center;}
.home-redesign .match-row:last-of-type{border-bottom:none;}
.home-redesign .match-row .l{font-size:13px;color:var(--muted);}
.home-redesign .match-row .v{font-size:14px;font-weight:600;color:var(--ink);text-align:right;}
.home-redesign .match-row.match-row-full .v{text-align:left;flex:1;}
.home-redesign .match-row .v.price{color:var(--mint);font-size:15px;}
.home-redesign #match-article{display:flex;gap:12px;align-items:center;margin-top:18px;padding-top:18px;border-top:1px dashed var(--line);}
.home-redesign #match-article img{width:44px;height:44px;border-radius:8px;object-fit:cover;flex-shrink:0;}
.home-redesign #match-article .t{font-size:12.5px;line-height:1.4;color:var(--ink);}
.home-redesign #match-article .tag{font-family:var(--font-mono);font-size:10px;color:var(--mint);text-transform:uppercase;margin-bottom:4px;display:block;font-weight:600;}


/* ---------- Quote calculator ---------- */
/* Light "paper" card style, matching .quick-calc-box/.qc-result on trang Bảng giá chi
   tiết (templates/public/bang-gia.php) instead of the old dark green gradient box. */
.home-redesign .calc{background:#fff;border:1px solid var(--line);border-radius:16px;padding:36px;display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;}
.home-redesign .calc>div{min-width:0;}
.home-redesign .calc .rd-btn{white-space:normal;text-align:center;}
.home-redesign .calc h2{color:var(--forest);font-family:var(--font-heading);font-weight:600;font-size:26px;margin:0 0 10px;}
.home-redesign .calc p.d{color:var(--muted);font-size:14.5px;margin:0 0 26px;line-height:1.6;}
.home-redesign .calc-field{margin-bottom:20px;}
.home-redesign .calc-field label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:10px;font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.04em;}
.home-redesign .calc-chips{display:flex;gap:8px;flex-wrap:wrap;}
.home-redesign .calc .cchip{font-size:13px;padding:8px 14px;border-radius:100px;border:1.5px solid var(--line);color:var(--ink);background:#fff;}
.home-redesign .calc .cchip.active{background:var(--signal);border-color:var(--signal);color:#fff;}
.home-redesign .calc-slider{width:100%;accent-color:var(--signal);}
.home-redesign .calc-result{background:var(--paper,#F6F1E8);border:1px solid var(--line);border-radius:12px;padding:28px;text-align:center;}
.home-redesign .calc-result .lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px;}
.home-redesign .calc-result .price{font-family:var(--font-heading);font-size:30px;font-weight:700;color:var(--signal-dark,var(--forest));margin-bottom:4px;}
.home-redesign .calc-result .sub{font-size:12px;color:var(--muted);margin-bottom:22px;}

/* ---------- Quick booking banner (between calculator and pillars) ---------- */
.home-redesign .quick-booking{background:linear-gradient(120deg,var(--forest) 0%,#B87715 60%,var(--mint) 100%);border-radius:16px;padding:36px;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;box-shadow:0 16px 32px rgba(15,61,51,.22);}
.home-redesign .quick-booking>div{min-width:0;}
.home-redesign .quick-booking .qb-text .tag-label{color:#E7DCCF;}
.home-redesign .quick-booking .qb-text h2{color:#fff;font-family:var(--font-heading);font-weight:600;font-size:26px;margin:8px 0 10px;}
.home-redesign .quick-booking .qb-text p{color:#E7DCCF;font-size:14.5px;line-height:1.6;margin:0;}
.home-redesign .quick-booking-form{display:flex;flex-direction:column;gap:12px;background:#fff;border-radius:12px;padding:20px;}
.home-redesign .quick-booking-form .rd-btn{white-space:normal;}
.home-redesign .qb-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.home-redesign .qb-row>*{min-width:0;}
.home-redesign .quick-booking-form input,.home-redesign .quick-booking-form select{width:100%;padding:11px 12px;border:1.5px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;color:var(--ink);background:var(--paper);}
.home-redesign .quick-booking-form select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235B6B65' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:30px;}
.home-redesign .quick-booking-form select:invalid{color:var(--muted);}
.home-redesign .quick-booking-form input:focus,.home-redesign .quick-booking-form select:focus{outline:none;border-color:var(--signal);}
.home-redesign .qb-success{display:flex;align-items:center;justify-content:center;text-align:center;min-height:160px;padding:24px 20px;font-family:var(--font-heading);font-weight:600;font-size:15px;color:var(--signal-dark);background:var(--signal-tint);border-radius:12px;}
.home-redesign .qb-price{background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.home-redesign .qb-price .lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-family:var(--font-mono);}
.home-redesign .qb-price .val{font-family:var(--font-heading);font-weight:700;font-size:16px;color:var(--signal-dark);}

/* Collapsed trigger button — the quick-booking panel above starts hidden (server-rendered
   with the `hidden` attribute); only front-page.js reveals it once this is clicked. The
   `[hidden]` rule needs id-level specificity to win over `.quick-booking{display:grid}`,
   since both are equal-specificity author rules otherwise and source order would decide. */
#qb-panel[hidden],#qb-trigger[hidden]{display:none;}
.home-redesign .qb-trigger-btn{width:100%;display:flex;align-items:center;gap:16px;background:linear-gradient(120deg,var(--forest) 0%,#B87715 60%,var(--mint) 100%);border:none;border-radius:16px;padding:22px 28px;cursor:pointer;box-shadow:0 16px 32px rgba(15,61,51,.22);text-align:left;transition:transform .15s,box-shadow .15s;font-family:inherit;}
.home-redesign .qb-trigger-btn:hover{transform:translateY(-2px);box-shadow:0 20px 40px rgba(15,61,51,.28);}
.home-redesign .qb-trigger-ic{font-size:26px;flex-shrink:0;}
.home-redesign .qb-trigger-text{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;}
.home-redesign .qb-trigger-text strong{color:#fff;font-family:var(--font-heading);font-weight:600;font-size:18px;}
.home-redesign .qb-trigger-text small{color:#E7DCCF;font-size:13px;}
.home-redesign .qb-trigger-arrow{color:#fff;font-size:20px;flex-shrink:0;}

/* ---------- Pillars / pests ---------- */
.home-redesign .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.home-redesign .pillar-card{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .2s,transform .2s,box-shadow .2s;}
.home-redesign a.pillar-card{display:block;text-decoration:none;color:inherit;}
.home-redesign .pillar-card:hover{border-color:var(--signal);transform:translateY(-3px);box-shadow:0 16px 32px rgba(15,61,51,.14);}
.home-redesign .pillar-card .ic{width:100%;height:200px;overflow:hidden;background:var(--forest);}
.home-redesign .pillar-card .ic img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.home-redesign .pillar-card:hover .ic img{transform:scale(1.06);}
.home-redesign .pillar-card h3{font-family:var(--font-heading);font-weight:600;font-size:18px;margin:20px 26px 9px;}
.home-redesign .pillar-card p{color:var(--muted);font-size:14px;margin:0 26px 26px;line-height:1.6;}

/* One even row regardless of how many pest types are enabled (admin caps the
   homepage at 8); columns are generated per item instead of a fixed count. */
.home-redesign .pest-grid{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;}
.home-redesign .pest-card{background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:11px 4px;text-align:center;cursor:pointer;transition:.15s;display:block;text-decoration:none;color:inherit;}
.home-redesign .pest-card:hover,.home-redesign .pest-card.active{border-color:var(--signal);background:var(--signal-tint);}
.home-redesign .pest-card .ic{width:34px;height:34px;margin:0 auto 7px;display:flex;align-items:center;justify-content:center;font-size:26px;line-height:1;}
.home-redesign .pest-card .ic svg{width:100%;height:100%;}
.home-redesign .pest-card span{font-size:11.5px;font-weight:500;}

/* ---------- Insights ---------- */
/* 4 tracks: three 2fr article columns (together the left 2/3) + one 3fr form
   column (the right 1/3). Six articles auto-fill the 3 left columns as 2 rows
   of 3; the form card is pinned to column 4 spanning both rows. */
.home-redesign .insights-grid{display:grid;grid-template-columns:repeat(3,2fr) 3fr;gap:16px;}
.home-redesign .insight-card{background:var(--paper-2);border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:transform .2s;text-decoration:none;display:block;color:inherit;}
.home-redesign .insight-card:hover{transform:translateY(-4px);}
.home-redesign .insight-card .thumb{aspect-ratio:16/11;overflow:hidden;background:var(--line);}
.home-redesign .insight-card .thumb img{width:100%;height:100%;object-fit:cover;}
.home-redesign .insight-card .body{padding:11px 13px 13px;}
.home-redesign .insight-card .cat{font-family:var(--font-mono);font-size:10px;text-transform:uppercase;color:var(--signal-dark);}
.home-redesign .insight-card h3{font-family:var(--font-heading);font-weight:600;font-size:13px;margin:6px 0 0;line-height:1.4;}

/* Compact booking form card in the right 1/3, spanning both article rows.
   The photo flex-grows and the fields sit at the bottom, so the card always
   ends flush with the second article row — no leftover space, no overflow. */
.home-redesign .insight-card-form{grid-column:4;grid-row:1 / span 2;display:flex;flex-direction:column;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;overflow:hidden;}
.home-redesign .insight-form-thumb{flex:1 1 auto;min-height:170px;overflow:hidden;background:var(--line);}
.home-redesign .insight-form-thumb img{width:100%;height:100%;object-fit:cover;object-position:top center;}
.home-redesign .insight-card-form .body{flex:0 0 auto;display:flex;flex-direction:column;padding:16px 18px 18px;min-width:0;}
.home-redesign .insight-card-form h3{font-family:var(--font-heading);font-weight:600;font-size:15.5px;margin:7px 0 12px;line-height:1.4;}
.home-redesign .insight-booking-form{display:flex;flex-direction:column;gap:10px;margin-top:auto;}
.home-redesign .insight-booking-form input,.home-redesign .insight-booking-form select{width:100%;padding:11px 12px;border:1.5px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;color:var(--ink);background:var(--paper);}
.home-redesign .insight-booking-form select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235B6B65' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:30px;}
.home-redesign .insight-booking-form select:invalid{color:var(--muted);}
.home-redesign .insight-booking-form input:focus,.home-redesign .insight-booking-form select:focus{outline:none;border-color:var(--signal);}
.home-redesign .insight-booking-form button{width:100%;padding:12px;border:none;border-radius:8px;background:var(--signal);color:#fff;font-family:var(--font-heading);font-weight:600;font-size:13.5px;cursor:pointer;transition:background .15s;}
.home-redesign .insight-booking-form button:hover{background:var(--signal-dark);}
.home-redesign .insight-booking-form button:disabled{opacity:.7;cursor:default;}
.home-redesign .insight-form-success{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;min-height:180px;padding:24px 20px;font-family:var(--font-heading);font-weight:600;font-size:14.5px;color:var(--signal-dark);background:var(--signal-tint);}

/* ---------- CTA banner ---------- */
.home-redesign .cta-banner{position:relative;overflow:hidden;background:linear-gradient(120deg,var(--forest) 0%,#B87715 60%,var(--mint) 100%);color:#fff;padding:30px 38px;border-radius:16px;box-shadow:0 16px 32px rgba(15,61,51,.28);}
.home-redesign .cta-banner::before{content:"";position:absolute;top:-60px;right:-40px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08);}
.home-redesign .cta-banner::after{content:"";position:absolute;bottom:-80px;right:120px;width:180px;height:180px;border-radius:50%;background:rgba(255,255,255,.06);}
.home-redesign .cta-banner-inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;}
.home-redesign .cta-banner .cta-icon{width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;margin-bottom:10px;}
.home-redesign .cta-banner .cta-icon svg{width:18px;height:18px;}
.home-redesign .cta-banner h2{color:#fff;font-family:var(--font-heading);font-weight:700;font-size:21px;max-width:520px;margin:0;line-height:1.3;}
.home-redesign .cta-banner p{color:#DCEBF7;margin-top:6px;font-size:13px;max-width:460px;}
.home-redesign .cta-banner .rd-btn{padding:11px 20px;font-size:13.5px;}
@media (max-width:600px){
  .home-redesign .cta-banner{padding:24px 20px;}
}

@media (max-width:980px){
  .home-redesign .hero-result{grid-template-columns:1fr;}
  .home-redesign .pillars,.home-redesign .insights-grid{grid-template-columns:repeat(2,1fr);}
  .home-redesign .pest-grid{grid-auto-flow:row;grid-template-columns:repeat(4,1fr);}
  .home-redesign .calc{grid-template-columns:1fr;}
  .home-redesign .insight-card-form{grid-column:1 / -1;grid-row:auto;}
  .home-redesign .quick-booking{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .home-redesign #hero-headline{font-size:30px;}
  .home-redesign .pest-grid{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);}
  .home-redesign .qb-row{grid-template-columns:1fr;}
  /* The trigger button now lives inside the narrow .calc-result card (see "Bê nguyên cụm
     này thay thế vào đây") — its desktop-width padding/gaps leave almost no room for the
     text column here, forcing "Booking Nhanh" itself to wrap letter-by-letter. Shrink the
     fixed-width chrome (icon/arrow/padding) so the text gets the space instead. */
  .home-redesign .calc-result{padding:20px;}
  .home-redesign .qb-trigger-btn{padding:14px 14px;gap:10px;}
  .home-redesign .qb-trigger-ic{font-size:19px;}
  .home-redesign .qb-trigger-text strong{font-size:14.5px;}
  .home-redesign .qb-trigger-text small{font-size:11.5px;line-height:1.4;}
  .home-redesign .qb-trigger-arrow{font-size:15px;}
}

/* ---------- Đối tác - Khách hàng (partner logos carousel) ---------- */
.home-redesign .partners-section .doitac-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 60px,#000 calc(100% - 60px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 60px,#000 calc(100% - 60px),transparent 100%);}
.home-redesign .partners-section .doitac-track{display:flex;width:max-content;animation:doitac-scroll 32s linear infinite;}
.home-redesign .partners-section .doitac-marquee:hover .doitac-track{animation-play-state:paused;}
.home-redesign .partners-section .partner-logo{flex-shrink:0;width:172px;margin:0 10px;height:96px;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;display:flex;align-items:center;justify-content:center;padding:16px 20px;transition:transform .2s,box-shadow .2s,border-color .2s;}
.home-redesign .partners-section .partner-logo:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(15,61,51,.14);border-color:var(--signal);}
.home-redesign .partners-section .partner-logo img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
@keyframes doitac-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ============ Footer redesign (site-wide) ============ */
footer#footer{position:relative;background:var(--forest);color:#C7B7A6;padding:56px 0 24px;overflow:hidden;}
footer#footer a{color:#C7B7A6;text-decoration:none;transition:color .15s;}
footer#footer a:hover{color:#fff;}
footer#footer .wrap{position:relative;z-index:1;}

footer#footer .footer-deco{position:absolute;inset:0;z-index:0;background-image:radial-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%);mask-image:linear-gradient(180deg,#000,transparent 70%);}
footer#footer .footer-deco::before{content:"";position:absolute;top:-120px;right:-80px;width:340px;height:340px;border-radius:50%;background:rgba(46,159,71,.12);}
footer#footer .footer-deco::after{content:"";position:absolute;bottom:-140px;left:10%;width:300px;height:300px;border-radius:50%;background:rgba(18,104,166,.08);}

footer#footer .footer-grid{display:grid;grid-template-columns:1.15fr .85fr 1fr;gap:0;padding-top:6px;}
footer#footer .footer-col{padding:0 32px;border-left:1px solid rgba(255,255,255,.09);}
footer#footer .footer-col:first-child{padding-left:0;border-left:none;}
footer#footer .footer-col h3{position:relative;color:#fff;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;margin:0 0 22px;padding-bottom:12px;}
footer#footer .footer-col h3::after{content:"";position:absolute;left:0;bottom:0;width:26px;height:2px;background:var(--mint);border-radius:2px;}

footer#footer .company-name{font-size:14.5px;font-weight:600;color:#fff;line-height:1.5;margin-bottom:4px;}
footer#footer .footer-info{font-size:13px;line-height:1.6;opacity:.9;}
footer#footer .footer-info ul{list-style:none;margin:0 0 4px;padding:0;}
footer#footer .footer-info li{display:flex;gap:11px;align-items:flex-start;min-height:44px;}
footer#footer .footer-info li .fa{flex-shrink:0;width:26px;height:26px;border-radius:50%;background:rgba(46,159,71,.16);color:var(--mint);font-size:11px;display:flex;align-items:center;justify-content:center;margin-top:1px;}
footer#footer .footer-info,footer#footer .footer-info *{color:#D8C4A8 !important;}
footer#footer .footer-info a:hover{color:#fff !important;}

/* Its own block, vertically centered on the right edge — kept clear of the chat bubble
   block anchored at the very bottom (see #ktc-chatbot above). */
.hotline-float{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:150;transition:opacity .2s,visibility .2s;}
.hotline-float.ktc-cb-icons-hidden{opacity:0;visibility:hidden;pointer-events:none;}
.hotline-float ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.hotline-float li{list-style:none;}
.hotline-float a{position:relative;display:flex;align-items:center;justify-content:center;width:48px;height:48px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.3));transition:transform .2s;}
.hotline-float a:hover{transform:scale(1.1);}
.hotline-float a::before{content:'';position:absolute;inset:0;border-radius:10px;background:inherit;animation:hotline-pulse 2.2s ease-out infinite;z-index:-1;}
.hotline-float li:nth-child(2) a::before{animation-delay:.35s;}
.hotline-float li:nth-child(3) a::before{animation-delay:.7s;}
.hotline-float li:nth-child(4) a::before{animation-delay:1.05s;}
.hotline-float img{width:100%;height:100%;object-fit:contain;border-radius:10px;}
@keyframes hotline-pulse{
  0%{transform:scale(1);opacity:.55;}
  100%{transform:scale(1.9);opacity:0;}
}
@media (prefers-reduced-motion:reduce){
  .hotline-float a::before{animation:none;}
}
@media (max-width:600px){
  .hotline-float{right:10px;}
  .hotline-float a{width:40px;height:40px;}
}

.online-bar{display:inline-flex;align-items:center;gap:7px;font-size:12px;opacity:.85;}
.online-bar-eye{display:inline-block;animation:online-bar-blink 3.2s ease-in-out infinite;}
.online-bar #online-bar-count{color:var(--mint);font-weight:700;}
@keyframes online-bar-blink{0%,88%,100%{transform:scaleY(1);}92%{transform:scaleY(.15);}}
@media (prefers-reduced-motion:reduce){.online-bar-eye{animation:none;}}

/* ---------- Public chatbot ---------- */
#ktc-chatbot{position:fixed;right:18px;bottom:18px;z-index:200;}
#ktc-chatbot-toggle{width:56px;height:56px;border-radius:50%;border:none;cursor:pointer;background:linear-gradient(135deg,var(--signal) 0%,var(--forest) 100%);box-shadow:0 10px 26px rgba(15,61,51,.4);display:flex;align-items:center;justify-content:center;position:relative;transition:transform .2s;}
#ktc-chatbot-toggle:hover{transform:scale(1.08);}
#ktc-chatbot-toggle .ktc-cb-icon-chat,#ktc-chatbot-toggle .ktc-cb-icon-close{font-size:24px;line-height:1;position:absolute;transition:opacity .15s,transform .15s;}
#ktc-chatbot-toggle .ktc-cb-icon-close{opacity:0;transform:scale(.5);color:#fff;}
#ktc-chatbot.ktc-cb-open #ktc-chatbot-toggle .ktc-cb-icon-chat{opacity:0;transform:scale(.5);}
#ktc-chatbot.ktc-cb-open #ktc-chatbot-toggle .ktc-cb-icon-close{opacity:1;transform:scale(1);}
#ktc-chatbot-toggle::after{content:'';position:absolute;inset:0;border-radius:50%;background:inherit;animation:hotline-pulse 2.4s ease-out infinite;z-index:-1;}
#ktc-chatbot.ktc-cb-open #ktc-chatbot-toggle::after{animation:none;}

.ktc-cb-badge{display:none;position:absolute;top:-2px;right:-2px;width:15px;height:15px;border-radius:50%;background:#E74C3C;border:2px solid var(--paper,#F6F1E8);}
#ktc-chatbot.ktc-cb-unread .ktc-cb-badge{display:block;animation:ktc-cb-badge-pop .3s ease;}
@keyframes ktc-cb-badge-pop{from{transform:scale(0);}to{transform:scale(1);}}

.ktc-cb-greeting{position:absolute;right:66px;bottom:2px;width:250px;background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:12px 30px 12px 14px;font-size:13px;line-height:1.5;color:var(--ink);box-shadow:0 14px 34px rgba(15,36,32,.22);animation:ktc-cb-greeting-in .25s ease;cursor:pointer;}
.ktc-cb-greeting::after{content:'';position:absolute;right:-7px;bottom:20px;width:14px;height:14px;background:var(--paper-2);border-right:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(-45deg);}
.ktc-cb-greeting-close{position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;border:none;background:var(--paper);color:var(--muted);font-size:11px;cursor:pointer;}
@keyframes ktc-cb-greeting-in{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:translateY(0);}}
@media (max-width:600px){
  .ktc-cb-greeting{right:58px;width:210px;font-size:12.5px;padding:11px 26px 11px 12px;}
}

#ktc-chatbot-panel{display:none;position:absolute;right:0;bottom:70px;width:360px;max-width:calc(100vw - 36px);height:520px;max-height:calc(100vh - 120px);background:var(--paper-2);border-radius:16px;box-shadow:0 20px 50px rgba(15,36,32,.28);flex-direction:column;overflow:hidden;border:1px solid var(--line);}
#ktc-chatbot-panel:not([hidden]){display:flex;}
.ktc-cb-head{background:linear-gradient(120deg,var(--forest) 0%,var(--signal) 100%);color:#fff;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;}
.ktc-cb-head strong{display:block;font-size:15px;}
.ktc-cb-head span{display:block;font-size:11.5px;opacity:.85;margin-top:2px;}
.ktc-cb-head button{background:rgba(255,255,255,.15);border:none;color:#fff;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:13px;line-height:1;flex-shrink:0;}
.ktc-cb-head button:hover{background:rgba(255,255,255,.28);}

.ktc-cb-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--paper);}
.ktc-cb-row{display:flex;}
.ktc-cb-row-user{justify-content:flex-end;}
.ktc-cb-row-assistant{justify-content:flex-start;}
.ktc-cb-bubble{max-width:82%;padding:10px 13px;border-radius:14px;font-size:13.5px;line-height:1.5;white-space:pre-wrap;word-break:break-word;}
.ktc-cb-bubble-user{background:var(--signal);color:#fff;border-bottom-right-radius:4px;}
.ktc-cb-bubble-assistant{background:#fff;color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:4px;}
.ktc-cb-typing{display:flex;align-items:center;gap:4px;padding:13px;}
.ktc-cb-typing span{width:6px;height:6px;border-radius:50%;background:var(--muted);opacity:.5;animation:ktc-cb-typing-blink 1.2s ease-in-out infinite;}
.ktc-cb-typing span:nth-child(2){animation-delay:.2s;}
.ktc-cb-typing span:nth-child(3){animation-delay:.4s;}
@keyframes ktc-cb-typing-blink{0%,80%,100%{opacity:.3;transform:translateY(0);}40%{opacity:1;transform:translateY(-3px);}}

.ktc-cb-input{display:flex;align-items:flex-end;gap:8px;padding:12px;border-top:1px solid var(--line);background:#fff;}
.ktc-cb-input textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:12px;padding:9px 12px;font-family:inherit;font-size:13.5px;line-height:1.4;max-height:96px;}
.ktc-cb-input textarea:focus{outline:none;border-color:var(--signal);}
.ktc-cb-input button{width:38px;height:38px;border-radius:50%;border:none;background:var(--signal);color:#fff;cursor:pointer;font-size:15px;flex-shrink:0;transition:background .15s;}
.ktc-cb-input button:hover{background:var(--signal-dark);}

@media (max-width:600px){
  #ktc-chatbot{right:10px;bottom:10px;}
  #ktc-chatbot-toggle{width:50px;height:50px;}
  #ktc-chatbot-panel{position:fixed;right:8px;left:8px;bottom:76px;width:auto;height:min(70vh,560px);}
}

.admin-float-group{position:fixed;left:18px;bottom:18px;z-index:150;display:flex;flex-direction:column;align-items:flex-start;gap:8px;}
.admin-back-float{display:inline-flex;align-items:center;gap:6px;background:var(--forest);color:#fff !important;font-size:12.5px;font-weight:600;padding:10px 16px 10px 14px;border-radius:100px;text-decoration:none;box-shadow:0 8px 20px rgba(15,61,51,.3);transition:transform .2s,background .15s;}
.admin-back-float:hover{background:var(--forest-2);transform:translateY(-2px);}
.admin-back-float.admin-edit-float{background:var(--signal);box-shadow:0 8px 20px rgba(30,122,56,.35);}
.admin-back-float.admin-edit-float:hover{background:var(--signal-dark);}
@media (max-width:600px){.admin-float-group{left:10px;bottom:10px;gap:6px;}.admin-back-float{padding:9px 14px 9px 12px;font-size:12px;}}

footer#footer .footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;}
footer#footer .footer-col ul li{display:flex;align-items:center;min-height:44px;}
footer#footer .footer-col ul a{font-size:13.5px;opacity:.85;display:inline-flex;align-items:center;transition:opacity .15s,transform .15s,color .15s;color:#F6F1E8 !important;}
footer#footer .footer-col ul a:hover{opacity:1;transform:translateX(3px);color:var(--mint) !important;}
footer#footer .footer-col .fa-caret-right{margin-right:8px;font-size:9px;opacity:.8;color:var(--mint);}

footer#footer ul.counter{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;}
footer#footer ul.counter li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.08);box-sizing:border-box;min-height:44px;}
footer#footer ul.counter li:last-child{border-bottom:none;padding-bottom:0;}
footer#footer ul.counter li span:first-child{display:flex;align-items:center;gap:8px;font-size:13.5px;opacity:.85;}
footer#footer ul.counter .fa{width:13px;color:var(--mint);font-size:12px;flex-shrink:0;}
footer#footer ul.counter li span:last-child{font-family:var(--font-mono);font-weight:600;color:#fff;font-size:13.5px;}

footer#footer .footer_bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.1);margin-top:40px;padding-top:22px;font-size:12px;opacity:.7;}
footer#footer .coppyright{font-size:12px;}
footer#footer .footer-totop{display:inline-flex;align-items:center;gap:6px;font-size:12px;opacity:.85;}
footer#footer .footer-totop:hover{opacity:1;}

@media (max-width:980px){
  footer#footer .footer-grid{grid-template-columns:1fr 1fr;gap:28px;}
  footer#footer .footer-col{border-left:none;padding-left:0;}
  footer#footer .footer-col-main{grid-column:1 / -1;}
}
@media (max-width:600px){
  footer#footer .footer-grid{grid-template-columns:1fr;gap:32px;}
  footer#footer .footer_bottom{flex-direction:column;text-align:center;}
}

/* ============ Article detail page ============ */
.article-body-wrap{background:var(--paper-2);border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 36px rgba(15,61,51,.07);margin-bottom:24px;padding:32px 36px;}
@media (max-width:600px){.article-body-wrap{padding:22px 18px;}}

.article-title{font-family:var(--font-heading);font-weight:700;font-size:32px;line-height:1.3;color:var(--forest);letter-spacing:-.01em;margin:0 0 18px;}
@media (max-width:600px){.article-title{font-size:24px;}}

.article-meta{padding-bottom:18px;margin-bottom:24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;}
.article-meta .meta-date{font-family:var(--font-mono);font-size:13px;color:var(--muted);font-weight:500;}

.article-excerpt{background:var(--signal-tint);border-left:4px solid var(--signal);border-radius:0 12px 12px 0;padding:18px 22px;margin-bottom:28px;font-size:16.5px;line-height:1.7;color:var(--forest-2);font-style:italic;}

.article-content{font-size:16px;line-height:1.85;color:var(--ink);}
.article-content p{margin:0 0 18px;}
.article-content h2,.article-content h3,.article-content h4{font-family:var(--font-heading);color:var(--forest);font-weight:700;line-height:1.4;margin:32px 0 14px;}
.article-content h2{font-size:23px;}
.article-content h3{font-size:19px;}
.article-content h4{font-size:16.5px;}
/* !important overrides leftover inline color/font styling baked into rich-text content
   migrated from the old site's editor, so every link reads the same regardless of source.
   Some migrated bodies carry inline style="font-family:Times New Roman,..." (or legacy
   <font face> tags) from the original WYSIWYG paste — force the theme font everywhere
   inside content so it never diverges from the surrounding page. */
.article-content,.article-content *{font-family:var(--font-heading) !important;}
.article-content a,.article-content a *{color:var(--signal-dark) !important;text-decoration:underline !important;text-decoration-color:var(--line) !important;text-underline-offset:2px;font-style:normal !important;font-weight:inherit !important;background:none !important;}
.article-content a:hover,.article-content a:hover *{text-decoration-color:var(--signal-dark) !important;}
.article-content strong{color:var(--forest-2);}
.article-content ul,.article-content ol{margin:0 0 18px;padding-left:22px;}
.article-content li{margin-bottom:8px;}
.article-content img{border-radius:12px;max-width:100%;height:auto;box-shadow:0 12px 28px rgba(15,61,51,.12);margin:8px 0;}
.article-content blockquote{background:var(--paper);border-left:4px solid var(--gold);border-radius:0 12px 12px 0;padding:14px 20px;margin:0 0 18px;font-style:italic;color:var(--muted);}
.article-content table{width:100%;border-collapse:collapse;margin:0 0 18px;}
.article-content table td,.article-content table th{border:1px solid var(--line);padding:10px 12px;}

/* ============ Generic list / archive pages ============ */
.page-hero{background:linear-gradient(120deg,var(--forest) 0%,#B87715 60%,var(--mint) 100%);color:#fff;padding:15px 0;}
.page-hero .wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
.page-hero h1{font-family:var(--font-heading);font-weight:700;font-size:28px;margin:0 0 8px;}
.page-hero .breadcrumb{font-size:13px;color:#D8C4A8;}
.page-hero .breadcrumb a{color:#D8C4A8;text-decoration:none;}
.page-hero .breadcrumb a:hover{color:#fff;}

/* ---------- Quick price calculator (Bảng giá chi tiết page) ---------- */
.quick-calc-box{background:#fff;border:1px solid var(--line);border-radius:14px;padding:24px;margin-bottom:20px;}
.quick-calc-box h2{margin:0 0 6px;font-family:var(--font-heading);color:var(--forest);font-size:20px;}
.quick-calc-box>p{color:var(--muted);font-size:13px;margin:0 0 20px;}
/* Block 1 (loại côn trùng + loại mặt bằng) and Block 2 (kết quả) each take a full-width
   row, stacked top to bottom — see bang-gia.php for why: a side-by-side grid made the
   area slider (which should span the whole box) awkwardly narrow. */
.qc-block{margin-bottom:18px;}
.qc-field{margin-bottom:18px;}
.qc-field label{display:block;font-size:12.5px;color:var(--ink);font-weight:600;margin-bottom:8px;}
.qc-field-area{max-width:none;}
.qc-area-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px;}
.qc-area-head label{margin-bottom:0;}
.qc-area-input-wrap{display:flex;align-items:center;gap:8px;border:1.5px solid var(--line);border-radius:8px;padding:6px 12px;background:#fff;}
.qc-area-input-wrap input{width:80px;border:none;outline:none;font-size:14px;font-weight:600;color:var(--forest);text-align:right;font-family:var(--font-mono);-moz-appearance:textfield;}
.qc-area-input-wrap input::-webkit-outer-spin-button,.qc-area-input-wrap input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.qc-area-input-wrap span{font-size:13px;color:var(--muted);}
.qc-chips{display:flex;gap:8px;flex-wrap:wrap;}
.qc-chips .cchip{font-size:12.5px;padding:7px 13px;border-radius:100px;border:1.5px solid var(--line);color:var(--ink);background:#fff;cursor:pointer;transition:background .15s,border-color .15s,color .15s;}
.qc-chips .cchip:hover{border-color:var(--signal);}
.qc-chips .cchip.active{background:var(--signal);border-color:var(--signal);color:#fff;}
.qc-chips .cchip-recommend{background:var(--gold-tint);border-color:var(--gold-tint);color:var(--gold-dark);font-weight:700;text-transform:uppercase;font-size:11px;letter-spacing:.02em;}
.qc-chips .cchip-recommend:hover{border-color:var(--gold);}
.qc-chips .cchip-recommend.active{background:var(--signal);border-color:var(--signal);color:#fff;}
.qc-slider{width:100%;accent-color:var(--signal);margin-bottom:6px;}
.qc-ticks{position:relative;height:20px;margin-top:2px;}
.qc-tick{position:absolute;top:0;transform:translateX(-50%);background:none;border:none;padding:2px 4px;font-size:11px;color:var(--muted);cursor:pointer;white-space:nowrap;font-family:var(--font-mono);}
.qc-tick:hover{color:var(--signal-dark,var(--forest));text-decoration:underline;}
/* Light card instead of a heavy color fill — the price itself (signal green) carries
   the emphasis, the box just frames it consistent with the rest of the page. */
.qc-result{background:var(--paper,#F6F1E8);border:1px solid var(--line);border-radius:12px;padding:26px;text-align:center;}
.qc-result .qc-lbl{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-bottom:8px;}
.qc-result .qc-price{font-family:var(--font-heading);font-size:28px;font-weight:700;color:var(--signal-dark,var(--forest));margin-bottom:4px;}
.qc-result .qc-sub{font-size:12.5px;color:var(--muted);margin-bottom:18px;min-height:32px;}
.qc-formula-note{font-size:11.5px;line-height:1.5;color:var(--muted);text-align:center;margin:14px 0 0;padding-top:14px;border-top:1px dashed var(--line);}
.qc-formula-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start;}
@media (max-width:720px){.qc-formula-cols{grid-template-columns:1fr;}}
.qc-placeholder{color:var(--muted);font-size:13px;text-align:center;padding:20px;border:1.5px dashed var(--line);border-radius:12px;margin:0;}

.content-section{max-width:1180px;margin:0 auto;padding:20px 20px;}
.content-section.narrow{max-width:900px;}

.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:980px){.card-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:600px){.card-grid{grid-template-columns:1fr;}}
/* Full-width curated grids (Dịch vụ cung cấp / Lĩnh vực Khách hàng) — 4 columns down to 1 */
.card-grid.grid-4col{grid-template-columns:repeat(4,1fr);gap:18px;}
@media (max-width:1100px){.card-grid.grid-4col{grid-template-columns:repeat(3,1fr);}}
@media (max-width:760px){.card-grid.grid-4col{grid-template-columns:repeat(2,1fr);}}
@media (max-width:460px){.card-grid.grid-4col{grid-template-columns:1fr;}}
.card-grid.grid-4col .entity-card .body{padding:14px 16px 16px;}
.card-grid.grid-4col .entity-card h3,.card-grid.grid-4col .entity-card h2{font-size:14.5px;margin:0;}

.entity-card{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:border-color .2s,transform .2s,box-shadow .2s;text-decoration:none;color:inherit;display:block;}
.entity-card:hover{border-color:var(--signal);transform:translateY(-3px);box-shadow:0 16px 32px rgba(15,61,51,.14);}
.entity-card .thumb{width:100%;aspect-ratio:16/10;overflow:hidden;background:var(--forest);}
.entity-card .thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.entity-card:hover .thumb img{transform:scale(1.06);}
.entity-card .body{padding:18px 22px 22px;}
.entity-card .cat{font-family:var(--font-mono);font-size:11px;text-transform:uppercase;color:var(--signal-dark);}
.entity-card h3,.entity-card h2{font-family:var(--font-heading);font-weight:600;font-size:17px;margin:8px 0 8px;line-height:1.4;}
.entity-card p{color:var(--muted);font-size:14px;margin:0;line-height:1.6;}
.entity-card .price{font-family:var(--font-mono);font-weight:600;color:var(--mint);margin-top:10px;display:block;}
/* Product cards: product shots are tall bottles/devices on white — show the
   whole photo (contain on white) instead of cropping it like article covers. */
.product-card .thumb{background:#fff;aspect-ratio:4/3;}
.product-card .thumb img{object-fit:contain;padding:12px;}
.product-card h3{font-size:15.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

.layout-with-sidebar{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:start;}
@media (max-width:980px){.layout-with-sidebar{grid-template-columns:1fr;} .page-sidebar{order:2;}}

.page-main{min-width:0;}
.page-sidebar{display:flex;flex-direction:column;gap:20px;min-width:0;}
.sidebar-widget{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:22px;}
.sidebar-widget h3,.sidebar-widget h2{font-family:var(--font-heading);font-weight:600;font-size:15.5px;color:var(--forest);margin:0 0 16px;padding-bottom:12px;border-bottom:2px solid var(--signal-tint);text-align:center;}
.sidebar-custom-html p{margin:0 0 10px;}
.sidebar-custom-html p:last-child{margin-bottom:0;}
.sidebar-custom-html a,.sidebar-custom-html a *{color:var(--signal-dark) !important;text-decoration:underline !important;text-decoration-color:var(--line) !important;text-underline-offset:2px;background:none !important;}
.sidebar-custom-html a:hover,.sidebar-custom-html a:hover *{text-decoration-color:var(--signal-dark) !important;}
.sidebar-article{display:flex;gap:10px;text-decoration:none;color:inherit;margin-bottom:14px;}
.sidebar-article:last-child{margin-bottom:0;}
.sidebar-article .thumb{width:60px;height:60px;flex-shrink:0;border-radius:8px;overflow:hidden;background:var(--forest);}
.sidebar-article .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.sidebar-article .t{font-size:13px;line-height:1.45;font-weight:500;color:var(--ink);align-self:center;}
.sidebar-article:hover .t{color:var(--signal-dark);}
.sidebar-cat-list{display:flex;flex-direction:column;gap:2px;}
.sidebar-cat-list a{font-size:13.5px;color:var(--ink);text-decoration:none;padding:7px 0;border-bottom:1px solid var(--line);}
.sidebar-cat-list a:last-child{border-bottom:none;}
.sidebar-cat-list a:hover{color:var(--signal-dark);}
.sidebar-cat-list a.active{color:var(--signal-dark);font-weight:600;}
.sidebar-tag-list{display:flex;flex-wrap:wrap;align-items:center;gap:7px 9px;margin-top:14px;}
.sidebar-tag-list a{padding:5px 12px;border-radius:100px;background:var(--paper);border:1px solid var(--line);color:var(--muted);text-decoration:none;transition:background .15s,border-color .15s,color .15s;}
.sidebar-tag-list a:hover{border-color:var(--signal);color:var(--signal-dark);background:var(--signal-tint);}
/* Tag-cloud weighting: w1 = least-used tag in the list, w5 = most-used. */
.sidebar-tag-list a.tag-w1{font-size:11px;font-weight:400;color:var(--muted);}
.sidebar-tag-list a.tag-w2{font-size:12px;font-weight:400;color:var(--muted);}
.sidebar-tag-list a.tag-w3{font-size:13px;font-weight:500;color:var(--ink);}
.sidebar-tag-list a.tag-w4{font-size:14.5px;font-weight:600;color:var(--signal-dark);border-color:var(--signal-tint);background:var(--signal-tint);}
.sidebar-tag-list a.tag-w5{font-size:16px;font-weight:700;color:var(--signal-dark);border-color:var(--signal-tint);background:var(--signal-tint);}
.sidebar-service-list{list-style:none;margin:0;padding:0;}
.sidebar-service-list li{border-bottom:1px solid var(--line);}
.sidebar-service-list li:last-child{border-bottom:none;}
.sidebar-service-list a{display:flex;align-items:center;gap:8px;padding:10px 0;font-size:13.5px;color:var(--ink);text-decoration:none;}
.sidebar-service-list a:hover{color:var(--signal-dark);}
.sidebar-service-list a span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.sidebar-service-list .check-ic{flex-shrink:0;width:18px;height:18px;color:var(--signal);}

.sidebar-service-cloud{display:flex;flex-wrap:wrap;gap:9px;margin-top:2px;}
.sidebar-service-cloud a{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:100px;background:var(--paper);border:1px solid var(--line);color:var(--ink);font-size:13px;font-weight:500;text-decoration:none;transition:background .15s,border-color .15s,color .15s;}
.sidebar-service-cloud a:hover{border-color:var(--signal);color:var(--signal-dark);background:var(--signal-tint);}
.sidebar-service-cloud a .check-ic{flex-shrink:0;width:14px;height:14px;color:var(--signal);}
/* Light "paper" card style, matching .qc-result (Mức giá tham khảo) trên trang Bảng giá
   chi tiết instead of the old dark green gradient box. */
.sidebar-contact-box{background:var(--paper,#F6F1E8);border:1px solid var(--line);border-radius:14px;padding:24px;text-align:center;}
.sidebar-contact-box h3,.sidebar-contact-box h2{font-family:var(--font-heading);font-weight:600;font-size:15.5px;color:var(--forest);margin:0 0 16px;padding-bottom:12px;border-bottom:2px solid var(--signal-tint);text-align:center;}
.sidebar-contact-box .phone{display:block;font-family:var(--font-heading);font-weight:700;font-size:26px;color:var(--signal-dark,var(--forest));text-decoration:none;margin-bottom:16px;}
.sidebar-contact-box .rd-btn{width:100%;justify-content:center;}

.pagination{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:28px;}
.pagination .page-btn{min-width:36px;height:36px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:8px;color:var(--ink);text-decoration:none;font-size:13.5px;font-family:var(--font-mono);}
.pagination .page-btn:hover{border-color:var(--signal);color:var(--signal-dark);}
.pagination .page-btn.active{background:var(--forest);border-color:var(--forest);color:#fff;}
.pagination .page-nav{font-family:var(--font-heading);padding:0 14px;}
.pagination .page-ellipsis{color:var(--muted);padding:0 4px;}

.category-filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px;}
.category-filter a{font-size:13px;padding:8px 14px;border-radius:100px;border:1.5px solid var(--line);color:var(--ink);text-decoration:none;transition:.15s;}
.category-filter a:hover,.category-filter a.active{border-color:var(--signal);background:var(--signal-tint);color:var(--signal-dark);}

.related-articles-block{margin-top:32px;}
.related-articles-list{display:flex;flex-direction:column;background:var(--paper-2);border:1px solid var(--line);border-radius:14px;overflow:hidden;}
.related-article-row{display:flex;align-items:center;gap:16px;padding:14px 20px;text-decoration:none;color:inherit;border-bottom:1px solid var(--line);transition:background .15s;}
.related-article-row:last-child{border-bottom:none;}
.related-article-row:hover{background:var(--paper);}
.related-article-row .thumb{flex-shrink:0;width:64px;height:64px;border-radius:8px;overflow:hidden;background:var(--forest);}
.related-article-row .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.related-article-row h3{margin:0;font-family:var(--font-heading);font-weight:500;font-size:14.5px;line-height:1.45;color:var(--ink);}
.related-article-row:hover h3{color:var(--signal-dark);}

.article-list-rows{display:flex;flex-direction:column;gap:10px;}
.article-row{display:flex;gap:22px;background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:16px;text-decoration:none;color:inherit;transition:border-color .2s,box-shadow .2s;}
.article-row:hover{border-color:var(--signal);box-shadow:0 12px 28px rgba(15,61,51,.1);}
.article-row .thumb{flex-shrink:0;width:220px;aspect-ratio:16/11;border-radius:10px;overflow:hidden;background:var(--forest);}
.article-row .thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.article-row .body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.article-row h3,.article-row h2{font-family:var(--font-heading);font-weight:600;font-size:18.5px;line-height:1.4;margin:0 0 8px;color:var(--forest);}
.article-row .row-meta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;font-family:var(--font-mono);font-size:12px;color:var(--muted);margin-bottom:10px;}
.article-row .row-meta .cat{color:var(--signal-dark);text-transform:uppercase;}
.article-row .row-meta span{display:inline-flex;align-items:center;gap:5px;}
.article-row p{color:var(--muted);font-size:14px;line-height:1.65;margin:0;}
@media (max-width:640px){
  .article-row{flex-direction:column;}
  .article-row .thumb{width:100%;aspect-ratio:16/9;}
}

.pricing-table{width:100%;border-collapse:collapse;margin:24px 0;}
.pricing-table th,.pricing-table td{padding:12px 16px;border:1px solid var(--line);text-align:left;font-size:14px;}
.pricing-table th{background:var(--paper);font-family:var(--font-mono);font-size:11.5px;text-transform:uppercase;color:var(--muted);}
.pricing-table td.price{color:var(--mint);font-weight:600;font-family:var(--font-mono);}

.faq-accordion{max-width:900px;margin:0 auto;}
.faq-item{border:1px solid var(--line);border-radius:10px;margin-bottom:10px;overflow:hidden;background:var(--paper-2);}
.faq-item summary{padding:16px 20px;font-weight:600;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;font-size:15px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+';font-size:20px;color:var(--signal);flex-shrink:0;margin-left:12px;}
.faq-item[open] summary::after{content:'−';}
.faq-item .faq-answer{padding:0 20px 18px;color:var(--muted);font-size:14.5px;line-height:1.7;}

.job-meta{display:flex;flex-wrap:wrap;gap:16px;font-size:13.5px;color:var(--muted);margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid var(--line);}
.job-meta span{display:inline-flex;align-items:center;gap:6px;}

.contact-form-wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;}
@media (max-width:900px){.contact-form-wrap{grid-template-columns:1fr;}}
.ktc-form-field{margin-bottom:16px;}
.ktc-form-field label{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px;}
.ktc-form-field input,.ktc-form-field textarea,.ktc-form-field select{width:100%;padding:11px 14px;border:1.5px solid var(--line);border-radius:8px;font-size:14px;font-family:inherit;}
.ktc-form-field input:focus,.ktc-form-field textarea:focus,.ktc-form-field select:focus{outline:none;border-color:var(--signal);}
.ktc-alert{padding:14px 18px;border-radius:8px;margin-bottom:20px;font-size:14px;}
.ktc-alert-success{background:var(--signal-tint);color:var(--signal-dark);}
.ktc-alert-error{background:#FBE3E1;color:#B3261E;}

.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
@media (max-width:980px){.gallery-grid{grid-template-columns:repeat(3,1fr);}}
@media (max-width:600px){.gallery-grid{grid-template-columns:repeat(2,1fr);}}
.gallery-grid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block;cursor:pointer;transition:opacity .15s,transform .15s;}
.gallery-grid img:hover{opacity:.88;transform:scale(1.015);}
.gallery-grid img:focus-visible{outline:2px solid var(--signal);outline-offset:2px;}

/* ---------- Gallery lightbox ---------- */
.gallery-lightbox{display:none;position:fixed;inset:0;z-index:500;background:rgba(10,20,17,.92);align-items:center;justify-content:center;padding:60px 20px;}
.gallery-lightbox.open{display:flex;}
.gallery-lightbox .gl-img{max-width:min(92vw,1100px);max-height:78vh;object-fit:contain;border-radius:8px;box-shadow:0 24px 60px rgba(0,0,0,.5);}
.gallery-lightbox .gl-caption{position:absolute;left:0;right:0;bottom:22px;text-align:center;color:#F6F1E8;font-size:14px;padding:0 60px;}
.gallery-lightbox .gl-close{position:absolute;top:18px;right:22px;background:none;border:none;color:#fff;font-size:34px;line-height:1;cursor:pointer;padding:6px 10px;}
.gallery-lightbox .gl-close:hover{color:var(--mint);}
.gallery-lightbox .gl-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.1);border:none;color:#fff;font-size:34px;line-height:1;width:52px;height:52px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;}
.gallery-lightbox .gl-nav:hover{background:rgba(255,255,255,.22);}
.gallery-lightbox .gl-prev{left:16px;}
.gallery-lightbox .gl-next{right:16px;}
@media (max-width:600px){
  .gallery-lightbox .gl-nav{width:40px;height:40px;font-size:26px;}
  .gallery-lightbox .gl-close{font-size:28px;top:10px;right:10px;}
}

/* ============ Hồ sơ năng lực — page-flip viewer (capability-profile.php) ============ */
.profile-flipbook-hero{padding:52px 0 12px;text-align:center;}
.profile-flipbook-hero .tag-label{display:block;}
.profile-flipbook-hero h1{font-family:var(--font-heading);font-weight:700;font-size:32px;color:var(--forest);margin:12px 0 10px;}
.profile-flipbook-hero p{color:var(--muted);font-size:15px;max-width:560px;margin:0 auto 22px;}

.profile-flipbook-section{padding:16px 0 48px;}
.flipbook{display:flex;align-items:center;justify-content:center;gap:18px;}
.flipbook-stage{position:relative;width:100%;max-width:520px;aspect-ratio:1600/2263;perspective:2400px;border-radius:6px;box-shadow:0 24px 60px rgba(15,61,51,.28);background:#fff;}
.flipbook-page{position:absolute;inset:0;border-radius:6px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#fff;}
.flipbook-page canvas{max-width:100%;max-height:100%;display:block;}
.flipbook-loading{position:absolute;inset:0;z-index:5;display:none;align-items:center;justify-content:center;background:rgba(255,255,255,.85);color:var(--forest);font-size:13.5px;font-weight:600;border-radius:6px;}
.flipbook-page-under{z-index:1;}
.flipbook-page-top{z-index:2;transform:rotateY(0deg);transform-origin:left center;backface-visibility:hidden;box-shadow:2px 0 12px rgba(0,0,0,.08);}
.flipbook-page-top::after{content:'';position:absolute;inset:0;opacity:0;pointer-events:none;transition:opacity .55s cubic-bezier(.45,0,.2,1);}
.flipbook-page-top.flip-next{transition:transform .55s cubic-bezier(.45,0,.2,1);transform-origin:left center;transform:rotateY(-110deg);}
.flipbook-page-top.flip-next::after{opacity:1;background:linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.35) 100%);}
.flipbook-page-top.flip-prev{transition:transform .55s cubic-bezier(.45,0,.2,1);transform-origin:right center;transform:rotateY(110deg);}
.flipbook-page-top.flip-prev::after{opacity:1;background:linear-gradient(270deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.35) 100%);}
.flipbook-page-under::before{content:'';position:absolute;inset:0;background:rgba(0,0,0,.18);pointer-events:none;}
.flipbook-tap{position:absolute;top:0;bottom:0;width:34%;z-index:3;background:none;border:none;cursor:pointer;padding:0;}
.flipbook-tap-left{left:0;}
.flipbook-tap-right{right:0;}
.flipbook-nav{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:#fff;border:1px solid var(--line);color:var(--forest);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,color .15s,transform .15s;box-shadow:0 8px 20px rgba(15,61,51,.12);}
.flipbook-nav:hover{background:var(--signal);color:#fff;transform:translateY(-2px);}
.flipbook-toolbar{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:22px;}
.flipbook-tool-btn{width:34px;height:34px;border-radius:50%;background:var(--paper-2);border:1px solid var(--line);color:var(--forest);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,color .15s;}
.flipbook-tool-btn:hover{background:var(--signal);color:#fff;}
.flipbook-counter{display:flex;align-items:center;gap:6px;font-size:13.5px;color:var(--muted);font-family:var(--font-mono);}
.flipbook-counter input{width:52px;text-align:center;padding:6px 4px;border:1px solid var(--line);border-radius:6px;font-family:var(--font-mono);font-size:13.5px;color:var(--ink);}
@media (max-width:640px){
  .flipbook{gap:8px;}
  .flipbook-nav{width:36px;height:36px;}
  .flipbook-stage{max-width:340px;}
}

/* ============ Giới thiệu (About) page — templates/public/gioi-thieu.php ============ */
.about-page{background:var(--paper);}

.about-hero{background:linear-gradient(135deg,var(--forest) 0%,var(--forest-2) 55%,#6B4A24 100%);color:#fff;padding:56px 0 64px;position:relative;overflow:hidden;}
.about-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 85% 20%,rgba(46,159,71,.25),transparent 55%);pointer-events:none;}
.about-hero .wrap{position:relative;z-index:1;}
.about-hero .breadcrumb{font-size:13px;color:#D8C4A8;margin-bottom:18px;}
.about-hero .breadcrumb a{color:#D8C4A8;text-decoration:none;}
.about-hero .breadcrumb a:hover{color:#fff;}
.about-hero-eyebrow{display:inline-block;font-family:var(--font-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--mint);background:rgba(46,159,71,.15);border:1px solid rgba(46,159,71,.35);padding:5px 14px;border-radius:100px;margin-bottom:16px;}
.about-hero h1{font-family:var(--font-heading);font-weight:700;font-size:34px;line-height:1.25;margin:0 0 16px;max-width:780px;}
.about-hero-lead{font-size:16px;line-height:1.75;color:#E5DCCC;max-width:760px;margin:0 0 28px;}
.about-hero-lead a{color:var(--mint);}
.about-hero-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-bottom:34px;}
.about-stats{display:flex;flex-wrap:wrap;gap:14px;}
.about-stat{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:14px 22px;min-width:140px;}
.about-stat .num{display:block;font-family:var(--font-heading);font-weight:700;font-size:26px;color:#fff;line-height:1.2;}
.about-stat .lbl{display:block;font-size:12.5px;color:#D8C4A8;margin-top:2px;}
.about-compliance{display:inline-flex;align-items:flex-start;gap:10px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:12px 16px;font-size:12.5px;line-height:1.6;color:#E5DCCC;max-width:640px;}
.about-compliance a{color:var(--mint);font-weight:600;}

/* Hero split into a text column + a cluster of stat circles (số nhảy tăng dần khi cuộn
   tới — xem script trong gioi-thieu.php). Mobile-first: circles sit in a centered static
   row below the text so the stats stay visible on small screens; from 1080px up they
   switch to an absolutely-positioned floating cluster that fills the empty right side. */
.about-hero-layout{display:flex;flex-wrap:wrap;align-items:center;gap:32px;}
.about-hero-main{flex:1 1 640px;min-width:0;}
.about-hero-orbit{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;width:100%;}
.stat-circle{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-radius:50%;background:rgba(255,255,255,.07);border:1.5px solid rgba(255,255,255,.22);backdrop-filter:blur(2px);padding:10px;width:108px;height:108px;}
.stat-circle .num{font-family:var(--font-heading);font-weight:700;font-size:22px;color:#fff;line-height:1;font-variant-numeric:tabular-nums;}
.stat-circle .lbl{font-size:10px;color:#D8C4A8;margin-top:5px;line-height:1.25;max-width:82%;}
.stat-circle.sc-2{border-color:rgba(126,214,144,.4);background:rgba(46,159,71,.14);}
@media (min-width:1080px){
  .about-hero-orbit{position:relative;flex:0 0 300px;height:400px;width:auto;gap:0;}
  .stat-circle{position:absolute;width:150px;height:150px;}
  .stat-circle .num{font-size:30px;}
  .stat-circle .lbl{font-size:11px;margin-top:6px;}
  .stat-circle.sc-1{top:0;right:30px;}
  .stat-circle.sc-2{width:196px;height:196px;top:118px;right:150px;}
  .stat-circle.sc-2 .num{font-size:34px;}
  .stat-circle.sc-3{top:270px;right:10px;}
}

.about-section{padding:56px 0;}
.about-section.alt{background:var(--paper-2);}
.about-section-head{max-width:680px;margin:0 0 34px;}
.about-eyebrow{display:inline-block;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--signal-dark);background:var(--signal-tint);padding:4px 12px;border-radius:100px;margin-bottom:12px;}
.about-section-head h2{font-family:var(--font-heading);font-weight:700;font-size:26px;color:var(--forest);margin:0 0 12px;}
.about-section-head p{color:var(--muted);font-size:15px;line-height:1.7;margin:0;}

.about-banner-photo{width:100%;border-radius:16px;overflow:hidden;box-shadow:0 20px 40px rgba(15,61,51,.16);}
.about-banner-photo img{width:100%;display:block;}

.about-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;}
.about-pillar-card{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:26px 22px;text-align:center;transition:transform .2s,box-shadow .2s,border-color .2s;}
.about-pillar-card:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(15,61,51,.12);border-color:var(--signal);}
.about-pillar-card .ic{font-size:30px;margin-bottom:14px;}
.about-pillar-card h3{font-family:var(--font-heading);font-weight:600;font-size:15.5px;color:var(--forest);margin:0;}

.about-reasons{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;}
.about-reason{display:flex;gap:16px;background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:22px;}
.about-reason .ic{flex-shrink:0;width:46px;height:46px;border-radius:12px;background:var(--signal-tint);display:flex;align-items:center;justify-content:center;font-size:20px;}
.about-reason h3{font-family:var(--font-heading);font-weight:600;font-size:15px;color:var(--forest);margin:0 0 6px;}
.about-reason p{color:var(--muted);font-size:13.5px;line-height:1.65;margin:0;}

.about-flow-v{position:relative;padding-left:52px;}
.about-flow-v::before{content:"";position:absolute;left:19px;top:8px;bottom:8px;width:2px;background:var(--line);}
.about-flow-v-step{position:relative;padding-bottom:26px;}
.about-flow-v-step:last-child{padding-bottom:0;}
.about-flow-v-step .num{position:absolute;left:-52px;top:0;width:40px;height:40px;border-radius:50%;background:var(--forest);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:700;font-size:15px;box-shadow:0 0 0 4px var(--paper);}
.about-section.alt .about-flow-v-step .num{box-shadow:0 0 0 4px var(--paper-2);}
.about-flow-v-step h3{font-family:var(--font-heading);font-weight:600;font-size:16px;color:var(--forest);margin:6px 0 6px;}
.about-flow-v-step p{color:var(--muted);font-size:14px;line-height:1.7;margin:0;}

.about-flow-h{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.about-flow-h-step{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:20px 16px;text-align:center;position:relative;}
.about-flow-h-step .num{width:34px;height:34px;border-radius:50%;background:var(--signal);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:700;font-size:14px;margin:0 auto 12px;}
.about-flow-h-step h3{font-family:var(--font-heading);font-weight:600;font-size:13.5px;color:var(--forest);margin:0 0 6px;line-height:1.4;}
.about-flow-h-step p{color:var(--muted);font-size:12px;line-height:1.55;margin:0;}
.about-flow-h-step:not(:last-child)::after{content:"→";position:absolute;right:-20px;top:38px;color:var(--line);font-size:16px;display:none;}
@media (min-width:900px){.about-flow-h-step:not(:last-child)::after{display:block;}}

.about-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.about-service-col{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:24px;}
.about-service-col h3{font-family:var(--font-heading);font-weight:600;font-size:15px;color:var(--forest);margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--line);}
.about-service-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px;}
.about-service-col li a{display:flex;align-items:flex-start;gap:8px;font-size:13.5px;line-height:1.5;color:var(--ink);text-decoration:none;padding:8px 6px;border-radius:8px;transition:background .15s,color .15s;}
.about-service-col li a:hover{background:var(--signal-tint);color:var(--signal-dark);}
.about-service-col li a::before{content:"›";flex-shrink:0;color:var(--signal);font-weight:700;}
.about-services-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}

.about-methods{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
.about-method-card{background:var(--paper-2);border:1px solid var(--line);border-radius:16px;padding:28px;}
.about-method-card .ic{font-size:26px;margin-bottom:10px;}
.about-method-card h3{font-family:var(--font-heading);font-weight:700;font-size:17px;color:var(--forest);margin:0 0 16px;}
.about-method-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;}
.about-method-card li{display:flex;gap:10px;font-size:13.5px;line-height:1.65;color:var(--ink);}
.about-method-card li::before{content:"✓";flex-shrink:0;color:var(--signal);font-weight:700;}

.about-cta-banner{background:linear-gradient(120deg,var(--forest) 0%,var(--signal) 100%);border-radius:20px;padding:44px 40px;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.about-cta-banner h2{font-family:var(--font-heading);font-weight:700;font-size:22px;margin:0 0 8px;}
.about-cta-banner p{color:#E5DCCC;font-size:14px;margin:0;max-width:520px;line-height:1.65;}

.about-intl{background:var(--paper-2);border:1px solid var(--line);border-radius:14px;padding:24px 28px;}
.about-intl h3{font-family:var(--font-heading);font-weight:600;font-size:14.5px;color:var(--forest);margin:0 0 8px;}
.about-intl p{color:var(--muted);font-size:13px;line-height:1.7;margin:0 0 16px;}
.about-intl p:last-child{margin-bottom:0;}
.about-intl a{color:var(--signal-dark);font-weight:600;}

@media (max-width:980px){
  .about-pillars,.about-reasons{grid-template-columns:repeat(2,1fr);}
  .about-services-grid{grid-template-columns:1fr 1fr;}
  .about-flow-h{grid-template-columns:repeat(3,1fr);}
  .about-methods{grid-template-columns:1fr;}
}
@media (max-width:640px){
  .about-hero h1{font-size:26px;}
  .about-pillars,.about-reasons,.about-services-grid,.about-flow-h{grid-template-columns:1fr;}
  .about-cta-banner{padding:30px 24px;}
}

/* ============ Thư ngỏ (open letter) page — templates/public/thu-ngo.php ============ */
.letter-page{background:var(--paper);padding:48px 0 64px;}
.letter-card{background:var(--paper-2);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 48px rgba(15,61,51,.1);overflow:hidden;margin-bottom:56px;}
.letter-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;flex-wrap:wrap;padding:30px 32px 24px;border-bottom:2px solid var(--signal-tint);}
.letter-head .logo img{height:52px;width:auto;}
.letter-head .co-info{text-align:right;font-size:12.5px;line-height:1.75;color:var(--muted);}
.letter-head .co-info strong{display:block;color:var(--forest);font-family:var(--font-heading);font-size:14.5px;margin-bottom:2px;}
.letter-head .co-info em{font-style:italic;}
.letter-title-wrap{text-align:center;padding:8px 44px 0;}
.letter-title-wrap .eyebrow{display:inline-block;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:6px;}
.letter-title-wrap h1,.letter-title-wrap h2{font-family:var(--font-heading);font-weight:700;font-size:36px;color:var(--forest);margin:0;}
.letter-title-wrap .rule{width:64px;height:3px;background:var(--gold);border-radius:2px;margin:16px auto 0;}
.letter-body{padding:28px 32px 36px;}
.letter-salutation{font-weight:600;color:var(--forest);margin-bottom:18px;}
.letter-body p{font-size:15.5px;line-height:1.9;color:var(--ink);margin:0 0 20px;text-align:justify;}
.letter-body p:first-of-type::first-letter{font-family:var(--font-heading);font-size:44px;font-weight:700;color:var(--signal);float:left;line-height:1;margin:2px 8px 0 0;}
.letter-closing{margin-top:8px;}
.letter-sign{display:flex;justify-content:flex-end;margin-top:8px;}
.letter-sign-block{text-align:center;}
.letter-sign-block .role{font-size:13px;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-bottom:46px;}
.letter-sign-block .name{font-family:var(--font-heading);font-weight:700;font-size:16.5px;color:var(--forest);}

.scope-checklist{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:28px 0 40px;}
.scope-check-item{display:flex;align-items:center;gap:10px;background:var(--paper-2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:13.5px;}
.scope-check-item .tick{flex-shrink:0;width:22px;height:22px;border-radius:50%;background:var(--signal-tint);color:var(--signal-dark);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;}
.scope-check-item .vi{color:var(--ink);font-weight:600;}
.scope-check-item .en{color:var(--muted);font-style:italic;font-size:12px;}

.scope-photo-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:40px;}
.scope-photo-card{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/3;display:block;box-shadow:0 12px 28px rgba(15,61,51,.14);}
.scope-photo-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.scope-photo-card:hover img{transform:scale(1.06);}
.scope-photo-card .cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px 12px;background:linear-gradient(0deg,rgba(15,36,32,.92),transparent);color:#fff;font-size:13.5px;font-weight:600;line-height:1.4;}

.why-us-list{display:flex;flex-direction:column;gap:14px;margin-bottom:8px;}
.why-us-item{display:flex;gap:14px;align-items:flex-start;background:var(--paper-2);border:1px solid var(--line);border-radius:12px;padding:16px 18px;}
.why-us-item .n{flex-shrink:0;width:30px;height:30px;border-radius:50%;background:var(--forest);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-weight:700;font-size:13px;}
.why-us-item p{margin:0;font-size:14px;line-height:1.7;color:var(--ink);}

@media (max-width:900px){
  .scope-checklist{grid-template-columns:repeat(2,1fr);}
  .scope-photo-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .letter-head{flex-direction:column;}
  .letter-head .co-info{text-align:left;}
  .letter-title-wrap h1,.letter-title-wrap h2{font-size:26px;}
  .letter-body{padding:24px 22px 32px;}
  .scope-checklist{grid-template-columns:1fr;}
  .scope-photo-grid{grid-template-columns:1fr;}
}


/* ============ Khối Hỏi–đáp trên trang Giải pháp ============
   Nằm TRONG cột chính của .layout-with-sidebar (main + sidebar phải), không phải một dải
   full-width tụt xuống dưới chân trang như bản đầu — để người đọc còn nhìn thấy sidebar
   liên hệ ngay cạnh lúc đang đọc phần trả lời về giá. */
.faq-block{
  margin:34px 0 0;padding:26px 28px;border:1px solid var(--line);border-radius:14px;
  background:var(--paper-2);border-top:4px solid var(--signal);
}
.faq-block-title{
  font-family:var(--font-heading);font-weight:700;font-size:21px;color:var(--forest);
  margin:0 0 4px;letter-spacing:-.01em;
}
.faq-item{padding:18px 0 0;border-top:1px dashed var(--line);margin-top:16px;}
.faq-item:first-of-type{border-top:0;margin-top:6px;padding-top:0;}
.faq-q{
  font-family:var(--font-heading);font-weight:700;font-size:16.5px;line-height:1.45;
  color:var(--forest-2);margin:0 0 8px;position:relative;padding-left:26px;
}
/* Dấu hỏi thay cho icon ảnh — không thêm tệp, không phụ thuộc font icon ngoài. */
.faq-q::before{
  content:"?";position:absolute;left:0;top:1px;width:19px;height:19px;border-radius:50%;
  background:var(--signal-tint);color:var(--signal-dark);font-size:12px;font-weight:700;
  line-height:19px;text-align:center;
}
.faq-a{margin:0;padding-left:26px;font-size:15px;line-height:1.75;color:var(--muted);}
@media (max-width:640px){
  .faq-block{padding:20px 18px;}
  .faq-q,.faq-a{padding-left:0;}
  .faq-q::before{position:static;display:inline-block;margin-right:7px;vertical-align:1px;}
}

/* ============ Khối "Dịch vụ xử lý tận nơi" cuối bài viết ============
   Đây là cây cầu duy nhất từ kho 303 bài viết sang 65 trang giải pháp có giá. Cố ý làm nổi
   hơn khối "Bài viết liên quan" ngay bên dưới: đọc xong bài là lúc người ta sẵn sàng gọi nhất,
   không nên đẩy họ đi đọc tiếp bài khác. */
.sol-cta{
  margin:30px 0 0;padding:22px 24px;border-radius:14px;
  background:var(--signal-tint);border:1px solid var(--signal);
}
.sol-cta-title{
  font-family:var(--font-heading);font-weight:700;font-size:18.5px;color:var(--forest);
  margin:0 0 3px;letter-spacing:-.01em;
}
.sol-cta-sub{margin:0 0 14px;font-size:14px;color:var(--forest-2);}
.sol-cta-list{display:flex;flex-direction:column;gap:8px;}
.sol-cta-item{
  display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:12px;
  padding:12px 15px;border-radius:10px;background:var(--paper-2);border:1px solid var(--line);
  text-decoration:none;color:var(--ink);transition:border-color .15s,transform .15s;
}
.sol-cta-item:hover{border-color:var(--signal);transform:translateX(2px);}
.sol-cta-name{font-weight:600;font-size:14.5px;line-height:1.4;color:var(--forest-2);}
.sol-cta-price{
  font-family:var(--font-mono);font-weight:700;font-size:14px;color:var(--signal-dark);
  white-space:nowrap;text-align:right;font-variant-numeric:tabular-nums;
}
.sol-cta-price em{display:block;font-style:normal;font-weight:400;font-size:11px;color:var(--muted);}
.sol-cta-go{color:var(--signal);font-size:16px;}
.sol-cta-phone{
  display:block;margin-top:14px;text-align:center;padding:12px 18px;border-radius:10px;
  background:var(--forest);color:#fff !important;text-decoration:none;
  font-weight:600;font-size:14.5px;transition:background .15s;
}
.sol-cta-phone:hover{background:var(--signal);}
@media (max-width:560px){
  .sol-cta{padding:18px 16px;}
  /* Giá xuống dòng riêng thay vì bóp tên dịch vụ thành 3 dòng chữ nhỏ. */
  .sol-cta-item{grid-template-columns:1fr auto;}
  .sol-cta-price{grid-column:1/-1;text-align:left;}
}

/* Dòng dẫn sang trang dịch vụ cấp loài trong khối cuối bài viết. */
.sol-cta-tongquan{margin:12px 0 0;font-size:13.5px;line-height:1.65;color:var(--forest-2);}
.sol-cta-tongquan a{color:var(--signal-dark);font-weight:600;}

/* ============ Khối gỡ bài tự tranh nhau + hỏi–đáp trong bài ============ */
/* Dòng dẫn lên bài trụ, đặt ở đầu bài vệ tinh. Cố ý gọn và không màu mè: đây là lối đi cho
   người đọc muốn xem bài tổng hợp, không phải quảng cáo chen ngang. */
.article-body-wrap .ktc-bai-tru{background:var(--paper);border-left:3px solid var(--forest-3);border-radius:0 8px 8px 0;
  padding:10px 14px;margin:0 0 20px;font-size:14.5px;color:var(--muted);}
.article-body-wrap .ktc-bai-tru a{color:var(--forest);font-weight:600;}

/* Danh sách các bài cùng chủ đề, đặt ở cuối bài trụ. */
.article-body-wrap .ktc-cum-bai{margin-top:32px;padding-top:20px;border-top:1px solid var(--line);}
.article-body-wrap .ktc-cum-bai h2{font-size:19px;margin:0 0 10px;}
.article-body-wrap .ktc-cum-bai ul{margin:0;padding-left:20px;}
.article-body-wrap .ktc-cum-bai li{margin-bottom:6px;line-height:1.5;}
.article-body-wrap .ktc-cum-bai a{color:var(--forest-2);}

/* Khối hỏi–đáp. Các H3 bên trong giữ nguyên kiểu tiêu đề sẵn có để Seo::faqTuNoiDung()
   vẫn nhận ra — chỉ tách khối bằng một đường kẻ, không đổi cấu trúc thẻ. */
.article-body-wrap .ktc-faq-tieude{margin-top:34px;padding-top:20px;border-top:1px solid var(--line);}

/* ── Bảng giá dùng chung (core/BangGia.php) ─────────────────────────────────
   Một bộ kiểu duy nhất cho cả bảng nhúng trong bài viết lẫn phần Bảng giá chi
   tiết ở cuối trang bảng giá, để hai nơi không bao giờ trông khác nhau.       */
.bg-khoi{border:1px solid var(--line,#F0E9DC);border-radius:10px;background:#fff;
  margin:22px 0;overflow:hidden;}
.bg-dau{padding:14px 18px 10px;border-bottom:1px solid var(--line,#F0E9DC);
  background:var(--paper,#F6F1E8);}
.bg-ten{margin:0 0 4px;font-family:var(--font-heading);color:var(--forest,#B87715);
  font-size:17px;line-height:1.3;}
.bg-mo-ta{margin:0;font-size:13.5px;color:var(--muted,#6E5F52);line-height:1.5;}
.bg-cuon{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.bg-bang{width:100%;border-collapse:collapse;font-size:14.5px;min-width:460px;}
.bg-bang th{text-align:left;padding:9px 16px;font-size:12px;font-weight:600;
  letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#6E5F52);
  border-bottom:1px solid var(--line,#F0E9DC);white-space:nowrap;}
.bg-bang td{padding:10px 16px;border-top:1px solid var(--line,#F0E9DC);vertical-align:top;}
.bg-bang tbody tr:first-child td{border-top:none;}
.bg-bang a{color:inherit;text-decoration:none;border-bottom:1px dotted currentColor;}
.bg-bang a:hover{color:var(--forest,#B87715);}
.bg-gia{font-weight:600;color:var(--forest,#B87715);white-space:nowrap;
  font-variant-numeric:tabular-nums;}
.bg-dv{color:var(--muted,#6E5F52);font-size:13.5px;white-space:nowrap;}
.bg-lien-he{font-weight:400;color:var(--muted,#6E5F52);}
.bg-chan{margin:0;padding:12px 18px;border-top:1px solid var(--line,#F0E9DC);
  font-size:13.5px;line-height:1.55;color:var(--muted,#6E5F52);}
.bg-vat{margin:0;padding:0 18px 13px;font-size:12.5px;font-style:italic;
  color:var(--muted,#6E5F52);}
.bg-trong{padding:14px 18px;color:var(--muted,#6E5F52);}
.bg-chi-tiet{margin-top:34px;}
.bg-chi-tiet > h2{font-family:var(--font-heading);color:var(--forest,#B87715);
  font-size:22px;margin:0 0 8px;}
.bg-dan{margin:0 0 4px;color:var(--muted,#6E5F52);font-size:14.5px;line-height:1.6;}
@media (max-width:640px){
  .bg-bang{font-size:14px;}
  .bg-bang th,.bg-bang td{padding:9px 12px;}
}

/* Khối hỏi đáp nằm trong cột nội dung của trang bảng giá */
.bg-faq{margin-top:34px;padding-top:24px;border-top:1px solid var(--line,#F0E9DC);}
.bg-faq h2{font-family:var(--font-heading);color:var(--forest,#B87715);font-size:22px;
  margin:0 0 6px;}
.bg-faq h3{margin:22px 0 6px;font-size:16.5px;}
.bg-faq p{margin:0;}

/* Khối giải thích cách tính giá — chỉ đoạn dẫn và công thức, không có bảng.
   .bg-ct là phần tử cuối của khối nên không kẻ viền dưới, tránh đường kẻ lửng. */
.bg-giai-thich .bg-dau{border-bottom:none;}
.bg-ct{padding:14px 18px 16px;background:var(--paper,#F6F1E8);overflow-x:auto;}
.bg-ct code{display:block;font-size:13.5px;line-height:1.6;color:var(--forest,#B87715);
  font-weight:600;white-space:nowrap;}
.bg-ct-note{display:block;margin-top:7px;font-size:12.5px;color:var(--muted,#6E5F52);
  white-space:normal;}
@media (max-width:640px){ .bg-ct code{white-space:normal;} }

/* Liên kết trở lại công cụ tính nhanh. Làm nổi hẳn thành nút chữ thay vì liên kết thường:
   đây là hành động duy nhất khách cần làm sau khi xem bảng giá khởi điểm — nếu nó chìm trong
   đoạn văn thì khách dừng ở con số khởi điểm và tưởng đó là giá cuối cùng. */
.bg-neo-tinh{display:inline-block;padding:2px 9px;border-radius:6px;
  background:var(--forest,#B87715);color:#fff;font-weight:600;text-decoration:none;
  white-space:nowrap;line-height:1.5;transition:background .15s,transform .15s;}
.bg-neo-tinh:hover,.bg-neo-tinh:focus-visible{background:#5E3009;transform:translateY(-1px);
  color:#fff;text-decoration:none;}
/* Khung ngắm khi nhảy neo, để công cụ tính không bị dính sát mép trên màn hình. */
#bang-gia-tinh-nhanh{scroll-margin-top:18px;}
@media (max-width:640px){ .bg-neo-tinh{white-space:normal;} }

/* Dòng mặt bằng ứng với ngữ cảnh bài viết — đẩy lên đầu bảng và tô nền nhạt.
   Dùng cả viền trái đậm chứ không chỉ màu nền, để người không phân biệt được màu vẫn thấy. */
.bg-bang tr.bg-noi > td{background:var(--paper,#F6F1E8);font-weight:600;}
.bg-bang tr.bg-noi > td:first-child{box-shadow:inset 3px 0 0 var(--forest,#B87715);}
.bg-ngu-canh{margin:6px 0 0;font-size:13px;color:var(--forest,#B87715);}

/* Khoảng chừa khi cuộn neo, để thanh tiêu đề dính (header.rd-header, cao 77px ở mọi bề rộng)
   không che mất phần đầu khối. Khai bằng CSS chứ không tính bằng JS: trình duyệt áp khoảng chừa
   đúng lúc cuộn, nên trang có xô lại vì ảnh tải xong muộn thì vẫn tới đúng chỗ. */
#insights, #qb-panel, #dich-vu, #pest-grid-section, #tinh-gia, #booking-nhanh{
  scroll-margin-top:93px;
}

/* ══════════════════════════════════════════════════════════════════════════════
   BỘ NHẬN DIỆN xulymoi.vn — site vệ tinh thứ ba, chuyên sâu về mối

   Ba site cùng một công ty nên phải phân biệt được ngay từ cái nhìn đầu tiên:

     khutrungtoancau.vn     xanh rừng + vàng      băng chuyền ảnh + lưới thẻ
     dichvupestcontrol.com  lục đậm + chanh       hero ảnh nền + thẻ + bảng
     xulymoi.vn (ở đây)     nâu gỗ + hổ phách     dẫn bằng kiến thức, không hero ảnh

   BẢNG MÀU lấy từ thế giới của loài này — gỗ và đất — chứ không chọn cho lạ mắt:
   nâu espresso cho nền đậm, cát cho nền sáng, hổ phách cho điểm nhấn. Cố ý không
   dùng sắc xanh nào vì hai site kia đã chiếm cả hai.

   HỔ PHÁCH CHỈ DÙNG LÀM NỀN VÀ VIỀN, KHÔNG LÀM CHỮ: #D9932B trên nền trắng chỉ đạt
   tương phản 2.4:1. Liên kết dạng chữ dùng --nau-lk (#8A4B12, đạt 6.1:1 trên nền
   cát), còn hổ phách luôn đi kèm chữ nâu đậm đè lên.

   Phông giữ Kodchasan cho toàn hệ thống theo yêu cầu chủ web.
   ══════════════════════════════════════════════════════════════════════════════ */

:root{
  --go:#2E1F14; --go-2:#4A3320; --go-3:#6B4A24;
  --hoang:#D9932B; --hoang-dam:#B87715; --hoang-nhat:#FBEFD8;
  --cat:#F6F1E8; --trang:#FFFFFF;
  --nau-chu:#241811; --nau-mo:#6E5F52; --nau-lk:#8A4B12; --vien-nau:#E5DCCC;

  /* Ánh xạ sang bộ biến chung của bộ mã, để các trang khác cũng đổi màu theo. */
  --ink:#241811; --forest:#2E1F14; --forest-2:#4A3320; --forest-3:#6B4A24;
  --paper:#F6F1E8; --paper-2:#FFFFFF; --muted:#6E5F52; --line:#E5DCCC;
  --signal:#8A4B12; --signal-dark:#5E3009; --signal-tint:#FBEFD8;
  --mint:#D9932B; --mint-light:#FBEFD8;
  --gold:#D9932B; --gold-dark:#8A5D0A; --gold-tint:#FBEFD8;
  --amber-tint:#FBEFD8; --amber-line:#E8CD96; --amber-ink:#8A5D0A;
  --radius:6px; --maxw:1120px;
}

.xm{background:var(--trang);color:var(--nau-chu);}
.xm-wrap{max-width:1120px;margin:0 auto;padding:0 28px;}
.xm h1,.xm h2,.xm h3{color:var(--go);text-wrap:balance;letter-spacing:-.015em;}
.xm p{color:var(--nau-mo);}

.xm-nhan{margin:0;font-size:12.5px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;
  color:var(--nau-lk);}
.xm-nhan-toi{color:var(--hoang);}

.xm-nut{display:inline-block;background:var(--hoang);color:var(--go);font-weight:700;font-size:15px;
  padding:13px 26px;border-radius:var(--radius);text-decoration:none;transition:background .15s;}
.xm-nut:hover{background:var(--hoang-dam);}
.xm-nut-phu{background:transparent;color:var(--cat);border:1px solid rgba(255,255,255,.32);}
.xm-nut-phu:hover{background:rgba(255,255,255,.10);}

.xm-muc{max-width:60ch;margin:0 0 34px;}
.xm-muc h2{font-size:clamp(25px,3.3vw,36px);line-height:1.2;margin:12px 0 0;}
.xm-muc p{margin:14px 0 0;font-size:15.5px;line-height:1.75;}

/* ── 1. Mở đầu ──────────────────────────────────────────────────────────────── */
.xm-dau{background:var(--cat);border-bottom:1px solid var(--vien-nau);padding:64px 0 60px;}
.xm-dau-luoi{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;
  align-items:start;}
.xm-dau h1{font-size:clamp(30px,4.3vw,46px);line-height:1.16;margin:16px 0 0;}
.xm-dan{margin:20px 0 0;font-size:16.5px;line-height:1.76;max-width:54ch;}
.xm-dau-nut{display:flex;align-items:center;gap:24px;margin:32px 0 0;flex-wrap:wrap;}
.xm-goi{display:flex;flex-direction:column;text-decoration:none;padding-left:22px;
  border-left:1px solid var(--vien-nau);}
.xm-goi span{font-size:12.5px;color:var(--nau-mo);}
.xm-goi strong{font-size:19px;color:var(--go);font-variant-numeric:tabular-nums;}
.xm-goi:hover strong{color:var(--nau-lk);}

/* Ảnh mở đầu — bằng chứng đi kèm lời khai. Đặt cạnh chữ chứ không làm nền, vì chi tiết trong ảnh
   (lớp gỗ rỗng bên trong khung cửa) chính là nội dung, chữ đè lên là mất. */
.xm-dau-anh{margin:0;}
.xm-dau-anh img{display:block;width:100%;height:auto;border-radius:var(--radius);
  border:1px solid var(--vien-nau);}
.xm-dau-anh figcaption{margin:12px 2px 0;font-size:13px;line-height:1.6;color:var(--nau-mo);}

/* ── 1b. Sáu dấu hiệu ───────────────────────────────────────────────────────── */
.xm-dauhieu{padding:66px 0;border-bottom:1px solid var(--vien-nau);}
.xm-dh-anh{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:0 0 40px;}
.xm-dh-anh figure{margin:0;}
.xm-dh-anh img{display:block;width:100%;height:auto;aspect-ratio:23/16;object-fit:cover;
  border-radius:var(--radius);background:var(--cat);}
.xm-dh-anh figcaption{margin:10px 2px 0;font-size:13px;line-height:1.55;color:var(--nau-mo);}

.xm-dh-duoi{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:44px;
  align-items:start;}
/* Đánh số vì sáu dấu hiệu này được nhắc lại theo số ở các bài viết khác của site. */
.xm-dh-ds{list-style:none;margin:0;padding:0;counter-reset:dh;
  border-top:1px solid var(--vien-nau);}
.xm-dh-ds li{counter-increment:dh;position:relative;padding:15px 0 15px 42px;
  border-bottom:1px solid var(--vien-nau);font-size:15px;line-height:1.62;color:var(--nau-chu);}
.xm-dh-ds li::before{content:counter(dh,decimal-leading-zero);position:absolute;left:0;top:16px;
  font-size:12.5px;font-weight:700;color:var(--hoang-dam);font-variant-numeric:tabular-nums;}
.xm-dh-ghi{background:var(--cat);border:1px solid var(--vien-nau);border-top:4px solid var(--hoang);
  border-radius:var(--radius);padding:24px 24px 26px;}
.xm-dh-ghi p{margin:0 0 12px;font-size:14.5px;line-height:1.7;}
.xm-dh-ghi p strong{color:var(--go);}
.xm-dh-ghi .xm-nut{margin-top:6px;}

/* ── 2. So sánh hai cách xử lý ──────────────────────────────────────────────── */
.xm-sosanh{background:var(--go);padding:66px 0;}
.xm-sosanh .xm-muc h2{color:#fff;}
.xm-sosanh .xm-muc p{color:#C7B7A6;}
/* Hai ảnh đặt ngay trên bảng so sánh: người đọc thấy được hai cách trông khác nhau thế nào
   trước khi đọc năm dòng chữ so sánh. */
.xm-ss-anh{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:0 0 30px;}
.xm-ss-anh figure{margin:0;}
.xm-ss-anh img{display:block;width:100%;height:auto;aspect-ratio:17/11;object-fit:cover;
  border-radius:var(--radius);border:1px solid var(--go-3);}
.xm-ss-anh figcaption{margin:11px 2px 0;font-size:13.5px;line-height:1.6;color:#C7B7A6;}
.xm-ss-anh figcaption b{color:var(--hoang);font-weight:600;}
.xm-cuon{overflow-x:auto;border:1px solid var(--go-3);border-radius:var(--radius);}
.xm-bang{width:100%;border-collapse:collapse;font-size:14.5px;min-width:680px;background:var(--go-2);}
.xm-bang thead th{text-align:left;padding:14px 18px;font-size:12.5px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--hoang);font-weight:600;border-bottom:1px solid var(--go-3);}
.xm-bang tbody th{text-align:left;padding:14px 18px;color:#E7DCCF;font-weight:600;white-space:nowrap;
  border-bottom:1px solid var(--go-3);vertical-align:top;width:170px;}
.xm-bang td{padding:14px 18px;color:#C7B7A6;line-height:1.66;border-bottom:1px solid var(--go-3);
  vertical-align:top;}
.xm-bang tbody tr:last-child th,.xm-bang tbody tr:last-child td{border-bottom:none;}
.xm-bang b{color:var(--hoang);}
.xm-sosanh-cuoi{margin:22px 0 0;color:#C7B7A6;font-size:15px;line-height:1.72;max-width:70ch;}
.xm-sosanh-cuoi a{color:var(--hoang);text-decoration:underline;text-underline-offset:2px;}

/* ── 3. Dịch vụ ─────────────────────────────────────────────────────────────── */
.xm-dichvu{padding:66px 0;}
.xm-dv-luoi{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.xm-dv{border:1px solid var(--vien-nau);border-radius:var(--radius);overflow:hidden;
  display:flex;flex-direction:column;transition:border-color .2s;}
.xm-dv:hover{border-color:var(--hoang);}
.xm-dv-anh{display:block;}
.xm-dv-anh img{display:block;width:100%;height:auto;aspect-ratio:52/35;object-fit:cover;
  background:var(--cat);transition:transform .3s;}
.xm-dv:hover .xm-dv-anh img{transform:scale(1.03);}
.xm-dv-chu{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1;}
.xm-dv-so{font-size:13px;font-weight:700;color:var(--hoang-dam);letter-spacing:.08em;
  font-variant-numeric:tabular-nums;}
.xm-dv h3{font-size:17px;line-height:1.42;margin:12px 0 0;}
.xm-dv h3 a{color:var(--go);text-decoration:none;}
.xm-dv h3 a:hover{color:var(--nau-lk);}
.xm-dv p{margin:10px 0 0;font-size:14px;line-height:1.68;}
.xm-doc{margin-top:auto;padding-top:16px;font-size:13.5px;font-weight:600;color:var(--nau-lk);
  text-decoration:none;}
.xm-doc:hover{color:var(--go);}

/* ── 4. Kiến thức — khối lớn nhất trang ─────────────────────────────────────── */
.xm-kien-thuc{background:var(--cat);padding:66px 0;}
.xm-bai{list-style:none;margin:0;padding:0;counter-reset:xm;
  display:grid;grid-template-columns:1fr 1fr;gap:0 40px;
  border-top:1px solid var(--vien-nau);}
.xm-bai li{counter-increment:xm;position:relative;padding:16px 0 16px 40px;
  border-bottom:1px solid var(--vien-nau);}
.xm-bai li::before{content:counter(xm,decimal-leading-zero);position:absolute;left:0;top:18px;
  font-size:12.5px;font-weight:700;color:var(--hoang-dam);font-variant-numeric:tabular-nums;}
.xm-bai a{display:block;font-size:16px;font-weight:600;color:var(--go);text-decoration:none;
  line-height:1.44;}
.xm-bai a:hover{color:var(--nau-lk);}
.xm-bai span{display:block;margin-top:5px;font-size:13.5px;color:var(--nau-mo);line-height:1.62;}
.xm-them{margin:26px 0 0;}
.xm-them a{color:var(--nau-lk);font-weight:600;text-decoration:none;}
.xm-them a:hover{text-decoration:underline;}

/* ── 5. Câu hỏi thường gặp ──────────────────────────────────────────────────── */
.xm-faq{padding:66px 0;}
.xm-faq-ds{display:grid;gap:10px;max-width:80ch;}
.xm-faq details{border:1px solid var(--vien-nau);border-radius:var(--radius);overflow:hidden;}
.xm-faq summary{cursor:pointer;list-style:none;padding:16px 44px 16px 18px;font-weight:600;
  font-size:15.5px;color:var(--go);position:relative;}
.xm-faq summary::-webkit-details-marker{display:none;}
.xm-faq summary::after{content:"+";position:absolute;right:18px;top:14px;font-size:19px;
  color:var(--hoang-dam);line-height:1;}
.xm-faq details[open] summary{background:var(--hoang-nhat);}
.xm-faq details[open] summary::after{content:"−";}
.xm-faq details > div{padding:14px 18px 18px;font-size:14.5px;line-height:1.76;color:var(--nau-mo);}
.xm-faq details > div p{margin:0 0 10px;}
.xm-faq details > div :last-child{margin-bottom:0;}

/* ── 6. Dải liên hệ ─────────────────────────────────────────────────────────── */
.xm-cuoi{background:var(--go);padding:56px 0;}
.xm-cuoi-trong{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:center;}
.xm-cuoi h2{color:#fff;font-size:24px;margin:0 0 10px;}
.xm-cuoi p{color:#C7B7A6;margin:0;font-size:15.5px;line-height:1.72;max-width:62ch;}
.xm-cuoi-nut{display:flex;gap:12px;flex-wrap:wrap;}
.xm-cuoi-nut .xm-nut{font-variant-numeric:tabular-nums;white-space:nowrap;}

/* ── Màn hẹp ────────────────────────────────────────────────────────────────── */
@media (max-width:980px){
  .xm-dau-luoi,.xm-cuoi-trong{grid-template-columns:1fr;gap:34px;}
  .xm-dv-luoi{grid-template-columns:1fr;}
  .xm-bai{grid-template-columns:1fr;gap:0;}
  .xm-dh-duoi{grid-template-columns:1fr;gap:30px;}
}
@media (max-width:600px){
  .xm-wrap{padding:0 18px;}
  .xm-dau{padding:44px 0 40px;}
  .xm-sosanh,.xm-dichvu,.xm-kien-thuc,.xm-faq,.xm-dauhieu{padding:48px 0;}
  .xm-dh-anh,.xm-ss-anh{grid-template-columns:1fr;gap:20px;}
}

/* ── Bốn khối bổ sung của trang chủ xulymoi.vn ───────────────────────────────
   Quy trình, đối tượng phục vụ, địa bàn và phiếu yêu cầu khảo sát — bốn thứ
   khách hỏi trước khi quyết định gọi mà bản đầu còn thiếu. */

/* Quy trình bốn bước. Đánh số vì đây ĐÚNG là một trình tự bắt buộc theo thứ tự,
   không phải số gắn cho đẹp — đảo bước là mất tác dụng. */
.xm-quy-trinh{padding:66px 0;background:var(--cat);}
.xm-buoc{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.xm-buoc li{background:var(--trang);border:1px solid var(--vien-nau);border-radius:var(--radius);
  overflow:hidden;padding:0 22px 26px;}
/* Số bước đè lên góc ảnh: giữ được thứ tự đọc mà không tốn thêm một dòng chiều cao. */
.xm-buoc-anh{position:relative;margin:0 -22px 18px;}
.xm-buoc-anh img{display:block;width:100%;height:auto;aspect-ratio:7/5;object-fit:cover;
  background:var(--cat);}
.xm-buoc-anh span{position:absolute;left:14px;bottom:-19px;
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;background:var(--go);color:var(--hoang);
  font-weight:700;font-size:13.5px;font-variant-numeric:tabular-nums;
  box-shadow:0 0 0 4px var(--trang);}
.xm-buoc h3{font-size:16.5px;margin:28px 0 8px;line-height:1.36;}
.xm-buoc p{margin:0;font-size:14px;line-height:1.68;}

/* Đối tượng phục vụ — bốn nhóm công trình, mỗi nhóm một bài toán khác nhau. */
.xm-doi-tuong{padding:66px 0;}
.xm-dt-luoi{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--vien-nau);
  border:1px solid var(--vien-nau);border-radius:var(--radius);overflow:hidden;}
.xm-dt-luoi article{background:var(--trang);padding:0 26px 28px;}
.xm-dt-anh{margin:0 -26px 22px;}
.xm-dt-anh img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;
  background:var(--cat);}
.xm-dt-luoi h3{font-size:17px;margin:0 0 10px;position:relative;padding-left:16px;}
.xm-dt-luoi h3::before{content:"";position:absolute;left:0;top:.2em;bottom:.2em;width:3px;
  border-radius:2px;background:var(--hoang);}
.xm-dt-luoi p{margin:0;font-size:14.5px;line-height:1.72;}

/* Địa bàn + phiếu khảo sát. Đặt cạnh nhau vì hai câu hỏi này đi liền: "các anh có
   tới chỗ tôi không" rồi mới tới "vậy đặt lịch thế nào". */
.xm-khao-sat{padding:66px 0;background:var(--cat);border-top:1px solid var(--vien-nau);}
.xm-ks-luoi{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;
  align-items:start;}
.xm-ks-trai h2{font-size:clamp(24px,3.1vw,32px);margin:12px 0 22px;line-height:1.22;}
.xm-dia-ban{margin:0;padding:0;border-top:1px solid var(--vien-nau);}
.xm-dia-ban > div{display:grid;grid-template-columns:minmax(112px,140px) 1fr;gap:16px;
  padding:13px 0;border-bottom:1px solid var(--vien-nau);}
.xm-dia-ban dt{margin:0;font-size:13.5px;font-weight:600;color:var(--go);}
.xm-dia-ban dd{margin:0;font-size:14px;line-height:1.62;color:var(--nau-mo);}
.xm-ks-ghi{margin:18px 0 0;font-size:13.5px;line-height:1.65;}

.xm-ks-phieu{background:var(--trang);border:1px solid var(--vien-nau);
  border-top:4px solid var(--hoang);border-radius:var(--radius);padding:26px 24px 24px;}
.xm-ks-phieu h2{font-size:20px;margin:0;}
.xm-ks-phieu > p{margin:8px 0 18px;font-size:14px;}
.xm-ks-phieu form{display:grid;gap:13px;}
.xm-ks-phieu label{display:grid;gap:5px;}
.xm-ks-phieu label span{font-size:13px;font-weight:600;color:var(--go-3);}
.xm-ks-phieu input{font:inherit;font-size:15px;padding:9px 11px;border:1px solid var(--vien-nau);
  background:var(--cat);color:var(--nau-chu);border-radius:var(--radius);width:100%;}
.xm-ks-phieu input:focus-visible{outline:2px solid var(--hoang);outline-offset:1px;
  border-color:var(--hoang);background:var(--trang);}
.xm-ks-phieu button{margin-top:4px;font:inherit;font-weight:700;font-size:16px;padding:12px 16px;
  border:none;border-radius:var(--radius);background:var(--hoang);color:var(--go);cursor:pointer;}
.xm-ks-phieu button:hover{background:var(--hoang-dam);}

@media (max-width:980px){
  .xm-buoc{grid-template-columns:repeat(2,1fr);}
  .xm-ks-luoi{grid-template-columns:1fr;gap:34px;}
}
@media (max-width:600px){
  .xm-buoc,.xm-dt-luoi{grid-template-columns:1fr;}
  .xm-quy-trinh,.xm-doi-tuong,.xm-khao-sat{padding:48px 0;}
  .xm-dia-ban > div{grid-template-columns:1fr;gap:3px;}
}

/* Dòng khai quan hệ với site chính, đặt ngay trên dải bản quyền ở chân trang.
   Chữ nhạt hơn nội dung chính vì đây là thông tin phụ, nhưng vẫn phải đủ tương phản để đọc
   được trên nền nâu đậm — dùng --cat pha mờ chứ không dùng xám tiêu chuẩn. */
.footer-site-me{margin:28px 0 0;padding-top:20px;border-top:1px solid rgba(255,255,255,.10);
  font-size:13.5px;line-height:1.7;color:rgba(246,241,232,.72);max-width:78ch;}
.footer-site-me b{color:rgba(246,241,232,.92);font-weight:600;}
.footer-site-me a{color:var(--hoang);text-decoration:underline;text-underline-offset:2px;}
.footer-site-me a:hover{color:#fff;}