.sf-contact-page-body { background: #fff; color: #0a1119; }
.sf-contact-page { overflow: clip; background: #fff; }
.sf-contact-shell { width: min(1420px, calc(100% - 80px)); margin-inline: auto; }
.sf-contact-kicker { color: #74b9ff; font-size: .74rem; font-weight: 820; letter-spacing: .18em; text-transform: uppercase; }

.sf-contact-hero { background: #07111d; color: #fff; padding: clamp(100px, 10vw, 168px) 0 clamp(86px, 8vw, 132px); }
.sf-contact-hero-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(340px, .65fr); gap: clamp(70px, 10vw, 170px); align-items: end; }
.sf-contact-hero h1 { max-width: 1000px; margin: 18px 0 0; font-size: clamp(4.2rem, 8vw, 8.6rem); line-height: .86; letter-spacing: -.073em; font-weight: 620; text-wrap: balance; }
.sf-contact-hero-side { padding-bottom: 8px; }
.sf-contact-hero-side p { max-width: 620px; margin: 0; color: #aab6c3; font-size: clamp(1.08rem, 1.45vw, 1.32rem); line-height: 1.72; }
.sf-contact-arrow-link { display: inline-flex; align-items: center; gap: 10px; margin-top: 32px; color: #fff; font-weight: 760; text-decoration: none; }
.sf-contact-arrow-link:hover { color: #b7dcff; }

.sf-contact-main { padding: clamp(86px, 9vw, 150px) 0; }
.sf-contact-main-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(360px, .72fr); gap: clamp(54px, 8vw, 130px); align-items: start; }
.sf-contact-form-card { padding-right: clamp(0px, 3vw, 36px); }
.sf-contact-card-head { display: grid; grid-template-columns: 54px 1fr; gap: 24px; padding-bottom: 44px; border-bottom: 1px solid rgba(10,17,25,.14); }
.sf-contact-card-head > span, .sf-contact-detail-no { color: #0f6fd8; font-size: .73rem; font-weight: 820; letter-spacing: .12em; }
.sf-contact-card-head h2, .sf-contact-detail-block h2 { margin: 0 0 13px; font-size: clamp(2.25rem, 4vw, 4.3rem); line-height: .93; letter-spacing: -.055em; font-weight: 630; }
.sf-contact-card-head p, .sf-contact-detail-block > p { max-width: 680px; margin: 0; color: #65717f; line-height: 1.7; font-size: 1.02rem; }

.sf-contact-form-card form { margin-top: 42px; }
.sf-contact-form-card .mb-3 { margin-bottom: 24px !important; }
.sf-contact-form-card .form-label { display: block; margin-bottom: 9px; color: #1c2733; font-size: .78rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.sf-contact-form-card .form-control { width: 100%; min-height: 58px; padding: 16px 0; border: 0; border-bottom: 1px solid #b8c0c8; border-radius: 0; background: transparent; color: #0a1119; font-size: 1.1rem; box-shadow: none; }
.sf-contact-form-card textarea.form-control { min-height: 170px; resize: vertical; }
.sf-contact-form-card .form-control:focus { border-bottom-color: #0f6fd8; box-shadow: none; outline: none; }
.sf-contact-form-card .btn-primary { min-height: 54px; margin-top: 10px; padding: 0 24px; border: 0; border-radius: 999px; background: #0a1119; color: #fff; font-weight: 760; }
.sf-contact-form-card .btn-primary:hover { background: #0f6fd8; }

.sf-contact-details { display: grid; gap: 22px; }
.sf-contact-detail-block { padding: clamp(32px, 4vw, 54px); background: #f0f2f4; }
.sf-contact-detail-block h2 { margin-top: 28px; font-size: clamp(2rem, 3.3vw, 3.5rem); }
.sf-contact-lines { margin-top: 40px; border-top: 1px solid rgba(10,17,25,.13); }
.sf-contact-lines > a, .sf-contact-lines > div { display: grid; grid-template-columns: 100px 1fr; gap: 20px; padding: 19px 0; border-bottom: 1px solid rgba(10,17,25,.13); color: #0a1119; text-decoration: none; }
.sf-contact-lines span { color: #75808c; font-size: .78rem; font-weight: 720; }
.sf-contact-lines strong { font-weight: 650; line-height: 1.55; }
.sf-contact-lines a:hover strong { color: #0f6fd8; }

.sf-contact-detail-dark { background: #07111d; color: #fff; }
.sf-contact-detail-dark .sf-contact-detail-no { color: #7fc1ff; }
.sf-contact-detail-dark > p { color: #a3afbc; }
.sf-contact-next-steps { margin-top: 38px; border-top: 1px solid rgba(255,255,255,.16); }
.sf-contact-next-steps div { display: grid; grid-template-columns: 48px 1fr; gap: 18px; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.16); }
.sf-contact-next-steps span { color: #7fc1ff; font-size: .73rem; font-weight: 800; }
.sf-contact-next-steps strong { font-size: .95rem; font-weight: 620; }

.sf-contact-signoff { padding: clamp(86px, 9vw, 146px) 0; background: #e9edf0; }
.sf-contact-signoff span { display: block; color: #0f6fd8; font-size: .74rem; font-weight: 820; letter-spacing: .18em; text-transform: uppercase; }
.sf-contact-signoff p { max-width: 1120px; margin: 20px 0 0; font-size: clamp(2.8rem, 5.6vw, 6.2rem); line-height: .91; letter-spacing: -.064em; font-weight: 620; text-wrap: balance; }

@media (max-width: 1000px) {
    .sf-contact-shell { width: min(100% - 48px, 1420px); }
    .sf-contact-hero-grid, .sf-contact-main-grid { grid-template-columns: 1fr; gap: 54px; }
    .sf-contact-hero-side { max-width: 760px; }
}

@media (max-width: 620px) {
    .sf-contact-shell { width: min(100% - 30px, 1420px); }
    .sf-contact-hero { padding-top: 76px; }
    .sf-contact-hero h1 { font-size: clamp(3.4rem, 16vw, 5.6rem); }
    .sf-contact-card-head { grid-template-columns: 38px 1fr; gap: 12px; }
    .sf-contact-detail-block { padding: 28px 22px; }
    .sf-contact-lines > a, .sf-contact-lines > div { grid-template-columns: 1fr; gap: 5px; }
    .sf-contact-signoff p { font-size: clamp(2.5rem, 13vw, 4.2rem); }
}
