:root {
  --a: #986b43;
  --bg: #f6f0e6;
  --ink: #3a3027;
  --panel: #ffffff;
  --line: #00000018;
}
* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font:
    15px/1.85 "Microsoft YaHei",
    "PingFang SC",
    sans-serif;
}
a {
  color: inherit;
  text-decoration: none;
}
a:hover {
  color: var(--a);
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
a.button {
  cursor: pointer;
}
a:focus-visible,
button:focus-visible,
input:focus-visible {
  outline: 3px solid var(--a);
  outline-offset: 4px;
}
.wrap {
  width: min(1240px, 90%);
  margin: auto;
}
.utility {
  background: var(--ink);
  color: var(--bg);
  font-size: 11px;
  letter-spacing: 1px;
  padding: 7px 0;
}
.utility .wrap {
  display: flex;
  justify-content: space-between;
}
.mast {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
  padding: 23px 0;
}
.logo {
  font-size: 28px;
  font-weight: 900;
  letter-spacing: 1px;
}
.logo small {
  font-size: 10px;
  display: block;
  letter-spacing: 4px;
  opacity: 0.7;
}
.logo:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 27px;
  background: var(--a);
  margin-right: 10px;
  transform: skew(-14deg);
}
.mastnote {
  font-size: 12px;
  opacity: 0.7;
}
.navwrap {
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  position: relative;
  z-index: 2;
  background: var(--panel);
}
nav.mainnav {
  display: flex;
  gap: 35px;
  align-items: center;
  min-height: 57px;
  font-size: 14px;
  font-weight: 700;
  flex-wrap: wrap;
}
.mainnav a {
  padding: 15px 0;
}
.mainnav a[aria-current] {
  color: var(--a);
  border-bottom: 3px solid var(--a);
}
.navsearch {
  margin-left: auto;
  font-weight: 400;
}
.eyebrow {
  display: block;
  color: var(--a);
  font-size: 11px;
  letter-spacing: 3px;
  font-weight: 700;
  text-transform: uppercase;
}
h1,
h2,
h3 {
  line-height: 1.45;
}
h1 {
  font-size: clamp(36px, 4.5vw, 64px);
  line-height: 1.2;
  margin: 20px 0;
}
h2 {
  font-size: 30px;
  margin: 10px 0 17px;
}
h3 {
  font-size: 19px;
  margin: 10px 0;
}
.lead {
  font-size: 16px;
  opacity: 0.8;
  max-width: 640px;
}
.button {
  display: inline-block;
  background: var(--a);
  color: white;
  padding: 12px 25px;
  font-weight: 700;
  border: 1px solid var(--a);
  font-size: 13px;
}
.button:hover {
  color: white;
  filter: brightness(0.9);
}
.button.outline {
  background: transparent;
  color: inherit;
  border-color: currentColor;
  margin-left: 12px;
}
.actions {
  margin-top: 25px;
}
.photo {
  background-size: 200% 200%;
  background-repeat: no-repeat;
  background-color: #293d46;
  position: relative;
  overflow: hidden;
  min-height: 180px;
}
.photo.q0 {
  background-position: 0 0;
}
.photo.q1 {
  background-position: 100% 0;
}
.photo.q2 {
  background-position: 0 100%;
}
.photo.q3 {
  background-position: 100% 100%;
}
.photo.fill {
  position: absolute;
  inset: 0;
}
.photo-caption {
  font-size: 11px;
  opacity: 0.65;
}
.hero {
  position: relative;
  margin: 0;
  isolation: isolate;
}
.hero .heroimage {
  height: 540px;
}
.hero.full .heroimage,
.hero.stadium .heroimage,
.hero.cinema .heroimage,
.hero.livepitch .heroimage {
  position: absolute;
  inset: 0;
  height: auto;
  z-index: -2;
}
.hero.full,
.hero.stadium,
.hero.cinema,
.hero.livepitch {
  color: white;
  min-height: 570px;
  display: flex;
  align-items: center;
}
.hero.full:before,
.hero.stadium:before,
.hero.cinema:before,
.hero.livepitch:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #06121ee8, #06121e55 75%);
  z-index: -1;
}
.hero .copy {
  padding: 65px 0;
  max-width: 660px;
}
.hero.split,
.hero.club,
.hero.court,
.hero.gallery,
.hero.platform,
.hero.livestudio {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 45px;
  align-items: center;
  padding: 40px 0;
}
.hero.split .copy,
.hero.club .copy,
.hero.court .copy,
.hero.gallery .copy,
.hero.platform .copy,
.hero.livestudio .copy {
  padding: 20px 0;
}
.hero.split .heroimage,
.hero.club .heroimage,
.hero.court .heroimage,
.hero.gallery .heroimage,
.hero.platform .heroimage,
.hero.livestudio .heroimage {
  height: 430px;
}
.hero.mosaic,
.hero.magazine,
.hero.community {
  display: grid;
  grid-template-columns: 1.1fr 1.3fr;
  gap: 35px;
  padding: 40px 0;
}
.hero.mosaic .copy,
.hero.magazine .copy,
.hero.community .copy {
  padding: 20px 0;
}
.herogrid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.herogrid .photo:first-child {
  grid-column: 1/3;
  min-height: 300px;
}
.herogrid .photo {
  min-height: 150px;
}
.hero.dashboard,
.hero.arena,
.hero.broadcast,
.hero.world,
.hero.livewall,
.hero.livecommand,
.hero.livescreen {
  padding: 40px 0;
  display: grid;
  grid-template-columns: 1.35fr 0.75fr;
  gap: 28px;
}
.heromain {
  position: relative;
  isolation: isolate;
  padding: 38px;
  color: white;
  min-height: 490px;
  display: flex;
  flex-direction: column;
  justify-content: end;
}
.heromain:before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, #06121ef5, transparent);
  z-index: -1;
}
.heromain > .photo {
  position: absolute;
  inset: 0;
  z-index: -2;
}
.heromain h1 {
  font-size: 43px;
}
.heromain .lead {
  font-size: 14px;
}
.heroside {
  padding: 25px;
  background: var(--panel);
  border-top: 4px solid var(--a);
}
.heroside h2 {
  font-size: 22px;
}
.sideitem {
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.sideitem strong {
  display: block;
}
.ticker {
  border-bottom: 1px solid var(--line);
  background: var(--panel);
}
.ticker .wrap {
  display: flex;
  align-items: center;
  gap: 25px;
  padding: 17px 0;
}
.ticker strong {
  color: var(--a);
  white-space: nowrap;
}
.tickerlinks {
  display: flex;
  gap: 25px;
  font-size: 13px;
  flex-wrap: wrap;
}
.block {
  padding: 62px 0;
}
.block.alt {
  background: var(--panel);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.sectionhead {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 25px;
  margin-bottom: 28px;
}
.sectionhead h2 {
  margin-bottom: 0;
}
.sectionhead p {
  max-width: 570px;
  font-size: 14px;
  opacity: 0.7;
  margin: 8px 0 0;
}
.more {
  white-space: nowrap;
  font-size: 13px;
  color: var(--a);
}
.grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
}
.grid.four {
  grid-template-columns: repeat(4, 1fr);
}
.card {
  background: var(--panel);
  border: 1px solid var(--line);
}
.card .photo {
  height: 210px;
}
.cardbody {
  padding: 23px;
}
.card p {
  font-size: 13px;
  opacity: 0.78;
  margin: 10px 0 18px;
}
.tag {
  font-size: 10px;
  letter-spacing: 2px;
  color: var(--a);
  font-weight: 700;
}
.arrow {
  font-size: 12px;
  font-weight: 700;
}
.nobox {
  background: transparent;
  border: 0;
}
.nobox .cardbody {
  padding: 20px 0;
}
.feature {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
}
.feature .photo {
  min-height: 440px;
}
.feature h2 {
  font-size: 34px;
}
.feature p {
  opacity: 0.8;
}
.numbers {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border: 1px solid var(--line);
}
.number {
  padding: 25px;
  text-align: center;
  border-right: 1px solid var(--line);
}
.number:last-child {
  border: 0;
}
.number b {
  font-size: 36px;
  display: block;
  color: var(--a);
  line-height: 1.2;
}
.number span {
  font-size: 12px;
}
.fine {
  font-size: 11px;
  opacity: 0.62;
}
.skills {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.skill {
  border-top: 3px solid var(--a);
  padding: 23px;
  background: var(--panel);
}
.skill em {
  font-style: normal;
  font-size: 30px;
  opacity: 0.35;
}
.skill p {
  font-size: 13px;
  opacity: 0.75;
}
.panel {
  padding: 30px;
  background: var(--panel);
  border: 1px solid var(--line);
}
.twocol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 35px;
}
.lineitem {
  padding: 17px 0;
  border-bottom: 1px solid var(--line);
  display: flex;
  gap: 18px;
  align-items: baseline;
}
.lineitem strong {
  font-size: 16px;
}
.lineitem span {
  font-size: 11px;
  color: var(--a);
  white-space: nowrap;
}
.lineitem p {
  font-size: 12px;
  opacity: 0.7;
  margin: 4px 0;
}
.rail {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: var(--line);
  border: 1px solid var(--line);
}
.rail > a {
  background: var(--bg);
  padding: 27px;
}
.rail b {
  display: block;
  font-size: 20px;
}
.rail span {
  font-size: 12px;
  opacity: 0.7;
}
.stepgrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 30px;
}
.stepgrid > div {
  border-top: 1px solid var(--line);
  padding-top: 20px;
}
.stepgrid b {
  font-size: 35px;
  color: var(--a);
  font-weight: 400;
}
.stepgrid p {
  font-size: 13px;
  opacity: 0.75;
}
.quote {
  padding: 40px;
  border-left: 4px solid var(--a);
  font-size: 24px;
  line-height: 1.65;
  background: var(--panel);
}
.quote small {
  display: block;
  font-size: 11px;
  margin-top: 15px;
  opacity: 0.7;
}
.faqgrid {
  display: grid;
  grid-template-columns: 0.65fr 1.35fr;
  gap: 60px;
}
details {
  border-bottom: 1px solid var(--line);
  padding: 19px 0;
}
summary {
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
}
details p {
  font-size: 14px;
  opacity: 0.8;
}
.contactbox {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 50px;
  background: var(--ink);
  color: var(--bg);
  padding: 48px;
}
.contactbox h2 {
  font-size: 34px;
}
.contactbox .eyebrow {
  color: inherit;
  opacity: 0.6;
}
.contactbox .contactlinks {
  display: grid;
  gap: 10px;
  align-content: center;
}
.contactlinks a {
  border-bottom: 1px solid #9996;
  padding: 12px 0;
  font-size: 14px;
}
.schedule {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.schedule th {
  text-align: left;
  background: var(--panel);
  font-size: 11px;
  letter-spacing: 1px;
}
.schedule td,
.schedule th {
  padding: 18px 15px;
  border-bottom: 1px solid var(--line);
}
.status {
  font-size: 10px;
  border: 1px solid var(--line);
  padding: 4px 8px;
  white-space: nowrap;
}
.channel {
  position: relative;
  border: 1px solid var(--line);
  background: var(--panel);
}
.channel .photo {
  min-height: 220px;
}
.channel .cardbody h3 {
  font-size: 21px;
}
.channel .photo:after {
  content: "▶";
  position: absolute;
  left: calc(50% - 23px);
  top: calc(50% - 23px);
  width: 46px;
  height: 46px;
  line-height: 46px;
  text-align: center;
  background: #14222bbd;
  border-radius: 50%;
  color: white;
  font-size: 18px;
}
.notice {
  border-left: 3px solid var(--a);
  background: var(--panel);
  padding: 12px 18px;
  font-size: 12px;
  margin: 20px 0;
}
.breadcrumb {
  padding: 25px 0;
  font-size: 11px;
  opacity: 0.7;
}
.pagehead {
  padding: 15px 0 35px;
  max-width: 900px;
}
.pagehead h1 {
  font-size: 42px;
}
.articlelayout {
  display: grid;
  grid-template-columns: minmax(0, 820px) 1fr;
  gap: 45px;
}
.prose p {
  margin: 22px 0;
  font-size: 16px;
  line-height: 2;
}
.prose h2 {
  margin-top: 35px;
  font-size: 26px;
}
.prose .photo {
  height: 380px;
  margin-bottom: 25px;
}
.prose li {
  margin: 10px 0;
}
.callout {
  padding: 25px;
  background: var(--panel);
  border-left: 4px solid var(--a);
}
aside a {
  display: block;
  border-bottom: 1px solid var(--line);
  padding: 14px 0;
  font-size: 13px;
}
aside h2 {
  font-size: 20px;
}
.pager {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  padding: 28px 0;
}
.pager a,
.pager strong {
  padding: 7px 14px;
  border: 1px solid var(--line);
  font-size: 12px;
}
.pager strong {
  background: var(--a);
  color: white;
}
.search {
  display: flex;
  gap: 10px;
  margin: 22px 0;
}
.search input {
  flex: 1;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  background: var(--panel);
  color: var(--ink);
}
.search button,
button {
  background: var(--a);
  border: 0;
  color: white;
  padding: 10px 22px;
}
.result a {
  display: block;
  padding: 8px 0;
}
.articlelist {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 25px;
}
.articlelist article {
  border-bottom: 1px solid var(--line);
  padding-bottom: 25px;
}
.articlelist h2 {
  font-size: 20px;
}
.articlelist p {
  font-size: 13px;
  opacity: 0.75;
}
.footer {
  background: var(--ink);
  color: var(--bg);
  padding: 55px 0 25px;
  margin-top: 60px;
}
.footergrid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 35px;
}
.footer a {
  display: block;
  font-size: 12px;
  opacity: 0.75;
  margin: 9px 0;
}
.footer h3 {
  font-size: 14px;
}
.footer p {
  font-size: 12px;
  opacity: 0.65;
}
.copyright {
  border-top: 1px solid #9995;
  margin-top: 30px;
  padding-top: 20px;
  font-size: 10px;
  opacity: 0.6;
}
.skip {
  position: absolute;
  left: -9999px;
}
.skip:focus {
  left: 10px;
  top: 10px;
  z-index: 9;
  background: white;
  color: black;
  padding: 10px;
}
.videobox {
  position: relative;
  aspect-ratio: 16/9;
  background: #0b1520;
  color: white;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 25px;
  isolation: isolate;
}
.videobox > .photo {
  position: absolute;
  inset: 0;
  opacity: 0.24;
  z-index: -1;
}
.videobox h2 {
  font-size: 27px;
}
.videobox p {
  font-size: 13px;
}
.videohelp {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
  font-size: 12px;
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
}
.channelnav {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin: 20px 0;
}
.channelnav a {
  border: 1px solid var(--line);
  padding: 8px 15px;
  font-size: 12px;
}
.channelnav a[aria-current] {
  background: var(--a);
  color: white;
}
.tablewrap {
  overflow: auto;
}
.theme-blueprint .block h2 {
  font-weight: 800;
}
.theme-club .logo {
  font-family: Georgia, "Songti SC", serif;
}
.theme-club .heroimage {
  border-radius: 160px 160px 0 0;
}
.theme-urban .grid.four {
  grid-template-columns: 2fr 1fr 1fr;
}
.theme-premium h1,
.theme-premium h2 {
  font-family: Georgia, "Songti SC", serif;
  font-weight: 500;
}
.theme-premium .hero.cinema {
  min-height: 650px;
  text-align: center;
  justify-content: center;
}
.theme-premium .hero.cinema:before {
  background: #09120f77;
}
.theme-premium .copy {
  max-width: 900px;
}
.theme-premium .hero .lead {
  margin: auto;
}
.theme-basket .heroimage {
  clip-path: polygon(15% 0, 100% 0, 100% 100%, 0 100%);
}
.theme-basket h1 {
  font-style: italic;
}
.theme-research .numbers {
  border: 0;
}
.theme-research .number {
  background: var(--panel);
  text-align: left;
}
.theme-lifestyle .heroimage {
  border-radius: 3px;
}
.theme-lifestyle h1 {
  font-family: Georgia, "Songti SC", serif;
}
.theme-lifestyle .hero.magazine {
  grid-template-columns: 1fr 1.7fr;
}
.theme-milan .utility {
  background: var(--a);
  color: white;
}
.theme-milan .hero.stadium:before {
  background: linear-gradient(90deg, #160c12f0, #160c1220);
}
.theme-milanblue .hero.gallery {
  grid-template-columns: 0.8fr 1.2fr;
}
.theme-milanblue .heroimage {
  height: 490px;
}
.theme-esport .navwrap {
  background: #1e2332;
}
.theme-esport .hero.arena .heromain {
  min-height: 560px;
}
.theme-esport .card {
  border: 0;
  border-bottom: 2px solid var(--a);
}
.theme-visual .hero.broadcast {
  grid-template-columns: 1.6fr 1fr;
}
.theme-visual .heroside {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.theme-community .hero.community {
  grid-template-columns: 0.8fr 1.2fr;
}
.theme-community .card {
  border: 0;
}
.theme-digital .heroimage {
  border-radius: 15px 80px 15px 15px;
}
.theme-digital .skill {
  border: 1px solid var(--line);
  border-radius: 8px;
}
.theme-world .hero.world {
  grid-template-columns: 1.1fr 1fr;
}
.theme-world .heromain {
  min-height: 440px;
}
.theme-livehub .navwrap {
  background: #152530;
}
.theme-livehub .hero.livewall {
  grid-template-columns: 1.5fr 0.7fr;
}
.theme-livehub .heroside {
  background: #1b2e38;
}
.theme-livehub .channel {
  border: 0;
}
.theme-studio .hero.livestudio {
  grid-template-columns: 0.9fr 1.1fr;
}
.theme-studio .heroimage {
  height: 490px;
}
.theme-command .mast {
  padding: 18px 0;
}
.theme-command .navwrap {
  background: #1c293f;
}
.theme-command .hero.livecommand {
  grid-template-columns: 1.2fr 1fr;
}
.theme-command .heroside {
  border: 1px solid var(--line);
}
.theme-livefield .hero.livepitch {
  min-height: 610px;
}
.theme-livefield .hero.livepitch:before {
  background: linear-gradient(90deg, #092418f0, #09241810);
}
.theme-livescreen .navwrap {
  background: #242037;
}
.theme-livescreen .hero.livescreen {
  grid-template-columns: 1fr 0.8fr;
}
.theme-livescreen .heromain {
  border-radius: 12px;
}
.theme-livescreen .channel {
  border-radius: 10px;
  overflow: hidden;
}
@media (max-width: 850px) {
  .wrap {
    width: 91%;
  }
  .mastnote {
    display: none;
  }
  .mast {
    padding: 18px 0;
  }
  .logo {
    font-size: 24px;
  }
  .utility {
    font-size: 9px;
  }
  nav.mainnav {
    gap: 18px;
    font-size: 12px;
    padding: 8px 0;
  }
  .mainnav a {
    padding: 4px 0;
  }
  .navsearch {
    margin-left: 0;
  }
  .hero.split,
  .hero.club,
  .hero.court,
  .hero.gallery,
  .hero.platform,
  .hero.livestudio,
  .hero.mosaic,
  .hero.magazine,
  .hero.community,
  .hero.dashboard,
  .hero.arena,
  .hero.broadcast,
  .hero.world,
  .hero.livewall,
  .hero.livecommand,
  .hero.livescreen,
  .theme-lifestyle .hero.magazine,
  .theme-milanblue .hero.gallery,
  .theme-visual .hero.broadcast,
  .theme-community .hero.community,
  .theme-world .hero.world,
  .theme-livehub .hero.livewall,
  .theme-studio .hero.livestudio,
  .theme-command .hero.livecommand,
  .theme-livescreen .hero.livescreen {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 25px 0;
  }
  .hero .heroimage,
  .hero.split .heroimage,
  .hero.club .heroimage,
  .hero.court .heroimage,
  .hero.gallery .heroimage,
  .hero.platform .heroimage,
  .hero.livestudio .heroimage {
    height: 310px;
  }
  .hero.full,
  .hero.stadium,
  .hero.cinema,
  .hero.livepitch {
    min-height: 500px;
  }
  .hero .copy {
    padding: 45px 0;
  }
  .hero h1,
  .heromain h1 {
    font-size: 36px;
  }
  .hero.full .heroimage,
  .hero.stadium .heroimage,
  .hero.cinema .heroimage,
  .hero.livepitch .heroimage {
    height: auto;
  }
  .heromain {
    padding: 25px;
    min-height: 420px;
  }
  .grid,
  .skills {
    grid-template-columns: repeat(2, 1fr);
  }
  .grid.four,
  .theme-urban .grid.four {
    grid-template-columns: repeat(2, 1fr);
  }
  .feature,
  .twocol,
  .faqgrid,
  .contactbox,
  .articlelayout {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .feature .photo {
    min-height: 300px;
  }
  .block {
    padding: 40px 0;
  }
  .sectionhead {
    align-items: start;
  }
  .sectionhead h2,
  h2 {
    font-size: 25px;
  }
  .numbers,
  .rail,
  .stepgrid {
    grid-template-columns: repeat(2, 1fr);
  }
  .number {
    border-bottom: 1px solid var(--line);
  }
  .footergrid {
    grid-template-columns: 1fr 1fr;
  }
  .articlelist {
    grid-template-columns: 1fr;
  }
  .ticker .wrap {
    display: block;
  }
  .tickerlinks {
    gap: 15px;
    margin-top: 8px;
  }
  .contactbox {
    padding: 25px;
  }
  .schedule {
    min-width: 620px;
  }
  .prose .photo {
    height: 260px;
  }
  .pagehead h1 {
    font-size: 32px;
  }
  .theme-premium .hero.cinema {
    min-height: 540px;
  }
}
@media (max-width: 520px) {
  .grid,
  .skills {
    grid-template-columns: 1fr;
  }
  .grid.four,
  .theme-urban .grid.four {
    grid-template-columns: 1fr;
  }
  .footergrid {
    grid-template-columns: 1fr 1fr;
  }
  .footergrid > div:first-child {
    grid-column: 1/3;
  }
  .photo {
    min-height: 170px;
  }
  .herogrid .photo:first-child {
    min-height: 230px;
  }
  .herogrid .photo {
    min-height: 120px;
  }
  .sectionhead {
    display: block;
  }
  .more {
    display: inline-block;
    margin-top: 10px;
  }
  .actions .button {
    margin: 8px 8px 0 0;
  }
  .hero h1 {
    font-size: 33px;
  }
  .utility .wrap span:last-child {
    display: none;
  }
  .stepgrid {
    gap: 15px;
  }
  .search {
    flex-wrap: wrap;
  }
}
@media print {
  .mast,
  .utility,
  .navwrap,
  .footer,
  aside,
  .actions,
  .pager,
  .skip {
    display: none;
  }
  .wrap {
    width: 100%;
  }
  .photo {
    print-color-adjust: exact;
  }
  .articlelayout {
    display: block;
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
/* Whole-page compositions: each theme changes content geometry, not only the palette. */
@media (min-width: 1000px) {
  .theme-blueprint #projects .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-blueprint #projects .card {
    display: grid;
    grid-template-columns: 180px 1fr;
  }
  .theme-blueprint #projects .card .photo {
    height: 100%;
    min-height: 240px;
  }
  .theme-blueprint #services .grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .theme-blueprint #scope .numbers {
    margin-top: -5px;
    border: 0;
  }
  .theme-blueprint #scope .number {
    text-align: left;
    background: var(--a);
    color: white;
  }
  .theme-blueprint #scope b {
    color: white;
  }
  .theme-club #projects .grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .theme-club #projects .card .photo {
    height: 310px;
  }
  .theme-club #projects .card:nth-child(2),
  .theme-club #projects .card:nth-child(5) {
    transform: translateY(28px);
  }
  .theme-club #focus .feature {
    grid-template-columns: 1.15fr 1fr;
  }
  .theme-club #services .card {
    border: 0;
    border-bottom: 1px solid var(--line);
  }
  .theme-club #principles .quote {
    font-family: Georgia, "Songti SC", serif;
    font-size: 33px;
  }
  .theme-urban #projects .grid .card:first-child {
    grid-row: span 2;
  }
  .theme-urban #projects .grid .card:first-child .photo {
    height: 420px;
  }
  .theme-urban #projects .grid .card:last-child {
    grid-column: 2/4;
  }
  .theme-urban #projects .grid .card:last-child {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-urban #services .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-urban #services .card {
    display: grid;
    grid-template-columns: 160px 1fr;
  }
  .theme-urban #services .photo {
    height: 100%;
  }
  .theme-premium .block {
    padding: 85px 0;
  }
  .theme-premium .sectionhead {
    display: block;
    text-align: center;
    max-width: 800px;
    margin: 0 auto 40px;
  }
  .theme-premium .sectionhead p {
    margin: 10px auto;
  }
  .theme-premium #projects .grid {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }
  .theme-premium #projects .card .photo {
    height: 320px;
  }
  .theme-premium #projects .card:nth-child(even) {
    margin-top: 55px;
  }
  .theme-premium #focus .feature {
    grid-template-columns: 0.8fr 1.2fr;
  }
  .theme-premium #services .cardbody {
    padding: 30px;
  }
  .theme-premium #news .grid {
    grid-template-columns: 1.4fr 1fr 1fr;
  }
  .theme-basket #projects .grid {
    grid-template-columns: 1.5fr 1fr 1fr;
  }
  .theme-basket #projects .card:first-child {
    grid-row: span 2;
  }
  .theme-basket #projects .card:first-child .photo {
    height: 480px;
  }
  .theme-basket #projects .card:last-child {
    grid-column: 2/4;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-basket #projects .card:last-child .photo {
    height: 100%;
  }
  .theme-basket #overview .feature {
    grid-template-columns: 1.3fr 1fr;
  }
  .theme-basket #services .card {
    border: 0;
    border-left: 4px solid var(--a);
  }
  .theme-research #projects .grid {
    grid-template-columns: 1fr;
  }
  .theme-research #projects .card {
    display: grid;
    grid-template-columns: 230px 1fr;
  }
  .theme-research #projects .card .photo {
    height: 180px;
  }
  .theme-research #projects .cardbody {
    display: grid;
    grid-template-columns: 65px 180px 1fr 110px;
    gap: 20px;
    align-items: center;
  }
  .theme-research #projects .cardbody p {
    margin: 0;
  }
  .theme-research #projects .cardbody h3 {
    margin: 0;
  }
  .theme-research #services .grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .theme-research #scope .numbers {
    gap: 20px;
  }
  .theme-research #scope .number {
    border: 1px solid var(--line);
  }
  .theme-lifestyle #projects .grid {
    grid-template-columns: 1fr 1fr;
    gap: 45px;
  }
  .theme-lifestyle #projects .card {
    border: 0;
    background: transparent;
  }
  .theme-lifestyle #projects .card .photo {
    height: 330px;
  }
  .theme-lifestyle #projects .card:nth-child(even) {
    padding-top: 65px;
  }
  .theme-lifestyle #services .grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .theme-lifestyle #news .grid {
    grid-template-columns: 1.5fr 1fr 1fr;
  }
  .theme-lifestyle #news .grid .card:first-child .photo {
    height: 330px;
  }
  .theme-lifestyle #principles .quote {
    font-size: 34px;
  }
  .theme-milan #projects .grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
  }
  .theme-milan #projects .card {
    border: 1px solid var(--line);
    margin: -1px 0 0 -1px;
  }
  .theme-milan #projects .photo {
    height: 260px;
  }
  .theme-milan #scope {
    background: var(--ink);
    color: var(--bg);
  }
  .theme-milan #scope .number {
    border-color: #ffffff33;
  }
  .theme-milan #services .card:nth-child(2) {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-milan #services .card:nth-child(2) .photo {
    height: 100%;
  }
  .theme-milan #services .card:nth-child(3) {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-milan #services .card:nth-child(3) .photo {
    height: 100%;
  }
  .theme-milanblue #projects .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-milanblue #projects .card {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    border: 0;
  }
  .theme-milanblue #projects .card:nth-child(4n + 3) > a,
  .theme-milanblue #projects .card:nth-child(4n + 4) > a {
    order: 2;
  }
  .theme-milanblue #projects .photo {
    height: 280px;
  }
  .theme-milanblue #focus .feature > div:first-child {
    order: 2;
  }
  .theme-milanblue #focus .feature {
    grid-template-columns: 1.2fr 1fr;
  }
  .theme-esport #projects .grid {
    grid-template-columns: 1.5fr 1fr 1fr;
  }
  .theme-esport #projects .card:first-child {
    grid-row: span 2;
  }
  .theme-esport #projects .card:first-child .photo {
    height: 520px;
  }
  .theme-esport #projects .card:nth-child(2) {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-esport #projects .card:nth-child(2) .photo {
    height: 100%;
  }
  .theme-esport #projects .card:last-child {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-esport #projects .card:last-child .photo {
    height: 100%;
  }
  .theme-esport #services .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-esport #scope .numbers {
    border-color: var(--a);
  }
  .theme-visual #projects .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-visual #projects .card {
    display: grid;
    grid-template-columns: 220px 1fr;
    border: 0;
  }
  .theme-visual #projects .photo {
    height: 100%;
    min-height: 240px;
  }
  .theme-visual #focus .feature {
    grid-template-columns: 1fr 1.4fr;
  }
  .theme-visual #services .grid {
    gap: 35px;
  }
  .theme-visual #steps .stepgrid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-visual #steps .stepgrid > div {
    padding: 25px;
    background: var(--panel);
  }
  .theme-community #projects .grid {
    grid-template-columns: 1.5fr 1fr 1fr;
  }
  .theme-community #projects .card:first-child {
    grid-row: span 2;
  }
  .theme-community #projects .card:first-child .photo {
    height: 500px;
  }
  .theme-community #projects .card:nth-child(2) {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-community #projects .card:last-child {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-community #services .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-community #services .card {
    border-top: 3px solid var(--a);
  }
  .theme-digital #projects .grid {
    grid-template-columns: 1fr 1fr;
    gap: 28px;
  }
  .theme-digital #projects .card {
    border-radius: 14px;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-digital #projects .photo {
    height: 100%;
    min-height: 280px;
  }
  .theme-digital #overview .photo {
    border-radius: 18px;
  }
  .theme-digital #focus .photo {
    border-radius: 80px 18px 18px 18px;
  }
  .theme-digital #services .card {
    border-radius: 15px;
    overflow: hidden;
  }
  .theme-world #projects .grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
  }
  .theme-world #projects .card {
    border: 0;
    border-bottom: 2px solid var(--ink);
  }
  .theme-world #projects .photo {
    height: 290px;
  }
  .theme-world #scope .numbers {
    border: 0;
  }
  .theme-world #scope .number {
    text-align: left;
    border: 0;
    border-top: 3px solid var(--a);
  }
  .theme-world #news .grid {
    grid-template-columns: 1fr 1.6fr 1fr;
  }
  .theme-world #news .card:nth-child(2) .photo {
    height: 330px;
  }
  .theme-livehub #channels .grid {
    grid-template-columns: 1.4fr 1fr 1fr;
  }
  .theme-livehub #channels .channel:first-child {
    grid-row: span 2;
  }
  .theme-livehub #channels .channel:first-child .photo {
    min-height: 490px;
  }
  .theme-livehub #channels .channel:last-child {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-livehub #channels .channel:last-child .photo {
    height: 100%;
  }
  .theme-livehub #schedule .tablewrap {
    background: #162632;
    padding: 15px;
  }
  .theme-studio #channels .grid {
    grid-template-columns: 1fr 1fr;
  }
  .theme-studio #channels .channel {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-studio #channels .photo {
    height: 100%;
    min-height: 270px;
  }
  .theme-studio #production .feature {
    grid-template-columns: 1.4fr 1fr;
  }
  .theme-studio #schedule .schedule th {
    background: var(--ink);
    color: var(--bg);
  }
  .theme-command #channels .grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
  }
  .theme-command #channels .channel .photo {
    min-height: 190px;
  }
  .theme-command #channels .channel .cardbody {
    padding: 18px;
  }
  .theme-command #overview .feature {
    grid-template-columns: 1fr 1.4fr;
  }
  .theme-command #schedule .schedule td {
    padding: 25px 18px;
  }
  .theme-command #scope .numbers {
    border: 0;
    background: #17283f;
  }
  .theme-livefield #channels .grid {
    grid-template-columns: 1.4fr 1fr 1fr;
  }
  .theme-livefield #channels .channel:first-child {
    grid-column: span 3;
    display: grid;
    grid-template-columns: 1.6fr 1fr;
  }
  .theme-livefield #channels .channel:first-child .photo {
    height: 350px;
  }
  .theme-livefield #channels .channel:last-child {
    grid-column: span 2;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .theme-livefield #production .feature > div:first-child {
    order: 2;
  }
  .theme-livefield #production .feature {
    grid-template-columns: 1fr 1.4fr;
  }
  .theme-livescreen #channels .grid {
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .theme-livescreen #channels .channel .photo {
    height: 300px;
  }
  .theme-livescreen #channels .channel:nth-child(even) {
    transform: translateY(35px);
  }
  .theme-livescreen #production .feature .photo {
    height: 520px;
    border-radius: 15px;
  }
  .theme-livescreen #schedule .tablewrap {
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 20px;
  }
  .theme-livescreen #focus .feature > div:first-child {
    order: 2;
  }
}

