.contact-hero { position: relative; isolation: isolate; overflow: hidden; padding: 52px 5%; background: #f5f9f8; }
.contact-backdrop { position: absolute; inset: 0 0 0 45%; z-index: -3; background: linear-gradient(#003e4480,#002d46a6),url('assets/hero-generated.png') center center/cover; }
.contact-hero:before { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(120deg,#fff,#f0f7f4); clip-path: polygon(0 0,44% 0,61% 57%,45% 100%,0 100%); }
.contact-hero:after { content: ''; position: absolute; inset: 0; z-index: -2; background: linear-gradient(135deg,#b4dcd0,#00865b,#005239); clip-path: polygon(42% 0,47% 0,65% 57%,49% 100%,44% 100%,60% 57%); }
.contact-layout { display: grid; grid-template-columns: 1fr 1.05fr; align-items: center; gap: clamp(30px,6vw,100px); max-width: 1280px; margin: auto; }
.contact-presentation h1 { font-size: clamp(36px,4vw,62px); line-height: 1.07; }
.contact-presentation h1 span { color: #00663e; }
.contact-presentation > p:not(.eyebrow) { font-size: 17px; line-height: 1.6; color: #25476a; max-width: 410px; margin: 24px 0; }
.contact-direct { display: grid; gap: 16px; margin-top: 30px; }
.contact-direct a { display: flex; align-items: center; gap: 12px; font-size: 15px; color: #063660; }
.contact-direct span { overflow-wrap: anywhere; min-width: 0; }
.contact-direct svg { width: 26px; height: 26px; flex-shrink: 0; color: #00865b; }
.email-contact-form { background: #fffffffa; padding: 32px; border: 1px solid #e0ece8; border-radius: 18px; box-shadow: 0 16px 48px #001f3930; min-width: 0; }
.email-contact-form h2 { font-size: 26px; margin: 0 0 8px; color: #061d64; }
.email-form-intro { font-size: 14px; line-height: 1.5; margin: 0 0 22px; color: #526b7c; }
.email-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 17px; }
.email-fields label { color: #25476a; font-size: 14px; font-weight: 700; }
.email-fields label span { font-weight: 400; font-size: 12px; }
.email-fields input,.email-fields textarea { display: block; width: 100%; margin-top: 7px; border: 1px solid #cbdcd7; border-radius: 7px; background: #f8fbfa; padding: 11px 12px; color: #153464; font: inherit; font-weight: 400; font-size: 16px; }
.email-fields textarea { resize: vertical; min-height: 110px; }
.email-field-wide { grid-column: 1 / -1; }
.email-fields input:focus,.email-fields textarea:focus { outline: 2px solid #00865b; outline-offset: 2px; }
.email-send { display: flex; align-items: center; justify-content: center; width: 100%; gap: 10px; padding: 15px; margin-top: 22px; border: 0; border-radius: 9px; background: linear-gradient(140deg,#00885b,#00553f); color: #fff; font-size: 16px; font-weight: 700; cursor: pointer; }
.email-send svg { width: 24px; height: 24px; }
.email-send:disabled { opacity: .65; cursor: wait; }
.email-send:focus-visible { outline: 3px solid #0a66c2; outline-offset: 3px; }
.email-status { font-size: 14px; line-height: 1.5; margin: 14px 0 0; color: #25476a; }
.email-status:empty { display: none; }
.email-status[data-state="error"] { color: #a32222; }
.email-status[data-state="success"] { color: #00663e; }
.email-trap { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
@media(max-width:900px) { .contact-layout { gap: 30px; } .email-contact-form { padding: 24px; } .contact-direct a { font-size: 13px; } }
@media(max-width:750px) { .contact-hero { padding: 30px 5%; } .contact-layout { grid-template-columns: 1fr; } .contact-presentation { text-align: center; } .contact-presentation > p:not(.eyebrow) { margin-inline: auto; } .contact-direct { justify-content: center; margin-top: 20px; } .contact-backdrop { inset: 45% 0 0; } .contact-hero:before { clip-path: none; background: linear-gradient(#f5f9f8 20%,#f5f9f8e8 55%,#f5f9f833); } .contact-hero:after { display: none; } }
@media(max-width:450px) { .email-fields { grid-template-columns: 1fr; } .email-contact-form { padding: 22px 18px; } .email-contact-form h2 { font-size: 23px; } }