/* Homepage-only mobile drawer polish. Keep this after the Webflow export CSS. */
:root {
  --rito-red: #f61718;
  --rito-border: rgba(246, 23, 24, 0.55);
  --rito-header-height: 68px;
}

.landscape .div-block-91 {
  margin-top: 1rem;
}

.footer-menu .div-block-101 {
  position: relative;
}

.footer-menu .image-204 {
  width: 25px;
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  z-index: 1;
  align-self: auto;
}

@media screen and (max-width: 991px) {
  .nav-menu-4,
  .menu-button-3-copy {
    display: none !important;
  }

  .menu-button-3,
  .menu-button-3.w--open {
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .ritography-mobile-drawer {
    width: 100vw;
    height: calc(100dvh - var(--rito-header-height));
    position: fixed;
    z-index: 999;
    top: var(--rito-header-height);
    right: 0;
    left: 0;
    display: grid;
    gap: 22px;
    padding: 24px 18px calc(28px + env(safe-area-inset-bottom));
    border-top: 1px solid rgba(246, 23, 24, 0.28);
    background:
      linear-gradient(180deg, rgba(246, 23, 24, 0.14), transparent 52%),
      rgba(0, 0, 0, 0.985);
    box-shadow: 0 30px 60px rgba(0, 0, 0, 0.54);
    opacity: 0;
    pointer-events: none;
    transform: translate3d(0, -14px, 0);
    transition:
      opacity 180ms ease,
      transform 180ms ease,
      visibility 180ms ease;
    visibility: hidden;
  }

  html[data-ritography-mobile-menu="open"],
  html[data-ritography-mobile-menu="open"] body {
    overflow: hidden;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer {
    opacity: 1;
    pointer-events: auto;
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }

  .ritography-mobile-drawer__nav {
    display: grid;
    align-content: start;
    justify-items: center;
    gap: 10px;
    padding-top: clamp(18px, 8vh, 58px);
  }

  .ritography-mobile-drawer__link {
    width: min(260px, 100%);
    min-height: 46px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 0;
    margin-right: 0;
    padding: 0 20px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    color: #fff;
    font-family: Unique, sans-serif;
    font-size: clamp(1.2rem, 6vw, 2rem);
    line-height: 1;
    opacity: 0;
    text-decoration: none;
    text-transform: uppercase;
    transform: translate3d(0, -8px, 0);
    transition:
      background-color 160ms ease,
      border-color 160ms ease,
      color 160ms ease,
      opacity 180ms ease,
      transform 180ms ease;
  }

  .ritography-mobile-drawer__link:hover,
  .ritography-mobile-drawer__link:focus-visible,
  .ritography-mobile-drawer__link[aria-current="page"] {
    background-color: var(--rito-red);
    border-color: var(--rito-red);
    color: #fff;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link:nth-child(1) {
    transition-delay: 30ms;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link:nth-child(2) {
    transition-delay: 55ms;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link:nth-child(3) {
    transition-delay: 80ms;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link:nth-child(4) {
    transition-delay: 105ms;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link:nth-child(5) {
    transition-delay: 130ms;
  }

  html[data-ritography-mobile-menu="open"] .ritography-mobile-drawer__link:nth-child(6) {
    transition-delay: 155ms;
  }

}

@media screen and (max-width: 767px) {
  .landscape .div-block-91 {
    grid-template-columns: 1fr;
    display: grid;
    gap: 4rem;
  }
}

@media screen and (max-width: 479px) {
  .ritography-mobile-drawer {
    padding: 18px 16px calc(24px + env(safe-area-inset-bottom));
  }

  .ritography-mobile-drawer__nav {
    padding-top: calc(22px + 1rem);
  }
}
