.spo-contact { background: #f5f8fc; color: #101a31; }
.spo-contact .spo-about__eyebrow { margin: 0 0 18px; color: #59baff; font-size: 11px; font-weight: 800; line-height: 1.4; letter-spacing: .18em; text-transform: uppercase; }
.spo-contact-hero { padding: clamp(160px, 15vw, 240px) 32px clamp(80px, 8vw, 130px); background: radial-gradient(circle at 80% 10%, rgb(39 108 201 / 42%), transparent 34%), #060d20; color: #fff; }
.spo-contact-hero__inner { width: min(100%, 1320px); margin-inline: auto; }
.spo-contact-hero h1 { max-width: 960px; margin: 0; color: #fff; font-family: "Space Grotesk", Arial, sans-serif; font-size: clamp(54px, 7vw, 104px); font-weight: 450; line-height: .94; letter-spacing: -.06em; }
.spo-contact-hero__inner > p:last-child { max-width: 680px; margin: 30px 0 0; color: #c5d2e6; font-size: 17px; line-height: 1.75; }
.spo-contact-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: clamp(52px, 8vw, 120px); width: min(calc(100% - 64px), 1320px); padding: clamp(80px, 8vw, 130px) 0; margin-inline: auto; }
.spo-contact-info h2 { margin: 0 0 26px; color: #07142d; font-family: "Space Grotesk", Arial, sans-serif; font-size: clamp(38px, 4.5vw, 62px); font-weight: 520; line-height: 1; letter-spacing: -.05em; }
.spo-contact-info > p:not(.spo-about__eyebrow) { margin: 0 0 26px; color: #566277; font-size: 15px; line-height: 1.8; }
.spo-contact-info > a { color: #096cb8; font-size: 15px; font-weight: 800; text-decoration: underline; text-underline-offset: 4px; }
.spo-contact-info__note { display: grid; gap: 7px; padding-top: 30px; margin-top: 36px; border-top: 1px solid #d8e0eb; }
.spo-contact-info__note strong { color: #07142d; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; }
.spo-contact-info__note span { color: #657188; font-size: 13px; }
.spo-contact-form-wrap { padding: clamp(30px, 4vw, 56px); border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgb(20 42 78 / 10%); }
.spo-contact-form p { margin: 0 0 24px; }
.spo-contact-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.spo-contact-form label { display: block; margin-bottom: 9px; color: #1b2943; font-size: 12px; font-weight: 800; letter-spacing: .035em; }
.spo-contact-form input:not([type="checkbox"]), .spo-contact-form select, .spo-contact-form textarea { width: 100%; min-height: 52px; padding: 12px 14px; border: 1px solid #cbd6e4; border-radius: 5px; background: #f9fbfe; color: #101a31; font: inherit; transition: border-color 180ms ease, box-shadow 180ms ease; }
.spo-contact-form textarea { min-height: 168px; resize: vertical; }
.spo-contact-form input:focus, .spo-contact-form select:focus, .spo-contact-form textarea:focus { border-color: #147ed1; outline: 0; box-shadow: 0 0 0 3px rgb(20 126 209 / 16%); }
.spo-contact-form__consent { display: flex; align-items: flex-start; gap: 12px; }
.spo-contact-form__consent input { flex: 0 0 auto; margin-top: 3px; }
.spo-contact-form__consent label { margin: 0; color: #4e5b70; font-size: 13px; font-weight: 550; line-height: 1.55; letter-spacing: 0; }
.spo-contact-form button { min-height: 54px; padding: 0 28px; border: 1px solid #0c68b1; border-radius: 5px; background: #0b6db9; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; cursor: pointer; }
.spo-contact-form button:hover, .spo-contact-form button:focus-visible { background: #074d86; }
.spo-contact-form__trap { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.spo-contact-alert { padding: 16px 18px; margin-bottom: 28px; border-radius: 5px; font-size: 14px; line-height: 1.55; }
.spo-contact-alert--success { border: 1px solid #8dcbb5; background: #effaf6; color: #15583f; }
.spo-contact-alert--error { border: 1px solid #e4a6a6; background: #fff3f3; color: #862e2e; }

@media (max-width: 860px) { .spo-contact-layout { grid-template-columns: 1fr; } }
@media (max-width: 640px) {
	.spo-contact-hero { padding: 136px 18px 74px; }
	.spo-contact-hero h1 { font-size: 50px; }
	.spo-contact-hero__inner > p:last-child { font-size: 14px; }
	.spo-contact-layout { width: calc(100% - 36px); padding: 70px 0; }
	.spo-contact-form-wrap { padding: 24px 18px; border-radius: 14px; }
	.spo-contact-form__row { grid-template-columns: 1fr; gap: 0; }
	.spo-contact-form button { width: 100%; }
}