/* ===== v5: Polished white content, dark hero; red/black brand ===== */
:root{
  --brand:#d41f1f; --brand2:#ff4d4d;
  --ink:#0e0f12; --muted:#6b7280; --bg:#ffffff; --soft:#f7fafc;
  --r:16px; --max:1160px; --t:.24s ease;
  --s1:6px; --s2:10px; --s3:14px; --s4:18px; --s5:24px; --s6:32px;
  --shadow-sm:0 6px 16px rgba(0,0,0,.06);
  --shadow-md:0 12px 28px rgba(0,0,0,.10);
  --shadow-lg:0 20px 46px rgba(0,0,0,.14);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:#1f2937;line-height:1.65}
img{max-width:100%;display:block}
.wrap{width:92%;max-width:var(--max);margin:auto}
.section{padding:72px 0}
.title{font-size:clamp(24px,3.2vw,38px);text-align:center;margin-bottom:.35rem;letter-spacing:.2px}
.sub{text-align:center;color:var(--muted);margin:8px auto 20px}

/* Header light */
.header{position:sticky;top:0;z-index:99;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);transition:var(--t);border-bottom:1px solid #eef2f7}
.header.scrolled{box-shadow:var(--shadow-md)}
.header__row{display:flex;justify-content:space-between;align-items:center;padding:.6rem 0}
.brand{display:flex;align-items:center;gap:.6rem;color:#111;text-decoration:none;font-weight:800}
.brand img{height:44px}
.brand--dark span{color:#111}
.nav ul{display:flex;gap:.35rem;list-style:none;align-items:center}
.nav a{display:block;padding:.5rem .85rem;border-radius:12px;color:#111;text-decoration:none;transition:var(--t)}
.nav a:hover{background:#f3f4f6}
.btn{display:inline-block;padding:.8rem 1.1rem;border-radius:999px;text-decoration:none;font-weight:800;transition:var(--t)}
.btn--sm{padding:.55rem .9rem}
.btn--primary{background:linear-gradient(90deg,var(--brand),var(--brand2));color:#fff;box-shadow:0 16px 34px rgba(212,31,31,.25)}
.btn--outline{border:2px solid #111;color:#111}
.btn--outline-light{border:2px solid #fff;color:#fff}
.btn--outline:hover{background:#111;color:#fff}
.burger{display:none;flex-direction:column;gap:5px;border:0;background:transparent;cursor:pointer}
.burger span{width:28px;height:2px;background:#111}
@media(max-width:980px){
  .burger{display:flex}
  .nav ul{position:absolute;left:0;right:0;top:64px;background:#fff;border:1px solid #e5e7eb;border-radius:16px;box-shadow:var(--shadow-md);padding:10px;display:none;flex-direction:column}
  .nav ul.open{display:flex}
}

/* Mobile call bar */
.callbar{position:fixed;inset:auto 0 0 0;background:linear-gradient(90deg,var(--brand),var(--brand2));color:#fff;text-align:center;padding:.7rem 1rem;font-weight:800;z-index:90;display:none}
@media(max-width:720px){.callbar{display:block}}

/* HERO video dark + angled shape */
.hero{position:relative;min-height:80vh;display:grid;place-items:center;text-align:center;overflow:hidden;color:#fff}
.hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(1.05)}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(130deg,rgba(0,0,0,.62),rgba(0,0,0,.42));z-index:1}
.hero__shape{position:absolute;bottom:-14vw;left:-8vw;width:70vw;height:70vw;border-radius:50%;background:radial-gradient(closest-side,rgba(255,77,77,.18),transparent 60%);z-index:1;pointer-events:none}
.hero__inner{position:relative;z-index:2;max-width:820px;padding:0 var(--s2)}
.eyebrow{display:inline-block;background:rgba(255,255,255,.12);padding:.3rem .6rem;border-radius:999px;margin-bottom:6px;font-weight:800;letter-spacing:.3px}
.hero h1{font-size:clamp(30px,4.2vw,54px);line-height:1.12;margin-bottom:6px}
.hero h1 span{color:#ffdede}
.hero p{color:#f1f5f9;margin:10px auto 16px}
.hero__actions{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
.trust--hero{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:10px}
.trust--hero li{list-style:none;background:rgba(255,255,255,.12);padding:.35rem .6rem;border-radius:999px}

/* Quickbar (desktop) */
.quickbar{position:sticky;top:64px;background:#fff;border-bottom:1px solid #eef2f7;z-index:98;display:none}
.quickbar__row{display:flex;gap:.6rem;justify-content:flex-end;align-items:center;padding:.5rem 0}
.qbtn{display:inline-block;border-radius:999px;padding:.55rem .9rem;text-decoration:none;font-weight:800}
.qbtn--call{background:linear-gradient(90deg,var(--brand),var(--brand2));color:#fff;box-shadow:var(--shadow-sm)}
.qbtn--zalo{border:2px solid #0a7cff;color:#0a7cff}
@media(min-width:981px){.quickbar{display:block}}

/* Badges white */
.badges--white{background:#fff;border-top:1px solid #eef2f7;border-bottom:1px solid #eef2f7}
.badges__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;padding:18px 0}
.badge{background:#fff;border:1px solid #eef2f7;border-radius:14px;padding:14px;text-align:center;box-shadow:var(--shadow-sm)}
.badge strong{display:block;font-size:22px;color:var(--brand)}

/* Cards light */
.card{border-radius:16px;overflow:hidden;transition:transform .22s ease, box-shadow .22s ease}
.card--light{background:#fff;border:1px solid #eef2f7;box-shadow:var(--shadow-sm)}
.card--light:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.card img{width:100%;aspect-ratio:16/10;object-fit:cover}
.card__body{padding:1rem 1.1rem}
.card__body h3{color:#111;margin-bottom:.35rem}
.excerpt{color:#4b5563;margin-bottom:.4rem}
.link--brand{color:var(--brand);text-decoration:none;font-weight:800}
.link--brand:hover{color:#a80d0d}

/* Why */
.why__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.why__cell{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid #eef2f7;border-radius:16px;padding:14px;box-shadow:var(--shadow-sm)}
.why__ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:#fff1f1;border:1px solid #ffe1e1;color:#a80d0d;font-size:20px}

/* Pricing light */
.price{align-items:stretch}
.pitem{position:relative;border-radius:18px;padding:18px}
.pitem--light{background:#fff;border:1px solid #eef2f7;box-shadow:var(--shadow-sm)}
.ul{margin:6px 0 12px 18px;color:#374151}
.pitem--hot{border:2px solid var(--brand)}
.pitem--hot .tag{position:absolute;top:-10px;right:14px;background:var(--brand);color:#fff;padding:.25rem .5rem;border-radius:999px;font-size:.85rem}
.btn--ghost-dark{border:2px solid #111;color:#111}
.btn--ghost-dark:hover{background:#111;color:#fff}

/* Coverage light */
.taglist--light{background:#fff;border:1px solid #eef2f7;border-radius:16px;padding:14px;display:flex;flex-wrap:wrap;gap:10px;box-shadow:var(--shadow-sm)}
.taglist--light li{list-style:none;background:#f3f4f6;border:1px solid #eef2f7;border-radius:999px;padding:.35rem .7rem}
.mapbox--light{background:#fff;border:1px solid #eef2f7;border-radius:16px;box-shadow:var(--shadow-sm);padding:8px}
.checks--light{background:#fff;border:1px solid #eef2f7;border-radius:16px;box-shadow:var(--shadow-sm);padding:16px}
.checks--light ol{margin-left:16px}

/* Posts compact with line clamp */
.postsGrid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px}
.post{background:#fff;border:1px solid #eef2f7;border-radius:14px;overflow:hidden;box-shadow:var(--shadow-sm)}
.post--compact img{width:100%;aspect-ratio:16/10;object-fit:cover}
.post--compact .p{padding:12px}
.post--compact h3{font-size:1rem;line-height:1.35;margin-bottom:6px}
.post--compact h3 a{color:#111;text-decoration:none}
.post--compact p{font-size:.95rem;color:#4b5563}
.clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 8px}
.chips span{background:#f3f4f6;border:1px solid #eef2f7;border-radius:999px;padding:.2rem .55rem;color:#4b5563;font-size:.85rem}

/* Form light */
.form--light{background:#fff;border:1px solid #eef2f7;border-radius:18px;padding:18px;box-shadow:var(--shadow-sm)}
.fld{position:relative;margin-bottom:14px}
.fld input,.fld textarea{width:100%;padding:16px 14px 12px;border:1px solid #e5e7eb;border-radius:12px;background:#fff;color:#111}
.fld label{position:absolute;left:12px;top:12px;font-size:14px;color:#9ca3af;background:#fff;padding:0 6px;transition:var(--t)}
.fld input:focus + label,.fld textarea:focus + label,
.fld input:not(:placeholder-shown) + label,.fld textarea:not(:placeholder-shown) + label{top:-10px;color:#6b7280}
.actions{display:flex;gap:.6rem;flex-wrap:wrap}
.note{color:#6b7280;margin-top:6px}
.contactbox--light{background:#fff;border:1px solid #eef2f7;border-radius:18px;padding:18px;box-shadow:var(--shadow-sm)}

/* Footer light */
.footer--light{background:#fff;color:#6b7280;border-top:1px solid #eef2f7}
.foot--light{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;padding:34px 0}
.footer--light h4{color:#111}
.footer--light a{color:#111;text-decoration:none}

/* Grid helpers */
.grid{display:grid;gap:16px}
.g-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

/* Floating action buttons */
.float{position:fixed;right:16px;bottom:16px;display:flex;flex-direction:column;gap:.5rem;z-index:95}
.fab{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;border:0;cursor:pointer;text-decoration:none;box-shadow:var(--shadow-md);font-size:24px}
.fab--call{background:linear-gradient(180deg,var(--brand),var(--brand2));color:#fff}
.fab--zalo{background:#0a7cff;color:#fff}
@media(max-width:720px){.float{bottom:80px}} /* tránh đè lên callbar mobile */

/* Section divider */
.section--divider{position:relative}
.section--divider:before{content:'';position:absolute;left:50%;transform:translateX(-50%);top:-1px;width:min(92%,var(--max));height:1px;background:linear-gradient(90deg,transparent,#f0f2f7,transparent)}


/* ===== v6 polish ===== */
/* Reduce over-rounded look, unify radii & shadows */
:root{ --r:14px; }
.card--light,.pitem--light,.taglist--light,.mapbox--light,.checks--light,.contactbox--light,.why__cell,.post{ border-radius: var(--r); box-shadow: 0 10px 24px rgba(0,0,0,.08); }
.mapbox--light iframe{ border-radius: calc(var(--r) - 6px); }

/* Chips smaller & cleaner */
.chips span{ background:#fff; border:1px solid #e6e9ef; color:#3b4150; padding:.18rem .5rem; border-radius:10px; }
.taglist--light{ gap:8px; }
.taglist--light li{ background:#fff; border:1px solid #e6e9ef; color:#3b4150; padding:.32rem .6rem; border-radius:12px; }

/* Reviews block */
.reviewsGrid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:16px; }
.tcard{ background:#fff; border:1px solid #eef2f7; border-radius:var(--r); padding:16px; box-shadow:0 8px 20px rgba(0,0,0,.06); }
.tstars{ color:#ffb200; font-size:18px; letter-spacing:2px; margin-bottom:6px; }
.tcard blockquote{ color:#374151; font-style:normal; }
.tcard figcaption{ margin-top:8px; color:#6b7280; }

/* Section spacing tighten for mobile */
@media(max-width:768px){
  .section{ padding:56px 0; }
  .postsGrid{ gap:12px; }
}

/* FAB size refine */
.fab{ width:52px; height:52px; font-size:22px; }