/* 2026-09 mobile and detail-page polish */
.nav-brand img {
  height: 58px !important;
  width: auto !important;
  max-width: 164px;
  object-fit: contain;
}

.route-back-wrap {
  max-width: var(--max);
  margin: 0 auto 28px;
  padding: 0 24px;
}
.route-back-home {
  position: fixed !important;
  z-index: 7000;
  top: auto !important;
  right: auto !important;
  left: 18px;
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 14px !important;
  border: 1px solid rgba(200,164,90,.48) !important;
  border-radius: 999px !important;
  background: rgba(5,22,14,.9) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.28) !important;
  backdrop-filter: blur(10px);
  color: rgba(255,255,255,.82) !important;
  text-decoration: none;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.route-back-home .route-back-arrow { color: var(--gold); font-size: 1rem; }
.route-back-home:hover { color: #fff !important; border-color: var(--gold) !important; }

.spa-media-carousel { position: relative; min-width: 0; }
.spa-media-carousel .spa-imgs {
  display: flex !important;
  gap: 0 !important;
  height: 520px;
  overflow-x: auto;
  overflow-y: hidden;
  border-radius: 12px;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.spa-media-carousel .spa-imgs::-webkit-scrollbar { display: none; }
.spa-media-carousel .spa-imgs img,
.spa-media-carousel .spa-imgs img:first-child {
  flex: 0 0 100% !important;
  width: 100% !important;
  min-width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 0 !important;
  scroll-snap-align: start;
}
.spa-carousel-arrow {
  position: absolute;
  z-index: 3;
  top: 50%;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  background: rgba(5,22,14,.78);
  color: #fff;
  font-size: 1.35rem;
  cursor: pointer;
  transform: translateY(-50%);
  backdrop-filter: blur(7px);
}
.spa-carousel-arrow:hover { background: rgba(200,164,90,.92); color: #07170f; }
.spa-carousel-prev { left: 14px; }
.spa-carousel-next { right: 14px; }
.spa-carousel-dots {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 15px;
  display: flex;
  gap: 7px;
  transform: translateX(-50%);
}
.spa-carousel-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.75);
  border-radius: 50%;
  background: transparent;
}
.spa-carousel-dot.is-active { width: 22px; border-radius: 8px; background: var(--gold); border-color: var(--gold); }

.res-form,
.res-form-panel,
.res-form-group,
.res-field,
.res-row { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
.res-form input,
.res-form textarea,
.res-form select {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.18) !important;
  background-color: rgba(255,255,255,.055) !important;
}
.res-form input::placeholder,
.res-form textarea::placeholder { color: rgba(255,255,255,.52) !important; opacity: 1; }
.res-form label { color: rgba(255,255,255,.78) !important; }
.res-service-choice { color: rgba(255,255,255,.78) !important; }
.res-service-help { color: rgba(255,255,255,.62) !important; }

/* The same polished service picker is used on every detail page. */
.res-form .res-service-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  width: 100%;
}
.res-form .res-service-choice {
  position: relative !important;
  min-width: 0 !important;
  min-height: 78px !important;
  padding: 13px 10px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  text-align: center !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.035) !important;
  cursor: pointer;
  transition: border-color .22s ease, background .22s ease, transform .22s ease;
}
.res-form .res-service-choice input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}
.res-form .res-service-choice > i {
  width: 26px !important;
  height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--gold) !important;
  font-size: 1.05rem !important;
}
.res-form .res-service-choice > span {
  width: 100% !important;
  min-height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: inherit !important;
  font-size: .78rem !important;
  line-height: 1.3 !important;
  text-align: center !important;
}
.res-form .res-service-choice:hover { transform: translateY(-2px); border-color: rgba(200,164,90,.48) !important; }
.res-form .res-service-choice.is-active {
  color: #fff !important;
  border-color: var(--gold) !important;
  background: linear-gradient(145deg,rgba(200,164,90,.17),rgba(200,164,90,.055)) !important;
  box-shadow: inset 0 0 0 1px rgba(200,164,90,.12), 0 8px 20px rgba(0,0,0,.12) !important;
}

/* Detail routes: remove inherited full-screen gaps and clear the fixed header. */
.route-page section { min-height: 0 !important; }
.route-cazare #rooms,
.route-spa #spa,
.route-atv #atv,
.route-gallery #gallery,
.route-contact #reservation {
  padding-top: calc(var(--nav-h) + 34px) !important;
}
.route-page #reservation { padding-bottom: 64px !important; }
.route-cazare #reservation,
.route-spa #reservation,
.route-atv #reservation { padding-top: 58px !important; }
.route-contact #contact { padding-top: 50px !important; }

