/* Final hero composition boundary. Important declarations in this named layer
   take precedence over the legacy unlayered overrides. Keep image, reading
   field and live text separate; never darken an entire portrait for contrast.
   Image orientation stays intact, including photographed writing and QR codes. */
@layer xuemoHero {
  body.portal>.portal-nav {box-shadow:none!important;}
  :root { --hero-paper:#f8f5ee; --hero-ink:#18283d; --hero-muted:#38495a; --hero-gold:#84662f; }
  body.portal :is(.poster-page-hero,.editorial-hero,.works-hero,.events-hero,.concept-video-hero,.portal-home-hero) {
    box-shadow:none!important; filter:none!important; isolation:isolate!important;
  }
  body.portal :is(.poster-page-hero,.editorial-hero,.works-hero,.events-hero,.concept-video-hero,.portal-home-hero) * {
    text-shadow:none!important;
  }
  body.portal :is(.poster-page-hero,.editorial-hero,.works-hero,.events-hero,.concept-video-hero,.portal-home-hero)::after {
    display:none!important; content:none!important;
  }
  :where(html[dir=ltr]) body.portal :where(.poster-page-hero,.editorial-hero,.works-hero,.events-hero,.concept-video-hero,.portal-home-hero)::before {
    display:none!important; content:none!important;
  }
  /* The original dark canvas already provides the reading space. */
  .civilization-poster { --hero-image:url('/static/_optimized/xin-xing-civilization-hero-20260826-v4.png.webp'); --hero-position:right center; --hero-base:#030914; }
  .about-cosmos-poster { --hero-image:url('/static/xuemo-cosmos-about-hero-20260824.webp'); --hero-position:left center; --hero-base:#03080c; }
  body.portal :is(.civilization-poster,.about-cosmos-poster) {
    background:var(--hero-base) var(--hero-image) center/cover no-repeat!important;
    min-height:clamp(600px,46vw,740px)!important;height:auto!important;
    padding:80px max(40px,calc((100vw - 1200px)/2))!important;
    display:flex!important;align-items:center!important;
  }
  body.portal :is(.civilization-poster,.about-cosmos-poster)::before { display:none!important; content:none!important; }
  body.portal .civilization-poster .poster-page-hero-copy {
    width:43%!important;max-width:560px!important;margin:0 auto 0 0!important;text-align:start!important;
  }
  body.portal .about-cosmos-poster .poster-page-hero-copy {
    width:45%!important;max-width:560px!important;margin:0 0 0 auto!important;text-align:start!important;
  }
  .international-studies-page .editorial-hero { --hero-image:url('/static/_optimized/xuemo-studies-2026-hero-20260826.png.webp'); --hero-position:79% center; }
  /* Daylight portraits: a paper reading field ends before the face. */
  .books-page .works-hero { --hero-image:url('/static/_optimized/xuemo-books-hero-20260826.png.webp'); --hero-position:81% center; }
  .academy-vr-page .editorial-hero { --hero-image:url('/static/_optimized/xuemo-academy-wuwei-hero-20260826.png.webp'); --hero-position:82% center; }
  body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page) :is(.works-hero,.editorial-hero) {
    background:linear-gradient(90deg,rgba(248,245,238,.98),rgba(248,245,238,.94) 27%,rgba(248,245,238,.62) 43%,transparent 61%),var(--hero-image) center/cover no-repeat!important;
    height:auto!important;min-height:650px!important;padding-block:72px!important;
    display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:stretch!important;
  }
  body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page) :is(.works-hero,.editorial-hero)::before { display:none!important;content:none!important; }
  body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page) :is(.works-hero,.editorial-hero)>:is(h1,p,.editorial-kicker,.works-hero-stats) {
    width:45%!important;max-width:580px!important;margin-left:0!important;margin-right:auto!important;text-align:start!important;
  }
  body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page) :is(.works-hero,.editorial-hero) :is(h1,p,.editorial-kicker,.works-hero-stats,.works-hero-stats b) { color:var(--hero-ink)!important; }
  body.portal.books-page .works-hero-stats>span {
    background:transparent!important;box-shadow:none!important;border:0!important;border-top:1px solid #94897070!important;
    border-radius:0!important;padding:14px 0 0!important;color:var(--hero-muted)!important;
  }
  /* A sunset reading field on the right keeps the person on the left clear. */
  body.portal.topics-redesigned .editorial-hero {
    --hero-image:url('/static/_optimized/xuemo-translators-comments-hero-20260826.png.webp');--hero-position:23% center;
    background:linear-gradient(90deg,transparent 45%,rgba(248,235,216,.24) 64%,rgba(248,235,216,.42)),var(--hero-image) center/cover no-repeat!important;
    height:auto!important;min-height:650px!important;padding-block:88px!important;display:flex!important;
    flex-direction:column!important;align-items:stretch!important;justify-content:center!important;
  }
  body.portal.topics-redesigned .editorial-hero::before { display:none!important;content:none!important; }
  body.portal.topics-redesigned .editorial-hero>:is(h1,p,.editorial-kicker) {
    width:45%!important;max-width:580px!important;margin-left:auto!important;margin-right:0!important;
    text-align:start!important;color:#172439!important;
  }
  body.portal.events-page .events-hero {margin-top:88px!important;}
  /* Documentary group photographs have no safe space for an overlaid title.
     Place the complete image alongside the copy on the same ivory canvas. */
  .events-page .events-hero { --hero-image:url('/static/_optimized/xuemo-events-hero-20260826-v3.png.webp');--hero-ratio:1.732; }
  .forums-page .editorial-hero { --hero-image:url('/static/_optimized/xuemo-forums-hero-20260828.png.webp');--hero-ratio:2; }
  body.portal:is(.events-page,.forums-page) :is(.events-hero,.editorial-hero) {
    background:var(--hero-paper)!important;height:auto!important;min-height:600px!important;
    padding:72px max(40px,calc((100vw - 1200px)/2))!important;
    display:flex!important;flex-direction:column!important;justify-content:center!important;align-items:stretch!important;
  }
  body.portal:is(.events-page,.forums-page) :is(.events-hero,.editorial-hero)::before {
    content:""!important;display:block!important;position:absolute!important;inset:0 0 0 auto!important;
    width:57%!important;height:100%!important;z-index:-1!important;opacity:1!important;
    background:var(--hero-image) right center/contain no-repeat!important;
    mask:none!important;transform:none!important;mix-blend-mode:normal!important;
  }
  body.portal.events-page .events-hero-inner,
  body.portal.forums-page .editorial-hero>:is(h1,p,.editorial-kicker) {
    width:37%!important;max-width:500px!important;margin-left:0!important;margin-right:auto!important;text-align:start!important;
  }
  body.portal:is(.events-page,.forums-page) :is(.events-hero,.editorial-hero) :is(h1,p,.editorial-kicker,.events-kicker,.events-hero-count,.events-hero-count span) { color:var(--hero-ink)!important; }
  body.portal.events-page .events-hero-count {border-color:#9a885b66!important;}
  html[dir=rtl] body.portal:is(.events-page,.forums-page) :is(.events-hero,.editorial-hero)::before {inset:0 auto 0 0!important;}
  html[dir=rtl] body.portal.events-page .events-hero-inner,
  html[dir=rtl] body.portal.forums-page .editorial-hero>:is(h1,p,.editorial-kicker) {margin-left:auto!important;margin-right:0!important;}
  /* Remove bottom shade and glowing letters from the white / ink collection. */
  body.portal:is(.institute-page,.academic-network-page,.journals-page,.scholarship-page,.papers-page,.international-dialogues-page,.routledge-page) .editorial-hero>:is(h1,p,.editorial-kicker) {
    width:47%!important;max-width:600px!important;
  }
  html[dir=ltr] body.portal:is(.institute-page,.academic-network-page,.journals-page,.scholarship-page,.papers-page,.international-dialogues-page,.routledge-page) .editorial-hero>:is(h1,p,.editorial-kicker) {margin-left:0!important;margin-right:auto!important;}
  body.portal .editorial-art-hero::before {display:none!important;content:none!important;}
  /* The author portrait stays clear; its original white space is sufficient. */
  body.portal .author-poster {background:#fff var(--poster-image) center/cover no-repeat!important;}
  body.portal .author-poster::before {display:none!important;content:none!important;}
  /* Lettered book art remains unreflected, with text in the existing right field. */
  body.portal.dictionary-page .editorial-hero {--hero-image:url('/static/xuemo-dictionary-hero-20260826.webp');--hero-position:left center;--hero-base:#291207;}
  body.portal.dictionary-page .editorial-hero::before {display:none!important;content:none!important;}
  /* Landscape and celestial artwork need only a light, local reading gradient. */
  body.portal .portal-home-hero {background-image:linear-gradient(90deg,rgba(4,10,20,.22),transparent 62%),url('/static/xuemo-cosmos-home-hero-20260824.webp')!important;}
  html[dir=rtl] body.portal .portal-home-hero {background:#050d19!important;}
  html[dir=rtl] body.portal .portal-home-hero::before {filter:none!important;}
  body.portal .concept-video-hero::after {content:""!important;display:block!important;background:linear-gradient(90deg,rgba(4,10,20,.32),transparent 60%)!important;}
  html[dir=rtl] body.portal .concept-video-hero::after {background:linear-gradient(270deg,rgba(4,10,20,.32),transparent 60%)!important;}
  /* Tablet and mobile: the image comes first, at its own focal crop; live text
     follows on the same canvas. A narrow edge fade joins surfaces, not faces. */
  @media(max-width:1000px) {
    body.portal.events-page .events-hero {margin-top:72px!important;}
    body.portal :is(.civilization-poster,.about-cosmos-poster),
    body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page,.topics-redesigned,.dictionary-page) :is(.works-hero,.editorial-hero) {
      --hero-art-height:clamp(280px,55vw,460px);
      background:var(--hero-base,var(--hero-paper))!important;
      min-height:0!important;height:auto!important;display:flex!important;flex-direction:column!important;
      justify-content:flex-start!important;align-items:stretch!important;
      padding:calc(var(--hero-art-height) + 32px) 24px 48px!important;
    }
    body.portal :is(.civilization-poster,.about-cosmos-poster)::before,
    body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page,.topics-redesigned,.dictionary-page) :is(.works-hero,.editorial-hero)::before {
      display:block!important;content:""!important;position:absolute!important;inset:0 0 auto!important;
      width:100%!important;height:var(--hero-art-height)!important;opacity:1!important;z-index:-1!important;
      background:var(--hero-image) var(--hero-position,center)/cover no-repeat!important;
      mask:none!important;transform:none!important;filter:none!important;mix-blend-mode:normal!important;
    }
    body.portal :is(.civilization-poster,.about-cosmos-poster) .poster-page-hero-copy,
    body.portal:is(.books-page,.academy-vr-page,.international-studies-page,.awards-page,.topics-redesigned,.dictionary-page) :is(.works-hero,.editorial-hero)>:is(h1,p,.editorial-kicker,.works-hero-stats) {
      width:100%!important;max-width:700px!important;margin-left:0!important;margin-right:0!important;text-align:start!important;
    }
    body.portal .civilization-poster .poster-page-hero-copy h1 {margin:0!important;}
    body.portal:is(.events-page,.forums-page) :is(.events-hero,.editorial-hero) {
      --hero-art-height:calc(100vw / var(--hero-ratio));
      padding:calc(var(--hero-art-height) + 32px) 24px 48px!important;min-height:0!important;
    }
    body.portal:is(.events-page,.forums-page) :is(.events-hero,.editorial-hero)::before {
      inset:0 0 auto!important;width:100%!important;height:var(--hero-art-height)!important;
      background-size:100% auto!important;background-position:center top!important;
    }
    body.portal.events-page .events-hero-inner,
    body.portal.forums-page .editorial-hero>:is(h1,p,.editorial-kicker) {width:100%!important;max-width:700px!important;margin-left:0!important;margin-right:0!important;}
    body.portal:is(.institute-page,.academic-network-page,.journals-page,.scholarship-page,.papers-page,.international-dialogues-page,.routledge-page) .editorial-hero>:is(h1,p,.editorial-kicker) {width:100%!important;max-width:700px!important;}
    body.portal.dictionary-page .editorial-hero {--hero-art-height:clamp(260px,52vw,420px);}
  }
  .author-poster { --hero-image:var(--poster-image); --hero-position:right center; }
  .institute-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-institute-hero-20260826.png.webp'); }
  .academic-network-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-academic-network-hero-20260826.png.webp'); }
  .journals-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-journals-hero-20260826.png.webp'); }
  .scholarship-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-scholarship-hero-20260826.png.webp'); }
  .papers-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-papers-calligraphy-hero-20260827-v2.png.webp'); }
  .international-dialogues-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-international-dialogues-hero-20260826.png.webp'); }
  .core-concepts-page .editorial-hero { --hero-art:url('/static/xuemo-core-concepts-calligraphy-transparent-20260905.png'); }
  .routledge-page .editorial-hero { --hero-art:url('/static/_optimized/xuemo-routledge-hero-20260826.png.webp'); }
  .awards-page .editorial-hero { --hero-position:82% center; --hero-image:url('/static/_optimized/xuemo-awards-hero-20260826.png.webp'); }
  @media(max-width:1000px) {
    body.portal .author-poster {
      --hero-art-height:clamp(280px,55vw,460px);
      background:#fff!important;min-height:0!important;height:auto!important;
      padding:calc(var(--hero-art-height) + 32px) 24px 48px!important;
      display:block!important;
    }
    body.portal .author-poster::before {
      content:""!important;display:block!important;position:absolute!important;
      inset:0 0 auto!important;width:100%!important;height:var(--hero-art-height)!important;
      z-index:-1!important;opacity:1!important;transform:none!important;mask:none!important;
      background:var(--hero-image) right center/cover no-repeat!important;
    }
    body.portal .author-poster .poster-page-hero-copy {width:100%!important;max-width:700px!important;margin:0!important;}
    body.portal .author-poster .author-portrait-qr {position:absolute!important;z-index:2!important;width:88px!important;box-shadow:none!important;top:calc(var(--hero-art-height) - 110px)!important;bottom:auto!important;right:16px!important;left:auto!important;margin:0!important;}
    body.portal:is(.institute-page,.academic-network-page,.journals-page,.scholarship-page,.papers-page,.international-dialogues-page,.core-concepts-page,.routledge-page) .editorial-hero {
      --hero-art-height:clamp(240px,44vw,380px);
      background:var(--hero-paper)!important;height:auto!important;min-height:0!important;
      padding:44px 24px calc(var(--hero-art-height) + 40px)!important;
      display:flex!important;flex-direction:column!important;justify-content:flex-start!important;
    }
    body.portal:is(.institute-page,.academic-network-page,.journals-page,.scholarship-page,.papers-page,.international-dialogues-page,.core-concepts-page,.routledge-page) .editorial-hero::before {
      content:""!important;display:block!important;position:absolute!important;inset:auto 0 0!important;
      width:100%!important;height:var(--hero-art-height)!important;z-index:-1!important;
      background:var(--hero-art) right center/auto 100% no-repeat!important;
      opacity:1!important;mask:none!important;transform:none!important;mix-blend-mode:multiply!important;
    }
    body.portal:is(.institute-page,.academic-network-page,.journals-page,.scholarship-page,.papers-page,.international-dialogues-page,.core-concepts-page,.routledge-page) .editorial-hero>:is(h1,p,.editorial-kicker) {
      width:100%!important;max-width:700px!important;margin-left:0!important;margin-right:0!important;text-align:start!important;
    }
  }

  @media(max-width:1000px) {
    body.portal .concept-video-hero {
      --hero-art-height:clamp(310px,60vw,480px);
      background:#080f28!important;height:auto!important;min-height:0!important;
      padding:calc(var(--hero-art-height) + 36px) 24px 48px!important;
    }
    body.portal .concept-video-hero::before {
      content:""!important;display:block!important;position:absolute!important;inset:0 0 auto!important;
      width:100%!important;height:var(--hero-art-height)!important;opacity:1!important;z-index:-1!important;
      background:url('/static/xuemo-concept-correlation-hero-20260826.webp') right center/cover no-repeat!important;
      transform:none!important;mask:none!important;filter:none!important;
    }
    body.portal .concept-video-hero::after {content:none!important;display:none!important;}
    body.portal .concept-video-hero .concept-hero-copy {width:100%!important;max-width:700px!important;margin:0!important;text-align:start!important;}
    body.portal .concept-video-hero h1 {width:100%!important;max-width:100%!important;overflow-wrap:anywhere!important;hyphens:auto!important;font-size:var(--xu-title)!important;line-height:var(--xu-title-leading)!important;}
  }

}
