/* ==========================================================================
   Servist Servis: stil dosyası (TASARIM-SISTEMI.md, "Grafit ve kehribar")

   Kimlik: KOYU grafit zemin (#0E1013), grafit kart (#161A1F). Tek vurgu:
   kehribar (#F5A524); birincil düğmenin yazısı kehribarın üstünde koyu
   (#17120A). Başlık ve sayı: Saira Condensed 700. Gövde: Atkinson Hyperlegible
   Next. Köşe dili YUVARLAK: düğme ve girdi 6 px, kart 10 px, çip 4 px. Kesik
   köşe (chamfer) YOK. Gölge yalnız açılır katmanda.
   Sınıf öneki: sts-   Belirteç öneki: --sts-
   Türkçe: text-transform: uppercase hiçbir yerde yok (İ/I).

   Bölümler (TASARIM-SISTEMI.md ile aynı sırada): yazı dosyaları, belirteçler,
   taban, kart ve bölüm başı, üst çubuk ve menü, düğme, plaka ve cihaz, iş
   kartı, kod karosu, form, uyarı, açılış, mobil alt çubuk, altbilgi, harita.
   ========================================================================== */

/* --- 00 Yazı dosyaları (CSP: font-src 'self'; Saira Condensed 700 (başlık, kod, sayı) ve Atkinson Hyperlegible Next
       (gövde, değişken 200–800). Google Fonts'tan indirildi; latin + latin-ext alt kümesi: İ Ş Ğ ı ç ö ü dahil) ----- */
@font-face {
  font-family: "Saira Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/saira-condensed-700-latin-ext.eafa5cfe7025.woff2") format("woff2");
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Saira Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/saira-condensed-700-latin.2404371c2d3f.woff2") format("woff2");
  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: "Atkinson Hyperlegible Next";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/atkinson-hyperlegible-next-400-latin-ext.592a99bc98c0.woff2") format("woff2");
  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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("../fonts/atkinson-hyperlegible-next-400-latin.fe43d3268c0a.woff2") format("woff2");
  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;
}

/* --- 01 Belirteçler ------------------------------------------------------ */
:root {
  color-scheme: light;

  /* renk: açık yüzeyler, lacivert mürekkep, turuncu vurgu (TASARIM-SISTEMI §01; kontrastlar hesaplı) */
  --sts-beyaz: #ffffff;
  --sts-celik: #f2f5fa;
  --sts-celik-2: #e9eef6;
  --sts-celik-3: #dce3ef;
  --sts-grafit: #0c1d4f;
  --sts-metin: #334063;
  --sts-gri: #4f5b78;
  --sts-gri-2: #5e6a86;
  --sts-cizgi-ince: #e4e9f2;
  --sts-cizgi: #d3dbe8;
  --sts-cizgi-sert: #7c88a3;
  --sts-ember: #be400b;
  --sts-ember-bas: #9f3606;
  --sts-ember-ust: #ffffff;
  --sts-ember-acik: #fff1e7;
  --sts-ember-isik: #fb8a3c;
  --sts-yesil: #1d6b48;

  /* lacivert yüzeyler: başlık bandı, yanıt kartı, altbilgi */
  --sts-sayfa: #f4f6fb;
  --sts-lacivert: #0b1a47;
  --sts-lacivert-2: #13297a;
  --sts-kraliyet: #1d3fa6;
  --sts-gece: #060f2e;
  --sts-acik-yazi: #d6def2;
  --sts-acik-gri: #aebbdb;
  --sts-gr-lacivert: linear-gradient(140deg, #071338 0%, #0e2468 46%, #1d3fa6 100%);
  --sts-gr-ember: linear-gradient(135deg, #dd520b 0%, #be400b 55%, #a63807 100%);
  --sts-golge-1: 0 1px 2px rgba(11, 26, 71, 0.05), 0 10px 28px -14px rgba(11, 26, 71, 0.22);
  --sts-golge-2: 0 2px 8px rgba(11, 26, 71, 0.06), 0 26px 56px -24px rgba(11, 26, 71, 0.34);
  --sts-parilti: 0 12px 30px -10px rgba(221, 82, 11, 0.6);
  --sts-r-hap: 999px;

  --sts-r: 12px;                 /* radius: düğme, girdi, etiket */
  --sts-r-kart: 20px;           /* kart, plaka, panel */
  --sts-r-kucuk: 8px;           /* çip, kod karosu */

  /* yazı aileleri */
  --sts-f-baslik: "Saira Condensed", "Arial Narrow", ui-sans-serif, system-ui, sans-serif;
  --sts-f-govde: "Atkinson Hyperlegible Next", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --sts-f-sayi: "Saira Condensed", ui-sans-serif, system-ui, sans-serif;
  --sts-f-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* yazı ölçeği (mobil → masaüstü akışkan). Saira Condensed köşeli ve dar omuzlu. */
  --sts-y-dev: clamp(3rem, 2.1rem + 4.2vw, 5.5rem);
  --sts-y-manset: clamp(2.25rem, 1.6rem + 3vw, 4rem);
  --sts-y-1: clamp(1.875rem, 1.45rem + 1.8vw, 2.875rem);
  --sts-y-2: clamp(1.375rem, 1.2rem + 0.9vw, 2rem);
  --sts-y-3: clamp(1.125rem, 1.07rem + 0.25vw, 1.25rem);
  --sts-y-giris: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem);
  --sts-y-govde: 1.0625rem;     /* 17 px Atkinson Hyperlegible Next */
  --sts-y-kucuk: 0.9375rem;     /* 15 px */
  --sts-y-etiket: 0.8125rem;    /* 13 px: plaka etiketi (Saira Condensed 700) */

  /* yerleşim */
  --sts-sutun: 12;
  --sts-oluk: 16px;
  --sts-kap: 1280px;
  --sts-okuma: 720px;
  --sts-yan: 340px;             /* yan plaka (≥1080 px), yapışkan değil */

  /* boşluk (8 tabanlı, 4 yarım adım) */
  --sts-a1: 4px;
  --sts-a2: 8px;
  --sts-a3: 12px;
  --sts-a4: 16px;
  --sts-a5: 24px;
  --sts-a6: 32px;
  --sts-a7: 48px;
  --sts-a8: 64px;
  --sts-a9: 96px;
  --sts-kenar: 16px;
  --sts-bolum: 56px;

  /* biçim: yuvarlak köşe (border-radius); kesik köşe YOK */
  --sts-kil-kalinlik: 1px;
  --sts-vurgu-kalinlik: 2px;
  --sts-ust-boy: 64px;
  --sts-hat-boy: 64px;

  /* hareket: kısa, doğrusal (ölçü aleti) */
  --sts-sure: 160ms;
  --sts-egri: cubic-bezier(0.4, 0, 0.2, 1);

  /* ikon maskeleri (renk currentColor ile; ince kalem 1,6 px, KARE uç, sivri birleşim) */
  --sts-m-ok: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M9.5 6l6 6-6 6'/%3E%3C/svg%3E");
  --sts-m-sag: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M3 12h16'/%3E%3Cpath d='M14 7l5 5-5 5'/%3E%3C/svg%3E");
  --sts-m-asagi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  --sts-m-onay: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.1' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M4 12.5 9 17.5 20 6.5'/%3E%3C/svg%3E");
  --sts-m-ara: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M8 4h5l3 3v5l-3 3H8l-3-3V7z'/%3E%3Cpath d='M16.2 16.2 20 20'/%3E%3C/svg%3E");
  --sts-m-tel: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M5 4h3.5l1.5 4-2 1.5 6.5 6.5 1.5-2 4 1.5V19l-1.5 1.5C10.5 20 4 13.5 3.5 5.5z'/%3E%3C/svg%3E");
  --sts-m-bilgi: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M8.5 3h7L21 8.5v7L15.5 21h-7L3 15.5v-7z'/%3E%3Cpath d='M12 10.5v6'/%3E%3Cpath d='M12 7.5v.5'/%3E%3C/svg%3E");
  --sts-m-menu: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h16'/%3E%3Cpath d='M4 12h16'/%3E%3Cpath d='M4 17h10'/%3E%3C/svg%3E");
  --sts-m-uyari: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5 22 20.5H2z'/%3E%3Cpath d='M12 10v4.5'/%3E%3Cpath d='M12 17.5v.2'/%3E%3C/svg%3E");
  --sts-m-pin: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M12 2a7 7 0 0 0-7 7c0 5.2 7 13 7 13s7-7.8 7-13a7 7 0 0 0-7-7zm0 9.6A2.6 2.6 0 1 1 12 6.4a2.6 2.6 0 0 1 0 5.2z'/%3E%3C/svg%3E");
  --sts-ikon-anahtar: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FB8A3C' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.5 4.5a4.5 4.5 0 0 0 5 6.5l-8.5 8.5a2 2 0 0 1-3-3l8.5-8.5a4.5 4.5 0 0 1-2-3.5z'/%3E%3C/svg%3E");
  --sts-ok-ikon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M5 12h13'/%3E%3Cpath d='M14 7l5 5-5 5'/%3E%3C/svg%3E");
}

@media (min-width: 720px) {
  :root { --sts-kenar: 24px; --sts-oluk: 20px; --sts-bolum: 72px; }
}
@media (min-width: 1080px) {
  :root { --sts-kenar: 40px; --sts-oluk: 24px; --sts-ust-boy: 72px; --sts-bolum: 96px; }
}
/* Yazdırmada lacivert yüzeyler beyaza iner (§50 yazdırma kuralları). */

/* --- 02 Taban, yazı tabanı ---------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: calc(var(--sts-ust-boy) + var(--sts-a4));
}
body {
  margin: 0;
  background: var(--sts-beyaz);
  color: var(--sts-metin);
  font-family: var(--sts-f-govde);
  font-size: var(--sts-y-govde);
  line-height: 1.6;
  font-weight: 400;
  font-feature-settings: "kern" 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, svg, video { display: block; max-width: 100%; height: auto; }
[hidden] { display: none !important; }
/* Başlık: Saira Condensed 700, grafit; köşeli harf, aralık nötr. */
h1, h2, h3, h4 {
  margin: 0;
  color: var(--sts-grafit);
  font-family: var(--sts-f-baslik);
  font-weight: 600;
  letter-spacing: -0.005em;
  text-wrap: balance;
  hyphens: manual;
}
h1 { font-size: var(--sts-y-1); line-height: 1.1; letter-spacing: -0.012em; }
h2 { font-size: var(--sts-y-2); line-height: 1.16; }
h3 { font-size: var(--sts-y-3); line-height: 1.3; font-weight: 600; }
h4 { font-size: 1rem; font-family: var(--sts-f-govde); font-weight: 600; letter-spacing: 0; }
p { margin: 0 0 var(--sts-a4); max-width: 68ch; }
ul, ol { margin: 0; padding: 0; }
/* Bağlantı: yazı rengi + 1 px sert gri alt çizgi; üzerine gelince çizgi yakut ve 2 px. */
a { color: inherit; text-decoration-line: underline; text-decoration-color: var(--sts-cizgi-sert); text-decoration-thickness: 1px; text-underline-offset: 0.24em; }
a:hover { color: inherit; text-decoration-color: var(--sts-ember); text-decoration-thickness: 2px; }
strong, b { font-weight: 600; color: var(--sts-grafit); }
code, kbd, samp { font-family: var(--sts-f-mono); font-size: 0.92em; font-weight: 500; }
/* hr: grafit kıl çizgi, sol ucunda yakut köşe imi */
hr { border: 0; height: 2px; margin: var(--sts-a6) 0; background: linear-gradient(90deg, var(--sts-cizgi), var(--sts-ember-isik) 50%, var(--sts-cizgi)); border-radius: 2px; opacity: 0.7; }
table { font-variant-numeric: tabular-nums; }
::selection { background: var(--sts-ember); color: var(--sts-ember-ust); }
/* Odak: 2 px yakut çizgi, 2 px açıklık. Hale yok. */
:focus-visible { outline: 2px solid var(--sts-ember); outline-offset: 2px; }
.sts-screen-outer {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.sts-direct-content {
  position: absolute; left: var(--sts-a4); top: -100px; z-index: 100;
  background: var(--sts-grafit); color: var(--sts-beyaz); padding: var(--sts-a2) var(--sts-a4);
  font-family: var(--sts-f-baslik); font-weight: 600; text-decoration: none;
}
.sts-direct-content:focus { top: var(--sts-a2); }

/* ==========================================================================
   BİLEŞENLER §03–§19 (TASARIM-SISTEMI §06) — stil rehberinde onaylanan biçim.
   PLAKA BOYAMA KALIBI: pahlı yüzeyler öğenin kendisini KESMEZ; zemin, 1 px
   kenar ::before.da çizilir, köşe imi
   ::after'da kesiğin yerine oturur (öğe kesilseydi imi de kesilirdi). Ayar:
   --p-zemin, --p-kenar, --p-pah, --p-imi. Düğme ve girdi gibi küçük öğeler
   doğrudan yuvarlaktır; odak halkaları bu yüzden İÇ gölgedir.
   ========================================================================== */
.sts-plate-card, .sts-side-plate, .sts-first-plate, .sts-form-face, .sts-job-face,
.sts-type-tagged, .sts-last-plate, .sts-seek-plate, .sts-plate-note, .sts-plate-drop-roster,
.sts-drawing-frame, .sts-rule-face, .sts-mark-face, .sts-location-face,
.sts-size-row, .sts-suggest-register, .sts-cookie-face, .sts-code-drop-detail[open], .sts-diff-list {
  --p-zemin: var(--sts-beyaz);
  --p-kenar: var(--sts-cizgi);

  --p-imi: 10px;
  position: relative;
  isolation: isolate;
}
.sts-plate-card::before, .sts-side-plate::before, .sts-first-plate::before, .sts-form-face::before,
.sts-job-face::before, .sts-type-tagged::before, .sts-last-plate::before, .sts-seek-plate::before,
.sts-plate-note::before, .sts-plate-drop-roster::before, .sts-drawing-frame::before, .sts-rule-face::before,
.sts-mark-face::before, .sts-location-face::before, .sts-size-row::before, .sts-suggest-register::before,
.sts-cookie-face::before, .sts-code-drop-detail[open]::before, .sts-diff-list::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    var(--p-zemin);
  box-shadow: inset 0 0 0 1px var(--p-kenar);
  border-radius: var(--sts-r);
  transition: box-shadow var(--sts-sure) var(--sts-egri);
}
/* Köşe imi: pahın yerine oturan yakut dik üçgen (imza). */
.sts-plate-card--marked::after, .sts-side-plate::after, .sts-first-plate::after, .sts-type-tagged::after,
.sts-last-plate::after, .sts-seek-plate::after, .sts-drawing-frame::after, .sts-rule-face::after,
.sts-form-face::after, .sts-cookie-face::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: var(--p-imi);
  height: var(--p-imi);
  background: var(--p-imi-renk, var(--sts-ember));
  border-radius: 2px;
  pointer-events: none;
}

/* --- §03 Kap, iki yan, kesit -------------------------------------------- */
.sts-plate-shell { max-width: var(--sts-kap); margin-inline: auto; padding-inline: var(--sts-kenar); }
.sts-main-body { display: block; min-height: 50vh; }
/* İki yan: ana │ yan plaka (≥1080 px). Yan plaka YAPIŞKAN DEĞİL. */
.sts-plate-pair { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--sts-a6); align-items: start; }
.sts-plate-pair > * { min-width: 0; }
@media (min-width: 1080px) { .sts-plate-pair { grid-template-columns: minmax(0, 1fr) var(--sts-yan); gap: var(--sts-a7); } }
.sts-plate-stack { display: grid; gap: var(--sts-a4); }
.sts-plate-stack > * { min-width: 0; }
/* Kesit: sayfanın bir bölümü. Beyaz ↔ çelik dönüşümü servisfer'in koyu bant
   dönüşümünün Servist Servis karşılığıdır (--celik: tam genişlik çelik zemin). */
.sts-plate-section { margin-top: var(--sts-bolum); }
.sts-plate-section--steel { padding-block: var(--sts-bolum); background: var(--sts-celik); }
.sts-plate-section--steel .sts-plate-card { --p-zemin: var(--sts-beyaz); }
.sts-plate-pair + .sts-plate-section, .sts-page-face + .sts-plate-section { margin-top: calc(var(--sts-bolum) * 0.75); }
.sts-page-face + .sts-plate-shell { margin-top: var(--sts-a6); }
[id] { scroll-margin-top: calc(var(--sts-ust-boy) + var(--sts-a5)); }

