/* Hongqiu Trade — theme tokens and shared effects (developer comments in English) */

:root {
  --color-primary: #0054d3;
  --color-primary-hover: #0044b0;
  --color-primary-alt: #2d54b3;
  --color-primary-alt-hover: #244491;
  --color-text: #171a1f;
  --color-text-muted: #565d6d;
  --color-text-muted-about: #585e65;
  --color-border: #dee1e6;
  --color-border-about: #dee0e3;
  --glass-bg: rgba(255, 255, 255, 0.8);
  --glass-blur: 8px;
  --hero-overlay: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.6) 100%);
  --mask-overlay-about: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4));
  --neon-cyan: #22d3ee;
  --section-bg-soft: #fafafb;
  --cta-tint: #f0f6ff;
}

html {
  scroll-behavior: smooth;
  /* Offset in-page anchors for fixed header (73px) */
  scroll-padding-top: 73px;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: #fff;
}

/* Bootstrap Reboot underlines all links; reset so nav/footer stay clean. Tailwind `hover:underline` still wins (higher specificity). */
a,
a:hover,
a:focus,
a:active,
a:visited {
  text-decoration: none;
}

/* Mobile nav: clicks on the icon should hit the button (custom element can steal events on some browsers) */
[data-mobile-nav-toggle] iconify-icon {
  pointer-events: none;
}

/* Scroll reveal baseline (enhanced by scroll-reveal.js) */
.scroll-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.65s ease, transform 0.65s ease;
}

.scroll-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Primary CTA — energy core glow */
@keyframes pulse-glow {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(34, 211, 238, 0.35), 0 4px 14px rgba(0, 84, 211, 0.35);
  }
  50% {
    box-shadow: 0 0 0 12px rgba(34, 211, 238, 0), 0 8px 28px rgba(0, 84, 211, 0.45);
  }
}

.btn-cta-primary.btn-cta-glow {
  position: relative;
  transition: transform 0.2s ease, box-shadow 0.25s ease, background-color 0.2s ease;
}

.btn-cta-primary.btn-cta-glow:hover {
  animation: pulse-glow 1.6s ease-in-out infinite;
  transform: translateY(-1px);
}

/* Image wrappers: layout lives on parent; img stays src/alt/loading only */
.hq-img-fill img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hq-img-natural img {
  display: block;
  width: 100%;
  height: auto;
}

.hq-img-partner img {
  display: block;
  height: 100px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
}

/* Contact hero: full-bleed background image + readable foreground */
.contact-hero {
  isolation: isolate;
}

.contact-hero h1.contact-hero-title {
  color: #f8fafc;
}

.contact-hero p.contact-hero-lead {
  color: rgba(248, 250, 252, 0.9);
}


header nav > a {
  white-space: nowrap;
}