/* Fireflies pass naturally over the central brand instead of stopping behind it. */
#home #hero-canvas { z-index: 3 !important; opacity: .82; mix-blend-mode: screen; }
.hero-brand-lockup { position: relative; isolation: isolate; }
.hero-brand-lockup::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 8% -12%;
  background: radial-gradient(ellipse at center, rgba(18,78,51,.38), rgba(4,28,18,0) 68%);
  filter: blur(18px);
  pointer-events: none;
}
.hero-brand-logo { filter: drop-shadow(0 8px 18px rgba(0,0,0,.2)); opacity: .97; }

.contact-social-grid { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px !important; }
.contact-social-grid > a { min-width:0 !important; }

.home-services-title > span {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}
.home-services-title > span > span,
.home-services-title > span > em { display: block; }
.home-services-title > span > em {
  white-space: nowrap;
  font-size: .92em;
}

/* Keep the booking heading and its decorative line optically centered on every route. */
#reservation .sec-header {
  width: min(720px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}
#reservation .sec-header .display {
  display: flex;
  justify-content: center;
  width: 100%;
  text-align: center !important;
}
#reservation .sec-header .display > span { width: 100%; text-align: center !important; }
#reservation .sec-header .divider { margin-left: auto !important; margin-right: auto !important; }

@media (max-width: 700px) {
  .nav-brand img { height: 48px !important; max-width: 112px; }
  .route-back-wrap { margin-bottom: 22px; padding: 0 20px; }
  .route-back-home { font-size: .64rem !important; }
  .spa-media-carousel .spa-imgs { height: 370px; }
  .spa-carousel-arrow { width: 40px; height: 40px; }
  .res-row { display: block !important; }
  .res-row > .res-field + .res-field { margin-top: 14px; }
  .res-form-group { padding-left: 14px !important; padding-right: 14px !important; }
  .wa-float { width: 50px !important; height: 50px !important; right: 12px !important; bottom: 14px !important; }
  .route-cazare #rooms,
  .route-spa #spa,
  .route-atv #atv,
  .route-gallery #gallery,
  .route-contact #reservation { padding-top: calc(var(--nav-h) + 24px) !important; }
  .route-cazare #reservation,
  .route-spa #reservation,
  .route-atv #reservation { padding-top: 42px !important; padding-bottom: 48px !important; }
  .route-contact #contact { padding-top: 38px !important; }
  .contact-social-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .home-services-title > span > em {
    white-space: normal;
    max-width: 100%;
    font-size: .8em;
    line-height: 1.12;
  }
}

@media (max-width: 700px) {
  .route-back-home { left: 12px; bottom: 14px; padding: 9px 12px !important; }
  .route-back-wrap { height: 0; margin: 0; padding: 0; }
}

/* Hero brand lockup */
.hero-brand-lockup {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 18px auto 24px;
  animation: fadeUp .9s ease .45s both;
}
.hero-brand-logo {
  display: block;
  width: min(540px, 82vw);
  height: auto;
  max-height: 210px;
  object-fit: contain;
  filter: drop-shadow(0 10px 28px rgba(0,0,0,.32));
}

/* A stronger, warmer identity for the private SPA page. */
.spa-title {
  display: flex !important;
  align-items: baseline;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  gap: .2em;
  margin: 18px 0 10px !important;
  font-size: clamp(3.4rem, 7vw, 6.2rem) !important;
  font-weight: 600 !important;
  letter-spacing: -.025em !important;
  line-height: .95 !important;
  color: var(--gold-pale) !important;
  text-shadow: 0 12px 36px rgba(200,164,90,.13);
}
.spa-title span { font-family: var(--fd); }
.spa-title strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .18em .28em .16em;
  border: 1px solid rgba(237,207,145,.72);
  border-radius: .13em;
  font-family: var(--fb);
  font-size: .48em;
  font-weight: 700;
  letter-spacing: .14em;
  line-height: 1;
  color: #102419;
  background: linear-gradient(135deg,#f0d79e,#c8a45a);
  box-shadow: 0 8px 24px rgba(200,164,90,.16), inset 0 1px rgba(255,255,255,.34);
  transform: translateY(-.08em);
}
.spa-title:hover { letter-spacing: -.025em !important; }
.spa-by {
  margin: 12px 0 8px !important;
  color: var(--gold-pale) !important;
  font-size: clamp(.72rem,1.4vw,.9rem) !important;
  font-weight: 600 !important;
  letter-spacing: .24em !important;
}
.spa-private-promise {
  width: min(720px,100%);
  margin: 24px auto 6px;
  padding: 14px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border: 1px solid rgba(200,164,90,.34);
  border-radius: 999px;
  background: linear-gradient(110deg,rgba(200,164,90,.12),rgba(255,255,255,.035),rgba(200,164,90,.08));
  box-shadow: 0 14px 38px rgba(0,0,0,.2);
}
.spa-private-time {
  padding-right: 14px;
  border-right: 1px solid rgba(200,164,90,.3);
  color: var(--gold);
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .18em;
}
.spa-private-promise > strong {
  color: #fff;
  font-size: .78rem;
  letter-spacing: .15em;
}
.spa-private-promise > span:last-child { color: rgba(255,255,255,.67); font-size: .76rem; }

