/* Contact page */
.contact-page .container { width: min(1280px, 89%); }
.contact-page .footer-contact { display: none; }

.contact-hero {
    position: relative;
    min-height: clamp(223px, 24.86vw, 358px);
    overflow: hidden;
    color: #fff;
    background-color: #111;
    background-image: linear-gradient(90deg, rgba(0,0,0,.78), rgba(0,0,0,.54) 56%, rgba(0,0,0,.25)), url("../images/about/industrial-hero.jpg");
    background-repeat: no-repeat;
    background-position: center, right center;
    background-size: cover, cover;
}
.contact-hero-inner { display: flex; min-height: inherit; align-items: stretch; }
.contact-hero-copy { width: min(690px, 100%); padding-top: clamp(43px, 4.86vw, 70px); }
.contact-hero-kicker { display: flex; align-items: center; gap: 8px; margin: 0 0 19px; color: #fff; font-size: clamp(12px, 1.11vw, 16px); font-weight: 600; line-height: 1.25; }
.contact-hero-kicker span { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: var(--color-orange); }
.contact-hero h1 { margin: 0; color: #fff; font-size: clamp(46px, 5.28vw, 76px); font-weight: 700; line-height: 1.04; letter-spacing: -.035em; }
.contact-hero-rule { width: 100%; height: 1px; margin-top: 24px; background: rgba(255,255,255,.72); }
.contact-breadcrumb { display: flex; align-items: center; gap: 12px; margin-top: 17px; color: #f2f2f2; font-size: 11px; line-height: 1.3; }
.contact-breadcrumb a:hover { color: var(--color-orange); }

.contact-information-section { min-height: clamp(396px, 44.2vw, 636px); padding: clamp(38px, 4.45vw, 64px) 0; background: #f3f3f3; }
.contact-information-layout { display: grid; min-height: 100%; grid-template-columns: 1.07fr .93fr; align-items: end; gap: 32px; }
.contact-information-copy { align-self: center; }
.contact-information-copy > .eyebrow { margin-bottom: 13px; }
.contact-information-copy h2 { margin: 0 0 22px; color: #292929; font-size: 32px; font-weight: 700; line-height: 1.2; }
.contact-information-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.contact-information-card { display: flex; min-height: 105px; flex-direction: column; align-items: flex-start; justify-content: center; padding: 18px 20px; background: #fff; border: 1px solid #e6e6e6; }
.contact-information-card--address { min-height: 145px; justify-content: flex-start; padding-top: 20px; }
.contact-information-card > span { margin-bottom: 8px; color: #777; font-size: 13px; line-height: 1.25; }
.contact-information-card a, .contact-information-card p { margin: 0; color: #282828; font-size: 15px; font-weight: 600; line-height: 1.45; }
.contact-information-card a:hover { color: var(--color-orange); }
.contact-worker { display: flex; min-width: 0; height: clamp(350px, 38.9vw, 560px); align-items: flex-end; justify-content: center; overflow: hidden; }
.contact-worker img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; mix-blend-mode: multiply; }

.contact-map { width: 100%; height: clamp(256px, 28.6vw, 412px); overflow: hidden; background: #e5e5e5; }
.contact-map iframe { display: block; width: 100%; height: 100%; border: 0; }

.contact-form-section { min-height: clamp(435px, 48.7vw, 700px); padding: clamp(45px, 5.2vw, 75px) 0 clamp(42px, 4.8vw, 69px); background: #fff; }
.contact-form-container { width: min(1094px, 76%); text-align: center; }
.contact-form-container > .eyebrow { justify-content: center; margin-bottom: 12px; }
.contact-form-container h2 { margin: 0; color: #292929; font-size: 32px; font-weight: 700; line-height: 1.2; }
.contact-form { margin-top: 29px; text-align: left; }
.contact-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 15px; }
.contact-field { min-width: 0; }
.contact-field input, .contact-field textarea { display: block; width: 100%; border: 1px solid #d8d8d8; border-radius: 0; background: #fff; color: #333; font-family: inherit; font-size: 13px; outline: 0; }
.contact-field input { height: clamp(39px, 4.38vw, 63px); padding: 0 14px; }
.contact-field textarea { height: clamp(98px, 11vw, 158px); padding: 13px 14px; resize: vertical; }
.contact-field input::placeholder, .contact-field textarea::placeholder { color: #999; opacity: 1; }
.contact-field input:focus, .contact-field textarea:focus { border-color: var(--color-orange); }
.contact-field small { display: block; margin: 5px 0 0; color: #b42318; font-size: 11px; }
.contact-field--message, .contact-submit { grid-column: 1 / -1; }
.contact-submit { display: flex; width: 100%; height: clamp(33px, 3.68vw, 53px); align-items: center; justify-content: center; gap: 8px; padding: 0 16px; border: 1px solid var(--color-orange); border-radius: 0; background: var(--color-orange); color: #fff; font-size: 12px; cursor: pointer; transition: background .18s ease, border-color .18s ease; }
.contact-submit:hover { border-color: #d94e00; background: #d94e00; }
.contact-feedback { margin: 14px 0 0; color: #426a36; font-size: 13px; }

@media (max-width: 980px) {
    .contact-page .container { width: calc(100% - 48px); }
    .contact-information-section { padding-block: 48px; }
    .contact-information-layout { grid-template-columns: 1fr .8fr; gap: 22px; }
    .contact-information-card { padding-inline: 14px; }
    .contact-information-card a, .contact-information-card p { font-size: 13px; }
    .contact-worker { height: 390px; }
    .contact-form-container { width: min(760px, 84%); }
}

@media (max-width: 700px) {
    .contact-page .container { width: calc(100% - 36px); }
    .contact-hero { min-height: 320px; }
    .contact-hero-inner { min-height: 320px; }
    .contact-hero-copy { padding-top: 55px; }
    .contact-hero-kicker { margin-bottom: 18px; font-size: 13px; }
    .contact-hero h1 { font-size: 58px; }
    .contact-information-section { min-height: 0; padding-block: 42px; }
    .contact-information-layout { grid-template-columns: 1fr; gap: 18px; }
    .contact-information-copy h2 { font-size: 28px; }
    .contact-information-grid { gap: 10px; }
    .contact-information-card { min-height: 95px; padding: 13px; }
    .contact-information-card--address { min-height: 136px; }
    .contact-information-card a, .contact-information-card p { font-size: 11px; }
    .contact-information-card > span { font-size: 11px; }
    .contact-worker { height: 300px; }
    .contact-worker img { object-position: center 40%; }
    .contact-map { height: 256px; }
    .contact-form-section { min-height: 0; padding-block: 45px; }
    .contact-form-container { width: calc(100% - 36px); }
    .contact-form-container h2 { font-size: 28px; }
    .contact-form { margin-top: 22px; }
    .contact-form-grid { grid-template-columns: 1fr; gap: 12px; }
    .contact-field input { height: 46px; }
    .contact-field textarea { height: 120px; }
    .contact-field--message, .contact-submit { grid-column: auto; }
    .contact-submit { height: 44px; }
}
