/* =============================================================
   HCN ATTACHMENTS – GLOBAL STYLESHEET
   Industrial B2B design system
   Inspired by Caterpillar / Komatsu / Atlas Copco visual language
   ============================================================= */

/* ---- CUSTOM PROPERTIES ---------------------------------------- */
:root {
  /* Brand palette */
  --hcn-navy:       #0B2545;   /* Primary – deep industrial blue     */
  --hcn-navy-light: #143662;   /* Lighter navy for hover states      */
  --hcn-navy-dark:  #071832;   /* Dark navy for header/footer        */
  --hcn-gold:       #D4A017;   /* Accent – industrial amber gold     */
  --hcn-gold-dark:  #b88a12;   /* Darker gold                        */
  --hcn-red:        #C0392B;   /* CTA – industrial safety red        */
  --hcn-red-dark:   #a93226;   /* Darker red                         */
  --hcn-whatsapp:   #25D366;   /* WhatsApp brand color               */

  /* Neutrals */
  --hcn-dark:       #111827;   /* Near-black body text               */
  --hcn-gray-700:   #374151;   /* Secondary text                     */
  --hcn-gray-500:   #6B7280;   /* Tertiary / muted text              */
  --hcn-gray-300:   #D1D5DB;   /* Borders                            */
  --hcn-gray-100:   #F3F4F6;   /* Section backgrounds                */
  --hcn-gray-50:    #F9FAFB;   /* Off-white backgrounds              */
  --hcn-white:      #FFFFFF;

  /* Typography */
  --font-heading:   'Barlow Condensed', 'Arial Narrow', Arial, sans-serif;
  --font-body:      'Inter', 'Helvetica Neue', Helvetica, Arial, sans-serif;

  /* Spacing scale */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;

  /* Layout */
  --hcn-container: 1280px;
  --hcn-radius:    4px;
  --hcn-radius-lg: 8px;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.08);
  --shadow-md:  0 4px 12px rgba(0,0,0,.15);
  --shadow-lg:  0 8px 32px rgba(0,0,0,.20);

  /* Transitions */
  --transition: all .22s ease;
}


/* ---- RESET & BASE -------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--hcn-dark);
  background: var(--hcn-white);
  -webkit-font-smoothing: antialiased;
}

img, video { max-width: 100%; height: auto; display: block; }

a { color: var(--hcn-navy); text-decoration: none; transition: var(--transition); }
a:hover { color: var(--hcn-gold); }

ul, ol { margin: 0; padding: 0; list-style: none; }

/* ---- TYPOGRAPHY ---------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.15;
  color: var(--hcn-navy-dark);
  margin: 0 0 .75rem;
  letter-spacing: -.01em;
}

h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 800; }
h2 { font-size: clamp(1.75rem, 3.5vw, 2.75rem); }
h3 { font-size: clamp(1.35rem, 2.5vw, 1.9rem); }
h4 { font-size: 1.3rem; font-weight: 600; }
h5 { font-size: 1.1rem; font-weight: 600; }

p { margin: 0 0 1.25rem; }
p:last-child { margin-bottom: 0; }

.hcn-lead {
  font-size: 1.2rem;
  line-height: 1.65;
  color: var(--hcn-gray-700);
}

/* Section heading pattern */
.hcn-section-label {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--hcn-gold);
  margin-bottom: .5rem;
}
.hcn-section-label--light { color: var(--hcn-gold); }

.hcn-section-title {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  font-weight: 800;
  color: var(--hcn-navy-dark);
}
.hcn-section-title--light { color: var(--hcn-white); }

.hcn-section-subtitle {
  font-size: 1.1rem;
  color: var(--hcn-gray-500);
  max-width: 640px;
  margin: 0 auto;
  line-height: 1.65;
}
.hcn-section-subtitle--light { color: rgba(255,255,255,.75); }

.hcn-section-header {
  margin-bottom: var(--space-lg);
}
.hcn-section-header--center {
  text-align: center;
}
.hcn-section-header--center .hcn-section-subtitle {
  margin-top: .75rem;
}


