/* Intranet TR — contact experience, V6.3. No third-party dependencies. */
.contact-page { overflow: clip; background: #f6f9fd; }
.contact-hero { position: relative; isolation: isolate; background: linear-gradient(120deg,#0e203c 0%,#172f55 58%,#1d4166 100%); color:#fff; padding: 76px 0 134px; }
.contact-hero::before { content:""; position:absolute; inset:0; z-index:-1; opacity:.35; background: radial-gradient(ellipse 460px 300px at 82% 12%,#168e94 0%,transparent 72%), radial-gradient(ellipse 480px 250px at 20% 100%,#1b487f 0%,transparent 72%); }
.contact-hero::after { content:""; position:absolute; width:450px; height:450px; border:1px solid rgba(255,255,255,.07); border-radius:50%; right:-120px; top:-150px; pointer-events:none; }
.contact-breadcrumb { color:#b6c8df; font-size:13px; display:flex; align-items:center; gap:10px; margin-bottom:34px; }
.contact-breadcrumb a:hover { color:#fff; }
.contact-breadcrumb span { opacity:.6; }
.contact-hero-grid { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr); align-items:center; gap:70px; }
.contact-hero .eyebrow { color:#7be3d2; }
.contact-hero h1 { max-width:710px; font-size:clamp(40px,5vw,65px); line-height:1.1; margin:19px 0 20px; letter-spacing:-.055em; }
.contact-hero h1 em { font-style:normal; color:#78e2d0; }
.contact-hero .intro { color:#c4d4e6; font-size:17px; max-width:560px; line-height:1.8; }
.contact-pills { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; }
.contact-pill { display:inline-flex; align-items:center; gap:8px; border:1px solid rgba(255,255,255,.2); border-radius:100px; padding:9px 13px; color:#e6eff9; font-size:12px; font-weight:650; background:rgba(255,255,255,.055); }
.contact-pill svg { width:16px; height:16px; stroke:#81e7d6; }
.contact-hero-art { width:min(100%,350px); margin-left:auto; aspect-ratio:1; display:grid; place-items:center; position:relative; }
.contact-art-ring { position:absolute; border:1px solid rgba(255,255,255,.16); border-radius:50%; inset:2%; }
.contact-art-ring:nth-child(2) { inset:15%; border-style:dashed; border-color:rgba(125,224,208,.33); }
.contact-art-center { width:155px; height:155px; border-radius:36px; display:grid; place-items:center; background:linear-gradient(145deg,#1da89d,#076e83); box-shadow:0 20px 80px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.3); transform:rotate(-8deg); }
.contact-art-center svg { width:76px; height:76px; stroke:#fff; stroke-width:1.3; transform:rotate(8deg); }
.contact-art-dot { position:absolute; width:54px; height:54px; display:grid; place-items:center; border-radius:17px; background:#fff; color:#0b9b87; box-shadow:0 18px 40px rgba(0,0,0,.18); }
.contact-art-dot svg { width:25px; height:25px; stroke:currentColor; }
.contact-art-dot.one { top:9%; left:12%; transform:rotate(-12deg); }
.contact-art-dot.two { bottom:13%; right:5%; transform:rotate(12deg); }
.contact-main { position:relative; z-index:2; margin-top:-74px; padding-bottom:88px; }
.contact-grid { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr); gap:25px; align-items:start; }
.contact-panel { background:#fff; border:1px solid #e2eaf4; border-radius:22px; box-shadow:0 24px 65px rgba(12,37,71,.09); padding:clamp(24px,3vw,42px); }
.contact-panel-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.contact-panel h2 { font-size:clamp(26px,3vw,33px); margin:9px 0 12px; letter-spacing:-.045em; }
.contact-panel .section-desc { color:#647590; font-size:14px; line-height:1.8; margin:0 0 27px; }
.contact-panel .eyebrow { font-size:11px; }
.contact-heading-icon { flex:0 0 49px; width:49px; height:49px; display:grid; place-items:center; border-radius:14px; color:#0b9b87; background:#e7f7f4; }
.contact-heading-icon svg { width:24px; height:24px; stroke:currentColor; }
.contact-form { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.contact-field { display:flex; flex-direction:column; gap:8px; min-width:0; }
.contact-field.wide { grid-column:1 / -1; }
.contact-field label { font-size:13px; font-weight:750; color:#263c5b; }
.contact-field label span { color:#0a8f80; }
.contact-field input:not([type="checkbox"]),.contact-field select,.contact-field textarea { width:100%; min-height:49px; padding:12px 14px; border:1px solid #dbe4ee; border-radius:11px; background:#f9fbfe; color:#142544; outline:none; transition:border-color .18s,box-shadow .18s; font-size:14px; }
.contact-field textarea { min-height:126px; resize:vertical; }
.contact-field input:not([type="checkbox"]):focus,.contact-field select:focus,.contact-field textarea:focus { border-color:#0b9b87; box-shadow:0 0 0 3px rgba(11,155,135,.11); background:#fff; }
.contact-field input::placeholder,.contact-field textarea::placeholder { color:#9aa9bd; }
.contact-consent { display:flex; align-items:flex-start; gap:11px; font-size:12px; color:#61728b; line-height:1.7; margin:2px 0 0; }
.contact-consent input { margin-top:4px; accent-color:#0b9b87; }
.contact-consent a { color:#087f72; font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.contact-submit { display:flex; flex-wrap:wrap; gap:13px; align-items:center; margin-top:1px; }
.contact-submit .btn { min-height:52px; }
.contact-submit-note { color:#8795a9; font-size:11px; max-width:310px; }
.contact-preview { border:1px solid #e3eaf3; border-radius:11px; background:#f3f7fc; padding:12px 14px; color:#5b6c84; font-size:12px; line-height:1.6; margin-top:22px; }
.contact-preview strong { color:#263d60; }
.contact-status { margin-top:13px; padding:12px 14px; border-radius:10px; background:#fff6e6; color:#805615; font-size:13px; }
.contact-side { display:grid; gap:20px; }
.contact-side-card { padding:30px; background:#fff; border:1px solid #e2eaf4; border-radius:20px; box-shadow:0 12px 35px rgba(12,37,71,.045); }
.contact-side-card h3 { font-size:20px; margin:0 0 11px; }
.contact-side-card > p { font-size:14px; color:#667792; line-height:1.75; }
.contact-feature { display:flex; gap:14px; padding:18px 0; border-top:1px solid #edf1f6; }
.contact-feature:first-of-type { margin-top:20px; }
.contact-feature-icon { flex:0 0 43px; width:43px; height:43px; border-radius:12px; display:grid; place-items:center; background:#eef6fc; color:#1c628c; }
.contact-feature-icon svg { width:21px; height:21px; stroke:currentColor; }
.contact-feature h4 { font-size:14px; margin:0 0 4px; }
.contact-feature p { margin:0; font-size:12px; color:#75849b; line-height:1.65; }
.contact-side-card.dark { color:#fff; background:linear-gradient(145deg,#152a4d,#203e65); border-color:#203e65; position:relative; overflow:hidden; }
.contact-side-card.dark::after { content:""; position:absolute; width:160px; height:160px; right:-70px; bottom:-90px; border:32px solid rgba(255,255,255,.035); border-radius:50%; }
.contact-side-card.dark .eyebrow { color:#8ee9d9; }
.contact-side-card.dark p { color:#c1d0e1; }
.contact-side-card.dark .btn { margin-top:10px; background:#fff; color:#173353; }
.contact-side-card.dark .btn:hover { background:#e6faf6; }
.contact-faq { padding-top:83px; }
.contact-faq-header { text-align:center; max-width:650px; margin:0 auto 33px; }
.contact-faq-header h2 { margin:12px 0; font-size:clamp(28px,3.4vw,42px); }
.contact-faq-header p { color:#667792; font-size:15px; }
.contact-faq-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.contact-faq-item { background:#fff; border:1px solid #e2eaf4; border-radius:16px; padding:25px; }
.contact-faq-item h3 { font-size:16px; line-height:1.4; margin:0 0 12px; }
.contact-faq-item p { color:#687994; font-size:13px; margin:0; }
@media(max-width:950px) { .contact-hero-grid { gap:24px; } .contact-grid { grid-template-columns:1fr; } .contact-side { grid-template-columns:1fr 1fr; } .contact-hero { padding-bottom:125px; } }
@media(max-width:720px) { .contact-hero { padding:45px 0 112px; } .contact-hero-grid { grid-template-columns:1fr; } .contact-hero-art { display:none; } .contact-main { margin-top:-66px; } .contact-panel { border-radius:18px; } .contact-form { grid-template-columns:1fr; } .contact-side { grid-template-columns:1fr; } .contact-faq-grid { grid-template-columns:1fr; } .contact-faq { padding-top:55px; } }
@media(max-width:390px) { .contact-panel { padding:20px; } .contact-panel-heading { gap:8px; } .contact-heading-icon { display:none; } .contact-side-card { padding:23px; } }

/* Keep icon dimensions predictable inside buttons and inline links. */
.contact-submit .btn svg,
.contact-side-card.dark .btn svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

.contact-feature:hover h4 {
  color: var(--teal-dark);
}

/* V6.3.2 — Contact form: scope text fields so native checkboxes are never stretched. */
.contact-form .contact-field input:not([type="checkbox"]),
.contact-form .contact-field select,
.contact-form .contact-field textarea {
  width: 100%;
}

.contact-form .contact-consent {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 12px;
  width: 100%;
  padding: 14px 16px;
  margin: 0;
  border: 1px solid #dce8e8;
  border-radius: 12px;
  background: #f6fbfa;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.65;
  color: #435873;
}

.contact-form .contact-consent input[type="checkbox"] {
  display: block;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  max-width: 18px;
  max-height: 18px;
  padding: 0;
  margin: 2px 0 0;
  border: 1px solid #8da7b4;
  border-radius: 4px;
  background: #fff;
  box-shadow: none;
  accent-color: #0b9b87;
  appearance: auto;
}

.contact-form .contact-consent > span {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  color: #435873;
  font-weight: 400;
  overflow-wrap: anywhere;
}

.contact-form .contact-consent a {
  color: #087f72;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.contact-form .contact-submit {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.contact-form .contact-submit .btn:disabled {
  opacity: 1;
  cursor: not-allowed;
  background: #e8eef4;
  color: #516680;
  box-shadow: none;
  border: 1px solid #d8e1ea;
}

.contact-form .contact-submit-note {
  font-size: 12px;
  color: #647590;
  line-height: 1.5;
}

.contact-form input:disabled,
.contact-form select:disabled,
.contact-form textarea:disabled {
  opacity: 1;
  cursor: not-allowed;
  background: #f7f9fc;
  color: #647590;
}

@media (max-width: 480px) {
  .contact-form .contact-consent { padding: 12px; }
  .contact-form .contact-submit .btn { width: 100%; justify-content: center; }
}

/* V6.3.3 — Contact numbers displayed before secondary information. */
.contact-direct-card {
  background: linear-gradient(145deg, #ffffff, #f3fbfa);
  border-color: #cce9e4;
}
.contact-direct-card .eyebrow { color: #0b897d; font-size: 11px; letter-spacing: .12em; }
.contact-direct-card h3 { margin: 12px 0 9px; font-size: 23px; letter-spacing: -.035em; }
.contact-direct-card > p { margin: 0 0 22px; }
.contact-direct-link {
  display: flex; align-items: center; gap: 15px;
  padding: 15px; margin-top: 11px; border-radius: 14px;
  border: 1px solid #d9e8ed; background: #fff;
  text-decoration: none; transition: border-color .18s, transform .18s, box-shadow .18s;
}
.contact-direct-link:hover { border-color: #0b9b87; transform: translateY(-2px); box-shadow: 0 9px 22px rgb(11 155 135 / 10%); }
.contact-direct-link:focus-visible { outline: 3px solid #0b9b87; outline-offset: 3px; }
.contact-direct-icon {
  display: grid; place-items: center; flex: 0 0 46px;
  width: 46px; height: 46px; border-radius: 12px;
  background: #e5f6f2; color: #087e74;
}
.contact-direct-icon svg { width: 23px; height: 23px; }
.contact-direct-content { display: grid; gap: 3px; min-width: 0; }
.contact-direct-label { color: #697d92; font-size: 12px; }
.contact-direct-content strong { color: #152a4d; font-size: clamp(16px, 2vw, 19px); letter-spacing: .005em; }
@media (max-width: 390px) { .contact-direct-link { gap: 10px; padding: 12px; } .contact-direct-icon { flex-basis: 40px; width: 40px; height: 40px; } }
