/* kurumsal.css: scplojistik.com.tr (kurumsal/; SPEC-kurumsal-site-08). Token disi deger yok.
   Panelin belirtecleri (shared.css) ve bilesenleri (card, btn, st, banner) ic sayfalarda kullanilir;
   sitenin kimligi (logo laciverti + turkuazi, Barlow Condensed basliklar, yol cizgisi imzasi) asagidaki
   --s-* belirteclerindedir (ana sayfa revizyonu 22.10; scp-ui tanitim standardi). Betik yok: menu
   telefonda <details>, hareket yalniz CSS (kaydirma zaman cizelgesi @supports ile). */

@font-face {
  font-family: 'Barlow Condensed';
  src: url('../fonts/barlow-condensed-latin-600.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Barlow Condensed';
  src: url('../fonts/barlow-condensed-latin-ext-600.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

.site {
  /* Renk: notr taban + tek vurgu (logo turkuazi). Lacivert blok zemini ve murekkeptir. */
  --s-lacivert:    #09162F;
  --s-lacivert-2:  #13254A;
  --s-turkuaz:     #0EA4BB;
  --s-vurgu:       #0B93A8;
  --s-vurgu-hover: #2DB3C7;
  --s-vurgu-metin: #076C7B;
  --s-zemin:       #F4F7F9;
  --s-zemin-2:     #E9EEF2;
  --s-kagit:       #FCFDFE;
  --s-murekkep:    #0F1B33;
  --s-soluk:       #4B5870;
  --s-cizgi:       #D5DDE5;
  --s-buz:         #E8EEF6;
  --s-buz-soluk:   #A8B6CB;
  --s-golge:       rgb(9 22 47 / 0.10);
  --s-golge-derin: 0 24px 48px -24px rgb(9 22 47 / 0.45);
  /* Tip: baslik Barlow Condensed (karayolu levhasindan dogan grotesk), govde sistem. */
  --s-font-baslik: 'Barlow Condensed', 'Arial Narrow', 'Roboto Condensed', sans-serif;
  --s-fs-dev:   clamp(48px, 6.4vw, 96px);
  --s-fs-buyuk: clamp(40px, 4.8vw, 72px);
  --s-fs-h2:    clamp(32px, 3.4vw, 52px);
  --s-fs-h3:    24px;
  --s-fs-govde: 18px;
  /* Bosluk: 4px merdiveni; ic 4-16, kutu 24/40/64, makro 96/128. */
  --s-g-kutu-1: 24px;
  --s-g-kutu-2: 40px;
  --s-g-kutu-3: 64px;
  --s-g-makro-1: 96px;
  --s-g-makro-2: 128px;
  --s-kenar: clamp(16px, 4vw, 64px);
  --s-kap: 1240px;
  --s-ust-h: 72px;
  /* Yaricap olcegi: dugme 4, cerceve 12, kart 8. */
  --s-r-dugme: 4px;
  --s-r-kart: 8px;
  --s-r-cerceve: 12px;
  /* Hareket (hareket-standardi 2.3). */
  --dur-mikro: 150ms;
  --dur-temel: 300ms;
  --dur-genis: 450ms;
  --dur-sahne: 700ms;
  --ease-giris: cubic-bezier(0.05, 0.7, 0.1, 1.0);
  --ease-cikis: cubic-bezier(0.3, 0.0, 0.8, 0.15);
  --ease-durum: cubic-bezier(0.2, 0.0, 0.0, 1.0);
  --s-odak: var(--s-vurgu-metin);

  margin: 0;
  background: var(--s-zemin);
  color: var(--s-murekkep);
  font-family: var(--font-ui);
  font-size: var(--fs-16);
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
}
.site * { box-sizing: border-box; }
.site a { color: var(--s-vurgu-metin); text-underline-offset: 0.18em; }
.site a.btn { text-decoration: none; }
.site a.btn-primary { color: var(--on-brand); }
.site a.btn-secondary { color: var(--text); }
.site :focus-visible { outline: 3px solid var(--s-odak); outline-offset: 3px; box-shadow: none; border-radius: var(--r-xs); }
/* Ogeler :where ile sifir ozgulukte: sinif kurallari (alt bilgi, kart) bunlari ezer. */
:where(.site) h1, :where(.site) h2 { font-family: var(--s-font-baslik); font-weight: 600; letter-spacing: 0.005em; }
:where(.site) h1 { margin: 0 0 var(--sp-3); font-size: var(--fs-48); line-height: 1.05; }
:where(.site) h2 { margin: var(--sp-8) 0 var(--sp-4); font-size: var(--fs-36); line-height: 1.1; }
:where(.site) h3 { margin: 0; font-size: var(--fs-18); line-height: var(--lh-tight); }
:where(.site) p { margin: 0 0 var(--sp-3); }

.site-atla { position: absolute; z-index: 30; inset-inline-start: var(--sp-4); inset-block-start: calc(-1 * var(--sp-16)); }
.site-atla:focus { inset-block-start: var(--sp-2); background: var(--s-kagit); padding: var(--sp-2) var(--sp-3); }

.site-dar { max-inline-size: calc(var(--s-kap) + 2 * var(--s-kenar)); margin-inline: auto; padding-inline: var(--s-kenar); }
.site-metin { max-inline-size: calc(var(--measure) + 2 * var(--s-kenar)); }

/* ---- Imza: yol cizgisi (seritteki kesik cizgi) ve dugmeler ---- */
.s-yol {
  display: inline-block; inline-size: var(--s-g-kutu-2); block-size: 3px;
  background: repeating-linear-gradient(90deg, currentColor 0 12px, transparent 12px 20px);
  color: var(--s-turkuaz); vertical-align: middle;
}
.s-dugme {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-block-size: var(--sp-12); padding: var(--sp-3) var(--s-g-kutu-1);
  border-radius: var(--s-r-dugme); font-size: var(--fs-16); font-weight: 600; line-height: 1.2;
  text-decoration: none; white-space: nowrap;
}
.site a.s-dugme-birincil { background: var(--s-vurgu); color: var(--s-lacivert); }
.site a.s-dugme-birincil:hover { background: var(--s-vurgu-hover); }
.site a.s-dugme-birincil:active { background: var(--s-turkuaz); }
.s-dugme .icon { transition: transform var(--dur-mikro) var(--ease-durum); }
.s-dugme-kucuk { min-block-size: 40px; padding: var(--sp-2) var(--sp-4); font-size: var(--fs-15); }
.s-bag {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-block-size: var(--sp-12); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px;
}
.s-bag::after {
  content: ''; inline-size: 14px; block-size: 2px; background: currentColor;
  transition: transform var(--dur-mikro) var(--ease-durum); transform-origin: left;
}
@media (hover: hover) and (pointer: fine) {
  .s-dugme:hover .icon { transform: translateX(4px); }
  .s-bag:hover::after { transform: scaleX(1.6); }
}

/* ---- Ust bant ---- */
.site-ust {
  position: sticky; inset-block-start: 0; z-index: 20;
  background: var(--s-kagit); border-block-end: 1px solid var(--s-cizgi);
}
.site-ust::after {
  content: ''; position: absolute; inset-inline: 0; inset-block-start: 100%; block-size: var(--sp-3);
  background: linear-gradient(var(--s-golge), transparent); opacity: 0; pointer-events: none;
}
.site-ust-ic {
  display: flex; align-items: center; gap: var(--s-g-kutu-1);
  max-inline-size: calc(var(--s-kap) + 2 * var(--s-kenar)); margin-inline: auto;
  min-block-size: var(--s-ust-h); padding-inline: var(--s-kenar);
}
.site-marka { display: inline-flex; align-items: center; color: var(--s-murekkep); text-decoration: none; }
.site .site-marka { color: var(--s-murekkep); text-decoration: none; }
.site-marka-logo { display: block; block-size: var(--sp-10); inline-size: auto; }
.site-menu { display: flex; flex-wrap: wrap; gap: var(--sp-6); margin-inline-start: auto; }
.site .site-menu a, .site .site-menu-dar nav a { position: relative; color: var(--s-murekkep); text-decoration: none; font-weight: 500; }
.site .site-menu a::after {
  content: ''; position: absolute; inset-inline: 0; inset-block-end: calc(-1 * var(--sp-1)); block-size: 2px;
  background: var(--s-turkuaz); transform: scaleX(0); transform-origin: left;
  transition: transform var(--dur-temel) var(--ease-durum);
}
.site .site-menu a[aria-current='page']::after { transform: scaleX(1); }
@media (hover: hover) and (pointer: fine) {
  .site .site-menu a:hover::after { transform: scaleX(1); }
}
.site-ust-cagri { flex: none; }
.site-menu-dar { display: none; margin-inline-start: auto; }
.site-menu-dar summary {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-block-size: var(--sp-12); padding-inline: var(--sp-3);
  border: 1px solid var(--s-cizgi); border-radius: var(--s-r-dugme);
  cursor: pointer; list-style: none; font-weight: 600;
}
.site-menu-dar summary::-webkit-details-marker { display: none; }
.site-menu-dar nav {
  position: absolute; inset-inline: 0; inset-block-start: var(--s-ust-h);
  display: flex; flex-direction: column;
  background: var(--s-kagit); border-block-end: 1px solid var(--s-cizgi); box-shadow: var(--shadow-menu);
}
.site-menu-dar nav a { display: flex; align-items: center; min-block-size: var(--sp-12); padding-inline: var(--s-kenar); border-block-start: 1px solid var(--s-cizgi); }
.site .site-menu-dar nav a[aria-current='page'] { color: var(--s-vurgu-metin); }
@supports (animation-timeline: scroll()) {
  .site-ust::after {
    animation: s-golge-gel linear both;
    animation-timeline: scroll(root);
    animation-range: 0 64px;
  }
}
@keyframes s-golge-gel { to { opacity: 1; } }

/* ---- Bolumler (ic sayfalar) ---- */
.site-icerik { display: block; }
.site-giris { padding-block: var(--sp-16) var(--sp-12); background: var(--s-kagit); border-block-end: 1px solid var(--s-cizgi); }
.site-giris-alt { font-size: var(--fs-18); color: var(--s-soluk); max-inline-size: var(--measure); }
.site-dugmeler { display: flex; flex-wrap: wrap; gap: var(--sp-3); margin-block: var(--sp-5) var(--sp-4); }
.site-bolum { padding-block: var(--s-g-kutu-2); }
.site-bolum > .site-dar > h2:first-child { margin-block-start: 0; }
.site-bolum-acik { background: var(--s-kagit); border-block: 1px solid var(--s-cizgi); }
.site-kartlar { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, var(--w-panel)), 1fr)); gap: var(--sp-4); }
.site-cagri { text-align: center; }
.site-cagri p { margin-inline: auto; }
.sayfa-bas { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); margin-block-end: var(--sp-3); }
.sayfa-bas h1 { margin: 0; }
.madde p, .urun-karti p { margin: var(--sp-2) 0 0; color: var(--s-soluk); }
.urun-karti h3 a { color: var(--s-murekkep); }
.sss-soru { padding-block: var(--sp-4); border-block-end: 1px solid var(--s-cizgi); }
.sss-soru h2 { margin: 0 0 var(--sp-2); font-size: var(--fs-24); }
.sss-soru p:last-child { margin-block-end: 0; }
.iletisim-kunye { margin-block-start: var(--sp-5); }