:root {
  --heading-font: "Field Serif";
}

@font-face {
  font-family: "Field Sans";
  src: url("fonts/field-sans-400.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Field Sans";
  src: url("fonts/field-sans-700.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Field Serif";
  src: url("fonts/field-serif-400.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Field Serif";
  src: url("fonts/field-serif-700.woff") format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
body {
  font-family: "Field Sans", "Microsoft YaHei", "PingFang SC", sans-serif;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
h1,
h2 {
  font-family: var(--heading-font, "Field Sans"), "Microsoft YaHei", sans-serif;
  font-weight: 700;
  letter-spacing: -0.025em;
}
h1 {
  line-height: 1.28;
}
h2 {
  line-height: 1.5;
}
h3 {
  font-family: "Field Sans", "Microsoft YaHei", sans-serif;
  font-weight: 700;
  letter-spacing: -0.012em;
  line-height: 1.6;
}
.lead {
  line-height: 1.95;
}
.cardbody p {
  font-size: 14px;
  line-height: 1.95;
  opacity: 0.86;
}
.cardbody h3 {
  font-size: 20px;
  line-height: 1.55;
  margin: 11px 0 14px;
}
.cardbody {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.cardbody .arrow {
  margin-top: auto;
  padding-top: 5px;
}
.articlelist p {
  font-size: 14px;
  line-height: 1.95;
}
.prose p {
  font-size: 16px;
  line-height: 2.05;
}
.tag,
.eyebrow,
.utility {
  font-family: "Field Sans", sans-serif;
  font-weight: 700;
  letter-spacing: 0.1em;
}
.fine,
.photo-caption {
  font-size: 12px;
  line-height: 1.8;
}
.number b,
.stepgrid b {
  font-variant-numeric: lining-nums tabular-nums;
  letter-spacing: -0.04em;
}
.mainnav {
  font-family: "Field Sans", sans-serif;
}
.mainnav a {
  white-space: nowrap;
}
.logo.brand-signature {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  letter-spacing: 0;
  line-height: 1.1;
  max-width: 100%;
  padding: 0;
  opacity: 1;
  color: inherit;
  flex-shrink: 0;
}
.logo:before {
  display: none !important;
  content: none !important;
}
.logo-mark {
  display: block;
  width: 51px;
  height: 51px;
  flex: 0 0 51px;
  background-image: url("logo-sprite.png");
  background-size: 500% 400%;
  background-repeat: no-repeat;
}
.brand-type {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wordmark {
  font-family: "Field Sans", Arial, sans-serif;
  font-size: 31px;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.04em;
  white-space: nowrap;
}
.logo .brand-type small {
  font-family: "Field Sans", sans-serif;
  font-size: 9px;
  font-weight: 400;
  letter-spacing: 0.13em;
  line-height: 1.4;
  opacity: 0.65;
}
.wordmark .cn {
  font-size: 0.82em;
  letter-spacing: 0.02em;
  margin-left: 3px;
}
.footer .logo.brand-signature {
  font-size: 31px;
  margin: 0 0 10px;
}
.footer .logo .wordmark {
  font-size: 28px;
}
.footer .logo-mark {
  width: 43px;
  height: 43px;
  flex-basis: 43px;
}
.brand-set-1 .wordmark,
.brand-set-5 .wordmark,
.brand-set-10 .wordmark,
.brand-set-17 .wordmark,
.brand-set-19 .wordmark {
  font-style: italic;
  letter-spacing: -0.06em;
}
.brand-set-4 .wordmark,
.brand-set-7 .wordmark,
.brand-set-8 .wordmark,
.brand-set-16 .wordmark {
  font-family: "Field Serif", Georgia, serif;
}
.brand-set-9 .wordmark {
  font-family: "Field Serif", Georgia, serif;
  letter-spacing: 0.035em;
}
.brand-set-15 .wordmark {
  letter-spacing: -0.055em;
}
.brand-set-18 .wordmark {
  text-transform: lowercase;
  letter-spacing: -0.04em;
}
@media (max-width: 850px) {
  .logo.brand-signature {
    gap: 10px;
  }
  .logo-mark {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }
  .wordmark {
    font-size: 28px;
  }
  .mainnav a {
    font-size: 12px;
  }
  .cardbody h3 {
    font-size: 19px;
  }
  .cardbody p {
    font-size: 14px;
    line-height: 1.95;
  }
  .mast {
    gap: 18px;
  }
  .prose p {
    font-size: 15px;
  }
  .logo .brand-type small {
    font-size: 8px;
  }
}
@media (max-width: 520px) {
  .logo-mark {
    width: 40px;
    height: 40px;
    flex-basis: 40px;
  }
  .wordmark {
    font-size: 26px;
  }
  .logo .brand-type small {
    letter-spacing: 0.09em;
  }
  .mainnav {
    column-gap: 16px !important;
    row-gap: 4px !important;
  }
  .cardbody {
    padding: 22px;
  }
  .theme-research #projects .cardbody {
    display: flex;
  }
}

.mark-7 {
  background-position: 50% 33.333333333333336%;
}

body[class*="brand-set-"] h1,
body[class*="brand-set-"] h2 {
  font-family: var(--heading-font, "Field Sans"), "Microsoft YaHei", sans-serif;
  font-weight: 700;
}

.contact-entry {
  padding: 62px 0;
}
.contact-entry .contact-layout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 42px;
  align-items: center;
  background: var(--ink);
  color: var(--bg);
  padding: 42px;
  border-radius: 14px;
}
.contact-entry .contact-layout h2 {
  font-size: 30px;
  line-height: 1.5;
  color: inherit;
  margin: 16px 0;
}
.contact-entry .contact-copy {
  font-size: 14px;
  line-height: 1.95;
  opacity: 0.83;
}
.contact-entry .contact-items {
  display: grid;
  gap: 12px;
  margin-top: 25px;
}
.contact-entry .contact-item {
  background: #ffffff12;
  padding: 14px 18px;
  border: 1px solid #ffffff18;
  border-radius: 8px;
  font-size: 14px;
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  gap: 10px;
  overflow-wrap: anywhere;
}
.contact-entry .contact-item span {
  font-size: 12px;
  opacity: 0.65;
}
.contact-entry .contact-demo-note {
  font-size: 11px;
  line-height: 1.8;
  opacity: 0.6;
  margin: 16px 0 0;
}
.contact-form {
  background: #ffffff12;
  border: 1px solid #ffffff26;
  border-radius: 14px;
  padding: 28px;
  display: grid;
  gap: 15px;
}
.contact-form label {
  display: grid;
  gap: 7px;
  font-size: 12px;
  font-weight: 700;
}
.contact-form input,
.contact-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #ffffff26;
  background: #ffffff0d;
  color: inherit;
  border-radius: 8px;
  padding: 12px 14px;
  font-family: inherit;
  font-size: 13px;
  line-height: 1.8;
}
.contact-form input::placeholder,
.contact-form textarea::placeholder {
  color: inherit;
  opacity: 0.45;
}
.contact-form textarea {
  resize: vertical;
  min-height: 118px;
}
.contact-form button {
  border-radius: 8px;
  font-weight: 700;
  padding: 13px 22px;
  background: var(--a);
  color: white;
  line-height: 1.8;
}
.contact-form .contact-status {
  font-size: 12px;
  line-height: 1.8;
  margin: 0;
}
.article-date {
  font-family: "Field Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.025em;
  color: inherit;
  opacity: 0.65;
  display: inline-block;
  line-height: 1.9;
  margin: 3px 0 12px;
}
.article-meta {
  margin: 0 0 20px;
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--line);
  padding-bottom: 12px;
}
.article-meta .article-date {
  margin: 0;
  opacity: 0.8;
}
.copyright {
  line-height: 1.95;
  overflow-wrap: anywhere;
}
.cardbody,
.card,
.channel,
.hero > div,
.hero .copy,
.grid > * {
  min-width: 0;
}
.cardbody h3,
.cardbody p {
  overflow-wrap: anywhere;
}
.cardbody {
  padding: 25px;
}
@media (min-width: 850px) {
  .theme-blueprint .hero.split {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 48px;
  }
  .theme-blueprint #projects .grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px;
  }
  .theme-blueprint #projects .card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }
  .theme-blueprint #projects .card > a {
    display: block;
    width: 100%;
  }
  .theme-blueprint #projects .card .photo {
    height: 260px;
    min-height: 260px;
    width: 100%;
  }
  .theme-blueprint #projects .cardbody {
    padding: 28px;
    min-width: 0;
    flex: 1;
  }
  .theme-blueprint #projects .cardbody h3 {
    margin-top: 10px;
  }
  .theme-blueprint #projects .cardbody p {
    margin: 12px 0 22px;
  }
}
@media (max-width: 850px) {
  .contact-entry {
    padding: 38px 0;
  }
  .contact-entry .contact-layout {
    grid-template-columns: 1fr;
    gap: 25px;
    padding: 25px;
  }
  .contact-entry .contact-layout h2 {
    font-size: 25px;
  }
  .contact-form {
    padding: 20px;
  }
  .contact-entry .contact-item {
    grid-template-columns: 65px minmax(0, 1fr);
    padding: 13px;
  }
  .theme-blueprint .hero.split {
    grid-template-columns: 1fr;
    gap: 25px;
  }
  .theme-blueprint #projects .card {
    display: block;
  }
  .theme-blueprint #projects .card .photo {
    height: 250px;
  }
  .theme-blueprint #projects .cardbody {
    padding: 25px;
  }
}

