/* Keep the header's reserved space stable while its capsule changes size. */
.site-header { height: 106px; --cloud-ease: cubic-bezier(.22,.68,.2,1); }
.header-inner {
  width: min(1130px, calc(100% - 48px)); min-height: 82px;
  display: flex; flex-wrap: nowrap; gap: 20px; padding: 14px 24px;
  transition: width 550ms var(--cloud-ease), min-height 550ms var(--cloud-ease),
    padding 550ms var(--cloud-ease), gap 550ms var(--cloud-ease), border-radius 550ms var(--cloud-ease),
    background 300ms ease, box-shadow 400ms ease;
}
.header-inner .brand { position: relative; width: 150px; min-width: 0; height: 42px; margin-right: 0;
  transition: width 550ms var(--cloud-ease), height 550ms var(--cloud-ease); }
.header-inner .brand > span { font-size: 28px; width: max-content; align-self: flex-start;
  transform-origin: left center; transform: scale(1); transition: transform 550ms var(--cloud-ease); }
.header-inner .brand small { position: absolute; left: 0; top: 32px; display: block; margin: 0;
  max-width: none; max-height: none; white-space: nowrap; opacity: 1;
  transition: opacity 550ms var(--cloud-ease); }
.header-inner .cloud-nav {
  position: relative; display: block; margin: 0; width: 246px; height: 42px; max-width: none; min-width: 0;
  opacity: 1; filter: blur(0); overflow: visible; flex-shrink: 0;
  transition: width 550ms var(--cloud-ease), opacity 550ms var(--cloud-ease),
    filter 550ms var(--cloud-ease), margin 550ms var(--cloud-ease);
}
.cloud-nav-links { position: absolute; left: 0; top: 0; display: flex; gap: 17px; width: max-content; white-space: nowrap;
  transform: scaleX(1); transform-origin: left center; transition: transform 550ms var(--cloud-ease); }
.cloud-nav-links button { flex-shrink: 0; }
.cloud-nav button { font-size: 12px; padding: 12px 0; }
.header-inner .search-form { flex: 1; min-width: 145px; width: auto; margin: 0; order: 0;
  transition: height 550ms var(--cloud-ease), padding 550ms var(--cloud-ease); }
.header-actions { flex-shrink: 0; }
.site-header .header-favorites { display: inline-flex; width: 38px; opacity: 1; filter: blur(0);
  transition: width 550ms var(--cloud-ease), opacity 550ms var(--cloud-ease), filter 550ms var(--cloud-ease); }