/* ---- LAYOUT -------------------------------------------------- */
.hcn-container {
  width: 100%;
  max-width: var(--hcn-container);
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.hcn-section {
  padding: var(--space-xl) 0;
}

.hcn-section--gray   { background: var(--hcn-gray-50); }
.hcn-section--dark   { background: var(--hcn-navy-dark); }
.hcn-section--navy   { background: var(--hcn-navy); }

.hcn-grid {
  display: grid;
  gap: var(--space-md);
}
.hcn-grid-2  { grid-template-columns: repeat(2, 1fr); }
.hcn-grid-3  { grid-template-columns: repeat(3, 1fr); }
.hcn-grid-4  { grid-template-columns: repeat(4, 1fr); }

.hcn-flex { display: flex; align-items: center; gap: var(--space-md); }
.hcn-flex-center { justify-content: center; }


/* ---- BUTTON SYSTEM ------------------------------------------- */
.hcn-btn {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .75rem 1.75rem;
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1;
  border: 2px solid transparent;
  border-radius: var(--hcn-radius);
  cursor: pointer;
  transition: var(--transition);
  text-decoration: none;
  white-space: nowrap;
}

/* Size variants */
.hcn-btn--sm  { padding: .5rem 1.25rem; font-size: .85rem; }
.hcn-btn--lg  { padding: 1rem 2.25rem; font-size: 1.1rem; }
.hcn-btn--xl  { padding: 1.1rem 2.75rem; font-size: 1.2rem; }

/* Color variants */
.hcn-btn--navy {
  background: var(--hcn-navy);
  color: var(--hcn-white);
  border-color: var(--hcn-navy);
}
.hcn-btn--navy:hover {
  background: var(--hcn-navy-light);
  border-color: var(--hcn-navy-light);
  color: var(--hcn-white);
}

.hcn-btn--gold {
  background: var(--hcn-gold);
  color: var(--hcn-navy-dark);
  border-color: var(--hcn-gold);
}
.hcn-btn--gold:hover {
  background: var(--hcn-gold-dark);
  border-color: var(--hcn-gold-dark);
  color: var(--hcn-navy-dark);
}

.hcn-btn--red {
  background: var(--hcn-red);
  color: var(--hcn-white);
  border-color: var(--hcn-red);
}
.hcn-btn--red:hover {
  background: var(--hcn-red-dark);
  border-color: var(--hcn-red-dark);
  color: var(--hcn-white);
}

.hcn-btn--outline-white {
  background: transparent;
  color: var(--hcn-white);
  border-color: var(--hcn-white);
}
.hcn-btn--outline-white:hover {
  background: var(--hcn-white);
  color: var(--hcn-navy-dark);
}

.hcn-btn--outline-navy {
  background: transparent;
  color: var(--hcn-navy);
  border-color: var(--hcn-navy);
}
.hcn-btn--outline-navy:hover {
  background: var(--hcn-navy);
  color: var(--hcn-white);
}

.hcn-btn--whatsapp {
  background: var(--hcn-whatsapp);
  color: var(--hcn-white);
  border-color: var(--hcn-whatsapp);
}
.hcn-btn--whatsapp:hover {
  background: #1ea952;
  color: var(--hcn-white);
}


/* ---- TOP BAR ------------------------------------------------- */
.hcn-topbar {
  background: var(--hcn-navy-dark);
  color: rgba(255,255,255,.8);
  font-size: .8rem;
  padding: .45rem 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.hcn-topbar__inner {
  max-width: var(--hcn-container);
  margin: 0 auto;
  padding: 0 var(--space-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-md);
}

.hcn-topbar__left,
.hcn-topbar__right {
  display: flex;
  align-items: center;
  gap: var(--space-md);
}

.hcn-topbar__item {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  color: rgba(255,255,255,.75);
}
.hcn-topbar__item a {
  color: rgba(255,255,255,.75);
}
.hcn-topbar__item a:hover { color: var(--hcn-gold); }
.hcn-topbar__cert { color: var(--hcn-gold); font-weight: 600; }

.hcn-topbar__cta {
  background: var(--hcn-gold);
  color: var(--hcn-navy-dark) !important;
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: .78rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: .3rem .9rem;
  border-radius: var(--hcn-radius);
  transition: var(--transition);
}
.hcn-topbar__cta:hover {
  background: var(--hcn-gold-dark);
  color: var(--hcn-navy-dark) !important;
}
.hcn-topbar--hidden {
  display: none;
}


/* ---- HEADER (GeneratePress override) ------------------------- */
.hcn-sticky-header {
  position: sticky;
  top: 0;
  z-index: 300;
  width: 100%;
  background: var(--hcn-navy);
}

/* Ensure sticky header works inside GP layout wrappers */
#page {
  overflow: visible;
}

.hcn-sticky-header.hcn-header--scrolled {
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
}

.hcn-site-header,
.site-header {
  background: var(--hcn-navy) !important;
  border-bottom: 3px solid var(--hcn-gold);
  box-shadow: none;
  position: relative;
  top: auto;
  z-index: 1;
  transition: box-shadow 0.2s ease;
}

@media (min-width: 769px) {
  .hcn-sticky-header.hcn-header--scrolled .site-header {
    box-shadow: none;
  }

  .hcn-sticky-header.hcn-header--scrolled .hcn-topbar {
    display: block;
  }
}

.site-header .inside-header {
  max-width: var(--hcn-container);
  margin: 0 auto;
  padding: 0 var(--space-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  min-height: 72px;
  position: relative;
}

/* Logo / branding */
.site-header .site-branding,
.hcn-site-branding {
  padding: .75rem 0;
  flex-shrink: 0;
}
.site-header .site-logo img,
.hcn-brand-logo-img { height: 52px; width: auto; display: block; }
.hcn-brand-title--image { margin: 0; line-height: 1; }
.hcn-brand-logo-link { display: inline-block; line-height: 0; text-decoration: none; }

.site-header .site-title a,
.hcn-brand-title a {
  display: flex;
  align-items: baseline;
  gap: .35rem;
  text-decoration: none;
  font-family: var(--font-heading);
  line-height: 1;
}
.hcn-brand-logo {
  font-size: 2rem;
  font-weight: 800;
  color: var(--hcn-gold) !important;
  letter-spacing: .04em;
}
.hcn-brand-sub {
  font-size: 1rem;
  font-weight: 600;
  color: rgba(255,255,255,.75) !important;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.site-header .site-title a {
  font-size: 1.8rem;
  font-weight: 800;
  color: var(--hcn-white) !important;
}

/* Primary navigation – 全选择器覆盖 GP 动态颜色 */
#site-navigation.main-navigation,
.main-navigation {
  background: transparent !important;
}

.main-navigation .inside-navigation {
  background: transparent !important;
  padding: 0;
}

/* Desktop: horizontal nav */
@media (min-width: 769px) {
  .mobile-menu-control-wrapper {
    display: none !important;
  }

  #site-navigation .menu-toggle {
    display: none !important;
  }

  #site-navigation.main-navigation,
  .main-navigation {
    flex: 1;
    display: flex !important;
    justify-content: flex-end;
    margin-top: 0 !important;
    min-width: 0;
  }

  #site-navigation .inside-navigation,
  #site-navigation .main-nav {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    min-width: 0;
  }

  #site-navigation .main-nav > ul,
  #site-navigation ul.menu,
  #site-navigation ul.sf-menu {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    align-items: center;
    gap: .1rem;
  }

  #site-navigation .main-nav ul li a,
  #site-navigation ul.menu > li > a {
    padding: .45rem .6rem !important;
    font-size: .82rem !important;
    white-space: nowrap;
  }

  #site-navigation ul.menu > li,
  #site-navigation .main-nav > ul > li {
    display: inline-block !important;
    float: none !important;
    flex-shrink: 0;
  }
}