/* Keep the private promise visually attached to the SPA photographs. */
.spa-grid { column-gap: 48px; row-gap: 18px; }
.spa-grid > .spa-media-carousel { grid-column: 1; grid-row: 1; }
.spa-grid > .spa-private-promise--below {
  grid-column: 1;
  grid-row: 2;
  width: 100%;
  margin: 0;
}
.spa-grid > .spa-private-promise--below + .sr {
  grid-column: 2;
  grid-row: 1 / span 2;
}

.spa-price-val {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}
.spa-price-val del {
  color: rgba(255,255,255,.42);
  font-family: var(--fb);
  font-size: .78rem;
  text-decoration-thickness: 1px;
}
.spa-price-val strong {
  color: var(--gold-pale);
  font-family: var(--fd);
  font-size: 1.55rem;
  font-weight: 400;
}

/* Clear promotional pricing, designed as a premium rate card rather than a table. */
.spa-prices {
  gap: 10px !important;
  margin: 20px 0 12px !important;
}
.spa-price-row {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center !important;
  gap: 18px;
  min-height: 82px;
  padding: 16px 18px !important;
  border: 1px solid rgba(200,164,90,.2) !important;
  border-radius: 11px !important;
  background: linear-gradient(115deg,rgba(255,255,255,.05),rgba(200,164,90,.035)) !important;
}
.spa-price-label {
  color: rgba(255,255,255,.76) !important;
  font-size: .78rem !important;
  font-weight: 500;
  line-height: 1.35;
}
.spa-price-val {
  display: grid;
  grid-template-columns: auto auto;
  align-items: baseline;
  justify-content: end;
  column-gap: 10px;
  row-gap: 2px;
  min-width: 185px;
}
.spa-price-val del {
  font-size: .72rem;
  opacity: .72;
}
.spa-price-val strong {
  font-size: 1.55rem;
  line-height: 1;
}
.spa-price-val span {
  grid-column: 1 / -1;
  justify-self: end;
  font-size: .66rem !important;
  letter-spacing: .04em;
}
.spa-massage-only {
  position: relative;
  overflow: hidden;
  margin-top: 14px !important;
  padding: 18px 20px !important;
  border-color: rgba(200,164,90,.22) !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg,rgba(200,164,90,.08),rgba(255,255,255,.035)) !important;
}
.spa-massage-only::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(var(--gold-pale),var(--gold));
}
.spa-massage-only > span {
  max-width: 64%;
  line-height: 1.55;
}
.spa-massage-only strong {
  color: var(--gold-pale) !important;
  font-size: 1.28rem !important;
}

.spa-benefits-more {
  grid-column: 2;
  margin-top: 7px;
  color: rgba(255,255,255,.68);
}
.spa-benefits-more summary {
  width: max-content;
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--gold-pale);
  font-size: .67rem;
  font-weight: 600;
  letter-spacing: .08em;
  cursor: pointer;
  list-style: none;
}
.spa-benefits-more summary::-webkit-details-marker { display: none; }
.spa-benefits-more summary::after {
  content: "+";
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(200,164,90,.35);
  border-radius: 50%;
  transition: transform .22s ease;
}
.spa-benefits-more[open] summary::after { content: "−"; transform: rotate(180deg); }
.spa-benefits-more p {
  margin-top: 10px;
  padding: 12px 14px;
  border-left: 2px solid rgba(200,164,90,.42);
  border-radius: 0 8px 8px 0;
  background: rgba(0,0,0,.14);
  color: rgba(255,255,255,.66);
  font-size: .72rem;
  line-height: 1.7;
}

/* Complete, centered booking panels on the service routes. */
.route-page #reservation .container {
  width: min(100%, 980px) !important;
  margin: 0 auto !important;
  padding-left: 20px !important;
  padding-right: 20px !important;
}
.route-page #reservation .res-wrap {
  display: block !important;
  width: 100% !important;
  max-width: 760px !important;
  margin: 0 auto !important;
}
.route-page #reservation .res-form-panel {
  width: 100% !important;
  padding: 26px !important;
  border: 1px solid rgba(200,164,90,.22) !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.018)) !important;
  box-shadow: 0 22px 60px rgba(0,0,0,.22) !important;
}
.route-page #reservation .res-form {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}
.route-page #reservation .res-form-notice {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 16px !important;
  margin: 0 !important;
  border: 1px solid rgba(200,164,90,.3) !important;
  border-radius: 10px !important;
  background: rgba(200,164,90,.09) !important;
  text-align: left !important;
}
.route-page #reservation .res-form-notice-icon {
  width: 42px !important;
  height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(200,164,90,.13) !important;
  color: var(--gold) !important;
}
.route-page #reservation .res-form-notice strong {
  display: block !important;
  color: #fff !important;
  font-size: .86rem !important;
  line-height: 1.5 !important;
}
.route-page #reservation .res-form-notice p {
  margin: 5px 0 0 !important;
  color: rgba(255,255,255,.62) !important;
  font-size: .76rem !important;
  line-height: 1.55 !important;
}
.route-page #reservation .res-form-group {
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 15px !important;
  padding: 20px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 11px !important;
  background: rgba(2,15,9,.3) !important;
}
.route-page #reservation .res-form-group-title {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  color: var(--gold-pale) !important;
  font-size: .75rem !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}
