/* Geometry sets composition; Bootstrap root tokens own appearance. */
@layer custom {
    .connect-section {
        padding-block: calc(var(--bs-spacer-12) * 2);
        color: var(--bs-fg-body);
        background: var(--bs-bg-body);
        overflow-wrap: anywhere;
    }
    .connect-section
        :is(div, article, header, footer, figure, li, aside, th, td) {
        min-width: 0;
    }
    .connect-section :is(h2, h3, h4) {
        margin: 0;
        font-family: var(--bs-heading-font-family);
        font-weight: var(--bs-heading-font-weight);
        line-height: var(--bs-heading-line-height);
    }
    .connect-section__eyebrow {
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-sm);
        font-weight: var(--bs-font-weight-semibold);
        margin: 0 0 var(--bs-spacer-4);
    }
    .connect-section__title {
        max-width: 23ch;
        text-wrap: balance;
    }
    .connect-section__intro {
        color: var(--bs-fg-2);
        font-size: var(--bs-font-size-lg);
        margin: var(--bs-spacer-6) 0 0;
        max-width: 50ch;
        white-space: pre-line;
    }
    .connect-section
        :is(a, input, button, select, textarea, [tabindex]):focus-visible {
        outline: var(--bs-focus-ring-width) solid var(--bs-primary-fg);
        outline-offset: var(--bs-spacer-1);
    }
    .connect-section .btn {
        min-height: 44px;
        white-space: normal;
        gap: var(--bs-spacer-3);
    }
    .connect-section__link {
        display: inline-flex;
        gap: var(--bs-spacer-3);
        align-items: center;
        min-height: 44px;
        color: var(--bs-fg-body);
        font-weight: var(--bs-font-weight-semibold);
        text-underline-offset: var(--bs-spacer-1);
    }
    .connect-section__link i {
        flex-shrink: 0;
    }

    .connect-section__opening {
        margin-bottom: var(--bs-spacer-8);
    }
    .connect-section__desk,
    .connect-section__project,
    .connect-section__location,
    .connect-section__personal {
        display: grid;
        gap: var(--bs-spacer-10);
    }
    .connect-section__form {
        min-width: 0;
    }
    .connect-section__form-title {
        margin-bottom: var(--bs-spacer-7);
    }
    .connect-section__form :is(input, select, button[type='submit']) {
        min-height: 44px;
    }
    .connect-section__form button[type='submit'] {
        white-space: normal;
        max-width: 100%;
    }
    .connect-section__privacy {
        display: flex;
        align-items: center;
        gap: var(--bs-spacer-3);
        margin: var(--bs-spacer-5) 0 0;
        color: var(--bs-fg-2);
        font-size: var(--bs-font-size-sm);
    }
    .connect-section__privacy a {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        color: inherit;
        text-underline-offset: var(--bs-spacer-1);
    }
    .connect-section__notice {
        display: flex;
        gap: var(--bs-spacer-3);
        color: var(--bs-fg-2);
        padding: var(--bs-spacer-5);
        border-left: var(--bs-border-width) solid var(--bs-primary-border);
        background: var(--bs-primary-bg-subtle);
        margin: 0;
    }
    .connect-section__notice i {
        flex-shrink: 0;
    }
    .connect-section__details {
        list-style: none;
        padding: 0;
        margin: 0;
        display: grid;
        gap: var(--bs-spacer-6);
    }
    .connect-section__detail,
    .connect-section__hours {
        display: flex;
        align-items: start;
        gap: var(--bs-spacer-4);
    }
    .connect-section__icon {
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-xl);
        line-height: var(--bs-body-line-height);
        flex-shrink: 0;
    }
    .connect-section__label {
        margin: 0;
    }
    .connect-section__contact-link {
        display: inline-flex;
        align-items: center;
        min-height: 44px;
        color: var(--bs-fg-body);
        gap: var(--bs-spacer-3);
        text-underline-offset: var(--bs-spacer-1);
    }
    .connect-section__contact-link i {
        flex-shrink: 0;
    }
    .connect-section__value {
        margin: var(--bs-spacer-3) 0 0;
        color: var(--bs-fg-2);
        white-space: pre-line;
    }
    .connect-section__hours {
        margin-top: var(--bs-spacer-6);
    }
    .connect-section__next {
        display: flex;
        gap: var(--bs-spacer-4);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
        margin-top: var(--bs-spacer-8);
        padding-top: var(--bs-spacer-7);
    }
    .connect-section__next > i {
        font-size: var(--bs-font-size-xl);
        color: var(--bs-primary-fg);
    }
    .connect-section__next p,
    .connect-section__guidance p,
    .connect-section__visit > p {
        color: var(--bs-fg-2);
        margin: var(--bs-spacer-3) 0 0;
    }
    .connect-section--desk .connect-section__form {
        border-top: var(--bs-border-width) solid var(--bs-primary-border);
        padding-top: var(--bs-spacer-7);
    }
    .connect-section__simple {
        max-width: 52rem;
        margin-inline: auto;
    }
    .connect-section__simple > .connect-section__opening {
        text-align: center;
    }
    .connect-section__simple
        :is(.connect-section__title, .connect-section__intro) {
        margin-inline: auto;
    }
    .connect-section__simple .connect-section__form {
        padding: var(--bs-spacer-7);
        background: var(--bs-bg-2);
        border-radius: var(--bs-radius-5);
    }
    .connect-section__alternatives {
        margin-top: var(--bs-spacer-8);
        padding-top: var(--bs-spacer-6);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
    }
    .connect-section__guidance ol {
        list-style: none;
        padding: 0;
        margin: var(--bs-spacer-6) 0 0;
    }
    .connect-section__guidance li {
        display: flex;
        gap: var(--bs-spacer-4);
        border-top: var(--bs-border-width) solid var(--bs-border-color);
        padding-block: var(--bs-spacer-6);
    }
    .connect-section__guidance li > span {
        flex-shrink: 0;
        min-width: 2ch;
        white-space: nowrap;
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-sm);
    }
    .connect-section__project .connect-section__form {
        padding-top: var(--bs-spacer-7);
        border-top: var(--bs-border-width) solid var(--bs-primary-border);
    }
    .connect-section__visit {
        background: var(--bs-primary-bg-subtle);
        padding: var(--bs-spacer-7);
        border-radius: var(--bs-radius-5);
    }
    .connect-section__visit-icon {
        display: block;
        color: var(--bs-primary-fg);
        font-size: var(--bs-font-size-3xl);
        margin-bottom: var(--bs-spacer-6);
    }
    .connect-section__visit .connect-section__details {
        margin-top: var(--bs-spacer-8);
    }
    .connect-section__directions {
        display: inline-flex;
        gap: var(--bs-spacer-3);
        min-height: 44px;
        align-items: center;
        margin-top: var(--bs-spacer-5);
        color: var(--bs-primary-fg);
        text-underline-offset: var(--bs-spacer-1);
    }
    .connect-section__directory {
        display: grid;
        gap: var(--bs-spacer-6);
        align-items: end;
    }
    .connect-section__directory .btn {
        width: fit-content;
    }
    .connect-section__directory-details {
        border-top: var(--bs-border-width) solid var(--bs-border-color);
        padding-top: var(--bs-spacer-8);
        margin-top: var(--bs-spacer-8);
    }
    .connect-section__directory .connect-section__opening {
        margin: 0;
    }
    .connect-section--personal {
        background: var(--bs-bg-2);
    }
    .connect-section__personal {
        align-items: center;
    }
    .connect-section__personal .btn {
        margin-top: var(--bs-spacer-7);
    }
    .connect-section__media {
        margin: 0;
        border-radius: var(--bs-radius-5);
        overflow: hidden;
        background: var(--bs-bg-body);
    }
    .connect-section__media img {
        display: block;
        width: 100%;
        height: auto;
        aspect-ratio: 4/5;
        object-fit: cover;
    }
    .connect-section__media figcaption {
        padding: var(--bs-spacer-4) var(--bs-spacer-5);
        color: var(--bs-fg-2);
        font-size: var(--bs-font-size-sm);
    }
    @media (min-width: 768px) {
        .connect-section__alternatives .connect-section__details,
        .connect-section__directory-details .connect-section__details {
            grid-template-columns: repeat(
                auto-fit,
                minmax(min(100%, 16rem), 1fr)
            );
        }
        .connect-section__directory {
            grid-template-columns: minmax(0, 1fr) auto;
        }
    }
    @media (min-width: 1024px) {
        .connect-section__desk {
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: var(--bs-spacer-12);
        }
        .connect-section__project {
            grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr);
            gap: var(--bs-spacer-12);
        }
        .connect-section__location {
            grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr);
            gap: var(--bs-spacer-12);
            align-items: start;
        }
        .connect-section__personal:not(.connect-section__personal--text) {
            grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
            gap: var(--bs-spacer-12);
        }
    }
}
