.contact-hub {
  --hub-mint: #e5eee3;
  --hub-lilac: #eee8fa;
  --hub-sand: #faf0d8;
  --hub-rose: #f2e4e8;
  --hub-muted: #526269;
  --hub-radius: 18px;
  background: var(--biltek-paper);
  color: var(--biltek-ink);
  font: 400 16px/1.6 Volte, sans-serif;
}
.contact-hub * { box-sizing: border-box; }
.contact-hub :is(h1, h2, h3, p, dl, dd, ol) { margin: 0; font-family: inherit; color: inherit; }
.contact-hub :is(h1, h2, h3, p) { font-weight: 400; }
.contact-hub a { color: inherit; text-decoration: none; }
.contact-hub :is(a, button, input):focus-visible { outline: 2px solid var(--biltek-action-green); outline-offset: 3px; }
.contact-hub h1 { font-size: clamp(42px, 6.8vw, 94px); line-height: 1.03; letter-spacing: -.045em; }
.contact-hub h2 { font-size: clamp(28px, 4vw, 54px); line-height: 1.12; letter-spacing: -.035em; }
.contact-hub h3 { font-size: 21px; line-height: 1.25; letter-spacing: -.015em; }
.hub-wrap {
  width: calc(100% - 40px);
  max-width: 1440px;
  margin-inline: auto;
  padding-block: clamp(20px, 3vw, 46px) clamp(48px, 7vw, 100px);
}
.hub-kicker {
  display: block;
  margin-bottom: 14px;
  font-size: 11px;
  letter-spacing: .12em;
  line-height: 1.5;
}
.hub-navigation {
  display: flex;
  flex-wrap: wrap;
  gap: 4px clamp(12px, 3vw, 36px);
  margin-bottom: 16px;
}
.hub-navigation a {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: 14px;
  color: var(--hub-muted);
}
.hub-navigation a:is([aria-current], :hover) { color: var(--biltek-ink); }
.hub-navigation a:is([aria-current], :hover)::after {
  position: absolute;
  inset: auto 0 5px;
  height: 1px;
  background: var(--biltek-action-green);
  content: "";
}
.hub-heading {
  display: grid;
  align-items: center;
  gap: 28px;
  padding: clamp(24px, 5.2vw, 76px);
  border-radius: var(--hub-radius);
}
.hub-heading-copy { min-width: 0; }
.hub-heading-copy p {
  max-width: 42ch;
  margin-top: clamp(14px, 2vw, 24px);
  font-size: clamp(16px, 1.6vw, 20px);
  color: var(--hub-muted);
}
.contact-hub--destek .hub-heading { background: var(--hub-mint); }
.contact-hub--muhasebe .hub-heading {
  background: var(--hub-sand);
  padding-block: clamp(28px, 4vw, 56px);
}
.contact-hub--kariyer .hub-heading { background: var(--hub-rose); }
.hub-erp-link, .hub-text-link {
  display: inline-flex;
  gap: 12px;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  min-height: 44px;
}
.hub-erp-link svg, .hub-text-link svg {
  width: 19px;
  height: 19px;
  flex: none;
}
.hub-erp-link {
  margin-top: 22px;
  padding: 10px 18px;
  border-radius: 32px;
}
.hub-text-link {
  overflow-wrap: anywhere;
  text-decoration: underline !important;
  text-decoration-color: var(--biltek-line) !important;
  text-underline-offset: 5px;
}
.hub-text-link:hover { text-decoration-color: currentColor !important; }
.hub-erp-art {
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 18px;
  padding: clamp(18px, 3vw, 34px);
  border: 1px solid var(--biltek-line);
  border-radius: 14px;
  background: var(--biltek-logo-ink);
}
.hub-erp-art img, .hub-team-art img { display: block; max-width: 100%; height: auto; }
.hub-erp-logo { width: 139px; }
.hub-erp-illustration { width: min(100%, 330px); }
.hub-team-art img {
  width: min(100%, 340px);
  max-height: clamp(150px, 28vw, 320px);
  margin-inline: auto;
  object-fit: contain;
}
.hub-route-grid { display: grid; gap: 12px; margin-block: 16px 0; }
.hub-route {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  min-width: 0;
  padding: clamp(16px, 2.4vw, 30px);
  border-radius: 14px;
  transition: background-color .2s, box-shadow .2s;
}
.hub-route--destek { background: var(--hub-mint); }
.hub-route--muhasebe { background: var(--hub-sand); }
.hub-route--kariyer { background: var(--hub-lilac); }
.hub-route:is(:hover, :focus-visible) { box-shadow: inset 0 0 0 1px var(--biltek-ink); }
.hub-route-icon, .hub-route-arrow { display: flex; align-items: center; }
.hub-route-arrow { transition: transform .2s; }
.hub-route:hover .hub-route-arrow { transform: translateX(3px); }
.hub-route-copy { display: grid; gap: 5px; }
.hub-route-copy strong { font-size: clamp(19px, 2vw, 25px); font-weight: 400; line-height: 1.2; }
.hub-route-copy > span { color: var(--hub-muted); font-size: 14px; line-height: 1.5; }

