/* Shared Figma Site chrome: nav pill, download sheet, footer, tagline.
   Loaded by the landing and every destination page. Body gets .site-figma
   from site-chrome.js. */

.site-figma .nav,
.site-figma .nav.is-scrolled,
.site-figma .nav.is-on-light.is-scrolled,
.site-figma .nav.is-on-dark.is-scrolled {
  position: fixed;
  top: 40px;
  left: 0;
  right: 0;
  width: 100%;
  height: 72px;
  padding: 0 60px;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  transform: none;
  background: none;
  border: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  z-index: 200;
}
.site-figma .nav.is-hero-logo {
  position: absolute;
  top: 61px;
  left: 60px;
  right: auto;
  width: auto;
  height: 30px;
  padding: 0;
  justify-content: flex-start;
  z-index: 200;
}
.site-figma .nav__brand {
  width: 20px;
  height: 27px;
  padding: 0;
  flex: none;
  margin-right: 24px;
}
.site-figma .nav__brand-mark {
  width: 20px;
  height: 27px;
  filter: none;
}
.site-figma .nav.is-on-dark .nav__brand-mark {
  filter: invert(1) brightness(1.6);
}
.site-figma .nav__pill {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 577px;
  height: 72px;
  padding: 0 40px;
  border-radius: 100px;
  position: absolute;
  left: 50%;
  margin-left: -288.5px;
  overflow: hidden;
  /* Figma 8978:21996 light: white 20% + Glass r=27, 315°, intensity 0.8 */
  background: rgb(255 255 255 / 20%);
  -webkit-backdrop-filter: blur(27px);
  backdrop-filter: blur(27px);
  box-shadow:
    inset 1px 1px 0 rgb(255 255 255 / 40%),
    inset -1px -1px 0 rgb(0 0 0 / 12%);
}
.site-figma .nav__pill::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  /* Figma Glass lightAngle 315, lightIntensity 0.8, splay 0.1 */
  background: linear-gradient(135deg, rgb(255 255 255 / 22%) 0%, rgb(255 255 255 / 0%) 28%);
}
.site-figma .nav__brand,
.site-figma .nav__links {
  position: relative;
  z-index: 1;
}
.site-figma .nav__links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
}
.site-figma .nav__links a {
  font:
    400 20px/1.2 'Instrument Serif',
    serif;
  color: #201e1b;
  text-decoration: none;
  letter-spacing: 0;
  text-transform: uppercase;
  position: relative;
  white-space: nowrap;
}
.site-figma .nav__links a.is-active::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 1px;
  background: currentColor;
}
.site-figma .nav.is-on-dark .nav__pill {
  /* Figma 8978:21907 / 8978:21731: white 10% + same Glass */
  background: rgb(255 255 255 / 10%);
}
.site-figma .nav.is-on-dark .nav__links a {
  color: #f5f5f5;
}
.site-figma .nav__store-btns {
  display: flex;
  position: relative;
  z-index: 1;
}
.site-figma .nav__download,
.site-figma .nav.is-on-light .nav__download {
  width: 134px;
  height: 48px;
  padding: 10px 16px;
  border: 0;
  border-radius: 0;
  background: #201e1b;
  color: #f5f5f5;
  font:
    400 20px/24px 'Source Serif 4',
    Georgia,
    serif;
  cursor: pointer;
}
.site-figma .nav__download::before,
.site-figma .nav.is-on-light .nav__download::before {
  display: none;
}
.site-figma .nav__download-label {
  color: #f5f5f5;
  font: inherit;
}
.site-figma .nav.is-on-dark .nav__download {
  background: #f5f5f5;
  color: #201e1b;
}
.site-figma .nav.is-on-dark .nav__download-label {
  color: #201e1b;
}
.site-figma .nav.is-hero-logo .nav__links,
.site-figma .nav.is-hero-logo .nav__store-btns,
.site-figma .nav.is-hero-logo .nav__toggle {
  display: none;
}
.site-figma .nav.is-hero-logo .nav__pill {
  display: flex;
  width: auto;
  height: 30px;
  padding: 0;
  left: 0;
  margin-left: 0;
  background: none;
  position: static;
  overflow: visible;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
}
.site-figma .nav.is-hero-logo .nav__pill::before {
  content: none;
}
.site-figma .nav.is-hero-logo .nav__brand {
  width: 67px;
  height: 30px;
  margin: 0;
}
.site-figma .nav.is-hero-logo .nav__brand-mark {
  width: 67px;
  height: 30px;
}
.site-figma .nav__toggle {
  display: none;
}
.site-figma .nav::before,
.site-figma .nav::after {
  display: none;
}
.site-figma #about,
.site-figma #app,
.site-figma #sec07,
.site-figma #gift,
.site-figma #faq {
  scroll-margin-top: 120px;
}