/* ---- Fiyat karti ---- */
.fiyat-karti { display: flex; flex-direction: column; gap: var(--sp-3); }
.fiyat-karti-bas { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--sp-2); }
.fiyat-tutar { margin: 0; font-size: var(--fs-24); font-weight: 700; }
.fiyat-donem { font-size: var(--fs-15); font-weight: 500; color: var(--muted); }
.fiyat-moduller { display: flex; flex-direction: column; gap: var(--sp-1); margin: 0; padding: 0; list-style: none; }
.fiyat-moduller li { display: flex; align-items: center; gap: var(--sp-2); }
.fiyat-moduller .icon { color: var(--ok-text); }
.fiyat-karti .btn { align-self: flex-start; margin-block-start: auto; }
.site-kartlar + .muted { margin-block-start: var(--sp-3); }

/* ---- Alt bilgi: lacivert blok ---- */
/* Ust: solda imza (isaret + ad + bir cumle + iletisim), sagda uc sutun; dip: sirket kunyesi ve PayTR.
   Liste baglari alti cizgisiz (gezinme listesi), uzerine gelince cizgi; metin icindeki bag cizgili. */
.site-alt {
  --s-odak: var(--s-turkuaz);
  margin-block-start: var(--s-g-makro-1); padding-block: var(--s-g-kutu-3) var(--s-g-kutu-2);
  background: var(--s-lacivert); color: var(--s-buz-soluk); font-size: var(--fs-15);
}
.site-ana .site-alt { margin-block-start: 0; }
.site-alt-ic { max-inline-size: calc(var(--s-kap) + 2 * var(--s-kenar)); margin-inline: auto; padding-inline: var(--s-kenar); }
.site-alt-ust {
  display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr);
  gap: var(--s-g-kutu-2) var(--s-g-kutu-3); padding-block-end: var(--s-g-kutu-2);
}
.site-alt-imza { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-4); max-inline-size: 34ch; }
.site-alt-imza p { margin: 0; }
.site .site-alt a.site-alt-marka { gap: var(--sp-3); text-decoration: none; }
.site-alt-isaret {
  display: inline-grid; place-items: center; inline-size: var(--sp-10); block-size: var(--sp-10);
  border-radius: var(--s-r-kart); background: var(--s-kagit);
}
.site-alt-ad { font-family: var(--s-font-baslik); font-weight: 600; font-size: var(--fs-28); line-height: 1; color: var(--s-buz); }
.site-alt-iletisim { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.site-alt-iletisim li { display: flex; align-items: center; gap: var(--sp-2); }
.site-alt-iletisim .icon { color: var(--s-turkuaz); }
.site-alt-sutunlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-g-kutu-1); }
.site-alt-sutunlar nav { display: flex; flex-direction: column; align-items: flex-start; }
.site-alt-sutunlar h2 {
  margin: 0 0 var(--sp-3); font-family: var(--font-ui); font-size: var(--fs-13); font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--s-turkuaz);
}
.site .site-alt a { display: inline-flex; align-items: center; min-block-size: var(--sp-8); color: var(--s-buz); }
.site .site-alt-sutunlar a, .site .site-alt-iletisim a {
  color: var(--s-buz-soluk); text-decoration: none; transition: color var(--dur-mikro) var(--ease-durum);
}
.site .site-alt-sutunlar a:hover, .site .site-alt-iletisim a:hover {
  color: var(--s-buz); text-decoration: underline; text-underline-offset: var(--sp-1);
}
.site-alt-dip {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start;
  gap: var(--sp-3) var(--s-g-kutu-2); padding-block-start: var(--s-g-kutu-1);
  border-block-start: 1px solid var(--s-lacivert-2); font-size: var(--fs-13);
}
.site-alt-dip p { margin: 0; }
.site-alt-sirket { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-4); max-inline-size: 80ch; }
.site-alt-odeme { display: flex; align-items: center; gap: var(--sp-2); max-inline-size: 60ch; }

