/* Airbnb brand tokens, from unfairly.ai/brand-guidelines/airbnb (checked 2026-10-29).
   Sizes, spacing and components were measured on https://www.airbnb.com/ (computed styles, CSS custom properties, bounding boxes and pixel samples at 1440 and 390 in headless Chromium, 2026-10-29; images downloaded from their a0.muscache.com originals; fonts calibrated by canvas rendering).
   Fonts: --font-* use the open stand-ins (load them from Google Fonts); --font-*-original name Airbnb's own faces, which you may only use if you have a licence. */
:root {
  --color-paper: #FFFFFF;
  --color-surface: #F7F7F7;
  --color-ink: #222222;
  --color-ink-muted: #6C6C6C;
  --color-accent: #FF385C;
  --color-on-accent: #FFFFFF;
  --color-accent-secondary: #DA1249;
  --color-night: #222222;
  --color-on-night: #FFFFFF;
  --color-rausch: #FF385C;
  --color-hof: #222222;
  --color-white: #FFFFFF;
  --color-brand-text: #DA1249;
  --color-product-rausch: #E00B41;
  --color-rausch-gradient-start: #E61E4D;
  --color-rausch-gradient-mid: #E31C5F;
  --color-rausch-gradient-end: #D70466;
  --color-plus: #92174D;
  --color-text-secondary: #6C6C6C;
  --color-foggy: #6A6A6A;
  --color-bobo: #B0B0B0;
  --color-disabled: #C1C1C1;
  --color-deco: #DDDDDD;
  --color-bebe: #EBEBEB;
  --color-circle-grey: #F2F2F2;
  --color-faint: #F7F7F7;
  --color-header-gradient-end: #F8F8F8;
  --color-arches: #C13515;
  --color-link-blue: #0D4DAA;
  --color-inverse-hover: #3F3F3F;
  --color-black: #000000;
  --color-button-primary-fill: #DA1249;
  --color-button-primary-text: #FFFFFF;
  --color-button-secondary-text: #222222;
  --color-search-pill-desktop-fill: #FFFFFF;
  --color-search-button-fill: #DA1249;
  --color-search-button-text: #FFFFFF;
  --color-search-pill-phone-fill: #FFFFFF;
  --color-nav-tab-desktop-text: #6C6C6C;
  --color-chip-phone-fill: #FFFFFF;
  --color-chip-phone-text: #222222;
  --color-host-link-text: #222222;
  --color-icon-circle-fill: #F2F2F2;
  --color-icon-circle-text: #222222;
  --color-section-arrow-fill: #F2F2F2;
  --color-section-arrow-text: #222222;
  --color-carousel-arrows-fill: #F2F2F2;
  --color-carousel-arrows-text: #222222;
  --color-badge-text: #222222;
  --color-toast-fill: #FFFFFF;
  --color-toast-text: #222222;
  --color-phone-tab-bar-fill: #FFFFFF;
  --font-display: "Public Sans", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
  --font-display-original: "Airbnb Cereal", "Public Sans", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
  --font-body: "Public Sans", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
  --font-body-original: "Airbnb Cereal", "Public Sans", -apple-system, BlinkMacSystemFont, Roboto, "Helvetica Neue", sans-serif;
  --page-margin: 48px;
  --section-padding: 42px;
  --container-max: 1344px;
  --nav-height: 201px;
  --grid-gutter: 12px;
  --grid-columns: 6;
  --text-section-title-row-heading-size: 20px;
  --text-section-title-row-heading-line: 1.2;
  --text-section-title-row-heading-weight: 700;
  --text-section-title-row-heading-tracking: -0.18px;
  --text-band-title-inspiration-for-future-getaways-size: 22px;
  --text-band-title-inspiration-for-future-getaways-line: 1.18;
  --text-band-title-inspiration-for-future-getaways-weight: 600;
  --text-band-title-inspiration-for-future-getaways-tracking: -0.44px;
  --text-nav-tab-label-size: 14px;
  --text-nav-tab-label-line: 1.29;
  --text-nav-tab-label-weight: 550;
  --text-become-a-host-footer-column-head-inspiration-city-size: 14px;
  --text-become-a-host-footer-column-head-inspiration-city-line: 1.29;
  --text-become-a-host-footer-column-head-inspiration-city-weight: 600;
  --text-search-field-label-where-when-who-size: 12px;
  --text-search-field-label-where-when-who-line: 1.33;
  --text-search-field-label-where-when-who-weight: 600;
  --text-search-placeholder-size: 14px;
  --text-search-placeholder-line: 1.29;
  --text-search-placeholder-weight: 400;
  --text-card-title-size: 13px;
  --text-card-title-line: 1.23;
  --text-card-title-weight: 600;
  --text-card-price-line-size: 12px;
  --text-card-price-line-line: 1.33;
  --text-card-price-line-weight: 400;
  --text-experience-tile-label-size: 13px;
  --text-experience-tile-label-line: 1.43;
  --text-experience-tile-label-weight: 600;
  --text-badge-guest-favorite-size: 11px;
  --text-badge-guest-favorite-line: 1.18;
  --text-badge-guest-favorite-weight: 700;
  --text-footer-link-legal-size: 14px;
  --text-footer-link-legal-line: 1.29;
  --text-footer-link-legal-weight: 400;
  --text-inspiration-subtitle-size: 14px;
  --text-inspiration-subtitle-line: 1.29;
  --text-inspiration-subtitle-weight: 400;
  --text-phone-tab-bar-label-size: 10px;
  --text-phone-tab-bar-label-line: 1.2;
  --text-phone-tab-bar-label-weight: 400;
  --text-phone-tab-bar-label-tracking: 0.2px;
  --text-display-campaign-not-on-the-homepage-size: 48px;
  --text-display-campaign-not-on-the-homepage-line: 1.125;
  --text-display-campaign-not-on-the-homepage-weight: 700;
  --radius-button-primary: 999px;
  --radius-button-secondary: 20px;
  --radius-search-pill-desktop: 999px;
  --radius-search-button: 999px;
  --radius-search-pill-phone: 40px;
  --radius-chip-phone: 999px;
  --radius-host-link: 20px;
  --radius-icon-circle: 999px;
  --radius-section-arrow: 999px;
  --radius-carousel-arrows: 999px;
  --radius-listing-card: 16px;
  --radius-badge: 14px;
  --radius-experience-tile: 16px;
  --radius-toast: 12px;
  --icon-s: 12px;
  --icon-m: 16px;
  --icon-l: 24px;
}
/* Phone values measured at 390px; Airbnb's CSS switches at 743px. */
@media (max-width: 743px) {
  :root {
    --page-margin: 24px;
    --section-padding: 42px;
    --text-section-title-row-heading-size: 18px;
    --text-display-campaign-not-on-the-homepage-size: 32px;
  }
}
.button-primary {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 48px; padding: 0 10px; border-radius: 999px;
  background: #DA1249; color: #FFFFFF;
  font: 600 14px/1 var(--font-body);
}
.button-secondary {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 40px; padding: 0 12px; border-radius: 20px;
  background: transparent; color: #222222;
  font: 600 14px/1 var(--font-body);
}
.button-secondary:hover { background-color: #F7F7F7; } /* observed */
.search-button {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 48px; padding: 0 0px; border-radius: 999px;
  background: #DA1249; color: #FFFFFF;
  font: 600 14px/1 var(--font-body);
}