@media (max-width: 900px) {
  .site-figma .nav:not(.is-hero-logo) {
    top: 16px;
    padding: 0 16px;
    justify-content: space-between;
  }
  .site-figma .nav:not(.is-hero-logo) .nav__pill {
    position: static;
    margin: 0;
    width: auto;
    height: 30px;
    padding: 0;
    background: none;
  }
  .site-figma .nav:not(.is-hero-logo) .nav__links {
    display: none;
  }
  .site-figma .nav.is-menu-open:not(.is-hero-logo) .nav__links {
    display: flex;
    position: absolute;
    top: 56px;
    left: 16px;
    right: 16px;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    background: rgb(246 246 246 / 96%);
    border-radius: 16px;
  }
  .site-figma .nav.is-menu-open.is-on-dark:not(.is-hero-logo) .nav__links {
    background: rgb(13 13 13 / 96%);
  }
  .site-figma .nav:not(.is-hero-logo) .nav__toggle {
    display: flex;
  }
}

/* Figma 8978:29091 — 402×674 centered download sheet */
body.site-figma .dl-modal {
  justify-content: center;
  align-items: center;
  z-index: 300;
}
body.site-figma .dl-modal__panel {
  width: 402px;
  height: 674px;
  max-height: 100dvh;
  padding: 20px 40px 40px;
  transform: none;
  box-shadow: none;
  background-color: #0d0d0d;
  overflow: auto;
}
body.site-figma .dl-modal.is-open .dl-modal__panel {
  transform: none;
}
body.site-figma .dl-modal__close {
  top: 20px;
  right: 20px;
  width: 24px;
  height: 24px;
  color: #f5f5f5;
}
body.site-figma .dl-modal__tabs {
  margin: 20px 0 48px;
  border-bottom: 0;
  gap: 0;
}
body.site-figma .dl-modal__tab {
  font:
    500 20px/26px 'Source Serif 4',
    Georgia,
    serif;
  color: #f5f5f5;
  padding: 11px 0;
  text-transform: uppercase;
}
body.site-figma .dl-modal__tab.is-active::after {
  height: 1px;
  background: #f5f5f5;
}
body.site-figma .dl-modal__title {
  font:
    400 32px/1.2 'Instrument Serif',
    serif;
  text-align: center;
  margin: 0 0 24px;
}
body.site-figma .dl-modal__intro {
  font:
    400 14px/20px 'Instrument Sans',
    sans-serif;
  color: #f5f5f5;
  text-align: center;
  margin: 0 0 40px;
}
body.site-figma .dl-modal__qr {
  margin: 0 auto 12px;
  padding: 0;
  background: #fff;
}
body.site-figma .dl-modal__qr-cap {
  font:
    400 14px/20px 'Instrument Sans',
    sans-serif;
  color: #f5f5f5;
  margin: 0 0 40px;
}
body.site-figma .dl-modal__label {
  font:
    600 14px/20px 'Instrument Sans',
    sans-serif;
}
body.site-figma .dl-modal__input {
  height: 48px;
  border: 1px solid #4a4a4a;
  border-radius: 0;
  padding: 10px 16px;
  font:
    500 20px/26px 'Source Serif 4',
    Georgia,
    serif;
  box-sizing: border-box;
}
body.site-figma .dl-modal__submit {
  width: 100%;
  height: 48px;
  margin-top: 12px;
  border: 0;
  border-radius: 0;
  background: #f5f5f5;
  color: #201e1b;
  font:
    500 20px/26px 'Source Serif 4',
    Georgia,
    serif;
  cursor: pointer;
}
body.site-figma .dl-modal__legal {
  font:
    400 14px/20px 'Instrument Sans',
    sans-serif;
  color: #656565;
  margin-top: 16px;
}