.hub-contact-layout, .hub-career, .hub-support, .hub-accounting, .hub-office {
  display: grid;
  gap: clamp(20px, 4vw, 56px);
  margin-top: clamp(42px, 7vw, 100px);
}
.hub-direct dl { margin-top: 24px; }
.hub-direct dl > div {
  padding-block: 10px;
  border-top: 1px solid var(--biltek-line);
}
.hub-direct dt, .hub-bank dt { color: var(--hub-muted); font-size: 13px; font-weight: 400; }
.hub-direct dd a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-size: clamp(18px, 2.2vw, 29px);
  overflow-wrap: anywhere;
}
.hub-direct dd a:hover { text-decoration: underline; text-underline-offset: 5px; }
.hub-social { display: flex; flex-wrap: wrap; gap: 0 16px; border-top: 1px solid var(--biltek-line); padding-top: 8px; }
.hub-social a { display: inline-flex; align-items: center; min-height: 44px; gap: 4px; font-size: 13px; }
.hub-social a:hover { text-decoration: underline; text-underline-offset: 4px; }
.hub-social svg { width: 13px; height: 13px; }
.hub-form-panel {
  container-type: inline-size;
  container-name: hub-form-panel;
  min-width: 0;
  padding: clamp(16px, 3.7vw, 42px);
  border: 1px solid var(--biltek-line);
  border-radius: var(--hub-radius);
  background: var(--biltek-control-surface);
}
.hub-form-panel h2 { font-size: clamp(27px, 3vw, 40px); margin-bottom: 24px; scroll-margin-top: 36px; }
.hub-field-grid { display: grid; gap: 16px 18px; }
.hub-field-grid > label { display: block; }
.hub-field-grid > label > span { color: var(--biltek-control-muted); }
.hub-form :is(input:not([type=hidden], [type=checkbox]), select, textarea) {
  display: block;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin-top: 8px;
  padding: 10px 13px;
  font-size: 16px;
  line-height: 1.45;
}
.hub-form textarea { resize: vertical; }
.hub-file > span { display: block; margin-top: 6px; font-size: 13px; }
.hub-file input::file-selector-button {
  margin-inline-end: 8px;
  padding: 4px 8px;
  border: 1px solid var(--biltek-control-line);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.hub-action-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 10px;
  margin-top: 20px;
}
.hub-action-row > .hub-captcha { display: contents; }
.contact-hub .hub-form .hub-action-row > .hub-submit {
  grid-column: 1 / -1;
  justify-self: end;
  margin-inline-start: 0;
  max-width: 100%;
}
.hub-captcha > .captcha {
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
  width: 100%;
  padding: 0;
  margin: 0;
}
.hub-captcha > .captcha:first-child { border: 1px solid var(--biltek-control-line); }
.hub-captcha img { display: block; width: 100%; height: 38px; object-fit: contain; }
.hub-captcha a { position: absolute; top: 50%; display: grid; place-items: center; transform: translateY(-50%); }
.hub-captcha a svg { width: 22px !important; height: 22px; }
.hub-captcha .captcha input { margin: 0; padding-inline: 10px; font-size: clamp(11px, 3vw, 15px); }
.hub-consent { display: flex; gap: 10px; margin-top: 10px; align-items: center; min-height: 44px; font-size: 13px; line-height: 1.5; }
.hub-consent input { appearance: auto; flex: none; width: 18px; height: 18px; margin: 0; }
.hub-consent a { text-decoration: underline; text-underline-offset: 3px; }
.hub-form button:disabled { opacity: .6; cursor: wait; }
.contact-hub .hub-result { margin-top: 14px; font-size: 14px; white-space: pre-line; }
.hub-result:empty { display: none; }
.hub-result.is-error, .hub-copy-result.is-error { color: var(--biltek-control-error); }
.hub-result.is-success, .hub-copy-result.is-success { color: var(--biltek-control-success); }

.hub-office {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  padding: clamp(12px, 2.8vw, 30px);
  border: 1px solid var(--biltek-line);
  border-radius: var(--hub-radius);
  background: #eaf1f1;
  color: var(--biltek-logo-ink);
}
.hub-office-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 9px 20px;
  padding: 3px 2px;
}
.hub-office-copy h1 { font-size: clamp(26px, 3vw, 42px); }
.hub-office-copy .hub-office-location { margin-top: 5px; color: var(--hub-muted); font-size: 14px; }
.hub-office-copy .hub-text-link {
  padding: 7px 12px;
  border: 1px solid #cedddd;
  border-radius: 8px;
  background: #fff;
  text-decoration: none !important;
}
.hub-office-copy .hub-text-link:hover { border-color: #66816a; background: #f2f6ef; }
.hub-map {
  min-width: 0;
  height: clamp(235px, 28vw, 330px);
  overflow: hidden;
  border: 1px solid #d3dfdf;
  border-radius: 9px;
  background: #dce8e7;
}
.hub-map iframe { display: block; width: 100%; height: 100%; border: 0; }

.hub-support-intro p, .hub-career-intro p { max-width: 42ch; margin-top: 16px; color: var(--hub-muted); }
.hub-support-steps { display: grid; list-style: none; padding: 0; }
.hub-support-steps li {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 14px;
  padding-block: 16px;
  border-top: 1px solid var(--biltek-line);
}
.hub-support-steps li > span {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--hub-mint);
  font-size: 13px;
  font-variant-numeric: tabular-nums;
}
.hub-support-steps p { margin-top: 4px; color: var(--hub-muted); }
.hub-support-phone, .hub-accounting-contact {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0 20px;
  padding: 12px clamp(16px, 3vw, 30px);
  border-radius: 12px;
  background: var(--hub-mint);
}
.hub-support-phone > span { font-size: 14px; }