/* --- §04 Rubrik, manşet, giriş, bölüm başı -------------------------------- */
.sts-marked-tag { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 14px; font-family: var(--sts-f-baslik); font-size: var(--sts-y-etiket); font-weight: 600; line-height: 1.25; letter-spacing: 0.02em; color: var(--sts-gri); }
.sts-marked-tag::before { content: ""; flex: none; width: 10px; height: 10px; background: var(--sts-ember); border-radius: 2px; }
.sts-plate-banner { margin: 0; font-family: var(--sts-f-baslik); font-size: var(--sts-y-manset); font-weight: 600; line-height: 1.04; letter-spacing: -0.02em; color: var(--sts-grafit); text-wrap: balance; overflow-wrap: anywhere; }
.sts-plate-entry { margin: 16px 0 0; max-width: 58ch; font-size: var(--sts-y-giris); line-height: 1.55; color: var(--sts-metin); }
/* Bölüm başı: üstte 1 px çizgi, solda 64×3 grafit ölçü çubuğu + ucunda yakut üçgen. */
.sts-plate-heading { position: relative; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 6px var(--sts-a4); margin-bottom: var(--sts-a5); padding-top: 18px; border-top: 1px solid var(--sts-cizgi); }
.sts-plate-heading::before { content: ""; position: absolute; left: 0; top: -2px; width: 64px; height: 3px; background: var(--sts-grafit); }
.sts-plate-heading::after { content: ""; position: absolute; left: 64px; top: -2px; width: 10px; height: 10px; background: var(--sts-ember); border-radius: var(--sts-r); }
.sts-plate-heading > div { min-width: 0; }
.sts-plate-heading h2 { margin: 0; overflow-wrap: anywhere; }
.sts-plate-heading p { margin: 6px 0 0; color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
.sts-plate-section--steel .sts-plate-heading { border-top-color: var(--sts-cizgi-sert); }
/* Düz metin sütunu. */
.sts-plate-text { max-width: 68ch; }
.sts-plate-text > :last-child { margin-bottom: 0; }
.sts-plate-text h3 { margin: var(--sts-a5) 0 8px; }
.sts-plate-text ul, .sts-plate-text ol { padding-left: 1.25rem; margin: 0 0 var(--sts-a4); }
.sts-plate-text li { margin-bottom: 6px; }
.sts-plate-text li::marker { color: var(--sts-ember); }
.sts-size-digits { font-family: var(--sts-f-sayi); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; letter-spacing: -0.01em; color: var(--sts-grafit); }
.sts-grid-digit { font-variant-numeric: tabular-nums; }
.sts-top-share.sts-top-share { margin-top: var(--sts-a4); }
.sts-error-count { display: block; font-family: var(--sts-f-sayi); font-size: var(--sts-y-dev); font-weight: 700; line-height: 1; color: var(--sts-grafit); }

/* --- §05 Üst plaka (başlık), menü, arama, öneriler, çekmece --------------- */
.sts-top-plate { position: sticky; top: 0; z-index: 40; background: var(--sts-beyaz); border-bottom: 1px solid var(--sts-cizgi); }
.sts-top-plate::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 120px; height: 3px; background: var(--sts-grafit); }
.sts-top-plate-inner { display: flex; align-items: center; gap: var(--sts-a3); max-width: var(--sts-kap); height: var(--sts-ust-boy); margin-inline: auto; padding-inline: var(--sts-kenar); }
.sts-top-plate-mark { flex: none; display: block; line-height: 0; }
.sts-top-plate-mark img { height: 28px; width: auto; }
@media (min-width: 1080px) { .sts-top-plate-mark img { height: 30px; } }
.sts-top-plate-nav { display: none; }
.sts-top-plate-menu { display: flex; list-style: none; margin: 0; padding: 0; }
.sts-top-plate-menu > li { position: relative; }
.sts-top-plate-menu > li > a { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 10px; font-family: var(--sts-f-baslik); font-size: 15px; font-weight: 500; color: var(--sts-grafit); text-decoration: none; white-space: nowrap; transition: color var(--sts-sure) var(--sts-egri); }
.sts-top-plate-menu > li > a:hover { color: var(--sts-ember); }
.sts-top-plate-menu > li > a[aria-current] { color: var(--sts-ember); box-shadow: inset 0 -2px 0 var(--sts-ember); }
.sts-plate-drop > a::after { content: ""; flex: none; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--sts-m-asagi) center / contain no-repeat; mask: var(--sts-m-asagi) center / contain no-repeat; }
/* Açılır liste: sağ üstü pahlı beyaz plaka; üzerine gelince ya da klavye odağında açılır. */
.sts-plate-drop-roster { position: absolute; top: 100%; left: 0; z-index: 45; display: none; min-width: 248px; margin: 0; padding: 8px 0; list-style: none; }
.sts-plate-drop:hover > .sts-plate-drop-roster, .sts-plate-drop:focus-within > .sts-plate-drop-roster { display: block; }
.sts-plate-drop-roster--wide { width: 500px; columns: 2; column-gap: 0; }
.sts-plate-drop-roster li { break-inside: avoid; }
.sts-plate-drop-roster a { display: flex; align-items: center; min-height: 38px; padding: 0 16px; color: var(--sts-metin); font-size: 15px; text-decoration: none; }
.sts-plate-drop-roster a:hover { background: var(--sts-celik); color: var(--sts-grafit); }
.sts-plate-drop-roster-head { display: flex; align-items: center; gap: 8px; padding: 10px 16px 4px; font-family: var(--sts-f-baslik); font-size: 12.5px; font-weight: 600; letter-spacing: 0.03em; color: var(--sts-gri); }
.sts-plate-drop-roster-head::before { content: ""; flex: none; width: 7px; height: 7px; background: var(--sts-ember); border-radius: 2px; }
.sts-plate-drop-roster .sts-plate-drop-roster-head a { min-height: 0; padding: 0; color: var(--sts-gri); font-size: inherit; }
.sts-plate-drop-roster .sts-plate-drop-roster-head a:hover { background: none; color: var(--sts-ember); }
.sts-top-plate-action { display: flex; align-items: center; gap: var(--sts-a2); margin-left: auto; }
.sts-top-plate-tel { display: none; align-items: center; gap: 8px; min-height: 44px; padding: 0 6px; font-family: var(--sts-f-baslik); font-weight: 600; font-variant-numeric: tabular-nums; color: var(--sts-grafit); text-decoration: none; white-space: nowrap; }
.sts-top-plate-tel svg { width: 18px; height: 18px; color: var(--sts-ember); }
.sts-top-plate-tel:hover { color: var(--sts-ember); }
.sts-top-plate-action .sts-top-plate-request, .sts-top-plate-action .sts-top-plate-rule { display: none; }
@media (min-width: 720px) { .sts-top-plate-action .sts-top-plate-request, .sts-top-plate-action .sts-top-plate-rule { display: inline-flex; } }
@media (min-width: 1240px) {
  .sts-top-plate-nav { display: block; margin-left: var(--sts-a3); }
  .sts-top-plate-action .sts-top-plate-menu-unfold { display: none; }
}
@media (min-width: 1560px) { .sts-top-plate-tel { display: inline-flex; } }
@media (max-width: 359px) { .sts-top-plate-mark img { height: 24px; } .sts-top-plate-action { gap: 4px; } }
/* Büyütecin açtığı arama satırı (başlığın altında, her genişlikte). */
.sts-search-row { padding-block: 0 var(--sts-a3); }
/* Pahlı arama kutusu: girdi + grafit pahlı gönder karosu. --buyuk 404 ve kod dizininde. */
.sts-search-casing { position: relative; display: flex; align-items: center; width: 100%; min-height: 48px; background: var(--sts-beyaz); box-shadow: inset 0 0 0 1.5px var(--sts-cizgi-sert); border-radius: var(--sts-r); transition: box-shadow var(--sts-sure) var(--sts-egri); }
.sts-search-casing:focus-within { box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-search-casing input { flex: 1; min-width: 0; height: 46px; padding: 0 8px 0 16px; border: 0; background: transparent; color: var(--sts-grafit); font: inherit; font-size: 16px; -webkit-appearance: none; appearance: none; }
.sts-search-casing input::placeholder { color: var(--sts-gri-2); }
.sts-search-casing input:focus-visible { outline: none; }
.sts-search-casing input::-webkit-search-cancel-button { display: none; }
.sts-search-casing button { flex: none; display: grid; place-items: center; width: 40px; height: 40px; margin-right: 4px; border: 0; background: var(--sts-grafit); color: var(--sts-beyaz); border-radius: var(--sts-r); cursor: pointer; transition: background-color var(--sts-sure) var(--sts-egri); }
.sts-search-casing button:hover { background: var(--sts-ember); }
.sts-search-casing button:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-beyaz), inset 0 0 0 4px var(--sts-ember); }
.sts-search-casing button svg { width: 18px; height: 18px; }
.sts-search-casing--big { min-height: 60px; }
.sts-search-casing--big input { height: 58px; padding-left: 20px; font-size: 18px; }
.sts-search-casing--big button { width: 50px; height: 50px; margin-right: 5px; background: var(--sts-ember); }
.sts-search-casing--big button:hover { background: var(--sts-ember-bas); }
.sts-search-casing--big button svg { width: 22px; height: 22px; }
form[data-bul] { position: relative; }
/* Öneri listesi (servistservis.js "Bul kutuları"): kutunun altında pahlı beyaz plaka. */
.sts-suggest-register { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 60; max-height: min(60vh, 480px); overflow-y: auto; margin: 0; padding: 6px; list-style: none; --p-kenar: var(--sts-cizgi-sert); }
.sts-suggest-register--up { top: auto; bottom: calc(100% + 6px); }
.sts-suggest-register a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: baseline; min-height: 44px; padding: 11px 12px; color: var(--sts-grafit); text-decoration: none; }
.sts-suggest-register a[aria-selected="true"], .sts-suggest-register a:hover { background: var(--sts-celik); }
.sts-suggest-kind { color: var(--sts-gri); font-size: 13px; text-align: right; }
.sts-suggest-row--code .sts-suggest-named { font-family: var(--sts-f-sayi); font-weight: 700; font-variant-numeric: tabular-nums; }
.sts-suggest-none { padding: 10px 12px; color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
/* Çekmece (#sts-index, "Menü"): sağdan gelen beyaz plaka, mobilde tam ekran. */
body.sts-body-locked { overflow: hidden; }
.sts-plate-drawer-cover { position: fixed; inset: 0; z-index: 70; background: rgba(4, 5, 7, 0.62); }
.sts-plate-drawer { position: fixed; top: 0; right: 0; bottom: 0; z-index: 80; width: min(420px, 100%); overflow-y: auto; overscroll-behavior: contain; padding: var(--sts-a4) var(--sts-a5) var(--sts-a7); background: var(--sts-beyaz); box-shadow: inset 1px 0 0 var(--sts-cizgi); }
.sts-plate-drawer-head { position: relative; display: flex; justify-content: space-between; align-items: center; gap: var(--sts-a3); margin: 0 0 var(--sts-a5); padding-bottom: var(--sts-a4); border-bottom: 1px solid var(--sts-cizgi); }
.sts-plate-drawer-head::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 72px; height: 3px; background: var(--sts-grafit); }
.sts-plate-drawer-head img { height: 26px; width: auto; }
.sts-plate-drawer-actions { display: grid; gap: var(--sts-a2); }
.sts-plate-drawer-group { margin-top: var(--sts-a5); }
.sts-plate-drawer-group h2 { margin: 0 0 4px; font-size: 1.0625rem; }
.sts-plate-drawer-group h2 a { text-decoration: none; }
.sts-plate-drawer-group h2 a[aria-current] { color: var(--sts-ember); }
.sts-plate-drawer-group .sts-plate-drop-roster-head { padding: 12px 0 2px; }
.sts-plate-drawer-lowest { margin: var(--sts-a5) 0 0; padding-top: var(--sts-a4); border-top: 1px solid var(--sts-cizgi-ince); color: var(--sts-gri); font-size: 15px; max-width: none; }
.sts-lang-list { font-size: var(--sts-y-kucuk); }
.sts-lang-list summary { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; list-style: none; box-shadow: inset 0 0 0 1.5px var(--sts-grafit); border-radius: var(--sts-r); font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); cursor: pointer; }
.sts-lang-list summary::-webkit-details-marker { display: none; }
.sts-lang-list ul { list-style: none; display: flex; flex-wrap: wrap; gap: 0 var(--sts-a4); margin: var(--sts-a2) 0 0; }
.sts-lang-list a { display: inline-block; padding: 10px 0; color: var(--sts-gri); text-decoration: none; }
.sts-lang-list a:hover, .sts-lang-list a[aria-current="true"] { color: var(--sts-grafit); }

/* --- §06 Pahlı düğmeler, ok bağlantı -------------------------------------- */
.sts-facet-button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 24px; border: 0; background: var(--sts-beyaz); color: var(--sts-grafit); border-radius: var(--sts-r); font-family: var(--sts-f-baslik); font-size: 16px; font-weight: 600; line-height: 1.2; letter-spacing: 0.01em; text-align: center; text-decoration: none; cursor: pointer; transition: background-color var(--sts-sure) var(--sts-egri), color var(--sts-sure) var(--sts-egri); }
.sts-facet-button svg { width: 18px; height: 18px; flex: none; }
.sts-facet-button b { font-weight: 600; font-variant-numeric: tabular-nums; }
.sts-facet-button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sts-facet-button--ember { background: var(--sts-ember); color: var(--sts-ember-ust); }
.sts-facet-button--ember:hover { background: var(--sts-ember-bas); color: var(--sts-ember-ust); }
/* Çizgili: 1,5 px grafit kenar (iç gölge) + kesikte çapraz çizgi. */
.sts-facet-button--lined { color: var(--sts-grafit); box-shadow: inset 0 0 0 1.5px var(--sts-grafit);
  background:
    var(--sts-beyaz); }
.sts-facet-button--lined:hover { background: var(--sts-grafit); color: var(--sts-beyaz); }
/* Koyu: son plakanın grafit zemininde beyaz çizgili. */
.sts-facet-button--dark { color: var(--sts-beyaz); box-shadow: inset 0 0 0 1.5px #aab3bf;
  background:
    transparent; }
.sts-facet-button--dark:hover { background: var(--sts-beyaz); color: var(--sts-grafit); }
.sts-facet-button--plain { background: transparent; color: var(--sts-grafit); }
.sts-facet-button--plain:hover { background: var(--sts-celik); }
.sts-facet-button--small { min-height: 44px; padding: 0 18px; font-size: 15px; }
.sts-facet-button--wide { width: 100%; }
.sts-facet-button--symbol { width: 44px; padding: 0; flex: none; }
.sts-facet-button[aria-disabled="true"] { background: var(--sts-celik-2); color: var(--sts-gri-2); box-shadow: none; cursor: not-allowed; }
.sts-facet-button[aria-busy="true"] { opacity: 0.7; cursor: progress; }
.sts-facet-button:focus-visible { outline: none; box-shadow: inset 0 0 0 3px var(--sts-grafit), inset 0 0 0 5px var(--sts-beyaz); }
.sts-facet-button--ember:focus-visible { box-shadow: inset 0 0 0 3px var(--sts-grafit), inset 0 0 0 5px var(--sts-beyaz); }
.sts-facet-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.sts-facet-actions--vertical { display: grid; gap: var(--sts-a2); margin-top: var(--sts-a5); }
/* Ok bağlantı: Saira yazı + pahlı grafit karo içinde beyaz ok. */
.sts-facet-arrow { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); text-decoration: none; transition: color var(--sts-sure) var(--sts-egri); }
.sts-facet-arrow::after { content: ""; flex: none; width: 26px; height: 26px; background: var(--sts-grafit) var(--sts-ok-ikon) center / 14px 14px no-repeat; border-radius: var(--sts-r); transition: background-color var(--sts-sure) var(--sts-egri); }
.sts-facet-arrow:hover { color: var(--sts-ember); }
.sts-facet-arrow:hover::after { background-color: var(--sts-ember); }

