/* Shared mobile adaptation loaded after every page stylesheet. */
html,
body {
    max-width: 100%;
    overflow-x: clip;
}

img,
svg,
video,
iframe,
input,
select,
textarea {
    min-width: 0;
}

a,
p,
li,
dd,
span {
    overflow-wrap: break-word;
}

@media (max-width: 900px) {
    .site-header,
    .nav {
        width: 100%;
    }

    .nav-inner {
        position: relative;
    }

    .site-header__brand {
        min-width: 0;
        max-width: calc(100% - 52px);
    }

    .site-header__brand .rt-brand__text {
        min-width: 0;
    }

    .site-header__brand .rt-brand__name,
    .site-header__brand .rt-brand__tagline {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .nav-toggle {
        flex: 0 0 42px;
        width: 42px;
        height: 42px;
    }

    .nav-menu {
        max-width: 100vw;
        max-height: min(70vh, 31rem);
        overflow-y: auto;
        overscroll-behavior: contain;
        box-shadow: 0 22px 40px rgba(0, 0, 0, 0.72);
    }

    .nav-menu__link {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    .page-header__title,
    .page-header__lede,
    .home-hero__title,
    .home-hero__lede {
        max-width: none;
    }

    .experience-index__shell,
    .portfolio-intro,
    .portfolio-cta .card,
    .production-grid,
    .process-intro__grid,
    .services-hero__grid,
    .services-flow__grid,
    .team-header-grid,
    .team-join-inner,
    .venues-layout,
    .contact-layout,
    .consultation-grid,
    .privacy-layout,
    .cookie-page-grid,
    .terms-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .privacy-aside,
    .cookie-page-aside,
    .terms-aside,
    .experience-index__intro {
        position: static;
        top: auto;
    }

    .portfolio-intro__meta,
    .portfolio-cta__meta,
    .services-grid__meta,
    .services-cta__actions,
    .packages-header-cta {
        width: 100%;
        max-width: none;
        min-width: 0;
    }
}

@media (max-width: 640px) {
    :root {
        --mobile-gutter: 1rem;
        --mobile-section-space: 3.75rem;
    }

    body {
        font-size: 0.96rem;
        line-height: 1.65;
    }

    .container {
        width: 100%;
        padding-inline: var(--mobile-gutter);
    }

    h1,
    .page-header__title,
    .home-hero__title {
        font-size: clamp(2.05rem, 10.5vw, 2.65rem);
        line-height: 1.08;
        letter-spacing: 0.018em;
    }

    h2,
    .experience-index__intro h2 {
        font-size: clamp(1.7rem, 8.2vw, 2.15rem);
        line-height: 1.14;
        max-width: none;
    }

    h3 {
        font-size: clamp(1.28rem, 6vw, 1.55rem);
    }

    .page-header {
        padding-block: 2.75rem 2.25rem;
    }

    .page-header__kicker,
    .home-hero__kicker {
        font-size: 0.68rem;
        line-height: 1.55;
        letter-spacing: 0.18em;
    }

    .page-header__lede,
    .home-hero__lede {
        font-size: 0.96rem;
        line-height: 1.72;
    }

    .page-section,
    .home-hero,
    .experience-index {
        padding-block: var(--mobile-section-space);
    }

    .section-index {
        display: flex;
        align-items: flex-start;
        max-width: 100%;
        font-size: 0.66rem;
        line-height: 1.5;
        letter-spacing: 0.16em;
        white-space: normal;
    }

    .section-index::before {
        flex: 0 0 24px;
        width: 24px;
        margin-top: 0.48rem;
    }

    .nav-inner {
        min-height: 58px;
        gap: 0.55rem;
        padding-block: 0.6rem;
    }

    .site-header__brand {
        gap: 0.6rem;
        max-width: calc(100% - 48px);
    }

    .site-header__brand .rt-brand__monogram {
        flex: 0 0 36px;
        width: 36px;
        height: 36px;
        border-radius: 10px;
        font-size: 1rem;
    }

    .site-header__brand .rt-brand__name {
        font-size: 0.72rem;
        letter-spacing: 0.13em;
    }

    .site-header__brand .rt-brand__tagline {
        font-size: 0.58rem;
        letter-spacing: 0.1em;
    }

    .nav-toggle {
        flex-basis: 40px;
        width: 40px;
        height: 40px;
    }

    .nav-menu {
        padding-inline: var(--mobile-gutter);
    }

    .card,
    .home-endtoend-panel,
    .packages-cta-panel,
    .privacy-block,
    .cookie-column-block {
        padding: 1rem;
        border-radius: 14px;
    }

    .grid,
    .grid-2,
    .grid-3,
    .packages-grid,
    .portfolio-grid,
    .portfolio-grid--tri,
    .production-columns,
    .team-grid,
    .cookie-columns,
    .consultation-details-grid,
    .form-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
    }

    .flex-row,
    .home-section-split,
    .home-section-split--reverse {
        flex-direction: column;
    }

    .btn {
        width: 100%;
        min-height: 46px;
        padding: 0.75rem 1rem;
        font-size: 0.78rem;
        line-height: 1.35;
        letter-spacing: 0.12em;
        text-align: center;
        white-space: normal;
    }

    .btn-link {
        max-width: 100%;
        font-size: 0.75rem;
        line-height: 1.55;
        letter-spacing: 0.13em;
        white-space: normal;
    }

    .home-hero__actions,
    .home-section-ctas,
    .home-results-actions,
    .home-services-footer,
    .services-header-cta,
    .services-hero__actions,
    .services-flow__actions,
    .services-cta__actions,
    .packages-cta-actions,
    .packages-meta-row,
    .portfolio-intro__actions,
    .portfolio-card__footer,
    .portfolio-cta__actions,
    .process-intro__actions,
    .process-cta__actions,
    .team-join-actions,
    .consultation-aux-cta,
    .consultation-actions,
    .contact-form__actions,
    .contact-cta__links,
    .page-header__actions,
    .venues-layout__cta-row,
    .venues-signature__actions,
    .venues-sitevisits__actions,
    .venues-final-cta__actions {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .services-cta__layout,
    .services-cta__meta,
    .packages-header-row,
    .packages-cta-panel,
    .contact-cta {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }

    .home-hero__actions .btn-link,
    .home-section-ctas .btn-link,
    .home-results-actions .btn-link,
    .services-header-cta .btn-link,
    .services-hero__actions .btn-link,
    .services-flow__actions .btn-link,
    .services-cta__actions .btn-link,
    .packages-cta-actions .btn-link,
    .portfolio-intro__actions .btn-link,
    .portfolio-card__footer .btn-link,
    .portfolio-cta__actions .btn-link,
    .process-intro__actions .btn-link,
    .process-cta__actions .btn-link,
    .team-join-actions .btn-link,
    .consultation-actions .btn-link,
    .contact-form__actions .btn-link,
    .contact-cta__links .btn-link,
    .page-header__actions .btn-link,
    .venues-layout__cta-row .btn-link,
    .venues-signature__actions .btn-link,
    .venues-sitevisits__actions .btn-link,
    .venues-final-cta__actions .btn-link {
        width: fit-content;
    }

    .home-facts {
        margin-top: 1.75rem;
        gap: 0.8rem;
    }

    .home-facts__list {
        width: 100%;
        align-items: flex-start;
        gap: 0.65rem;
    }

    .home-facts__item {
        width: 100%;
        align-items: flex-start;
        white-space: normal;
    }

    .badge,
    .pill-list__item,
    .home-endtoend-pills li {
        max-width: 100%;
        line-height: 1.45;
        letter-spacing: 0.12em;
        white-space: normal;
    }

    .home-hero__grid,
    .process-intro__grid,
    .team-header-grid,
    .team-join-inner,
    .production-grid,
    .portfolio-intro,
    .contact-layout,
    .consultation-grid,
    .privacy-layout,
    .cookie-page-grid,
    .terms-layout,
    .experience-index__shell {
        gap: 2rem;
    }

    .home-hero__seal {
        display: none;
    }

    .home-hero__image-frame,
    .home-section-image-figure,
    .process-intro__image-frame,
    .process-step__image-frame,
    .team-hero-image-frame,
    .team-inline-image-frame,
    .venues-figure__image-frame,
    .portfolio-card,
    .packages-card {
        border-radius: 14px;
    }

    .home-hero__image,
    .home-section-image,
    .process-intro__image,
    .process-step__image,
    .team-hero-image,
    .team-inline-image,
    .venues-figure img,
    .services-card__image,
    .portfolio-card__image,
    .packages-card__image {
        width: 100%;
        height: auto;
        aspect-ratio: 4 / 3;
        object-fit: cover;
    }

    .services-card__image,
    .portfolio-card__image,
    .packages-card__image {
        max-height: none;
    }

    .packages-card__body,
    .portfolio-card__body {
        padding: 1rem;
    }

    .packages-card__label,
    .portfolio-card__badge {
        left: 0.75rem;
        right: 0.75rem;
        bottom: 0.75rem;
        width: fit-content;
        max-width: calc(100% - 1.5rem);
        padding: 0.3rem 0.65rem;
        font-size: 0.64rem;
        line-height: 1.4;
        letter-spacing: 0.12em;
        white-space: normal;
    }

    .process-step,
    .process-step.process-step--media {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
        padding: 1rem;
    }

    .process-step--media .process-step__media {
        grid-column: auto;
    }

    .process-step__index {
        width: 36px;
        height: 36px;
    }

    .experience-index::after {
        background-size: 40px 40px;
    }

    .experience-index__list,
    .experience-index--atelier .experience-index__list,
    .experience-index--gallery .experience-index__list {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.85rem;
    }

    .experience-index__item,
    .experience-index--atelier .experience-index__item:first-child,
    .experience-index--atelier .experience-index__item:not(:first-child),
    .experience-index--gallery .experience-index__item {
        min-height: 0;
        padding: 1rem;
    }

    .experience-index--atelier .experience-index__item:first-child {
        grid-column: auto;
    }

    .experience-index--atelier .experience-index__item:not(:first-child) .experience-index__link {
        position: static;
    }

    .experience-index__item {
        grid-template-columns: auto minmax(0, 1fr) auto;
    }

    .experience-index__content h3 {
        font-size: 1.3rem;
    }

    .experience-index__content p {
        line-height: 1.62;
    }

    .privacy-content,
    .cookie-page-content,
    .terms-content {
        gap: 1rem;
    }

    .privacy-block,
    .cookie-section,
    .terms-content .card {
        min-width: 0;
    }

    .privacy-list li,
    .cookie-list li,
    .consultation-next-steps li {
        padding-left: 1rem;
    }

    .form-control,
    input,
    select,
    textarea {
        width: 100%;
        max-width: 100%;
        font-size: 16px;
    }

    textarea.form-control {
        min-height: 120px;
    }

    .footer {
        padding-block: 3rem 2rem;
    }

    .footer-top,
    .footer-links,
    .footer-bottom,
    .footer-bottom__meta,
    .footer-nav {
        width: 100%;
    }

    .footer-brand {
        max-width: 100%;
    }

    .footer .rt-brand {
        max-width: 100%;
        align-items: flex-start;
    }

    .footer .rt-brand__text {
        min-width: 0;
    }

    .footer .rt-brand__name {
        font-size: 0.78rem;
        letter-spacing: 0.14em;
    }

    .footer-bottom__contact,
    .footer-bottom__company,
    .footer-brand__copy,
    .contact-detail-list__item dd,
    a[href^="mailto:"] {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .footer-nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem 1rem;
    }

    .cookie-banner {
        max-height: min(88vh, 38rem);
        padding: 1rem;
        overflow-y: auto;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    }

    .cookie-banner__inner {
        gap: 0.8rem;
    }

    .cookie-banner__actions {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cookie-banner__button {
        min-width: 0;
    }
}

@media (max-width: 380px) {
    :root {
        --mobile-gutter: 0.875rem;
        --mobile-section-space: 3.25rem;
    }

    .site-header__brand .rt-brand__tagline {
        display: none;
    }

    .site-header__brand .rt-brand__name {
        font-size: 0.68rem;
        letter-spacing: 0.1em;
    }

    .experience-index__item {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .experience-index__link {
        grid-column: 2;
        justify-self: start;
    }

    .footer-nav,
    .cookie-banner__actions {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (hover: none) and (pointer: coarse) {
    .btn,
    .btn-link,
    .nav-menu__link,
    .experience-index__link,
    .footer-column a {
        -webkit-tap-highlight-color: transparent;
    }

    .experience-index__item:hover,
    .experience-index--ledger .experience-index__item:hover,
    .experience-index--gallery .experience-index__item:nth-child(2):hover {
        transform: none;
    }
}
