.implementor-booking-page {
    background: #09050d;
}

.mi-book {
    position: relative;
    min-height: 100svh;
    padding: 24px max(18px, calc((100% - 1180px) / 2)) 48px;
    isolation: isolate;
}

.mi-book::before {
    position: absolute;
    z-index: -1;
    inset: 0;
    content: "";
    background: linear-gradient(90deg, rgba(9, 5, 13, 0.96), rgba(9, 5, 13, 0.77)), url('/images/implementor/hero.webp') center top / cover no-repeat;
    pointer-events: none;
}

.mi-book [hidden] { display: none !important; }

.mi-book__intro { max-width: 940px; padding: 62px 0 36px; }
.mi-book__intro h1 { margin: 0; font-family: var(--display); font-size: 58px; line-height: 1.12; text-shadow: 0 5px 0 #7b082c; }
.mi-book__intro h1 > span { color: #ff4f9a; }
.mi-book__intro > p:last-of-type { color: #ded7e8; font-size: 22px; line-height: 1.5; }
.mi-book__facts { display: flex; flex-wrap: wrap; gap: 12px 24px; color: #ff9fc7; font-size: 15px; font-weight: 700; }
.mi-book__facts span { padding-left: 14px; border-left: 3px solid #c6ff3d; }

.mi-book__experience { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.9fr); gap: 48px; padding: 32px 0; border-block: 1px solid rgba(255, 145, 190, 0.3); }
.mi-book__section-title { display: flex; align-items: baseline; gap: 12px; }
.mi-book__section-title > span, .mi-book__times-heading > span { color: #ff74a8; font-weight: 900; font-size: 16px; }
.mi-book__section-title h2 { margin: 0; font-family: var(--display); font-size: 24px; line-height: 1.3; }
.mi-book__timezone { margin: 12px 0 22px; color: #bfb9ce; font-size: 14px; }
.mi-book__calendar { border: 1px solid #4b2945; border-radius: 8px; padding: 20px; background: rgba(12, 5, 16, 0.85); box-shadow: 0 0 32px rgba(255, 53, 166, 0.1); }
.mi-book__month-nav { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; align-items: center; gap: 12px; margin-bottom: 16px; }
.mi-book__month-nav h3 { text-align: center; margin: 0; font-size: 20px; }
.mi-book__icon-button { width: 44px; height: 44px; padding: 0; border: 1px solid #704263; border-radius: 6px; background: #1d1022; color: #f7f8ff; font-size: 24px; cursor: pointer; }
.mi-book__icon-button:disabled { opacity: 0.35; cursor: default; }
.mi-book__weekdays, .mi-book__dates { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.mi-book__weekdays { margin-bottom: 8px; text-align: center; color: #c9bacd; font-size: 13px; }
.mi-book__dates button, .mi-book__blank { display: grid; place-items: center; min-width: 0; height: 48px; }
.mi-book__dates button { position: relative; border: 1px solid #914563; border-radius: 6px; background: #381225; color: #ffe2ef; font-weight: 700; cursor: pointer; transition: background 160ms ease, border-color 160ms ease; }
.mi-book__dates button:not(:disabled)::after { content: ""; position: absolute; bottom: 5px; left: calc(50% - 2px); width: 4px; height: 4px; border-radius: 50%; background: #c6ff3d; }
.mi-book__dates button:disabled { border-color: transparent; background: transparent; color: #777084; cursor: default; }
.mi-book__dates button[aria-pressed="true"], .mi-book__dates button:not(:disabled):hover { border-color: #ff87b9; background: #ff74a8; color: #160613; }
.mi-book__dates button[aria-current="date"] { text-decoration: underline; text-underline-offset: 5px; }
.mi-book__times-heading { display: flex; gap: 12px; align-items: baseline; margin: 26px 0 16px; }
.mi-book__times-heading h3 { margin: 0; font-size: 18px; }
.mi-book__day { border: 0; margin: 18px 0 0; padding: 0; min-width: 0; }
.mi-book__day legend { color: #ffb4d2; font-weight: 700; padding: 0 0 12px; }
.mi-book--enhanced .mi-book__day legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.mi-book__times { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mi-book__time { position: relative; cursor: pointer; min-width: 0; }
.mi-book__time input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.mi-book__time > span { display: grid; min-height: 48px; padding: 10px 8px; place-items: center; border: 1px solid #704263; border-radius: 6px; background: #160e1d; color: #f7f8ff; font-size: 15px; font-weight: 700; text-align: center; }
.mi-book__time input:checked + span { background: #c6ff3d; border-color: #c6ff3d; color: #101506; }
.mi-book__time input:focus-visible + span { outline: 3px solid #ff87b9; outline-offset: 3px; }
.mi-book__time:hover > span { border-color: #ff87b9; }
.mi-book__selection { margin: 22px 0; border-left: 3px solid #ff74a8; padding: 4px 0 4px 16px; }
.mi-book__selection > span { display: block; font-size: 12px; text-transform: uppercase; color: #ffb4d2; margin-bottom: 7px; }
.mi-book__selection strong { display: block; font-size: 17px; font-weight: 700; line-height: 1.5; }
.mi-book__field { display: block; margin-top: 18px; font-size: 15px; font-weight: 700; }
.mi-book__field > span { color: #bfb9ce; font-weight: 400; }
.mi-book__field input, .mi-book__field textarea { display: block; width: 100%; margin-top: 8px; padding: 12px 14px; border: 1px solid #6e4a67; border-radius: 6px; background: rgba(12, 7, 18, 0.92); color: #f7f8ff; font: inherit; font-weight: 400; font-size: 16px; }
.mi-book__field textarea { resize: vertical; min-height: 100px; }
.mi-book__field [aria-invalid="true"] { border-color: #ff88a8; }
.mi-book__field-error { color: #ffb6cf; margin: 8px 0; font-size: 14px; }
.mi-book__small { color: #bfb9ce; font-size: 14px; line-height: 1.6; }
.mi-book__submit { width: 100%; gap: 12px; margin-top: 12px; font-size: 16px; }
.mi-book__submit:disabled { opacity: 0.5; cursor: default; transform: none; }
.mi-book__whisper { margin: 24px 0 0; color: #bfb9ce; font-size: 15px; }
.mi-book__whisper a, .mi-confirm__aftercare a, .mi-book__error-summary a { color: #ffb4d2; text-decoration: underline; text-underline-offset: 4px; }
.mi-book__notice, .mi-book__error-summary { padding: 18px 20px; margin: 0 0 24px; border-left: 4px solid #c6ff3d; background: #1a1420; color: #e9e2f0; font-size: 16px; }
.mi-book__error-summary { border-left-color: #ff74a8; }
.mi-book__error-summary h2 { margin: 0; font-size: 20px; }
.mi-book__error-summary p { margin: 12px 0 0; }
.mi-book__trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.mi-book__empty { margin-top: 24px; }
.mi-book__empty-mark { display: block; color: #ff74a8; font-size: 52px; line-height: 1; }
.mi-book__empty h3 { font-size: 22px; margin: 18px 0 12px; }
.mi-book__empty p, .mi-book__before { color: #ded7e8; font-size: 18px; }
.mi-book__signoff { margin: 30px 0 0; color: #ffb4d2; font-size: 14px; text-align: center; }
.mi-book button:focus-visible, .mi-book input:focus-visible, .mi-book textarea:focus-visible, .mi-book summary:focus-visible { outline: 3px solid #c6ff3d; outline-offset: 3px; }
.mi-confirm__receipt { position: relative; max-width: 740px; padding: 32px; border: 1px solid #a84771; border-top: 4px solid #ff74a8; border-radius: 8px; background: rgba(14, 6, 18, 0.92); box-shadow: 0 16px 70px rgba(255, 53, 166, 0.12); }
.mi-confirm__receipt h2 { max-width: 560px; margin: 0; font-family: var(--display); font-size: 28px; line-height: 1.3; }
.mi-confirm__heart { position: absolute; top: 20px; right: 24px; color: #ff74a8; font-size: 30px; }
.mi-confirm__time { color: #c6ff3d; font-size: 28px; font-weight: 700; }
.mi-confirm__time span { color: #e5d7ea; font-size: 17px; }
.mi-confirm__receipt .implementor-button { margin-top: 14px; }
.mi-confirm__aftercare { max-width: 740px; margin-top: 28px; color: #ded7e8; }
.mi-confirm__cancel { padding-top: 20px; margin-top: 24px; border-top: 1px solid #4b2945; }
.mi-confirm__cancel summary { cursor: pointer; color: #ffb4d2; }

@media (max-width: 980px) {
    .mi-book__experience { gap: 28px; }
    .mi-book__section-title h2 { font-size: 21px; }
    .mi-book__times { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
    .mi-book { padding-top: 18px; }
    .mi-book__intro { padding: 40px 0 26px; }
    .mi-book__intro h1 { font-size: 36px; }
    .mi-book__intro > p:last-of-type { font-size: 18px; }
    .mi-book__facts { gap: 10px 14px; font-size: 13px; }
    .mi-book__experience { grid-template-columns: 1fr; gap: 32px; padding-top: 26px; }
    .mi-book__calendar { padding: 14px; }
    .mi-book__dates button, .mi-book__blank { height: 42px; }
    .mi-book__month-nav h3 { font-size: 18px; }
    .mi-book__weekdays, .mi-book__dates { gap: 4px; }
    .mi-book__details { border-top: 1px solid #4b2945; padding-top: 28px; }
    .mi-book__signoff { font-size: 13px; }
    .mi-confirm__receipt { padding: 24px 20px; }
    .mi-confirm__receipt h2 { font-size: 23px; }
    .mi-confirm__heart { top: 12px; right: 14px; font-size: 22px; }
}

@media (max-width: 374px) {
    .mi-book__intro h1 { font-size: 30px; }
    .mi-book__calendar { padding: 10px; }
    .mi-book__dates button, .mi-book__blank { height: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .mi-book * { transition: none; }
}

@media (max-width: 760px) {
    .mi-book::before {
        background-image: linear-gradient(90deg, rgba(9, 5, 13, 0.96), rgba(9, 5, 13, 0.77)), url('/images/implementor/hero-mobile.webp');
    }
}