/* --- §07 Plaka (kart), cihaz plakası, yan plaka --------------------------- */
.sts-plate-card { padding: 22px; min-width: 0; }
.sts-plate-card--steel { --p-zemin: var(--sts-celik); }
.sts-plate-card > :last-child { margin-bottom: 0; }
.sts-plate-card h3 { margin: 0 0 8px; }
a.sts-plate-card { display: block; color: inherit; text-decoration: none; }
a.sts-plate-card:hover { --p-kenar: var(--sts-grafit); }
a.sts-plate-card p { color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
@media (max-width: 719px) { .sts-plate-card { padding: 18px 16px; } }
.sts-card-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px var(--sts-a4); margin-bottom: var(--sts-a4); }
.sts-card-head h2, .sts-card-head h3 { margin: 0; }
.sts-card-head h2 { font-size: clamp(1.25rem, 1.12rem + 0.6vw, 1.625rem); }
.sts-card-head p { margin: 6px 0 0; color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
.sts-card-head small { color: var(--sts-gri); font-size: 14px; }
.sts-card-head h3 a { text-decoration: none; }
.sts-card-head h3 a:hover { text-decoration: underline; text-decoration-color: var(--sts-ember); }
.sts-plates { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); margin: 0; padding: 0; list-style: none; }
.sts-plates > * { min-width: 0; }
@media (min-width: 720px) { .sts-plates { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) { .sts-plates--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sts-plates--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sts-plates > .sts-plate-card > .sts-marked-tag { margin-bottom: 8px; }
.sts-plates > .sts-plate-card > p { margin: 0; color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
.sts-plates > .sts-plate-card > h3 + p { margin-top: 0; }
/* Cihaz plakası: izometrik çizim + ad satırı (ad + pahlı ok). */
.sts-plate-device { padding: 10px 10px 14px; }
a.sts-plate-device { display: grid; }
.sts-plate-device .sts-drawing-frame { padding: 0; }
.sts-plate-device .sts-drawing-frame::before, .sts-plate-device .sts-drawing-frame::after { display: none; }
.sts-plate-device img { width: 100%; height: auto; }
.sts-plate-device-link { display: block; color: inherit; text-decoration: none; }
.sts-plate-device-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 4px; padding: 12px 4px 0; border-top: 1px solid var(--sts-cizgi-ince); }
.sts-plate-device-foot h3 { margin: 0; font-size: 18px; overflow-wrap: anywhere; }
.sts-plate-device-foot p { margin: 2px 0 0; color: var(--sts-gri); font-size: 14px; }
.sts-plate-device-foot::after { content: ""; flex: none; width: 26px; height: 26px; background: var(--sts-grafit) var(--sts-ok-ikon) center / 14px 14px no-repeat; border-radius: var(--sts-r); transition: background-color var(--sts-sure) var(--sts-egri); }
.sts-plate-device:hover .sts-plate-device-foot::after, .sts-plate-device-link:hover .sts-plate-device-foot::after { background-color: var(--sts-ember); }
.sts-plate-device:hover, li.sts-plate-device:focus-within { --p-kenar: var(--sts-grafit); }
.sts-device-order-num { margin-right: 8px; font-family: var(--sts-f-sayi); font-size: 13px; font-weight: 700; color: var(--sts-ember); font-variant-numeric: tabular-nums; }
.sts-plate-device--dotted { display: grid; grid-template-rows: auto 1fr auto; }
.sts-plate-device-action { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 12px; margin-top: 10px; padding: 10px 4px 0; border-top: 1px solid var(--sts-cizgi-ince); font-size: 14px; }
.sts-plate-device-action a { color: var(--sts-gri); text-decoration: none; }
.sts-plate-device-action a:hover { color: var(--sts-grafit); text-decoration: underline; text-decoration-color: var(--sts-ember); }
.sts-plate-device-action .sts-plate-device-request { display: inline-flex; align-items: center; gap: 4px; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); }
.sts-plate-device-action .sts-plate-device-request:hover { color: var(--sts-ember); }
@media (max-width: 719px) {
  .sts-plates--device { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .sts-plates--device .sts-plate-device { padding: 6px 6px 10px; }
  .sts-plates--device .sts-plate-device-foot { padding: 8px 2px 0; }
  .sts-plates--device .sts-plate-device-foot::after { display: none; }
  .sts-plates--device .sts-plate-device-foot h3 { font-size: 15px; }
  .sts-plates--device .sts-plate-device-foot p { font-size: 13px; }
  .sts-plates--device .sts-plate-device-action { padding: 8px 2px 0; font-size: 13px; }
}
/* Yan plaka: çelik, sağ üstü pahlı, köşe imli; yapışkan DEĞİL. */
.sts-side-plate { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); padding: 24px; min-width: 0; }
.sts-side-plate-title { margin: 0 0 12px; font-size: 19px; }
.sts-side-plate dl { margin: 0; }
.sts-side-plate dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 9px 0; border-top: 1px solid var(--sts-cizgi); }
.sts-side-plate dt { font-family: var(--sts-f-baslik); font-size: 13px; font-weight: 600; letter-spacing: 0.02em; color: var(--sts-gri); }
.sts-side-plate dd { margin: 0; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.sts-side-plate .sts-def-face > div { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2px; }
.sts-side-plate .sts-def-face dd { font-family: var(--sts-f-govde); font-weight: 400; text-align: left; color: var(--sts-metin); }
.sts-side-plate > .sts-facet-button { margin-top: var(--sts-a4); }
.sts-side-plate-note { margin: var(--sts-a4) 0 0; color: var(--sts-gri); font-size: 14px; }

/* --- §08 İş plakası (süreç, imza): tek pahlı plakada alanlar ---------------- */
.sts-job-face { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; padding: 1px; list-style: none; }
/* Alanların zemini (etkin alan çelik) pahı örtmesin: öğe kesilir, kenar ve pah çizgisi alanların ÜSTÜNDE. */
.sts-job-face { --p-zemin: transparent; background: var(--sts-beyaz); border-radius: var(--sts-r-kart); }
.sts-job-face::before { z-index: 1; }
@media (min-width: 900px) { .sts-job-face:not(.sts-job-face--vertical) { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); } }
.sts-job-area { position: relative; padding: 18px 20px 22px; min-width: 0; }
.sts-job-area + .sts-job-area { border-top: 1px solid var(--sts-cizgi); }
@media (min-width: 900px) { .sts-job-face:not(.sts-job-face--vertical) > .sts-job-area + .sts-job-area { border-top: 0; border-left: 1px solid var(--sts-cizgi); } }
.sts-job-area small { display: block; margin-bottom: 10px; font-family: var(--sts-f-baslik); font-size: 12.5px; font-weight: 600; letter-spacing: 0.04em; color: var(--sts-gri); }
.sts-job-area h3 { margin: 0 0 6px; font-size: 19px; }
.sts-job-area p { margin: 0; color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
.sts-job-area--now { background: var(--sts-celik); }
.sts-job-area--now small { color: var(--sts-ember); }
.sts-job-area--now::before { content: ""; position: absolute; left: 0; top: 0; width: 10px; height: 10px; background: var(--sts-ember); border-radius: var(--sts-r); }
.sts-job-face--vertical { margin: var(--sts-a5) 0; }
.sts-job-face--vertical .sts-job-area { padding: 14px 18px 16px; }
.sts-job-face--vertical .sts-job-area small { margin-bottom: 6px; }
.sts-job-face--vertical .sts-job-area h3 { font-size: 17px; }
.sts-job-face--vertical .sts-job-area small + p { color: var(--sts-metin); }

/* --- §09 Sayfa yolu ------------------------------------------------------- */
.sts-plate-road { display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0 0 14px; padding: 0; list-style: none; font-family: var(--sts-f-baslik); font-size: 14px; color: var(--sts-gri); }
.sts-plate-road li + li::before { content: "/"; margin-right: 10px; color: var(--sts-ember); }
.sts-plate-road a { color: var(--sts-gri); text-decoration: none; }
.sts-plate-road a:hover { color: var(--sts-grafit); text-decoration: underline; text-decoration-color: var(--sts-ember); }
.sts-plate-road [aria-current] { color: var(--sts-grafit); }

/* --- §10 Pahlı etiket (durum), pahlı çip, sık aranan -------------------------- */
.sts-facet-tag { display: inline-flex; align-items: center; min-height: 28px; padding: 0 12px; border-radius: var(--sts-r); background: var(--sts-celik-2); color: var(--sts-grafit); font-family: var(--sts-f-baslik); font-size: 13.5px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.sts-facet-tag--selfcare { background: #263029; color: var(--sts-yesil); }
.sts-facet-tag--service { background: var(--sts-celik-2); color: var(--sts-grafit); }
.sts-facet-tag--stop { background: var(--sts-ember); color: var(--sts-ember-ust); }
.sts-dense-plates { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sts-facet-chip { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; background: var(--sts-celik); color: var(--sts-grafit); font-size: 14.5px; text-decoration: none; border-radius: var(--sts-r); transition: background-color var(--sts-sure) var(--sts-egri); }
a.sts-facet-chip:hover { background: var(--sts-celik-3); color: var(--sts-grafit); }
a.sts-facet-chip:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-plate-section--steel .sts-facet-chip, .sts-plate-card--steel .sts-facet-chip { background: var(--sts-beyaz); }
.sts-dense-wanted-row { display: grid; gap: 8px; margin-top: var(--sts-a5); }
.sts-dense-wanted-row > span { font-family: var(--sts-f-baslik); font-size: 13px; font-weight: 600; color: var(--sts-gri); }

/* --- §11 Kod plakası ------------------------------------------------------ */
.sts-code-face { width: 100%; border-collapse: collapse; font-size: 15px; box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
.sts-code-face caption { padding: 0 0 10px; text-align: left; font-family: var(--sts-f-baslik); font-size: 13.5px; font-weight: 600; color: var(--sts-gri); }
.sts-code-face th, .sts-code-face td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--sts-cizgi-ince); overflow-wrap: anywhere; }
.sts-code-face thead th { background: var(--sts-grafit); color: var(--sts-beyaz); font-family: var(--sts-f-baslik); font-size: 13px; font-weight: 600; letter-spacing: 0.03em; vertical-align: middle; }
.sts-code-face tbody tr:last-child > * { border-bottom: 0; }
.sts-code-face td b { display: block; font-weight: 600; color: var(--sts-grafit); }
.sts-code-face td b + span { display: block; color: var(--sts-gri); font-size: 14px; }
.sts-code-face tr:target > td { background: var(--sts-celik); }
.sts-code-face tr[hidden] { display: none; }
.sts-code-cell { display: inline-block; min-width: 58px; padding: 4px 10px; background: var(--sts-celik); color: var(--sts-grafit); font-family: var(--sts-f-sayi); font-size: 18px; font-weight: 700; line-height: 1.35; text-align: center; text-decoration: none; font-variant-numeric: tabular-nums; white-space: nowrap; border-radius: var(--sts-r); transition: background-color var(--sts-sure) var(--sts-egri), color var(--sts-sure) var(--sts-egri); }
a.sts-code-cell:hover { background: var(--sts-grafit); color: var(--sts-beyaz); }
a.sts-code-cell:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-ember); }
@media (max-width: 719px) {
  .sts-code-face thead { display: none; }
  .sts-code-face tr { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 12px; padding: 12px 14px; border-bottom: 1px solid var(--sts-cizgi-ince); }
  .sts-code-face tbody tr:last-child { border-bottom: 0; }
  .sts-code-face td { padding: 2px 0; border: 0; }
  .sts-code-face td:first-child { grid-row: span 2; }
}
/* Tam kod tablosu (marka × cihaz) ve markanın tabloları. */
.sts-code-face--full td:first-child { width: 1%; white-space: nowrap; }
.sts-code-face--full td p { margin: 0 0 6px; max-width: 64ch; }
.sts-code-face--full td strong { font-weight: 700; color: var(--sts-grafit); }
.sts-code-seen { color: var(--sts-gri); }
.sts-code-drop-detail { margin-top: 8px; }
.sts-code-drop-detail > summary { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; list-style: none; box-shadow: inset 0 0 0 1.5px var(--sts-grafit); border-radius: var(--sts-r); font-family: var(--sts-f-baslik); font-size: 14px; font-weight: 600; color: var(--sts-grafit); cursor: pointer; }
.sts-code-drop-detail > summary::-webkit-details-marker { display: none; }
.sts-code-drop-detail > summary::after { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--sts-m-asagi) center / contain no-repeat; mask: var(--sts-m-asagi) center / contain no-repeat; }
.sts-code-drop-detail > summary:hover { background: var(--sts-grafit); color: var(--sts-beyaz); }
.sts-code-drop-detail[open] { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); margin-top: 10px; padding: 12px 16px 8px; }
.sts-code-drop-detail[open] > summary { min-height: 34px; padding: 0; box-shadow: none; border-radius: 0; background: none; color: var(--sts-grafit); }
.sts-code-drop-detail[open] > summary::after { transform: rotate(180deg); }
.sts-code-drop-detail h3 { margin: var(--sts-a3) 0 0; font-size: 15px; }
.sts-code-drop-detail .sts-tally-row { min-height: 40px; padding-block: 6px; font-size: 15px; }
.sts-code-filter-face { max-width: 520px; }
.sts-code-filter-face .sts-field-desc { min-height: 1.5em; margin-top: 8px; }
.sts-code-face--brand td:first-child a { text-decoration: none; }
.sts-code-face--brand td:first-child a:hover b { text-decoration: underline; text-decoration-color: var(--sts-ember); }
.sts-code-face--brand .sts-dense-plates { gap: 6px; }
.sts-code-face--brand td:last-child, .sts-code-face--brand th:last-child { text-align: right; color: var(--sts-gri); }
@media (max-width: 719px) {
  .sts-code-face--brand tr { grid-template-columns: minmax(0, 1fr) auto; }
  .sts-code-face--brand td:first-child { grid-row: auto; }
  .sts-code-face--brand td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; padding-top: 6px; }
  .sts-code-face--full td:last-child { grid-column: 2; padding-top: 6px; }
}
/* Tip tablosu: veri tablosu (renkler, basın, ekipler, resmi hatlar, işin sırası). */
.sts-type-table { width: 100%; border-collapse: collapse; font-size: var(--sts-y-kucuk); box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
.sts-type-table th, .sts-type-table td { padding: 11px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--sts-cizgi-ince); overflow-wrap: anywhere; }
.sts-type-table thead th { background: var(--sts-celik-2); color: var(--sts-grafit); font-family: var(--sts-f-baslik); font-size: 13px; font-weight: 600; letter-spacing: 0.02em; vertical-align: bottom; }
.sts-type-table tbody th { font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); border-right: 1px solid var(--sts-cizgi-ince); }
.sts-type-table tbody tr:last-child > * { border-bottom: 0; }
@media (max-width: 719px) {
  .sts-type-table--narrow thead { display: none; }
  .sts-type-table--narrow tr { display: grid; gap: 4px; padding: 12px 14px; border-bottom: 1px solid var(--sts-cizgi-ince); }
  .sts-type-table--narrow tbody tr:last-child { border-bottom: 0; }
  .sts-type-table--narrow td, .sts-type-table--narrow tbody th { padding: 0; border: 0; }
}
/* Tanım plakası: alan adı (küçük Saira) │ değer; 1 px çizgilerle bölünmüş satırlar. */
.sts-def-face { margin: 0; font-size: var(--sts-y-kucuk); }
.sts-def-face > div { display: grid; grid-template-columns: minmax(7rem, 2fr) minmax(0, 5fr); gap: 12px; padding: 12px 0; border-top: 1px solid var(--sts-cizgi-ince); }
.sts-def-face > div:first-child { padding-top: 0; border-top: 0; }
.sts-def-face dt { font-family: var(--sts-f-baslik); font-size: 13.5px; font-weight: 600; letter-spacing: 0.02em; color: var(--sts-gri); }
.sts-def-face dd { margin: 0; color: var(--sts-metin); overflow-wrap: anywhere; }
@media (max-width: 559px) { .sts-def-face > div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }

/* --- §12 Soru plakası (SSS), katlanan plaka --------------------------------- */
.sts-question-face { box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
.sts-question-plate-row + .sts-question-plate-row { border-top: 1px solid var(--sts-cizgi); }
.sts-question-plate-row summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 14px 18px; list-style: none; font-family: var(--sts-f-baslik); font-size: 17px; font-weight: 600; color: var(--sts-grafit); cursor: pointer; }
.sts-question-plate-row summary::-webkit-details-marker { display: none; }
.sts-question-plate-row summary::after { content: ""; flex: none; width: 18px; height: 18px; background: var(--sts-grafit); -webkit-mask: var(--sts-m-asagi) center / contain no-repeat; mask: var(--sts-m-asagi) center / contain no-repeat; }
.sts-question-plate-row summary:hover { background: var(--sts-celik); }
.sts-question-plate-row[open] { background: var(--sts-celik); }
.sts-question-plate-row[open] summary::after { transform: rotate(180deg); background: var(--sts-ember); }
.sts-question-plate-row > div { padding: 0 18px 16px; color: var(--sts-metin); }
.sts-question-plate-row > div p { margin: 0 0 10px; }
.sts-question-plate-row > div p:last-child { margin-bottom: 0; }
@media (min-width: 1080px) {
  .sts-question-face--two { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; box-shadow: none; }
  .sts-question-face--two .sts-question-plate-row { box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
  .sts-question-face--two .sts-question-plate-row + .sts-question-plate-row { border-top: 0; }
}
.sts-folded-plate { border-top: 1px solid var(--sts-cizgi-ince); }
.sts-folded-plate > summary { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 0; list-style: none; cursor: pointer; }
.sts-folded-plate > summary::-webkit-details-marker { display: none; }
.sts-folded-plate > summary h3 { flex: 1; min-width: 0; margin: 0; font-size: 17px; }
.sts-folded-plate > summary small { font-family: var(--sts-f-sayi); font-size: 14px; font-weight: 600; color: var(--sts-gri-2); font-variant-numeric: tabular-nums; }
.sts-folded-plate > summary::after { content: ""; flex: none; width: 18px; height: 18px; background: var(--sts-grafit); -webkit-mask: var(--sts-m-asagi) center / contain no-repeat; mask: var(--sts-m-asagi) center / contain no-repeat; }
.sts-folded-plate[open] > summary::after { transform: rotate(180deg); background: var(--sts-ember); }
.sts-folded-plate > summary:hover h3 { text-decoration: underline; text-decoration-color: var(--sts-ember); }
.sts-folded-plate > p { margin: 0 0 8px; color: var(--sts-gri); }
.sts-folded-plate > .sts-line-list { margin-bottom: var(--sts-a3); }
.sts-plate-card > .sts-folded-plate:first-of-type { margin-top: var(--sts-a3); }

/* --- §13 Form ------------------------------------------------------------- */
.sts-plate-formfill { display: grid; gap: var(--sts-a5); min-width: 0; }
.sts-form-bay { display: grid; gap: 14px; min-width: 0; }
.sts-form-bay + .sts-form-bay { padding-top: var(--sts-a5); border-top: 1px solid var(--sts-cizgi-ince); }
.sts-split-named { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; }
.sts-split-named::before { content: ""; flex: none; width: 9px; height: 9px; background: var(--sts-ember); border-radius: 2px; }
.sts-split-named b { font-family: var(--sts-f-baslik); font-size: 17px; font-weight: 600; color: var(--sts-grafit); }
.sts-split-named small { color: var(--sts-gri); font-size: 14px; }
.sts-fields-side-beside { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr); min-width: 0; }
@media (min-width: 640px) { .sts-fields-side-beside { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sts-fields-side-beside > .sts-plate-area--full, .sts-fields-side-beside > .sts-confirm-row { grid-column: 1 / -1; } }
.sts-plate-area { display: grid; gap: 6px; min-width: 0; align-content: start; }
.sts-plate-area > label, .sts-field-heading { font-family: var(--sts-f-baslik); font-size: 14px; font-weight: 600; color: var(--sts-grafit); }
.sts-plate-area label small { font-family: var(--sts-f-govde); font-weight: 400; color: var(--sts-gri); }
.sts-plate-area input, .sts-plate-area select, .sts-plate-area textarea { width: 100%; min-width: 0; min-height: 52px; padding: 0 14px; border: 0; background: var(--sts-beyaz); color: var(--sts-grafit); font: inherit; font-size: 16px; box-shadow: inset 0 0 0 1.5px var(--sts-cizgi-sert); border-radius: var(--sts-r); -webkit-appearance: none; appearance: none; transition: box-shadow var(--sts-sure) var(--sts-egri); }
.sts-plate-area textarea { min-height: 116px; padding-block: 14px; resize: vertical; }
.sts-plate-area select { padding-right: 44px; background: var(--sts-beyaz) right 14px center / 18px 18px no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312161C' stroke-width='1.6' stroke-linecap='square' stroke-linejoin='miter'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E"); }
.sts-plate-area select[multiple] { min-height: 160px; padding: 8px; background-image: none; }
.sts-plate-area input::placeholder, .sts-plate-area textarea::placeholder { color: var(--sts-gri-2); }
.sts-plate-area input:hover, .sts-plate-area select:hover, .sts-plate-area textarea:hover { box-shadow: inset 0 0 0 1.5px var(--sts-grafit); }
.sts-plate-area input:focus-visible, .sts-plate-area select:focus-visible, .sts-plate-area textarea:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-plate-area input[type="date"], .sts-plate-area input[type="time"] { display: block; -webkit-appearance: auto; appearance: auto; color-scheme: light; }
.sts-plate-area input[type="date"]::-webkit-calendar-picker-indicator, .sts-plate-area input[type="time"]::-webkit-calendar-picker-indicator { width: 22px; height: 22px; cursor: pointer; }
.sts-plate-area input[type="file"] { padding: 10px 12px; }
.sts-plate-area input[type="file"]::file-selector-button { margin-right: var(--sts-a3); min-height: 34px; padding: 0 14px; border: 0; background: var(--sts-grafit); color: var(--sts-beyaz); font: inherit; font-family: var(--sts-f-baslik); font-weight: 600; border-radius: var(--sts-r); cursor: pointer; }
.sts-plate-area--faulty input, .sts-plate-area--faulty select, .sts-plate-area--faulty textarea { background-color: var(--sts-ember-acik); box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-field-desc { margin: 0; color: var(--sts-gri); font-size: 13.5px; }
.sts-field-error-row { display: flex; gap: 8px; align-items: center; margin: 0; max-width: none; color: var(--sts-ember); font-size: 14px; font-weight: 600; }
.sts-field-error-row::before { content: ""; flex: none; width: 9px; height: 9px; background: var(--sts-ember); border-radius: 2px; }
.sts-confirm-row { display: flex; gap: 12px; align-items: flex-start; color: var(--sts-metin); font-size: 15px; cursor: pointer; }
.sts-confirm-row input { flex: none; display: grid; place-content: center; width: 22px; height: 22px; margin: 1px 0 0; border: 0; background: var(--sts-beyaz); box-shadow: inset 0 0 0 1.5px var(--sts-cizgi-sert); -webkit-appearance: none; appearance: none; cursor: pointer; }
.sts-confirm-row input:checked { background: var(--sts-ember); box-shadow: none; }
.sts-confirm-row input:checked::after { content: ""; width: 16px; height: 16px; background: var(--sts-ember-ust); -webkit-mask: var(--sts-m-onay) center / contain no-repeat; mask: var(--sts-m-onay) center / contain no-repeat; }
.sts-confirm-row input:focus-visible { outline: 2px solid var(--sts-ember); outline-offset: 2px; }
.sts-plate-area--faulty.sts-confirm-row input { box-shadow: inset 0 0 0 2px var(--sts-ember); }
/* Uygun gün: önümüzdeki günler pahlı küçük plakalar (servistservis.js). */
.sts-day-plateset { display: flex; flex-wrap: wrap; gap: 8px; }
.sts-day-plateset button { display: inline-flex; align-items: baseline; gap: 6px; min-height: 44px; padding: 0 14px; border: 0; background: var(--sts-celik); color: var(--sts-gri); font: inherit; font-size: 14px; border-radius: var(--sts-r); cursor: pointer; transition: background-color var(--sts-sure) var(--sts-egri); }
.sts-day-plateset button b { font-family: var(--sts-f-sayi); font-size: 16px; font-weight: 700; color: var(--sts-grafit); font-variant-numeric: tabular-nums; }
.sts-day-plateset button:hover { background: var(--sts-celik-3); }
.sts-day-plateset button[aria-pressed="true"] { background: var(--sts-grafit); color: #aab3bf; }
.sts-day-plateset button[aria-pressed="true"] b { color: var(--sts-beyaz); }
.sts-day-plateset button:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-form-send-row { display: grid; gap: var(--sts-a3); }
.sts-form-send-row p { margin: 0; color: var(--sts-gri); font-size: 14px; }
@media (min-width: 720px) { .sts-form-send-row .sts-facet-button { justify-self: start; min-width: 300px; } }
.sts-screen-outer-field { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* İki yan form: solda etiket, başlık, giriş, dikey iş plakası; sağda form plakası. */
.sts-form-plate-duo { display: grid; gap: var(--sts-a6); grid-template-columns: minmax(0, 1fr); align-items: start; }
.sts-form-plate-duo > * { min-width: 0; }
@media (min-width: 1080px) { .sts-form-plate-duo { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--sts-a7); } }
.sts-form-explain h2 { margin: 0 0 var(--sts-a3); font-size: var(--sts-y-1); }
.sts-form-explain .sts-plate-entry { margin-top: 0; }
.sts-form-footnote { color: var(--sts-gri); font-size: 14px; }
.sts-form-face { --p-kenar: var(--sts-cizgi-sert); padding: var(--sts-a6) var(--sts-a5); }
@media (max-width: 719px) { .sts-form-face { padding: var(--sts-a5) var(--sts-a4); } }

/* --- §14 Plaka notu, uyarı ------------------------------------------------ */
.sts-plate-note { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); margin: 0 0 var(--sts-a4); padding: 14px 18px 14px 21px; max-width: none; color: var(--sts-metin); font-size: var(--sts-y-kucuk); }
.sts-plate-note::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--sts-grafit); }
.sts-plate-note b { display: block; margin-bottom: 2px; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); }
.sts-plate-note p { margin: 0; }
.sts-plate-note:last-child { margin-bottom: 0; }
.sts-plate-note--warn { --p-zemin: var(--sts-ember-acik); --p-kenar: var(--sts-ember-acik); }
.sts-plate-note--warn::after { background: var(--sts-ember); }
.sts-plate-note--warn b { color: var(--sts-ember); }
.sts-plate-note--tamam::after { background: var(--sts-yesil); }
.sts-plate-note--tamam b { color: var(--sts-yesil); }

