/* =========================================================
   TWDesign Contact — full screen, video background, no footer
========================================================= */
.twct-page {
    --twct-gold: #a8603a;
    --twct-white: #fff;
    min-height: 100%;
    background: #090909;
    cursor: auto !important;
}

.twct-page,
.twct-page input,
.twct-page textarea,
.twct-page button {
    font-family: inherit;
}

.twct-page a,
.twct-page button {
    cursor: pointer !important;
}

.twct-page input,
.twct-page textarea {
    cursor: text !important;
}

.twct-page .twa-cursor {
    display: none !important;
}

.twct-page .twa-loader.is-hidden {
    opacity: 0;
    visibility: hidden;
    transform: translateY(-100%);
    transition: opacity .45s ease, transform .65s cubic-bezier(.76, 0, .24, 1), visibility .65s;
}

/* Header stays above the full-screen mobile menu. */
.twct-page .twa-header {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 120;
    background: transparent;
    border-bottom-color: transparent;
    box-shadow: none;
}

.twct-page .twa-header.is-scrolled {
    background: rgba(9, 9, 9, .82);
    backdrop-filter: blur(14px);
}

.twct-page.twa-nav-open,
.twct-page.twa-menu-open {
    overflow: hidden !important;
}

/* =========================================================
   Background
========================================================= */
.twct-contact {
    position: relative;
    min-height: 100svh;
    overflow: hidden;
    isolation: isolate;
    color: var(--twct-white);
}

.twct-contact__background,
.twct-contact__background video,
.twct-contact__shade {
    position: absolute;
    inset: 0;
}

.twct-contact__background {
    z-index: -2;
    background: #111;
}

.twct-contact__background video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    filter: none;
    transform: scale(1.02);
}

.twct-contact__shade {
    z-index: 1;
    background: rgba(0, 0, 0, .64);
}

/* =========================================================
   Layout
========================================================= */
.twa-container.twct-contact__layout {
    position: relative;
    z-index: 2;
    display: grid;
    grid-template-columns: minmax(0, .94fr) minmax(480px, .88fr);
    align-items: center;
    gap: clamp(3.5rem, 6vw, 7rem);
    width: min(calc(100% - 8vw), 1480px);
    min-height: 100svh;
    padding-top: clamp(8.5rem, 14vh, 11rem);
    padding-bottom: clamp(3rem, 6vh, 5.5rem);
}

/* =========================================================
   Left content
========================================================= */
.twct-content {
    width: 100%;
    max-width: 700px;
}

.twct-content>.twa-label,
.twct-form-heading .twa-label,
.twct-detail .twa-label {
    color: var(--twct-gold);
}

.twct-title {
    margin: 1rem 0 1.45rem;
    color: #fff;
    font-size: clamp(3.2rem, 4.65vw, 4.9rem);
    font-weight: 500;
    line-height: .9;
    letter-spacing: -.055em;
}

.twct-title span {
    display: inline-block;
    color: var(--twct-gold);
    font-weight: 500;
}

.twct-description {
    max-width: 620px;
    margin: 0;
    color: rgba(255, 255, 255, .82);
    font-size: clamp(.94rem, 1.05vw, 1.08rem);
    font-weight: 500;
    line-height: 1.55;
}

.twct-details {
    display: grid;
    grid-template-columns: .78fr 1fr;
    gap: clamp(2rem, 4vw, 4.5rem);
    max-width: 620px;
    margin-top: clamp(2rem, 4vh, 3.2rem);
}

.twct-detail {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .48rem;
}

.twct-detail .twa-label {
    margin-bottom: .15rem;
}

.twct-detail address,
.twct-detail a {
    position: relative;
    margin: 0;
    color: rgba(255, 255, 255, .9);
    font-size: .88rem;
    font-style: normal;
    font-weight: 500;
    line-height: 1.42;
}

.twct-detail a::after {
    position: absolute;
    right: 0;
    bottom: -3px;
    left: 0;
    height: 1px;
    content: "";
    background: var(--twct-gold);
    transform: scaleX(0);
    transform-origin: right;
    transition: transform .3s ease;
}