.main-navigation .main-nav ul li a,
.main-navigation a,
.main-navigation .menu-toggle,
.main-navigation .menu-bar-items a,
nav.main-navigation .menu li a {
  font-family: var(--font-heading);
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(255,255,255,.92) !important;
  padding: .5rem .85rem;
  transition: var(--transition);
  text-decoration: none;
}

.main-navigation .main-nav ul li a:hover,
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_item > a {
  color: var(--hcn-gold) !important;
  background: rgba(255,255,255,.06);
  border-radius: var(--hcn-radius);
}

/* Dropdown */
.main-navigation .menu-item-has-children {
  position: relative;
}
.main-navigation .sub-menu,
.main-navigation ul ul {
  background: var(--hcn-navy-dark) !important;
  border-top: 2px solid var(--hcn-gold);
  border-radius: 0 0 var(--hcn-radius) var(--hcn-radius);
  box-shadow: var(--shadow-lg);
  min-width: 280px;
}
@media (min-width: 769px) {
  .main-navigation .main-nav > ul > li.menu-item-has-children > ul.sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 120;
    padding: 0.35rem 0;
  }
  .main-navigation .main-nav > ul > li.menu-item-has-children:hover > ul.sub-menu,
  .main-navigation .main-nav > ul > li.menu-item-has-children:focus-within > ul.sub-menu {
    display: block;
  }
}
.main-navigation .sub-menu a,
.main-navigation ul ul li a {
  font-size: .88rem;
  padding: .55rem 1.1rem !important;
  border-bottom: 1px solid rgba(255,255,255,.06);
  color: rgba(255,255,255,.85) !important;
}
.main-navigation .sub-menu a:hover {
  background: rgba(255,255,255,.06);
  color: var(--hcn-gold) !important;
}

/* Mobile toggle */
.menu-toggle,
button.menu-toggle,
.mobile-menu-control-wrapper .menu-toggle {
  color: var(--hcn-white) !important;
  border: 1px solid rgba(255,255,255,.35) !important;
  background: rgba(255,255,255,.08) !important;
  border-radius: var(--hcn-radius);
  padding: .5rem 1rem !important;
}
.menu-toggle:hover,
button.menu-toggle:hover {
  color: var(--hcn-gold) !important;
  border-color: var(--hcn-gold) !important;
}

