.odypark-accommodations-page {
  /* Parte do SVG laranja que avanca alem dos 68vw da secao. */
  --accommodations-footer-overlap: 20.823vw;
  overflow-x: hidden;
}

.odypark-accommodations-page .hero-wrap--acomodacoes {
  z-index: 3;
  isolation: isolate;
}

.odypark-accommodations-page .site-header {
  position: absolute;
  inset: 0 0 auto;
}

.accommodations-page {
  --accommodations-navy: #00155a;
  --accommodations-blue: #003e6d;
  --accommodations-orange: #ff7c0a;
  --accommodations-heading: 'Ody Accommodations Baloo', sans-serif;
  position: relative;
  width: 100%;
  overflow: visible;
  color: var(--accommodations-navy);
  font: 400 1rem/1.25 var(--font-body);
  isolation: isolate;
  container-type: inline-size;
}

.accommodations-page h1,
.accommodations-page h2,
.accommodations-page h3,
.accommodations-page p {
  margin: 0;
}

.accommodations-page h1,
.accommodations-page h2,
.accommodations-page h3 {
  font-family: var(--accommodations-heading);
  font-weight: 400;
  line-height: 1.15;
}

.accommodations-page p + p {
  margin-top: 1.1em;
}

.accommodations-page img {
  max-width: 100%;
}

.accommodations-page .container {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 86.4%;
  padding: 0;
}

.accommodations-page .row {
  --bs-gutter-x: 4.2vw;
}

.accommodations-backgrounds {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.accommodations-backgrounds__intro {
  display: contents;
}

.accommodations-page .accommodations-bg {
  position: absolute;
  max-width: none;
}

.accommodations-bg--intro-edge {
  top: 46.458vw;
  left: 0;
  z-index: 2;
  width: calc(100vw + 2px);
  height: auto;
}

.accommodations-bg--intro-rooms {
  top: 46.944vw;
  left: 0;
  z-index: 3;
  width: calc(100vw + 2px);
  height: auto;
}

.accommodations-bg--exclusive {
  top: 176.181vw;
  left: 0;
  z-index: 1;
  width: 100%;
  height: auto;
  pointer-events: none;
}

.accommodations-bg--bottom-wave {
  /* O fundo azul do rodape deve aparecer sob a borda laranja. */
  display: none;
  top: 237.604vw;
  left: -4.583%;
  z-index: 0;
  width: 118.09%;
  height: auto;
}

.accommodations-hero,
.accommodations-intro,
.accommodations-rooms,
.accommodations-exclusive {
  position: relative;
  z-index: 4;
}

/* O topo ondulado pertence aos SVGs de fundo e precisa avançar sobre o hero. */
.accommodations-hero {
  z-index: auto;
}

.accommodations-hero {
  height: 49.514vw;
  overflow: hidden;
}

.accommodations-hero__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.accommodations-hero__shade {
  position: absolute;
  inset: 0;
  background: url('../images/acomodacoes/hero-shade.svg') center bottom / 100% auto no-repeat;
}

.accommodations-hero h1 {
  position: absolute;
  top: 20.486vw;
  z-index: 2;
  width: 100%;
  color: #f78409;
  font-family: 'Ody Accommodations Baloo Bhai', sans-serif;
  font-size: 5.556vw;
  text-align: center;
  -webkit-text-stroke: 0.8vw white;
  paint-order: stroke fill;
}

.accommodations-intro {
  height: 55.9vw;
  padding-top: 3.5vw;
  color: white;
}

.accommodations-intro h2 {
  margin-bottom: 2.5vw;
  font-size: 3.333vw;
}

.accommodations-intro__copy p {
  max-width: 51vw;
  font-family: 'Ody Accommodations Roboto', Arial, sans-serif;
  font-size: 1.528vw;
  line-height: 1.12;
}

.accommodations-intro__photo {
  position: absolute;
  top: 1.8vw;
  right: 0;
  width: 53.31%;
  height: auto;
  max-width: none;
}

.accommodations-rooms {
  height: 70.764vw;
}

.accommodations-heading {
  margin-bottom: 9vw;
  text-align: center;
}

.accommodations-heading p {
  margin-bottom: 2vw;
  color: #ea6b00;
  font-family: var(--accommodations-heading);
  font-size: 1.667vw;
  font-weight: 800;
}

.accommodations-heading h2 {
  margin-bottom: 1.7vw;
  color: var(--accommodations-blue);
  font-size: 3.333vw;
}

.accommodations-heading img {
  width: 9.167vw;
  height: auto;
}

.accommodations-page .accommodations-room-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: clamp(24px, 4vw, 48px);
  width: 100%;
  max-width: 1040px;
  margin-inline: auto;
}

.accommodations-room-grid > .col-md-6 {
  display: flex;
  width: 100%;
  padding-inline: 0;
}

.accommodations-room-card {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 480px;
  margin-inline: auto;
  padding-bottom: 44px;
  border-radius: 40px;
  background: white;
  box-shadow: 0 16px 28px #0003;
}

.accommodations-room-card__photo {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  border-radius: 0;
  object-fit: cover;
}

.accommodations-room-card__content {
  display: grid;
  align-content: start;
  gap: 22px;
  padding: 24px clamp(18px, 2vw, 28px) 0;
}