/* --- §15 Açılış plakası, izometrik çizim, parça tablosu ---------------------- */
.sts-page-face { padding-top: var(--sts-a6); }
.sts-page-face-inner { display: grid; gap: var(--sts-a6); grid-template-columns: minmax(0, 1fr); align-items: center; }
.sts-page-face-inner > * { min-width: 0; }
.sts-page-face-inner h1 { margin: 0; overflow-wrap: anywhere; }
@media (min-width: 1080px) { .sts-page-face-inner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--sts-a8); } }
.sts-page-face-visual { display: grid; gap: var(--sts-a3); align-content: center; }
.sts-page-face-visual:empty { display: none; }
@media (min-width: 1080px) { .sts-page-face-inner:has(> .sts-page-face-visual:empty) { grid-template-columns: minmax(0, 1fr); } }
.sts-page-face-body > h1 { margin: 0; overflow-wrap: anywhere; }
.sts-page-face .sts-tab-bar { margin-top: var(--sts-a6); }
.sts-page-face .sts-facet-actions { margin-top: var(--sts-a5); }
/* Çizim plakası: sağ üstü 28 px pahlı beyaz plaka, pahta 20 px köşe imi. */
.sts-drawing-frame { --p-pah: 28px; --p-imi: 20px; display: block; padding: 14px; }
.sts-drawing-frame img { width: 100%; height: auto; }
.sts-drawing-frame picture { display: block; }
.sts-page-face-visual > .sts-drawing-frame { width: 100%; max-width: 440px; justify-self: center; }
@media (max-width: 1079px) { .sts-page-face-visual > .sts-drawing-frame { max-width: 320px; justify-self: start; } }
/* Ana sayfa açılışı. */
.sts-opening-section { padding-top: var(--sts-a6); }
@media (min-width: 1080px) { .sts-opening-section { padding-top: var(--sts-a8); } }
.sts-opening-face { display: grid; gap: var(--sts-a6); grid-template-columns: minmax(0, 1fr); align-items: center; }
.sts-opening-face > * { min-width: 0; }
@media (min-width: 1080px) { .sts-opening-face { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: var(--sts-a8); } }
.sts-opening-text .sts-facet-actions { margin-top: var(--sts-a5); }
/* İlke plakası: tip etiketi gibi üç alan. */
.sts-principle-face { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: var(--sts-a5) 0 0; padding: 0; list-style: none; box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
.sts-principle-face li { padding: 12px 14px; color: var(--sts-grafit); font-size: 14.5px; font-weight: 600; line-height: 1.35; }
.sts-principle-face li + li { border-left: 1px solid var(--sts-cizgi); }
.sts-principle-face small { display: block; margin-bottom: 4px; font-family: var(--sts-f-baslik); font-size: 12px; font-weight: 600; letter-spacing: 0.04em; color: var(--sts-ember); }
@media (max-width: 419px) { .sts-principle-face li { padding: 10px; font-size: 13.5px; } }
.sts-first-plate { --p-pah: 28px; --p-imi: 20px; margin: 0; padding: 18px; }
.sts-first-plate figcaption { margin-top: 12px; }
.sts-facet-dotted { position: relative; }
.sts-facet-dotted picture { display: block; }
.sts-facet-dotted img { display: block; width: 100%; height: auto; }
.sts-num-layer { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.sts-facet-num { transition: opacity var(--sts-sure) var(--sts-egri); }
.sts-num-ground { fill: var(--sts-grafit); }
.sts-num-corner { fill: var(--sts-ember); }
.sts-facet-num text { fill: #17120a; font-family: var(--sts-f-baslik); font-size: 3.3px; font-weight: 700; text-anchor: middle; dominant-baseline: middle; }
.sts-facet-num--picked .sts-num-ground { fill: var(--sts-ember); }
.sts-facet-num--picked .sts-num-corner { fill: var(--sts-grafit); }
.sts-num-layer:has(.sts-facet-num--picked) .sts-facet-num:not(.sts-facet-num--picked) { opacity: 0.3; }
.sts-plate-device--dotted .sts-facet-num { opacity: 0; }
.sts-plate-device--dotted:hover .sts-facet-num, .sts-plate-device--dotted:focus-within .sts-facet-num { opacity: 1; }
@media (hover: none) { .sts-plate-device--dotted .sts-facet-num { opacity: 1; } }
.sts-part-table-head { display: block; margin-bottom: 8px; font-family: var(--sts-f-baslik); font-size: 13px; font-weight: 600; color: var(--sts-gri); }
.sts-part-table { display: grid; grid-template-columns: minmax(0, 1fr); margin: 0; padding: 0; list-style: none; box-shadow: inset 0 0 0 1px var(--sts-cizgi); font-size: 14px; }
@media (min-width: 420px) { .sts-part-table { grid-template-columns: repeat(2, minmax(0, 1fr)); } .sts-part-table li:nth-child(odd) { border-right: 1px solid var(--sts-cizgi-ince); } }
.sts-part-table li { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 8px 10px; border-bottom: 1px solid var(--sts-cizgi-ince); color: var(--sts-metin); }
.sts-part-table b { flex: none; display: inline-grid; place-items: center; width: 26px; height: 20px; background: var(--sts-grafit); color: var(--sts-beyaz); font-family: var(--sts-f-baslik); font-size: 11.5px; font-weight: 700; font-variant-numeric: tabular-nums; border-radius: var(--sts-r); }

/* --- §16 Mobil alt plaka (<1080 px) --------------------------------------- */
.sts-foot-plate { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; gap: 8px; padding: 10px var(--sts-kenar) calc(10px + env(safe-area-inset-bottom)); background: var(--sts-beyaz); border-top: 1px solid var(--sts-cizgi); transition: transform var(--sts-sure) var(--sts-egri); }
.sts-foot-plate::before { content: ""; position: absolute; left: 0; top: -2px; width: 72px; height: 3px; background: var(--sts-grafit); }
.sts-foot-plate > .sts-facet-button { flex: 1; min-width: 0; }
.sts-foot-plate > .sts-foot-plate-tel { flex: 0 0 auto; padding-inline: 18px; }
.sts-foot-plate--hidden { transform: translateY(calc(100% + 8px)); }
body.sts-foot-plated { padding-bottom: calc(72px + env(safe-area-inset-bottom)); }
@media (min-width: 1080px) { .sts-foot-plate { display: none; } body.sts-foot-plated { padding-bottom: 0; } }

/* --- §17 Çelik altbilgi, tip etiketi, dip satır, son plaka ----------------- */
.sts-steel-footer { position: relative; margin-top: var(--sts-bolum); padding: var(--sts-a7) 0 0; background: var(--sts-celik); border-top: 1px solid var(--sts-cizgi); }
.sts-steel-footer::before { content: ""; position: absolute; left: 0; top: -2px; width: 120px; height: 3px; background: var(--sts-grafit); }
.sts-last-plate-section + .sts-steel-footer { margin-top: var(--sts-bolum); }
.sts-steel-footer-lattice { display: grid; gap: var(--sts-a6); grid-template-columns: minmax(0, 1fr); }
@media (min-width: 720px) { .sts-steel-footer-lattice { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) { .sts-steel-footer-lattice { grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); } }
.sts-footer-identity > a img { height: 28px; width: auto; margin-bottom: var(--sts-a4); }
.sts-footer-identity > p { max-width: 42ch; color: var(--sts-metin); font-size: var(--sts-y-kucuk); }
.sts-footer-contact { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: 15px; }
.sts-footer-contact a { color: var(--sts-grafit); text-decoration-color: var(--sts-cizgi-sert); }
.sts-footer-contact .sts-grid-digit { font-family: var(--sts-f-baslik); font-size: 19px; font-weight: 600; text-decoration: none; }
.sts-footer-index { min-width: 0; }
.sts-footer-index > nav + nav { margin-top: var(--sts-a5); }
.sts-footer-index h2 { margin: 0 0 8px; font-size: 15px; letter-spacing: 0; }
.sts-footer-index ul { margin: 0; padding: 0; list-style: none; }
.sts-footer-index a, .sts-footer-index button { display: inline-flex; align-items: center; min-height: 32px; padding: 2px 0; border: 0; background: none; color: var(--sts-metin); font: inherit; font-size: 15px; text-align: left; text-decoration: none; cursor: pointer; }
.sts-footer-index a:hover, .sts-footer-index button:hover { color: var(--sts-ember); }
.sts-footer-small { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: var(--sts-a6); padding-top: var(--sts-a4); border-top: 1px solid var(--sts-cizgi); }
.sts-footer-small > a { margin-right: 4px; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); text-decoration: none; }
.sts-footer-small ul { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 0; padding: 0; list-style: none; font-size: 14.5px; }
.sts-footer-small ul a { color: var(--sts-gri); text-decoration: none; }
.sts-footer-small ul a:hover { color: var(--sts-grafit); }
/* Tip etiketi: kurum bilgisi plakası (cihaz arkasındaki üretici etiketi gibi). */
.sts-type-tagged { --p-kenar: var(--sts-cizgi-sert); display: flex; flex-wrap: wrap; margin: var(--sts-a6) 0 0; padding: 1px; font-size: 13.5px; }
.sts-type-tagged > div { flex: 1 1 200px; min-width: 0; padding: 12px 16px; box-shadow: -1px 0 0 var(--sts-cizgi-ince), 0 -1px 0 var(--sts-cizgi-ince); }
.sts-type-tagged dt { margin-bottom: 4px; font-family: var(--sts-f-baslik); font-size: 11.5px; font-weight: 600; letter-spacing: 0.05em; color: var(--sts-gri); }
.sts-type-tagged dd { margin: 0; color: var(--sts-metin); overflow-wrap: anywhere; }
.sts-type-tagged-statement { flex-basis: 100% !important; }
.sts-footer-statement { color: var(--sts-gri); }
.sts-steel-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 20px; padding: var(--sts-a4) 0 var(--sts-a5); font-size: 13.5px; color: var(--sts-gri); }
.sts-steel-bottom p { margin: 0; }
.sts-steel-bottom a { color: var(--sts-gri); }
.sts-steel-bottom nav { display: flex; flex-wrap: wrap; gap: 4px 12px; }
.sts-counter-row b { font-family: var(--sts-f-sayi); font-weight: 700; color: var(--sts-grafit); font-variant-numeric: tabular-nums; }
/* Son plaka: sayfanın TEK koyu yüzeyi — grafit, 28 px pah, pahta açık yakut köşe imi. */
.sts-last-plate { --p-zemin: var(--sts-grafit); --p-kenar: var(--sts-grafit); --p-pah: 28px; --p-imi: 20px; --p-imi-renk: var(--sts-ember-isik); display: grid; gap: var(--sts-a5); align-items: center; padding: 30px 24px; color: #aab3bf; }
@media (min-width: 900px) { .sts-last-plate { grid-template-columns: minmax(0, 1fr) auto; padding: 36px 48px; } }
.sts-last-plate h2 { margin: 0 0 8px; color: var(--sts-beyaz); }
.sts-last-plate p { margin: 0; color: #aab3bf; }
.sts-last-plate .sts-marked-tag { margin-bottom: 10px; color: #aab3bf; }
.sts-last-plate .sts-marked-tag::before { background: var(--sts-ember-isik); }
.sts-last-plate .sts-facet-button--ember:focus-visible, .sts-last-plate .sts-facet-button--dark:focus-visible { box-shadow: inset 0 0 0 3px var(--sts-beyaz), inset 0 0 0 5px var(--sts-grafit); }
/* Ara plaka (sayfa ortası tek satır çağrı): çelik, köşe imli. */
.sts-seek-plate { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); display: grid; gap: var(--sts-a4); align-items: center; padding: 22px; }
@media (min-width: 900px) { .sts-seek-plate { grid-template-columns: minmax(0, 1fr) auto; padding: 26px 32px; } }
.sts-seek-plate p { margin: 0; color: var(--sts-gri); }
.sts-seek-plate b { display: block; font-family: var(--sts-f-baslik); font-size: var(--sts-y-3); color: var(--sts-grafit); }
/* Çerez plakası: alt plakanın üstünde yüzen beyaz plaka. */
.sts-cookie-face { --p-kenar: var(--sts-cizgi-sert); position: fixed; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom)); z-index: 90; max-width: 760px; margin-inline: auto; padding: var(--sts-a4) var(--sts-a5); }
.sts-cookie-face p { margin: 0 0 12px; max-width: none; color: var(--sts-metin); font-size: 14px; }

/* --- §18 Sayfa ekleri: ölçü satırı, hat plakası, açılış maddeleri, logo ---- */
.sts-size-row { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); display: flex; flex-wrap: wrap; margin: 0; padding: 1px; }
.sts-size-row > div { flex: 1 1 120px; display: flex; flex-direction: column-reverse; gap: 6px; padding: 18px 20px; }
.sts-size-row > div + div { box-shadow: -1px 0 0 var(--sts-cizgi); }
.sts-size-row dd { margin: 0; font-size: var(--sts-y-dev); }
.sts-size-row dt { font-family: var(--sts-f-baslik); font-size: var(--sts-y-etiket); font-weight: 600; color: var(--sts-gri); }
.sts-rule-face { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); display: grid; gap: 6px; padding: 22px; }
.sts-rule-face .sts-marked-tag { margin: 0; }
.sts-rule-face .sts-size-digits { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem); text-decoration: none; overflow-wrap: anywhere; }
.sts-rule-face .sts-size-digits:hover { color: var(--sts-ember); }
.sts-rule-face p { margin: 0; color: var(--sts-gri); font-size: 14px; }
.sts-opening-items .sts-tally-row { min-height: 40px; padding-block: 6px; font-size: 15px; color: var(--sts-metin); }
.sts-opening-items .sts-tally-row::before { content: ""; flex: none; width: 8px; height: 8px; background: var(--sts-ember); border-radius: 2px; }
.sts-mark-face { display: grid; place-items: center; min-height: 140px; margin-bottom: var(--sts-a4); padding: var(--sts-a5); }
.sts-mark-face--dark { --p-zemin: var(--sts-grafit); --p-kenar: var(--sts-grafit); }
.sts-mark-face img { max-height: 56px; width: auto; }
/* İletişim: tıkla-yükle harita plakası (iletisim-harita.js --acik ekler). */
.sts-location-face { --p-zemin: var(--sts-celik); --p-kenar: var(--sts-celik); display: grid; place-items: center; aspect-ratio: 4 / 3; padding: var(--sts-a5); text-align: center; overflow: hidden; }
.sts-location-face .sts-facet-actions { justify-content: center; }
.sts-location-face iframe { width: 100%; height: 100%; border: 0; }
.sts-location-face--open { padding: 0; }
.sts-location-face--open > div { display: none; }
@media (min-width: 720px) { .sts-location-face { aspect-ratio: 16 / 9; } }
.sts-location-face-address { color: var(--sts-metin); }
/* Yorum plakası (yalnız onaylı kayıttan). */
.sts-review-face { margin: 0; }
.sts-review-face blockquote { margin: 0 0 var(--sts-a3); }
.sts-review-face figcaption { color: var(--sts-gri); font-size: 14px; }
/* Mahalle adları: düz metin dizisi, "·" ayraçlı. */
.sts-label-list { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; color: var(--sts-metin); font-size: var(--sts-y-kucuk); line-height: 1.9; }
.sts-label-list li:not(:last-child)::after { content: "·"; margin: 0 10px; color: var(--sts-gri-2); }

