/* Hakkımızda ve İletişim — yalnızca /hakkimizda/ sayfasında yüklenir. Ortak öğeler site.css'te. */

.ab-sec { position: relative; overflow: hidden; padding: 104px 0; }
.ab-row { display: flex; gap: 64px; align-items: flex-start; }
.ab-row--end { align-items: flex-end; }
.ab-row--center { align-items: center; }
.ab-row__head { flex: 0.95; }
.ab-row__body { flex: 1.05; }
.ab-row__half { flex: 1; min-width: 0; }
.ab-strong { color: var(--buz); }
.dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; background: var(--tone, var(--duman)); }
.ibadge { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 48px; height: 48px; border-radius: 14px; background: rgba(var(--tone-rgb), 0.16); color: var(--tone); }

/* ---- Giriş ---- */
.ab-hero { position: relative; overflow: hidden; padding: 88px 0 112px;
  background: radial-gradient(circle at 96% -10%, rgba(61, 220, 151, 0.12), transparent 420px),
              radial-gradient(circle at 0% 78%, rgba(125, 185, 240, 0.08), transparent 340px); }
.ab-hero__in { position: relative; display: flex; align-items: center; gap: 72px; }
.ab-hero__text { flex: 1.05; min-width: 0; display: flex; flex-direction: column; gap: 26px; }
.ab-hero__sub { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; letter-spacing: -0.015em; line-height: 1.28; color: var(--zumrut); }
.ab-hero__text .lead { max-width: 540px; }
.ab-hero__sign { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; }
.ab-hero__by { display: inline-flex; align-items: center; gap: 12px; font-size: 15px; color: var(--duman); }
.ab-hero__by svg { width: 36px; height: 36px; }
.ab-hero__art { flex: 0.95; min-width: 0; position: relative; height: 560px; }
.ab-hero__photo { position: absolute; left: 40px; right: 0; top: 0; bottom: 0; margin: 0; border-radius: 24px; overflow: hidden; border: 1px solid #2C3B51; box-shadow: 0 40px 80px rgba(0, 0, 0, 0.5); }
.ab-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 40% 50%; }
.ab-hero__photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15, 23, 32, 0.55), rgba(15, 23, 32, 0) 45%), linear-gradient(0deg, rgba(15, 23, 32, 0.45), rgba(15, 23, 32, 0) 35%); }
.bubs { margin: 0; padding: 0; list-style: none; }
.bub { position: absolute; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 14px 18px; border-radius: 18px 18px 18px 4px; background: rgba(26, 37, 50, 0.92); border: 1px solid rgba(var(--tone-rgb), 0.45); box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45); font-size: 18px; font-weight: 600; white-space: nowrap; }
.bub--1 { left: 0; top: 56px; transform: rotate(-4deg); }
.bub--2 { right: -24px; top: 180px; transform: rotate(3deg); }
.bub--3 { left: 8px; top: 320px; transform: rotate(-2deg); }
.bub--4 { right: 12px; bottom: 40px; transform: rotate(2deg); }

/* ---- Ne yapıyoruz ---- */
.ab-what { padding-top: 72px; background: radial-gradient(circle at 105% 30%, rgba(125, 185, 240, 0.08), transparent 380px); }
.tcards { display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 0; list-style: none; }
.tcard { flex: 1 1 220px; display: flex; flex-direction: column; gap: 10px; padding: 28px; border-radius: 20px;
  background: linear-gradient(150deg, rgba(var(--tone-rgb), 0.13), rgba(var(--tone-rgb), 0.02) 60%), var(--antrasit); border: 1px solid rgba(var(--tone-rgb), 0.28); }
.tcard strong { font-size: 52px; font-weight: 700; letter-spacing: -0.035em; line-height: 1; color: var(--tone); }
.tcard span { font-size: 15px; line-height: 1.45; }

