:root {
  --navy: #0f172a;
  --slate: #334155;
  --muted: #64748b;
  --line: #dbe4ee;
  --surface: #f8fafc;
  --blue: #0369a1;
  --blue-dark: #075985;
  --ink: #020617;
}

html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

a, button, input, select, textarea { transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgba(3, 105, 161, .3);
  outline-offset: 3px;
}

.container-shell { width: min(1160px, calc(100% - 2rem)); margin: 0 auto; }
.eyebrow { letter-spacing: .13em; text-transform: uppercase; font-size: .72rem; font-weight: 700; color: var(--blue); }
.section-label { border-left: 3px solid var(--blue); padding-left: .75rem; }
.prose-copy { color: var(--slate); line-height: 1.8; }
.surface-grid { background-image: linear-gradient(to right, rgba(148,163,184,.11) 1px, transparent 1px), linear-gradient(to bottom, rgba(148,163,184,.11) 1px, transparent 1px); background-size: 32px 32px; }
.hero-rule { height: 1px; background: linear-gradient(to right, var(--blue), transparent); }
.media-frame { overflow: hidden; background: #e2e8f0; }
/*object-fit: cover;*/
.media-frame img { width: 100%; height: 100%;  display: block; }

.media-frame img.contain { object-fit: contain; }
.product-card:hover, .info-card:hover { border-color: rgba(3,105,161,.55); box-shadow: 0 18px 38px rgba(15,23,42,.08); transform: translateY(-2px); }
.product-card, .info-card { transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.product-card.is-hidden { display: none; }
.nav-link[aria-current="page"] { color: var(--blue); }
.mobile-menu { display: none; }
.mobile-menu.is-open { display: block; }
.faq-answer { display: none; }
.faq-item.is-open .faq-answer { display: block; }
.faq-item.is-open .faq-chevron { transform: rotate(180deg); }
.faq-chevron { transition: transform .2s ease; }
.form-status:empty { display: none; }
.hongxia-inquiry-form .fluentform form { display: block; }
.hongxia-inquiry-form .fluentform form > fieldset { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.hongxia-inquiry-form .fluentform .ff-el-group { margin: 0; }
.hongxia-inquiry-form .fluentform .hongxia-form-full,
.hongxia-inquiry-form .fluentform .ff_submit_btn_wrapper,
.hongxia-inquiry-form .fluentform .ff-message-success,
.hongxia-inquiry-form .fluentform .ff-errors-in-stack { grid-column: 1 / -1; }
.hongxia-inquiry-form .fluentform .ff-el-input--label { margin-bottom: .5rem; }
.hongxia-inquiry-form .fluentform .ff-el-input--label label { color: var(--navy); font-size: .875rem; font-weight: 600; line-height: 1.5; }
.hongxia-inquiry-form .fluentform .ff-el-form-control { width: 100%; min-height: 3rem; border: 1px solid #cbd5e1; border-radius: .375rem; background: #fff; padding: .75rem 1rem; color: var(--navy); font: inherit; line-height: 1.5; box-shadow: none; }
.hongxia-inquiry-form .fluentform textarea.ff-el-form-control { min-height: 10.5rem; resize: vertical; }
.hongxia-inquiry-form .fluentform .ff-el-form-control:focus { border-color: var(--blue); outline: 3px solid rgba(3, 105, 161, .18); outline-offset: 1px; box-shadow: none; }
.hongxia-inquiry-form .fluentform .ff-el-is-error .ff-el-form-control { border-color: #dc2626; }
.hongxia-inquiry-form .fluentform .error { margin-top: .4rem; color: #b91c1c; font-size: .8125rem; line-height: 1.5; }
.hongxia-inquiry-form .fluentform .ff-btn-submit { min-height: 2.875rem; border: 1px solid var(--blue) !important; border-radius: .375rem !important; background: var(--blue) !important; padding: .75rem 1.25rem !important; color: #fff !important; font-size: .875rem !important; font-weight: 600 !important; line-height: 1.5 !important; opacity: 1 !important; box-shadow: none !important; }
.hongxia-inquiry-form .fluentform .ff-btn-submit:hover,
.hongxia-inquiry-form .fluentform .ff-btn-submit:focus { border-color: var(--blue-dark) !important; background: var(--blue-dark) !important; color: #fff !important; }
.hongxia-inquiry-form .fluentform .ff-message-success { margin: 0; border: 1px solid #86efac; border-radius: .375rem; background: #f0fdf4; padding: 1rem; color: #166534; box-shadow: none; }
.menu-item { list-style: none; }
.menu-item a { color: #475569; font-size: .875rem; font-weight: 500; }
.menu-item a:hover { color: var(--blue); }
.product-menu-item:hover .product-submenu, .product-menu-item:focus-within .product-submenu { display: block; }
.product-menu-item > a span { display: inline-block; width: .42rem; height: .42rem; margin-left: .18rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; font-size: 0; line-height: 0; transform: translateY(-2px) rotate(45deg); transition: transform .18s ease; }
.product-menu-item:hover > a span, .product-menu-item:focus-within > a span { transform: translateY(1px) rotate(225deg); }
.product-submenu { margin-top: 0; }
.product-lightbox { position: fixed; inset: 0; z-index: 80; display: none; align-items: center; justify-content: center; background: rgba(2,6,23,.82); padding: 1.25rem; }
.product-lightbox.is-open { display: flex; }
.product-lightbox-panel { position: relative; max-width: min(92vw, 880px); max-height: 90vh; }
.product-lightbox-panel img { display: block; max-height: 90vh; max-width: 92vw; object-fit: contain; }
.product-lightbox-close { position: absolute; right: -.75rem; top: -.75rem; z-index: 2; display: grid; height: 2.25rem; width: 2.25rem; place-items: center; border-radius: 999px; background: white; color: var(--navy); font-size: 1.5rem; line-height: 1; }
.product-main-frame { min-height: 320px; }
main h1 { line-height: 1.5 !important; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.col-span-full .navigation.pagination { display: flex; justify-content: center; width: 100%; }
.col-span-full .navigation.pagination .nav-links { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .75rem; padding: .75rem 0 1rem; }
.col-span-full .navigation.pagination .page-numbers { display: inline-flex; min-width: 2.75rem; height: 2.75rem; align-items: center; justify-content: center; padding: 0 .5rem; border: 1px solid var(--line); border-radius: .375rem; background: #fff; color: var(--navy); font-size: .875rem; font-weight: 600; text-decoration: none; }
.col-span-full .navigation.pagination .page-numbers:hover, .col-span-full .navigation.pagination .page-numbers.current { border-color: var(--blue); background: var(--blue); color: #fff; }
.col-span-full .navigation.pagination .page-numbers.dots { border-color: transparent; background: transparent; color: var(--muted); }

@media (min-width: 768px) {
  .container-shell { width: min(1160px, calc(100% - 4rem)); }
}

@media (max-width: 767px) {
  .hongxia-inquiry-form .fluentform form > fieldset { grid-template-columns: 1fr; }
  .hongxia-inquiry-form .fluentform .hongxia-form-half { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}