/* Mobile nav – single-row header (override GP flex-direction: column) */
@media (max-width: 768px) {
  .mobile-menu-control-wrapper {
    display: none !important;
  }

  .site-header .inside-header {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: .65rem;
    min-height: 52px;
    padding-top: .4rem !important;
    padding-bottom: .4rem !important;
    text-align: left !important;
    position: relative;
  }

  .site-header .inside-header > *:not(:last-child):not(.main-navigation) {
    margin-bottom: 0 !important;
  }

  .site-header .site-branding,
  .hcn-site-branding {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: calc(100% - 52px);
    padding: 0 !important;
    margin: 0 !important;
    text-align: left !important;
  }

  .site-header .site-logo,
  .site-header .site-logo img,
  .site-header .hcn-brand-logo-img,
  .site-header .custom-logo-link img,
  .site-header .header-image {
    max-height: 38px !important;
    width: auto !important;
    max-width: min(240px, calc(100vw - 72px));
    object-fit: contain;
    object-position: left center;
  }

  .site-header .hcn-brand-title {
    margin: 0;
    line-height: 1;
  }

  .site-header .hcn-brand-logo {
    font-size: 1.45rem;
  }

  .site-header .hcn-brand-sub {
    font-size: .72rem;
  }

  #site-navigation.main-navigation {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 0 0 auto !important;
    position: static;
    order: 2;
  }

  #site-navigation .inside-navigation {
    display: flex !important;
    justify-content: flex-end;
    align-items: center;
    padding: 0;
    width: auto;
  }

  #site-navigation .menu-toggle,
  #site-navigation button.menu-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex-grow: 0 !important;
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    border-radius: 10px;
    cursor: pointer;
  }

  #site-navigation .menu-toggle .mobile-menu {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  #site-navigation .menu-toggle .gp-icon svg {
    width: 22px;
    height: 22px;
  }

  .site-header {
    border-bottom-width: 2px;
  }

  /* Collapsed: hide menu panel */
  #site-navigation:not(.toggled) .main-nav {
    display: none !important;
  }

  /* Expanded: full-width panel below sticky header (not inside nav button box) */
  #site-navigation.toggled .inside-navigation {
    display: block !important;
    width: auto !important;
    position: static !important;
  }

  #site-navigation.toggled .main-nav {
    display: block !important;
    position: fixed !important;
    top: var(--hcn-mob-header-h, 56px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    max-height: calc(100vh - var(--hcn-mob-header-h, 56px)) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    z-index: 350 !important;
    background: var(--hcn-navy-dark);
    border-top: 2px solid var(--hcn-gold);
    box-shadow: var(--shadow-lg);
    padding: .35rem 0 .75rem;
    visibility: visible !important;
    opacity: 1 !important;
    flex-basis: auto !important;
    order: unset !important;
    margin: 0 !important;
    float: none !important;
  }

  body.hcn-nav-open .hcn-sticky-header {
    z-index: 360;
  }

  body.hcn-nav-open #site-navigation.toggled .menu-toggle {
    position: relative;
    z-index: 361;
  }

  body.hcn-nav-open::before {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(7, 26, 48, 0.55);
    z-index: 340;
    pointer-events: auto;
  }

  #site-navigation.toggled .main-nav > ul,
  #site-navigation.toggled ul.menu,
  #site-navigation.toggled ul.sf-menu,
  #site-navigation.main-navigation.toggled ul {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100%;
  }

  #site-navigation.toggled .main-nav > ul > li,
  #site-navigation.toggled ul.menu > li {
    display: block !important;
    width: 100%;
    text-align: left;
    float: none !important;
  }

  #site-navigation.toggled .main-nav ul li a,
  #site-navigation.toggled ul.menu > li > a {
    display: block;
    padding: .65rem 1.1rem !important;
    border-bottom: 1px solid rgba(255,255,255,.06);
  }

  #site-navigation.toggled .sub-menu,
  #site-navigation.toggled ul ul {
    display: none;
    position: static;
    width: 100%;
    min-width: 0;
    box-shadow: none;
    border-top: none;
    padding-left: .75rem;
    visibility: hidden;
    opacity: 0;
  }

  #site-navigation.toggled .menu-item-has-children.toggled-on > .sub-menu,
  #site-navigation.toggled .menu-item-has-children.sfHover > .sub-menu {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  body.hcn-nav-open {
    overflow: hidden;
  }
}


/* ---- FOOTER -------------------------------------------------- */
.hcn-footer-main {
  background: var(--hcn-navy-dark);
  color: rgba(255,255,255,.75);
  padding: var(--space-xl) 0 var(--space-lg);
  border-top: 3px solid var(--hcn-gold);
}

.hcn-footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1.5fr;
  gap: var(--space-lg);
}

.hcn-footer-logo__text {
  font-family: var(--font-heading);
  font-size: 2.2rem;
  font-weight: 800;
  color: var(--hcn-gold);
  letter-spacing: .05em;
  display: block;
  margin-bottom: .75rem;
}
.hcn-footer-logo img,
.hcn-footer-logo-img { height: 48px; width: auto; margin-bottom: .75rem; display: block; }

.hcn-footer-tagline {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--hcn-white);
  line-height: 1.3;
  margin-bottom: .85rem;
}

.hcn-footer-desc {
  font-size: .88rem;
  line-height: 1.7;
  color: rgba(255,255,255,.6);
  margin-bottom: 1.25rem;
}

.hcn-footer-heading {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--hcn-gold);
  margin-bottom: 1rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

.hcn-footer-links {
  list-style: none;
  margin: 0;
  padding: 0;
}
.hcn-footer-links li { margin-bottom: .5rem; }
.hcn-footer-links a {
  color: rgba(255,255,255,.75);
  font-size: .9rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  transition: var(--transition);
}
.hcn-footer-links a::before {
  content: '';
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--hcn-gold);
  opacity: .7;
  flex-shrink: 0;
  transition: var(--transition);
}
.hcn-footer-links a:hover {
  color: var(--hcn-gold);
  padding-left: .15rem;
}
.hcn-footer-links a:hover::before {
  opacity: 1;
  transform: scale(1.25);
}