.twct-detail a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* NOTE: the border used to be hardcoded rgba(190, 156, 111, .72), a sandy
   beige left over from an earlier palette. Every other accent on this page
   — the eyebrow, the submit button, this icon's own colour and its hover
   fill — uses --twct-gold (#a8603a), so the border was the one element not
   matching the site's accent. It now uses the variable like the rest. */
.twct-instagram {
    display: inline-grid;
    width: 42px;
    height: 42px;
    margin-top: clamp(1.8rem, 3vh, 2.5rem);
    border: 1px solid var(--twct-gold);
    place-items: center;
    color: var(--twct-gold);
    transition: background .3s ease, color .3s ease, border-color .3s ease;
}

.twct-instagram svg {
    width: 19px;
}

.twct-instagram:hover {
    background: var(--twct-gold);
    color: #0a0a0a;
}

/* =========================================================
   Form
========================================================= */
.twct-form-panel {
    position: relative;
    width: 100%;
    padding: clamp(2rem, 3vw, 3rem);
    border: 0;
    background: linear-gradient(90deg, rgba(4, 6, 9, .08), rgba(4, 6, 9, .38));
    box-shadow: none;
    backdrop-filter: none;
}

.twct-form-heading .twa-label {
    margin-bottom: .7rem;
}

.twct-form-heading h2 {
    margin: 0;
    color: #fff;
    font-size: clamp(1.45rem, 1.8vw, 2rem);
    font-weight: 600;
    line-height: 1.18;
    letter-spacing: 0;
}

.twct-form-heading>p:last-child {
    margin: .35rem 0 0;
    color: rgba(255, 255, 255, .66);
    font-size: .88rem;
    line-height: 1.5;
}

.twct-form {
    margin-top: clamp(1.25rem, 2.2vh, 1.8rem);
}

.twct-field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.twct-field {
    display: block;
    min-width: 0;
    margin-bottom: .85rem;
}

.twct-field>span {
    display: block;
    margin-bottom: .42rem;
    color: rgba(255, 255, 255, .9);
    font-size: .73rem;
    font-weight: 500;
}

.twct-field small {
    color: rgba(255, 255, 255, .44);
    font-size: inherit;
}

.twct-field input,
.twct-field textarea {
    width: 100%;
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: 0;
    outline: 0;
    background: rgba(255, 255, 255, .055);
    color: #fff;
    font-size: .9rem;
    transition: border-color .28s ease, background .28s ease;
}

.twct-field input {
    height: 46px;
    padding: 0 .85rem;
}

.twct-field textarea {
    min-height: 104px;
    padding: .85rem;
    line-height: 1.5;
    resize: vertical;
}

.twct-field input:focus,
.twct-field textarea:focus {
    border-color: rgba(190, 156, 111, .8);
    background: rgba(190, 156, 111, .08);
}

.twct-field.is-invalid input,
.twct-field.is-invalid textarea {
    border-color: #cc786f;
}

.twct-form button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 52px;
    padding: 0 1.35rem;
    border: 1px solid var(--twct-gold);
    background: var(--twct-gold);
    color: #0b0b0a;
    font-size: .76rem;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    transition: background .3s ease, color .3s ease;
}

.twct-form button:hover {
    background: transparent;
    color: #fff;
}

.twct-form button:disabled {
    opacity: .65;
    cursor: wait !important;
}

.twct-form__status {
    min-height: 1.25rem;
    margin-top: .65rem;
    color: #dfc49e;
    font-size: .72rem;
    line-height: 1.4;
}

/* =========================================================
   Responsive
========================================================= */
@media (max-width: 1180px) {
    .twa-container.twct-contact__layout {
        grid-template-columns: minmax(0, .9fr) minmax(440px, 1fr);
        gap: 3.2rem;
        width: min(calc(100% - 6vw), 1120px);
    }

    .twct-title {
        font-size: clamp(3rem, 5.6vw, 4.35rem);
    }
}

@media (max-width: 900px) {
    .twct-contact {
        overflow: visible;
    }

    .twct-contact__background {
        position: fixed;
    }

    .twa-container.twct-contact__layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 3.5rem;
        width: min(calc(100% - 44px), 760px);
        min-height: auto;
        padding-top: 8.5rem;
        padding-bottom: 3.5rem;
    }

    .twct-content,
    .twct-form-panel {
        width: 100%;
        max-width: 700px;
    }

    .twct-title {
        font-size: clamp(3rem, 9vw, 4.5rem);
    }

    .twct-form-panel {
        justify-self: stretch;
    }

    .twct-page .twa-mobile-panel {
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
    }
}

@media (max-width: 600px) {
    .twa-container.twct-contact__layout {
        gap: 2.8rem;
        width: calc(100% - 36px);
        padding-top: 7.4rem;
        padding-bottom: 2rem;
    }

    .twct-title {
        margin-top: .85rem;
        font-size: clamp(2.55rem, 12.5vw, 3.6rem);
        line-height: .94;
        letter-spacing: -.045em;
    }

    .twct-description {
        font-size: .92rem;
    }

    .twct-details,
    .twct-field-row {
        grid-template-columns: 1fr;
    }

    .twct-details {
        gap: 1.5rem;
    }

    .twct-field-row {
        gap: 0;
    }

    .twct-form-panel {
        padding: 1.35rem;
    }
}

@media (max-width: 390px) {
    .twa-container.twct-contact__layout {
        width: calc(100% - 28px);
    }

    .twct-title {
        font-size: clamp(2.35rem, 12vw, 3rem);
    }
}

@media (max-width: 900px) and (max-height: 700px) {
    .twct-page .twa-mobile-panel {
        padding-top: 86px;
        padding-bottom: 18px;
    }

    .twct-page .twa-mobile-panel__nav {
        flex: 0 0 auto;
        justify-content: flex-start;
    }

    .twct-page .twa-mobile-panel__nav a {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    .twct-page .twa-mobile-panel__nav a strong {
        font-size: clamp(24px, 7vw, 30px);
    }

    .twct-page .twa-mobile-panel__footer {
        margin-top: auto;
    }
}

@media (prefers-reduced-motion: reduce) {

    .twct-contact__background video,
    .twct-reveal {
        transform: none !important;
    }

    .twct-reveal {
        opacity: 1 !important;
    }
}