/* ==========================================================
   YINGHE GLOBAL DESIGN SYSTEM v1.0
   Source of truth for V7 Design System Edition
   Loaded after home-v4.css
   ========================================================== */
:root{
  --yh-gold:#C9A24A;
  --yh-gold-light:#E2BD68;
  --yh-navy:#06285E;
  --yh-deep:#051C42;
  --yh-text:#0B1F44;
  --yh-muted:#4B5563;
  --yh-soft:#F6F9FD;
  --yh-border:#E4EBF4;
  --yh-shadow:0 14px 36px rgba(5,28,66,.08);
  --yh-radius:16px;
}

/* Language toggle */
.lang button{color:var(--yh-navy)!important}
.lang .active-lang{color:var(--yh-gold)!important}
.lang i{color:var(--yh-gold)!important}

/* Core typography components */
.yh-section-heading{margin-bottom:34px!important;text-align:center!important}
.yh-section-title,
.section-title > p.yh-section-title,
.about-panel > p.yh-section-title{
  font-size:42px!important;
  line-height:1.15!important;
  color:var(--yh-gold)!important;
  font-weight:800!important;
  letter-spacing:.035em!important;
  text-transform:uppercase!important;
  margin:0 0 12px!important;
}
.yh-section-subtitle,
.section-title > h2.yh-section-subtitle,
.about-panel > h2.yh-section-subtitle{
  font-size:clamp(22px,2.4vw,30px)!important;
  line-height:1.28!important;
  color:var(--yh-navy)!important;
  font-weight:700!important;
  letter-spacing:-.015em!important;
  margin:0!important;
}
.yh-section-body{display:block;max-width:820px;margin:14px auto 0!important;color:var(--yh-muted)!important;font-size:16px!important;line-height:1.72!important}

