/* Approved V3,
scoped to the contact template. Shared shell stays unchanged. */
.cm-contact { --bg:#f8fafb;--soft:#eef3f6;--white:#fff;--ink:#17202a;--muted:#66717d;--line:#dfe5e8;--blue:#1573e8;--blue-dark:#0b5dbc;--pale:#eaf3ff;--radius:18px;--shadow:0 24px 70px rgba(23,32,42,.08) }

.cm-contact * { box-sizing:border-box }

.cm-contact { scroll-behavior:smooth }

.cm-contact { margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased }

.cm-contact a { color:inherit;text-decoration:none }

.cm-contact button,
.cm-contact input,
.cm-contact select,
.cm-contact textarea { font:inherit }

.cm-contact button { cursor:pointer }

.cm-contact button:disabled { cursor:wait }

.cm-contact img { max-width:100% }

.cm-contact *:focus-visible { outline:3px solid var(--blue);outline-offset:3px }

.cm-contact .wrap { width:min(calc(100% - 48px),1180px);margin:auto }

.cm-contact .hero-shell { position:relative;padding:31px 0 104px }

.cm-contact .hero-shell:before { content:"";position:absolute;inset:70px 0 auto auto;width:min(720px,100%);height:690px;background:radial-gradient(circle,rgba(21,115,232,.055),transparent 65%);pointer-events:none }

.cm-contact .breadcrumb { display:flex;align-items:center;gap:11px;font-size:12px;color:#7a8690 }

.cm-contact .breadcrumb a:hover { text-decoration:underline }

.cm-contact .breadcrumb svg { width:12px;height:12px;opacity:.7 }

.cm-contact .hero-grid { position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.075fr);align-items:start;gap:88px;padding-top:69px }

.cm-contact .hero-left { padding-top:15px;position:relative }

.cm-contact .kicker { display:flex;align-items:center;gap:10px;color:#5a6b7a;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:800 }

.cm-contact .kicker:before { content:"";display:block;background:var(--blue);height:2px;width:26px }

.cm-contact .hero-left h1 { font-size:clamp(50px,5.4vw,77px);letter-spacing:-.058em;line-height:1.03;font-weight:770;margin:22px 0 24px;max-width:570px }

.cm-contact .hero-left h1 span { color:var(--blue) }

.cm-contact .lead { font-size:18px;line-height:1.72;color:#586675;max-width:475px;margin:0 0 37px }

.cm-contact .divider-line { height:1px;width:min(100%,420px);background:var(--line);margin-bottom:28px }

.cm-contact .microtitle { text-transform:uppercase;font-size:11px;letter-spacing:.13em;color:#83909b;font-weight:820;margin:0 0 13px }

.cm-contact .topics { display:flex;flex-wrap:wrap;gap:9px;max-width:430px }

.cm-contact .topic-chip { background:#fff;border:1px solid #dfe7ec;border-radius:50px;padding:9px 13px;color:#44515d;font-size:12px;font-weight:700;transition:.2s }

.cm-contact .topic-chip:hover { color:var(--blue-dark);background:var(--pale);border-color:#c9e0fa }

.cm-contact .topic-chip.active { background:var(--pale);border-color:#99c6fa;color:#0b5dbc }

.cm-contact .microhint { font-size:12px;color:#8b96a0;margin:10px 0 0;max-width:360px }

.cm-contact .alternate { margin-top:54px;border-left:2px solid #caddec;padding:3px 0 3px 18px;max-width:435px }

.cm-contact .alternate-title { font-size:14px;font-weight:800;margin:0 0 5px }

.cm-contact .alternate p { font-size:13px;line-height:1.64;color:#6b7884;margin:0 }

.cm-contact .contact-mail { display:inline-flex;align-items:center;gap:9px;border:1px solid #c7ddf4;color:var(--blue-dark);background:#eaf3ff;padding:10px 13px;font-weight:750;font-size:13px;margin-top:13px;border-radius:9px }

.cm-contact .contact-mail:hover { background:#dcecff;border-color:#a4c7ec }

.cm-contact .contact-mail svg { width:16px;height:16px }

.cm-contact .decoration { margin-top:76px;display:flex;align-items:center;gap:10px;opacity:.62 }

.cm-contact .deco-line { height:1px;background:#a8c7e4;width:145px }

.cm-contact .deco-ring { width:28px;height:28px;border-radius:50%;border:1px solid #a8c7e4;display:grid;place-items:center }

.cm-contact .deco-ring:after { content:"";height:7px;width:7px;border-radius:50%;background:var(--blue) }

.cm-contact .deco-index { letter-spacing:.1em;font-size:10px;color:#6e899d;font-weight:700 }

.cm-contact .form-card { background:#fff;border:1px solid #e6ecf0;border-radius:24px;padding:38px 38px 34px;box-shadow:var(--shadow);position:relative;z-index:1 }

.cm-contact .form-card:before { content:"";position:absolute;width:86px;height:4px;left:38px;top:0;background:var(--blue);border-radius:0 0 5px 5px }

.cm-contact .form-top { display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:30px }

.cm-contact .form-top h2 { font-size:29px;letter-spacing:-.043em;line-height:1.15;margin:0 0 8px;font-weight:760 }

.cm-contact .form-top p { font-size:13px;line-height:1.6;color:var(--muted);margin:0 }

.cm-contact .mail-icon { height:45px;width:45px;display:grid;place-items:center;background:var(--pale);color:var(--blue);border-radius:13px;flex:0 0 auto }

.cm-contact .mail-icon svg { width:22px;height:22px;stroke-width:1.65 }

.cm-contact .row-fields { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px }

.cm-contact .field { margin:0 0 17px }

.cm-contact .field label { display:block;font-size:12px;font-weight:790;color:#33414b;margin-bottom:7px;letter-spacing:.007em }

.cm-contact .field label i { font-style:normal;color:var(--blue) }

.cm-contact .field .subtle { font-weight:510;color:#919ca6 }

.cm-contact .field input,
.cm-contact .field select,
.cm-contact .field textarea { background:#fbfcfd;border:1px solid #d9e3e9;border-radius:10px;width:100%;padding:11px 13px;color:var(--ink);font-size:14px;min-height:46px;transition:border .15s,box-shadow .15s }

.cm-contact .field input::placeholder,
.cm-contact .field textarea::placeholder { color:#a0aab4 }

.cm-contact .field textarea { min-height:133px;display:block;resize:vertical;line-height:1.6 }

.cm-contact .field select { appearance:none;background:#fbfcfd url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2366717d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 13px center;padding-right:40px }

.cm-contact .field input:focus,
.cm-contact .field select:focus,
.cm-contact .field textarea:focus { outline:none;border-color:#7baef0;box-shadow:0 0 0 3px rgba(21,115,232,.11) }

.cm-contact .field [aria-invalid="true"] { border-color:#bf4352 }

.cm-contact .field .error { font-size:12px;color:#b3213b;margin:5px 0 0;display:none }

.cm-contact .field .error.show { display:block }

.cm-contact .form-legal { margin:4px 0 23px;padding-top:20px;border-top:1px solid #edf1f3;color:#72808b;font-size:11px;line-height:1.65 }

.cm-contact .privacy-line { display:flex;align-items:flex-start;gap:11px }

.cm-contact .privacy-line input[type="checkbox"] { appearance:auto;accent-color:var(--blue);width:18px;height:18px;flex:0 0 18px;margin:1px 0 0;cursor:pointer }

.cm-contact .privacy-line input[aria-invalid="true"] { outline:2px solid #bf4352;outline-offset:2px }

.cm-contact .privacy-copy { font-size:12px;line-height:1.6;color:#3b4b59 }

.cm-contact .privacy-copy label { cursor:pointer }

.cm-contact .privacy-copy a { color:var(--blue-dark);font-weight:700;text-decoration:underline;text-underline-offset:2px }

.cm-contact .privacy-explain { font-size:11px;color:#83919c;margin:8px 0 0 29px;line-height:1.6 }

.cm-contact .privacy-error { display:none;font-size:12px;color:#b3213b;margin:7px 0 0 29px }

.cm-contact .privacy-error.show { display:block }

.cm-contact .form-footer { display:flex;align-items:center;justify-content:space-between;gap:14px }

.cm-contact .required-label { font-size:11px;color:#97a3ad }

.cm-contact .submit { border:0;border-radius:11px;background:var(--blue);color:#fff;min-height:49px;padding:11px 18px;display:flex;align-items:center;justify-content:center;gap:18px;font-size:13px;font-weight:790;box-shadow:0 7px 18px rgba(21,115,232,.16);transition:.2s }

.cm-contact .submit:hover { background:var(--blue-dark);transform:translateY(-1px) }

.cm-contact .submit svg { width:17px;height:17px }

.cm-contact .state { display:none;border-radius:10px;margin-top:18px;font-size:13px;line-height:1.65;padding:13px 16px }

.cm-contact .state.visible { display:block }

.cm-contact .state.error-state { background:#fff4f4;border:1px solid #e9bdc4;color:#7c2430 }

.cm-contact .state.success-state { background:#eff8f1;border:1px solid #bcdac3;color:#215c37 }

.cm-contact .state strong { display:block;margin-bottom:3px }

.cm-contact .state small { display:block;font-size:11px;opacity:.85 }

.cm-contact .form-legal-note { font-size:11px;color:#94a2ad;margin:12px 0 0 }

.cm-contact .next-section { background:#fff;border-top:1px solid #e5ebef;padding:53px 0 63px }

.cm-contact .next-grid { display:grid;grid-template-columns:1fr 1.8fr;gap:60px;align-items:center }

.cm-contact .next-title span { color:var(--blue);font-size:11px;letter-spacing:.13em;text-transform:uppercase;font-weight:800 }

.cm-contact .next-title h2 { font-size:28px;line-height:1.2;letter-spacing:-.04em;margin:8px 0 0;max-width:330px }

.cm-contact .next-links { display:grid;grid-template-columns:repeat(3,1fr);gap:12px }

.cm-contact .next-link { display:flex;flex-direction:column;justify-content:space-between;gap:25px;padding:19px;background:#f8fafb;border:1px solid #e5ebef;border-radius:14px;min-height:118px;font-size:13px;font-weight:720 }

.cm-contact .next-link:hover { border-color:#bdd8f6;background:var(--pale) }

.cm-contact .next-link svg { width:17px;height:17px;color:var(--blue) }

@media(max-width:1080px) {
.cm-contact .hero-grid { gap:38px }

.cm-contact .hero-left h1 { font-size:clamp(46px,5.5vw,65px) }

.cm-contact .form-card { padding:31px 26px }

.cm-contact .form-card:before { left:26px }

.cm-contact .next-grid { gap:20px }

}

@media(max-width:900px) {

.cm-contact .hero-grid { grid-template-columns:1fr;gap:37px;padding-top:46px }

.cm-contact .hero-left { padding-top:0 }

.cm-contact .hero-left h1 { max-width:650px }

.cm-contact .lead { max-width:650px }

.cm-contact .alternate { margin-top:25px }

.cm-contact .decoration { display:none }

.cm-contact .form-card { max-width:660px }

.cm-contact .next-grid { grid-template-columns:1fr;gap:24px }

}

@media(max-width:600px) {
.cm-contact .wrap { width:min(calc(100% - 34px),1180px) }

.cm-contact .hero-shell { padding:21px 0 59px }

.cm-contact .breadcrumb { font-size:11px }

.cm-contact .hero-grid { padding-top:40px;gap:30px }

.cm-contact .kicker { font-size:10px;letter-spacing:.11em }

.cm-contact .kicker:before { width:19px }

.cm-contact .hero-left h1 { font-size:43px;line-height:1.06;letter-spacing:-.055em;margin:18px 0 18px }

.cm-contact .lead { font-size:15px;line-height:1.7;margin:0 0 27px }

.cm-contact .divider-line { margin-bottom:19px }

.cm-contact .microtitle { font-size:10px }

.cm-contact .topics { gap:8px }

.cm-contact .topic-chip { padding:8px 11px;font-size:11px }

.cm-contact .microhint { font-size:11px }

.cm-contact .alternate { margin-top:26px }

.cm-contact .alternate-title { font-size:13px }

.cm-contact .alternate p { font-size:12px }

.cm-contact .placeholder { font-size:10px }

.cm-contact .form-card { border-radius:18px;padding:26px 19px 23px;box-shadow:0 13px 45px rgba(23,32,42,.07) }

.cm-contact .form-card:before { left:19px }

.cm-contact .form-top { margin-bottom:24px }

.cm-contact .form-top h2 { font-size:24px }

.cm-contact .form-top p { font-size:12px }

.cm-contact .mail-icon { width:38px;height:38px;border-radius:11px }

.cm-contact .mail-icon svg { width:19px }

.cm-contact .row-fields { grid-template-columns:1fr;gap:0 }

.cm-contact .field { margin-bottom:15px }

.cm-contact .field input,
.cm-contact .field select,
.cm-contact .field textarea { font-size:14px }

.cm-contact .field textarea { min-height:116px }

.cm-contact .form-legal { padding-top:15px;margin-bottom:20px }

.cm-contact .form-footer { display:block }

.cm-contact .submit { width:100%;justify-content:space-between }

.cm-contact .required-label { display:block;margin-top:10px }

.cm-contact .next-section { padding:41px 0 48px }

.cm-contact .next-title h2 { font-size:25px }

.cm-contact .next-links { grid-template-columns:1fr;gap:10px }

.cm-contact .next-link { min-height:62px;display:flex;flex-direction:row;align-items:center;gap:15px }

}

@media(prefers-reduced-motion:reduce) {
.cm-contact *,
.cm-contact *:before,
.cm-contact *:after { scroll-behavior:auto!important;transition:none!important;animation:none!important }

}

@media print {

.cm-contact .submit { box-shadow:none }

}
.cm-contact { box-sizing:border-box; }

.cm-contact .honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }

.cm-contact .form-unavailable { padding:20px; border:1px solid var(--line); border-radius:10px; }


/* Keep V3 layout, with readable small text and interactive states. */
.cm-contact .microtitle,
.cm-contact .microhint,
.cm-contact .privacy-explain,
.cm-contact .required-label,
.cm-contact .form-legal-note { color:#586675; }
.cm-contact .subtle,
.cm-contact .field input::placeholder,
.cm-contact .field textarea::placeholder { color:#66717d; }
.cm-contact .topic-chip { min-height:44px; }
.cm-contact .privacy-line { min-height:44px; align-items:center; }
.cm-contact .submit:disabled { opacity:.65; cursor:not-allowed; transform:none; }

/* Override inherited vendor kit fields only inside the native Contact page.
   The :not() specificity also covers the kit's input:not(type) rules. */
.cleanmode-native .cm-contact .field input:not([type="checkbox"]),
.cleanmode-native .cm-contact .field select,
.cleanmode-native .cm-contact .field textarea {
  font:inherit;
  font-size:14px;
  font-weight:400;
  text-transform:none;
  letter-spacing:normal;
  color:var(--ink);
  background-color:#fbfcfd;
  border:1px solid #d9e3e9;
  border-radius:10px;
  transition:border .15s,box-shadow .15s;
}
.cleanmode-native .cm-contact .field input:not([type="checkbox"]):focus,
.cleanmode-native .cm-contact .field select:focus,
.cleanmode-native .cm-contact .field textarea:focus {
  border-color:#7baef0;
  outline:none;
  box-shadow:0 0 0 3px rgba(21,115,232,.11);
}
.cleanmode-native .cm-contact .field input[aria-invalid="true"]:not([type="checkbox"]),
.cleanmode-native .cm-contact .field select[aria-invalid="true"],
.cleanmode-native .cm-contact .field textarea[aria-invalid="true"] { border-color:#bf4352; }
.cleanmode-native .cm-contact .topic-chip,
.cleanmode-native .cm-contact .submit { text-transform:none; letter-spacing:normal; }
.cleanmode-native .cm-contact .topic-chip:focus {
  background:var(--pale); color:var(--blue-dark);
}
.cleanmode-native .cm-contact .submit:focus {
  background:var(--blue-dark); color:#fff;
}
.cleanmode-native .cm-contact .topic-chip:focus-visible,
.cleanmode-native .cm-contact .submit:focus-visible {
  outline:3px solid var(--blue); outline-offset:3px;
}
.cleanmode-native .cm-contact .privacy-line input[type="checkbox"]:focus-visible {
  outline:3px solid var(--blue); outline-offset:3px;
}