/* ============================================================
   Current on Center — AMENITIES page sections
   Pairs with tokens.css + sections.css. Only NEW sections live
   here: theme color helpers, intro, color-amenity feature rows,
   amenities-list columns, and the amenities-swiper gallery.
   ============================================================ */

/* ---------- THEME COLOR HELPERS (from the live theme) ---------- */
.color-body-bg { --color: var(--color-body-bg); color: var(--color); }
.color-body-bg .heading,
.color-body-bg h2,
.color-body-bg p { color: inherit; }

.bg-color-secondary { --background-color: var(--color-secondary); background-color: var(--background-color); --bg-color: var(--color-secondary); }
.bg-color-tertiary  { --background-color: var(--color-tertiary);  background-color: var(--background-color); --bg-color: var(--color-tertiary); }

/* half / mobile backgrounds used by the color-amenity rows */
.mobile-background-primary    { background-color: var(--color-primary); }
.mobile-background-secondary  { background-color: var(--color-secondary); }
.mobile-background-tertiary   { background-color: var(--color-tertiary); }
.mobile-background-quaternary { background-color: var(--color-quaternary); }
@media (min-width:992px){
  .half-background-primary    { background: linear-gradient(to right, transparent 49%, var(--color-primary) 49%); }
  .half-background-secondary  { background: linear-gradient(to right, transparent 49%, var(--color-secondary) 49%); }
  .half-background-tertiary   { background: linear-gradient(to right, transparent 49%, var(--color-tertiary) 49%); }
  .half-background-quaternary { background: linear-gradient(to right, transparent 49%, var(--color-quaternary) 49%); }
  .reverse--true.half-background-primary    { background: linear-gradient(to right, var(--color-primary) 51%, transparent 51%); }
  .reverse--true.half-background-secondary  { background: linear-gradient(to right, var(--color-secondary) 51%, transparent 51%); }
  .reverse--true.half-background-tertiary   { background: linear-gradient(to right, var(--color-tertiary) 51%, transparent 51%); }
  .reverse--true.half-background-quaternary { background: linear-gradient(to right, var(--color-quaternary) 51%, transparent 51%); }
  .mobile-background-primary,
  .mobile-background-secondary,
  .mobile-background-tertiary,
  .mobile-background-quaternary { background-color: transparent; }
}

