* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
.contact-page { margin: 0; color: #173f69; background: #f2f2f2; }
.contact-hero { position: relative; overflow: hidden; min-height: 570px; color: #fff; background: #184e87; }
.contact-hero::before { content: ''; position: absolute; top: 155px; right: -130px; width: 480px; height: 480px; border: 1px solid rgba(176,198,217,.2); border-radius: 50%; box-shadow: 0 0 0 75px rgba(176,198,217,.035), 0 0 0 150px rgba(176,198,217,.025); }
.contact-hero::after { content: ''; position: absolute; bottom: 95px; left: 9%; width: 125px; height: 125px; border: 1px solid rgba(176,198,217,.22); border-radius: 42% 58% 62% 38% / 48% 40% 60% 52%; transform: rotate(18deg); }
.contact-hero-inner { position: relative; z-index: 2; width: calc(100% - (var(--site-gutter) * 2)); max-width: var(--site-width); margin: 0 auto; padding: 74px 0 128px; }
.contact-hero h1 { margin: 0 !important; max-width: 810px !important; font-size: clamp(3.2rem, 3vw, 4.5rem) !important; line-height: .98 !important; letter-spacing: -.055em !important; }
.contact-hero-copy { max-width: 620px; margin: 28px 0 0; color: rgba(255,255,255,.8); font-size: 1.15rem; line-height: 1.7; }
.contact-wave { position: absolute; right: 0; bottom: -1px; left: 0; width: 100%; height: 80px; fill: #f2f2f2; }
.contact-main { width: calc(100% - (var(--site-gutter) * 2)); max-width: var(--site-width); margin: 0 auto; padding: 70px 0 76px; }
.contact-layout { display: grid; grid-template-columns: .82fr 1.18fr; gap: 24px; align-items: stretch; }
.contact-details { display: flex; padding: 38px; flex-direction: column; color: #fff; border-radius: 26px; background: #184e87; }
.contact-details h2 { margin: 0; }
.contact-details > p { margin: 18px 0 30px; color: rgba(255,255,255,.72); line-height: 1.65; }
.contact-list { display: grid; gap: 12px; margin: 0; }
.contact-item { display: grid; grid-template-columns: 50px 1fr; align-items: center; gap: 15px; padding: 16px; border: 1px solid rgba(255,255,255,.12); border-radius: 16px; background: rgba(255,255,255,.06); }
.contact-icon { display: grid; width: 50px; height: 50px; place-items: center; color: #184e87; border-radius: 14px; background: #fff; }
.contact-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.contact-item span { display: block; margin-bottom: 3px; color: #B0C6D9; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.contact-item a, .contact-item strong { color: #fff; font-size: .94rem; font-weight: 600; text-decoration: none; overflow-wrap: anywhere; }
.contact-item a:hover { text-decoration: underline; }
.contact-tax { margin-top: auto; padding-top: 30px; color: rgba(255,255,255,.7); font-size: .83rem; }
.contact-tax strong { display: block; margin-top: 5px; color: #fff; font-size: 1rem; }
.contact-form-wrap { padding: 42px; border: 1px solid rgba(24,78,135,.08); border-radius: 26px; background: #fff; box-shadow: 0 16px 42px rgba(24,78,135,.09); }
.contact-form-wrap h2 { margin: 0; color: #184e87; }
.contact-form-intro { max-width: 650px; margin: 16px 0 30px; color: #65788b; line-height: 1.65; }
.contact-form { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.contact-field { display: grid; gap: 7px; }
.contact-field.full { grid-column: 1 / -1; }
.contact-field label { color: #37536e; font-size: .76rem; font-weight: 700; }
.contact-field input, .contact-field select, .contact-field textarea { width: 100%; padding: 14px 15px; color: #173f69; border: 1px solid #d7e2ea; border-radius: 12px; outline: none; background: #f8fafb; font: inherit; }
.contact-field textarea { min-height: 142px; resize: vertical; }
.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus { border-color: #6387a6; box-shadow: 0 0 0 3px rgba(99,135,166,.13); }
.contact-consent { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 10px; color: #64778a; font-size: .78rem; line-height: 1.5; }
.contact-consent input { margin-top: 3px; accent-color: #184e87; }
.contact-submit { grid-column: 1 / -1; min-height: 52px; color: #fff; border: 0; border-radius: 999px; background: #184e87; font-family: 'Lexend', sans-serif; font-size: .84rem; font-weight: 700; cursor: pointer; transition: background .2s ease, transform .2s ease; }
.contact-submit:hover { background: #123f70; transform: translateY(-2px); }
.contact-submit:disabled { cursor: wait; opacity: .68; transform: none; }
.contact-feedback { grid-column: 1 / -1; min-height: 1.4em; margin: 0; color: #287251; font-size: .86rem; font-weight: 700; }
.contact-feedback.is-error { color: #a33939; }
@media (max-width: 900px) {
    .contact-layout { grid-template-columns: 1fr; }
    .contact-details { min-height: 600px; }
}
@media (max-width: 600px) {
    
    .contact-hero { min-height: 520px; }
    .contact-hero-inner { padding: 58px 0 110px; }
    .contact-main { padding: 52px 0; }
    .contact-details, .contact-form-wrap { padding: 30px 23px; }
    .contact-details { min-height: auto; }
    .contact-form { grid-template-columns: 1fr; }
    .contact-field.full, .contact-consent, .contact-submit, .contact-feedback { grid-column: auto; }
}




