.contact-page-body { background: #f7f6f2; color: #171717; }
.contact-page { max-width: 1280px; padding: 64px 24px 70px; }
.contact-intro { max-width: 720px; margin: 0 auto 32px; text-align: center; }
.contact-eyebrow, .contact-panel-kicker { margin: 0 0 8px; color: #d99600; font: 800 .88rem/1 "Barlow Condensed", sans-serif; letter-spacing: .08em; }
.contact-intro h1 { margin: 0; color: #131722; font: 800 clamp(3rem, 5vw, 4.7rem)/.92 "Barlow Condensed", sans-serif; }
.contact-title-rule, .panel-rule { display: block; width: 42px; height: 3px; margin: 14px auto; background: #f2ae00; }
.contact-intro > p:last-child { max-width: 610px; margin: 0 auto; color: #65635e; font-size: .98rem; line-height: 1.65; }
.contact-form-card { padding: 30px 34px 24px; border: 1px solid #e0ddd5; border-radius: 4px; background: #fff; box-shadow: 0 8px 32px rgba(34,31,25,.045); }
.contact-form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 24px; }
.contact-field { display: grid; gap: 8px; color: #211f1b; font: 700 .94rem/1.2 Manrope, sans-serif; }
.contact-field > span b { color: #c43a34; }
.contact-field input, .contact-field select, .contact-field textarea { box-sizing: border-box; width: 100%; border: 1px solid #dfddd8; border-radius: 3px; background: #fff; color: #1e1d1b; font: 500 .93rem/1.4 Manrope, sans-serif; outline: none; transition: border-color .2s, box-shadow .2s; }
.contact-field input, .contact-field select { min-height: 50px; padding: 0 15px; }
.contact-field textarea { min-height: 125px; padding: 14px 15px; resize: vertical; }
.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus { border-color: #e4a600; box-shadow: 0 0 0 3px rgba(242,174,0,.12); }
.contact-field-message { position: relative; grid-column: 1 / -1; }
.contact-field-message small { position: absolute; right: 12px; bottom: 10px; color: #8b8983; font: 600 .72rem/1 Manrope, sans-serif; }
.contact-form-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 21px; }
.contact-privacy { display: flex; align-items: flex-start; gap: 10px; color: #6e6a63; font: 500 .82rem/1.5 Manrope, sans-serif; }
.contact-privacy input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: #f2ae00; }
.contact-privacy a { color: #d59100; font-weight: 700; }
.contact-submit, .contact-whatsapp-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; border: 1px solid #e1a100; background: #f2ae00; color: #161616; cursor: pointer; font: 800 1rem/1 "Barlow Condensed", sans-serif; letter-spacing: .025em; text-decoration: none; transition: transform .2s, background .2s; }
.contact-submit { min-width: 195px; gap: 10px; padding: 0 20px; }
.contact-submit:hover, .contact-whatsapp-button:hover { background: #ffbe18; transform: translateY(-1px); }
.contact-submit:disabled { opacity: .62; cursor: wait; transform: none; }
.contact-form-status { min-height: 1.25rem; margin: 13px 0 0; color: #347244; font: 600 .82rem/1.4 Manrope, sans-serif; }
.contact-form-status.is-success { color: #347244; }
.contact-form-status.is-error { color: #a33d2b; }
.contact-details-grid { display: grid; grid-template-columns: minmax(225px, .88fr) minmax(420px, 1.45fr) minmax(230px, .95fr); gap: 22px; margin-top: 32px; align-items: stretch; }
.contact-panel, .contact-map { min-height: 365px; box-sizing: border-box; border: 1px solid #e0ddd5; background: #fff; }
.contact-panel { padding: 28px 27px; }
.contact-panel h2 { margin: 0; font: 800 clamp(1.6rem, 2vw, 2.05rem)/.95 "Barlow Condensed", sans-serif; }
.contact-panel .panel-rule { margin: 13px 0 23px; }
.contact-channel-list { display: grid; gap: 18px; }
.contact-channel { display: grid; grid-template-columns: 35px 1fr; gap: 10px; }
.contact-channel-icon { display: inline-grid; place-items: center; width: 31px; height: 31px; border-radius: 50%; background: #171717; color: #f2ae00; font: 700 1.05rem/1 sans-serif; }
.contact-channel strong { display: block; margin-bottom: 2px; font: 800 .93rem/1.2 "Barlow Condensed", sans-serif; letter-spacing: .025em; }
.contact-channel p, .contact-channel a { display: block; margin: 0; color: #68655f; font: 500 .76rem/1.47 Manrope, sans-serif; overflow-wrap: anywhere; }
.contact-channel a:hover { color: #c98c00; }
.contact-map { position: relative; overflow: hidden; display: block; color: #181818; background: #f0efea; isolation: isolate; }
.contact-map-grid { position: absolute; inset: 0; z-index: 0; background-color: #f0efea; background-image: linear-gradient(28deg, transparent 46%, rgba(117,112,102,.13) 47%, rgba(117,112,102,.13) 49%, transparent 50%), linear-gradient(118deg, transparent 47%, rgba(117,112,102,.12) 48%, rgba(117,112,102,.12) 50%, transparent 51%), linear-gradient(0deg, transparent 48%, rgba(242,174,0,.22) 49%, rgba(242,174,0,.22) 51%, transparent 52%); background-size: 110px 85px, 140px 115px, 160px 138px; }
.contact-map-grid::after { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 18% 28%, rgba(255,255,255,.78), transparent 25%), radial-gradient(circle at 76% 73%, rgba(255,255,255,.65), transparent 22%); }
.contact-map-marker { position: absolute; z-index: 1; top: 55%; left: 53%; color: #181818; font-size: 2.5rem; line-height: 1; text-shadow: 0 4px 10px rgba(0,0,0,.22); }
.contact-map iframe { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; border: 0; }
.contact-map.has-embed .contact-map-marker,
.contact-map.has-embed .contact-map-grid { display: none; }
.contact-hours { display: grid; gap: 12px; }
.contact-hours div { display: flex; justify-content: space-between; gap: 10px; color: #65615a; font: 500 .77rem/1.35 Manrope, sans-serif; }
.contact-hours strong { color: #27241f; font-weight: 700; text-align: right; }
.contact-fast-support { margin-top: 26px; padding-top: 21px; border-top: 1px solid #e2dfd8; }
.contact-fast-support strong { font: 800 1.06rem/1 "Barlow Condensed", sans-serif; }
.contact-fast-support p { margin: 7px 0 13px; color: #68645d; font: 500 .76rem/1.5 Manrope, sans-serif; }
.contact-whatsapp-button { min-height: 38px; padding: 0 12px; border-color: #e6b239; background: #fff; color: #9a6800; font-size: .82rem; }
@media (max-width: 980px) { .contact-form-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } .contact-details-grid { grid-template-columns: 1fr 1fr; } .contact-map { min-height: 340px; } .contact-service { grid-column: 1 / -1; } }
@media (max-width: 640px) { .contact-page { padding: 42px 16px 48px; } .contact-intro h1 { font-size: 3.15rem; } .contact-form-card { padding: 22px 18px 18px; } .contact-form-grid, .contact-details-grid { grid-template-columns: 1fr; } .contact-form-bottom { align-items: stretch; flex-direction: column; } .contact-submit { width: 100%; } .contact-service { grid-column: auto; } .contact-panel, .contact-map { min-height: auto; } .contact-map { height: 320px; } }
