.stay-page {
  min-height: 100dvh;
  background: var(--petra-cream);
}

.stay-layout {
  padding-block: clamp(4.25rem, 9vw, 8rem) clamp(5rem, 10vw, 9rem);
}

.stay-booking {
  width: min(100%, 68rem);
  margin-inline: auto;
}

.stay-booking__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
  padding-bottom: clamp(1.5rem, 4vw, 2.75rem);
  border-bottom: 1px solid var(--petra-ink);
}

.stay-booking__header h1 {
  max-width: 17ch;
  margin: 0;
  font-family: var(--petra-serif);
  font-size: clamp(2.25rem, 5.2vw, 4.9rem);
  font-weight: 400;
  letter-spacing: -0.055em;
  line-height: 0.98;
}

.stay-back-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  color: var(--petra-stone);
  font-size: 0.78rem;
  text-decoration: none;
}

.stay-back-link:hover { color: var(--petra-ink); text-decoration: underline; text-underline-offset: 0.3rem; }

.stay-form {
  display: grid;
  margin-top: clamp(1.75rem, 4vw, 3.5rem);
  border: 1px solid var(--petra-line);
  background: #fffefa;
}

.stay-calendar {
  padding: clamp(1.1rem, 3vw, 2rem);
  border: 0;
  background: transparent;
  color: var(--petra-ink);
}

.stay-calendar[data-invalid="true"] { outline: 2px solid var(--petra-danger); outline-offset: -2px; }

.stay-calendar__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1.1rem;
  border-bottom: 1px solid var(--petra-line);
}

.stay-field-label {
  display: block;
  margin: 0;
  color: var(--petra-stone);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.02em;
  line-height: 1.2;
}

.stay-calendar__range {
  min-height: 1.5em;
  margin: 0.38rem 0 0;
  color: var(--petra-ink);
  font-family: var(--petra-serif);
  font-size: clamp(1.15rem, 1.8vw, 1.45rem);
  font-weight: 400;
  line-height: 1.15;
}

.stay-calendar__range[data-empty="true"] { color: var(--petra-stone); }

.stay-calendar__actions,
.stay-calendar__navigation {
  display: flex;
  align-items: center;
}

.stay-calendar__actions { gap: 0.9rem; }
.stay-calendar__navigation { gap: 0.35rem; }

.stay-calendar__reset,
.stay-calendar__navigation button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border: 0;
  background: transparent;
  color: var(--petra-ink);
  cursor: pointer;
}

.stay-calendar__reset {
  padding-inline: 0;
  color: var(--petra-stone);
  font-size: 0.77rem;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.3rem;
}

.stay-calendar__navigation button {
  width: 44px;
  border: 1px solid var(--petra-line);
  font-size: 1.05rem;
}

.stay-calendar__navigation button:hover:not(:disabled),
.stay-calendar__navigation button:focus-visible {
  border-color: var(--petra-ink);
  background: var(--petra-ink);
  color: var(--petra-cream);
}

.stay-calendar__navigation button:disabled { cursor: default; opacity: 0.32; }

.stay-calendar__months {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1rem, 3.7vw, 3.5rem);
  padding-top: clamp(1.25rem, 3vw, 2rem);
}

.stay-calendar__month + .stay-calendar__month { border-inline-start: 1px solid var(--petra-line); padding-inline-start: clamp(1rem, 3.7vw, 3.5rem); }
.stay-calendar__month-title { margin: 0 0 1.15rem; font-family: var(--petra-serif); font-size: clamp(1.3rem, 2.2vw, 1.8rem); font-weight: 400; letter-spacing: -0.035em; line-height: 1; text-transform: capitalize; }

.stay-calendar__weekdays,
.stay-calendar__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 0.12rem;
}

.stay-calendar__weekdays { margin-bottom: 0.45rem; }

.stay-calendar__weekdays span {
  display: grid;
  min-width: 0;
  min-height: 1.7rem;
  place-items: center;
  color: var(--petra-stone);
  font-size: 0.58rem;
  font-weight: 680;
  line-height: 1;
}

.stay-calendar__blank { min-height: 2.7rem; }

.stay-calendar__day {
  display: grid;
  width: 100%;
  min-width: 0;
  min-height: 2.7rem;
  place-items: center;
  border: 1px solid transparent;
  background: transparent;
  color: var(--petra-ink);
  cursor: pointer;
  font-size: 0.81rem;
  font-weight: 560;
}