.hcn-footer-address {
  font-style: normal;
  font-size: .88rem;
  line-height: 1.7;
  color: rgba(255,255,255,.65);
}
.hcn-footer-address strong { color: var(--hcn-white); }
.hcn-footer-address a { color: rgba(255,255,255,.65); }
.hcn-footer-address a:hover { color: var(--hcn-gold); }
.hcn-footer-address p { margin-bottom: .75rem; }

.hcn-footer-social {
  display: flex;
  gap: .6rem;
  margin-top: .75rem;
}
.hcn-footer-social__link {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.08);
  border-radius: var(--hcn-radius);
  color: rgba(255,255,255,.7);
  transition: var(--transition);
}
.hcn-footer-social__link:hover {
  background: var(--hcn-gold);
  color: var(--hcn-navy-dark);
}

/* GP copyright bar */
.site-info {
  background: var(--hcn-navy-dark) !important;
  border-top: 1px solid rgba(255,255,255,.08);
  color: rgba(255,255,255,.4) !important;
  font-size: .8rem;
  padding: .9rem 0;
}
.site-info a { color: rgba(255,255,255,.55) !important; }
.site-info a:hover { color: var(--hcn-gold) !important; }


/* ---- BREADCRUMBS --------------------------------------------- */
.hcn-breadcrumbs {
  background: var(--hcn-gray-100);
  padding: .75rem 0;
  font-size: .85rem;
  border-bottom: 1px solid var(--hcn-gray-300);
}

.hcn-breadcrumbs__inner {
  max-width: var(--hcn-container);
  margin: 0 auto;
  padding: 0 var(--space-md);
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
}

.hcn-breadcrumbs a { color: var(--hcn-navy); }
.hcn-breadcrumbs a:hover { color: var(--hcn-gold); }
.hcn-breadcrumbs__sep { color: var(--hcn-gray-500); }
.hcn-breadcrumbs__current { color: var(--hcn-gray-500); }


/* ---- FLOATING CTA BAR ---------------------------------------- */
.hcn-float-cta {
  position: fixed;
  right: 1rem;
  bottom: 1.75rem;
  z-index: 9990;
  display: flex;
  flex-direction: column;
  gap: .45rem;
  align-items: flex-end;
}
.hcn-float-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .62rem 1rem;
  border-radius: 999px;
  font-family: var(--font-heading);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--hcn-white);
  box-shadow: 0 4px 18px rgba(0,0,0,.18);
  transition: var(--transition);
  white-space: nowrap;
}
.hcn-float-cta__btn:hover {
  transform: translateY(-2px);
  color: var(--hcn-white);
  box-shadow: 0 8px 24px rgba(0,0,0,.22);
}
.hcn-float-cta__btn--quote {
  background: var(--hcn-red);
}
.hcn-float-cta__btn--quote:hover { background: #b91c1c; }
.hcn-float-cta__btn--whatsapp {
  background: var(--hcn-whatsapp);
}
.hcn-float-cta__btn--whatsapp:hover { background: #1ebe57; }
.hcn-float-cta__btn--email {
  background: var(--hcn-navy);
}
.hcn-float-cta__btn--email:hover { background: var(--hcn-navy-dark); }

body.hcn-has-mobile-inquiry .hcn-float-cta {
  bottom: 4.75rem;
}
body.hcn-has-mobile-inquiry {
  padding-bottom: 4.25rem;
}


/* ---- BADGES & TAGS ------------------------------------------- */
.hcn-badge {
  display: inline-flex;
  align-items: center;
  padding: .2rem .65rem;
  font-family: var(--font-heading);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  border-radius: 3px;
}
.hcn-badge--navy  { background: var(--hcn-navy);  color: var(--hcn-white); }
.hcn-badge--gold  { background: var(--hcn-gold);  color: var(--hcn-navy-dark); }
.hcn-badge--red   { background: var(--hcn-red);   color: var(--hcn-white); }
.hcn-badge--gray  { background: var(--hcn-gray-100); color: var(--hcn-gray-700); border: 1px solid var(--hcn-gray-300); }


/* ---- UTILITY ------------------------------------------------- */
.hcn-text-center { text-align: center; }
.hcn-mt-lg { margin-top: var(--space-lg); }
.hcn-mt-md { margin-top: var(--space-md); }
.hcn-visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
}


/* ---- FULLWIDTH (front page override) -------------------------
   GeneratePress HTML structure (confirmed from class-html-attributes.php):
     header.php opens:  <div id="page"> → <div id="content" class="site-content">
     footer.php closes: </div>          → </div>
   Our <main id="hcn-homepage"> renders inside #content.site-content.
   Strip ALL padding/max-width so sections span full viewport width.
   .home            = WP body class when front page shows blog/static page
   .blog            = WP body class when Reading = "Latest Posts"
   .hcn-page-home   = our own body class added in page-home.php
   ---------------------------------------------------------------- */

/* Level 1: outer page wrapper – remove GP grid-container cap */
body.home #page,
body.blog #page,
body.hcn-page-home #page,
body.hcn-products-page #page,
body.home #page.grid-container,
body.blog #page.grid-container,
body.hcn-page-home #page.grid-container,
body.hcn-products-page #page.grid-container,
body.home #page.hcn-fullwidth-page,
body.blog #page.hcn-fullwidth-page,
body.hcn-page-home #page.hcn-fullwidth-page,
body.hcn-products-page #page.hcn-fullwidth-page {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
}