/* --- §19 Satır dökümü, harf bölmeleri, sekme çubuğu -------------------------- */
.sts-line-list { margin: 0; padding: 0; list-style: none; }
.sts-tally-row { display: flex; align-items: center; gap: var(--sts-a3); min-height: 50px; padding: 10px 2px; border-top: 1px solid var(--sts-cizgi-ince); }
.sts-tally-row:first-child { border-top: 0; }
.sts-tally-row > a { flex: 1; min-width: 0; color: var(--sts-grafit); font-weight: 500; text-decoration: none; overflow-wrap: anywhere; }
.sts-tally-row > a:hover { text-decoration: underline; text-decoration-color: var(--sts-ember); }
.sts-tally-row small { flex: 0 1 auto; min-width: 0; color: var(--sts-gri); font-size: 14px; text-align: right; font-variant-numeric: tabular-nums; }
.sts-tally-row:has(> a)::after { content: ""; flex: none; width: 16px; height: 16px; background: var(--sts-gri-2); -webkit-mask: var(--sts-m-ok) center / contain no-repeat; mask: var(--sts-m-ok) center / contain no-repeat; }
.sts-tally-row:has(> a:hover)::after { background: var(--sts-ember); }
.sts-tally-row > span { flex: 1; min-width: 0; }
.sts-line-list:not(.sts-line-list--columns, .sts-opening-items) > .sts-tally-row > span::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 10px 2px 0; background: var(--sts-grafit); border-radius: 2px; }
.sts-line-explain { display: inline-block; width: 100%; margin-top: 2px; color: var(--sts-gri); font-size: 14px; font-weight: 400; }
.sts-line-list--columns { columns: 1; column-gap: var(--sts-a6); }
.sts-line-list--columns .sts-tally-row { break-inside: avoid; min-height: 48px; border-top: 0; border-bottom: 1px solid var(--sts-cizgi-ince); }
.sts-line-list--quad { columns: 2; column-gap: var(--sts-a4); }
@media (max-width: 559px) { .sts-line-list--quad small { display: none; } }
@media (min-width: 560px) { .sts-line-list--columns { columns: 2; } }
@media (min-width: 1080px) {
  .sts-line-list--columns { columns: 3; }
  .sts-line-list--quad { columns: 4; }
  .sts-pair-left .sts-line-list--columns, .sts-plates > .sts-plate-card .sts-line-list--columns { columns: 2; }
}
/* Harf bölmeleri (A–Z dizinleri) + ad süzgeci. */
.sts-label-filtrate { max-width: 360px; margin-bottom: var(--sts-a4); }
.sts-letter-bays { columns: 1; column-gap: var(--sts-a6); }
@media (min-width: 560px) { .sts-letter-bays { columns: 2; } }
@media (min-width: 1080px) { .sts-letter-bays { columns: 4; } }
.sts-letter-bay { break-inside: avoid; margin-bottom: var(--sts-a4); }
.sts-letter-bay .sts-marked-tag { margin: 0; color: var(--sts-grafit); font-size: 15px; }
.sts-letter-bay .sts-tally-row { min-height: 44px; padding-block: 6px; }
.sts-letter-bay .sts-tally-row small { font-size: 13px; text-align: right; }
/* Sekme çubuğu: çelik-2 ray üstünde sekmeler; etkin sekme beyaz + yakut alt çizgi. */
.sts-tab-bar { display: flex; gap: 2px; width: max-content; max-width: 100%; margin: var(--sts-a4) 0; padding: 4px; overflow-x: auto; scrollbar-width: none; background: var(--sts-celik-2); border-radius: var(--sts-r); }
.sts-tab-bar::-webkit-scrollbar { display: none; }
.sts-tab-bar a, .sts-tab-bar button { flex: none; display: inline-flex; align-items: center; gap: 6px; min-height: 42px; padding: 0 16px; border: 0; background: transparent; color: var(--sts-gri); font: inherit; font-family: var(--sts-f-baslik); font-size: 15px; font-weight: 500; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background-color var(--sts-sure) var(--sts-egri), color var(--sts-sure) var(--sts-egri); }
.sts-tab-bar a:hover, .sts-tab-bar button:hover { color: var(--sts-grafit); background: var(--sts-celik-3); }
.sts-tab-bar [aria-selected="true"], .sts-tab-bar [aria-current="true"] { background: var(--sts-beyaz); color: var(--sts-grafit); font-weight: 600; box-shadow: inset 0 -2px 0 var(--sts-ember); }
.sts-tab-bar a:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-tab-bar sup { font-family: var(--sts-f-sayi); font-size: 12px; color: var(--sts-gri-2); font-variant-numeric: tabular-nums; vertical-align: baseline; }
.sts-tab-bar[data-az-harfler] { margin-top: 0; }
.sts-tab-bar[data-az-harfler] a { min-width: 44px; justify-content: center; padding: 0 12px; font-weight: 600; }
.sts-tab-face[hidden] { display: none; }
.sts-tab-face:focus-visible { outline-offset: 4px; }

/* ==========================================================================
   §20 SAYFA AİLELERİ (TASARIM-SISTEMI §08): ana sayfa bölümleri, cihaz,
   bölge, marka, hata kodu. Burada yalnız aileye özgü ekler.
   ========================================================================== */
