/* Site review v1: hero copy and live price, phone hero, line icons,
   book-direct rate, footer links, and the booking card on phones. */

img[loading="lazy"] { background-color: #ece5d9; }

/* Language selector scrolls away with the page on phones and drops its label,
   so it no longer covers headings or the "Back to Casa Ecos" link. */
@media (max-width: 640px) {
  .language-sync-widget { position: absolute !important; }
  .language-sync-widget > span { display: none !important; }
}

/* Hero: one line saying what this is, plus the live "from" price. */
.ecos-responsive-hero img.ce-hero-logo { display: none; }
.ce-hero-lede {
  margin: 0 0 .5rem;
  max-width: 34rem;
  color: #fff;
  font-size: clamp(1rem, 1.4vw, 1.18rem);
  line-height: 1.45;
  font-weight: 500;
  text-wrap: balance;
}
.ce-hero-price {
  margin: 0 0 1.1rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: .2rem .45rem;
  color: #fff;
  font-size: .98rem;
  line-height: 1.35;
  text-shadow: 0 2px 14px rgba(0, 0, 0, .5);
}
.ce-hero-price[hidden] { display: none; }
.ce-hero-price--suite { margin: .35rem auto 1rem; }
.ce-fp-usd { font-size: 1.18em; font-weight: 700; }
.ce-fp-mxn { opacity: .85; }
.ce-fp-note { flex-basis: 100%; font-size: .78rem; opacity: .88; letter-spacing: .02em; }
.ce-fp-allin strong { font-weight: 700; }

/* Wider screens: the hero image already carries the logo, so only a one-line
   price fits between it and the buttons. */
@media (min-width: 641px) {
  .ecos-responsive-hero--home .ce-hero-lede { display: none; }
  .ce-hero-price { flex-wrap: nowrap; margin-bottom: .9rem; }
  .ce-fp-note { flex-basis: auto; font-size: .85rem; }
  .ce-fp-note::before { content: "· "; }
  .ce-fp-mxn, .ce-fp-before, .ce-fp-sep { display: none; }
}

@media (max-width: 640px) {
  .ecos-responsive-hero--home {
    background-image: url('../images/home-hero-mobile-shower-v2.webp') !important;
    background-position: center 28% !important;
  }
  .ecos-responsive-hero--home .ecos-home-hero-v1987__shade {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .04) 30%, rgba(26, 20, 14, .52) 60%, rgba(26, 20, 14, .8) 100%) !important;
  }
  .ecos-responsive-hero img.ce-hero-logo {
    display: block;
    width: 96px;
    height: auto;
    margin: 0 auto .55rem;
    background: transparent;
    filter: drop-shadow(0 2px 10px rgba(0, 0, 0, .35));
  }
  .ce-hero-lede { font-size: 1rem; max-width: 19rem; }
}

/* Line icons replacing emoji. */
.ce-icon { width: 28px; height: 28px; color: #1f5446; flex: none; }
.ce-amenity { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ce-amenity h3 { margin-top: .75rem; font-weight: 600; color: #292524; }
.ce-amenity p { margin-top: .35rem; max-width: 17rem; font-size: .875rem; line-height: 1.5rem; color: #57534e; }
.ce-card-icon { display: flex; color: #1f5446; }
.ce-card-icon .ce-icon { width: 32px; height: 32px; }
.booking-benefit-card .ce-card-icon { justify-content: center; }
.ecos-suite-hero-v1988f__amenity-icon { color: #f3d58a; }
.ecos-suite-hero-v1988f__amenity-icon svg {
  width: 24px;
  height: 24px;
  display: block;
  margin: 0 auto;
  stroke: currentColor;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* The clean Sul photo is brighter than the old graded one; keep the hero text readable. */
.ecos-responsive-hero--sul .ecos-responsive-hero__gradient {
  background: linear-gradient(to bottom, rgba(24, 19, 14, .42) 0%, rgba(24, 19, 14, .34) 45%, rgba(24, 19, 14, .58) 100%);
}

/* Book direct. */
.ce-text-link { color: #1f5446; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.main-suite-selector__perk {
  margin: .85rem 0 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .15rem .35rem;
  font-size: .92rem;
  font-weight: 600;
  color: #1f5446;
}
.main-suite-selector__perk a,
.ce-book-perk a { color: inherit; font-weight: 500; text-decoration: underline; text-underline-offset: 3px; }
.ce-book-perk {
  margin-top: 1rem;
  display: flex;
  flex-wrap: wrap;
  gap: .15rem .4rem;
  font-size: 1rem;
  font-weight: 600;
  color: #f3e7c9;
}

/* Footer links. */
.ce-footer-links { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; font-size: .9rem; }
.ce-footer-links a { color: #d6d3d1; text-decoration: none; }
.ce-footer-links a:hover,
.ce-footer-links a:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 3px; }

/* Booking card: readable labels; on phones the calendar comes first. */
#suite-booking .ecos-booking-glass label.text-stone-100 { color: #44403c !important; }
@media (max-width: 640px) {
  #suite-booking .ecos-booking-logo,
  #suite-booking .ecos-booking-step { display: none !important; }
  #suite-booking.py-24 { padding-top: 3.5rem; }
  #suite-booking h2.luxury-font { font-size: 2.4rem; line-height: 1.1; }
}

/* Suite character line on the homepage cards. */
.ce-suite-tagline {
  margin-top: .35rem;
  font-size: .78rem;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #1f5446;
}

/* Line icons that replaced the remaining emoji. */
.ce-chip { display: inline-flex; align-items: center; gap: .35rem; }
.ce-chip-icon { width: 16px; height: 16px; color: #1f5446; flex: none; }
.ce-loc-icon { width: 18px; height: 18px; display: inline-block; vertical-align: -3px; margin-right: .45rem; color: #1f5446; }
.ce-btn-icon { width: 20px; height: 20px; flex: none; }
.ce-fab-icon { width: 24px; height: 24px; color: #fff; }
.ce-divider-icon { width: 1.25em; height: 1.25em; display: block; }
.ecos-booking-step .ce-card-icon { justify-content: center; color: #f3e7c9; }
.ecos-booking-step .ce-card-icon .ce-icon,
.ecos-booking-step .ce-card-icon svg { width: 28px; height: 28px; }
.ecos-suite-hero__amenity-icon svg { fill: none; }

/* Refund terms, shown in the booking card before guest details. */
.ce-v123-nonrefundable { margin: .9rem 0 .4rem; font-size: .88rem; font-weight: 600; color: #7c3a12; }
