.portfolio-page .tile:nth-child(n) { display: block; order: initial; }
.portfolio-page .gallery { margin-top: 0; }
.portfolio-page .pricing-hero, .contact-page .pricing-hero {
  background: linear-gradient(90deg, #292a27bf, #292a2780 43%, #292a2733 100%), url(/assets/hero.webp) center 60% / cover no-repeat, var(--olive);
}
.booking-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 82px); padding-block: clamp(42px, 6vw, 96px); }
.booking-layout h2 { font-size: clamp(29px, 3.4vw, 49px); margin-bottom: 18px; }
#booking-form { display: grid; gap: 20px; justify-items: start; }
#booking-form > label, #booking-form fieldset, .form-row { width: 100%; }
#booking-form label { display: grid; gap: 7px; font-weight: 600; }
.form-row, .service-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
#booking-form fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
#booking-form legend { margin-bottom: 8px; font-weight: 600; }
#booking-form input:not([type=radio]):not([type=checkbox]), #booking-form textarea { width: 100%; min-width: 0; min-height: 44px; border: 1px solid #73756890; padding: 10px 12px; background: #fbfaf7; border-radius: 4px; color: var(--ink); font: inherit; font-weight: 400; }
#booking-form textarea { resize: vertical; }
.size-options { display: flex; flex-wrap: wrap; gap: 8px; }
.size-options label { position: relative; cursor: pointer; }
.size-options input { position: absolute; opacity: 0; }
.size-options span { border: 1px solid #73756890; padding: 9px 12px; border-radius: 100px; font-size: 14px; }
.size-options input:checked + span { background: var(--olive); color: white; }
.size-options input:focus-visible + span { outline: 2px solid #b6924a; outline-offset: 3px; }
#booking-form .service-options label { display: flex; align-items: center; font-weight: 400; }
.service-options input { accent-color: var(--olive); width: 18px; height: 18px; }
.form-note, #booking-status { font-size: 14px; }
#booking-status:empty { display: none; }
.booking-contact { border-left: 1px solid #73756865; padding-left: clamp(18px, 3vw, 44px); }
.booking-contact p { margin-bottom: 12px; overflow-wrap: anywhere; }
.booking-contact .button { margin-top: 12px; }
@media(max-width: 760px) {
  .booking-layout { grid-template-columns: 1fr; }
  .booking-contact { border-left: 0; border-top: 1px solid #73756865; padding: 24px 0 0; }
  .portfolio-page .pricing-hero, .contact-page .pricing-hero { background-size: auto, cover; }
}
@media(max-width: 430px) { .form-row, .service-options { grid-template-columns: 1fr; } }

#booking-form { font-family: var(--sans); }
#booking-form h2 { font-family: var(--serif); }
#booking-form input, #booking-form textarea, #booking-form button { font-family: var(--sans); }
.booking-faq { padding-bottom: clamp(42px, 6vw, 96px); }
.booking-faq h2 { font-size: clamp(30px, 4vw, 54px); margin-bottom: 24px; }
.booking-faq details { border-top: 1px solid #73756865; }
.booking-faq details:last-child { border-bottom: 1px solid #73756865; }
.booking-faq summary { cursor: pointer; padding: 18px 0; font-weight: 600; }
.booking-faq p, .booking-faq ul { max-width: 72ch; margin: 0 0 20px; }
.booking-faq li + li { margin-top: 8px; }

.booking-contact {
  align-self: start;
  padding: clamp(20px, 3vw, 38px);
  border: 1px solid #73756838;
  border-radius: 10px;
  background: #eeece5;
}
.booking-contact h2 { font-size: clamp(28px, 2.8vw, 42px); }
.booking-contact address { border: 0; padding: 0; gap: 14px; }
.booking-contact address > * { display: flex; align-items: center; gap: 10px; font-size: 15px; overflow-wrap: anywhere; }
.booking-contact address svg { width: 21px; height: 21px; flex: 0 0 21px; color: var(--olive); }
.booking-contact address a:hover { text-decoration: underline; text-underline-offset: 3px; }
.booking-contact .button { margin-top: 22px; }