@media (max-width: 960px) {
  .site-alt-ust { grid-template-columns: minmax(0, 1fr); }
  .site-alt-sutunlar { grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); }
}
@media (max-width: 600px) {
  .site-alt-sutunlar nav:last-child { grid-column: 1 / -1; }
}

@media (max-width: 960px) {
  .site-menu { display: none; }
  .site-menu-dar { display: block; }
  .site-ust-ic { gap: var(--sp-3); }
}
@media (max-width: 760px) {
  :where(.site) h1 { font-size: var(--fs-36); }
  .site-giris { padding-block: var(--sp-10) var(--sp-8); }
}
.site-menu-dar nav a.site-menu-cagri { justify-content: center; margin: var(--sp-4) var(--s-kenar); border: 0; }
@media (max-width: 520px) {
  .site-marka-logo { block-size: var(--sp-8); }
  .site-ust-cagri { display: none; }
}

/* ---- Odeme (IS-1022): paket ve fatura formu, kart formu ---- */
.odeme-formu fieldset { margin: 0; min-inline-size: 0; display: flex; flex-direction: column; gap: var(--sp-4); }
.odeme-formu .odeme-baslik { padding: 0; font-size: var(--fs-18); font-weight: 700; }
.odeme-formu label { font-weight: 500; }
.odeme-paket { display: flex; align-items: flex-start; gap: var(--sp-3); padding: var(--sp-3); border: 1px solid var(--border); border-radius: var(--r-sm); cursor: pointer; }
.odeme-paket:has(input:checked) { border-color: var(--sel-line); background: var(--sel-tint); }
.odeme-paket input { margin-block-start: var(--sp-1); }
.odeme-formu .row-sub { display: block; color: var(--muted); font-size: var(--fs-14); font-weight: 400; }
.odeme-formu .sk-opt { display: flex; align-items: flex-start; gap: var(--sp-2); }
.odeme-formu .row { display: flex; align-items: center; gap: var(--sp-3); }
.odeme-formu .grow { flex: 1; }
.odeme-formu .muted .icon { inline-size: var(--icon-sm); block-size: var(--icon-sm); vertical-align: text-bottom; }

