/* Material gallery: image-led hero with real metadata and the existing viewer. */
.cscom-main #fgGallery.cscom-material-gallery {
  --mg-accent: #ff8a43;
  position: relative; display: block; container-type: inline-size;
  width: 100%; max-width: none; min-width: 0; margin: 0 0 30px; padding: 0;
  overflow: hidden; border: 1px solid #ffffff16; border-radius: 24px;
  background: #101620; box-shadow: 0 18px 48px #0000002b;
  color: #edf2fa; font-family: 'Manrope', sans-serif;
}
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__main {
  position: relative; min-width: 0; min-height: 548px; margin: 0; padding: 36px 34px 138px;
  aspect-ratio: auto; border: 0; border-radius: 0; overflow: visible; isolation: isolate;
}
.cscom-main #fgGallery.cscom-material-gallery #fgMainLink {
  position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%;
  min-height: 0; border: 0; border-radius: 0; background: #111a26; box-shadow: none;
  touch-action: pan-y; overflow: hidden;
}
.cscom-main #fgGallery.cscom-material-gallery #fgMainPreview {
  display: block; width: 100%; max-width: none; height: 100%; max-height: none; min-height: 0;
  margin: 0; aspect-ratio: auto; object-fit: cover; object-position: center; transform: none;
  transition: opacity .2s; will-change: auto; filter: saturate(.96);
}
.cscom-main #fgGallery.cscom-material-gallery #fgMainLink::after {
  content: ''; display: block; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, #0a111bf5 0%, #0b121be8 31%, #0b121ba3 55%, #0b121b29 82%, #0b121b24 100%),
    linear-gradient(0deg, #0c131df7 0%, #0c131d78 20%, transparent 54%);
}
.cscom-main #fgGallery.cscom-material-gallery .mg-content { position: relative; z-index: 2; width: min(66%, 570px); min-width: 0; }
.cscom-main #fgGallery.cscom-material-gallery .mg-title {
  margin: 0 0 18px; padding: 0; color: #f8faff; font-family: 'Exo 2', 'Manrope', sans-serif;
  font-size: 32px; font-size: clamp(26px, 3.5cqw, 38px); font-weight: 800; line-height: 1.17;
  letter-spacing: -.65px; text-transform: none; overflow-wrap: anywhere; text-shadow: 0 3px 22px #0005;
}
.cscom-main #fgGallery.cscom-material-gallery .mg-badges { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 23px; }
.cscom-main #fgGallery.cscom-material-gallery .mg-badge {
  display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 7px 10px;
  border: 1px solid #ffffff14; border-radius: 10px; background: #243240b0;
  color: #d4e0ec; font-size: 10px; font-weight: 600; line-height: 1.4; overflow-wrap: anywhere;
}
.cscom-main #fgGallery.cscom-material-gallery .mg-badge svg { width: 14px; height: 14px; flex: 0 0 14px; color: #a1bdcb; }
.cscom-main #fgGallery.cscom-material-gallery .mg-downloads { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 20px; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download-form { display: flex; flex: 1 1 180px; min-width: 0; max-width: 280px; margin: 0; padding: 0; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download {
  display: inline-flex; align-items: center; justify-content: flex-start; gap: 11px;
  flex: 1 1 180px; min-width: 0; max-width: 280px; min-height: 66px; margin: 0; padding: 13px 15px;
  border: 1px solid #ffba773d; border-radius: 13px; text-align: left;
  color: #10151c; font: 800 14px/1.35 'Manrope', sans-serif; text-decoration: none;
  cursor: pointer; transition: background .18s, border-color .18s, box-shadow .18s;
}
.cscom-main #fgGallery.cscom-material-gallery .mg-download--primary { background: linear-gradient(135deg, #ffab5d, #ff7a31); box-shadow: 0 5px 22px #ff7d2420; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download--primary:hover { color: #0d121b; background: linear-gradient(135deg, #ffb674, #ff8e49); box-shadow: 0 7px 26px #ff7d2436; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download--secondary { background: #1b2937e8; color: #e2ecf6; border-color: #b1ccdc38; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download--secondary:hover { color: #fff; background: #253746f0; border-color: #ffad6470; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download-icon { display: grid; place-items: center; flex: 0 0 35px; width: 35px; height: 35px; border-radius: 50%; background: #fff9; color: #182331; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download--secondary .mg-download-icon { background: #ffffff0d; color: #c5d9e8; }
.cscom-main #fgGallery.cscom-material-gallery .mg-download-icon svg { width: 21px; height: 21px; }
.cscom-main #fgGallery.cscom-material-gallery .mg-metrics { display: flex; flex-wrap: wrap; gap: 10px 19px; margin: 0 0 23px; }
.cscom-main #fgGallery.cscom-material-gallery .mg-metric { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; color: #c6d5e3; font-size: 11px; line-height: 1.5; }
.cscom-main #fgGallery.cscom-material-gallery .mg-metric svg { width: 15px; height: 15px; flex: 0 0 15px; color: #9cb4c7; }
.cscom-main #fgGallery.cscom-material-gallery .mg-metric-label { color: #aebfce; }
.cscom-main #fgGallery.cscom-material-gallery .mg-metric strong { font-weight: 700; color: #eff5fb; font-variant-numeric: tabular-nums; }
.cscom-main #fgGallery.cscom-material-gallery .mg-jump-links { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.cscom-main #fgGallery.cscom-material-gallery .mg-jump-links a { display: inline-flex; align-items: center; gap: 9px; max-width: 100%; min-height: 25px; color: #c8deee; font-size: 12px; font-weight: 700; line-height: 1.45; text-decoration: none; transition: color .18s; }
.cscom-main #fgGallery.cscom-material-gallery .mg-jump-links a:hover { color: #ffb17b; }
.cscom-main #fgGallery.cscom-material-gallery .mg-jump-links svg { width: 17px; height: 17px; flex: 0 0 17px; color: #9cb8c8; }
.cscom-main #fgGallery.cscom-material-gallery .mg-jump-count { padding: 2px 6px; border: 1px solid #c3dce924; border-radius: 6px; background: #a3cada1a; color: #d4e8f3; font-size: 10px; line-height: 1.35; }
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__rail {
  position: absolute; z-index: 3; inset: auto 124px 22px 32px; width: auto; min-width: 0; min-height: 0; max-height: none;
  margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; overflow: hidden;
}
.cscom-main #fgGallery.cscom-material-gallery #fgThumbsBox {
  position: relative; display: flex; flex-direction: row; gap: 9px; width: 100%; height: auto !important;
  max-width: 100%; max-height: none !important; min-height: 0; margin: 0; padding: 3px 2px 9px;
  overflow-x: auto; overflow-y: hidden; scroll-padding-inline: 3px; overscroll-behavior-x: contain;
  scrollbar-width: thin; scrollbar-color: #8ba4b866 #10192580; scroll-margin-top: 100px;
}
.cscom-main #fgGallery.cscom-material-gallery #fgThumbsBox::-webkit-scrollbar { height: 5px; }
.cscom-main #fgGallery.cscom-material-gallery #fgThumbsBox::-webkit-scrollbar-thumb { background: #8ba4b866; border-radius: 99px; }
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb {
  position: relative; display: block; flex: 0 0 106px; width: 106px; height: 66px; min-height: 0;
  margin: 0; padding: 0; border: 1px solid #ffffff24; border-radius: 10px; background: #141d27;
  overflow: hidden; opacity: .68; transform: none; transition: opacity .18s, border-color .18s;
}
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb::before { display: none; }
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb img { display: block; width: 100%; height: 100%; max-height: 100%; margin: 0; aspect-ratio: auto; object-fit: cover; opacity: 1; transform: none; }
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb:hover { border-color: #ffb47d; opacity: 1; transform: none; }
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb.is-active { border-color: #ff9148 !important; box-shadow: 0 0 0 1px #ff9148b3; opacity: 1; }
.cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb::after { right: 4px; bottom: 4px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 4px; font-size: 8px; background: #101722cf; border-color: #ffffff1f; box-shadow: none; }
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-open-hint {
  position: absolute; z-index: 2; inset: 20px 22px auto auto; min-height: 35px; margin: 0; padding: 8px 10px;
  gap: 7px; border-color: #ffffff29; border-radius: 9px; background: #101a26dc; color: #e8f1fa;
  font-size: 10px; line-height: 1.3; box-shadow: none;
}
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-open-hint svg { width: 17px; height: 17px; }
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step {
  position: absolute; z-index: 4; top: auto; bottom: 53px; width: 35px; height: 37px; margin: 0; padding: 0;
  transform: none; border: 1px solid #ffffff2b; border-radius: 10px; background: #12202bdb; box-shadow: none;
}
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step--previous { left: auto; right: 69px; }
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step--next { left: auto; right: 27px; }
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step:hover { color: #ffb47d; border-color: #ffad6466; background: #26323ecc; }
.cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step svg { width: 17px; height: 17px; }
.cscom-main #fgGallery.cscom-material-gallery .mg-index {
  position: absolute; z-index: 4; right: 27px; bottom: 27px; display: block; min-width: 76px; width: auto;
  margin: 0; padding: 0; border: 0; border-radius: 0; background: none; color: #c4d9e9;
  font: 600 11px/1.5 'Manrope', sans-serif; text-align: center; font-variant-numeric: tabular-nums;
}
.cscom-main #fgGallery.cscom-material-gallery .mg-index::before { display: none; }
.cscom-main #fgGallery.cscom-material-gallery[data-gallery-count="1"] .mg-index { bottom: 48px; }
.cscom-main #fgGallery.cscom-material-gallery :is(a, button):focus-visible { outline: 2px solid #ffad6b; outline-offset: 3px; }
.cscom-main #fgGallery.cscom-material-gallery #fgMainLink:focus-visible { outline-offset: -4px; }
.cscom-main #fgGallery.cscom-material-gallery #fgThumbsBox:focus-visible { outline: 1px solid #ffad6b; outline-offset: -1px; }
@container (max-width: 700px) {
  .cscom-main #fgGallery.cscom-material-gallery .fg-gallery__main { padding: 32px 26px 132px; min-height: 530px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-content { width: min(76%, 510px); }
  .cscom-main #fgGallery.cscom-material-gallery .mg-title { font-size: 28px; }
  .cscom-main #fgGallery.cscom-material-gallery .fg-gallery__rail { left: 24px; right: 117px; }
}
@container (max-width: 520px) {
  .cscom-main #fgGallery.cscom-material-gallery .fg-gallery__main { min-height: 560px; padding: 70px 20px 128px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-content { width: 100%; max-width: none; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-title { font-size: 27px; letter-spacing: -.45px; }
  .cscom-main #fgGallery.cscom-material-gallery #fgMainPreview { object-position: 66% center; }
  .cscom-main #fgGallery.cscom-material-gallery #fgMainLink::after { background: linear-gradient(90deg, #0b121bee, #0b121bc7 70%, #0b121b9e), linear-gradient(0deg, #0c131df7, transparent 70%); }
  .cscom-main #fgGallery.cscom-material-gallery .mg-download-form,
  .cscom-main #fgGallery.cscom-material-gallery .mg-download { max-width: none; flex-basis: 165px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-download { min-height: 61px; padding: 12px 13px; font-size: 13px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-badges { margin-bottom: 20px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-metrics { gap: 9px 14px; margin-bottom: 22px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-jump-links a { min-height: 30px; }
  .cscom-main #fgGallery.cscom-material-gallery .fg-gallery__rail { inset: auto 106px 20px 18px; }
  .cscom-main #fgGallery.cscom-material-gallery .fg-gallery__thumb { flex-basis: 88px; width: 88px; height: 60px; }
  .cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step { bottom: 50px; width: 33px; height: 36px; }
  .cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step--previous { right: 59px; }
  .cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-step--next { right: 19px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-index { right: 17px; bottom: 25px; min-width: 77px; }
  .cscom-main #fgGallery.cscom-material-gallery .cscom-gallery-open-hint { top: 18px; right: 18px; }
}
@container (max-width: 340px) {
  .cscom-main #fgGallery.cscom-material-gallery .fg-gallery__main { padding-inline: 16px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-title { font-size: 25px; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-downloads { flex-direction: column; }
  .cscom-main #fgGallery.cscom-material-gallery .mg-download-form,
  .cscom-main #fgGallery.cscom-material-gallery .mg-download { flex-basis: auto; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .cscom-main #fgGallery.cscom-material-gallery *,
  .cscom-main #fgGallery.cscom-material-gallery *::after { transition: none !important; scroll-behavior: auto !important; }
}