.route-page #reservation .res-form-group-title::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--gold);
  box-shadow: 0 0 0 4px rgba(200,164,90,.1);
}
.route-page #reservation .res-row {
  display: grid !important;
  grid-template-columns: repeat(2,minmax(0,1fr)) !important;
  gap: 12px !important;
}
.route-page #reservation .res-field { width: 100% !important; min-width: 0 !important; }
.route-page #reservation .res-field label { display: block !important; margin: 0 0 7px !important; text-align: left !important; }
.route-page #reservation .res-submit { width: 100% !important; min-height: 54px !important; justify-content: center !important; }

/* More movement without distracting from the content. */
.home-service-card { transition: transform .45s ease, border-color .45s ease, box-shadow .45s ease !important; }
.home-service-card:hover {
  transform: translateY(-8px);
  border-color: rgba(200,164,90,.34) !important;
  box-shadow: 0 26px 70px rgba(0,0,0,.25);
}
.home-service-media { overflow: hidden; }
.home-service-media img {
  transform: scale(1.015);
  animation: homeImageDrift 12s ease-in-out infinite alternate;
}
.home-service-card:nth-child(even) .home-service-media img { animation-direction: alternate-reverse; }
@keyframes homeImageDrift {
  from { transform: scale(1.015) translate3d(0,0,0); }
  to { transform: scale(1.075) translate3d(-.6%,.5%,0); }
}
.hero-brand-descriptor {
  margin-top: 12px;
  color: var(--gold-pale);
  font-size: .72rem;
  letter-spacing: .34em;
  line-height: 1.5;
  text-transform: uppercase;
}

/* Tighter rhythm and more movement on the homepage */
.home-compact #home {
  min-height: auto !important;
  padding-top: calc(var(--nav-h) + 46px) !important;
  padding-bottom: 54px !important;
}
.home-compact #home .hero-scroll { display: none; }
.hero-orb { animation: orbFloat 14s ease-in-out infinite alternate; }
.hero-menu-card {
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
}
.hero-menu-card::after {
  content: "";
  position: absolute;
  inset: -80% -45%;
  background: linear-gradient(110deg, transparent 42%, rgba(255,255,255,.09) 50%, transparent 58%);
  transform: translateX(-65%) rotate(8deg);
  transition: transform .7s ease;
  pointer-events: none;
}
.hero-menu-card:hover::after,
.hero-menu-card:focus-visible::after { transform: translateX(65%) rotate(8deg); }
.hero-menu-card i { transition: transform .3s ease, color .3s ease; }
.hero-menu-card:hover i { transform: translateY(-3px) scale(1.08); color: var(--gold); }
.hero-offer-dot { animation: offerPulse 2.2s ease-in-out infinite; }
@keyframes offerPulse {
  0%, 100% { box-shadow: 0 0 0 5px rgba(105,215,159,.1); }
  50% { box-shadow: 0 0 0 10px rgba(105,215,159,0); }
}

/* Updated footer identity */
.footer-brand-center > img {
  width: min(250px, 62vw) !important;
  height: auto !important;
  max-height: 112px;
  object-fit: contain;
  margin: 0 auto 16px !important;
  filter: drop-shadow(0 8px 22px rgba(200,164,90,.12));
}
.footer-sl { transition: transform .25s ease, background .25s ease, color .25s ease !important; }
.footer-sl:hover { transform: translateY(-4px); }
.route-page #contact { padding-bottom: 42px !important; }
.route-page footer { padding-top: 44px !important; }

