dialog.first-ride-offer {
  position: fixed;
  inset: 0;
  width: min(27rem, calc(100% - 2rem));
  max-width: none;
  max-height: calc(100vh - 2rem);
  max-height: calc(100dvh - 2rem);
  height: fit-content;
  box-sizing: border-box;
  margin: auto;
  padding: 0;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid #687078;
  border-radius: 18px;
  color: #f5f1ea;
  background: #11161b;
  box-shadow: 0 24px 80px #0009;
  text-align: center;
  font-family: Manrope, system-ui, sans-serif;
}
.first-ride-offer:not([open]) { display: none; }
.first-ride-offer::backdrop { background: rgb(7 10 15 / 70%); }
.first-ride-mast {
  display: grid;
  place-items: center;
  height: clamp(5.4rem, 16vh, 7.5rem);
  background: linear-gradient(0deg, #11161b, rgb(8 13 19 / 58%) 75%), url('/assets/pearson-suv-hero-mobile-v2-preview.webp') center 46% / cover;
}
.first-ride-mast img { width: 7.75rem; height: auto; }
.first-ride-content { padding: 0 clamp(1.25rem, 5vw, 2.75rem) clamp(1.3rem, 4vh, 2rem); }
.first-ride-offer h2 {
  font-family: Cormorant, Georgia, serif;
  font-weight: 500;
  font-size: clamp(2.65rem, 7vw, 3.65rem);
  line-height: .98;
  color: #faf6ef;
  margin: .25rem 0 1rem;
  letter-spacing: -.025em;
}
.first-ride-offer h2 em { display: block; font-weight: inherit; color: #c5d0d7; }
.first-ride-offer p { margin: 0; color: #e2e4e5; font-size: .93rem; line-height: 1.6; }
.first-ride-code {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .25rem .75rem;
  margin: 1.1rem 0 .85rem;
  padding: .7rem 1rem;
  border: 1px solid #626d76;
  border-radius: 8px;
  background: linear-gradient(115deg,#20282f,#171d22);
}
.first-ride-code span { font-size: .78rem; color: #d2d9de; }
.first-ride-code strong { color: #fff; font-size: 1.17rem; letter-spacing: .12em; user-select: all; }
.first-ride-offer .first-ride-deadline { font-size: .77rem; color: #b7c1c8; line-height: 1.55; }
.first-ride-offer .first-ride-close {
  position: absolute;
  z-index: 1;
  top: .7rem;
  right: .7rem;
  width: 44px;
  height: 44px;
  padding: 0;
  display: grid;
  place-items: center;
  border: 1px solid #939ea7;
  border-radius: 50%;
  color: white;
  background: #151b20;
  font: 400 1.7rem/1 Arial, sans-serif;
  cursor: pointer;
}
.first-ride-close:hover { background: #303940; }
.first-ride-close:focus-visible { outline: 2px solid white; outline-offset: 2px; }