/* Level 2: site-content (id="content") – break GP flex sidebar column */
body.home #content,
body.blog #content,
body.hcn-page-home #content,
body.hcn-products-page #content {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  display: block !important;
}

/* Override GP's one-container layout which adds padding to .site-content */
body.home .site-content,
body.blog .site-content,
body.hcn-page-home .site-content,
body.hcn-products-page .site-content,
body.home.one-container .site-content,
body.blog.one-container .site-content,
body.hcn-page-home.one-container .site-content,
body.hcn-products-page.one-container .site-content {
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  display: block !important;
}

/* Kill the ghost 30% right-sidebar column GP reserves in flex mode */
body.home .site-content .content-area,
body.blog .site-content .content-area,
body.hcn-page-home .site-content .content-area,
body.hcn-products-page .site-content .content-area {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
}

body.home .sidebar,
body.blog .sidebar,
body.hcn-page-home .sidebar,
body.hcn-products-page .sidebar,
body.home .is-right-sidebar,
body.blog .is-right-sidebar,
body.hcn-page-home .is-right-sidebar,
body.hcn-products-page .is-right-sidebar,
body.home .is-left-sidebar,
body.blog .is-left-sidebar,
body.hcn-page-home .is-left-sidebar,
body.hcn-products-page .is-left-sidebar {
  display: none !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Override .grid-container max-width (from GP's customizer) inside our homepage */
body.home #hcn-homepage .hcn-container,
body.blog #hcn-homepage .hcn-container,
body.hcn-page-home #hcn-homepage .hcn-container {
  max-width: var(--hcn-container); /* restore OUR container inside sections */
}

/* The homepage <main> itself */
#hcn-homepage {
  width: 100%;
  display: block;
  padding: 0 !important;
  margin: 0 !important;
}

/* 消除 GP 内容区所有内边距（首页） */
body.home .content-area,
body.blog .content-area,
body.hcn-page-home .content-area,
body.home .site-main,
body.blog .site-main,
body.hcn-page-home .site-main,
body.hcn-products-page .content-area,
body.hcn-products-page #primary {
  width: 100% !important;
  max-width: 100% !important;
  float: none !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  overflow-x: clip;
}

body.hcn-products-page .hcn-products-catalog .hcn-container,
body.hcn-products-page .hcn-product-single-page .hcn-container {
  max-width: var(--hcn-container);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--space-md);
  padding-right: var(--space-md);
}

/* Contact page – same full-bleed overrides as products */
body.hcn-contact-page #page,
body.hcn-contact-page #page.grid-container,
body.hcn-contact-page #page.hcn-fullwidth-page {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
}
body.hcn-contact-page #content,
body.hcn-contact-page .site-content,
body.hcn-contact-page.one-container .site-content {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  display: block !important;
}
body.hcn-contact-page .site-content .content-area,
body.hcn-contact-page .content-area,
body.hcn-contact-page #primary,
body.hcn-contact-page .site-main {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.hcn-contact-page .sidebar,
body.hcn-contact-page .is-right-sidebar,
body.hcn-contact-page .is-left-sidebar {
  display: none !important;
}

/* News archive + single – full bleed */
body.hcn-news-page #page,
body.hcn-news-page #page.grid-container,
body.hcn-news-page #page.hcn-fullwidth-page {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
}
body.hcn-news-page #content,
body.hcn-news-page .site-content,
body.hcn-news-page.one-container .site-content {
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  display: block !important;
}
body.hcn-news-page .site-content .content-area,
body.hcn-news-page .content-area,
body.hcn-news-page #primary,
body.hcn-news-page .site-main {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.hcn-news-page .sidebar,
body.hcn-news-page .is-right-sidebar,
body.hcn-news-page .is-left-sidebar {
  display: none !important;
}
body.hcn-news-page article {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  border: none !important;
  box-shadow: none !important;
}

body.home article,
body.blog article,
body.hcn-page-home article {
  padding: 0 !important;
  margin: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  border: none !important;
  box-shadow: none !important;
}

body.home.separate-containers .inside-article,
body.blog.separate-containers .inside-article,
body.home.separate-containers .site-main,
body.blog.separate-containers .site-main {
  margin: 0 !important;
  padding: 0 !important;
}

/* 隐藏首页可能出现的 page header 空白区 */
body.home .page-header,
body.blog .page-header,
body.hcn-page-home .page-header {
  display: none !important;
}

/* 轮播紧贴 header，无间隙 */
body.home .hcn-carousel,
body.blog .hcn-carousel,
body.hcn-page-home .hcn-carousel {
  margin-top: 0 !important;
}

.hcn-fullwidth-content {
  max-width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}


/* ---- IMAGE LIGHTBOX ------------------------------------------ */
.hcn-lightbox {
  position: relative;
  display: block;
  cursor: zoom-in;
  text-decoration: none;
  color: inherit;
}
.hcn-lightbox:hover .hcn-lightbox__icon {
  opacity: 1;
  transform: scale(1);
}
.hcn-lightbox__icon {
  position: absolute;
  top: .65rem;
  right: .65rem;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(11,37,69,.72);
  color: var(--hcn-white);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: scale(.85);
  transition: opacity .25s ease, transform .25s ease;
  pointer-events: none;
  z-index: 2;
}

.hcn-lightbox-trigger {
  position: absolute;
  top: .65rem;
  right: .65rem;
  width: 34px;
  height: 34px;
  border: none;
  border-radius: 50%;
  background: rgba(11,37,69,.78);
  color: var(--hcn-white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: zoom-in;
  opacity: 0;
  transform: scale(.9);
  transition: opacity .25s ease, transform .25s ease, background .2s ease;
  z-index: 4;
}
.hcn-prod-card__img-wrap:hover .hcn-lightbox-trigger,
.hcn-ind-card__media:hover .hcn-lightbox-trigger,
.hcn-manufacturing__main:hover .hcn-lightbox-trigger,
.hcn-manufacturing__thumb:hover .hcn-lightbox-trigger,
.hcn-partners__logo-img:hover .hcn-lightbox-trigger {
  opacity: 1;
  transform: scale(1);
}
.hcn-lightbox-trigger:hover {
  background: var(--hcn-gold);
  color: var(--hcn-navy-dark);
}

body.hcn-lightbox-open { overflow: hidden; }

.hcn-lightbox-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.hcn-lightbox-modal[hidden] { display: none !important; }
.hcn-lightbox-modal.is-open { display: flex !important; }

.hcn-lightbox-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7,24,50,.92);
  cursor: zoom-out;
}