.hub-accounting { margin-top: clamp(16px, 3vw, 32px); }
.hub-bank-list { display: grid; gap: 16px; }
.hub-bank {
  min-width: 0;
  padding: clamp(16px, 3vw, 36px);
  border: 1px solid var(--biltek-line);
  border-radius: var(--hub-radius);
  background: var(--biltek-control-surface);
}
.hub-bank-name { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; padding-bottom: 14px; border-bottom: 1px solid var(--biltek-line); }
.hub-bank-name img { object-fit: contain; }
.hub-bank-name h2 { font-size: clamp(24px, 3vw, 35px); }
.hub-bank dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }
.hub-bank dl > div:nth-child(-n+2) { grid-column: 1 / -1; }
.hub-bank dd { overflow-wrap: anywhere; }
.hub-bank-iban {
  min-width: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: var(--biltek-control-soft);
}
.hub-bank-iban dd { display: flex; align-items: center; flex-wrap: wrap; gap: 0 12px; justify-content: space-between; }
.hub-bank-iban dd > span { font-size: clamp(16px, 1.6vw, 21px); font-variant-numeric: tabular-nums; user-select: all; }
.hub-copy {
  min-height: 44px;
  padding: 0 10px;
  border: 1px solid var(--biltek-control-line);
  border-radius: var(--biltek-field-radius);
  background: var(--biltek-control-surface);
  color: var(--biltek-control-ink);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.hub-copy { margin-inline-start: auto; }
.hub-copy:hover { border-color: var(--biltek-control-action); }
.contact-hub .hub-copy-result { font-size: 14px; }
.contact-hub .hub-copy-result:not(:empty) { margin-top: 10px; }
.hub-accounting-contact { background: var(--hub-sand); }
.hub-accounting-contact h2 { font-size: 22px; }
.hub-accounting-contact > div { display: flex; flex-wrap: wrap; gap: 0 20px; }

@media (min-width: 600px) {
  .hub-wrap { width: calc(100% - 64px); }
}
@media (min-width: 740px) {
  .hub-heading { grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr); gap: clamp(28px, 6vw, 94px); }
  .contact-hub--muhasebe .hub-heading { grid-template-columns: minmax(0, 1fr); }
  .contact-hub--muhasebe .hub-heading-copy { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); column-gap: 32px; align-items: end; }
  .contact-hub--muhasebe .hub-kicker { grid-column: 1 / -1; }
  .contact-hub--muhasebe .hub-heading-copy p { margin-top: 0; }
  .hub-route-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hub-route { grid-template-columns: minmax(0, 1fr) auto; }
  .hub-route-icon { grid-column: 1 / -1; }
  .hub-support { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
  .hub-support-phone { grid-column: 1 / -1; }
  .hub-bank-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 950px) {
  .hub-wrap { width: calc(100% - 120px); }
  .hub-contact-layout, .hub-career { grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); }
  .hub-route { grid-template-columns: auto minmax(0, 1fr) auto; }
  .hub-route-icon { grid-column: auto; }
}
@media (max-width: 360px) {
  .hub-navigation { display: grid; grid-template-columns: max-content max-content; column-gap: 20px; }
  .hub-navigation a { justify-self: start; }
}
@media (max-width: 390px) {
  .hub-bank-iban dd { gap: 6px; }
  .hub-action-row { gap: 6px; }
}
@container hub-form-panel (min-width: 420px) {
  .hub-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hub-field-full { grid-column: 1 / -1; }
}
@container hub-form-panel (min-width: 520px) {
  .hub-action-row--captcha { grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(100px, .8fr); }
  .contact-hub .hub-form .hub-action-row--captcha > .hub-submit {
    grid-column: auto;
    width: 100%;
    min-width: 0;
  }
  .hub-captcha .captcha input { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .hub-route, .hub-route-arrow { transition: none; }
  .hub-route:hover .hub-route-arrow { transform: none; }
}

.hub-erp-art {
  padding: clamp(8px, 2vw, 24px);
  background: #06263b;
}
.hub-support-art { display: block; width: 100%; max-width: 390px; height: auto; }