.site-header {
  position: relative;
  z-index: 3;
}
.header-core {
  position: relative;
}
.site-header .mast,
.site-header .navwrap,
.site-header .mainnav {
  min-width: 0;
}
.site-header .mastnote {
  max-width: 55%;
  line-height: 1.85;
}
.site-header .mainnav {
  column-gap: 27px;
  row-gap: 4px;
}
.site-header .mast {
  gap: 30px;
}
.header-0 .mast {
  border-left: 5px solid var(--a);
  padding-left: 22px;
}
.header-0 .navwrap {
  border-top: 0;
  border-bottom: 3px solid var(--a);
}
.header-1 .header-core {
  width: min(1320px, 94%);
  margin: auto;
  display: flex;
  align-items: center;
  gap: 35px;
}
.header-1 .mast {
  width: auto;
  margin: 0;
  padding: 25px 0;
  flex-shrink: 0;
}
.header-1 .mastnote {
  display: none;
}
.header-1 .navwrap {
  flex: 1;
  border: 0;
  background: transparent;
}
.header-1 .mainnav {
  width: 100%;
  justify-content: flex-end;
  gap: 16px;
  font-size: 13px;
}
.header-2 .mast {
  flex-direction: column;
  gap: 14px;
  text-align: center;
  padding: 30px 0;
}
.header-2 .mastnote {
  max-width: 720px;
  font-size: 12px;
}
.header-2 .mainnav {
  justify-content: center;
}
.header-2 .navwrap {
  border-top: 0;
  border-bottom: 3px double var(--line);
}
.header-3 {
  background: var(--ink);
  color: var(--bg);
}
.header-3 .navwrap {
  background: transparent;
  border-color: #ffffff30;
}
.header-3 .mainnav a[aria-current] {
  color: var(--bg);
  border-bottom-color: var(--a);
}
.header-3 .mast {
  padding: 30px 0;
}
.header-4 .mast {
  border-bottom: 4px solid var(--ink);
  padding: 33px 0;
}
.header-4 .wordmark {
  font-size: 39px;
}
.header-4 .navwrap {
  background: transparent;
  border-top: 0;
}
.header-4 .mainnav {
  justify-content: space-between;
  gap: 12px;
}
.header-5 .header-core {
  display: grid;
  grid-template-columns: minmax(230px, 0.7fr) minmax(0, 2fr);
  width: min(1320px, 94%);
  margin: auto;
  align-items: stretch;
}
.header-5 .mast {
  background: var(--a);
  color: white;
  width: 100%;
  padding: 28px;
  margin: 0;
}
.header-5 .mastnote {
  display: none;
}
.header-5 .navwrap {
  display: flex;
  align-items: center;
  border: 0;
}
.header-5 .mainnav {
  justify-content: center;
  width: 90%;
  gap: 20px;
  font-size: 13px;
}
.header-6 .header-core {
  display: flex;
  flex-direction: column;
}
.header-6 .navwrap {
  order: -1;
  background: var(--ink);
  color: var(--bg);
  border: 0;
}
.header-6 .mainnav {
  justify-content: flex-end;
  font-size: 12px;
  min-height: 46px;
}
.header-6 .mainnav a {
  padding: 10px 0;
}
.header-6 .mast {
  padding: 28px 0;
}
.header-6 .logo-mark {
  width: 57px;
  height: 57px;
  flex-basis: 57px;
}
.header-7 .mast {
  align-items: flex-end;
  padding: 35px 0 25px;
}
.header-7 .mastnote {
  border-left: 1px solid var(--line);
  padding-left: 25px;
  max-width: 420px;
}
.header-7 .navwrap {
  background: var(--a);
  color: white;
  border: 0;
}
.header-7 .mainnav a[aria-current] {
  color: white;
  border-color: white;
}
.header-8 .mast {
  padding: 30px 0;
  border-bottom: 1px solid var(--line);
}
.header-8 .navwrap {
  background: transparent;
  border: 0;
}
.header-8 .mainnav {
  justify-content: center;
  gap: 37px;
  min-height: 65px;
}
.header-8 .mainnav a {
  padding: 9px 14px;
}
.header-8 .mainnav a[aria-current] {
  background: var(--a);
  border: 0;
  border-radius: 3px;
  color: white;
}
.header-9 .header-core {
  background: var(--panel);
  margin: 20px auto;
  width: min(1280px, 94%);
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
}
.header-9 .mast {
  width: 94%;
  padding: 23px 0;
}
.header-9 .navwrap {
  background: transparent;
}
.header-9 .mainnav {
  width: 94%;
  justify-content: space-between;
  gap: 10px;
}
.header-10 {
  background: #111320;
  color: #f4f3ff;
  border-bottom: 1px solid var(--a);
}
.header-10 .header-core {
  display: flex;
  gap: 30px;
  align-items: center;
  width: min(1320px, 94%);
  margin: auto;
}
.header-10 .mast {
  width: auto;
  flex-shrink: 0;
  margin: 0;
  padding: 24px 0;
}
.header-10 .mastnote {
  display: none;
}
.header-10 .navwrap {
  background: transparent;
  flex: 1;
  border: 0;
}
.header-10 .mainnav {
  width: 100%;
  justify-content: flex-end;
  gap: 17px;
  font-size: 12px;
}
.header-11 .mast {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 35px;
  padding: 30px 0;
}
.header-11 .mastnote {
  justify-self: end;
  max-width: 430px;
  text-align: right;
}
.header-11 .navwrap {
  background: var(--ink);
  color: var(--bg);
  border: 0;
}
.header-11 .mainnav {
  justify-content: space-between;
  gap: 12px;
}
.header-12 .mast {
  justify-content: center;
  position: relative;
  padding: 36px 0;
}
.header-12 .mastnote {
  display: none;
}
.header-12 .logo-mark {
  width: 60px;
  height: 60px;
  flex-basis: 60px;
}
.header-12 .wordmark {
  font-size: 35px;
}
.header-12 .mainnav {
  justify-content: center;
  font-size: 13px;
  gap: 32px;
}
.header-12 .navwrap {
  border-top: 2px solid var(--a);
  background: transparent;
}
.header-13 .header-core {
  width: min(1300px, 94%);
  margin: auto;
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  align-items: center;
  gap: 30px;
  padding: 18px 0;
}
.header-13 .mast {
  width: 100%;
  margin: 0;
  padding: 15px 0;
}
.header-13 .mastnote {
  display: none;
}
.header-13 .navwrap {
  background: transparent;
  border: 0;
}
.header-13 .mainnav {
  width: 100%;
  justify-content: flex-end;
  gap: 14px;
  font-size: 12px;
}
.header-13 {
  border-bottom: 3px solid var(--a);
}
.header-14 .mast {
  border-top: 5px solid var(--a);
  padding: 32px 0;
}
.header-14 .mastnote {
  font-family: "Field Serif", serif;
  font-size: 15px;
  max-width: 540px;
}
.header-14 .navwrap {
  background: transparent;
  border-bottom: 1px solid var(--ink);
}
.header-14 .mainnav {
  justify-content: space-around;
  gap: 12px;
}
.header-15 .header-core {
  background: #132b34;
  color: #e9f8f8;
}
.header-15 .mast {
  padding: 19px 0;
}
.header-15 .mastnote {
  font-size: 11px;
  max-width: 420px;
  border: 1px solid #ffffff30;
  padding: 8px 14px;
}
.header-15 .navwrap {
  background: #0b2029;
  border-color: #ffffff20;
}
.header-15 .mainnav {
  justify-content: space-between;
  gap: 10px;
  min-height: 50px;
}
.header-16 .header-core {
  display: flex;
  align-items: stretch;
  width: min(1280px, 94%);
  margin: 25px auto;
  border: 1px solid var(--line);
}
.header-16 .mast {
  width: auto;
  min-width: 250px;
  padding: 25px;
  margin: 0;
  border-right: 1px solid var(--line);
  justify-content: center;
}
.header-16 .mastnote {
  display: none;
}
.header-16 .navwrap {
  flex: 1;
  display: flex;
  align-items: center;
  background: transparent;
  border: 0;
}
.header-16 .mainnav {
  width: 93%;
  justify-content: center;
  gap: 23px;
  font-size: 13px;
}
.header-17 .mast {
  padding: 18px 0;
}
.header-17 .mastnote {
  font-size: 11px;
  letter-spacing: 0.07em;
  max-width: 450px;
}
.header-17 .navwrap {
  background: var(--a);
  border: 0;
  color: white;
}
.header-17 .mainnav {
  min-height: 48px;
  justify-content: space-between;
  gap: 10px;
}
.header-17 .mainnav a {
  padding: 10px 0;
}
.header-17 .mainnav a[aria-current] {
  color: white;
  border-bottom-color: white;
}
.header-18 .mast {
  flex-direction: row-reverse;
  padding: 30px 0;
}
.header-18 .mastnote {
  max-width: 480px;
  border-left: 4px solid var(--a);
  padding-left: 20px;
}
.header-18 .mainnav {
  justify-content: flex-end;
  gap: 27px;
}
.header-18 .navwrap {
  background: transparent;
  border-top: 1px solid var(--ink);
}
.header-19 .mast {
  justify-content: center;
  padding: 28px 0;
}
.header-19 .mastnote {
  display: none;
}
.header-19 .navwrap {
  background: #242037;
  border: 0;
}
.header-19 .mainnav {
  justify-content: center;
  gap: 30px;
  min-height: 60px;
}
.header-19 .mainnav a[aria-current] {
  background: var(--a);
  color: white;
  border: 0;
  border-radius: 20px;
  padding: 6px 20px;
}
@media (max-width: 1100px) {
  .header-1 .header-core,
  .header-10 .header-core,
  .header-16 .header-core {
    display: block;
  }
  .header-1 .mast,
  .header-10 .mast {
    justify-content: center;
  }
  .header-1 .mainnav,
  .header-10 .mainnav {
    justify-content: center;
    padding: 0 0 12px;
  }
  .header-13 .header-core,
  .header-5 .header-core {
    grid-template-columns: 220px minmax(0, 1fr);
  }
  .header-5 .mainnav,
  .header-13 .mainnav {
    gap: 13px;
  }
  .header-16 .mast {
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .header-16 .mainnav {
    padding: 12px 0;
  }
  .header-8 .mainnav,
  .header-19 .mainnav {
    gap: 17px;
  }
}
@media (max-width: 850px) {
  .site-header .header-core {
    display: block !important;
    width: 100%;
    margin: 0;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
  }
  .site-header .mast {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    width: 91%;
    margin: auto;
    padding: 20px 0;
    border: 0;
    background: transparent;
    color: inherit;
  }
  .site-header .mastnote {
    display: none !important;
  }
  .site-header .navwrap {
    width: 100%;
    display: block;
  }
  .site-header .mainnav {
    width: 91%;
    margin: auto;
    justify-content: flex-start;
    gap: 16px;
    min-height: 45px;
    padding: 8px 0;
    font-size: 12px;
  }
  .site-header .mainnav a {
    padding: 4px 0;
  }
  .site-header .logo-mark {
    width: 43px;
    height: 43px;
    flex-basis: 43px;
  }
  .site-header .wordmark {
    font-size: 28px;
  }
  .header-2 .mast,
  .header-12 .mast,
  .header-19 .mast {
    justify-content: center;
  }
  .header-6 .header-core .navwrap {
    order: 0;
  }
  .header-5 .mast {
    background: var(--a);
    color: white;
    padding: 20px;
    width: 100%;
  }
  .header-8 .mainnav a[aria-current],
  .header-19 .mainnav a[aria-current] {
    padding: 4px 12px;
  }
  .header-4 .mast {
    border-bottom: 3px solid var(--ink);
  }
  .header-18 .mast {
    flex-direction: row-reverse;
  }
}

figure.photo {
  margin: 0;
  background-image: none !important;
  background-size: auto !important;
  overflow: hidden;
}
figure.photo > img {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.credit-list {
  display: grid;
  gap: 18px;
}
.credit-item {
  padding: 22px;
  border: 1px solid var(--line);
  background: var(--panel);
  overflow-wrap: anywhere;
}
.credit-item h2 {
  font-family: "Field Sans", sans-serif;
  font-size: 17px;
  margin: 0 0 12px;
}
.credit-item p {
  font-size: 13px;
  margin: 6px 0;
}
.credit-item a {
  color: var(--a);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.contact-entry .contact-layout {
  background: #182a32;
  background: color-mix(in srgb, var(--a) 12%, #16232b);
  color: #f4f6f7;
}
.contact-form button {
  background: #2451be;
  background: color-mix(in srgb, var(--a) 70%, #102631);
}
.brand-set-2 .utility,
.brand-set-9 .utility,
.brand-set-12 .utility,
.brand-set-16 .utility {
  display: none;
}
.brand-set-4 .utility,
.brand-set-7 .utility {
  background: transparent;
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
