/* Shared public Index foundation. Admin does not load this stylesheet. */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("assets/fonts/archivo/archivo-latin-ext-wdth-normal.woff2") format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 100 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("assets/fonts/archivo/archivo-latin-wdth-normal.woff2") format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  --index-font: "Archivo", "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif;
  --paper: #fff;
  --sheet: #f4f4f1;
  --ink: #121212;
  --ink-2: #3a3a37;
  --muted: #55554f;
  --rule: #d8d8d3;
  --yellow: #f2c230;
  --yellow-hover: #d9a90f;
}
body.index-system {
  margin: 0;
  min-width: 320px;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--index-font);
  font-size: 1rem;
  font-variation-settings: "wdth" 100;
  font-variant-numeric: tabular-nums;
  font-synthesis: none;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}
.index-system *, .index-system *::before, .index-system *::after { box-sizing: border-box; }
.index-system ::selection { background: var(--yellow); color: var(--ink); }
.index-system { scrollbar-color: var(--muted) var(--sheet); }
.index-system :is(input,textarea) { caret-color: var(--ink); }
.index-system :is(button,input,select,textarea) { font-family: inherit; border-radius: 0; }
.index-system :is(input,textarea)::placeholder { color: var(--muted); opacity: 1; }
.index-system :is(a,button,input,select,textarea,summary):focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.index-system :is(h1,h2,h3) { font-family: var(--index-font); color: inherit; font-weight: 800; font-variation-settings: "wdth" 118; letter-spacing: -.03em; line-height: 1.1; text-wrap: balance; }
.index-system h1 { font-size: clamp(2rem,3.5vw,3.5rem); }
.index-system h2 { font-size: clamp(1.5rem,2.5vw,2.3rem); }
.index-system h3 { font-size: 1.2rem; font-weight: 700; font-variation-settings: "wdth" 110; }
.index-system :is(.site-nav,.experience-nav,.topbar) {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  position: sticky;
  top: 0;
  z-index: 30;
  height: 68px;
  min-height: 68px;
  padding: 0 max(40px,calc((100vw - 1280px) / 2));
  border-bottom: 1px solid var(--ink);
  background: var(--paper);
  backdrop-filter: none;
}
.index-system .brand { display: inline-flex; align-items: center; flex-shrink: 0; min-height: 44px; font-family: var(--index-font); font-size: 1.05rem; font-weight: 800; font-variation-settings: "wdth" 125; letter-spacing: -.01em; text-transform: none; }
.index-system .brand span { margin: 0; padding: 0 4px; background: var(--yellow); color: var(--ink); text-transform: uppercase; }
.index-system :is(.nav-main,.site-links) { display: flex; align-items: center; gap: 24px; margin-left: auto; font-family: inherit; font-size: .9rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.index-system :is(.nav-main,.site-links) a { position: relative; display: inline-flex; align-items: center; min-height: 44px; padding: 0; color: var(--ink); font-size: inherit; letter-spacing: 0; text-transform: none; white-space: nowrap; }
.index-system :is(.nav-main,.site-links) a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 5px; height: 2px; background: var(--ink); transform: scaleX(0); transform-origin: left; transition: transform 250ms cubic-bezier(.16,1,.3,1); }
.index-system :is(.nav-main,.site-links) a:is(:hover,:focus-visible,.active)::after { transform: scaleX(1); }
.index-system :is(.nav-actions,.topbar-meta) { display: flex; align-items: center; gap: 12px; margin-left: 0; }
.index-system :is(.catalog-menu,.experience-menu,.menu-toggle) { display: none; flex-shrink: 0; width: 44px; height: 44px; border: 1px solid var(--ink); border-radius: 0; color: var(--ink); background: var(--paper); }
.index-system .language-picker { font: inherit; }
.index-system .language-picker-trigger { min-height: 44px; padding: 0; gap: 0; border: 1px solid var(--ink); border-radius: 0; color: var(--ink); font-size: .8rem; font-weight: 600; }
.index-system .language-picker-trigger > span { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; min-height: 42px; padding: 0 7px; }
.index-system .language-picker-trigger .is-current { background: var(--ink); color: var(--paper); }
.index-system .language-picker-trigger i { margin-inline: 8px; }
.index-system .language-picker-menu { border: 1px solid var(--ink); border-radius: 0; background: var(--paper); box-shadow: none; }
.index-system .language-picker-menu button { border-radius: 0; }
.index-system .language-picker-menu button:is(:hover,:focus-visible,[aria-checked="true"]) { color: var(--ink); background: var(--yellow); outline-color: var(--ink); }
.index-system .catalog-header-inquiry { min-height: 44px; text-transform: none; letter-spacing: 0; font-size: .8rem; background: var(--yellow); color: var(--ink); border-color: var(--ink); }
.index-system .catalog-header-inquiry strong { background: var(--ink); color: var(--paper); }
.index-system :is(.experience-inquiry-link,.shortlist-bar) { border: 1px solid var(--ink); background: var(--yellow); color: var(--ink); box-shadow: none; font-size: .875rem; text-transform: none; letter-spacing: 0; }
.index-system .experience-inquiry-link strong { background: var(--ink); color: var(--paper); }
.index-system .shortlist-bar button { border-color: var(--ink); color: var(--ink); }
.index-system :is(.experience-inquiry-link,.catalog-header-inquiry):hover { background: var(--yellow-hover); color: var(--ink); }
.index-system :is(.control-dialog,.dialog) { border: 1px solid var(--ink); border-radius: 0; background: var(--paper); box-shadow: none; }
.index-system :is(.control-dialog,.dialog)::backdrop { background: rgb(18 18 18 / .64); backdrop-filter: none; }
.index-system .catalog-sheet::backdrop { backdrop-filter: none; }
.index-system .product-lightbox { background: var(--ink); border: 1px solid var(--rule); }
.index-system .lightbox-close { background: var(--yellow); color: var(--ink); border-color: var(--ink); }
.index-system .lightbox-close:focus-visible { outline-color: var(--paper); }
.index-system .index-footer { padding: 32px 0 90px; background: var(--ink); color: #bdbdb7; }
.index-system .index-footer-inner { width: 100%; max-width: 1360px; padding: 0 40px; margin: auto; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 40px; }
.index-system .index-footer .brand { color: var(--paper); }
.index-system .index-footer-links { display: flex; flex-wrap: wrap; gap: 0 24px; }
.index-system .index-footer-links a { display: inline-flex; align-items: center; min-height: 44px; }
.index-system .index-footer p { flex-basis: 100%; margin: 0; padding-top: 16px; border-top: 1px solid var(--muted); font-size: .875rem; }
.index-system .index-footer a:focus-visible { outline: 2px solid var(--paper); }
html[lang="zh-CN"] .index-system :is(h1,h2,h3,h1 em) { font-family: "PingFang SC", "Noto Sans CJK SC", "Microsoft YaHei", sans-serif; font-variation-settings: normal; letter-spacing: 0; line-height: 1.2; }
@media (max-width: 1200px) {
  .index-system :is(.nav-main,.site-links) { position: absolute; top: 100%; left: 0; right: 0; display: none; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 12px 40px 20px; border-bottom: 1px solid var(--ink); background: var(--paper); }
  .index-system :is(.nav-main,.site-links).open, .index-system.nav-open .site-links { display: flex; }
  .index-system :is(.nav-main,.site-links) a { white-space: normal; border-bottom: 1px solid var(--rule); }
  .index-system :is(.nav-main,.site-links) a::after { display: none; }
  .index-system :is(.catalog-menu,.experience-menu,.menu-toggle) { display: grid; place-items: center; }
  .index-system :is(.nav-actions,.topbar-meta) { margin-left: auto; }
}
@media (max-width: 680px) {
  .index-system :is(.site-nav,.experience-nav,.topbar) { padding-inline: 16px; gap: 8px; }
  .index-system .brand { font-size: .9rem; }
  .index-system :is(.nav-actions,.topbar-meta) { gap: 6px; }
  .index-system .language-picker-trigger > span { min-width: 30px; padding-inline: 4px; }
  .index-system :is(.nav-main,.site-links) { padding-inline: 16px; }
  .index-system .catalog-header-inquiry { min-width: 44px; padding-inline: 7px; }
  .index-system .catalog-header-inquiry > span { display: none; }
  .index-system .index-footer-inner { padding-inline: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  .index-system *, .index-system *::before, .index-system *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