body.site-figma .sec-foot {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: auto;
  min-height: 0;
  padding: 80px 0 calc(120px + 115 / 1440 * 100cqw);
  overflow: hidden;
  isolation: isolate;
  container-type: inline-size;
  background: #f6f6f6 url('/assets/site/paper-footer.webp') left top / 100% 100%;
  color: #201e1b;
}
body.site-figma .sec-foot__inner {
  max-width: 1080px;
  min-height: 0;
  padding: 0;
  margin: 0 auto;
}
body.site-figma .sec-foot__logo {
  position: static;
  display: block;
  width: 69px;
  height: 31px;
  margin-bottom: 40px;
}
body.site-figma .sec-foot__logo img {
  object-fit: contain;
}
body.site-figma .sec-foot__cols {
  width: 100%;
  margin: 0;
}
body.site-figma .sec-foot__cols-inner {
  gap: 80px;
}
body.site-figma .sec-foot__col-title {
  font-size: 14px;
  color: inherit;
  text-transform: none;
}
body.site-figma .sec-foot__col-list a,
body.site-figma .sec-foot__email {
  font:
    500 16px/1.2 'Source Serif 4',
    Georgia,
    serif;
  color: inherit;
  text-transform: none;
}
body.site-figma .sec-foot__col-list {
  gap: 4px;
}
body.site-figma .sec-foot__appstore {
  background: #000;
  color: #f5f5f5;
  width: 166px;
  height: 64px;
  padding: 12px 24px;
  gap: 16px;
  flex: none;
  border-radius: 0;
}
body.site-figma .sec-foot__stores {
  width: 191px;
  align-items: flex-start;
}
body.site-figma .sec-foot__appstore:has(.sec-foot__appstore-icon--gp) {
  width: 191px;
}
body.site-figma .sec-foot__appstore::before {
  display: none;
}
body.site-figma .sec-foot__bottom {
  position: static;
  height: auto;
  margin-top: 40px;
  gap: 24px;
}
body.site-figma .sec-foot__legal,
body.site-figma .sec-foot__legal-line,
body.site-figma .sec-foot__legal-link,
body.site-figma .sec-foot__social {
  color: inherit;
}
body.site-figma .site-footer-tagline {
  position: absolute;
  left: calc(-37 / 1440 * 100cqw);
  bottom: 0;
  margin: 0;
  width: calc(1514 / 1440 * 100cqw);
  height: calc(115 / 1440 * 100cqw);
  overflow: visible;
  display: grid;
  pointer-events: none;
}
body.site-figma .site-footer-tagline__layer {
  grid-area: 1 / 1;
  display: flex;
  align-items: flex-end;
  height: 100%;
  font-family: 'Instrument Serif', serif;
  font-weight: 400;
  font-style: normal;
  font-size: calc(169.38475036621094 / 1440 * 100cqw);
  line-height: 0.679;
  letter-spacing: 0;
  white-space: nowrap;
  color: #000;
  mix-blend-mode: overlay;
}
body.site-figma .site-footer-tagline em {
  font-family: 'Instrument Serif', serif;
  font-style: italic;
  font-weight: 400;
}
