/* QilyLean Global Knowledge VI V2 | 2026-09-18
 * Authority: international-site QilyLean VI.
 * Unifies typography hierarchy and explicit interaction feedback for every route-capable card/link.
 */
:root{
  --qily-gk-deep:#0f4b5a;
  --qily-gk-deep-2:#073c47;
  --qily-gk-gold:#caa15f;
  --qily-gk-gold-soft:#ffe39b;
  --qily-gk-line:#bfd6d2;
  --qily-gk-focus:rgba(202,161,95,.32);
  --qily-gk-shadow:0 8px 22px rgba(15,75,90,.10);
  --qily-gk-shadow-hover:0 16px 34px rgba(15,75,90,.18);
  --qily-gk-h1:clamp(30px,2.65vw,44px);
  --qily-gk-h2:clamp(26px,2.05vw,34px);
  --qily-gk-h3:clamp(20px,1.55vw,24px);
}

/* QILY-GK-TYPE-HIERARCHY-V2 */
html:root body :is(.hero,.head) h1{
  font-size:var(--qily-gk-h1)!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}
html:root body :is(.section-head,.head) h2,
html:root body main section>div>.head h2{
  font-size:var(--qily-gk-h2)!important;
  line-height:1.2!important;
  letter-spacing:-.012em!important;
}
html:root body :is(.card,.brief,.term-card) h3,
html:root body .brief h2{
  font-size:var(--qily-gk-h3)!important;
  line-height:1.32!important;
  letter-spacing:-.008em!important;
}
html:root body :is(.hero,.head) p{font-size:18px!important;line-height:1.7!important}

/* QILY-GK-ROUTE-FEEDBACK-V2
 * Any element that jumps to another URL must visibly acknowledge hover/focus/press.
 */
html:root body a.card[href],
html:root body a.brief[href]{
  cursor:pointer!important;
  border-color:var(--qily-gk-line)!important;
  box-shadow:var(--qily-gk-shadow)!important;
  transition:
    transform .16s ease,
    box-shadow .16s ease,
    border-color .16s ease,
    background-color .16s ease,
    filter .16s ease!important;
}
@media(hover:hover) and (pointer:fine){
  html:root body a.card[href]:hover,
  html:root body a.brief[href]:hover{
    transform:translateY(-3px)!important;
    border-color:var(--qily-gk-gold)!important;
    background:#fffdf8!important;
    box-shadow:var(--qily-gk-shadow-hover)!important;
    filter:saturate(1.03)!important;
  }
}
html:root body a.card[href]:focus-visible,
html:root body a.brief[href]:focus-visible{
  transform:translateY(-2px)!important;
  border-color:var(--qily-gk-gold)!important;
  outline:3px solid var(--qily-gk-focus)!important;
  outline-offset:3px!important;
  box-shadow:var(--qily-gk-shadow-hover)!important;
}
html:root body a.card[href]:active,
html:root body a.brief[href]:active{
  transform:translateY(1px) scale(.985)!important;
  border-color:var(--qily-gk-gold)!important;
  box-shadow:0 4px 10px rgba(15,75,90,.14)!important;
}
html:root body a.card[href] :is(h2,h3,b),
html:root body a.brief[href] :is(h2,h3,b){
  transition:color .16s ease!important;
}
html:root body a.card[href]:is(:hover,:focus-visible) :is(h2,h3),
html:root body a.brief[href]:is(:hover,:focus-visible) :is(h2,h3){
  color:var(--qily-gk-deep-2)!important;
}
html:root body a.card[href]:is(:hover,:focus-visible) b{
  color:#9a7130!important;
}

