/* Popups: native dialogs. */
.mq-popup { width: min(var(--mq-popup-width, 560px), calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 0; border: 0; border-radius: var(--kit-radius, 12px); background: var(--kit-surface, Canvas); color: inherit; box-shadow: 0 24px 64px rgb(0 0 0 / .35); overflow: auto; }
.mq-popup::backdrop { background: rgb(0 0 0 / .55); }
.mq-popup--bottom { margin-block-end: 1rem; margin-block-start: auto; }
.mq-popup--corner { margin: auto 1rem 1rem auto; }
.mq-popup__body { padding: 1.5rem; }
.mq-popup__close-form { position: sticky; top: 0; display: flex; justify-content: flex-end; height: 0; z-index: 2; }
.mq-popup__close { margin: .5rem; width: 2.25rem; height: 2.25rem; border-radius: 999px; border: 0; background: color-mix(in srgb, currentColor 12%, transparent); color: inherit; font-size: 1.4rem; line-height: 1; cursor: pointer; }
.mq-popup[open] { animation: mq-popup-in .25s ease-out; }
@keyframes mq-popup-in { from { opacity: 0; transform: translateY(12px) scale(.98); } }

/* Entrances: hidden only when a script is there to reveal them, and never
   for someone who asked for less motion. */
@media (scripting: enabled) and (prefers-reduced-motion: no-preference) {
  .mq-anim { transition: opacity var(--mq-anim-duration, 600ms) ease var(--mq-anim-delay, 0ms), transform var(--mq-anim-duration, 600ms) cubic-bezier(.2, .7, .2, 1) var(--mq-anim-delay, 0ms); }
  .mq-anim:not(.is-in) { opacity: 0; }
  .mq-anim--up:not(.is-in) { transform: translateY(32px); }
  .mq-anim--down:not(.is-in) { transform: translateY(-32px); }
  .mq-anim--left:not(.is-in) { transform: translateX(-32px); }
  [dir="rtl"] .mq-anim--left:not(.is-in) { transform: translateX(32px); }
  .mq-anim--zoom:not(.is-in) { transform: scale(.92); }
}
@media (prefers-reduced-motion: reduce) {
  .mq-popup[open] { animation: none; }
}

/* The booking card (Assistant\BookingCard): a calendar icon, a headline, a line of text and a
   button, in the colours of the site's AI chat (--mqa-*, set on the dialog). */
.mq-popup--corner:has(.mq-booking-card) {
  padding: 0;
  border: 0;
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 0 0 1px rgba(16, 24, 40, .06), 0 30px 70px -20px color-mix(in srgb, var(--mqa-deep, #10264a) 55%, transparent), 0 12px 30px -16px color-mix(in srgb, var(--mqa-accent, #c44318) 45%, transparent);
  overflow: hidden;
  animation: mq-card-in .6s cubic-bezier(.2, .8, .2, 1) both;
}
.mq-popup--corner:has(.mq-booking-card)::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 4px;
  background: linear-gradient(90deg, var(--mqa-accent, #c44318), var(--mqa-accent-2, #e8692f), var(--mqa-spark, #ffc21a));
}
@keyframes mq-card-in { from { opacity: 0; transform: translateY(24px) scale(.96); } }
.mq-booking-card { display: flex; flex-direction: column; gap: .4rem; padding: 1.6rem 1.6rem 1.5rem; color: #12151c; }
.mq-booking-card::before {
  content: "";
  width: 48px;
  height: 48px;
  margin-bottom: .75rem;
  border-radius: 14px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'%3E%3Crect x='3.5' y='5' width='17' height='15' rx='2.5'/%3E%3Cpath d='M3.5 10h17M8 3v4M16 3v4'/%3E%3Ccircle cx='8.5' cy='14' r='.6' fill='%23fff'/%3E%3Ccircle cx='12' cy='14' r='.6' fill='%23fff'/%3E%3Ccircle cx='15.5' cy='14' r='.6' fill='%23fff'/%3E%3Ccircle cx='8.5' cy='17' r='.6' fill='%23fff'/%3E%3Ccircle cx='12' cy='17' r='.6' fill='%23fff'/%3E%3C/svg%3E") center / 24px no-repeat,
    radial-gradient(120% 120% at 30% 20%, var(--mqa-accent-2, #e8692f), var(--mqa-accent, #c44318));
  box-shadow: 0 10px 22px -10px var(--mqa-accent, #c44318);
}
.mq-booking-card .mq-booking-card__head :is(h2, h3, h4) { margin: 0; font-size: 1.5rem; line-height: 1.2; letter-spacing: -.015em; color: var(--mqa-deep, #10264a); }
.mq-booking-card .mq-booking-card__text p { margin: 0 0 1.1rem; color: #4f5868; font-size: 1.02rem; line-height: 1.5; }
.mq-booking-card .mq-booking-card__go { margin: 0; }
.mq-booking-card .mq-booking-card__go a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;
  border: 0;
  border-radius: 14px;
  color: #fff;
  font-weight: 700;
  text-decoration: none;
  background: linear-gradient(135deg, var(--mqa-accent-2, #e8692f), var(--mqa-accent, #c44318));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 12px 26px -12px var(--mqa-accent, #c44318);
  transition: transform .2s, filter .2s;
}
.mq-booking-card .mq-booking-card__go a:hover { transform: translateY(-1px); filter: brightness(1.06); }
.mq-popup--corner:has(.mq-booking-card) .mq-popup__close { color: #6b7280; }
:is(.mq-popup--dark, html[data-theme="dark"] .mq-popup--auto):has(.mq-booking-card) {
  background: linear-gradient(180deg, rgba(255, 255, 255, .06), transparent 50%), var(--mqa-deep, #141414);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 30px 70px -20px rgba(0, 0, 0, .8), 0 12px 34px -14px color-mix(in srgb, var(--mqa-accent, #ff612e) 55%, transparent);
}
:is(.mq-popup--dark, html[data-theme="dark"] .mq-popup--auto) .mq-booking-card { color: #f5f6fa; }
:is(.mq-popup--dark, html[data-theme="dark"] .mq-popup--auto) .mq-booking-card .mq-booking-card__head :is(h2, h3, h4) { color: #fff; }
:is(.mq-popup--dark, html[data-theme="dark"] .mq-popup--auto) .mq-booking-card .mq-booking-card__text p { color: rgba(255, 255, 255, .7); }
:is(.mq-popup--dark, html[data-theme="dark"] .mq-popup--auto) .mq-popup__close { color: rgba(255, 255, 255, .7); background: rgba(255, 255, 255, .08); }
/* A corner card opened without a backdrop stays put while the page scrolls. */
.mq-popup--corner[open]:not(:modal) { position: fixed; inset: auto 1rem 1rem auto; margin: 0; z-index: 2147483001; }
/* While the AI chat is open it shows its own booking link: the card steps aside until it closes. */
.mq-popup--corner[open]:not(:modal) { transition: opacity .3s, transform .3s; }
body:has(.mq-assistant.is-open) .mq-popup--corner[open]:not(:modal) { opacity: 0; transform: translateY(12px); pointer-events: none; }
/* Above the AI chat bar when the site has one. */
body:has(#mq-assistant:not([hidden])) .mq-popup--corner[open]:not(:modal) { bottom: 104px; }