/* body-bg button variant (used inside color-amenity rows) */
.btn-body-bg { --btn-color:#fff6ec; --btn-color-darker:#ccc4bc; --text-color:#000; }

/* ---------- bullet list styling (theme ul:not([class])) ---------- */
.amenities-list ul:not([class]) { color: inherit; padding-left: .6rem; margin: 0; }
.amenities-list ul:not([class]) li { position: relative; padding-left: 2.4rem; margin-bottom: .65rem; }
.amenities-list ul:not([class]) li:last-child { margin-bottom: 0; }
.amenities-list ul:not([class]) li:before {
  content: ""; display: block; background-color: var(--color, var(--color-body-bg));
  border-radius: 50%; width: 7px; height: 7px; position: absolute;
  top: .8125rem; left: 0; transform: translateY(-50%);
}

/* ---------- SECTION: amenities intro (All Day Aura) ---------- */
.amenities-intro { padding: 0 var(--x-gap); margin-bottom: var(--y-gap); text-align: center; }
.amenities-intro__inner { max-width: 850px; margin: 0 auto; }
.amenities-intro em { font-style: italic; }

/* ---------- SECTION: color-amenity (feature rows) ---------- */
.color-amenity { padding: 0; margin-top: calc(var(--y-gap) * -1); padding-top: var(--y-gap); }
.color-amenity:first-of-type { margin-top: 0; }
.color-amenity-wrapper { display: grid; grid-template-columns: 1fr; max-width: 1140px; }
.color-amenity-wrapper .content__wrapper { padding: 4rem; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2rem; }
.color-amenity-wrapper .content__wrapper > * { margin: 0; }
.color-amenity .title, .color-amenity .eyebrow { font-weight: 500; display: block; }
.color-amenity .title-wrapper { --h2: 36; }
.color-amenity .title { color: #fff; }
.color-amenity .eyebrow { text-transform: uppercase; font-family: var(--font-family-body); font-size: .45em; }
.color-amenity .content__wrapper p { margin: 0; }
.color-amenity .badge-wrapper { position: absolute; bottom: -3rem; right: 0; width: 10rem; height: 5rem; }
.color-amenity .image__wrapper { position: relative; }
.color-amenity-wrapper .content__wrapper .btn { min-width: unset; padding: 8px 14px; gap: 5px; }
.color-amenity-wrapper .content__wrapper .btn svg { transform: rotate(90deg); fill: currentColor; }
.color-amenity .content__wrapper br { display: none; }
.color-amenity .image__wrapper > img { object-fit: cover; display: block; width: 100%; height: 100%; }
.color-amenity .image__wrapper .badge-wrapper img { object-fit: contain; display: block; width: 100%; height: 100%; object-position: right; }

@media (min-width:500px){
  .color-amenity .badge-wrapper { width: 16rem; height: 10rem; }
}
@media (min-width:992px){
  .color-amenity-wrapper { grid-template-columns: repeat(2, 1fr); margin: 0 auto; }
  .color-amenity .badge-wrapper { top: -3rem; bottom: auto; right: auto; left: -3rem; }
  .color-amenity-wrapper .content__wrapper { padding-right: 0; }
  .color-amenity .content__wrapper br { display: block; }
  .color-amenity__container.reverse--true .content__wrapper { order: 1; padding-right: 7rem; padding-left: 0; }
  .color-amenity__container.reverse--true .image__wrapper { order: 2; }
  .color-amenity__container.reverse--true .badge-wrapper { top: -3rem; bottom: auto; right: -3rem; left: auto; }
  .color-amenity:not(.reverse--true) .image__wrapper .badge-wrapper img { object-position: left; }
  .color-amenity .image__wrapper > img { border-radius: 0 0 0 50px; overflow: hidden; }
  .color-amenity__container.reverse--true .image__wrapper > img { border-radius: 0 0 50px 0; }
  .color-amenity-wrapper .content__wrapper .btn svg { transform: rotate(135deg); }
  .color-amenity__container.reverse--true .content__wrapper .btn svg { transform: rotate(45deg); }
}

/* ---------- SECTION: amenities-list (column lists) ---------- */
.amenities-list { margin: 0 auto; padding: var(--y-gap) var(--x-gap); margin-bottom: var(--y-gap); }
.amenities-list .title-wrapper { margin-bottom: 2.8rem; }
.amenities-list .title-wrapper .heading {
  display: inline-block; background-color: var(--color-body-bg); color: #000;
  padding: 13px 26px; border-radius: 3rem; font-weight: 500; --heading: 36;
  margin-bottom: 0; text-align: center;
}
.amenities-list .amenities-lists { display: grid; grid-template-columns: 1fr; gap: 1rem; }
.amenities-list .amenities-lists .heading {
  font-size: 1.3rem; font-family: var(--font-family-heading);
  font-weight: var(--font-weight-heading); margin-bottom: 0; color: inherit;
}
.amenities-list ul { margin-bottom: 0; }
.amenities-list .disclaimer { margin: 2rem 0 0; font-style: italic; }
@media (min-width:768px){
  .amenities-list .amenities-lists { grid-template-columns: .25fr 1fr; gap: 2.2rem 1rem; }
}
@media (min-width:992px){
  .amenities-list .container { max-width: 1140px; }
  .amenities-list .amenities-lists { grid-template-columns: repeat(2, .25fr 1fr); }
}

/* ---------- SECTION: amenities-swiper (gallery slider) ---------- */
.amenities-swiper { padding: 0; position: relative; }
.amenities-swiper__track {
  display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory;
  scroll-behavior: smooth; list-style: none; margin: 0; padding: 0;
  -ms-overflow-style: none; scrollbar-width: none;
}
.amenities-swiper__track::-webkit-scrollbar { display: none; }
.amenities-swiper__slide { flex: 0 0 100%; scroll-snap-align: start; }
.amenities-swiper__slide img { width: 100%; height: 100%; display: block; object-fit: cover; aspect-ratio: 16/9; }
.amenities-swiper__btn {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 10;
  width: 44px; height: 44px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255,255,255,.9); color: var(--color-secondary);
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 14px rgba(0,0,0,.18); transition: background var(--base-timing);
}
.amenities-swiper__btn:hover { background: #fff; }
.amenities-swiper__btn svg { width: 16px; height: 16px; fill: currentColor; }
.amenities-swiper__btn--prev { left: 12px; }
.amenities-swiper__btn--prev svg { transform: rotate(90deg); }
.amenities-swiper__btn--next { right: 12px; }
.amenities-swiper__btn--next svg { transform: rotate(-90deg); }
@media (min-width:512px){ .amenities-swiper__slide { flex-basis: calc(50% - 5px); } }
@media (min-width:768px){ .amenities-swiper__slide { flex-basis: calc(33.333% - 7px); } }
@media (min-width:992px){ .amenities-swiper__slide { flex-basis: calc(25% - 7.5px); } }