/* Booking page (Figma 128:729) */
:root {
  --bk-main-w: 39.3125rem;      /* 629 */
  --bk-side-w: 31.125rem;       /* 498 */
  --bk-side-gap: 3.5625rem;     /* 57 */
  --bk-help-ratio: 498 / 609;
  --bk-promo-ratio: 498 / 305;
  --bk-promo-overlay: rgba(68, 64, 60, 0.45);
  --bk-icon: 1.75rem;
}

.booking__row { display: flex; justify-content: space-between; align-items: flex-start; column-gap: var(--space-8); row-gap: var(--space-8); }
.booking__main { flex: 1 1 0%; min-width: 0; max-width: var(--bk-main-w); margin-top: -0.6875rem; }
.booking__side { flex: 1 1 0%; min-width: 0; max-width: var(--bk-side-w); display: flex; flex-direction: column; gap: var(--bk-side-gap); }
.booking__head { display: flex; flex-direction: column; gap: var(--space-4); margin-bottom: var(--space-6); }
.booking__form { gap: var(--space-4); }
.booking__form .form__group { gap: var(--space-2); }
.booking__form .form__legend { margin-bottom: var(--space-2); }
.booking__head .text { margin-top: var(--space-3); }

/* help card */
.help-card { position: relative; overflow: hidden; isolation: isolate; display: flex; align-items: center; justify-content: center; aspect-ratio: var(--bk-help-ratio); min-height: 0; background: var(--c-ink); text-align: center; }
.help-card__bg, .promo-link__bg { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
.help-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--c-overlay); }
.help-card__body { display: flex; flex-direction: column; align-items: center; gap: var(--space-4); padding: var(--space-6) var(--space-5); max-width: 25rem; }
.help-card__label { font-family: var(--ff-serif); font-weight: 500; font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-h3); text-transform: uppercase; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.3em; }
.help-card__contact { display: flex; flex-direction: column; align-items: center; gap: var(--space-2); margin-top: var(--space-2); }
.help-card__link { display: inline-flex; align-items: center; gap: var(--space-3); min-height: 1.75rem; color: var(--c-white); }
.help-card__link:hover { text-decoration: underline; text-underline-offset: 0.25em; }
.help-card__link:focus-visible, .promo-link:focus-visible { outline-color: var(--c-sand); }
.help-card__link--phone { font-family: var(--ff-serif); font-weight: 500; font-size: var(--fs-h3); letter-spacing: var(--ls-h3); }
.help-card__icon { display: inline-flex; align-items: center; justify-content: center; flex: none; width: var(--bk-icon); height: var(--bk-icon); background: var(--c-accent); color: var(--c-white); }
.help-card__icon svg { width: 60%; height: 60%; }

/* portfolio promo */
.promo-link { position: relative; overflow: hidden; isolation: isolate; display: flex; align-items: center; justify-content: center; aspect-ratio: var(--bk-promo-ratio); background: var(--c-ink); color: var(--c-white); text-align: center; }
.promo-link::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--bk-promo-overlay); transition: background-color var(--t-med) var(--ease); }
.promo-link:hover::before { background: var(--c-overlay); }
.promo-link:focus-visible { outline-offset: -6px; }
.promo-link__body { display: flex; flex-direction: column; gap: var(--space-2); width: 100%; padding: var(--space-5); }
.promo-link__script { font-family: var(--ff-script); font-size: clamp(3.25rem, 2rem + 4vw, 5.5rem); line-height: 1; letter-spacing: 0; }
.promo-link .divider-ornament::before, .promo-link .divider-ornament::after { background: var(--c-white); }
.promo-link .divider-ornament__mark { filter: brightness(0) invert(1); }

@media (max-width: 991px) {
  .booking__row { flex-direction: column; align-items: stretch; }
  .booking__main { flex: none; max-width: none; margin-top: 0; }
  .booking__side { flex: none; max-width: none; flex-direction: row; gap: var(--gap-grid); align-items: stretch; }
  .help-card, .promo-link { flex: 1 1 0%; min-width: 0; aspect-ratio: auto; min-height: 24rem; }
}
@media (max-width: 767px) {
  .booking__side { flex-direction: column; }
  .help-card { flex: none; min-height: 0; aspect-ratio: var(--bk-help-ratio); }
  .promo-link { flex: none; min-height: 0; aspect-ratio: var(--bk-promo-ratio); }
}
@media (prefers-reduced-motion: reduce) {
  .promo-link::before { transition: none; }
}