@media (max-width: 767px) {
    #main :is(
        .shop-auth,
        .shop-cart,
        .shop-checkout,
        .shop-orders,
        .shop-order,
        .shop-complete,
        .shop-pay,
        .consent-page
    ) {
        padding-block: 1.5rem 2rem;
    }

    #main :is(
        .shop-auth__panel,
        .shop-checkout__main,
        .shop-checkout__summary,
        .shop-cart__summary,
        .shop-pay__form,
        .booking-filter,
        .booking-treatments__card
    ) {
        min-width: 0;
        max-width: 100%;
        padding: 1rem;
        border-radius: 1rem;
        box-shadow: 0 4px 18px rgba(21, 40, 72, 0.045);
    }

    #main :is(.shop-auth__panel, .shop-pay__form, .shop-checkout__layout) {
        margin-top: 1rem;
    }

    #main :is(.shop-auth, .shop-cart, .shop-checkout, .shop-orders, .shop-order, .shop-complete, .shop-pay) h1 {
        font-size: clamp(1.8rem, 6.5vw, 2.5rem);
        line-height: 1.15;
        overflow-wrap: anywhere;
    }

    #main :is(.shop-auth, .shop-cart, .shop-checkout, .shop-orders, .shop-order, .shop-complete, .shop-pay) .lede {
        margin-top: 0.65rem;
        font-size: 1rem;
        line-height: 1.55;
    }

    #main .contact-form__grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    #main :is(.contact-form__field, .shop-controls__field, .shop-checkout__option-body) {
        min-width: 0;
    }

    #main :is(.contact-form, .shop-controls, .gift-purchase__form) :is(
        input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
        select,
        textarea
    ) {
        min-width: 0;
        max-width: 100%;
        min-height: 2.875rem;
        font-size: 1rem;
    }

    #main :is(.contact-form, .shop-controls, .gift-purchase__form, .booking-filter) select:not([multiple]) {
        height: 2.875rem;
    }

    #main :is(.contact-form__actions, .booking-options__actions, .consent-form__actions) {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    #main :is(.contact-form__actions, .booking-options__actions, .consent-form__actions) .btn {
        flex: 0 1 auto;
        width: 100%;
        min-height: 2.875rem;
        justify-content: center;
        white-space: normal;
        text-align: center;
    }

    #main :is(.contact-form__hint, .contact-form__error, .shop-pay__note, .shop-pay__message) {
        overflow-wrap: anywhere;
    }

    #main .shop-auth--client .shop-auth__layout {
        grid-template-areas: "heading" "panel" "visual";
        gap: 1.25rem;
    }

    #main .shop-auth--client .shop-auth__panel {
        padding: 1rem;
        border: 1px solid var(--line);
        background: var(--white);
    }

    #main .shop-auth--client .shop-auth__visual {
        height: 10rem;
        min-height: 0;
        border-radius: 1rem;
    }

    #main .shop-auth__links {
        align-items: stretch;
    }

    #main .shop-auth__links a {
        display: inline-flex;
        align-items: center;
        min-height: 2.75rem;
    }

    #main .client-dashboard__intro {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }

    #main .client-dashboard__intro-actions {
        justify-content: stretch;
        gap: 0.65rem;
    }

    #main .client-dashboard__intro-actions .btn {
        flex: 1 1 100%;
        white-space: normal;
    }

    #main .client-dashboard__next {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        padding: 1rem;
        border: 1px solid var(--line);
        border-radius: 1rem;
    }

    #main .client-dashboard__next-meta {
        flex-direction: column;
        gap: 0.35rem;
    }

    #main .client-dashboard__next-actions {
        justify-items: stretch;
    }

    #main .client-dashboard__next-actions .btn {
        width: 100%;
        justify-content: center;
    }

    #main .client-dashboard__enquiry {
        margin-top: 0.75rem;
        padding: 1rem;
        border: 1px solid var(--line);
        border-radius: 1rem;
        background: var(--white);
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) {
        display: block;
        margin-top: 1rem;
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) > thead {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) > tbody {
        display: block;
        width: 100%;
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) > tbody > tr {
        display: block;
        min-width: 0;
        margin-bottom: 0.85rem;
        padding: 0.65rem 1rem;
        border: 1px solid var(--line);
        border-radius: 1rem;
        background: var(--white);
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) > tbody > tr > td {
        display: block;
        width: 100%;
        padding: 0.5rem 0;
        border: 0;
        overflow-wrap: anywhere;
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) > tbody > tr > td[data-label]::before {
        display: block;
        content: attr(data-label);
        margin-bottom: 0.15rem;
        color: var(--muted);
        font-size: 0.75rem;
        font-weight: 600;
    }

    #main :is(.shop-cart__table, .shop-orders__table):has(thead) > tbody > tr > td:not([data-label])::before {
        content: none;
    }

    #main .client-dashboard__row-actions {
        white-space: normal;
    }

    #main .client-dashboard__row-actions .btn {
        width: 100%;
        margin: 0.25rem 0;
        justify-content: center;
        white-space: normal;
    }

    #main .shop-cart__row-form {
        gap: 0.65rem;
    }

    #main .shop-cart__row-form input[type="number"] {
        width: 5rem;
        min-height: 2.875rem;
        font-size: 1rem;
    }

    #main .shop-cart__line-total {
        flex: 1 1 auto;
        text-align: right;
    }

    #main .shop-cart__row-form .btn,
    #main button.shop-cart__remove {
        flex: 1 1 calc(50% - 0.65rem);
        min-height: 2.875rem;
        padding: 0.65rem;
    }

    #main :is(.shop-order__table, .shop-complete__table) {
        display: block;
    }

    #main :is(.shop-order__table, .shop-complete__table) tbody {
        display: block;
    }

    #main :is(.shop-order__table, .shop-complete__table) tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 1rem;
        margin: 0;
        padding: 0.85rem 0;
        border: 0;
        border-bottom: 1px solid var(--line);
        border-radius: 0;
        background: transparent;
    }

    #main :is(.shop-order__table, .shop-complete__table) td {
        display: block;
        min-width: 0;
        padding: 0;
        border: 0;
        overflow-wrap: anywhere;
    }

    #main :is(.shop-order__table, .shop-complete__table) td::before {
        content: none;
    }

    #main :is(.shop-checkout__layout, .gift-purchase__layout, .booking-treatments) {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    #main .shop-checkout__option {
        padding: 0.85rem;
        border-radius: 0.75rem;
    }

    #main .shop-checkout__lines li {
        gap: 0.65rem;
        overflow-wrap: anywhere;
    }

    #main .shop-checkout__lines li > :last-child {
        flex-shrink: 0;
    }

    #main .shop-checkout__summary {
        position: static;
    }

    #main :is(.shop-cart__summary, .shop-pay__form) {
        width: 100%;
    }

    #main :is(.shop-cart__empty, .shop-empty) {
        padding: 1.5rem 1rem;
        border-radius: 1rem;
        overflow-wrap: anywhere;
    }

    #main :is(.shop-cart__empty, .booking-treatments__card, .gift-purchase__form) > .btn {
        width: 100%;
        justify-content: center;
        white-space: normal;
    }

    #main .shop-controls {
        gap: 0.85rem;
        padding: 1rem;
        border: 1px solid var(--line);
        border-radius: 1rem;
        background: var(--white);
    }

    #main .shop-controls__field {
        flex: 1 1 100%;
        min-width: 0;
    }

    #main .shop-controls__submit {
        flex: 1 1 100%;
        justify-content: center;
    }

    #main .shop-filter {
        gap: 0.5rem;
        margin-bottom: 1rem;
    }

    #main .shop-filter__chip {
        max-width: 100%;
        min-height: 2.75rem;
        padding-inline: 0.85rem;
        white-space: normal;
    }

    #main .shop-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    #main .shop-card {
        min-height: 0;
        border-radius: 1rem;
    }

    #main .shop-card__body {
        min-height: 0;
        padding: 1rem;
    }

    #main .shop-card__name {
        min-height: 0;
    }

    #main .shop-card__foot {
        flex-wrap: wrap;
        gap: 0.75rem;
    }

    #main .shop-card__cta {
        min-height: 2.875rem;
        white-space: normal;
    }

    #main .booking-filter__grid {
        grid-template-columns: minmax(0, 1fr);
    }

    #main .booking-filter__actions {
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 0;
    }

    #main .booking-filter__actions .btn {
        flex: 1 1 7rem;
    }

    #main .booking-category-accordion {
        padding: 0;
    }

    #main .booking-category-card {
        border-radius: 1rem;
    }

    #main .booking-category-card__toggle {
        grid-template-columns: 3.75rem minmax(0, 1fr) 2rem;
        gap: 0.65rem;
        padding: 0.75rem;
    }

    #main .booking-category-card__image {
        width: 3.75rem;
    }

    #main .booking-category-card__meta {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    #main .booking-category-card__chevron {
        grid-column: 3;
        grid-row: 1;
        width: 2rem;
        height: 2rem;
    }

    #main .booking-service-row {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.65rem;
        padding: 0.85rem;
        border-radius: 0.75rem;
    }

    #main .booking-service-row__price {
        justify-items: start;
        text-align: left;
    }

    #main .booking-service-row__action .btn {
        width: 100%;
        min-height: 2.875rem;
        justify-content: center;
        white-space: normal;
    }

    #main .booking-calendar__nav {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    #main .booking-calendar__nav strong {
        min-width: 0;
        flex: 1 1 6rem;
        font-size: 0.95rem;
        text-align: center;
    }

    #main .booking-calendar__nav .btn {
        min-height: 2.75rem;
        padding-inline: 0.6rem;
        font-size: 0.8rem;
    }

    #main .booking-calendar__grid {
        grid-template-columns: repeat(7, minmax(0, 1fr));
        gap: 0.2rem;
    }

    #main .booking-calendar__day {
        min-width: 0;
        min-height: 2.75rem;
        padding-inline: 0;
        font-size: 0.875rem;
    }

    #main .booking-slots form {
        flex: 1 1 7rem;
        min-width: 0;
    }

    #main .booking-slots form .booking-slots__slot {
        width: 100%;
        min-height: 2.875rem;
    }

    #main .booking-slots > a.booking-slots__slot {
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1 1 7rem;
        min-width: 0;
        min-height: 2.875rem;
    }

    #main :is(.booking-review__table, .shop-auth__panel .shop-orders__table:not(:has(thead))) {
        display: block;
        width: 100%;
        margin-top: 0;
    }

    #main :is(.booking-review__table, .shop-auth__panel .shop-orders__table:not(:has(thead))) :is(tbody, tr, th, td) {
        display: block;
        width: 100%;
        min-width: 0;
        overflow-wrap: anywhere;
    }

    #main :is(.booking-review__table, .shop-auth__panel .shop-orders__table:not(:has(thead))) tr {
        margin: 0;
        padding: 0.75rem 0;
        border: 0;
        border-bottom: 1px solid var(--line);
        border-radius: 0;
    }

    #main :is(.booking-review__table, .shop-auth__panel .shop-orders__table:not(:has(thead))) :is(th, td) {
        padding: 0;
        border: 0;
    }

    #main :is(.booking-review__table, .shop-auth__panel .shop-orders__table:not(:has(thead))) th {
        margin-bottom: 0.35rem;
        font-size: 0.75rem;
    }

    #main :is(.booking-review__table, .shop-auth__panel .shop-orders__table:not(:has(thead))) td::before {
        content: none;
    }

    #main .booking-review__policy {
        padding: 1rem;
        border-radius: 1rem;
        overflow-wrap: anywhere;
    }

    #main .booking-addons label.booking-addons__item {
        min-height: 2.875rem;
        padding: 0.75rem;
        align-items: flex-start;
    }

    #main :is(.consent-dashboard, .consent-list, .consent-document) {
        min-width: 0;
        border-radius: 1rem;
        overflow-wrap: anywhere;
    }

    #main .consent-dashboard li {
        flex-wrap: wrap;
        align-items: flex-start;
    }

    #main .consent-dashboard li .btn {
        width: 100%;
        min-height: 2.75rem;
        justify-content: center;
    }

    #main .consent-question__choices label {
        min-height: 2.75rem;
    }

    #main .note-photos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.65rem;
    }

    #main .note-photos__item img {
        height: auto;
        aspect-ratio: 1 / 1;
        border-radius: 0.75rem;
    }

    #main :is(.shop-pagination__list li a, .shop-pagination__list li.active span) {
        min-width: 2.75rem;
        min-height: 2.75rem;
    }

    #main :is(.category-hero, .shop-hero, .treatment-directory-hero, .faq-hero) {
        padding-block: 2rem;
    }

    #main :is(.category-hero__inner, .shop-hero__inner, .faq-hero__inner) {
        grid-template-columns: minmax(0, 1fr);
        gap: 1.25rem;
    }

    #main :is(.category-hero h1, .shop-hero h1, .treatment-directory-hero h1, .faq-hero h1) {
        font-size: clamp(2rem, 8.5vw, 3rem);
        line-height: 1.1;
        overflow-wrap: anywhere;
    }

    #main :is(.category-hero__lede, .shop-hero__lede) {
        font-size: 1rem;
        line-height: 1.6;
    }

    #main :is(
        .category-hero__actions,
        .treatment-directory-hero__actions,
        .treatment-directory__actions,
        .about-template-hero__actions,
        .team-hero__actions,
        .faq-hero__actions,
        .cta__actions
    ) {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    #main :is(
        .category-hero__actions,
        .treatment-directory-hero__actions,
        .treatment-directory__actions,
        .about-template-hero__actions,
        .team-hero__actions,
        .faq-hero__actions,
        .cta__actions
    ) .btn {
        width: 100%;
        min-height: 2.875rem;
        justify-content: center;
        white-space: normal;
        text-align: center;
    }

    #main :is(.treatment-page-grid, .treatment-article__detail-grid, .treatment-care-plan__grid) {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    #main :is(.treatment-service-row, .treatment-detail-card, .treatment-care-card, .faq-item, .shop-hero__notice) {
        border-radius: 1rem;
    }

    #main :is(.treatment-service-row__body, .treatment-article__body, .legal-page__content, .contact-copy) {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    #main :is(.treatment-cta__inner, .team-booking__inner) {
        align-items: stretch;
    }

    #main :is(.treatment-cta__inner, .team-booking__inner) > .btn {
        width: 100%;
        justify-content: center;
        white-space: normal;
    }

    #main .faq-item summary {
        min-height: 3.5rem;
        padding: 1rem;
    }
}