.accommodations-room-card__heading {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4vw;
  padding-top: 24px;
  margin-bottom: 0;
}

.accommodations-room-card__heading h3 {
  width: 100%;
  margin-left: 0;
  color: var(--accommodations-blue);
  font-size: clamp(20px, 2vw, 26px);
  text-align: center;
  white-space: normal;
}

.accommodations-room-card--master h3 {
  color: var(--accommodations-navy);
}

.accommodations-room-card__badge {
  position: absolute;
  top: -58px;
  left: 50%;
  display: grid;
  width: 68px;
  height: 68px;
  place-items: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  transform: translateX(-50%);
}

.accommodations-room-card__badge--double {
  background-image: url('../images/acomodacoes/d3b8a.svg');
}

.accommodations-room-card__badge--master {
  background-image: url('../images/acomodacoes/aaf24.svg');
}

.accommodations-room-card__badge img {
  width: 80%;
  height: 80%;
  max-width: 100%;
  object-fit: contain;
}

.accommodations-capacity,
.accommodations-amenities {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  padding: 0;
  font-size: clamp(12px, 1vw, 14px);
  list-style: none;
}

.accommodations-capacity li,
.accommodations-amenities li {
  display: flex;
  align-items: center;
  gap: 6px;
  white-space: normal;
}

.accommodations-capacity img {
  width: 28px;
  height: 26px;
  object-fit: contain;
}

.accommodations-capacity li + li img {
  width: 34px;
}

.accommodations-amenities img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.accommodations-amenities li:first-child img {
  width: 24px;
}

.accommodations-amenities li:last-child img {
  width: 20px;
}

.accommodations-page .accommodations-room-card__tagline {
  margin: 0;
  font-size: clamp(16px, 1.4vw, 18px);
  font-weight: 800;
  line-height: 1.4;
  text-align: center;
  white-space: normal;
}

.accommodations-more {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  bottom: -24px;
  left: 50%;
  width: 180px;
  height: 48px;
  border: 3px solid white;
  border-radius: 999px;
  background: radial-gradient(ellipse at 46% 50%, #2ca56a 5%, #95db31 90%);
  color: white;
  font-family: var(--accommodations-heading);
  font-size: 26px;
  font-weight: 800;
  cursor: pointer;
  text-decoration: none;
  transform: translateX(-50%);
}

.accommodations-more:hover {
  color: white;
}

.accommodations-exclusive {
  width: 100%;
  min-height: 68vw;
  padding: 20vw 0 80px;
  color: white;
}

.accommodations-exclusive .row {
  --bs-gutter-x: 0;
}

.accommodations-exclusive__top-wave {
  display: none;
}

.accommodations-exclusive__copy {
  position: relative;
  padding-right: 0;
  padding-left: 0;
  text-align: center;
}

.accommodations-exclusive h2 {
  margin-bottom: 2.5vw;
  font-size: 3.333vw;
}

.accommodations-exclusive__copy p {
  font-size: 1.528vw;
  line-height: 1.5;
}

.accommodations-exclusive__photo {
  position: absolute;
  top: 4.792vw;
  left: 0;
  z-index: 1;
  width: 47.33%;
  height: auto;
  max-width: none;
}

.accommodations-exclusive .container {
  z-index: 2;
}

.accommodations-exclusive__button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  min-height: 60px;
  margin: 40px auto 0;
  padding: 14px 30px;
  border: 4px solid white;
  border-radius: 999px;
  background: #ff039e;
  color: white;
  font-family: var(--accommodations-heading);
  font-size: clamp(20px, 2.1vw, 30px);
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
}

.accommodations-exclusive__button:hover {
  color: white;
}

.accommodations-decorations {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

.accommodations-turtle {
  position: absolute;
  height: auto;
  max-width: none;
}

.accommodations-turtle--left {
  bottom: 0;
  left: 0;
  width: 8%;
}

.accommodations-turtle--right {
  top: calc(100% + 40px);
  left: 50%;
  width: clamp(120px, 12vw, 180px);
  transform: translateX(-50%);
}

.accommodations-page button:focus-visible,
.accommodations-more:focus-visible,
.accommodations-exclusive__button:focus-visible,
.accommodations-dialog button:focus-visible {
  outline: 3px solid #003e6d;
  outline-offset: 6px;
}

.accommodations-dialog {
  width: min(90vw, 650px);
  padding: 2rem;
  border: 0;
  border-radius: 24px;
  color: var(--accommodations-navy, #00155a);
}

.accommodations-dialog::backdrop {
  background: #00155aaa;
}

.accommodations-dialog h2 {
  margin: 0 2rem 1rem 0;
  font-family: var(--accommodations-heading, var(--font-heading));
  font-size: 2rem;
}

.accommodations-dialog p {
  line-height: 1.5;
}

.accommodations-dialog__close {
  position: absolute;
  top: 10px;
  right: 16px;
  border: 0;
  background: none;
  color: #00155a;
  font-size: 2rem;
}

.odypark-accommodations-page .rodape-background {
  z-index: 2;
  margin-top: 0;
  padding-top: var(--accommodations-footer-overlap);
}