:root {
  --ana: #0891B2; --ana-koyu: #0B6E87; --ana-acik: #E6F4F7; --ana-yazi: #0B4F5F;
  --zemin: #FFFFFF; --zemin2: #F6F9FA; --yuzey: #FFFFFF; --yazi: #10272E; --ikincil: #52686F; --cizgi: #E2EAEC;
  --serit: #0B3440; --kirmizi: #B42318; --kirmizi-z: #FDECEC; --turuncu: #B54708; --turuncu-z: #FEF3E2;
  --yesil: #11643A; --yesil-z: #E8F7EF; --golge: 0 1px 2px rgba(16,39,46,.06), 0 12px 32px rgba(16,39,46,.08);
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--zemin); color: var(--yazi);
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 17px; line-height: 1.6; -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
.kap { max-width: 1140px; margin: 0 auto; padding: 0 20px; }
h1, h2, h3 { line-height: 1.15; letter-spacing: -0.02em; margin: 0; }
h1 { font-size: clamp(34px, 5.2vw, 56px); font-weight: 800; }
h2 { font-size: clamp(28px, 3.6vw, 40px); font-weight: 800; }
h3 { font-size: 19px; font-weight: 700; letter-spacing: -0.01em; }
p { margin: 0; }
.ust-yazi { display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--ana); margin-bottom: 14px; }
.dugme {
  display: inline-flex; align-items: center; gap: 8px; padding: 14px 22px; border-radius: 12px;
  font-weight: 700; font-size: 16px; text-decoration: none; transition: transform .15s ease, background .15s ease;
}
.dugme.birincil { background: var(--ana); color: #fff; }
.dugme.birincil:hover { background: var(--ana-koyu); transform: translateY(-1px); }
.dugme.ikincil { background: var(--yuzey); color: var(--yazi); border: 1px solid var(--cizgi); }
.dugme.ikincil:hover { border-color: var(--ana); }
:focus-visible { outline: 3px solid var(--ana); outline-offset: 3px; border-radius: 8px; }

/* Üst çubuk */
.ust { position: sticky; top: 0; z-index: 10; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--cizgi); }
.ust .kap { display: flex; align-items: center; justify-content: space-between; height: 68px; gap: 16px; }
.marka { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; font-size: 20px; text-decoration: none; letter-spacing: -0.02em; }
.marka b { color: var(--ana); }
.menu { display: flex; align-items: center; gap: 26px; font-size: 15px; font-weight: 600; color: var(--ikincil); }
.menu a { text-decoration: none; }
.menu a:hover { color: var(--yazi); }
.menu .dugme { padding: 10px 16px; font-size: 15px; color: #fff; }

/* Giriş */
.giris { padding: 72px 0 56px; }
.giris .kap { display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center; }
.giris p.alt { font-size: 19px; color: var(--ikincil); margin: 20px 0 30px; max-width: 540px; }
.giris .dugmeler { display: flex; flex-wrap: wrap; gap: 12px; }
.giris .not { margin-top: 22px; font-size: 14px; color: var(--ikincil); display: flex; flex-wrap: wrap; gap: 8px 20px; }
.giris .not span::before { content: "✓ "; color: var(--yesil); font-weight: 800; }

/* Ekran örneği */
.ekran { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 18px; box-shadow: var(--golge); overflow: hidden; }
.ekran-ust { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--cizgi); font-size: 13px; color: var(--ikincil); }
.ekran-ust i { width: 10px; height: 10px; border-radius: 50%; background: var(--cizgi); display: inline-block; }
.ekran-ust span { margin-left: 8px; font-weight: 600; }
.ekran-ic { padding: 16px; }
.sekmeler { display: flex; gap: 4px; padding: 4px; border: 1px solid var(--cizgi); border-radius: 12px; overflow: hidden; margin-bottom: 14px; }
.sekme { display: inline-flex; align-items: center; gap: 6px; padding: 7px 10px; border-radius: 8px; font-size: 13px; font-weight: 600; color: var(--ikincil); white-space: nowrap; }
.sekme b { padding: 0 7px; border-radius: 99px; font-size: 11.5px; background: var(--zemin2); color: var(--yazi); }
.sekme.secili { background: var(--ana-acik); color: var(--ana-yazi); }
.sekme.secili b { background: var(--ana); color: #fff; }
.sekme b.k { background: var(--kirmizi-z); color: var(--kirmizi); }
.sekme b.t { background: var(--turuncu-z); color: var(--turuncu); }
.kart { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; padding: 12px 14px; border: 1px solid var(--cizgi); border-radius: 12px; margin-bottom: 10px; font-size: 14px; }
.kart:last-child { margin-bottom: 0; }
.kart .ad { font-weight: 700; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.plaka { font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: 12px; font-weight: 700; padding: 1px 7px; border: 1.5px solid var(--yazi); border-left: 5px solid var(--ana); border-radius: 4px; }
.kart .sag { text-align: right; font-weight: 700; }
.kart .alt { color: var(--ikincil); font-size: 13px; }
.vade { font-size: 13px; font-weight: 600; text-align: right; }
.vade.y { color: var(--turuncu); }
.vade.b { color: var(--kirmizi); }
.rozet { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 4px; background: var(--ana-acik); color: var(--ana-yazi); }
.ekran-not { font-size: 12px; color: var(--ikincil); text-align: center; padding: 10px 0 2px; }

/* Bölümler */
.bolum { padding: 80px 0; }
.bolum.acik { background: var(--zemin2); border-top: 1px solid var(--cizgi); border-bottom: 1px solid var(--cizgi); }
.baslik { max-width: 720px; margin-bottom: 44px; }
.baslik p { color: var(--ikincil); font-size: 18px; margin-top: 14px; }
.uclu { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.uclu > div { padding: 28px; border-radius: 16px; background: var(--yuzey); border: 1px solid var(--cizgi); }
.uclu h3 { margin: 14px 0 8px; }
.uclu p { color: var(--ikincil); font-size: 16px; }
.ikon { width: 46px; height: 46px; border-radius: 12px; background: var(--ana-acik); color: var(--ana); display: grid; place-items: center; }
.ikon svg { width: 24px; height: 24px; }
.ozellikler { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.ozellik { display: grid; grid-template-columns: 46px 1fr; gap: 16px; padding: 22px; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 16px; }
.ozellik h3 { font-size: 17.5px; margin-bottom: 6px; }
.ozellik p { color: var(--ikincil); font-size: 15.5px; }
.adimlar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; counter-reset: adim; }
.adim { position: relative; padding: 28px 24px 24px; border-radius: 16px; border: 1px solid var(--cizgi); background: var(--zemin2); }
.adim::before { counter-increment: adim; content: counter(adim); display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--ana); color: #fff; font-weight: 800; margin-bottom: 14px; }
.adim p { color: var(--ikincil); font-size: 16px; margin-top: 8px; }
.ikili { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.liste { list-style: none; padding: 0; margin: 24px 0 0; display: grid; gap: 14px; }
.liste li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; color: var(--ikincil); }
.liste li b { color: var(--yazi); font-weight: 700; }
.liste li::before { content: ""; width: 22px; height: 22px; margin-top: 2px; border-radius: 50%; background: var(--yesil-z) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2311643A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/14px no-repeat; }
.telefon { justify-self: center; width: 280px; border-radius: 34px; padding: 10px; background: #FFFFFF; border: 1px solid var(--cizgi); box-shadow: var(--golge); }
.telefon .ekran { border-radius: 26px; border: 1px solid var(--cizgi); box-shadow: none; }
.telefon .ekran-ic { padding: 12px; }
.ozet { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--cizgi); border: 1px solid var(--cizgi); border-radius: 12px; overflow: hidden; margin-bottom: 12px; }
.ozet div { background: var(--yuzey); padding: 10px 12px; }
.ozet span { display: block; font-size: 11.5px; color: var(--ikincil); }
.ozet b { font-size: 16px; }
.kapanis { text-align: center; padding: 88px 0; }
.kapanis .kutu { background: var(--ana-acik); color: var(--yazi); border: 1px solid #CDE8EE; border-radius: 24px; padding: 56px 28px; }
.kapanis h2 { color: var(--yazi); }
.kapanis p { color: var(--ikincil); font-size: 18px; margin: 14px auto 28px; max-width: 560px; }
.kapanis .dugme.ikincil { background: #fff; }
.alt-bilgi { border-top: 1px solid var(--cizgi); padding: 32px 0 44px; color: var(--ikincil); font-size: 14px; }
.alt-bilgi .kap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; }


/* Şirket şeridi */
.sirketler { padding: 36px 0 44px; }
.sirketler p { text-align: center; font-size: 14px; font-weight: 600; color: var(--ikincil); margin-bottom: 18px; }
.cipler { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 10px; }
.cip { font-size: 14px; font-weight: 600; padding: 7px 14px; border-radius: 99px; border: 1px solid var(--cizgi); background: var(--yuzey); color: var(--yazi); white-space: nowrap; }
.cip.ws { border-color: #9ED6E3; background: var(--ana-acik); color: var(--ana-yazi); }
.cip.ws::after { content: " · web servis"; font-weight: 500; font-size: 12px; }
/* Önce / sonra */
.kiyas { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.kiyas > div { border-radius: 16px; padding: 26px; border: 1px solid var(--cizgi); background: var(--yuzey); }
.kiyas h3 { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.kiyas ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; }
.kiyas li { display: grid; grid-template-columns: 22px 1fr; gap: 10px; font-size: 16px; color: var(--ikincil); }
.kiyas .once li::before { content: "✕"; color: var(--kirmizi); font-weight: 800; }
.kiyas .sonra { border-color: #9ED6E3; box-shadow: 0 0 0 4px var(--ana-acik); }
.kiyas .sonra li::before { content: "✓"; color: var(--yesil); font-weight: 800; }
.kiyas .sonra li { color: var(--yazi); }
.etiket { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 99px; }
.etiket.k { background: var(--kirmizi-z); color: var(--kirmizi); }
.etiket.y { background: var(--yesil-z); color: var(--yesil); }
/* Mutabakat örneği */
.tablo { width: 100%; border-collapse: collapse; font-size: 14px; }
.tablo th { text-align: left; font-size: 12px; font-weight: 700; color: var(--ikincil); text-transform: uppercase; letter-spacing: .04em; padding: 8px 10px; border-bottom: 1px solid var(--cizgi); }
.tablo td { padding: 10px; border-bottom: 1px solid var(--cizgi); white-space: nowrap; }
.tablo tr:last-child td { border-bottom: 0; }
.tablo .s { text-align: right; font-variant-numeric: tabular-nums; }
.durum { font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 6px; }
.durum.ok { background: var(--yesil-z); color: var(--yesil); }
.durum.fark { background: var(--turuncu-z); color: var(--turuncu); }
.durum.yok { background: var(--kirmizi-z); color: var(--kirmizi); }
.kaydir { overflow-x: auto; }
.ozet-satir { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
/* SSS */
.sss { max-width: 820px; display: grid; gap: 12px; }
.sss details { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 14px; padding: 0 22px; }
.sss summary { cursor: pointer; list-style: none; padding: 18px 0; font-weight: 700; font-size: 17px; display: flex; justify-content: space-between; gap: 16px; }
.sss summary::-webkit-details-marker { display: none; }
.sss summary::after { content: "+"; color: var(--ana); font-size: 22px; line-height: 1; }
.sss details[open] summary::after { content: "–"; }
.sss details p { color: var(--ikincil); padding: 0 0 18px; font-size: 16px; }
/* Giriş zemini */
.giris { background: radial-gradient(1200px 420px at 85% -10%, #E6F4F7 0%, rgba(230,244,247,0) 60%), #FFFFFF; }
@media (max-width: 900px) { .kiyas { grid-template-columns: 1fr; } }

/* Bir gün */
.gun { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; position: relative; }
.gun > div { position: relative; padding: 24px 22px; border-radius: 16px; border: 1px solid var(--cizgi); background: var(--yuzey); }
.saat { display: inline-block; font-size: 13px; font-weight: 800; color: var(--ana); background: var(--ana-acik); padding: 4px 10px; border-radius: 99px; margin-bottom: 12px; }
.gun h3 { font-size: 17.5px; margin-bottom: 8px; }
.gun p { color: var(--ikincil); font-size: 15.5px; }
@media (max-width: 900px) { .gun { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .gun { grid-template-columns: 1fr; } }

/* Modül gezgini */
.moduller { display: grid; grid-template-columns: 260px 1fr; gap: 24px; align-items: start; }
.modul-liste { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 88px; }
.modul-liste button {
  text-align: left; font: inherit; font-size: 15.5px; font-weight: 600; color: var(--ikincil); cursor: pointer;
  padding: 11px 14px; border-radius: 10px; border: 1px solid transparent; background: transparent;
}
.modul-liste button:hover { background: var(--zemin2); color: var(--yazi); }
.modul-liste button[aria-selected="true"] { background: var(--ana-acik); color: var(--ana-yazi); border-color: #CDE8EE; }
.modul-icerik { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 18px; padding: 30px; box-shadow: var(--golge); min-height: 380px; }
.modul-icerik h3 { font-size: 24px; }
.modul-ozet { color: var(--ana-yazi); font-weight: 600; font-size: 17px; margin-top: 6px; }
.modul-icerik .liste { margin-top: 20px; }
/* Telefonda alt şerit */
.mobil-cta { display: none; }
@media (max-width: 900px) {
  .moduller { grid-template-columns: 1fr; }
  .modul-liste { position: static; flex-direction: row; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; }
  .modul-liste::-webkit-scrollbar { display: none; }
  .modul-liste button { white-space: nowrap; border-color: var(--cizgi); }
  .modul-icerik { padding: 22px; min-height: 0; }
  .mobil-cta { display: flex; position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 20; justify-content: center;
    padding: 14px; border-radius: 14px; background: var(--ana); color: #fff; font-weight: 700; text-decoration: none; box-shadow: 0 10px 30px rgba(8,145,178,.35); }
  .alt-bilgi { padding-bottom: 96px; }
}

/* Gerçek ekran görüntüleri */
.goruntu { margin: 0; background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 16px; overflow: hidden; box-shadow: var(--golge); }
.goruntu img { display: block; width: 100%; height: auto; }
.goruntu figcaption { font-size: 12.5px; color: var(--ikincil); text-align: center; padding: 8px; border-top: 1px solid var(--cizgi); }
.galeri { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }
.galeri-kart { display: block; padding: 0; text-align: left; font: inherit; color: inherit; cursor: zoom-in;
  background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 16px; overflow: hidden; transition: transform .15s ease, box-shadow .15s ease; }
.galeri-kart:hover { transform: translateY(-2px); box-shadow: var(--golge); }
.galeri-kart img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; object-position: top left; border-bottom: 1px solid var(--cizgi); }
.galeri-kart span { display: block; padding: 14px 18px 16px; font-size: 15px; color: var(--ikincil); }
.galeri-kart b { display: block; color: var(--yazi); font-size: 16.5px; margin-bottom: 2px; }
dialog.buyuk { width: min(1200px, 94vw); max-height: 92vh; padding: 0; border: 0; border-radius: 16px; background: var(--yuzey); box-shadow: 0 30px 80px rgba(16,39,46,.35); }
dialog.buyuk::backdrop { background: rgba(16,39,46,.55); }
dialog.buyuk img { display: block; width: 100%; height: auto; }
dialog.buyuk p { margin: 0; padding: 12px 18px; font-weight: 700; border-top: 1px solid var(--cizgi); }
dialog.buyuk .kapat { position: absolute; top: 10px; right: 10px; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--cizgi);
  background: #fff; font-size: 16px; cursor: pointer; }
.telefonlar { justify-self: center; display: flex; gap: 18px; align-items: flex-start; }
.telefon { margin: 0; width: 230px; border-radius: 34px; padding: 9px; background: #fff; border: 1px solid var(--cizgi); box-shadow: var(--golge); }
.telefon img { display: block; width: 100%; height: auto; border-radius: 26px; border: 1px solid var(--cizgi); }
.telefon.kayik { margin-top: 56px; }
@media (max-width: 900px) { .galeri { grid-template-columns: 1fr; } .telefon { width: 46vw; max-width: 230px; } .telefon.kayik { margin-top: 36px; } }
@media (max-width: 900px) {
  .giris { padding: 44px 0 36px; }
  .giris .kap, .ikili { grid-template-columns: 1fr; gap: 40px; }
  .uclu, .adimlar { grid-template-columns: 1fr; }
  .ozellikler { grid-template-columns: 1fr; }
  .menu a:not(.dugme) { display: none; }
  .bolum { padding: 60px 0; }
}
@media (max-width: 480px) {
  body { font-size: 16px; }
  .kap { padding: 0 16px; }
  .ozellik { grid-template-columns: 1fr; gap: 12px; padding: 20px; }
  .kapanis .kutu { padding: 44px 20px; }
  .dugme { width: 100%; justify-content: center; }
  .menu .dugme { width: auto; }
}

/* Giriş: metin ortada, gerçek ekran altında geniş (okunur boyutta) */
.giris .kap { grid-template-columns: 1fr; gap: 44px; text-align: center; }
.giris .kap > div:first-child { max-width: 820px; margin: 0 auto; }
.giris p.alt { margin-left: auto; margin-right: auto; max-width: 660px; }
.giris .dugmeler, .giris .not { justify-content: center; }
.giris .goruntu { max-width: 1100px; width: 100%; margin: 0 auto; }
@media (max-width: 900px) {
  .giris .kap { text-align: left; }
  .giris .dugmeler, .giris .not { justify-content: flex-start; }
  .telefonlar { width: 100%; justify-content: center; gap: 12px; }
  .telefon { width: calc(50% - 6px); padding: 6px; border-radius: 26px; }
  .telefon img { border-radius: 20px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .dugme { transition: none; } }

/* ---- Çok sayfalı site eklemeleri ---- */
.menu a[aria-current="page"] { color: var(--ana); }
.sayfa-bas { padding: 64px 0 40px; background: radial-gradient(1000px 360px at 80% -20%, #E6F4F7 0%, rgba(230,244,247,0) 60%), #fff; border-bottom: 1px solid var(--cizgi); }
.sayfa-bas h1 { font-size: clamp(32px, 4.4vw, 48px); }
.sayfa-bas p { color: var(--ikincil); font-size: 19px; margin-top: 14px; max-width: 720px; }
.devam { display: inline-flex; align-items: center; gap: 6px; margin-top: 28px; font-weight: 700; color: var(--ana); text-decoration: none; }
.devam:hover { text-decoration: underline; }
.paketler { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
.paket { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 20px; padding: 30px; }
.paket.pro { border-color: #9ED6E3; box-shadow: 0 0 0 4px var(--ana-acik), var(--golge); }
.paket h2 { font-size: 28px; display: flex; align-items: center; gap: 10px; }
.paket .rozet-pro { font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 99px; background: var(--ana); color: #fff; letter-spacing: 0; }
.paket > p { color: var(--ikincil); margin: 10px 0 18px; }
.paket h3 { font-size: 14px; text-transform: uppercase; letter-spacing: .06em; color: var(--ikincil); margin: 22px 0 10px; }
.paket .liste { margin-top: 0; gap: 10px; }
.paket .dugme { margin-top: 24px; width: 100%; justify-content: center; }
.ortak { margin-top: 28px; padding: 24px 26px; border-radius: 16px; background: var(--zemin2); border: 1px solid var(--cizgi); color: var(--ikincil); }
.ortak b { color: var(--yazi); }
.iletisim-izgara { display: grid; grid-template-columns: 1.1fr 1fr; gap: 28px; align-items: start; }
.iletisim-kart { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 20px; padding: 30px; box-shadow: var(--golge); }
.iletisim-kart .dugme { width: 100%; justify-content: center; margin-top: 18px; }
.iletisim-kart .e-posta { font-size: 22px; font-weight: 800; color: var(--ana); text-decoration: none; overflow-wrap: anywhere; }
.alt-bilgi { padding: 48px 0 28px; }
.alt-izgara { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 28px; }
.alt-izgara p { margin-top: 10px; max-width: 320px; }
.alt-izgara > div:not(:first-child) { display: flex; flex-direction: column; gap: 8px; }
.alt-izgara b { color: var(--yazi); margin-bottom: 4px; }
.alt-izgara a:not(.marka) { text-decoration: none; color: var(--ikincil); }
.alt-izgara a:not(.marka):hover { color: var(--ana); }
.alt-son { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--cizgi); }
@media (max-width: 900px) {
  .paketler, .iletisim-izgara { grid-template-columns: 1fr; }
  .alt-izgara { grid-template-columns: 1fr 1fr; }
  .alt-izgara > div:first-child { grid-column: 1 / -1; }
  .sayfa-bas { padding: 40px 0 28px; }
}

/* ---- Teklif formu ---- */
.form-izgara { display: grid; grid-template-columns: 1.5fr 1fr; gap: 32px; align-items: start; }
.teklif-formu, .form-tesekkur { grid-column: 1; grid-row: 1; }
.form-yan { grid-column: 2; grid-row: 1; padding: 26px; border-radius: 18px; background: var(--zemin2); border: 1px solid var(--cizgi); }
.form-yan h2 { font-size: 22px; }
.teklif-formu { background: var(--yuzey); border: 1px solid var(--cizgi); border-radius: 20px; padding: 30px; box-shadow: var(--golge); display: grid; gap: 18px; }
.alan { display: grid; gap: 6px; min-width: 0; }
.alan-cift { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.alan-uclu { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.alan label, .secim legend { font-size: 14px; font-weight: 700; color: var(--yazi); }
.alan label b { color: var(--kirmizi); }
.alan input, .alan select, .alan textarea {
  font: inherit; font-size: 16px; color: var(--yazi); background: #fff; width: 100%;
  border: 1px solid #CBD8DB; border-radius: 10px; padding: 11px 13px; transition: border-color .15s, box-shadow .15s;
}
.alan textarea { resize: vertical; min-height: 110px; }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: none; border-color: var(--ana); box-shadow: 0 0 0 3px var(--ana-acik); }
.alan input[aria-invalid="true"] { border-color: var(--kirmizi); box-shadow: 0 0 0 3px var(--kirmizi-z); }
.secim { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.secim legend { margin-bottom: 8px; width: 100%; }
.secim label { cursor: pointer; }
.secim input { position: absolute; opacity: 0; pointer-events: none; }
.secim span { display: inline-block; padding: 9px 16px; border-radius: 99px; border: 1px solid #CBD8DB; font-weight: 600; font-size: 15px; color: var(--ikincil); background: #fff; }
.secim input:checked + span { background: var(--ana-acik); border-color: var(--ana); color: var(--ana-yazi); }
.secim input:focus-visible + span { outline: 3px solid var(--ana); outline-offset: 2px; }
.tuzak { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.gonder { justify-content: center; width: 100%; border: 0; cursor: pointer; font-family: inherit; }
.gonder[disabled] { opacity: .65; cursor: wait; }
.form-hata { margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--kirmizi-z); color: var(--kirmizi); font-weight: 600; font-size: 15px; }
.form-not { margin: 0; font-size: 13px; color: var(--ikincil); }
.form-tesekkur h2 { font-size: 30px; }
.form-tesekkur .dugme { margin-top: 18px; }
@media (max-width: 900px) {
  .form-izgara { grid-template-columns: 1fr; }
  .form-yan { grid-column: 1; grid-row: 2; }
  .alan-uclu { grid-template-columns: 1fr 1fr; }
  .alan-uclu .alan:first-child { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .alan-cift { grid-template-columns: 1fr; }
  .teklif-formu { padding: 22px 18px; }
}

/* İletişim: firma bilgileri */
.firma { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--cizgi); }
.firma address { font-style: normal; color: var(--ikincil); line-height: 1.7; margin-top: 6px; }
.firma address b { color: var(--yazi); }
