.contact-page {
  --contact-primary: var(--primary-blue, #0867e8);
  --contact-primary-dark: #103b70;
  --contact-primary-soft: #edf6ff;
  --contact-text: #103b70;
  --contact-muted: #587594;
  --contact-border: #cfe4f8;
  --contact-surface: #fff;
  --contact-whatsapp: #08aa61;
  --contact-warning: #f2a51a;
  --contact-radius: 12px;
  --contact-shadow: 0 8px 22px rgb(16 74 127 / 7%);
  overflow-x: hidden;
  background: #fff;
  color: var(--contact-text);
  font-family: Arial, Helvetica, sans-serif;
}
.contact-page .icon-sprite { display: none !important; }
.contact-page, .contact-page * { box-sizing: border-box; }
.contact-page svg { fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.contact-page .utility-bar { height: 30px; background: #eaf5ff; color: #063b68; font-size: 11px; }
.contact-page .utility-bar__inner, .contact-page .contact-shell, .contact-page .site-footer__grid, .contact-page .site-footer__bottom { width: min(1250px, calc(100% - 148px)); margin-inline: auto; }
.contact-page .utility-bar__inner { display: flex; height: 100%; align-items: center; justify-content: space-between; }
.contact-page .utility-location, .contact-page .utility-contact, .contact-page .utility-contact a { display: flex; align-items: center; gap: 7px; }
.contact-page .utility-location > svg:first-child, .contact-page .utility-contact svg { width: 14px; height: 14px; }
.contact-page .utility-chevron { width: 12px !important; height: 12px !important; margin-left: -2px; }
.contact-page .utility-contact { gap: 12px; }
.contact-page .utility-contact a { color: #063b68; text-decoration: none; }
.contact-page .utility-contact i { width: 1px; height: 15px; background: rgb(6 59 104 / 30%); }
.contact-page .contact-eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; color: var(--contact-text); font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.contact-page .contact-eyebrow > span { width: 27px; height: 2px; flex: none; background: var(--contact-primary); }
.contact-page h1, .contact-page h2, .contact-page p { text-wrap: balance; }
.contact-page .contact-hero { position: relative; min-height: 185px; overflow: hidden; background: linear-gradient(90deg, #f3faff, #f8fcff 53%, #e5f3ff); }
.contact-page .contact-hero::before { position: absolute; inset: 0; background: repeating-linear-gradient(-24deg, transparent 0 34px, rgb(8 103 232 / 4%) 35px 37px); content: ""; pointer-events: none; }
.contact-page .contact-hero__inner { position: relative; display: flex; min-height: 185px; align-items: center; }
.contact-page .contact-hero__copy { position: relative; z-index: 2; width: min(560px, 53%); padding: 22px 0 16px; }
.contact-page .contact-hero h1 { margin: 0; color: var(--contact-text); font-size: clamp(2.75rem, 3.5vw, 3rem); letter-spacing: -.055em; line-height: 1.05; }
.contact-page .contact-hero h1 em { color: var(--contact-primary); font-style: normal; }
.contact-page .contact-hero__copy > p:last-child { max-width: 560px; margin: 13px 0 0; color: var(--contact-muted); font-size: 16px; line-height: 1.35; }
.contact-page .contact-hero__art { position: absolute; inset: 0 0 0 42%; overflow: hidden; }
.contact-page .contact-hero__art img { position: absolute; right: -4%; bottom: -6%; width: 74%; max-width: 780px; opacity: .85; -webkit-mask-image: linear-gradient(90deg, transparent, #000 15%, #000 90%, transparent); mask-image: linear-gradient(90deg, transparent, #000 15%, #000 90%, transparent); }
.contact-page .contact-workspace { display: grid; grid-template-columns: 1.38fr 1fr; gap: 20px; align-items: start; padding-block: 14px 22px; }
.contact-page .contact-card { min-width: 0; border: 1px solid var(--contact-border); border-radius: var(--contact-radius); background: var(--contact-surface); box-shadow: var(--contact-shadow); }
.contact-page .contact-form-panel { padding: 22px 24px 16px; }
.contact-page .contact-info-panel { padding: 28px 18px 22px; background: linear-gradient(145deg, #f1f9ff, #fff); }
.contact-page .contact-card h2 { margin: 0; color: var(--contact-text); font-size: 29px; letter-spacing: -.045em; line-height: 1.05; }
.contact-page .card-intro { margin: 7px 0 17px; color: var(--contact-muted); font-size: 16px; line-height: 1.35; }
.contact-page .form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.contact-page .form-grid label { display: grid; gap: 5px; color: var(--contact-text); font-size: 13px; font-weight: 700; }
.contact-page .form-grid label small { color: var(--contact-muted); font-size: inherit; font-weight: 400; }
.contact-page .form-grid sup { color: #d92732; font-size: 11px; }
.contact-page .form-field--wide { grid-column: 1 / -1; }
.contact-page .field-control { display: flex; min-height: 47px; align-items: center; border: 1px solid var(--contact-border); border-radius: 9px; background: #fff; transition: border-color .24s ease, box-shadow .24s ease; }
.contact-page .field-control:focus-within { border-color: var(--contact-primary); box-shadow: 0 0 0 3px rgb(8 103 232 / 11%); }
.contact-page .field-control > svg { width: 18px; height: 18px; flex: none; margin-left: 12px; color: #6e8aa8; }
.contact-page .field-control input, .contact-page .field-control select, .contact-page .field-control textarea { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--contact-text); font: 400 14px Arial, sans-serif; }
.contact-page .field-control input, .contact-page .field-control select { height: 45px; padding: 0 12px; }
.contact-page .field-control textarea { min-height: 98px; padding: 11px 12px; resize: vertical; line-height: 1.4; }
.contact-page .field-control select { appearance: auto; }
.contact-page .field-control input::placeholder, .contact-page .field-control textarea::placeholder { color: #9bb0c4; }
.contact-page .field-control--textarea { align-items: flex-start; }
.contact-page .field-control--textarea > svg { margin-top: 12px; }
.contact-page .field-error { min-height: 0; color: #b42318; font-size: 11px; font-weight: 400; }
.contact-page .has-error .field-control { border-color: #c62828; }
.contact-page .contact-order-notice { display: flex; min-height: 64px; align-items: center; gap: 15px; margin-top: 10px; padding: 8px 14px; border: 1px solid #f2b84b; border-radius: 9px; background: #fff8e8; color: var(--contact-text); }
.contact-page .contact-order-notice > i { display: grid; width: 39px; height: 39px; flex: none; place-items: center; border-right: 1px solid #f2b84b; color: var(--contact-warning); font-style: normal; }
.contact-page .contact-order-notice > i svg { width: 25px; height: 25px; }
.contact-page .contact-order-notice p { display: grid; gap: 3px; margin: 0; }
.contact-page .contact-order-notice strong { font-size: 15px; }
.contact-page .contact-order-notice span { color: #6f7180; font-size: 14px; }
.contact-page .form-submit-row { display: flex; align-items: center; gap: 22px; margin-top: 11px; }
.contact-page .contact-submit { display: inline-flex; width: 230px; min-height: 48px; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 9px; background: var(--contact-primary); color: #fff; font: 700 14px Arial, sans-serif; cursor: pointer; transition: box-shadow .24s ease, transform .24s ease; }
.contact-page .contact-submit svg { width: 19px; height: 19px; }
.contact-page .contact-submit span, .contact-page .contact-button span { font-size: 17px; transition: transform .24s ease; }
.contact-page .privacy-note { display: flex; max-width: 300px; align-items: center; gap: 9px; margin: 0; color: #52708e; font-size: 13px; line-height: 1.35; }
.contact-page .privacy-note svg { width: 23px; height: 23px; flex: none; color: var(--contact-primary); }
.contact-page .form-status { min-height: 17px; margin: 9px 0 0; font-size: 11px; }
.contact-page .form-status.is-success { color: #08783d; }
.contact-page .form-status.is-info { color: var(--contact-text); }
.contact-page .info-list { margin-top: 18px; padding: 0 16px; border-radius: 10px; background: rgb(255 255 255 / 90%); }
.contact-page .info-row { display: flex; min-height: 86px; align-items: center; gap: 18px; border-bottom: 1px solid var(--contact-border); }
.contact-page .info-row:last-child { border-bottom: 0; }
.contact-page .info-row > i { display: grid; width: 39px; height: 39px; flex: none; place-items: center; border-radius: 50%; background: #e6f1ff; color: var(--contact-primary); font-style: normal; transition: transform .24s ease; }
.contact-page .info-row > i.is-green { background: #dcf8e9; color: var(--contact-whatsapp); }
.contact-page .info-row > i svg { width: 21px; height: 21px; }
.contact-page .info-row p { display: grid; gap: 4px; margin: 0; }
.contact-page .info-row strong { color: var(--contact-text); font-size: 15px; }
.contact-page .info-row span, .contact-page .info-row a { color: var(--contact-muted); font-size: 14px; line-height: 1.3; text-decoration: none; }
.contact-page .info-action { display: flex; min-height: 80px; align-items: center; gap: 13px; margin-top: 17px; padding: 15px 14px; border: 1px solid #079755; border-radius: 9px; background: var(--contact-whatsapp); color: #fff; text-decoration: none; transition: box-shadow .24s ease, transform .24s ease; }
.contact-page .info-action > i { display: grid; width: 42px; height: 42px; flex: none; place-items: center; color: #fff; font-style: normal; }
.contact-page .info-action > i svg { width: 33px; height: 33px; }
.contact-page .info-action span { display: grid; gap: 3px; }
.contact-page .info-action strong { font-size: 16px; }
.contact-page .info-action small { color: #e7fff3; font-size: 13px; }
.contact-page .info-action > b { display: grid; width: 30px; height: 30px; align-items: center; justify-content: center; margin-left: auto; border-radius: 50%; background: rgb(0 93 54 / 30%); font-size: 20px; font-weight: 400; transition: transform .24s ease; }
.contact-page .contact-final-cta { position: relative; overflow: hidden; background: linear-gradient(105deg, #0752c8, #087be9 68%, #10a2ef); color: #fff; }
.contact-page .contact-final-cta::after { position: absolute; right: -2%; bottom: -48%; width: 43%; height: 170%; background: repeating-linear-gradient(-13deg, transparent 0 20px, rgb(255 255 255 / 16%) 21px 24px); content: ""; transform: skewY(-7deg); }
.contact-page .contact-final-cta__inner { position: relative; z-index: 1; display: flex; min-height: 108px; align-items: center; justify-content: space-between; gap: 18px; }
.contact-page .contact-eyebrow--light { color: #fff; }
.contact-page .contact-eyebrow--light > span { background: #fff; }
.contact-page .contact-final-cta h2 { margin: 0; color: #fff; font-size: 28px; line-height: 1.05; }
.contact-page .contact-final-cta p:last-child { margin: 6px 0 0; color: #e8f5ff; font-size: 14px; }
.contact-page .contact-final-cta__actions { display: flex; align-items: center; gap: 8px; }
.contact-page .contact-button { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; gap: 8px; padding: 0 22px; border: 1px solid transparent; border-radius: 9px; color: var(--contact-primary); font: 700 13px Arial, sans-serif; text-decoration: none; white-space: nowrap; transition: box-shadow .24s ease, transform .24s ease; }
.contact-page .contact-button svg { width: 18px; height: 18px; }
.contact-page .contact-button--light { background: #fff; }
.contact-page .site-footer { background: var(--footer-navy, #062f55); color: rgb(255 255 255 / 80%); }
.contact-page .site-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(3, .8fr) 1.1fr; gap: 28px; padding: 24px 0 18px; }
.contact-page .site-footer__grid > div { min-width: 0; }
.contact-page .site-footer p, .contact-page .site-footer a, .contact-page .site-footer span { display: block; margin: 4px 0; color: inherit; font-size: 11px; line-height: 1.35; text-decoration: none; }
.contact-page .site-footer strong { display: block; margin: 0 0 8px; color: #fff; font-size: 12px; }
.contact-page .site-footer a:hover { color: #7fc1ff; }
.contact-page .site-footer .footer-brand img, .contact-page .site-footer .footer-jsw img { display: block; box-sizing: border-box; object-fit: contain; background: #fff; border: 1px solid rgb(255 255 255 / 25%); border-radius: 9px; box-shadow: 0 4px 14px rgb(0 0 0 / 10%); }
.contact-page .site-footer .footer-brand img { width: 205px; height: 58px; max-width: 100%; padding: 9px 12px; }
.contact-page .site-footer .footer-jsw img { width: 145px; height: 58px; max-width: 100%; padding: 9px 13px; }
.contact-page .site-footer .footer-brand p { margin-top: 10px; }
.contact-page .site-footer .footer-contact a { display: flex; align-items: center; gap: 7px; }
.contact-page .site-footer .footer-contact svg { width: 14px; height: 14px; flex: none; }
.contact-page .site-footer .footer-social { display: flex; gap: 12px; margin-top: 8px; }
.contact-page .site-footer .footer-social a { display: grid; place-items: center; }
.contact-page .site-footer .footer-social a svg { width: 17px; height: 17px; }
.contact-page .site-footer__bottom { display: flex; justify-content: space-between; gap: 16px; padding: 11px 0; border-top: 1px solid rgb(201 227 250 / 25%); color: rgb(255 255 255 / 72%); font-size: 10px; }
.contact-page .site-footer__bottom span { margin: 0; font-size: inherit; }
.contact-page .site-footer__bottom svg { width: 14px; height: 14px; vertical-align: middle; }
.contact-page .contact-reveal { opacity: 0; transform: translateY(16px); transition: opacity .62s cubic-bezier(.22,1,.36,1), transform .62s cubic-bezier(.22,1,.36,1); }
.contact-page .contact-reveal.is-visible { opacity: 1; transform: translateY(0); }
.contact-page .contact-hero__copy .contact-eyebrow, .contact-page .contact-hero__copy h1, .contact-page .contact-hero__copy > p:last-child { opacity: 0; transform: translateY(12px); transition: opacity .55s cubic-bezier(.22,1,.36,1), transform .55s cubic-bezier(.22,1,.36,1); }
.contact-page .contact-hero__copy.is-visible .contact-eyebrow, .contact-page .contact-hero__copy.is-visible h1, .contact-page .contact-hero__copy.is-visible > p:last-child { opacity: 1; transform: translateY(0); }
.contact-page .contact-hero__copy.is-visible h1 { transition-delay: .08s; }
.contact-page .contact-hero__copy.is-visible > p:last-child { transition-delay: .18s; }
.contact-page .contact-hero__art.contact-reveal { transform: translateX(14px); }
.contact-page .contact-hero__art.contact-reveal.is-visible { transform: translateX(0); }
@media (hover: hover) and (pointer: fine) {
  .contact-page .contact-submit:hover, .contact-page .contact-button:hover { box-shadow: 0 9px 18px rgb(8 103 232 / 20%); transform: translateY(-2px); }
  .contact-page .contact-submit:hover span, .contact-page .contact-button:hover span, .contact-page .info-action:hover > b { transform: translateX(3px); }
  .contact-page .info-action:hover { box-shadow: 0 9px 18px rgb(0 117 67 / 25%); transform: translateY(-2px); }
  .contact-page .info-row:hover > i { transform: scale(1.03); }
}
.contact-page :is(a, button, input, select, textarea):focus-visible { outline: 3px solid rgb(8 103 232 / 30%); outline-offset: 2px; }
@media (max-width: 1050px) {
  .contact-page .utility-bar__inner, .contact-page .contact-shell, .contact-page .site-footer__grid, .contact-page .site-footer__bottom { width: calc(100% - 48px); }
  .contact-page .contact-workspace { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .contact-page .utility-bar__inner, .contact-page .contact-shell, .contact-page .site-footer__grid, .contact-page .site-footer__bottom { width: calc(100% - 28px); }
  .contact-page .utility-contact a:not(:first-child), .contact-page .utility-contact i { display: none; }
  .contact-page .contact-hero, .contact-page .contact-hero__inner { min-height: 345px; }
  .contact-page .contact-hero__copy { width: 100%; padding-top: 35px; align-self: flex-start; }
  .contact-page .contact-hero__art { inset: 42% 0 0; opacity: .8; }
  .contact-page .contact-hero__art img { right: -20%; bottom: -8%; width: 100%; }
  .contact-page .contact-workspace { gap: 16px; padding-block: 16px 18px; }
  .contact-page .form-grid { grid-template-columns: 1fr; gap: 13px; }
  .contact-page .form-field--wide { grid-column: auto; }
  .contact-page .form-submit-row { align-items: flex-start; flex-direction: column; gap: 12px; }
  .contact-page .privacy-note { max-width: 340px; }
  .contact-page .contact-final-cta__inner { align-items: flex-start; flex-direction: column; padding-block: 24px; }
  .contact-page .contact-final-cta__actions { width: 100%; flex-wrap: wrap; }
  .contact-page .contact-final-cta__actions .contact-button { flex: 1 1 150px; }
  .contact-page .site-footer__grid { grid-template-columns: repeat(2, 1fr); gap: 20px; }
  .contact-page .site-footer__bottom { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 430px) {
  .contact-page .contact-hero h1 { font-size: 2.5rem; }
  .contact-page .contact-form-panel, .contact-page .contact-info-panel { padding-inline: 16px; }
  .contact-page .contact-order-notice { align-items: flex-start; }
  .contact-page .contact-order-notice > i { width: 32px; }
  .contact-page .contact-submit { width: 100%; }
  .contact-page .contact-final-cta__actions { display: grid; grid-template-columns: 1fr 1fr; }
  .contact-page .contact-final-cta__actions .contact-button:last-child { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .contact-page .contact-reveal, .contact-page .contact-hero__copy :is(.contact-eyebrow, h1, > p:last-child), .contact-page .contact-hero__art.contact-reveal { opacity: 1; transform: none; transition: none; }
  .contact-page :is(.contact-submit, .contact-button, .info-action, .info-row > i) { transition: none; }
}