/* ---- Farkımız ---- */
.ab-diff { background: radial-gradient(circle at -4% -8%, rgba(242, 182, 90, 0.08), transparent 380px), var(--derin); border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.ab-diff__cards { flex: 0.8; gap: 16px; }
.qcard { display: flex; flex-direction: column; gap: 12px; padding: 28px; border-radius: 20px; }
.qcard--dash { border: 1px dashed var(--kesik); }
.qcard__q { font-size: 26px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.25; color: var(--duman); }
.qcard__a { font-size: 21px; font-weight: 600; line-height: 1.35; }
.checklist { flex: 1.2; min-width: 0; margin: 0; padding: 0; list-style: none; border-bottom: 1px solid var(--cizgi); }
.checklist li { display: flex; gap: 16px; align-items: flex-start; padding: 18px 0; border-top: 1px solid var(--cizgi); font-size: 18px; line-height: 1.45; }
.cbadge { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 30px; height: 30px; border-radius: 50%; background: rgba(var(--tone-rgb), 0.14); color: var(--tone); }

/* ---- Sekiz usta ---- */
.ab-masters { background: radial-gradient(circle at 40% -12%, rgba(61, 220, 151, 0.08), transparent 440px); }
.swipe-hint { display: none; font-size: 14px; color: var(--duman); }
.masters { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.master { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 14px; padding: 26px; border-radius: 20px; }
.master__no { position: absolute; right: 18px; top: 14px; font-size: 54px; font-weight: 700; letter-spacing: -0.04em; line-height: 1; color: rgba(var(--tone-rgb), 0.16); }
.master__hex { width: 30px; height: 34px; clip-path: polygon(50% 0, 93.3% 25%, 93.3% 75%, 50% 100%, 6.7% 75%, 6.7% 25%); background: var(--tone); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: var(--gece); }
.master__head { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.master h3 { font-size: 21px; font-weight: 700; letter-spacing: -0.015em; }
.mtag { font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: rgba(147, 161, 177, 0.12); color: var(--duman); }
.mtag--nobel { background: rgba(125, 185, 240, 0.14); color: var(--gok); }
.master p { flex: 1; font-size: 15px; line-height: 1.55; color: var(--duman); }
.master__topic { padding-top: 12px; border-top: 1px solid rgba(var(--tone-rgb), 0.25); font-size: 14px; font-weight: 600; color: var(--tone); }

/* ---- Amacımız ---- */
.ab-purpose { border-top: 1px solid var(--cizgi); background: radial-gradient(circle at 100% 72%, rgba(125, 185, 240, 0.08), transparent 380px); }
.ab-photo { position: relative; margin: 0; aspect-ratio: 16 / 10; border-radius: 24px; overflow: hidden; border: 1px solid #2C3B51; box-shadow: 0 30px 70px rgba(0, 0, 0, 0.45); }
.ab-photo img { width: 100%; height: 100%; object-fit: cover; }
.ab-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(15, 23, 32, 0.35), rgba(15, 23, 32, 0) 40%); }
.mv { display: flex; gap: 16px; }
.mv > div { flex: 1; display: flex; flex-direction: column; gap: 12px; padding: 32px; border-radius: 22px; }
.mv p { font-size: 22px; font-weight: 600; letter-spacing: -0.01em; line-height: 1.38; }
.values { display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 0; list-style: none; }
.values li { flex: 1 1 240px; display: flex; flex-direction: column; gap: 14px; padding: 28px; border-radius: 20px; }
.values strong { font-size: 20px; font-weight: 600; }
.values span:not(.ibadge) { font-size: 15px; line-height: 1.5; color: var(--duman); }

/* ---- Adımız ---- */
.ab-name-sec { padding: 0 0 104px; }
.ab-name { position: relative; overflow: hidden; display: flex; align-items: center; gap: 56px; padding: 56px; border-radius: 28px; border: 1px solid var(--cizgi);
  background: linear-gradient(120deg, rgba(61, 220, 151, 0.10), rgba(125, 185, 240, 0.06) 55%, var(--antrasit)); }
.ab-name__mark { position: absolute; right: -70px; top: -60px; width: 360px; height: 360px; opacity: 0.07; pointer-events: none; }
.ab-name__mark svg { width: 100%; height: 100%; }
.ab-name__logo { flex-shrink: 0; width: 168px; height: 168px; border-radius: 26px; background: var(--gece); border: 1px solid var(--cizgi); display: flex; align-items: center; justify-content: center; box-shadow: 0 24px 50px rgba(0, 0, 0, 0.4); }
.ab-name__logo svg { width: 112px; height: 112px; }
.ab-name .stack { position: relative; max-width: 720px; gap: 16px; }
.ab-name__t { font-size: clamp(26px, 3vw, 38px); font-weight: 700; letter-spacing: -0.025em; line-height: 1.12; }

/* ---- İletişim ---- */
.ab-contact { padding: 112px 0; background: radial-gradient(circle at 0% 80%, rgba(61, 220, 151, 0.10), transparent 400px), radial-gradient(circle at 106% -10%, rgba(125, 185, 240, 0.08), transparent 400px), var(--derin); border-top: 1px solid var(--cizgi); }
.ab-contact .ab-row { position: relative; }
.ab-contact__left { flex: 0.8; gap: 24px; }
.ab-contact__left .lead { max-width: 430px; }
.mailcard { display: flex; align-items: center; gap: 16px; padding: 20px; border-radius: 18px; }
.mailcard__text { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.mailcard__text a { font-size: 16px; font-weight: 600; color: var(--buz); text-decoration: none; overflow-wrap: anywhere; }
.mailcard__text a:hover { color: var(--zumrut); }
.mailcard__copy { position: relative; margin-left: auto; flex-shrink: 0; width: 44px; height: 44px; border-radius: 10px; border: 1px solid var(--cizgi); background: rgba(15, 23, 32, 0.5); color: var(--duman); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.mailcard__copy:hover { color: var(--buz); border-color: var(--kenar); }
.mailcard__done { position: absolute; right: 0; top: calc(100% + 8px); white-space: nowrap; font: 600 12px var(--font); color: var(--zumrut); }
.mailcard__done:empty { display: none; }

.cform { flex: 1.2; min-width: 0; position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 22px; padding: 40px; border-radius: 24px;
  background: linear-gradient(160deg, #1E2B3A, var(--antrasit) 45%); border: 1px solid #2C3B51; box-shadow: 0 40px 90px rgba(0, 0, 0, 0.45); }
.cform::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: linear-gradient(90deg, var(--zumrut), var(--gok) 60%, var(--kehribar)); }
.cform__head { display: flex; flex-direction: column; gap: 6px; }
.cform__head h3 { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.cform__row { display: flex; gap: 16px; }
.cform__row .field { flex: 1; min-width: 0; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-size: 14px; font-weight: 600; }
.field__labrow { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.field__count { font-size: 13px; color: var(--duman); font-variant-numeric: tabular-nums; }
.field__count.is-near { color: var(--kehribar); }
.field__wrap { position: relative; display: block; }
.field__icon { position: absolute; left: 15px; top: 50%; transform: translateY(-50%); color: var(--duman); pointer-events: none; }
.field input, .field textarea { width: 100%; border-radius: 12px; background: var(--gece); border: 1px solid var(--kenar); color: var(--buz); font: 500 16px/1.5 var(--font); }
.field input { min-height: 54px; padding: 0 16px 0 46px; }
.field textarea { min-height: 176px; padding: 14px 16px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: #6F7E8F; }
.field input:focus, .field textarea:focus { outline: 2px solid var(--gok); outline-offset: 1px; border-color: transparent; }
.field [aria-invalid="true"] { border-color: var(--mercan); }
.field__hint { font-size: 13px; color: var(--duman); }
.field__err { display: flex; align-items: center; gap: 6px; font-size: 13px; color: var(--mercan); }
.field__err:empty { display: none; }
.cform__alert { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; font-size: 14px; line-height: 1.5; }
.cform__alert[hidden] { display: none; }
.cform__alert--hata { background: rgba(242, 130, 111, 0.10); border: 1px solid rgba(242, 130, 111, 0.4); }
.cform__alert--bilgi { background: rgba(242, 182, 90, 0.09); border: 1px solid rgba(242, 182, 90, 0.4); }
.cform__alert--tamam { background: rgba(61, 220, 151, 0.10); border: 1px solid rgba(61, 220, 151, 0.4); }
.cform__alert a { font-weight: 600; }
.cform__send { width: 100%; box-shadow: 0 12px 30px rgba(61, 220, 151, 0.25); }
.cform__send[disabled] { opacity: 0.7; cursor: progress; }
.cform__note { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 12px; background: rgba(15, 23, 32, 0.6); border: 1px solid var(--cizgi); }
.cform__note svg { flex-shrink: 0; margin-top: 2px; }
.cform__note p { font-size: 13px; line-height: 1.55; color: var(--duman); }
.cform__noscript { font-size: 14px; color: var(--kehribar); }
/* Bot tuzağı: ekranda ve ekran okuyucuda görünmez; yalnızca otomatik doldurucular doldurur. */
.hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* ---- KVKK ---- */
.ab-kvkk { background: radial-gradient(circle at 106% -8%, rgba(125, 185, 240, 0.08), transparent 420px); }
.ksteps { display: flex; flex-wrap: wrap; gap: 16px; margin: 0; padding: 0; list-style: none; }
.ksteps li { flex: 1 1 220px; display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: 20px; }
.kstep__top { display: flex; align-items: center; justify-content: space-between; }
.ksteps .ibadge { width: 46px; height: 46px; border-radius: 13px; }
.kstep__no { font-size: 30px; font-weight: 700; color: rgba(var(--tone-rgb), 0.35); }
.ksteps strong { font-size: 18px; font-weight: 600; }
.ksteps li > span:last-child { font-size: 15px; line-height: 1.5; color: var(--duman); }
.kvkk-note { display: flex; flex-direction: column; gap: 8px; padding: 22px 26px; border-radius: 18px; border: 1px dashed var(--kesik); font-size: 15px; line-height: 1.55; }
.kvkk-note strong { font-weight: 600; }
.kvkk-note__soon { font-size: 13px; }

/* ---- Çağrı ---- */
.ab-cta-sec { padding: 0 0 112px; }
.ab-cta { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 56px 64px; border-radius: 28px;
  background: linear-gradient(120deg, rgba(61, 220, 151, 0.22), rgba(125, 185, 240, 0.12) 50%, rgba(242, 182, 90, 0.10)), var(--antrasit);
  border: 1px solid rgba(61, 220, 151, 0.35); box-shadow: 0 40px 90px rgba(0, 0, 0, 0.4); }
.ab-cta__mark { position: absolute; right: 30%; top: -80px; width: 300px; height: 300px; opacity: 0.08; pointer-events: none; }
.ab-cta__mark svg { width: 100%; height: 100%; }
.ab-cta__text { position: relative; display: flex; flex-direction: column; gap: 14px; max-width: 640px; }
.ab-cta__t { font-size: clamp(30px, 3.6vw, 46px); font-weight: 700; letter-spacing: -0.03em; line-height: 1.06; }
.ab-cta__btn { position: relative; flex-shrink: 0; min-height: 58px; padding: 0 30px; font-size: 18px; box-shadow: 0 14px 34px rgba(61, 220, 151, 0.3); }

/* ---- Duyarlı düzen ---- */
@media (max-width: 1100px) {
  .masters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .ab-row, .ab-hero__in, .mv, .ab-cta, .ab-name, .cform__row { flex-direction: column; align-items: stretch; gap: 28px; }
  /* Alt alta dizilince esnek oranlar yüksekliği sıfırlamasın */
  .ab-row > *, .ab-hero__in > *, .mv > *, .cform__row > * { flex: none; }
  .bub--2 { right: 0; }
}
@media (max-width: 760px) {
  .ab-sec, .ab-contact { padding: 72px 0; }
  .ab-hero { padding: 40px 0 64px; }
  .ab-hero__art { height: 440px; }
  .ab-hero__photo { left: 16px; }
  .bub { padding: 10px 14px; font-size: 15px; }
  .bub--2 { right: 0; }
  .bub--3 { top: 250px; }
  .swipe-hint { display: block; }
  /* Sekiz usta: yana kaydırılan şerit */
  .masters { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 0 calc(-1 * var(--pad)); padding: 0 var(--pad) 12px; scrollbar-width: none; }
  .masters::-webkit-scrollbar { display: none; }
  .masters > li { flex: 0 0 82%; scroll-snap-align: start; }
  .ab-name-sec, .ab-cta-sec { padding-bottom: 72px; }
  .ab-name { padding: 28px; }
  .ab-cta { padding: 32px 24px; }
  .ab-cta__btn { width: 100%; }
  .cform { padding: 24px; }
  .mv p { font-size: 19px; }
}
/* Bot koruması (Cloudflare Turnstile): çoğu zaman görünmez; yalnızca gerekirse kutucuk belirir */
.cform__ts { display: flex; justify-content: center; }
.cform__ts[hidden] { display: none; }