/* Header and footer (pages/shared/join-chrome.tsx). The only stylesheet that may style them: page CSS
   cannot name these classes (build-checked). Selectors are scoped to the marked regions with the same
   specificity the earlier page-wrapper selectors had, and the build loads this file just before
   deposits.css, so the cascade against page rules is unchanged.
   Colors and behaviours come from the page's style variant (pages/components/join-chrome-style.json):
   the renderer sets --chrome-* custom properties and data-chrome-* attributes on each region. */
.js-header[data-landing-component] {
  z-index: 50;
  color: #fff;
  background-color: var(--chrome-header-background);
  font-family: 'Landing Poppins',sans-serif;
  position: sticky;
  top: 0
}
[data-landing-component] .js-header-inner {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  align-items: center;
  max-width: 1440px;
  height: 72px;
  margin: 0 auto;
  padding: 0 clamp(20px,5vw,80px);
  display: flex
}
[data-landing-component] .js-logo {
  color: var(--chrome-accent-color);
  letter-spacing: -.04em;
  text-transform: uppercase;
  flex: none;
  align-items: center;
  column-gap: 10px;
  font-family: 'Landing Poppins',sans-serif;
  font-size: 0;
  font-weight: 800;
  line-height: 0;
  text-decoration: none;
  display: flex
}
[data-landing-component] .js-nav {
  grid-column-gap: 26px;
  grid-row-gap: 26px;
  font-size: 15px;
  font-weight: 500;
  display: flex
}
[data-landing-component] .js-nav-link {
  color: #fff;
  text-decoration: none
}
[data-landing-component] .js-header-right {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  align-items: center;
  margin-left: auto;
  font-size: 15px;
  font-weight: 500;
  display: flex
}
[data-landing-component] .js-btn-lime-sm {
  color: #121111;
  white-space: nowrap;
  background-color: var(--chrome-accent-color);
  border-radius: 999px;
  justify-content: center;
  align-items: center;
  padding: 9px 18px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex
}
.js-footer[data-landing-component] {
  color: #fff;
  background-color: var(--chrome-footer-background);
  padding-bottom: 64px;
  font-family: 'Landing Poppins',sans-serif
}
[data-landing-component] .js-footer-inner {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  color: var(--chrome-footer-link-color);
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  max-width: 1440px;
  margin: 0 auto;
  padding: 36px clamp(20px,5vw,80px);
  font-size: 13px;
  display: flex
}
[data-landing-component] .js-footer-nav {
  grid-column-gap: 20px;
  grid-row-gap: 20px;
  flex-wrap: wrap;
  display: flex
}
[data-landing-component] .js-footer-link {
  color: var(--chrome-footer-link-color);
  padding-top: 3px;
  padding-bottom: 3px;
  text-decoration: none
}
[data-landing-component] .js-logo-wordmark {
  width: auto;
  height: 22px;
  display: block
}
[data-landing-component] .js-burger {
  grid-column-gap: 5px;
  grid-row-gap: 5px;
  cursor: pointer;
  background-color: #0000;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 44px;
  height: 44px;
  margin-left: 4px;
  padding: 0;
  display: none
}
[data-landing-component] .js-burger-bar {
  background-color: #fff;
  border-radius: 2px;
  width: 22px;
  height: 2px;
  display: block
}
[data-landing-component] .js-mm-cta {
  color: #121111;
  text-align: center;
  background-color: var(--chrome-accent-color);
  border-radius: 10px;
  margin-top: 16px;
  padding: 16px 20px;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  display: block
}
[data-landing-component] .js-foot-cols {
  grid-column-gap: 28px;
  grid-row-gap: 40px;
  grid-template-columns: repeat(auto-fit,minmax(190px,1fr));
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
  padding: 64px clamp(20px,5vw,80px) 4px;
  display: grid
}
[data-landing-component] .js-foot-col {
  grid-row-gap: 12px;
  flex-direction: column;
  row-gap: 12px;
  display: flex
}
[data-landing-component] .js-foot-hd {
  color: var(--chrome-accent-color);
  letter-spacing: .1em;
  text-transform: uppercase;
  font-family: 'Landing Poppins',sans-serif;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2
}
[data-landing-component] .js-foot-a {
  color: var(--chrome-footer-link-color);
  font-family: 'Landing Poppins',sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.7;
  text-decoration: none
}
[data-landing-component] .js-foot-social {
  grid-column-gap: 18px;
  align-items: center;
  column-gap: 18px;
  display: flex
}
[data-landing-component] .js-foot-badge-apple {
  background-image: url(/_landing/0f654111c14288d3e6dc6bcbf237e61e8311c42a/assets/media/1ee64ab078ebcd3db666c7ed436275f8d45783e71be81eff4826fd1b4e327d66.png);
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 120px;
  height: 40px;
  display: block
}
[data-landing-component] .js-foot-badge-google {
  background-image: url(/_landing/0f654111c14288d3e6dc6bcbf237e61e8311c42a/assets/media/372bb94f5f1e9378f6ceb092ca3d1c189d0e624b7fd4cace244313581fc5d2f7.png);
  background-position: 0%;
  background-repeat: no-repeat;
  background-size: contain;
  width: 135px;
  height: 40px;
  display: block
}
[data-landing-component] .js-foot-ic-ig {
  background-image: url(/_landing/0f654111c14288d3e6dc6bcbf237e61e8311c42a/assets/media/06c43ba160c1d237092385bd1c329c8d4c37f8eb61c77beac9997932b294c42a.png);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto 22px;
  width: 44px;
  height: 44px;
  margin-left: -11px;
  margin-right: -11px;
  display: block
}
[data-landing-component] .js-foot-ic-tt {
  background-image: url(/_landing/0f654111c14288d3e6dc6bcbf237e61e8311c42a/assets/media/148673b7e22b51c5ec681a26bdfed0188e39c510fc94cc38e1fa756fbd2eca08.png);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto 22px;
  width: 44px;
  height: 44px;
  margin-left: -11px;
  margin-right: -11px;
  display: block
}
[data-landing-component] .js-foot-ic-fb {
  background-image: url(/_landing/0f654111c14288d3e6dc6bcbf237e61e8311c42a/assets/media/2faa916d6e2b516c7f127901757b129d3b211c0673ccd25e43cb247530f11718.png);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto 22px;
  width: 44px;
  height: 44px;
  margin-left: -11px;
  margin-right: -11px;
  display: block
}
[data-landing-component] .js-foot-ic-pi {
  background-image: url(/_landing/0f654111c14288d3e6dc6bcbf237e61e8311c42a/assets/media/92bde65cf026ea1ba2d1640fb7f8df53db00406fa8fa10692f7b6d3222ed9d86.png);
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: auto 22px;
  width: 44px;
  height: 44px;
  margin-left: -11px;
  margin-right: -11px;
  display: block
}
[data-landing-component] .cwr-footer-wordmark {
  width: auto;
  height: 22px;
  display: block
}
@media screen and (max-width:767px) {
  [data-landing-component] .js-nav { display: none }
  [data-landing-component] .js-btn-lime-sm { padding: 7px 14px; font-size: 13px }
  [data-landing-component] .js-burger { display: flex }
}
.js-header[data-landing-component] :focus-visible { outline-color: var(--chrome-accent-color); }
[data-landing-component] .join-nav-disclosure > summary { display: flex; align-items: center; gap: 8px; }
[data-landing-component] .join-caret { width: 7px; height: 7px; border: solid currentColor; border-width: 0 1.6px 1.6px 0; transform: rotate(45deg); display: inline-block; margin-left: 5px; }
[data-landing-component] details[open] > summary .join-caret { transform: rotate(225deg); }
[data-landing-component] .join-menu-panel { position: absolute; top: 100%; left: 0; right: 0; background: var(--chrome-header-background); border-top: 1px solid #ffffff24; box-shadow: 0 24px 48px #12111147; max-height: calc(100svh - 72px); overflow-y: auto; }
[data-landing-component] .join-menu-grid { max-width: 1440px; margin: auto; padding: 32px clamp(20px,5vw,80px) 40px; display: grid; grid-template-columns: repeat(auto-fit,minmax(210px,1fr)); gap: 32px 28px; }
[data-landing-component] .join-menu-group { display: flex; flex-direction: column; gap: 10px; }
[data-landing-component] .join-menu-label { color: var(--chrome-accent-color); font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .1em; }
[data-landing-component] .join-menu-group a { color: white; font-size: 15px; font-weight: 500; text-decoration: none; line-height: 1.35; }
[data-landing-component] .join-menu-group a:hover { color: var(--chrome-accent-color); }
[data-landing-component] .join-mobile-disclosure { display: none; }
@media (max-width: 767px) {
  [data-landing-component] .join-mobile-disclosure { display: block; }
  [data-landing-component] .js-burger { display: flex; padding: 0; background: transparent; }
  [data-landing-component] .join-mobile-panel { position: absolute; top: 100%; left: 0; right: 0; background: var(--chrome-header-background); max-height: calc(100svh - 72px); overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 20px; }
  [data-landing-component] .join-mobile-panel a { color: white; text-decoration: none; }
  [data-landing-component] .join-mobile-panel .js-mm-cta { color: #121111; }
  [data-landing-component] .join-mobile-panel summary { display: flex; align-items: center; justify-content: space-between; }
  [data-landing-component] .join-mobile-panel .join-menu-grid { padding: 20px 0 0; grid-template-columns: 1fr; }
}

/* Older pages wrap the header in an adapter with no layout box, so the header stays sticky. */
.shared-join-header { display: contents; }

/* Style variant behaviours. Each follows the base rule it adjusts, with at least its specificity. */
.js-footer[data-chrome-sticky-bar-space="true"] { padding-bottom: calc(89px + env(safe-area-inset-bottom,0px)); }
@media screen and (max-width:767px) {
  .js-footer[data-chrome-sticky-bar-space="true"] { padding-bottom: calc(123px + env(safe-area-inset-bottom,0px)); }
}
@media (max-width: 767px) {
  .js-header[data-chrome-phone-login="hide"] .js-header-right > .js-nav-link { display: none; }
}
/* Below 360px, every "Log in" link: the header's and the one in the phone menu. */
@media (max-width: 359px) {
  .js-header[data-chrome-small-phone-login="hide"] .js-header-right a[href*="/m/login"] { display: none; }
}
/* Keeps "Log in" on one line where the header row has no slack. */
@media (min-width: 768px) and (max-width: 820px) {
  .js-header[data-chrome-tablet-compact="true"] .js-header-inner { gap: 24px; }
  .js-header[data-chrome-tablet-compact="true"] .js-header-right a[href*="/m/login"] { white-space: nowrap; }
}
.js-footer[data-chrome-footer-link-highlight="true"] .js-footer-link:hover { color: var(--chrome-accent-color); text-decoration: none; }