.contact-hero { min-height: 610px; }
.contact-hero .interior-hero-media { background-image: url('../images/stage-freight.webp'); background-position: center 46%; }
.contact-hero .interior-hero-inner { padding-block: 180px 80px; }
.contact-hero h1 > span { display: block; color: var(--color-mint); }
.contact-section { background: var(--color-bg-light); }
.contact-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); align-items: start; gap: clamp(40px, 7vw, 100px); }
.contact-details { min-width: 0; }
.contact-details h2 { max-width: 540px; font-size: clamp(3rem, 4.5vw, 5rem); text-transform: uppercase; }
.contact-details > p { max-width: 460px; margin-block: 24px 0; color: #62677f; }
.contact-list { margin-block: 34px 0; counter-reset: contact-detail; }
.contact-detail { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 7px 18px; border-block-start: 1px solid #dfe2eb; padding-block: 22px; counter-increment: contact-detail; }
.contact-detail::before { grid-row: 1 / span 2; color: var(--color-brass); font-family: var(--font-heading); font-size: .8rem; content: counter(contact-detail, decimal-leading-zero); }
.contact-detail dt { grid-column: 2; color: #747990; font-size: .67rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; }
.contact-detail dd { grid-column: 2; margin: 0; color: var(--color-midnight); font-size: .95rem; line-height: 1.65; overflow-wrap: anywhere; }
.contact-detail dd a { display: table; min-height: 30px; }
.contact-detail dd a:hover { color: var(--color-deep-blue); text-decoration: underline; text-underline-offset: 4px; }
.contact-quote-note { margin-block-start: 22px; border-inline-start: 3px solid var(--color-mint); padding-inline-start: 22px; }
.contact-quote-note p { margin-block: 0 12px; color: #62677f; font-size: .88rem; }
.contact-form { min-width: 0; scroll-margin-top: 110px; color: white; background: var(--color-midnight); box-shadow: var(--shadow-md); }
.contact-form-heading { margin-block-end: 32px; border-block-end: 1px solid rgba(255, 255, 255, .15); padding-block-end: 24px; }
.contact-form-heading h2 { font-size: clamp(2.5rem, 3.6vw, 3.7rem); text-transform: uppercase; }
.contact-form-heading p { margin-block: 12px 0; color: #bac0d8; font-size: .83rem; }
.contact-form .form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.contact-form .field { min-width: 0; }
.contact-form .field label { color: #bac0d8; }
.contact-form .field input, .contact-form .field textarea { font-size: 1rem; }
.contact-form .field input::placeholder, .contact-form .field textarea::placeholder { color: #9a9fba; }
.contact-form .field .error { position: static; display: block; padding-block-start: 5px; font-size: .72rem; }
.contact-form .field .error:empty { display: none; }
.contact-form .submit-btn { width: 100%; justify-content: space-between; }
.contact-form .form-status { font-size: .88rem; }
.contact-form .form-status:empty { display: none; }
.contact-form .form-status.is-error { border-inline-start: 2px solid var(--color-brass); padding-inline-start: 14px; }
.contact-form .form-status.is-success { border-inline-start: 2px solid var(--color-mint); padding-inline-start: 14px; }
html[dir="rtl"] .contact-page .contact-detail dt { letter-spacing: 0; }

@media (max-width: 1000px) {
    .contact-layout { gap: 36px; }
    .contact-form .form-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 768px) {
    .contact-hero { min-height: 580px; }
    .contact-hero .interior-hero-inner { padding-block: 150px 64px; }
    .contact-layout { grid-template-columns: minmax(0, 1fr); gap: 44px; }
    .contact-details h2 { max-width: 100%; }
    .contact-form { padding: 30px 24px; }
}