/* Global Knowledge top/bottom route feedback follows the international header action language. */
html:root body :is(.top,.footer,.reader-actions) a[href]{
  cursor:pointer!important;
  transition:color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease!important;
}
html:root body .top .nav a[href]:is(:hover,:focus-visible),
html:root body .reader-actions a[href]:is(:hover,:focus-visible){
  color:var(--qily-gk-deep-2)!important;
  background:#fff8e9!important;
  border-color:var(--qily-gk-gold)!important;
  outline:none!important;
  box-shadow:0 7px 18px rgba(15,75,90,.14)!important;
  transform:translateY(-1px)!important;
}
html:root body .top .nav a[href]:focus-visible,
html:root body .reader-actions a[href]:focus-visible{
  outline:3px solid var(--qily-gk-focus)!important;
  outline-offset:2px!important;
}
html:root body .top .nav a[href]:active,
html:root body .reader-actions a[href]:active{
  transform:translateY(1px) scale(.985)!important;
}
html:root body .footer a[href]:is(:hover,:focus-visible){
  color:#fff!important;
  text-decoration:underline!important;
  text-underline-offset:4px!important;
}

/* Inputs follow the same gold/deep-teal focus language. */
html:root body :is(input.search,input[type="search"]):focus{
  border-color:var(--qily-gk-gold)!important;
  outline:3px solid var(--qily-gk-focus)!important;
  outline-offset:1px!important;
  box-shadow:0 6px 16px rgba(15,75,90,.10)!important;
}

/* Static terminology cards are intentionally non-interactive: no hover lift. */
html:root body .term-card:not(a){
  transform:none!important;
  transition:none!important;
}

/* Reader hyperlinks retain text-link semantics rather than card semantics. */
html:root body .content a[href]{
  font-weight:800!important;
  text-underline-offset:3px!important;
}
html:root body .content a[href]:is(:hover,:focus-visible){
  color:var(--qily-gk-deep-2)!important;
  text-decoration-thickness:2px!important;
}

@media(max-width:620px){
  :root{
    --qily-gk-h1:clamp(29px,8vw,38px);
    --qily-gk-h2:clamp(24px,6.5vw,30px);
    --qily-gk-h3:clamp(20px,5.4vw,23px);
  }
  html:root body :is(.hero,.head) p{font-size:17px!important}
  html:root body a.card[href],
  html:root body a.brief[href]{box-shadow:0 6px 16px rgba(15,75,90,.09)!important}
}
@media(prefers-reduced-motion:reduce){
  html:root body a.card[href],
  html:root body a.brief[href],
  html:root body :is(.top,.footer,.reader-actions) a[href]{transition:none!important}
}


/* QILY-GK-HEADER-ALIGN-V3 | 2026-09-20
 * Global Knowledge header closure:
 * 1) keep the canonical QilyLean logo at the left;
 * 2) make the logo behave like the China-site home control (hover/focus -> 返回首页);
 * 3) reserve the translator column and right-align the knowledge navigation beside it;
 * 4) keep the mobile header stable with brand + translator above a horizontally scrollable nav row.
 */