.hcn-lightbox-modal__panel {
  position: relative;
  z-index: 2;
  max-width: min(1100px, 96vw);
  max-height: 92vh;
  width: 100%;
}

.hcn-lightbox-modal__figure {
  margin: 0;
  text-align: center;
}

.hcn-lightbox-modal__img {
  max-width: 100%;
  max-height: 78vh;
  width: auto;
  height: auto;
  margin: 0 auto;
  border-radius: var(--hcn-radius);
  box-shadow: var(--shadow-lg);
  display: block;
}

.hcn-lightbox-modal__caption {
  margin-top: .85rem;
  color: rgba(255,255,255,.85);
  font-size: .92rem;
  line-height: 1.55;
  text-align: center;
  padding: 0 2.5rem;
}

.hcn-lightbox-modal__close,
.hcn-lightbox-modal__nav {
  position: absolute;
  border: none;
  background: rgba(255,255,255,.12);
  color: var(--hcn-white);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
  z-index: 3;
}
.hcn-lightbox-modal__close:hover,
.hcn-lightbox-modal__nav:hover {
  background: var(--hcn-gold);
  color: var(--hcn-navy-dark);
}
.hcn-lightbox-modal__close {
  top: -52px;
  right: 0;
}
.hcn-lightbox-modal__nav--prev { left: -56px; top: 50%; transform: translateY(-50%); }
.hcn-lightbox-modal__nav--next { right: -56px; top: 50%; transform: translateY(-50%); }

@media (max-width: 768px) {
  .hcn-lightbox-modal__nav--prev { left: .5rem; top: auto; bottom: -52px; transform: none; }
  .hcn-lightbox-modal__nav--next { right: .5rem; top: auto; bottom: -52px; transform: none; }
  .hcn-lightbox-modal__close { top: .5rem; right: .5rem; background: rgba(0,0,0,.5); }
  .hcn-lightbox-trigger,
  .hcn-lightbox__icon { opacity: 1; transform: scale(1); }
}


/* ---- STAT BAR (shortcode) ------------------------------------ */
.hcn-stat-bar {
  background: var(--hcn-navy);
  padding: 2rem 0;
  border-top: 3px solid var(--hcn-gold);
  border-bottom: 3px solid var(--hcn-gold);
}
.hcn-stat-bar__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
}
.hcn-stat-bar__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: .75rem 1rem;
  border-right: 1px solid rgba(255,255,255,.12);
}
.hcn-stat-bar__item:last-child { border-right: none; }
.hcn-stat-bar__number {
  font-family: var(--font-heading);
  font-size: 2.4rem;
  font-weight: 800;
  color: var(--hcn-gold);
  line-height: 1;
}
.hcn-stat-bar__label {
  font-size: .82rem;
  color: rgba(255,255,255,.7);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: .3rem;
}