.stay-calendar__day:hover:not(:disabled),
.stay-calendar__day:focus-visible { border-color: var(--petra-ink); }
.stay-calendar__day:disabled { cursor: default; color: rgba(29, 33, 31, 0.28); }
.stay-calendar__day.is-between { background: #ecebe4; }
.stay-calendar__day.is-selected { border-color: var(--petra-ink); background: var(--petra-ink); color: var(--petra-cream); }
.stay-calendar__status { min-height: 1.35em; margin: 1rem 0 0; color: var(--petra-stone); font-size: 0.78rem; line-height: 1.45; }

.stay-guests {
  border-top: 1px solid var(--petra-line);
}

.stay-guests summary {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto 1.1rem;
  min-height: 5.1rem;
  align-items: center;
  gap: 1rem;
  padding: 0.8rem clamp(1.1rem, 3vw, 2rem);
  cursor: pointer;
  list-style: none;
}

.stay-guests summary::-webkit-details-marker { display: none; }
.stay-guests summary strong { min-width: 0; color: var(--petra-ink); font-size: 0.94rem; font-weight: 520; text-align: end; }
.stay-guests__chevron { width: 0.5rem; height: 0.5rem; border-right: 1px solid currentColor; border-bottom: 1px solid currentColor; transform: rotate(45deg) translateY(-0.18rem); transition: transform 160ms ease; }
.stay-guests[open] .stay-guests__chevron { transform: rotate(225deg) translate(-0.1rem, -0.1rem); }

.stay-guests__controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--petra-line); }

.guest-control {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem clamp(1.1rem, 3vw, 2rem);
}

.guest-control + .guest-control { border-inline-start: 1px solid var(--petra-line); }
.guest-control label { display: block; color: var(--petra-ink); font-size: 0.91rem; font-weight: 570; }
.guest-control small { display: block; margin-top: 0.16rem; color: var(--petra-stone); font-size: 0.72rem; }

.guest-control__stepper { display: grid; grid-template-columns: 2.75rem 2.4rem 2.75rem; align-items: center; border: 1px solid var(--petra-line); }
.guest-control__stepper button,
.guest-control__stepper input { min-width: 0; min-height: 2.75rem; border: 0; background: transparent; color: var(--petra-ink); text-align: center; }
.guest-control__stepper button { cursor: pointer; font-size: 1.15rem; }
.guest-control__stepper button:hover:not(:disabled) { background: var(--petra-paper); }
.guest-control__stepper button:disabled { color: var(--petra-stone); cursor: default; opacity: 0.5; }
.guest-control__stepper input { border-inline: 1px solid var(--petra-line); font-size: 0.9rem; font-weight: 600; }
.guest-control__stepper input::-webkit-inner-spin-button,
.guest-control__stepper input::-webkit-outer-spin-button { margin: 0; }

.form-message { min-height: 1.25em; margin: 0; padding: 0.75rem clamp(1.1rem, 3vw, 2rem) 0; color: var(--petra-danger); font-size: 0.8rem; }

.stay-form__submit {
  justify-self: start;
  min-width: min(100%, 14rem);
  margin: 1.5rem clamp(1.1rem, 3vw, 2rem) clamp(1.1rem, 3vw, 2rem);
  border-color: var(--petra-ink);
  background: var(--petra-ink);
}

@media (max-width: 47.99rem) {
  .stay-layout { padding-top: 2.25rem; }
  .stay-booking__header { align-items: flex-start; flex-direction: column-reverse; gap: 0.25rem; padding-bottom: 1.5rem; }
  .stay-booking__header h1 { font-size: clamp(2.05rem, 11.2vw, 3.15rem); }
  .stay-back-link { min-height: 36px; font-size: 0.74rem; }
  .stay-form { margin-top: 1.5rem; }
  .stay-calendar { padding: 1rem 0.85rem; }
  .stay-calendar__header { align-items: flex-start; }
  .stay-calendar__actions { align-items: flex-end; flex-direction: column-reverse; gap: 0.25rem; }
  .stay-calendar__navigation button { width: 38px; min-height: 38px; }
  .stay-calendar__months { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; padding-top: 1.35rem; }
  .stay-calendar__month + .stay-calendar__month { border-top: 1px solid var(--petra-line); border-inline-start: 0; padding-top: 1.4rem; padding-inline-start: 0; }
  .stay-calendar__day { min-height: clamp(2.35rem, 10vw, 2.8rem); }
  .stay-guests summary { min-height: 4.85rem; grid-template-columns: minmax(0, 1fr) auto 0.75rem; gap: 0.6rem; padding-inline: 0.85rem; }
  .stay-guests summary strong { max-width: 11rem; font-size: 0.84rem; }
  .stay-guests__controls { grid-template-columns: minmax(0, 1fr); }
  .guest-control + .guest-control { border-top: 1px solid var(--petra-line); border-inline-start: 0; }
  .guest-control { padding: 0.9rem 0.85rem; }
  .guest-control__stepper { grid-template-columns: 2.55rem 2.2rem 2.55rem; }
  .stay-form__submit { width: calc(100% - 1.7rem); margin: 1.1rem 0.85rem 0.85rem; }
}

@media (prefers-reduced-motion: reduce) {
  .stay-guests__chevron { transition: none; }
}
