/* Stage 28.2B: controlled Geist typography consolidation and transport mobile P1 repair. */
@font-face {
  font-family: "Geist";
  src: url("/assets/fonts/geist/Geist%5Bwght%5D.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --yt-font-sans: "Geist", "Inter", "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --yt-text-xs: .75rem;
  --yt-text-sm: .875rem;
  --yt-text-base: 1rem;
  --yt-text-lg: 1.125rem;
  --yt-text-xl: clamp(1.25rem, 1.4vw + .8rem, 1.625rem);
  --yt-text-2xl: clamp(1.5rem, 2vw + .85rem, 2.125rem);
  --yt-text-3xl: clamp(1.875rem, 3vw + .9rem, 3rem);
  --yt-leading-tight: 1.12;
  --yt-leading-heading: 1.18;
  --yt-leading-body: 1.55;
  --yt-weight-regular: 400;
  --yt-weight-medium: 500;
  --yt-weight-semibold: 600;
  --yt-weight-bold: 700;
}

html,
body {
  font-family: var(--yt-font-sans);
  font-size: 16px;
  line-height: var(--yt-leading-body);
  letter-spacing: 0;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

button,
input,
select,
textarea,
.btn,
.form-control,
.form-select,
.dropdown-menu {
  font-family: var(--yt-font-sans);
  letter-spacing: 0;
}

h1,
.h1,
.display-1,
.display-2 {
  font-family: var(--yt-font-sans);
  font-size: var(--yt-text-3xl);
  font-weight: var(--yt-weight-bold);
  line-height: var(--yt-leading-tight);
  letter-spacing: 0;
}

h2,
.h2 {
  font-family: var(--yt-font-sans);
  font-size: var(--yt-text-2xl);
  font-weight: var(--yt-weight-bold);
  line-height: var(--yt-leading-heading);
  letter-spacing: 0;
}

h3,
.h3 {
  font-family: var(--yt-font-sans);
  font-size: var(--yt-text-xl);
  font-weight: var(--yt-weight-semibold);
  line-height: var(--yt-leading-heading);
  letter-spacing: 0;
}

h4,
.h4 {
  font-family: var(--yt-font-sans);
  font-size: var(--yt-text-lg);
  font-weight: var(--yt-weight-semibold);
  line-height: 1.25;
  letter-spacing: 0;
}

p,
li,
.card,
.card-body,
.modal,
.offcanvas,
.navbar,
.table,
.form-label,
.form-text,
.small,
small {
  font-family: var(--yt-font-sans);
}

.btn,
button,
[role="button"],
input[type="submit"] {
  font-weight: var(--yt-weight-semibold);
  line-height: 1.2;
  white-space: normal;
  overflow-wrap: anywhere;
}

.badge,
.form-label,
label,
th,
.nav-link {
  font-weight: var(--yt-weight-medium);
}

.listing-editorial-card,
.yosu-image-tile,
.offer-card,
.travel-card,
.product-card {
  font-family: var(--yt-font-sans);
}

.listing-editorial-card h5,
.listing-editorial-card h6,
.offer-card-title,
.travel-card-title,
.card-title {
  font-family: var(--yt-font-sans);
  font-weight: var(--yt-weight-semibold);
  line-height: 1.18;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.offer-card-location,
.listing-editorial-card .text-muted,
.card-text,
.metadata,
.meta,
.caption {
  font-size: var(--yt-text-sm);
  line-height: 1.35;
}

.price,
.amount,
.fw-bold {
  font-family: var(--yt-font-sans);
}

@media (max-width: 575.98px) {
  h1,
  .h1,
  .display-1,
  .display-2 {
    font-size: clamp(1.55rem, 7vw, 2.1rem);
    line-height: 1.12;
  }

  h2,
  .h2 {
    font-size: clamp(1.32rem, 5.4vw, 1.75rem);
    line-height: 1.16;
  }

  h3,
  .h3 {
    font-size: clamp(1.12rem, 4.2vw, 1.42rem);
  }

  .btn,
  button,
  input,
  select,
  textarea {
    font-size: .95rem;
  }

  body [data-progressive-listing] {
    padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .listing-editorial-card,
  body [data-progressive-listing] [data-progressive-id^="transport-"] .listing-editorial-card.yt-whole-card-link {
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .listing-editorial-card > .position-relative {
    flex: 0 0 auto !important;
    height: clamp(132px, 38vw, 166px) !important;
    min-height: clamp(132px, 38vw, 166px) !important;
    max-height: none !important;
    overflow: hidden !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .listing-editorial-card .card-img-top {
    height: 100% !important;
    min-height: 100% !important;
    width: 100% !important;
    object-fit: cover !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .card-body {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: .78rem .82rem .9rem !important;
    line-height: 1.25 !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .card-body > .d-flex.justify-content-between:first-child {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: start !important;
    gap: .45rem !important;
    margin-bottom: .45rem !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] h6 {
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
    overflow: visible !important;
    white-space: normal !important;
    font-size: .96rem !important;
    line-height: 1.16 !important;
    margin-bottom: .25rem !important;
    overflow-wrap: anywhere !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .badge {
    flex: 0 0 auto !important;
    max-width: 8.75rem !important;
    white-space: normal !important;
    line-height: 1.12 !important;
    font-size: .66rem !important;
    padding: .28rem .42rem !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .offer-card-location {
    display: block !important;
    -webkit-line-clamp: unset !important;
    -webkit-box-orient: initial !important;
    overflow: visible !important;
    white-space: normal !important;
    font-size: .82rem !important;
    line-height: 1.22 !important;
    margin-bottom: .35rem !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .card-body .fs-2 {
    display: block !important;
    font-size: .82rem !important;
    line-height: 1.18 !important;
    margin-bottom: .18rem !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .card-body .fs-2 small {
    font-size: .68rem !important;
    line-height: 1.16 !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .card-body > .d-flex.align-items-end.justify-content-between {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: .55rem !important;
    margin-top: auto !important;
  }

  body [data-progressive-listing] [data-progressive-id^="transport-"] .travel-card-cta,
  body [data-progressive-listing] [data-progressive-id^="transport-"] .btn {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    min-height: 40px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: normal !important;
    overflow: visible !important;
    font-size: .84rem !important;
    line-height: 1.18 !important;
    padding: .55rem .7rem !important;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  body [data-progressive-listing] [data-progressive-id^="transport-"] .listing-editorial-card {
    height: auto !important;
    max-height: none !important;
  }
}