/* ---- CTA BANNER (shortcode) ---------------------------------- */
.hcn-cta-banner {
  padding: var(--space-xl) var(--space-md);
  text-align: center;
}
.hcn-cta-banner--dark { background: var(--hcn-navy-dark); }
.hcn-cta-banner--navy { background: var(--hcn-navy); }
.hcn-cta-banner--gray { background: var(--hcn-gray-100); }
.hcn-cta-banner__inner { max-width: 720px; margin: 0 auto; }
.hcn-cta-banner--dark .hcn-cta-banner__headline,
.hcn-cta-banner--navy .hcn-cta-banner__headline { color: var(--hcn-white); }
.hcn-cta-banner__subtext {
  font-size: 1.1rem;
  color: rgba(255,255,255,.7);
  margin: .75rem 0 1.75rem;
}
.hcn-cta-banner--gray .hcn-cta-banner__headline { color: var(--hcn-navy-dark); }
.hcn-cta-banner--gray .hcn-cta-banner__subtext  { color: var(--hcn-gray-700); }


/* ---- RESPONSIVE OVERRIDES ------------------------------------ */
@media (max-width: 1024px) {
  .hcn-grid-4 { grid-template-columns: repeat(2, 1fr); }
  .hcn-footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-lg); }
  .hcn-footer-col--brand { grid-column: 1 / -1; }
}

@media (max-width: 768px) {
  :root {
    --space-xl:  2.5rem;
    --space-2xl: 3.5rem;
  }
  .hcn-grid-2,
  .hcn-grid-3,
  .hcn-grid-4 { grid-template-columns: 1fr; }
  .hcn-footer-grid { grid-template-columns: 1fr; }
  .hcn-topbar__left,
  .hcn-topbar__right { gap: .75rem; }
  .hcn-topbar__item:not(.hcn-topbar__cert) { display: none; }
  .hcn-stat-bar__grid { grid-template-columns: repeat(2, 1fr); }
}

body.hcn-has-mobile-inquiry .hcn-sticky-rfq { bottom: 4.5rem; }

/* ---- STICKY RFQ BAR (site-wide, 2 actions) ----------------- */
.hcn-sticky-rfq {
  position: fixed;
  right: 1rem;
  bottom: 1.25rem;
  z-index: 9985;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  align-items: stretch;
  max-width: 220px;
}
.hcn-sticky-rfq__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  padding: .65rem 1rem;
  border-radius: 999px;
  font-family: var(--font-heading);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .04em;
  text-transform: uppercase;
  text-decoration: none;
  box-shadow: var(--shadow-md);
  transition: transform .15s ease, box-shadow .15s ease;
}
.hcn-sticky-rfq__btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}
.hcn-sticky-rfq__btn--quote {
  background: var(--hcn-red);
  color: var(--hcn-white);
}
.hcn-sticky-rfq__btn--quote:hover { background: #b91c1c; color: var(--hcn-white); }
.hcn-sticky-rfq__btn--catalog {
  background: var(--hcn-navy);
  color: var(--hcn-white);
}
.hcn-sticky-rfq__btn--catalog:hover { background: var(--hcn-navy-dark); color: var(--hcn-white); }

@media (max-width: 480px) {
  .hcn-sticky-rfq {
    right: .65rem;
    bottom: 1rem;
    max-width: 56px;
  }
  .hcn-sticky-rfq__btn span,
  .hcn-sticky-rfq__label-short { display: none; }
  .hcn-sticky-rfq__btn {
    width: 48px;
    height: 48px;
    padding: 0;
    border-radius: 50%;
  }
  body.hcn-has-mobile-inquiry .hcn-sticky-rfq { bottom: 4.25rem; }
  .hcn-topbar { display: none; }
  .hcn-stat-bar__grid { grid-template-columns: repeat(2, 1fr); }
}

/* ---- EEAT TRUST STRIP -------------------------------------- */
.hcn-trust-eeat {
  padding: var(--space-md) 0;
  background: var(--hcn-gray-50);
  border-top: 1px solid var(--hcn-gray-300);
  border-bottom: 1px solid var(--hcn-gray-300);
}

.hcn-product-single-page + .hcn-trust-eeat,
body.hcn-products-page .hcn-trust-eeat {
  padding: var(--space-sm) 0 var(--space-md);
}
.hcn-trust-eeat__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.hcn-trust-eeat__card {
  background: #fff;
  border-radius: var(--hcn-radius-lg);
  padding: 1.25rem;
  border-left: 3px solid var(--hcn-gold);
  box-shadow: var(--shadow-sm);
}
.hcn-trust-eeat__icon { color: var(--hcn-navy); display: block; margin-bottom: .65rem; }
.hcn-trust-eeat__title {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--hcn-navy);
  margin: 0 0 .45rem;
}
.hcn-trust-eeat__card p {
  font-size: .88rem;
  line-height: 1.6;
  color: var(--hcn-gray-700);
  margin: 0 0 .65rem;
}
.hcn-trust-eeat__guides {
  text-align: center;
  margin: 1rem 0 0;
  font-size: .88rem;
  color: var(--hcn-gray-500);
}
.hcn-home-cases {
  background: #fff;
  padding: var(--space-xl) 0;
}
.hcn-home-cases__footer { text-align: center; margin-top: 1.25rem; }

@media (max-width: 900px) {
  .hcn-trust-eeat__grid { grid-template-columns: 1fr; }
}