/* ---- Blog ve icerik sayfalari (Anayasa Madde 20) ---- */
.konum ol { display: flex; flex-wrap: wrap; gap: var(--sp-1) var(--sp-2); margin: 0 0 var(--sp-4); padding: 0; list-style: none; font-size: var(--fs-14); color: var(--muted); }
.konum li + li::before { content: "›"; margin-inline-end: var(--sp-2); color: var(--muted); }
.konum a { color: var(--muted); }
.blog-bas { justify-content: space-between; }
.blog-bas h2 { margin: 0; }
.blog-kategoriler { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-block: var(--sp-4) var(--sp-6); }
.blog-kategoriler a {
  display: inline-flex; align-items: center; gap: var(--sp-2);
  min-block-size: var(--m-target); padding-inline: var(--sp-3);
  border: 1px solid var(--border-strong); border-radius: var(--r-sm);
  color: var(--text); text-decoration: none; font-weight: 500;
}
.blog-kategoriler a[aria-current='page'] { border-color: var(--sel-line); background: var(--sel-tint); }
.yazi-karti { display: flex; flex-direction: column; gap: var(--sp-2); }
.yazi-karti h3 a { color: var(--text); }
.yazi-karti p { margin: 0; color: var(--muted); }
.yazi-kategori { font-size: var(--fs-14); font-weight: 600; text-decoration: none; }
.yazi-kunye { font-size: var(--fs-14); color: var(--muted); }
.blog-yerlesim { padding-block: var(--sp-8); }
.blog-yazi { max-inline-size: var(--measure); }
.blog-yazi-bas h1 { margin-block: var(--sp-2) var(--sp-3); }
.blog-kisaca { margin-block: var(--sp-6); padding: var(--sp-4) var(--sp-5); background: var(--bg-card); border: 1px solid var(--border); border-inline-start: var(--sp-1) solid var(--brand); border-radius: var(--r-sm); }
.blog-kisaca h2, .blog-icindekiler h2 { margin: 0 0 var(--sp-2); font-size: var(--fs-18); }
.blog-kisaca ul { margin: 0; padding-inline-start: var(--sp-5); }
.blog-kisaca li + li { margin-block-start: var(--sp-1); }
.blog-icindekiler { margin-block: var(--sp-6); }
.blog-icindekiler ol { margin: 0; padding-inline-start: var(--sp-5); }
.blog-govde h2 { scroll-margin-block-start: var(--sp-4); }
.blog-govde h3 { margin: var(--sp-6) 0 var(--sp-2); scroll-margin-block-start: var(--sp-4); }
.blog-govde ul, .blog-govde ol { margin: 0 0 var(--sp-4); padding-inline-start: var(--sp-5); }
.blog-govde li + li { margin-block-start: var(--sp-1); }
.blog-govde code { font-family: var(--font-mono); font-size: var(--fs-14); }
.blog-not { margin: 0 0 var(--sp-4); padding: var(--sp-3) var(--sp-4); background: var(--info-soft); border: 1px solid var(--border); border-radius: var(--r-sm); }
.blog-not p { margin: 0; }
.blog-tablo { overflow-x: auto; margin-block-end: var(--sp-4); }
.blog-cagri { margin-block: var(--sp-8); max-inline-size: var(--measure); }
.blog-cagri h2 { margin-block-start: 0; }
.blog-ilgili { margin-block: var(--sp-8); }

/* Azaltilmis hareket: durum aninda degisir, hicbir gecis oynamaz (hareket-standardi 6.2). */
@media (prefers-reduced-motion: reduce) {
  .site *, .site *::before, .site *::after { transition: none !important; }
}