.site-header .mobile-menu { display: none; }
.site-header.is-floating .header-inner { width: min(620px, calc(100% - 40px)); min-height: 68px; gap: 16px; padding: 12px 21px; }
.site-header.is-floating .brand { width: 116px; height: 30px; }
.site-header.is-floating .brand > span { font-size: 28px; transform: scale(.85714286); }
.site-header.is-floating .brand small { display: block; opacity: 0; transition-delay: 0s; }
.site-header.is-floating .cloud-nav { width: 0; max-width: none; margin-right: -16px; opacity: 0; filter: blur(5px); pointer-events: none; transition-delay: 0s; }
.site-header.is-floating .cloud-nav-links { transform: scaleX(0); }
.site-header.is-floating .header-favorites { display: inline-flex; width: 0; opacity: 0; filter: blur(4px); overflow: hidden; pointer-events: none; transition-delay: 0s; }
.site-header.is-floating .header-actions { gap: 5px; }
@media(max-width:1100px) and (min-width:641px) {
  .site-header { height: 142px; }
  .header-inner { display: grid; grid-template-columns: auto 1fr auto; grid-template-rows: 43px 30px;
    gap: 7px 22px; border-radius: 30px; padding: 12px 24px; min-height: 109px;
    transition: width 550ms var(--cloud-ease), grid-template-rows 550ms var(--cloud-ease), gap 550ms var(--cloud-ease),
      padding 550ms var(--cloud-ease), border-radius 550ms var(--cloud-ease), min-height 550ms var(--cloud-ease), box-shadow 400ms ease; }
  .header-inner .cloud-nav { grid-row: 2; grid-column: 1 / -1; display: flex; justify-content: center; width: 100%; max-width: none; height: 30px;
    transition: opacity 550ms var(--cloud-ease), filter 550ms var(--cloud-ease), height 550ms var(--cloud-ease); }
  .cloud-nav-links { position: static; }
  .site-header.is-floating .cloud-nav-links { transform: translateY(-5px); }
  .header-inner .search-form { grid-column: 2; grid-row: 1; }
  .header-inner .header-actions { grid-column: 3; grid-row: 1; }
  .site-header.is-floating .header-inner { grid-template-rows: 43px 0px; gap: 0 16px; min-height: 68px; }
  .site-header.is-floating .cloud-nav { width: 100%; max-width: none; height: 0; margin-right: 0; transition-delay: 0s; }
}
@media(max-width:640px) {
  .site-header { top: 8px; height: 119px; padding-top: 8px; }
  .header-inner { display: grid; grid-template-columns: auto minmax(0,1fr) auto;
    grid-template-rows: 36px 30px; width: calc(100% - 24px); min-height: 97px;
    padding: 12px; gap: 6px 9px; border-radius: 26px;
    transition: width 550ms var(--cloud-ease), grid-template-rows 550ms var(--cloud-ease), gap 550ms var(--cloud-ease),
      padding 550ms var(--cloud-ease), border-radius 550ms var(--cloud-ease), min-height 550ms var(--cloud-ease), box-shadow 400ms ease; }
  /* Reserve room for the wider system font used by iOS as well as Segoe UI. */
  .header-inner .brand { width: 116px; height: 23px; }
  .header-inner .brand > span { font-size: 21px; letter-spacing: .15px; }
  .header-inner .brand small { display: none; }
  .header-inner .search-form { grid-column: 2; grid-row: 1; width: 100%; min-width: 0;
    height: 34px; padding: 0 9px; gap: 5px; }
  .header-inner .search-form > .icon { width: 15px; height: 15px; flex-shrink: 0; }
  .header-inner .search-form input { font-size: 16px; text-overflow: ellipsis; }
  .header-inner .search-clear.icon-button { width: 20px; }
  .header-inner .header-actions { grid-column: 3; grid-row: 1; gap: 1px; }
  .site-header .header-actions .icon-button { width: 29px; height: 34px; }
  .site-header .header-actions .header-favorites { display: inline-flex; width: 29px; opacity: 1; filter: none; }
  .header-inner .cloud-nav { grid-column: 1 / -1; grid-row: 2; display: flex;
    justify-content: center; width: 100%; max-width: none; gap: 14px; height: 30px;
    transition: opacity 550ms var(--cloud-ease), filter 550ms var(--cloud-ease), height 550ms var(--cloud-ease); }
  .cloud-nav-links { position: static; width: max-content; max-width: 100%; justify-content: center; gap: 14px; }
  .site-header.is-floating .cloud-nav-links { transform: translateY(-5px); }
  .cloud-nav button { font-size: 14px; padding: 6px 0; }
  .site-header.is-floating .header-inner { width: calc(100% - 30px); grid-template-columns: auto minmax(0,1fr) auto;
    grid-template-rows: 36px 0px; min-height: 62px; gap: 0 8px; padding: 11px 12px; border-radius: 999px; }
  .site-header.is-floating .brand { width: 100px; height: 23px; }
  .site-header.is-floating .header-inner .brand > span { font-size: 21px; letter-spacing: .15px; transform: scale(.85714286); }
  .site-header.is-floating .header-actions { gap: 1px; }
  .site-header.is-floating .brand small { display: none; }
  .site-header.is-floating .cloud-nav { width: 100%; max-width: none; height: 0; margin-right: 0; transition-delay: 0s; }
  .site-header.is-floating .header-actions .header-favorites { display: inline-flex; width: 29px; opacity: 1; filter: none; pointer-events: auto; }
  .site-header.is-floating .header-inner .search-form { height: 34px; }
}
@media(max-width:360px) {
  .header-inner { padding: 12px 10px; column-gap: 6px; }
  .header-inner .brand { width: 103px; }
  .header-inner .brand > span { font-size: 18.5px; }
  .site-header .header-actions .icon-button, .site-header .header-actions .header-favorites { width: 28px; }
  .site-header.is-floating .header-inner { padding: 11px 10px; column-gap: 6px; }
  .site-header.is-floating .brand { width: 96px; }
  .site-header.is-floating .header-inner .brand > span { font-size: 18.5px; transform: scale(.92); }
  .site-header.is-floating .header-actions .header-favorites { width: 28px; }
  .cloud-nav-links { gap: 10px; }
  .cloud-nav button { font-size: 13px; }
}
@media(prefers-reduced-motion:reduce) {
  .header-inner, .header-inner .brand, .header-inner .brand > span, .header-inner .brand small,
  .header-inner .cloud-nav, .cloud-nav-links, .header-inner .search-form, .site-header .header-favorites { transition: none; }
}