html:root body header.top>.wrap{
  display:grid!important;
  grid-template-columns:max-content minmax(0,1fr) 206px!important;
  align-items:center!important;
  column-gap:14px!important;
  row-gap:0!important;
  min-width:0!important;
  flex-wrap:unset!important;
}
html:root body header.top>.wrap>a:first-child{
  grid-column:1!important;
  position:relative!important;
  display:block!important;
  width:clamp(168px,14vw,226px)!important;
  height:34px!important;
  min-width:0!important;
  margin:0!important;
  overflow:hidden!important;
  text-indent:-9999px!important;
  white-space:nowrap!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  background-color:transparent!important;
  background-image:url('/assets/brand/qilylean-logo.svg?v=20260724-logo-red-dot-v5')!important;
  background-position:left center!important;
  background-size:contain!important;
  background-repeat:no-repeat!important;
  border:1.5px solid transparent!important;
  border-radius:8px!important;
  box-sizing:border-box!important;
}
html:root body header.top>.wrap>.nav{
  grid-column:2!important;
  justify-self:end!important;
  align-self:center!important;
  width:max-content!important;
  max-width:100%!important;
  min-width:0!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
}
html:root body header.top>.wrap>.qily-web-translate[data-qily-header-utility="translation"]{
  grid-column:3!important;
  justify-self:end!important;
  align-self:center!important;
  margin:0!important;
}
@media(hover:hover) and (pointer:fine){
  html:root body header.top>.wrap>a:first-child:hover{
    background-color:#fff6df!important;
    background-image:none!important;
    border-color:var(--qily-gk-gold)!important;
    box-shadow:0 7px 18px rgba(15,75,90,.14)!important;
    filter:none!important;
    transform:none!important;
  }
}
html:root body header.top>.wrap>a:first-child:focus-visible{
  background-color:#fff6df!important;
  background-image:none!important;
  border-color:var(--qily-gk-gold)!important;
  box-shadow:0 0 0 3px rgba(202,161,95,.24),0 7px 18px rgba(15,75,90,.14)!important;
  outline:none!important;
  filter:none!important;
  transform:none!important;
}
html:root body header.top>.wrap>a:first-child:is(:hover,:focus-visible)::after{
  content:'返回首页'!important;
  position:absolute!important;
  inset:0!important;
  z-index:2!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 10px!important;
  color:var(--qily-gk-deep)!important;
  -webkit-text-fill-color:var(--qily-gk-deep)!important;
  background:transparent!important;
  font-size:clamp(16px,1.05vw,19px)!important;
  font-weight:950!important;
  line-height:1!important;
  letter-spacing:.06em!important;
  text-indent:0!important;
  text-shadow:none!important;
  white-space:nowrap!important;
  pointer-events:none!important;
}
html:root body header.top>.wrap>a:first-child:active{
  transform:translateY(1px) scale(.985)!important;
}
@media(max-width:900px){
  html:root body header.top>.wrap{
    grid-template-columns:minmax(126px,1fr) 206px!important;
    grid-template-areas:"brand translate" "nav nav"!important;
    column-gap:10px!important;
    row-gap:7px!important;
    align-items:center!important;
  }
  html:root body header.top>.wrap>a:first-child{
    grid-area:brand!important;
    width:142px!important;
    height:27px!important;
  }
  html:root body header.top>.wrap>.qily-web-translate[data-qily-header-utility="translation"]{
    grid-area:translate!important;
  }
  html:root body header.top>.wrap>.nav{
    grid-area:nav!important;
    justify-self:stretch!important;
    width:100%!important;
    max-width:100%!important;
    justify-content:flex-start!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    flex-wrap:nowrap!important;
    padding:2px 0 4px!important;
    scrollbar-width:thin!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-x:contain!important;
  }
  html:root body header.top>.wrap>.nav>a[href]{
    flex:0 0 auto!important;
  }
}
@media(max-width:480px){
  html:root body header.top>.wrap{
    grid-template-columns:minmax(112px,1fr) 178px!important;
  }
  html:root body header.top>.wrap>a:first-child{
    width:126px!important;
    height:23px!important;
  }
  html:root body header.top>.wrap>.qily-web-translate[data-qily-header-utility="translation"]{
    width:178px!important;
    min-width:178px!important;
    max-width:178px!important;
    flex-basis:178px!important;
  }
  html:root body header.top>.wrap>a:first-child:is(:hover,:focus-visible)::after{
    padding:0 6px!important;
    font-size:15px!important;
  }
}
@media(max-width:380px){
  html:root body header.top>.wrap{
    grid-template-columns:minmax(104px,1fr) 164px!important;
  }
  html:root body header.top>.wrap>.qily-web-translate[data-qily-header-utility="translation"]{
    width:164px!important;
    min-width:164px!important;
    max-width:164px!important;
    flex-basis:164px!important;
  }
}


/* QILY-GK-NAV-TYPE-PARITY-V4 | 2026-09-20
 * International Global Knowledge navigation uses the same primary-nav type scale as the China site.
 * All Global Knowledge pages inherit one explicit size; local page skins must not drift.
 */
:root{--qily-gk-primary-nav-font-size:20px}
html:root body header.top>.wrap>.nav>a[href]{
  font-size:var(--qily-gk-primary-nav-font-size)!important;
  line-height:1.22!important;
  font-weight:900!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
@media(max-width:620px){
  :root{--qily-gk-primary-nav-font-size:18px}
}
