/* Gnurt LED — shared reset & utilities (all variants) */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }
img, svg, video, canvas { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
h1, h2, h3, h4, p, ul, ol, figure, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
main > section, .site-header, .site-footer { position: relative; isolation: isolate; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
  position: fixed; left: 16px; top: -60px; z-index: 1000; padding: 12px 18px;
  background: #fff; color: #000; border-radius: 8px; font-weight: 600;
}
.skip-link:focus { top: 16px; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

/* Scroll reveal (only when JS is running) */
.js [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .js [data-reveal] { opacity: 1; transform: none; transition: none; }
}

/* backdrop-filter makes the header the containing block of the fixed
   mobile menu (menu collapses to header height) — drop it while open. */
body .site-header.nav-open,
body .site-header.nav-open .header-inner { -webkit-backdrop-filter: none; backdrop-filter: none; }
body:has(.site-header.nav-open) .mobile-cta { display: none; }

/* Touch targets ≥ 44px on tablet/mobile */
@media (max-width: 1024px) {
  body .btn-sm { min-height: 44px; }
  body .logo { min-height: 44px; }
  body .hotline { min-width: 44px; min-height: 44px; justify-content: center; }
  body .hotline-icon { width: 44px; height: 44px; }
  body .theme-toggle { width: 44px; height: 44px; }
  body .crumbs a { display: inline-block; padding-block: 11px; margin-block: -11px; }
  body .footer-bottom a { padding-block: 12px; }
  body .prod-title a { display: block; min-height: 44px; padding-block: 12px; margin-block: -12px; }
  body .footer-col ul { gap: 0; }
  body .footer-col ul a, body .footer-bottom a { display: inline-block; padding-block: 11px; }
  body .footer-offices li + li { margin-top: 12px; }
}

/* Pause / play toggle for hero video & slider */
.media-toggle .icon-play, .media-toggle[aria-pressed="true"] .icon-pause { display: none; }
.media-toggle[aria-pressed="true"] .icon-play { display: block; }

/* Image placeholders (thay bằng ảnh thật) */
.partner img { width: min(160px, 80%); height: auto; }
.testi-avatar { object-fit: cover; }

/* Form feedback */
.field-error { display: block; min-height: 1.2em; margin-top: 6px; font-size: .8125rem; color: #ff6b6b; }
.form-status { margin-top: 14px; font-size: .9375rem; }
.form-status[data-state="ok"] { color: #2fd66b; }
.form-status[data-state="err"] { color: #ff6b6b; }