/* Compact, reliable date controls on mobile Safari */
.reservation-dates { align-items: start; }
.reservation-dates .res-field {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.reservation-dates input[type="date"] {
  display: block;
  -webkit-appearance: none;
  appearance: none;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  height: 50px;
  padding: 10px 13px !important;
  box-sizing: border-box !important;
}
.reservation-date-hidden { display: none !important; }

@media (max-width: 700px) {
  .hero-brand-lockup { margin: 14px auto 18px; }
  .hero-brand-logo { width: min(350px, 86vw); max-height: 178px; }
  .hero-brand-descriptor { margin-top: 8px; font-size: .62rem; letter-spacing: .24em; }
  .reservation-dates {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    gap: 14px;
  }
  .reservation-dates .res-field { max-width: 270px; margin: 0 auto; }
  .reservation-dates .res-field + .res-field { margin-top: 0; }
  .reservation-dates input[type="date"] {
    width: 270px !important;
    max-width: 100% !important;
    height: 48px;
  }
  .home-compact #home {
    padding-top: calc(var(--nav-h) + 28px) !important;
    padding-bottom: 38px !important;
  }
  .route-page #contact { padding-bottom: 28px !important; }
  .route-page footer { padding-top: 38px !important; }
  .spa-title { gap: .13em; font-size: clamp(2.7rem,12.4vw,4rem) !important; }
  .spa-title strong { font-size: .47em; }
  .spa-by { font-size: .68rem !important; letter-spacing: .17em !important; }
  .spa-private-promise {
    width: min(360px,100%);
    margin-top: 20px;
    padding: 14px 16px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 5px 12px;
    border-radius: 12px;
    text-align: left;
  }
  .spa-private-time { grid-row: 1 / span 2; align-self: stretch; display:flex; align-items:center; }
  .spa-private-promise > strong { font-size: .73rem; }
  .spa-private-promise > span:last-child { font-size: .72rem; }
  .spa-grid > .spa-media-carousel,
  .spa-grid > .spa-private-promise--below,
  .spa-grid > .spa-private-promise--below + .sr {
    grid-column: 1;
    grid-row: auto;
  }
  .spa-grid > .spa-private-promise--below { margin-top: -2px; }
  .spa-price-row {
    grid-template-columns: minmax(0,.82fr) minmax(155px,1.18fr);
    gap: 10px;
    min-height: 78px;
    padding: 14px !important;
  }
  .spa-price-label { font-size: .72rem !important; }
  .spa-price-val { min-width: 0; column-gap: 7px; }
  .spa-price-val del { font-size: .66rem; }
  .spa-price-val strong { font-size: 1.32rem; }
  .spa-price-val span { width: auto; text-align: right; font-size: .61rem !important; }
  .spa-massage-only {
    align-items: flex-start !important;
    padding: 16px 16px 16px 19px !important;
    gap: 9px !important;
  }
  .spa-massage-only > span { max-width: none; font-size: .7rem; }
  .spa-massage-only strong { font-size: 1.22rem !important; }
  .spa-benefits-more { grid-column: 2; }
  .route-page #reservation .container { padding-left: 14px !important; padding-right: 14px !important; }
  .route-page #reservation .res-form-panel { padding: 14px !important; }
  .route-page #reservation .res-form-group { padding: 16px 14px !important; }
  .route-page #reservation .res-row { grid-template-columns: 1fr !important; gap: 14px !important; }
  .route-page #reservation .res-form-notice { grid-template-columns: 38px minmax(0,1fr) !important; padding: 14px !important; }
  .route-page #reservation .res-form-notice-icon { width: 38px !important; height: 38px !important; }

  /* The footer remains complete, but no longer dominates an entire screen. */
  footer { padding-top: 30px !important; padding-bottom: 18px !important; }
  .footer-main { gap: 20px !important; margin-bottom: 24px !important; }
  .footer-brand-center > img {
    width: min(176px, 46vw) !important;
    max-height: 76px !important;
    margin-bottom: 8px !important;
  }
  .footer-brand-name { font-size: 1rem !important; margin-bottom: 4px !important; }
  .footer-brand-loc { font-size: .61rem !important; }
  .footer-nav-center { gap: 5px 15px !important; }
  .footer-nav-center a { font-size: .58rem !important; }
  .footer-socials-center { gap: 10px !important; }
  .footer-sl { width: 38px !important; height: 38px !important; }
  .footer-tagline-center { font-size: .96rem !important; }
  .footer-bottom { padding-top: 14px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .home-service-media img { animation: none; }
}

/* 2026-09 full-site typography and spacing audit
   A calmer, more legible rhythm on phones without changing the visual identity. */
body {
  font-size: 16px;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
.display { line-height: 1.08 !important; letter-spacing: -.018em !important; }
.body-text {
  max-width: 68ch;
  font-size: 1rem !important;
  line-height: 1.78 !important;
}
.eyebrow {
  font-size: .75rem !important;
  line-height: 1.45 !important;
  letter-spacing: .18em !important;
}
.sec-header { margin-bottom: 42px !important; }
.sec-header .divider { margin-top: 18px !important; margin-bottom: 22px !important; }

/* Content text that had become too small after the earlier mobile compaction. */
.home-service-copy,
.room-card-intro,
.spa-include-desc,
.spa-special-booking p,
.atv-card-sub,
.atv-note,
.contact-card-value,
.rest-intro,
.att-card-desc {
  font-size: .9rem !important;
  line-height: 1.68 !important;
}
.home-service-points li,
.spa-feat,
.rest-feat,
.room-fac,
.atv-row {
  font-size: .86rem !important;
  line-height: 1.55 !important;
}
.home-service-kicker,
.home-service-link,
.spa-includes-title,
.atv-badge {
  font-size: .72rem !important;
  line-height: 1.35 !important;
}
.spa-include-name { font-size: .88rem !important; line-height: 1.42 !important; }
.spa-benefits-more summary { font-size: .78rem !important; }
.spa-benefits-more p { font-size: .86rem !important; line-height: 1.72 !important; }
.spa-massage-only > span { font-size: .88rem !important; }
.spa-price-label { font-size: .86rem !important; }
.spa-price-val del { font-size: .76rem !important; }
.spa-price-val span { font-size: .72rem !important; }

/* External actions must stay above editor chrome and remain easy to tap. */
.wa-float {
  z-index: 10000 !important;
  pointer-events: auto !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.footer-sl,
.contact-social-grid > a { touch-action: manipulation; }

/* Promotional packages: make the discount immediately understandable. */
.special-price-line {
  flex-wrap: wrap;
  align-items: baseline !important;
  gap: 7px 12px !important;
}
.special-old {
  color: rgba(255,255,255,.44);
  font-size: .82rem;
  font-weight: 400;
  text-decoration-color: rgba(255,255,255,.58);
  text-decoration-thickness: 1px;
}
.special-current { font-weight: 400; }

@media (max-width: 700px) {
  .sec-dark,
  .sec-dark2,
  .sec-warm { padding-top: 54px !important; padding-bottom: 54px !important; }
  .container { padding-left: 20px !important; padding-right: 20px !important; }
  .display--xl { font-size: clamp(2.45rem,11vw,3.4rem) !important; }
  .display--lg { font-size: clamp(2.15rem,9.4vw,3rem) !important; }
  .display--md { font-size: clamp(1.85rem,8.2vw,2.55rem) !important; }
  .display--sm { font-size: clamp(1.45rem,6.5vw,2rem) !important; }
  .sec-header { margin-bottom: 32px !important; }
  .body-text { font-size: .96rem !important; line-height: 1.72 !important; }
  .eyebrow { font-size: .7rem !important; letter-spacing: .15em !important; }
  .home-services { padding-top: 58px !important; padding-bottom: 58px !important; }
  .home-services-head { margin-bottom: 30px !important; }
  .home-service-content { padding: 24px 22px !important; }
  .home-service-title { margin-top: 9px !important; font-size: 1.8rem !important; line-height: 1.14 !important; }
  .home-service-copy { font-size: .9rem !important; }
  .home-service-points { gap: 9px !important; }
  .home-service-points li { font-size: .84rem !important; }
  .home-service-price { margin-top: 17px !important; font-size: 1.25rem !important; }
  .home-service-link { min-height: 42px; align-items: center; font-size: .72rem !important; }
  .spa-includes { padding: 14px !important; }
  .spa-include-item { padding: 14px 13px !important; column-gap: 12px !important; }
  .spa-include-desc { font-size: .84rem !important; }
  .spa-benefits-more { margin-top: 9px !important; }
  .spa-benefits-more p { padding: 12px !important; font-size: .83rem !important; }
  .spa-price-row { min-height: 82px; }
  .spa-price-label { font-size: .8rem !important; }
  .spa-price-val del { font-size: .72rem !important; }
  .spa-price-val span { font-size: .68rem !important; }
  .spa-massage-only > span { font-size: .84rem !important; }
  .spa-special-booking { padding: 17px !important; }
  .spa-special-booking p { font-size: .86rem !important; }
  .spa-special-booking a { font-size: .72rem !important; line-height: 1.5 !important; }
  .res-form label,
  .res-service-help { font-size: .86rem !important; line-height: 1.5 !important; }
  .res-form input,
  .res-form textarea,
  .res-form select { font-size: 16px !important; line-height: 1.4 !important; }
  .res-form .res-service-choice > span { font-size: .82rem !important; }
  .route-page #reservation .res-form-group { gap: 17px !important; }
  .footer-nav-center a { font-size: .68rem !important; line-height: 1.55 !important; }
  .footer-brand-loc { font-size: .68rem !important; }
  .special-price-line { margin-top: 9px !important; }
  .special-old { font-size: .78rem; }
  .special-current { font-size: 2.05rem !important; }
}

/* 2026-09 final mobile rhythm audit */
@media (max-width: 700px) {
  .sec-dark,
  .sec-dark2,
  .sec-warm {
    padding-top: 64px !important;
    padding-bottom: 64px !important;
  }

  .route-cazare #rooms,
  .route-spa #spa,
  .route-atv #atv,
  .route-gallery #gallery,
  .route-contact #reservation {
    padding-top: calc(var(--nav-h) + 34px) !important;
  }

  .sec-header { margin-bottom: 38px !important; }
  .sec-header .divider { margin-top: 20px !important; margin-bottom: 24px !important; }
  .body-text { line-height: 1.82 !important; }

  .spa-grid { row-gap: 28px !important; }
  .spa-grid > .spa-private-promise--below { margin-top: -10px !important; }
  .spa-grid > .spa-private-promise--below + .sr { margin-top: 4px; }

  .spa-includes {
    margin-top: 26px !important;
    padding: 20px 18px !important;
    border-radius: 14px !important;
  }
  .spa-includes-title {
    margin-bottom: 18px !important;
    line-height: 1.55 !important;
  }
  .spa-includes-grid { gap: 16px !important; }
  .spa-include-item {
    grid-template-columns: 46px minmax(0,1fr) !important;
    column-gap: 16px !important;
    row-gap: 7px !important;
    padding: 20px 18px !important;
    border-radius: 12px !important;
  }
  .spa-include-item i {
    width: 44px !important;
    height: 44px !important;
    font-size: 1rem !important;
  }
  .spa-include-name {
    font-size: 1rem !important;
    line-height: 1.4 !important;
  }
  .spa-include-desc {
    margin-top: 2px !important;
    font-size: .94rem !important;
    line-height: 1.78 !important;
  }
  .spa-benefits-more {
    grid-column: 2 !important;
    margin-top: 6px !important;
  }
  .spa-benefits-more summary {
    min-height: 36px;
    font-size: .83rem !important;
    line-height: 1.45 !important;
  }
  .spa-benefits-more summary::after {
    width: 24px !important;
    height: 24px !important;
  }
  .spa-benefits-more p {
    margin-top: 12px !important;
    padding: 15px 16px !important;
    font-size: .9rem !important;
    line-height: 1.8 !important;
  }

  .spa-prices {
    gap: 14px !important;
    margin: 28px 0 16px !important;
  }
  .spa-price-row {
    min-height: 96px !important;
    padding: 19px 18px !important;
    border-radius: 13px !important;
  }
  .spa-price-label { font-size: .9rem !important; line-height: 1.5 !important; }
  .spa-price-val strong { font-size: 1.52rem !important; }
  .spa-price-val del { font-size: .78rem !important; }
  .spa-price-val span { margin-top: 3px; font-size: .74rem !important; line-height: 1.4 !important; }
  .spa-massage-only {
    margin-top: 18px !important;
    padding: 20px 20px 20px 23px !important;
    gap: 13px !important;
    border-radius: 13px !important;
  }
  .spa-massage-only > span { font-size: .92rem !important; line-height: 1.7 !important; }
  .spa-massage-only strong { font-size: 1.38rem !important; line-height: 1.35 !important; }
  .spa-special-booking {
    margin-top: 18px !important;
    padding: 21px 20px !important;
    gap: 16px !important;
    border-radius: 13px !important;
  }
  .spa-special-booking p { font-size: .92rem !important; line-height: 1.72 !important; }
  .spa-feats { margin-top: 26px !important; gap: 15px 20px !important; }
  .spa-feat { font-size: .9rem !important; line-height: 1.6 !important; }

  .home-services-head { margin-bottom: 38px !important; }
  .home-service-card + .home-service-card { margin-top: 28px; }
  .home-service-content { padding: 28px 24px !important; }
  .home-service-copy { line-height: 1.75 !important; }

  .route-page #reservation { padding-top: 56px !important; padding-bottom: 76px !important; }
  .route-page #reservation .res-form-panel { padding: 18px !important; }
  .route-page #reservation .res-form { gap: 20px !important; }
  .route-page #reservation .res-form-group {
    padding: 20px 18px !important;
    gap: 19px !important;
    border-radius: 13px !important;
  }
  .res-form .res-service-grid { gap: 12px !important; }
  .res-form .res-service-choice {
    min-height: 92px !important;
    padding: 16px 12px !important;
    gap: 9px !important;
  }
  .res-form .res-service-choice > span { font-size: .87rem !important; }
  .route-page #reservation .res-field label { margin-bottom: 9px !important; }

  .contact-social-grid { gap: 12px !important; }
  .contact-social-grid > a { min-height: 50px; }
  .route-page footer { padding-top: 50px !important; }
  footer { padding-bottom: 28px !important; }
}

@media (max-width: 420px) {
  .container { padding-left: 18px !important; padding-right: 18px !important; }
  .spa-includes { padding: 18px 14px !important; }
  .spa-include-item {
    grid-template-columns: 42px minmax(0,1fr) !important;
    column-gap: 13px !important;
    padding: 18px 15px !important;
  }
  .spa-include-item i { width: 40px !important; height: 40px !important; }
  .spa-price-row {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .spa-price-val { justify-content: start !important; justify-items: start !important; }
  .spa-price-val span { justify-self: start !important; text-align: left !important; }
}

/* Self check-in: calm arrival information in the existing green/gold palette. */
.arrival-preview{background:#0d2c20;padding:34px 0;border-block:1px solid rgba(210,183,126,.18)}
.arrival-preview-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}
.arrival-kicker{display:block;color:#cdb783;font-size:.66rem;letter-spacing:.2em;line-height:1.7;margin-bottom:12px}
.arrival-preview h2,.arrival-details h2{color:#f3ead9;font-family:var(--fd,Georgia,serif);font-weight:400;font-size:clamp(2rem,4vw,3.2rem);line-height:1.15;margin:0 0 14px}
.arrival-preview em,.arrival-details em{color:#dcc591;font-style:normal;white-space:nowrap}
.arrival-preview p,.arrival-details p{font-size:.95rem;line-height:1.8;color:#c7d3ca;margin:0}
.arrival-link{white-space:nowrap;color:#ebd6a5;text-decoration:none;border-bottom:1px solid #8a7956;padding:10px 0;font-size:.88rem;display:inline-flex;gap:18px}
.route-cazare #self-check-in{display:block!important}
.arrival-details{background:#102e22;padding:72px 0;scroll-margin-top:125px}
.arrival-intro{max-width:690px}
.arrival-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:36px 0}
.arrival-step{padding:26px;border:1px solid rgba(221,196,145,.22);border-radius:16px;background:rgba(255,255,255,.025)}
.arrival-number{display:block;font-family:var(--fd,Georgia,serif);font-size:2.3rem;color:#dcc591;margin-bottom:18px;line-height:1}
.arrival-step h3{font-size:1.1rem;line-height:1.5;color:#f1e9d8;margin:0 0 12px;font-weight:500}
.arrival-details .arrival-note{border-top:1px solid rgba(221,196,145,.2);padding-top:24px;font-size:.85rem;color:#b9c6bd}
.arrival-note strong{color:#e8d4a5;font-weight:500}
@media(max-width:700px){.arrival-preview-inner{align-items:flex-start;flex-direction:column;gap:16px}.arrival-preview{padding:32px 0}.arrival-details{padding:48px 0}.arrival-steps{grid-template-columns:1fr;gap:16px;margin:28px 0}.arrival-step{padding:24px}.arrival-preview p,.arrival-details p{font-size:.92rem;line-height:1.8}}

/* Give current SPA rates a clearer visual emphasis. */
.spa-price-val strong {
  font-size: 1.85rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}
@media (max-width: 600px) {
  .spa-price-val strong { font-size: 1.75rem !important; }
}

/* Put rates ahead of the facility descriptions and keep payment options easy to scan. */
.spa-rates-heading{margin-top:28px;color:var(--gold-pale);font-size:1rem;font-weight:600;line-height:1.5}
.spa-rates-heading + .spa-prices{margin-top:12px!important;margin-bottom:28px!important}
#payment-methods,.route-page #payment-methods{display:block!important;background:#102b20;padding:64px 0;border-top:1px solid rgba(220,197,145,.18)}
#payment-methods h2{margin-bottom:28px}
.payment-methods-grid{display:grid;grid-template-columns:1fr 1fr 1.6fr;gap:16px}
.payment-method{padding:26px;border:1px solid rgba(220,197,145,.24);border-radius:14px;background:rgba(255,255,255,.025)}
.payment-method>i{color:var(--gold-pale);font-size:1.45rem;display:block;margin-bottom:18px}
.payment-method h3{margin:0;color:#f0e6cf;font-size:1.1rem;font-weight:600;line-height:1.5}
.payment-method p{margin:10px 0 0;color:#d3d9cf;font-size:1rem;line-height:1.7}
@media(max-width:600px){#payment-methods,.route-page #payment-methods{padding:44px 0}.payment-methods-grid{grid-template-columns:1fr 1fr;gap:12px}.payment-method{padding:20px}.payment-method--vouchers{grid-column:1/-1}.payment-method h3{font-size:1rem}}

/* Align the per-person caption directly beneath the current price. */
.spa-price-val strong{grid-column:2;grid-row:1;justify-self:center!important}
.spa-price-val del{grid-column:1;grid-row:1}
.spa-price-val span{grid-column:2!important;grid-row:2;justify-self:center!important;text-align:center!important;width:auto!important}
.spa-closing{max-width:760px;margin:60px auto 0;padding:38px 24px 0;border-top:1px solid rgba(220,197,145,.3);text-align:center}
.spa-closing h2{font-family:var(--fd);font-size:clamp(2rem,4vw,3rem);font-weight:400;line-height:1.2;color:var(--gold-pale);margin:0 0 20px}
.spa-closing p{font-size:1rem;line-height:1.9;color:rgba(255,255,255,.74);margin:0}
@media(max-width:600px){.spa-closing{margin-top:40px;padding:30px 4px 0}}

/* Quantity selector matches the date control width. */
.res-form #res-quantity-field{width:calc((100% - 20px)/2)!important;max-width:100%;margin:0!important;box-sizing:border-box}
.res-form #res-quantity{display:block;width:100%!important;max-width:100%!important;min-width:0;box-sizing:border-box;height:50px;padding:10px 13px!important;font:inherit}
.res-form #res-quantity option{background:#102b20;color:#fff}
@media(max-width:700px){.res-form #res-quantity-field{width:270px!important;max-width:100%!important;margin:0 auto!important}.res-form #res-quantity{height:48px}}