.contact-page-redesign { --contact-blue: #1261cc; --contact-bright: #1768d5; --contact-ink: #0f172a; --contact-muted: #64748b; --contact-border: #dce4f0; --contact-page: #f5f7fb; background: var(--contact-page); color: var(--contact-ink); overflow: hidden; }
.contact-page-redesign *, .contact-page-redesign *::before, .contact-page-redesign *::after { box-sizing: border-box; }
.contact-page-redesign__hero { position: relative; overflow: hidden; padding: clamp(42px, 6vw, 76px) 0 92px; color: #fff; background: linear-gradient(118deg, #0c48a1 0%, var(--contact-blue) 48%, var(--contact-bright) 100%); }
.contact-page-redesign__hero::before, .contact-page-redesign__hero::after { position: absolute; content: ""; pointer-events: none; }
.contact-page-redesign__hero::before { width: min(74vw, 1080px); height: 480px; top: -315px; right: -30px; border: 1px solid rgba(255,255,255,.15); border-radius: 0 0 0 80%; box-shadow: 0 0 0 48px rgba(255,255,255,.035), 0 0 0 98px rgba(255,255,255,.028); transform: rotate(-6deg); }
.contact-page-redesign__hero::after { width: 370px; height: 100%; top: 0; right: 0; opacity: .42; background-image: radial-gradient(rgba(255,255,255,.7) 1px, transparent 1px); background-position: 0 0; background-size: 12px 12px; mask-image: linear-gradient(90deg, transparent, #000 44%); }
.contact-page-redesign__hero-inner { position: relative; z-index: 1; max-width: 1080px; }
.contact-page-redesign__breadcrumb { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; font-size: 15px; }
.contact-page-redesign__breadcrumb a { color: #fff; }
.contact-page-redesign__breadcrumb a:hover { color: #dbeafe; }
.contact-page-redesign__hero h1 { max-width: 800px; margin: 0; color: #fff; font-size: clamp(2.25rem, 4.3vw, 4rem); font-weight: 700; line-height: 1.13; }
.contact-page-redesign__heading-rule, .contact-page-redesign__panel-rule, .contact-page-redesign__detail-card div > span { display: block; width: 76px; height: 4px; margin-top: 17px; background: currentColor; border-radius: 999px; }
.contact-page-redesign__heading-rule { color: #fff; }
.contact-page-redesign__hero p { max-width: 740px; margin: 18px 0 0; color: #fff; font-size: clamp(15px, 1.4vw, 18px); line-height: 1.75; }
.contact-page-redesign__details { position: relative; z-index: 2; margin-top: -55px; }
.contact-page-redesign__detail-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.contact-page-redesign__detail-card { min-height: 122px; padding: 25px 22px; display: flex; align-items: center; gap: 18px; background: #fff; border: 1px solid var(--contact-border); border-radius: 14px; box-shadow: 0 10px 26px rgba(15, 23, 42, .11); }
.contact-page-redesign__detail-card > i { flex: 0 0 47px; color: var(--contact-bright); font-size: 43px; text-align: center; }
.contact-page-redesign__detail-card h2 { margin: 0; color: var(--contact-ink); font-size: 11px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; }
.contact-page-redesign__detail-card div > span { width: 42px; height: 2px; margin-top: 10px; color: var(--contact-bright); }
.contact-page-redesign__detail-card p { margin: 12px 0 0; color: var(--contact-ink); font-size: 13px; font-weight: 600; line-height: 1.35; }
.contact-page-redesign__detail-card a { color: var(--contact-blue); }
.contact-page-redesign__detail-card a:hover { color: #0a4ba8; text-decoration: underline; }
.contact-page-redesign__content { padding: 36px 0 clamp(40px, 6vw, 76px); }
.contact-page-redesign__panels { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: stretch; }
.contact-page-redesign__panel { min-width: 0; padding: clamp(22px, 3vw, 32px); background: #fff; border: 1px solid var(--contact-border); border-radius: 15px; box-shadow: 0 8px 23px rgba(15, 23, 42, .07); }
.contact-page-redesign__panel-heading { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; }
.contact-page-redesign__heading-icon { width: 46px; height: 46px; flex: 0 0 46px; display: grid; place-items: center; color: var(--contact-bright); background: #eaf2ff; border: 1px solid #d3e4ff; border-radius: 50%; font-size: 22px; }
.contact-page-redesign__panel-heading h2 { margin: 0; color: var(--contact-ink); font-size: clamp(17px, 2vw, 20px); font-weight: 700; }
.contact-page-redesign__panel-rule { width: 42px; height: 3px; margin-top: 8px; color: var(--contact-bright); }
.contact-page-redesign__form { margin: 0; }
.contact-page-redesign__form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.contact-page-redesign .form-group { margin-bottom: 15px; }
.contact-page-redesign .form-group label { display: block; margin-bottom: 7px; color: var(--contact-ink); font-size: 12px; font-weight: 700; }
.contact-page-redesign__optional { color: var(--contact-muted); font-weight: 400; }
.contact-page-redesign .form-control { width: 100%; height: 43px; margin: 0; padding: 9px 14px; color: var(--contact-ink); background: #fff; border: 1px solid #cbd8ea; border-radius: 7px; font-size: 13px; line-height: 1.45; transition: border-color .18s ease, box-shadow .18s ease; }
.contact-page-redesign textarea.form-control { height: 99px; min-height: 99px; resize: vertical; }
.contact-page-redesign .form-control::placeholder { color: #7b879d; opacity: 1; }
.contact-page-redesign .form-control:hover { border-color: #99b9ed; }
.contact-page-redesign .form-control:focus { color: var(--contact-ink); border-color: var(--contact-bright); box-shadow: 0 0 0 3px rgba(23, 104, 213, .14); outline: 0; }
.contact-page-redesign .form-control:invalid:not(:placeholder-shown) { border-color: #dc2626; }
.contact-page-redesign__form-footer { margin-top: 7px; }
.contact-page-redesign__submit { min-height: 44px; padding: 0 24px; display: inline-flex; align-items: center; justify-content: center; gap: 28px; color: #fff; background: var(--contact-blue); border: 1px solid var(--contact-blue); border-radius: 6px; font-family: inherit; font-size: 13px; font-weight: 700; cursor: pointer; transition: background .18s ease, transform .18s ease, box-shadow .18s ease; }
.contact-page-redesign__submit:hover { background: #0c51b1; border-color: #0c51b1; box-shadow: 0 6px 15px rgba(18, 97, 204, .25); transform: translateY(-1px); }
.contact-page-redesign__submit:focus-visible, .contact-page-redesign__faq button:focus-visible, .contact-page-redesign__breadcrumb a:focus-visible, .contact-page-redesign__detail-card a:focus-visible { outline: 3px solid rgba(255,255,255,.85); outline-offset: 3px; }
.contact-page-redesign__faq { overflow: hidden; border: 1px solid #e0e7f1; border-radius: 7px; transition: border-color .2s ease, box-shadow .2s ease; }
.contact-page-redesign__faq + .contact-page-redesign__faq { margin-top: 7px; }
.contact-page-redesign__faq.is-open { border-color: #6ea7ff; box-shadow: 0 4px 14px rgba(18, 97, 204, .08); }
.contact-page-redesign__faq h3 { margin: 0; }
.contact-page-redesign__faq button { width: 100%; min-height: 48px; padding: 13px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--contact-ink); background: #fff; border: 0; font-family: inherit; font-size: 13px; font-weight: 700; line-height: 1.4; text-align: left; cursor: pointer; }
.contact-page-redesign__faq.is-open button { color: var(--contact-blue); }
.contact-page-redesign__faq button i { flex: 0 0 auto; font-size: 16px; transition: transform .2s ease; }
.contact-page-redesign__faq.is-open button i { transform: rotate(180deg); }
.contact-page-redesign__faq [role="region"] { padding: 0 16px 14px; }
.contact-page-redesign__faq [role="region"] p { margin: 0; color: #334155; font-size: 13px; line-height: 1.7; }
.contact-page-redesign__reassurance { margin-top: 18px; display: grid; grid-template-columns: repeat(3, 1fr); overflow: hidden; background: linear-gradient(105deg, #fbfdff, #f1f6ff); border: 1px solid #ccddf6; border-radius: 9px; }
.contact-page-redesign__reassurance article { min-height: 96px; padding: 18px 25px; display: flex; align-items: center; gap: 15px; }
.contact-page-redesign__reassurance article + article { border-left: 1px solid #cfdcf0; }
.contact-page-redesign__reassurance article > span { width: 50px; height: 50px; flex: 0 0 50px; display: grid; place-items: center; color: var(--contact-bright); background: #e8f1ff; border: 1px solid #d5e5fc; border-radius: 50%; font-size: 22px; }
.contact-page-redesign__reassurance h2 { margin: 0 0 4px; color: var(--contact-ink); font-size: 13px; font-weight: 700; }
.contact-page-redesign__reassurance p { margin: 0; color: var(--contact-muted); font-size: 12px; line-height: 1.5; }
@media (max-width: 1199.98px) { .contact-page-redesign__detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .contact-page-redesign__details { margin-top: -38px; } }
@media (max-width: 767.98px) { .contact-page-redesign__hero { padding-bottom: 68px; } .contact-page-redesign__detail-grid, .contact-page-redesign__panels, .contact-page-redesign__form-row, .contact-page-redesign__reassurance { grid-template-columns: 1fr; } .contact-page-redesign__details { margin-top: -31px; } .contact-page-redesign__detail-card { min-height: 108px; } .contact-page-redesign__content { padding-top: 22px; } .contact-page-redesign__reassurance article + article { border-top: 1px solid #cfdcf0; border-left: 0; } }
@media (max-width: 575.98px) { .contact-page-redesign__hero { padding-top: 34px; } .contact-page-redesign__breadcrumb { margin-bottom: 18px; font-size: 13px; } .contact-page-redesign__hero h1 { font-size: clamp(2rem, 11vw, 2.5rem); } .contact-page-redesign__detail-card { padding: 20px 17px; } .contact-page-redesign__panel { padding: 20px 16px; } .contact-page-redesign__submit { width: 100%; } .contact-page-redesign__reassurance article { padding: 17px; } }
@media (prefers-reduced-motion: reduce) { .contact-page-redesign *, .contact-page-redesign *::before, .contact-page-redesign *::after { transition-duration: .01ms !important; } }