/* Hero system: inner pages use approved News-style corporate background */
.yh-hero:not(.hero),
.page-hero-small,
.about-hero,
.business-hero,
.health-hero,
.sourcing-hero,
.gsn-hero,
.uro-hero,
.shh-hero{
  position:relative!important;
  overflow:hidden!important;
  color:#fff!important;
  padding:84px 0!important;
  background:
    linear-gradient(120deg,rgba(5,28,66,.94),rgba(6,40,94,.82)),
    url('../assets/hero-v4.svg') center/cover no-repeat!important;
}
.yh-hero:not(.hero)::after,
.page-hero-small::after,
.about-hero::after,
.business-hero::after,
.health-hero::after,
.sourcing-hero::after,
.gsn-hero::after,
.uro-hero::after,
.shh-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 78% 20%,rgba(226,189,104,.18),transparent 32%);
}
.yh-hero > .container{position:relative;z-index:1}
.yh-hero-title,
.page-hero-small h1.yh-hero-title,
.about-hero h1.yh-hero-title,
.business-hero h1.yh-hero-title,
.health-hero h1.yh-hero-title,
.sourcing-hero h1.yh-hero-title,
.gsn-hero h1.yh-hero-title,
.uro-hero h1.yh-hero-title,
.shh-hero h1.yh-hero-title{
  font-size:clamp(38px,4.6vw,58px)!important;
  line-height:1.08!important;
  font-weight:850!important;
  letter-spacing:-.035em!important;
  color:#fff!important;
  margin:0 0 14px!important;
}
.yh-hero-subtitle{max-width:760px!important;color:#EAF3FF!important;font-size:18px!important;line-height:1.68!important;margin:0!important}
.yh-hero .eyebrow{color:var(--yh-gold-light)!important}

/* Home hero remains visually distinct */
.hero.yh-hero{background:url('../assets/hero-v4.svg') center/cover no-repeat!important;color:#fff!important}
.hero .yh-hero-title{font-size:clamp(36px,4.2vw,56px)!important;color:#fff!important}

/* Business page platform cards: stronger gold titles */
.page-business .business-card h3{
  font-size:26px!important;
  line-height:1.2!important;
  color:var(--yh-gold)!important;
  font-weight:850!important;
  margin:0 0 14px!important;
}

/* Background and spacing system */
.about-section,.health-wrap,.coming-content,.sourcing-section,.gsn-section,.uro-section,.shh-section,.business-grid-6{
  background:linear-gradient(180deg,#F7FAFE,#FFFFFF)!important;
  padding-top:70px!important;
  padding-bottom:70px!important;
}
.section{padding-top:78px!important;padding-bottom:78px!important}
.values-section{padding-top:84px!important;padding-bottom:84px!important}

/* Card system */
.yh-card,
.about-panel,
.business-card,
.health-card,
.company-card,
.mission-card,
.evolution-step,
.why-card,
.value-item,
.news-grid article{
  border-radius:var(--yh-radius)!important;
  box-shadow:var(--yh-shadow)!important;
  border:1px solid var(--yh-border)!important;
}
.about-two{align-items:stretch!important}
.about-panel.yh-equal-card{height:100%!important;min-height:330px!important;padding:30px!important;display:flex!important;flex-direction:column!important;justify-content:flex-start!important}

/* Global Contact CTA component */
.contact-band.yh-cta{
  padding:42px 0!important;
  background:linear-gradient(105deg,#051C42,#0B4C96 72%,#0C63BF)!important;
}
.contact-inner{grid-template-columns:1.12fr .88fr!important;gap:26px!important;align-items:center!important}
.contact-inner h2 .signature,
.home-contact-signature .signature{font-size:28px!important;line-height:1.2!important;margin-bottom:8px!important;color:var(--yh-gold-light)!important}
.contact-inner h2 .subtitle,
.home-contact-signature .subtitle{font-size:17px!important;line-height:1.45!important;color:#fff!important}
.contact-card.yh-card,
.contact-card{padding:20px 22px!important;border-radius:16px!important;background:rgba(255,255,255,.1)!important}
.contact-card p{margin:5px 0!important;font-size:14px!important;line-height:1.45!important;color:#EAF3FF!important}
.contact-card b{width:76px!important;color:var(--yh-gold-light)!important}

/* Footer brand family: logos only, labels removed visually */
.footer .brand-label,
.footer .explore{display:none!important}
.footer .brand-family-card{display:flex!important;align-items:center!important;gap:18px!important;flex-wrap:wrap!important}
.footer .brand-unit{transition:transform .22s ease!important}
.footer .brand-unit:hover{transform:translateY(-3px)!important}
.footer .divider{display:none!important}

/* News i18n cards */
.news-body h3{color:var(--yh-navy)!important;font-weight:800!important}
.news-body p{color:var(--yh-muted)!important}

@media(max-width:960px){
  .yh-section-title,.section-title > p.yh-section-title,.about-panel > p.yh-section-title{font-size:32px!important;letter-spacing:.02em!important}
  .yh-section-subtitle,.section-title > h2.yh-section-subtitle,.about-panel > h2.yh-section-subtitle{font-size:22px!important}
  .yh-hero:not(.hero),.page-hero-small,.about-hero,.business-hero,.health-hero,.sourcing-hero,.gsn-hero,.uro-hero,.shh-hero{padding:60px 0!important}
  .yh-hero-title{font-size:34px!important}
  .contact-inner{grid-template-columns:1fr!important;gap:20px!important}
  .contact-inner h2 .signature,.home-contact-signature .signature{font-size:24px!important}
}


/* ==========================================================
   V7.01 Bug Fix: News header + Contact CTA alignment
   ========================================================== */
.contact-card.yh-card,
.contact-card{
  text-align:center!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
}
.contact-card p{
  width:100%!important;
  text-align:center!important;
}
.contact-card b{
  display:block!important;
  width:auto!important;
  margin:0 0 3px!important;
}
.contact-card span{
  display:inline-block!important;
  max-width:100%!important;
}
@media(max-width:960px){
  .contact-card.yh-card,
  .contact-card{padding:18px 18px!important;}
}

/* ==========================================================
   V7.02 LANGUAGE TOGGLE FIX
   Active language = Yinghe Gold; inactive language = Corporate Blue
   Applies globally across all headers, including News.
   ========================================================== */
.lang{
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  padding:0!important;
  gap:8px!important;
}
.lang i{
  display:inline!important;
  color:var(--yh-gold)!important;
  font-style:normal!important;
}
.lang button{
  min-width:auto!important;
  height:auto!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:var(--yh-navy)!important;
  font-weight:900!important;
}
.lang button.active-lang,
.lang .active-lang{
  background:transparent!important;
  color:var(--yh-gold)!important;
  box-shadow:none!important;
}
.lang button:hover{
  color:var(--yh-gold)!important;
}