/* Arıza bulucu (ana sayfa): JS yoksa gizli (aynı belirtiler cihaz sayfalarında). */
html:not(.sts-script) .sts-finder-section { display: none; }
.sts-sign-face { display: grid; gap: var(--sts-a5); grid-template-columns: minmax(0, 1fr); align-items: center; }
.sts-sign-face > * { min-width: 0; }
@media (min-width: 900px) { .sts-sign-face { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); } }
.sts-sign-face > .sts-drawing-frame { max-width: 420px; justify-self: center; width: 100%; }
.sts-sign-question-row { margin: 0 0 var(--sts-a3); font-family: var(--sts-f-baslik); font-size: var(--sts-y-3); font-weight: 600; color: var(--sts-grafit); }
.sts-sign-button-series { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.sts-sign-button-series button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 48px; padding: 8px 14px; border: 0; background: var(--sts-celik); color: var(--sts-metin); font: inherit; font-size: 15px; text-align: left; border-radius: var(--sts-r); cursor: pointer; transition: background-color var(--sts-sure) var(--sts-egri), box-shadow var(--sts-sure) var(--sts-egri); }
.sts-sign-button-series button span { flex: none; display: inline-grid; place-items: center; width: 28px; height: 22px; background: var(--sts-grafit); color: var(--sts-beyaz); font-family: var(--sts-f-sayi); font-size: 12px; font-weight: 700; border-radius: var(--sts-r); }
.sts-sign-button-series button:hover { background: var(--sts-celik-3); color: var(--sts-grafit); }
.sts-sign-button-series button[aria-pressed="true"] { background: var(--sts-beyaz); color: var(--sts-grafit); box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-sign-button-series button[aria-pressed="true"] span { background: var(--sts-ember); }
.sts-sign-button-series button:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-grafit); }
.sts-sign-state { min-height: 3em; margin: var(--sts-a4) 0; color: var(--sts-gri); font-size: 14px; }
.sts-sign-state b { color: var(--sts-grafit); }
/* Neden Servist Servis: dört plaka + katlanır fark dökümü. */
.sts-why-plateset h3 { margin: var(--sts-a3) 0 6px; }
.sts-why-plateset p { margin: 0; color: var(--sts-gri); font-size: var(--sts-y-kucuk); }
.sts-facet-icon { display: inline-grid; place-items: center; width: 44px; height: 44px; background: var(--sts-celik); color: var(--sts-grafit); border-radius: var(--sts-r); }
.sts-diff-list { padding: 18px 22px; }
.sts-diff-list summary { display: flex; justify-content: space-between; gap: 12px; list-style: none; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); cursor: pointer; }
.sts-diff-list summary::-webkit-details-marker { display: none; }
.sts-diff-list summary::after { content: ""; flex: none; width: 18px; height: 18px; background: var(--sts-grafit); -webkit-mask: var(--sts-m-asagi) center / contain no-repeat; mask: var(--sts-m-asagi) center / contain no-repeat; }
.sts-diff-list[open] summary::after { transform: rotate(180deg); background: var(--sts-ember); }
.sts-diff-list dl { display: grid; margin: var(--sts-a4) 0 0; }
.sts-diff-list dl > div { display: grid; gap: 4px 24px; padding: 12px 0; border-top: 1px solid var(--sts-cizgi-ince); }
@media (min-width: 720px) { .sts-diff-list dl > div { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.sts-diff-list dt { color: var(--sts-gri); text-decoration: line-through; text-decoration-color: var(--sts-cizgi-sert); }
.sts-diff-list dd { margin: 0; color: var(--sts-metin); }
/* İl ve ilçeler (ana sayfa, çelik kesit): başlık + ölçü değerleri, harita, dizin. */
.sts-prov-face-head { display: grid; gap: var(--sts-a5); margin-bottom: var(--sts-a5); }
@media (min-width: 900px) { .sts-prov-face-head { grid-template-columns: minmax(0, 1fr) auto; align-items: end; } }
.sts-prov-face-head h2 { margin: 0 0 8px; }
.sts-prov-face-head p { margin: 0; color: var(--sts-gri); }
.sts-prov-sizes { display: flex; margin: 0; box-shadow: inset 0 0 0 1px var(--sts-cizgi-sert); background: var(--sts-beyaz); }
.sts-prov-sizes div { display: flex; flex-direction: column; padding: 12px 18px; }
.sts-prov-sizes div + div { border-left: 1px solid var(--sts-cizgi); }
.sts-prov-sizes dd { margin: 0; font-family: var(--sts-f-sayi); font-size: clamp(2rem, 1.6rem + 1.8vw, 3.25rem); font-weight: 700; line-height: 1; color: var(--sts-grafit); font-variant-numeric: tabular-nums; }
.sts-prov-sizes dt { margin-top: 6px; font-family: var(--sts-f-baslik); font-size: 12.5px; font-weight: 600; color: var(--sts-gri); }
.sts-prov-list { margin-top: var(--sts-a4); }
.sts-prov-list summary { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--sts-f-baslik); font-weight: 600; color: var(--sts-grafit); cursor: pointer; }
/* Resmi hat kesitinden sonra gelen iki yan (küçük alet, marka × cihaz) nefes alsın. */
#sts-official-rule + .sts-plate-shell { margin-top: var(--sts-bolum); }
.sts-pair-left > .sts-plate-card > .sts-card-head + .sts-field-desc { margin-top: calc(var(--sts-a3) * -1); }
.sts-pair-left > .sts-plate-card > p { max-width: 68ch; }
.sts-pair-left > .sts-plate-card > .sts-plates--device { margin-top: var(--sts-a2); }
.sts-plate-card .sts-dense-wanted-row .sts-dense-plates { margin: 0; }

/* --- Hareket azaltma, yazdırma ------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media print {
  .sts-top-plate, .sts-foot-plate, .sts-plate-drawer, .sts-plate-drawer-cover, .sts-cookie-face, .sts-last-plate-section, .sts-seek-plate, .sts-tab-bar { display: none !important; }
  .sts-tab-face[hidden] { display: block !important; }
  .sts-code-drop-detail { display: block; }
  .sts-folded-plate > summary::after { display: none; }
}

/* Çerçeve iskeleti (ISKELET-STS): üst bant, başlık çipleri, özellik şeridi,
   servis bilgileri, adım ve hizmet listesi, hizmet kartları, neden biz, marka
   çipleri. Renk ve yazı kendi belirteçlerimizden; sınıf adları sts- önekli. */
.sts-frame-bar { background: var(--sts-ember); color: #0e1013; }
.sts-frame-bar p { margin: 0; padding: 6px var(--sts-kenar); text-align: center; font: 700 14px/1.35 var(--sts-f-govde); }
.sts-frame-bar a { color: #0e1013; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.sts-frame-bar-note { display: none; }
@media (min-width: 720px) { .sts-frame-bar-note { display: inline; } }
.sts-frame-chips { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sts-frame-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--sts-cizgi); border-radius: var(--sts-r-kucuk); font: 700 13px/1 var(--sts-f-baslik); letter-spacing: .05em; text-transform: uppercase; color: var(--sts-metin); }
.sts-frame-chip--ember { background: var(--sts-ember); border-color: var(--sts-ember); color: #0e1013; }
/* Başlık bandı iki sütun (1080px+): sol metin ve eylemler, sağ hızlı iletişim kartı; mobilde kart metnin altında. */
.sts-frame-hero-grid { display: grid; gap: var(--sts-a6); align-items: center; }
.sts-frame-hero-grid > * { min-width: 0; }
@media (min-width: 1080px) { .sts-frame-hero-grid { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--sts-a8); } }
.sts-frame-hero-card { background: var(--sts-celik); border: 1px solid var(--sts-cizgi); border-top: 3px solid var(--sts-ember); border-radius: var(--sts-r-kart); padding: 22px; }
.sts-frame-hero-card h2 { margin: 6px 0 4px; font: 700 22px/1.15 var(--sts-f-baslik); color: var(--sts-grafit); }
.sts-frame-hero-phone { display: inline-flex; align-items: center; gap: 10px; margin: 10px 0 14px; font: 800 28px/1.1 var(--sts-f-baslik); color: var(--sts-grafit); text-decoration: none; }
.sts-frame-hero-phone svg { color: var(--sts-ember); flex: none; }
.sts-frame-hero-list { list-style: none; margin: 0; padding: 0; }
.sts-frame-hero-list li { display: grid; gap: 2px; padding: 10px 0; border-top: 1px solid var(--sts-cizgi-ince); color: var(--sts-grafit); font: 700 16px/1.35 var(--sts-f-govde); }
.sts-frame-hero-list span { color: var(--sts-gri); font: 600 13px/1.2 var(--sts-f-baslik); letter-spacing: .05em; text-transform: uppercase; }
.sts-frame-strip { background: var(--sts-celik); border-top: 1px solid var(--sts-cizgi-ince); border-bottom: 1px solid var(--sts-cizgi-ince); }
.sts-frame-strip-list { list-style: none; margin: 0; padding-top: 14px; padding-bottom: 14px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.sts-frame-strip-list li { display: flex; align-items: center; gap: 10px; color: var(--sts-grafit); font: 700 15px/1.25 var(--sts-f-govde); }
.sts-frame-strip-list svg { color: var(--sts-ember); flex: none; }
@media (min-width: 1080px) { .sts-frame-strip-list { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
.sts-frame-info-grid { display: grid; gap: var(--sts-oluk); }
@media (min-width: 1080px) { .sts-frame-info-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; } }
.sts-frame-answer, .sts-frame-facts, .sts-frame-steps, .sts-frame-services, .sts-frame-table-wrap, .sts-frame-card, .sts-frame-why-card { background: var(--sts-celik); border: 1px solid var(--sts-cizgi); border-radius: var(--sts-r-kart); padding: 22px; }
.sts-frame-answer { border-top: 3px solid var(--sts-ember); }
.sts-frame-answer h3, .sts-frame-facts h3, .sts-frame-card h3, .sts-frame-why-card h3, .sts-frame-steps-list h3 { margin: 6px 0 10px; font: 700 22px/1.15 var(--sts-f-baslik); color: var(--sts-grafit); }
.sts-frame-answer p { color: var(--sts-metin); font: 400 16px/1.6 var(--sts-f-govde); margin: 0 0 10px; }
.sts-frame-answer .sts-facet-actions { margin-top: 16px; }
.sts-frame-facts .sts-side-plate-fieldset { margin: 0; }
.sts-frame-facts dt { color: var(--sts-gri); font: 600 13px/1.2 var(--sts-f-baslik); letter-spacing: .05em; text-transform: uppercase; }
.sts-frame-facts dd { margin: 2px 0 12px; color: var(--sts-grafit); font: 700 17px/1.35 var(--sts-f-govde); }
.sts-frame-two-grid { display: grid; gap: var(--sts-oluk); }
@media (min-width: 1080px) { .sts-frame-two-grid { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } }
.sts-frame-two h2, .sts-frame-table-wrap h2, .sts-frame-steps h2, .sts-frame-services h2 { font: 700 24px/1.15 var(--sts-f-baslik); color: var(--sts-grafit); margin: 0 0 14px; }
.sts-frame-steps-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; counter-reset: sts-frame-step; }
.sts-frame-steps-list li { display: flex; gap: 14px; align-items: flex-start; }
.sts-frame-steps-list p { margin: 0; color: var(--sts-metin); font: 400 15px/1.55 var(--sts-f-govde); }
.sts-frame-step-no { flex: none; width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; background: var(--sts-ember); color: #0e1013; border-radius: var(--sts-r); font: 800 18px/1 var(--sts-f-baslik); }
.sts-frame-service-list { list-style: none; margin: 0; padding: 0; }
.sts-frame-service-list li { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 0; border-top: 1px solid var(--sts-cizgi-ince); }
.sts-frame-service-list li:first-child { border-top: 0; }
.sts-frame-service-list a { color: var(--sts-grafit); font: 700 17px/1.3 var(--sts-f-govde); text-decoration: none; }
.sts-frame-service-list small { color: var(--sts-gri); font: 600 13px/1 var(--sts-f-baslik); letter-spacing: .04em; }
.sts-frame-pair { margin-top: var(--sts-oluk); }
.sts-frame-cards .sts-frame-card-grid { display: grid; gap: var(--sts-oluk); }
@media (min-width: 720px) { .sts-frame-cards .sts-frame-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) { .sts-frame-cards .sts-frame-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.sts-frame-card { padding: 0; overflow: hidden; }
.sts-frame-card img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-bottom: 1px solid var(--sts-cizgi); }
.sts-frame-card-body { padding: 18px 20px 20px; }
.sts-frame-card-body h3 { margin-top: 0; }
.sts-frame-card-body h3 a { color: inherit; text-decoration: none; }
.sts-frame-card-body p { margin: 0 0 12px; color: var(--sts-metin); font: 400 15px/1.5 var(--sts-f-govde); }
.sts-frame-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.sts-frame-tags li { padding: 4px 9px; border-radius: var(--sts-r-kucuk); background: var(--sts-celik-2); border: 1px solid var(--sts-cizgi); color: var(--sts-gri); font: 600 12px/1.2 var(--sts-f-govde); }
.sts-frame-faq-grid { display: grid; gap: var(--sts-oluk); }
@media (min-width: 1080px) { .sts-frame-faq-grid { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: start; } }
.sts-frame-table { width: 100%; border-collapse: collapse; font: 400 15px/1.5 var(--sts-f-govde); }
.sts-frame-table th, .sts-frame-table td { text-align: left; padding: 10px 0; border-top: 1px solid var(--sts-cizgi-ince); vertical-align: top; }
.sts-frame-table th { width: 40%; color: var(--sts-gri); font-weight: 600; padding-right: 10px; }
.sts-frame-table td { color: var(--sts-grafit); }
.sts-frame-table td a { color: var(--sts-grafit); font-weight: 700; }
.sts-frame-why-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sts-oluk); }
@media (min-width: 1080px) { .sts-frame-why-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.sts-frame-why-card svg { color: var(--sts-ember); }
.sts-frame-why-card h3 { font-size: 20px; }
.sts-frame-why-card p { margin: 0; color: var(--sts-metin); font: 400 15px/1.5 var(--sts-f-govde); }
.sts-frame-chip-grid { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.sts-frame-chip-grid a { display: inline-block; padding: 9px 13px; border: 1px solid var(--sts-cizgi); border-radius: var(--sts-r-kucuk); background: var(--sts-celik); color: var(--sts-grafit); font: 700 15px/1.2 var(--sts-f-govde); text-decoration: none; }
.sts-frame-chip-grid a:hover, .sts-frame-chip-grid a:focus-visible { border-color: var(--sts-ember); color: var(--sts-ember-bas); }
.sts-top-plate-call { display: inline-flex; }
@media (min-width: 1560px) { .sts-top-plate-call { display: none; } }
/* Çağrı bandı (ana sayfa): vurgulu ember zemin, koyu metin; düğme ters renkte. */
.sts-frame-band { background: var(--sts-ember); color: var(--sts-ember-ust); padding: 34px 0; }
.sts-frame-band-grid { display: grid; gap: 18px; align-items: center; }
@media (min-width: 1080px) { .sts-frame-band-grid { grid-template-columns: minmax(0, 1fr) auto; } }
.sts-frame-band h2 { margin: 0 0 8px; font: 800 30px/1.1 var(--sts-f-baslik); color: var(--sts-ember-ust); }
.sts-frame-band p { margin: 0; font: 500 16px/1.5 var(--sts-f-govde); color: var(--sts-ember-ust); }
.sts-frame-band-call { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.sts-frame-band-phone { font: 800 30px/1 var(--sts-f-baslik); color: var(--sts-ember-ust); text-decoration: none; }
.sts-frame-band-button { background: var(--sts-ember-ust); color: var(--sts-ember); }
.sts-frame-band-button:hover, .sts-frame-band-button:focus-visible { background: var(--sts-celik); color: var(--sts-ember-bas); }

/* ==========================================================================
   §50 LACİVERT VE TURUNCU GÖRÜNÜM (23 Eki 2026, TASARIM-SISTEMI §01)
   Sayfa çok açık gri; kartlar beyaz, 20 px köşe, yumuşak gölge. Başlık bandı,
   yanıt kartı ve altbilgi koyu lacivert; vurgu turuncu (düğme, hap etiket,
   numara, ikon). Başlıklar Saira Condensed büyük harf (lang="tr": i → İ).
   Koyu yüzeylerde metin belirteçleri yerel olarak açık tonlara çevrilir.
   ========================================================================== */
body { background: var(--sts-sayfa); }
::selection { background: var(--sts-ember); color: var(--sts-ember-ust); }

/* --- §50.1 Plaka yüzeyleri: beyaz, yuvarlak, gölgeli; köşe imi yok ------- */
.sts-plate-card, .sts-side-plate, .sts-first-plate, .sts-form-face, .sts-job-face,
.sts-type-tagged, .sts-last-plate, .sts-seek-plate, .sts-plate-note, .sts-plate-drop-roster,
.sts-drawing-frame, .sts-rule-face, .sts-mark-face, .sts-location-face,
.sts-size-row, .sts-suggest-register, .sts-cookie-face, .sts-code-drop-detail[open], .sts-diff-list { --p-kenar: var(--sts-cizgi-ince); }
.sts-plate-card::before, .sts-side-plate::before, .sts-first-plate::before, .sts-form-face::before,
.sts-job-face::before, .sts-last-plate::before, .sts-seek-plate::before, .sts-plate-drop-roster::before,
.sts-rule-face::before, .sts-mark-face::before, .sts-location-face::before, .sts-suggest-register::before,
.sts-cookie-face::before, .sts-diff-list::before {
  border-radius: var(--sts-r-kart);
  box-shadow: inset 0 0 0 1px var(--p-kenar), var(--sts-golge-1);
}
.sts-plate-note::before, .sts-size-row::before, .sts-type-tagged::before, .sts-code-drop-detail[open]::before, .sts-drawing-frame::before { border-radius: 14px; }
.sts-plate-card--steel::before, .sts-plate-card .sts-plate-card::before { box-shadow: inset 0 0 0 1px var(--p-kenar); }
.sts-plate-card--marked::after, .sts-first-plate::after, .sts-type-tagged::after, .sts-last-plate::after,
.sts-seek-plate::after, .sts-drawing-frame::after, .sts-rule-face::after, .sts-cookie-face::after { display: none; }
/* Üst kenarda lacivertten turuncuya ince şerit: yan plaka ve form plakası. */
.sts-side-plate::after, .sts-form-face::after {
  left: 0; right: 0; top: 0; width: auto; height: 4px;
  background: linear-gradient(90deg, var(--sts-lacivert), var(--sts-kraliyet) 45%, var(--sts-ember-isik));
  border-radius: var(--sts-r-kart) var(--sts-r-kart) 0 0;
}
.sts-side-plate { --p-zemin: var(--sts-beyaz); --p-kenar: var(--sts-cizgi-ince); padding: 28px 24px 24px; }
.sts-plate-card { padding: 26px; }
@media (max-width: 719px) { .sts-plate-card { padding: 20px 18px; } }
a.sts-plate-card { transition: transform var(--sts-sure) var(--sts-egri); }
a.sts-plate-card:hover { transform: translateY(-2px); --p-kenar: var(--sts-ember-isik); }
.sts-plate-section--steel { background: var(--sts-beyaz); border-block: 1px solid var(--sts-cizgi-ince); }
.sts-plate-section--steel .sts-plate-card { --p-zemin: var(--sts-sayfa); }

/* --- §50.2 Başlıklar: bölüm başı ortalı, turuncu hap üst etiket --------- */
h1, .sts-plate-banner { font-weight: 700; text-transform: uppercase; letter-spacing: 0; }
.sts-plate-heading { flex-direction: column; align-items: center; justify-content: flex-start; gap: 14px; margin-bottom: 34px; padding-top: 0; border-top: 0; text-align: center; }
.sts-plate-heading::before, .sts-plate-heading::after { display: none; }
.sts-plate-heading > div { display: flex; flex-direction: column; align-items: center; max-width: 820px; }
.sts-plate-heading > div:not(:has(> .sts-marked-tag))::before { content: ""; width: 46px; height: 5px; margin-bottom: 16px; border-radius: var(--sts-r-hap); background: var(--sts-gr-ember); }
.sts-plate-heading h2 { font-size: clamp(1.75rem, 1.25rem + 2.2vw, 2.875rem); font-weight: 700; line-height: 1.02; text-transform: uppercase; letter-spacing: 0.002em; }
.sts-plate-heading p { margin: 12px auto 0; max-width: 62ch; color: var(--sts-gri); font-size: 1rem; line-height: 1.55; }
.sts-plate-heading .sts-marked-tag, .sts-frame-eyebrow {
  display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 7px 16px;
  border-radius: var(--sts-r-hap); background-color: var(--sts-ember); background-image: var(--sts-gr-ember);
  color: #fff; font-family: var(--sts-f-govde); font-size: 12.5px; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase;
  box-shadow: var(--sts-parilti);
}
.sts-plate-heading .sts-marked-tag::before { width: 7px; height: 7px; background: #fff; border-radius: 50%; }
/* Kart içi küçük üst etiket: turuncu, büyük harf. */
.sts-marked-tag { font-family: var(--sts-f-govde); font-size: 12px; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sts-ember); }
.sts-marked-tag::before { width: 8px; height: 8px; border-radius: 50%; background: var(--sts-ember-isik); }
.sts-card-head h2 { font-weight: 700; text-transform: uppercase; letter-spacing: 0.005em; }
.sts-plate-text h2, .sts-plate-text h3 { color: var(--sts-grafit); }

/* --- §50.3 Düğmeler: hap biçimi, turuncu geçişli birincil, parıltı ------- */
.sts-facet-button { border-radius: var(--sts-r-hap); font-weight: 700; letter-spacing: 0.015em; transition: background-color var(--sts-sure) var(--sts-egri), color var(--sts-sure) var(--sts-egri), transform var(--sts-sure) var(--sts-egri), box-shadow var(--sts-sure) var(--sts-egri); }
.sts-facet-button--ember { background-color: var(--sts-ember); background-image: var(--sts-gr-ember); color: var(--sts-ember-ust); box-shadow: var(--sts-parilti); }
.sts-facet-button--ember:hover { background-image: none; background-color: var(--sts-ember-bas); color: var(--sts-ember-ust); transform: translateY(-1px); }
.sts-facet-button--lined { background: var(--sts-beyaz); color: var(--sts-grafit); box-shadow: inset 0 0 0 1.5px var(--sts-cizgi); }
.sts-facet-button--lined:hover { background: var(--sts-grafit); color: #fff; box-shadow: inset 0 0 0 1.5px var(--sts-grafit); }
.sts-facet-button--dark { color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.55); }
.sts-facet-button--dark:hover { background: #fff; color: var(--sts-grafit); }
.sts-facet-button--plain:hover { background: var(--sts-celik-2); }
.sts-facet-button:focus-visible, .sts-facet-button--ember:focus-visible { outline: 3px solid var(--sts-ember-isik); outline-offset: 2px; box-shadow: none; }
.sts-facet-arrow::after { border-radius: 50%; background-color: var(--sts-lacivert); }
.sts-facet-arrow:hover::after { background-color: var(--sts-ember); }

/* --- §50.4 Üst bant, başlık, menü, çekmece --------------------------------- */
.sts-frame-bar { position: relative; background: var(--sts-gece); color: #fff; }
.sts-frame-bar p { max-width: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 4px 8px; padding: 7px var(--sts-kenar); font: 600 13.5px/1.3 var(--sts-f-govde); letter-spacing: 0.01em; }
.sts-frame-bar strong { color: #fff; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.sts-frame-bar strong::before { content: ""; display: inline-block; width: 8px; height: 8px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--sts-ember-isik); box-shadow: 0 0 0 3px rgba(251, 138, 60, 0.25); }
.sts-frame-bar-note { color: var(--sts-acik-yazi); }
.sts-frame-bar a { display: inline-flex; align-items: center; min-height: 28px; padding: 0 14px; border-radius: var(--sts-r-hap); background-color: var(--sts-ember); background-image: var(--sts-gr-ember); color: #fff; font-weight: 800; text-decoration: none; letter-spacing: 0.02em; }
.sts-frame-bar a:hover { background-image: none; background-color: var(--sts-ember-bas); color: #fff; }
.sts-top-plate { background: #ffffff; border-top: 3px solid var(--sts-ember-isik); border-bottom: 1px solid var(--sts-cizgi-ince); box-shadow: 0 10px 30px -24px rgba(11, 26, 71, 0.55); }
.sts-top-plate::after { display: none; }
.sts-top-plate-inner { gap: var(--sts-a3); }
.sts-top-plate-mark { display: flex; align-items: center; gap: 10px; }
.sts-top-plate-mark::before { content: ""; display: none; flex: none; width: 42px; height: 42px; border-radius: 13px; background: var(--sts-ikon-anahtar) center / 22px 22px no-repeat, var(--sts-gr-lacivert); box-shadow: 0 8px 18px -10px rgba(11, 26, 71, 0.7); }
@media (min-width: 480px) { .sts-top-plate-mark::before { display: block; } }
.sts-top-plate-mark img { height: 24px; }
@media (min-width: 720px) { .sts-top-plate-mark img { height: 28px; } }
.sts-top-plate-menu > li > a { font-size: 16px; font-weight: 700; color: var(--sts-grafit); border-radius: var(--sts-r-hap); }
.sts-top-plate-menu > li > a:hover { color: var(--sts-ember); background: var(--sts-ember-acik); }
.sts-top-plate-menu > li > a[aria-current] { color: var(--sts-ember); box-shadow: none; background: var(--sts-ember-acik); }
.sts-plate-drop-roster { padding: 10px; }
.sts-plate-drop-roster a { border-radius: 10px; }
.sts-plate-drop-roster a:hover { background: var(--sts-ember-acik); color: var(--sts-ember-bas); }
.sts-top-plate-tel { padding: 0 16px; border-radius: var(--sts-r-hap); background: var(--sts-celik); color: var(--sts-grafit); }
.sts-top-plate-tel:hover { background: var(--sts-ember-acik); }
.sts-top-plate-call { width: 46px; min-height: 46px; border-radius: 14px; }
.sts-top-plate-menu-unfold { gap: 8px; background: var(--sts-gr-lacivert); color: #fff; box-shadow: 0 8px 18px -10px rgba(11, 26, 71, 0.8); }
.sts-top-plate-menu-unfold::before { content: ""; flex: none; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--sts-m-menu) center / contain no-repeat; mask: var(--sts-m-menu) center / contain no-repeat; }
.sts-top-plate-menu-unfold:hover { background: var(--sts-lacivert); color: #fff; box-shadow: none; }
@media (max-width: 479px) {
  .sts-top-plate-menu-unfold { width: 46px; min-height: 46px; padding: 0; font-size: 0; border-radius: 14px; }
  .sts-top-plate-call { order: 1; }
  .sts-top-plate-menu-unfold { order: 2; }
}
.sts-search-casing { border-radius: var(--sts-r-hap); background: var(--sts-beyaz); box-shadow: inset 0 0 0 1.5px var(--sts-cizgi); }
.sts-search-casing button { border-radius: 50%; background: var(--sts-lacivert); }
.sts-search-casing--big button { background: var(--sts-ember); }
.sts-plate-drawer-cover { background: rgba(6, 15, 46, 0.6); backdrop-filter: blur(3px); }
.sts-plate-drawer { padding-top: 0; background: var(--sts-sayfa); box-shadow: -20px 0 60px -30px rgba(6, 15, 46, 0.6); }
@media (min-width: 421px) { .sts-plate-drawer { border-radius: 24px 0 0 24px; } }
.sts-plate-drawer-head { position: sticky; top: 0; z-index: 2; margin: 0 calc(var(--sts-a5) * -1) var(--sts-a4); padding: 14px var(--sts-a5); background: rgba(255, 255, 255, 0.97); border-bottom: 1px solid var(--sts-cizgi-ince); }
.sts-plate-drawer-head::after { display: none; }
.sts-plate-drawer-group { margin-top: var(--sts-a4); padding: 16px 18px 6px; background: var(--sts-beyaz); border: 1px solid var(--sts-cizgi-ince); border-radius: 18px; }
.sts-plate-drawer-group h2 { font-size: 1.25rem; text-transform: uppercase; }
.sts-plate-drawer-group h2 a[aria-current] { color: var(--sts-ember); }
.sts-plate-drawer-group .sts-tally-row { min-height: 46px; }
.sts-plate-drawer-lowest { border-top: 0; }

/* --- §50.5 Başlık bandı: koyu lacivert, tam genişlik, ortalı ------------ */
.sts-page-face {
  --sts-grafit: #ffffff; --sts-metin: var(--sts-acik-yazi); --sts-gri: var(--sts-acik-gri); --sts-gri-2: var(--sts-acik-gri);
  --sts-cizgi: rgba(255, 255, 255, 0.2); --sts-cizgi-ince: rgba(255, 255, 255, 0.12); --sts-cizgi-sert: rgba(255, 255, 255, 0.5);
  position: relative; isolation: isolate; padding-top: 34px; padding-bottom: 72px; color: var(--sts-metin);
  border-image: linear-gradient(180deg, #071338 0%, #0c1f5c 58%, #142d82 100%) fill 0 / / 0 100vw;
}
/* Bandın ortasında kraliyet mavisi ışık ve sağ altta turuncu yansıma (kabın içinde kalır, taşmaz). */
.sts-page-face::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: radial-gradient(46% 62% at 50% 0%, rgba(56, 98, 230, 0.5), transparent 72%), radial-gradient(30% 40% at 70% 100%, rgba(251, 138, 60, 0.12), transparent 70%); }
@media (min-width: 1080px) { .sts-page-face { padding-top: 48px; padding-bottom: 96px; } }
/* Bandın içindeki beyaz kartlar açık yüzey belirteçlerine döner. */
.sts-page-face :is(.sts-first-plate, .sts-drawing-frame, .sts-plate-card, .sts-side-plate, .sts-rule-face, .sts-mark-face, .sts-search-casing, .sts-suggest-register, .sts-size-row) {
  --sts-grafit: #0c1d4f; --sts-metin: #334063; --sts-gri: #4f5b78; --sts-gri-2: #5e6a86;
  --sts-cizgi: #d3dbe8; --sts-cizgi-ince: #e4e9f2; --sts-cizgi-sert: #7c88a3;
  color: var(--sts-metin);
}
.sts-page-face h1, .sts-page-face .sts-plate-banner { color: #fff; font-size: clamp(2.25rem, 1.45rem + 3.6vw, 4.25rem); line-height: 1; text-shadow: 0 2px 24px rgba(4, 10, 40, 0.35); }
.sts-page-face .sts-plate-entry { color: var(--sts-acik-yazi); font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem); }
.sts-page-face .sts-plate-road, .sts-page-face .sts-plate-road a { color: var(--sts-acik-gri); }
.sts-page-face .sts-plate-road [aria-current] { color: #fff; }
.sts-page-face .sts-plate-road li + li::before { color: var(--sts-ember-isik); }
.sts-page-face .sts-marked-tag { color: var(--sts-ember-isik); }
.sts-page-face .sts-facet-button--lined { background: rgba(255, 255, 255, 0.07); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.4); }
.sts-page-face .sts-facet-button--lined:hover { background: #fff; color: var(--sts-lacivert); }
.sts-page-face .sts-facet-button { min-height: 56px; padding: 0 28px; font-size: 17px; }
.sts-page-face .sts-facet-chip { background: rgba(255, 255, 255, 0.08); color: #fff; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22); border-radius: var(--sts-r-hap); }
.sts-page-face a.sts-facet-chip:hover { background: #fff; color: var(--sts-lacivert); }
.sts-page-face .sts-tab-bar { background: rgba(255, 255, 255, 0.08); border-radius: var(--sts-r-hap); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14); }
.sts-page-face .sts-tab-bar a { border-radius: var(--sts-r-hap); color: var(--sts-acik-yazi); }
.sts-page-face .sts-tab-bar a:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
.sts-page-face .sts-tab-bar [aria-current="true"], .sts-page-face .sts-tab-bar [aria-selected="true"] { background: #fff; color: var(--sts-lacivert); box-shadow: none; }
.sts-page-face + .sts-plate-shell, .sts-page-face + .sts-plate-section { margin-top: var(--sts-a7); }
/* Hap çipler (bandın üstünde): ilki turuncu, diğerleri cam. */
.sts-frame-chips { gap: 10px; }
.sts-frame-chip { min-height: 36px; padding: 0 16px; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: var(--sts-r-hap); background: rgba(255, 255, 255, 0.07); color: #fff; font: 700 13px/1 var(--sts-f-govde); letter-spacing: 0.06em; }
.sts-frame-chip--ember { border-color: transparent; background-color: var(--sts-ember); background-image: var(--sts-gr-ember); color: #fff; box-shadow: var(--sts-parilti); }
/* Çerçeve ve ana sayfa bandı: metin ortalı. */
.sts-frame-hero .sts-frame-hero-grid { grid-template-columns: minmax(0, 1fr); justify-items: center; gap: var(--sts-a6); }
.sts-frame-hero .sts-page-face-body { display: flex; flex-direction: column; align-items: center; max-width: 900px; text-align: center; }
.sts-frame-hero .sts-frame-chips, .sts-frame-hero .sts-facet-actions, .sts-frame-hero .sts-plate-road { justify-content: center; }
.sts-frame-hero .sts-plate-entry { margin-inline: auto; max-width: 62ch; }
.sts-frame-hero .sts-tab-bar { margin-inline: auto; }
/* Hızlı iletişim: bandın altında cam şerit. */
.sts-frame-hero-card { width: 100%; max-width: 1040px; display: grid; gap: 14px 28px; padding: 22px; background: rgba(255, 255, 255, 0.06); border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 24px; text-align: left; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.sts-frame-hero-card .sts-marked-tag { margin: 0; }
.sts-frame-hero-card h2 { margin: 0; color: #fff; font: 700 clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem)/1.05 var(--sts-f-baslik); text-transform: uppercase; }
.sts-frame-hero-phone { margin: 0; color: #fff; font-size: clamp(1.75rem, 1.5rem + 1.2vw, 2.25rem); }
.sts-frame-hero-phone svg { color: var(--sts-ember-isik); }
.sts-frame-hero-phone:hover { color: var(--sts-ember-isik); }
.sts-frame-hero-list { display: grid; gap: 10px; }
.sts-frame-hero-list li { padding: 12px 16px; border: 1px solid rgba(255, 255, 255, 0.14); border-radius: 16px; background: rgba(255, 255, 255, 0.05); color: #fff; }
.sts-frame-hero-list span { color: var(--sts-acik-gri); font-size: 11.5px; letter-spacing: 0.1em; }
@media (min-width: 900px) {
  .sts-frame-hero-card { grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.6fr); align-items: center; padding: 26px 30px; }
  .sts-frame-hero-card > :not(.sts-frame-hero-list) { grid-column: 1; }
  .sts-frame-hero-list { grid-column: 2; grid-row: 1 / span 3; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
/* Ana sayfa açılışı: mobilde ortalı, geniş ekranda metin solda, çizim kartı sağda. */
.sts-opening-section { padding-top: 40px; }
@media (min-width: 1080px) { .sts-opening-section { padding-top: 64px; } }
@media (max-width: 1079px) {
  .sts-opening-text { display: flex; flex-direction: column; align-items: center; text-align: center; }
  .sts-opening-text .sts-frame-chips, .sts-opening-text .sts-facet-actions, .sts-opening-text .sts-dense-plates { justify-content: center; }
  .sts-opening-text .sts-plate-entry { margin-inline: auto; }
}
.sts-principle-face { gap: 8px; box-shadow: none; }
.sts-principle-face li { padding: 12px 14px; border: 1px solid rgba(255, 255, 255, 0.16); border-radius: 16px; background: rgba(255, 255, 255, 0.06); color: #fff; text-align: left; }
.sts-principle-face li + li { border-left: 1px solid rgba(255, 255, 255, 0.16); }
.sts-principle-face small { color: var(--sts-ember-isik); letter-spacing: 0.1em; text-transform: uppercase; }
.sts-page-face .sts-dense-wanted-row > span { color: var(--sts-acik-gri); letter-spacing: 0.08em; text-transform: uppercase; }
.sts-first-plate { padding: 20px; }
.sts-first-plate::before { box-shadow: 0 30px 70px -30px rgba(2, 8, 30, 0.8); }
.sts-part-table { border-radius: 14px; overflow: hidden; }
.sts-part-table b { border-radius: 6px; background: var(--sts-lacivert); }

/* --- §50.6 Öne çıkanlar şeridi: bandın altına binen beyaz kart ---------- */
.sts-frame-strip { position: relative; z-index: 2; margin-top: -40px; background: transparent; border: 0; }
.sts-frame-strip-list { margin-inline: auto; width: calc(100% - 2 * var(--sts-kenar)); max-width: calc(var(--sts-kap) - 2 * var(--sts-kenar)); padding: 16px; background: var(--sts-beyaz); border: 1px solid var(--sts-cizgi-ince); border-radius: var(--sts-r-kart); box-shadow: var(--sts-golge-2); gap: 10px; }
.sts-frame-strip-list li { gap: 12px; padding: 8px; color: var(--sts-grafit); font: 700 14.5px/1.25 var(--sts-f-govde); }
.sts-frame-strip-list li:last-child:nth-child(odd) { grid-column: 1 / -1; justify-content: center; }
.sts-frame-strip-list svg { flex: none; width: 40px; height: 40px; padding: 9px; border-radius: 12px; background: var(--sts-ember-acik); color: var(--sts-ember); }
@media (min-width: 1080px) {
  .sts-frame-strip { margin-top: -48px; }
  .sts-frame-strip-list { padding: 18px 22px; }
  .sts-frame-strip-list li:last-child:nth-child(odd) { grid-column: auto; justify-content: flex-start; }
  .sts-frame-strip-list li + li { border-left: 1px solid var(--sts-cizgi-ince); padding-left: 16px; }
}
.sts-frame-strip + .sts-plate-section { margin-top: var(--sts-a7); }

/* --- §50.7 Servis bilgileri, adımlar, hizmetler, kısa sorular ------------ */
.sts-frame-answer, .sts-frame-facts, .sts-frame-steps, .sts-frame-services, .sts-frame-table-wrap, .sts-frame-card, .sts-frame-why-card { background: var(--sts-beyaz); border: 1px solid var(--sts-cizgi-ince); border-radius: var(--sts-r-kart); padding: 28px; box-shadow: var(--sts-golge-1); }
@media (max-width: 719px) { .sts-frame-answer, .sts-frame-facts, .sts-frame-steps, .sts-frame-services, .sts-frame-table-wrap, .sts-frame-why-card { padding: 22px 18px; } }
.sts-frame-answer h3, .sts-frame-facts h3, .sts-frame-card h3, .sts-frame-why-card h3 { text-transform: uppercase; }
/* Ana soru kartı: lacivert yüzey. */
.sts-frame-answer {
  --sts-grafit: #ffffff; --sts-metin: var(--sts-acik-yazi); --sts-gri: var(--sts-acik-gri); --sts-cizgi: rgba(255, 255, 255, 0.2);
  position: relative; overflow: hidden; border: 0; border-top: 0; background: var(--sts-gr-lacivert); color: var(--sts-metin); box-shadow: var(--sts-golge-2);
}
.sts-frame-answer::after { content: ""; position: absolute; right: -80px; bottom: -80px; width: 240px; height: 240px; border-radius: 50%; background: radial-gradient(closest-side, rgba(251, 138, 60, 0.28), transparent); pointer-events: none; }
.sts-frame-answer h3 { color: #fff; font-size: clamp(1.5rem, 1.25rem + 1vw, 2rem); line-height: 1.05; }
.sts-frame-answer p { color: var(--sts-acik-yazi); }
.sts-frame-answer .sts-marked-tag { color: var(--sts-ember-isik); font: 800 12px/1.25 var(--sts-f-govde); letter-spacing: 0.1em; }
.sts-frame-answer .sts-facet-button--lined { background: rgba(255, 255, 255, 0.08); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.4); }
.sts-frame-answer .sts-facet-button--lined:hover { background: #fff; color: var(--sts-lacivert); }
/* Servis detayları: her satır açık kutu, solda lacivert ikon karesi. */
.sts-frame-facts .sts-side-plate-fieldset { display: grid; gap: 10px; }
.sts-frame-facts .sts-side-plate-fieldset > div { position: relative; min-height: 62px; padding: 10px 14px 10px 64px; border: 1px solid var(--sts-cizgi-ince); border-radius: 16px; background: var(--sts-celik); }
.sts-frame-facts dt { font: 800 11.5px/1.2 var(--sts-f-govde); letter-spacing: 0.1em; color: var(--sts-gri); }
.sts-frame-facts dd { margin: 3px 0 0; font: 700 16px/1.3 var(--sts-f-govde); overflow-wrap: anywhere; }
.sts-frame-facts dt svg { position: absolute; left: 12px; top: 50%; width: 38px; height: 38px; margin-top: -19px; padding: 9px; border-radius: 12px; background: var(--sts-gr-lacivert); color: var(--sts-ember-isik); }
.sts-frame-info-grid { gap: 20px; }
/* Nasıl servis alınır: turuncu numara dairesi. */
.sts-frame-two h2, .sts-frame-table-wrap h2, .sts-frame-steps h2, .sts-frame-services h2 { display: flex; align-items: center; gap: 12px; font: 700 clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem)/1.1 var(--sts-f-baslik); text-transform: uppercase; }
.sts-frame-steps h2::before, .sts-frame-services h2::before, .sts-frame-table-wrap h2::before { content: ""; flex: none; width: 34px; height: 34px; border-radius: 10px; background: var(--sts-ikon-anahtar) center / 18px 18px no-repeat, var(--sts-gr-lacivert); }
.sts-frame-steps-list { gap: 20px; }
.sts-frame-steps-list h3 { margin: 4px 0 4px; font: 700 17px/1.25 var(--sts-f-govde); color: var(--sts-grafit); text-transform: none; }
.sts-frame-step-no { width: 40px; height: 40px; border-radius: 50%; background-color: var(--sts-ember); background-image: var(--sts-gr-ember); color: #fff; font-size: 19px; box-shadow: var(--sts-parilti); }
/* Sunulan hizmetler: açık satır kutuları, turuncu onay. */
.sts-frame-service-list { display: grid; gap: 8px; }
.sts-frame-service-list li { position: relative; align-items: center; min-height: 52px; padding: 10px 14px 10px 44px; border: 0; border-left: 3px solid var(--sts-ember-isik); border-radius: 12px; background: var(--sts-celik); }
.sts-frame-service-list li:first-child { border-top: 0; }
.sts-frame-service-list li::before { content: ""; position: absolute; left: 14px; top: 50%; width: 18px; height: 18px; margin-top: -9px; background: var(--sts-ember); -webkit-mask: var(--sts-m-onay) center / contain no-repeat; mask: var(--sts-m-onay) center / contain no-repeat; }
.sts-frame-service-list a { font: 700 16px/1.3 var(--sts-f-govde); }
.sts-frame-service-list a:hover { color: var(--sts-ember); }
.sts-frame-service-list small { flex: none; padding: 4px 10px; border-radius: var(--sts-r-hap); background: var(--sts-beyaz); color: var(--sts-gri); font: 700 11.5px/1.2 var(--sts-f-govde); letter-spacing: 0.06em; text-transform: uppercase; }
.sts-frame-table th { color: var(--sts-gri); font-weight: 700; }
.sts-frame-table th, .sts-frame-table td { padding: 13px 12px; }
.sts-frame-table tr:nth-child(odd) > * { background: var(--sts-celik); }
.sts-frame-table tr > :first-child { border-radius: 10px 0 0 10px; }
.sts-frame-table tr > :last-child { border-radius: 0 10px 10px 0; }
.sts-frame-table th, .sts-frame-table td { border-top: 0; }
.sts-frame-table td a { color: var(--sts-ember); font-family: var(--sts-f-baslik); font-size: 20px; text-decoration: none; }

/* --- §50.8 Hizmet kartları: görsel, ikon karesi, hap etiketler ----------- */
.sts-frame-card { padding: 0; overflow: hidden; transition: transform var(--sts-sure) var(--sts-egri), box-shadow var(--sts-sure) var(--sts-egri); }
.sts-frame-card:hover { transform: translateY(-3px); box-shadow: var(--sts-golge-2); }
.sts-frame-card img { border-bottom: 0; background: var(--sts-celik); }
.sts-frame-card-body { padding: 22px 24px 26px; }
.sts-frame-card-body h3 { display: flex; align-items: center; gap: 12px; margin: 0 0 10px; font-size: clamp(1.25rem, 1.15rem + 0.4vw, 1.5rem); line-height: 1.05; }
.sts-frame-card-body h3::before { content: ""; flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--sts-ikon-anahtar) center / 20px 20px no-repeat, var(--sts-gr-lacivert); }
.sts-frame-card-body h3 a:hover { color: var(--sts-ember); }
.sts-frame-tags { gap: 8px; }
.sts-frame-tags li { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1px solid var(--sts-cizgi); border-radius: var(--sts-r-hap); background: var(--sts-beyaz); color: var(--sts-grafit); font: 700 12.5px/1.2 var(--sts-f-govde); }
.sts-frame-tags li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--sts-ember-isik); }
.sts-frame-card-grid { gap: 22px; }

/* --- §50.9 Sorular: ayrı satır kutuları --------------------------------- */
.sts-question-face { display: grid; gap: 10px; box-shadow: none; }
.sts-question-plate-row { border: 1px solid var(--sts-cizgi-ince); border-radius: 16px; background: var(--sts-beyaz); box-shadow: 0 1px 2px rgba(11, 26, 71, 0.04); overflow: hidden; }
.sts-question-plate-row + .sts-question-plate-row { border-top: 1px solid var(--sts-cizgi-ince); }
.sts-question-plate-row summary { min-height: 60px; font-family: var(--sts-f-govde); font-size: 16.5px; font-weight: 700; }
.sts-question-plate-row summary::after { width: 28px; height: 28px; border-radius: 50%; background: var(--sts-ember); -webkit-mask: none; mask: none; background-image: var(--sts-ok-ikon); background-size: 14px; background-position: center; background-repeat: no-repeat; transform: rotate(90deg); transition: transform var(--sts-sure) var(--sts-egri); }
.sts-question-plate-row summary:hover { background: var(--sts-celik); }
.sts-question-plate-row[open] { background: var(--sts-beyaz); box-shadow: var(--sts-golge-1); border-color: rgba(251, 138, 60, 0.45); }
.sts-question-plate-row[open] summary::after { transform: rotate(-90deg); background: var(--sts-lacivert) var(--sts-ok-ikon) center / 14px 14px no-repeat; }
@media (min-width: 1080px) { .sts-question-face--two .sts-question-plate-row { box-shadow: none; } }
.sts-folded-plate > summary::after, .sts-diff-list summary::after { background: var(--sts-ember); }

/* --- §50.10 Neden biz: ortalı kartlar, lacivert ikon karesi ------------- */
.sts-frame-why-grid { gap: 18px; }
@media (max-width: 559px) { .sts-frame-why-grid { grid-template-columns: minmax(0, 1fr); } }
.sts-frame-why-card { display: flex; flex-direction: column; align-items: center; text-align: center; transition: transform var(--sts-sure) var(--sts-egri); }
.sts-frame-why-card:hover { transform: translateY(-3px); }
.sts-frame-why-card svg { width: 60px; height: 60px; padding: 16px; border-radius: 18px; background: var(--sts-gr-lacivert); color: var(--sts-ember-isik); box-shadow: 0 14px 26px -14px rgba(11, 26, 71, 0.75); }
.sts-frame-why-card h3 { margin-top: 18px; font-size: 21px; }

/* --- §50.11 Çağrı bandı ve son plaka: turuncu, tam genişlik ------------- */
.sts-frame-band { position: relative; margin-top: var(--sts-bolum); padding: 56px 0; overflow: hidden; color: #fff; text-align: center;
  background-color: var(--sts-ember);
  background-image: radial-gradient(rgba(255, 255, 255, 0.14) 1.3px, transparent 1.8px), linear-gradient(120deg, #c9470b 0%, #b03d08 55%, #8f3105 100%);
  background-size: 24px 24px, auto; }
.sts-frame-band::before { content: ""; position: absolute; left: 50%; top: -220px; width: 760px; height: 440px; margin-left: -380px; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 196, 140, 0.35), transparent); pointer-events: none; }
.sts-frame-band-grid { position: relative; grid-template-columns: minmax(0, 1fr) !important; justify-items: center; gap: 26px; }
.sts-frame-band h2 { color: #fff; font: 700 clamp(2rem, 1.4rem + 2.6vw, 3.25rem)/1 var(--sts-f-baslik); text-transform: uppercase; text-shadow: 0 2px 18px rgba(80, 20, 0, 0.3); }
.sts-frame-band p { color: #fff; font-size: 17px; max-width: 56ch; margin-inline: auto; }
.sts-frame-band-call { justify-content: center; }
.sts-frame-band-phone { display: inline-flex; align-items: center; min-height: 64px; padding: 0 30px; border: 1.5px solid rgba(255, 255, 255, 0.5); border-radius: var(--sts-r-hap); background: rgba(255, 255, 255, 0.14); color: #fff; font: 700 clamp(1.75rem, 1.4rem + 1.5vw, 2.5rem)/1 var(--sts-f-baslik); letter-spacing: 0.02em; }
.sts-frame-band-phone:hover { background: #fff; color: var(--sts-ember-bas); }
.sts-frame-band-button { min-height: 56px; padding: 0 28px; background: #fff; color: var(--sts-ember-bas); box-shadow: 0 14px 30px -14px rgba(60, 15, 0, 0.7); }
.sts-frame-band-button:hover, .sts-frame-band-button:focus-visible { background: var(--sts-lacivert); color: #fff; }
.sts-last-plate { --p-zemin: transparent; justify-items: center; padding: 40px 24px; text-align: center; color: #fff; }
.sts-last-plate::before { background-color: var(--sts-ember); background-image: radial-gradient(rgba(255, 255, 255, 0.13) 1.3px, transparent 1.8px), linear-gradient(125deg, #c9470b 0%, #b03d08 55%, #8f3105 100%); background-size: 22px 22px, auto; border-radius: 26px; box-shadow: 0 30px 60px -30px rgba(176, 61, 8, 0.75); }
@media (min-width: 900px) { .sts-last-plate { grid-template-columns: minmax(0, 1fr); padding: 52px 56px; } }
.sts-last-plate h2 { color: #fff; font-size: clamp(1.875rem, 1.4rem + 2vw, 2.75rem); text-transform: uppercase; }
.sts-last-plate p { margin-inline: auto; max-width: 60ch; color: #fff; }
.sts-last-plate .sts-marked-tag { color: #fff; }
.sts-last-plate .sts-marked-tag::before { background: #fff; }
.sts-last-plate .sts-facet-actions { justify-content: center; }
.sts-last-plate .sts-facet-button--ember { background-image: none; background-color: #fff; color: var(--sts-ember-bas); box-shadow: 0 14px 30px -14px rgba(60, 15, 0, 0.7); }
.sts-last-plate .sts-facet-button--ember:hover { background-color: var(--sts-lacivert); color: #fff; }
.sts-last-plate .sts-facet-button--dark { background: rgba(255, 255, 255, 0.12); }
.sts-seek-plate::before { background: linear-gradient(120deg, var(--sts-beyaz), var(--sts-ember-acik)); }

/* --- §50.12 Çip ızgarası (il, ilçe, marka): beyaz hap, turuncu iğne ------ */
.sts-frame-chip-grid { gap: 10px; }
.sts-frame-chip-grid a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px 0 14px; border: 1px solid var(--sts-cizgi); border-radius: var(--sts-r-hap); background: var(--sts-beyaz); color: var(--sts-grafit); font: 700 14.5px/1.2 var(--sts-f-govde); box-shadow: 0 1px 2px rgba(11, 26, 71, 0.04); transition: border-color var(--sts-sure) var(--sts-egri), transform var(--sts-sure) var(--sts-egri); }
.sts-frame-chip-grid a::before { content: ""; flex: none; width: 13px; height: 13px; background: var(--sts-ember-isik); -webkit-mask: var(--sts-m-pin) center / contain no-repeat; mask: var(--sts-m-pin) center / contain no-repeat; }
.sts-frame-chip-grid a:hover, .sts-frame-chip-grid a:focus-visible { border-color: var(--sts-ember-isik); color: var(--sts-ember-bas); transform: translateY(-1px); }
.sts-frame-chip-grid small { color: var(--sts-gri); font-weight: 600; }
.sts-facet-chip { min-height: 44px; border-radius: var(--sts-r-hap); background: var(--sts-beyaz); box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
a.sts-facet-chip:hover { background: var(--sts-ember-acik); }
.sts-facet-tag { border-radius: var(--sts-r-hap); }

/* --- §50.13 Satırlar, sekmeler, tablolar, notlar, form ------------------- */
.sts-tally-row:has(> a)::after { background: var(--sts-ember-isik); }
.sts-tab-bar { border-radius: var(--sts-r-hap); background: var(--sts-beyaz); box-shadow: inset 0 0 0 1px var(--sts-cizgi-ince); }
.sts-tab-bar a, .sts-tab-bar button { border-radius: var(--sts-r-hap); font-weight: 700; }
.sts-tab-bar [aria-selected="true"], .sts-tab-bar [aria-current="true"] { background: var(--sts-lacivert); color: #fff; box-shadow: none; }
.sts-code-face, .sts-type-table { border-radius: 14px; overflow: hidden; }
.sts-code-face thead th { background: var(--sts-lacivert); }
.sts-code-cell { border-radius: 10px; }
.sts-plate-note::after { border-radius: 14px 0 0 14px; background: var(--sts-lacivert); }
.sts-plate-note--warn::after { background: var(--sts-ember); }
.sts-plate-area input, .sts-plate-area select, .sts-plate-area textarea { border-radius: 14px; background-color: var(--sts-celik); box-shadow: inset 0 0 0 1.5px var(--sts-cizgi); }
.sts-plate-area input:hover, .sts-plate-area select:hover, .sts-plate-area textarea:hover { box-shadow: inset 0 0 0 1.5px var(--sts-cizgi-sert); }
.sts-plate-area input:focus-visible, .sts-plate-area select:focus-visible, .sts-plate-area textarea:focus-visible { background-color: var(--sts-beyaz); box-shadow: inset 0 0 0 2px var(--sts-ember), 0 0 0 4px rgba(251, 138, 60, 0.2); }
.sts-confirm-row input { border-radius: 6px; }
.sts-day-plateset button { border-radius: 14px; }
.sts-day-plateset button[aria-pressed="true"] { background: var(--sts-lacivert); color: var(--sts-acik-yazi); }
.sts-split-named::before { border-radius: 50%; background: var(--sts-ember-isik); }
.sts-split-named b { text-transform: uppercase; }
.sts-form-face { padding: var(--sts-a7) var(--sts-a6) var(--sts-a6); }
@media (max-width: 719px) { .sts-form-face { padding: var(--sts-a6) var(--sts-a4) var(--sts-a5); } }
.sts-job-face { border-radius: var(--sts-r-kart); }
.sts-job-area--now::before { border-radius: 50%; }
.sts-plate-device-foot::after { border-radius: 50%; background-color: var(--sts-lacivert); }
.sts-prov-sizes { border-radius: 18px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--sts-cizgi); }
.sts-prov-sizes dd { color: var(--sts-lacivert); }
.sts-sign-button-series button { border-radius: 14px; }
.sts-sign-button-series button span { border-radius: 8px; background: var(--sts-lacivert); }
.sts-facet-icon { border-radius: 14px; background: var(--sts-gr-lacivert); color: var(--sts-ember-isik); }
.sts-cookie-face { border-radius: var(--sts-r-kart); }
.sts-cookie-face::before { box-shadow: inset 0 0 0 1px var(--sts-cizgi-ince), var(--sts-golge-2); }

/* --- §50.14 Mobil alt plaka: yüzen beyaz kapsül -------------------------- */
.sts-foot-plate { left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); gap: 8px; padding: 8px; background: rgba(255, 255, 255, 0.97); border: 1px solid var(--sts-cizgi-ince); border-radius: var(--sts-r-hap); box-shadow: 0 18px 40px -16px rgba(6, 15, 46, 0.55); }
.sts-foot-plate::before { display: none; }
.sts-foot-plate > .sts-facet-button { min-height: 52px; }
.sts-foot-plate > .sts-foot-plate-tel { padding-inline: 20px; background: var(--sts-gr-lacivert); color: #fff; box-shadow: none; }
.sts-foot-plate > .sts-foot-plate-tel svg { color: var(--sts-ember-isik); }
.sts-foot-plate--hidden { transform: translateY(calc(100% + 24px)); }
body.sts-foot-plated { padding-bottom: calc(86px + env(safe-area-inset-bottom)); }
@media (min-width: 1080px) { body.sts-foot-plated { padding-bottom: 0; } }

/* --- §50.15 Altbilgi: gece laciverti, turuncu üst çizgi ------------------ */
.sts-steel-footer {
  --sts-grafit: #ffffff; --sts-metin: var(--sts-acik-yazi); --sts-gri: var(--sts-acik-gri); --sts-gri-2: var(--sts-acik-gri);
  --sts-cizgi: rgba(255, 255, 255, 0.16); --sts-cizgi-ince: rgba(255, 255, 255, 0.1); --sts-cizgi-sert: rgba(255, 255, 255, 0.4);
  padding-top: 64px; background: radial-gradient(700px 300px at 15% 0%, rgba(29, 63, 166, 0.35), transparent 70%), var(--sts-gece); border-top: 0; color: var(--sts-metin);
}
.sts-steel-footer::before { left: 0; right: 0; top: 0; width: auto; height: 4px; background: linear-gradient(90deg, var(--sts-ember), var(--sts-ember-isik) 50%, #ffc48c); }
.sts-steel-footer a:hover, .sts-footer-index a:hover, .sts-footer-index button:hover { color: var(--sts-ember-isik); }
.sts-footer-identity > a { display: inline-flex; padding: 12px 16px; border-radius: 16px; background: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); margin-bottom: var(--sts-a4); }
.sts-footer-identity > a img { margin-bottom: 0; }
.sts-footer-contact .sts-grid-digit { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border-radius: var(--sts-r-hap); background-color: var(--sts-ember); background-image: var(--sts-gr-ember); color: #fff; font-size: 22px; box-shadow: var(--sts-parilti); }
.sts-footer-contact .sts-grid-digit:hover { background-image: none; background-color: var(--sts-ember-bas); color: #fff; }
.sts-footer-contact a { color: var(--sts-acik-yazi); }
.sts-footer-index h2 { display: flex; align-items: center; gap: 8px; color: #fff; font-size: 17px; text-transform: uppercase; letter-spacing: 0.02em; }
.sts-footer-index h2::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--sts-ember-isik); }
.sts-footer-index a, .sts-footer-index button { min-height: 40px; color: var(--sts-acik-yazi); }
.sts-footer-small > a { color: #fff; }
/* Künye ve yasal beyan: cam kutu; beyan satırı uyarı ikonlu ayrı kutu. */
.sts-type-tagged { --p-zemin: rgba(255, 255, 255, 0.04); --p-kenar: rgba(255, 255, 255, 0.12); }
.sts-type-tagged::before { border-radius: 18px; }
.sts-type-tagged > div { box-shadow: -1px 0 0 rgba(255, 255, 255, 0.08), 0 -1px 0 rgba(255, 255, 255, 0.08); }
.sts-type-tagged-statement { position: relative; margin: 10px; padding: 14px 16px 14px 52px !important; border-radius: 14px; background: rgba(251, 138, 60, 0.1); box-shadow: inset 0 0 0 1px rgba(251, 138, 60, 0.35) !important; }
.sts-type-tagged-statement::before { content: ""; position: absolute; left: 16px; top: 15px; width: 22px; height: 22px; background: var(--sts-ember-isik); -webkit-mask: var(--sts-m-uyari) center / contain no-repeat; mask: var(--sts-m-uyari) center / contain no-repeat; }
.sts-type-tagged-statement dt { color: var(--sts-ember-isik); }
.sts-footer-statement { color: var(--sts-acik-yazi); font-size: 14.5px; }
.sts-steel-bottom { margin-top: var(--sts-a5); border-top: 1px solid rgba(255, 255, 255, 0.1); }
.sts-counter-row b { color: #fff; }

/* --- §50.16 Hareket ve yazdırma ----------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .sts-frame-card:hover, .sts-frame-why-card:hover, a.sts-plate-card:hover, .sts-facet-button--ember:hover, .sts-frame-chip-grid a:hover { transform: none; }
}
@media print {
  body { background: #fff; }
  .sts-page-face, .sts-steel-footer, .sts-frame-answer, .sts-frame-band, .sts-frame-bar {
    border-image: none; background: #fff !important; color: #000;
    --sts-grafit: #000; --sts-metin: #000; --sts-gri: #333; --sts-acik-yazi: #000; --sts-acik-gri: #333;
  }
  .sts-page-face h1, .sts-frame-answer h3, .sts-frame-band h2, .sts-frame-band p { color: #000; text-shadow: none; }
}

/* --- §50.17 Yerleşim ekleri ---------------------------------------------- */
.sts-frame-faq-grid .sts-plate-section { margin-top: 0; }
.sts-frame-faq-grid .sts-plate-heading { align-items: flex-start; text-align: left; }
.sts-frame-faq-grid .sts-plate-heading > div { align-items: flex-start; }
.sts-frame-faq-grid .sts-plate-heading p { margin-left: 0; }
.sts-frame-faq-grid .sts-plate-shell { padding-inline: 0; }
.sts-frame-pair { display: grid; gap: var(--sts-a5); }
.sts-frame-pair > * { min-width: 0; }
@media (min-width: 1080px) { .sts-frame-pair { grid-template-columns: minmax(0, 1fr) var(--sts-yan); align-items: start; } }
.sts-last-plate b { color: inherit; }
.sts-prov-face-head h2 { font-size: clamp(1.75rem, 1.25rem + 2.2vw, 2.875rem); line-height: 1.02; text-transform: uppercase; }
.sts-line-list:not(.sts-line-list--columns, .sts-opening-items) > .sts-tally-row > span::before { border-radius: 50%; background: var(--sts-ember-isik); }
.sts-footer-index a, .sts-footer-index button { min-height: 44px; }
.sts-footer-small ul a { display: inline-flex; align-items: center; min-height: 44px; color: var(--sts-acik-yazi); }
/* Adımlar + hizmetler: geniş ekranda yan yana iki kart boyları tutmuyordu (14 satırlık
   liste, 4 adımlık kart). Geniş ekranda iki kart üst üste tam genişlik: adımlar dört sütunlu
   yatay sıra, hizmetler üç sütunlu ızgara. */
.sts-frame-two-grid { align-items: start; }
@media (min-width: 720px) { .sts-frame-two .sts-frame-service-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) {
  .sts-frame-two-grid { grid-template-columns: minmax(0, 1fr); gap: var(--sts-a5); }
  .sts-frame-two .sts-frame-steps-list { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px 28px; }
  .sts-frame-two .sts-frame-steps-list li { flex-direction: column; gap: 12px; }
  .sts-frame-two .sts-frame-service-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 12px; }
}
/* Çizim numaraları: lacivert etiket üstünde beyaz rakam (koyu rakam okunmuyordu). */
.sts-facet-num text { fill: var(--sts-beyaz); }
@media (max-width: 1079px) {
  body.sts-foot-plated { padding-bottom: 0; }
  body.sts-foot-plated .sts-steel-footer { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
}

/* ==========================================================================
   §40–§41 İL HARİTASI (il ve ilçeler: parcalar/harita.html + js/harita.js;
   SVG'ler araclar/harita_uret.py). Köşe yalnız site yarıçapı tokenlarından
   (--sts-r), 1 px çizgi, gölge yok; amber YALNIZ üzerine gelinen, odaklanan
   ya da listeden vurgulanan ildedir/ilçededir.
   ========================================================================== */
/* --- §40 Kap ve üst satır: Bütün iller · il seçici · durum --------------- */
.sts-prov-chart { margin: var(--sts-a4) 0 var(--sts-a6); border-top: 1px solid var(--sts-cizgi); border-bottom: 1px solid var(--sts-cizgi-ince); }
.sts-prov-chart[hidden] { display: none; }
.sts-prov-chart-head { display: flex; flex-wrap: wrap; align-items: end; gap: var(--sts-a3) var(--sts-a4); padding: var(--sts-a3) 0; border-bottom: 1px solid var(--sts-cizgi-ince); }
.sts-prov-chart-back { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border: 0; background: var(--sts-beyaz); color: var(--sts-grafit); box-shadow: inset 0 0 0 1.5px var(--sts-grafit); border-radius: var(--sts-r); font: 600 15px/1 var(--sts-f-baslik); cursor: pointer; transition: background-color var(--sts-sure) var(--sts-egri), color var(--sts-sure) var(--sts-egri); }
.sts-prov-chart-back[hidden] { display: none; }
.sts-prov-chart-back svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: square; stroke-linejoin: miter; }
.sts-prov-chart-back:hover { background: var(--sts-grafit); color: var(--sts-beyaz); }
.sts-prov-chart-back:focus-visible, .sts-prov-chart-prov-casing:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--sts-ember); }
.sts-prov-chart-prov { display: grid; gap: 6px; flex: 1 1 220px; min-width: 0; max-width: 320px; }
.sts-prov-chart-prov label { font-family: var(--sts-f-baslik); font-size: var(--sts-y-etiket); font-weight: 600; color: var(--sts-grafit); }
.sts-prov-chart-prov-casing { width: 100%; min-height: 44px; padding: 0 44px 0 12px; border: 0; box-shadow: inset 0 0 0 1.5px var(--sts-cizgi-sert); border-radius: var(--sts-r); color: var(--sts-metin); font: inherit; font-size: 16px; cursor: pointer; -webkit-appearance: none; appearance: none; background: var(--sts-beyaz) right 12px center / 18px 18px no-repeat; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2312161C' stroke-width='1.6' stroke-linecap='square'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E"); }
.sts-prov-chart-status { flex: 1 1 100%; margin: 0; color: var(--sts-gri); font-size: var(--sts-y-kucuk); font-variant-numeric: tabular-nums; }
@media (min-width: 720px) { .sts-prov-chart-status { flex: 1 1 0; padding-bottom: 12px; text-align: right; } }

/* --- §41 Tuval ve ilçe yanı: ince sınırlı iller, yakut yalnız etkin alan --- */
.sts-prov-chart-inner { display: grid; gap: var(--sts-a4); padding-top: var(--sts-a4); }
.sts-prov-chart-canvas { min-width: 0; transition: opacity var(--sts-sure) var(--sts-egri); }
.sts-prov-chart-canvas svg { display: block; width: 100%; height: auto; }
.sts-prov-chart-zone { fill: var(--sts-celik-2); stroke: var(--sts-beyaz); stroke-width: 0.9; vector-effect: non-scaling-stroke; cursor: pointer; transition: fill var(--sts-sure) var(--sts-egri); }
.sts-plate-section--steel .sts-prov-chart-zone { fill: var(--sts-beyaz); stroke: var(--sts-cizgi); }
.sts-prov-chart-zone:hover, .sts-prov-chart-zone:focus, .sts-prov-chart-zone.sts-prov-chart-zone--stress { fill: var(--sts-ember); outline: none; }
.sts-prov-chart--loading .sts-prov-chart-canvas { opacity: 0.4; cursor: progress; }
.sts-prov-chart-side { min-width: 0; border-top: 1px solid var(--sts-cizgi); }
.sts-prov-chart-side[hidden] { display: none; }
.sts-prov-chart-side-head { margin: 0; padding: 12px 0; border-bottom: 1px solid var(--sts-cizgi-ince); font-family: var(--sts-f-baslik); font-size: 1.125rem; font-weight: 600; }
.sts-prov-chart-side-head a { color: var(--sts-grafit); text-decoration-thickness: 1px; text-underline-offset: 3px; }
.sts-prov-chart-side-head a:hover { text-decoration-color: var(--sts-ember); }
.sts-prov-chart-districts { margin: 0; padding: 0; list-style: none; columns: 2; column-gap: var(--sts-oluk); }
.sts-prov-chart-districts li { break-inside: avoid; }
.sts-prov-chart-districts a { display: flex; align-items: center; min-height: 44px; padding: 0 2px; border-bottom: 1px solid var(--sts-cizgi-ince); color: var(--sts-metin); text-decoration: none; }
.sts-prov-chart-districts a:hover, .sts-prov-chart-districts a:focus-visible { outline: none; color: var(--sts-ember); border-bottom-color: var(--sts-ember); }
@media (min-width: 1080px) {
  .sts-prov-chart--prov-open .sts-prov-chart-inner { grid-template-columns: minmax(0, 1fr) 280px; align-items: start; }
  .sts-prov-chart--prov-open.sts-prov-chart--narrow .sts-prov-chart-inner { grid-template-columns: minmax(0, 1fr) 240px; }
  .sts-prov-chart-districts { columns: 1; max-height: 480px; overflow-y: auto; }
}
@media (prefers-reduced-motion: reduce) { .sts-prov-chart-zone, .sts-prov-chart-canvas, .sts-prov-chart-back { transition: none; } }
@media print { .sts-prov-chart { display: none !important; } }
/* Lacivert-turuncu görünüm (§50): beyaz kesitte iller açık lacivert grisi, etkin il turuncu. */
.sts-plate-section--steel .sts-prov-chart-zone:not(:hover, :focus, .sts-prov-chart-zone--stress) { fill: var(--sts-celik-2); stroke: var(--sts-beyaz); }