/* ==========================================================================
   Aves Dijital - Ücretsiz SEO Analizi: ön tasarım stilleri (T-20261024-012)
   Mobile-first. Marka: mor #6C3BFF, turuncu #F7931E, Outfit.
   Kural: bileşenler renklerini YALNIZ bölge (zone) değişkenlerinden alır:
   --c-text --c-muted --c-line --c-accent --c-hl --focus
   Böylece koyu/renkli bölge içine konan bileşende renk sızması olmaz.
   Sınıf öneki "sa-" (site app.css'teki global h1/p/strong kurallarıyla çakışmasın).
   Kontrast değerleri TASARIM-NOTLARI.md içindeki tabloda hesaplanmıştır.
   ========================================================================== */

:root {
  --ink: #0E0B1F;
  --ink-2: #17132E;
  --paper: #F6F4FB;
  --white: #FFFFFF;
  --violet: #6C3BFF;        /* marka mor: dolgu, büyük öğe */
  --violet-ink: #5A2BE0;    /* açık zeminde METİN için koyulaştırılmış mor */
  --violet-deep: #4B20D6;   /* beyaz metinli bant zemini */
  --violet-soft: #B39DFF;   /* koyu zeminde METİN vurgusu */
  --violet-tint: #EFE9FF;
  --orange: #F7931E;        /* marka turuncu: koyu zeminde düğme/vurgu */
  --orange-soft: #FFC372;   /* mor bantta yalnız büyük rakam */
  --text: #1A1630;
  --muted: #4A4566;
  --on-dark: #F3F0FF;
  --on-dark-muted: #C9C2E6;
  --field-border: #6B6585;
  --err: #B42318;
  --err-bg: #FDECEA;
  --ok: #0B6B3A;
  --ok-bg: #E7F6EC;
  --warn-text: #5C3300;
  --warn-bg: #FFF4E0;
  --warn-line: #A24D00;
  --font: 'Outfit', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --ease: cubic-bezier(.16, .8, .25, 1);
  --wrap: min(1180px, 100% - 40px);
}

/* ---------- Temel ---------- */
.sa-page *, .sa-page *::before, .sa-page *::after { box-sizing: border-box; }
.sa-page { margin: 0; font-family: var(--font); font-size: 1rem; line-height: 1.65; color: var(--text); background: var(--paper); -webkit-text-size-adjust: 100%; overflow-x: clip; }
.sa-page h1, .sa-page h2, .sa-page h3, .sa-page h4, .sa-page p, .sa-page ul, .sa-page ol, .sa-page figure, .sa-page dl, .sa-page dd { margin: 0; padding: 0; }
.sa-page ul, .sa-page ol { list-style: none; }
.sa-page img, .sa-page svg { display: block; max-width: 100%; }
.sa-page a { color: inherit; }
.sa-page button, .sa-page input, .sa-page select { font: inherit; color: inherit; }
.sa-page [hidden] { display: none !important; }
.sa-page ::selection { background: var(--orange); color: var(--ink); }

.sa-vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

.sa-page :focus-visible { outline: 3px solid var(--focus, var(--violet-ink)); outline-offset: 3px; border-radius: 2px; }

.sa-skip { position: absolute; left: 12px; top: -80px; z-index: 100; background: var(--orange); color: var(--ink); padding: 14px 20px; font-weight: 600; text-decoration: none; border-radius: 6px; }
.sa-skip:focus { top: 12px; --focus: var(--ink); outline: 3px solid var(--ink); outline-offset: 2px; }

.sa-wrap { width: var(--wrap); margin-inline: auto; position: relative; z-index: 1; }
@media (min-width: 768px) { :root { --wrap: min(1180px, 100% - 64px); } }

/* ---------- Bölgeler (zemin ritmi) ---------- */
.sa-zone { position: relative; isolation: isolate; }
.sa-zone--dark {
  --c-text: var(--on-dark); --c-muted: var(--on-dark-muted); --c-line: rgba(243, 240, 255, .2);
  --c-accent: var(--violet-soft); --c-hl: var(--orange); --focus: var(--orange);
  color: var(--c-text);
  background:
    radial-gradient(55% 60% at 88% 0%, rgba(108, 59, 255, .45), transparent 65%),
    radial-gradient(40% 45% at 0% 100%, rgba(247, 147, 30, .2), transparent 65%),
    var(--ink);
}
.sa-zone--light {
  --c-text: var(--text); --c-muted: var(--muted); --c-line: rgba(26, 22, 48, .18);
  --c-accent: var(--violet-ink); --c-hl: var(--violet-ink); --focus: var(--violet-ink);
  color: var(--c-text);
  background:
    radial-gradient(45% 50% at 100% 0%, rgba(108, 59, 255, .08), transparent 65%),
    radial-gradient(40% 45% at 0% 100%, rgba(247, 147, 30, .09), transparent 65%),
    var(--paper);
}
.sa-zone--white {
  --c-text: var(--text); --c-muted: var(--muted); --c-line: rgba(26, 22, 48, .18);
  --c-accent: var(--violet-ink); --c-hl: var(--violet-ink); --focus: var(--violet-ink);
  color: var(--c-text);
  background:
    radial-gradient(45% 45% at 0% 0%, rgba(247, 147, 30, .08), transparent 65%),
    radial-gradient(45% 50% at 100% 100%, rgba(108, 59, 255, .08), transparent 65%),
    var(--white);
}
.sa-zone--violet {
  --c-text: #FFFFFF; --c-muted: #EDE8FF; --c-line: rgba(255, 255, 255, .3);
  --c-accent: #FFFFFF; --c-hl: var(--orange-soft); --focus: #FFFFFF;
  color: var(--c-text);
  background:
    radial-gradient(40% 55% at 100% 100%, rgba(247, 147, 30, .3), transparent 65%),
    radial-gradient(50% 60% at 0% 0%, rgba(14, 11, 31, .35), transparent 65%),
    linear-gradient(135deg, var(--violet) 0%, var(--violet-deep) 100%);
}
.sa-zone--violet .sa-label { color: #FFFFFF; }
.sa-zone--grid::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
  background-image: linear-gradient(var(--c-line) 1px, transparent 1px), linear-gradient(90deg, var(--c-line) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(70% 70% at 80% 20%, #000, transparent 75%);
  mask-image: radial-gradient(70% 70% at 80% 20%, #000, transparent 75%);
}

.sa-section { padding: 80px 0; overflow-x: clip; }
@media (min-width: 1024px) { .sa-section { padding: 140px 0; } }

/* ---------- Tipografi ---------- */
.sa-h1 { font-size: clamp(2.1rem, 6.4vw, 4.9rem); font-weight: 700; line-height: 1.02; letter-spacing: -.035em; overflow-wrap: break-word; hyphens: auto; }
.sa-h2 { font-size: clamp(1.95rem, 4.6vw, 3.6rem); font-weight: 700; line-height: 1.05; letter-spacing: -.03em; overflow-wrap: break-word; hyphens: auto; }
.sa-h3 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); font-weight: 600; line-height: 1.2; letter-spacing: -.015em; }
.sa-hl { color: var(--c-hl); }
.sa-lead { font-size: clamp(1.125rem, 2vw, 1.375rem); line-height: 1.55; font-weight: 300; max-width: 38em; color: var(--c-text); }
.sa-p { font-size: 1.0625rem; font-weight: 300; line-height: 1.7; max-width: 62ch; color: var(--c-muted); }
.sa-label { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent); line-height: 1.4; }
.sa-note { font-size: .9375rem; line-height: 1.6; color: var(--c-muted); font-weight: 300; max-width: 46ch; }

.sa-head { display: grid; gap: 18px; margin-bottom: 48px; }
@media (min-width: 1024px) {
  .sa-head { grid-template-columns: minmax(0, 1fr) minmax(0, 2.3fr) minmax(0, 1fr); gap: 40px; align-items: end; margin-bottom: 76px; }
  .sa-head > .sa-label { align-self: start; padding-top: 14px; }
}

/* ---------- Düğmeler ve bağlantılar ---------- */
.sa-btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 0 30px; border: 0; border-radius: 6px; font-weight: 600; font-size: 1.0625rem; line-height: 1.2; text-decoration: none; cursor: pointer; transition: transform .25s var(--ease), background-color .2s; text-align: center; }
.sa-btn svg { transition: transform .25s var(--ease); flex: none; }
.sa-btn:hover { transform: translateY(-3px); }
.sa-btn:hover svg { transform: translateX(4px); }
/* Düğme renkleri bölge değişkenlerinden BAĞIMSIZ; ".sa-page a {color:inherit}" (0,1,1) kuralını ezmek için .sa-page önekli */
.sa-page .sa-btn--orange { background: var(--orange); color: var(--ink); }          /* koyu/mor zeminde */
.sa-page .sa-btn--orange:hover { background: #FFA93D; color: var(--ink); }
.sa-zone--violet .sa-btn--orange { box-shadow: 0 0 0 2px #fff; }           /* turuncu/mor sınır oranı 2,5:1 olduğundan beyaz kenar (1.4.11) */
.sa-page .sa-btn--violet { background: var(--violet); color: #FFFFFF; }                /* açık zeminde */
.sa-page .sa-btn--violet:hover { background: var(--violet-ink); color: #FFFFFF; }
.sa-btn--block { width: 100%; }
@media (min-width: 640px) { .sa-btn--block-sm { width: auto; } }

.sa-link { color: var(--c-accent); font-weight: 500; text-underline-offset: 4px; text-decoration-thickness: 1px; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.sa-link:hover { text-decoration-thickness: 2px; }
.sa-zone--violet .sa-link { color: #fff; }

/* ---------- Üst bilgi (yalnız logo + aynı eylem) ---------- */
.sa-header { position: relative; z-index: 2; padding: 18px 0; }
.sa-header__in { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.sa-header__logo { display: inline-flex; min-height: 44px; align-items: center; }
.sa-header__logo img { height: 40px; width: auto; }
.sa-header__cta { font-size: .9375rem; font-weight: 500; color: var(--c-text); text-underline-offset: 4px; min-height: 44px; display: inline-flex; align-items: center; }

/* ---------- Hero ---------- */
.sa-hero { padding-bottom: 72px; }
.sa-hero__grid { display: grid; gap: 48px; padding-top: 28px; }
.sa-hero .sa-label { margin-bottom: 22px; display: block; }
.sa-hero .sa-h1 { margin-bottom: 26px; }
.sa-hero .sa-lead { margin-bottom: 34px; }
.sa-hero__note { margin-top: 22px; font-size: .9375rem; color: var(--c-muted); max-width: 52ch; font-weight: 300; }
.sa-facts { display: grid; margin-top: 56px; border-top: 1px solid var(--c-line); }
.sa-facts li { padding: 18px 0; border-bottom: 1px solid var(--c-line); }
.sa-facts b { display: block; font-weight: 600; font-size: 1.0625rem; }
.sa-facts span { font-size: .9375rem; color: var(--c-muted); font-weight: 300; }
@media (min-width: 640px) {
  .sa-facts { grid-template-columns: repeat(3, 1fr); }
  .sa-facts li { border-bottom: 0; padding: 22px 24px 0 0; }
  .sa-facts li + li { padding-left: 24px; border-left: 1px solid var(--c-line); }
}
@media (min-width: 1024px) {
  .sa-hero { padding-bottom: 96px; }
  .sa-hero__grid { grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 72px; align-items: center; padding-top: 56px; }
}

/* Rapor önizleme çizimi (temsili; gerçek veri içermez) */
.sa-report-fig { max-width: 380px; margin-inline: auto; width: 100%; }
.sa-report { background: #fff; color: var(--text); border-radius: 4px; padding: 22px 22px 26px; box-shadow: 0 30px 80px rgba(0, 0, 0, .45); border-top: 5px solid var(--violet); }
.sa-report__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid rgba(26, 22, 48, .18); margin-bottom: 16px; }
.sa-report__top img { height: 26px; width: auto; }
.sa-report__top span { font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.sa-report__row { display: grid; grid-template-columns: 28px 1fr; gap: 10px; padding: 11px 0; border-bottom: 1px solid rgba(26, 22, 48, .12); align-items: start; }
.sa-report__row b { font-size: .8125rem; color: var(--violet-ink); font-weight: 700; }
.sa-report__row p { font-size: .875rem; font-weight: 600; margin-bottom: 7px; color: var(--text); }
.sa-sk { display: block; height: 7px; border-radius: 4px; background: #DDD8EE; margin-top: 6px; }
.sa-sk--s { width: 62%; } .sa-sk--m { width: 84%; }
.sa-report__pri { margin-top: 14px; background: var(--violet-tint); border-left: 4px solid var(--orange); padding: 10px 12px; font-size: .8125rem; font-weight: 600; color: var(--text); }
.sa-report-fig figcaption { margin-top: 16px; font-size: .8125rem; color: var(--c-muted); text-align: center; }
@media (min-width: 1024px) { .sa-report { transform: rotate(1.6deg); } }

/* ---------- 01 Nasıl işler ---------- */
.sa-steps { display: grid; border-top: 1px solid var(--c-line); }
.sa-step { padding: 32px 0; border-bottom: 1px solid var(--c-line); display: grid; gap: 14px; }
.sa-step__n { font-size: clamp(3.75rem, 9vw, 6rem); font-weight: 800; line-height: .9; letter-spacing: -.05em; color: var(--c-accent); }
.sa-step .sa-p { max-width: 36ch; }
@media (min-width: 768px) {
  .sa-steps { grid-template-columns: repeat(3, 1fr); }
  .sa-step { border-bottom: 0; padding: 40px 32px 8px 0; }
  .sa-step + .sa-step { padding-left: 32px; border-left: 1px solid var(--c-line); }
}

/* ---------- 02 Kapsam: etkileşimli liste (imza bileşen) ---------- */
.sa-scope__panels { display: grid; border-top: 1px solid var(--c-line); }
.sa-scope__item { display: grid; gap: 8px 24px; padding: 26px 0; border-bottom: 1px solid var(--c-line); position: relative; }
.sa-scope__num { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; color: var(--c-accent); }
.sa-scope__name { font-size: clamp(1.3rem, 2.6vw, 1.9rem); font-weight: 600; letter-spacing: -.02em; line-height: 1.15; }
.sa-scope__text { font-size: 1.0625rem; font-weight: 300; color: var(--c-muted); max-width: 52ch; }
@media (min-width: 768px) { .sa-scope__item { grid-template-columns: 90px minmax(0, 1fr) minmax(0, 1.3fr); align-items: baseline; } }

.sa-scope.is-enhanced { display: grid; gap: 24px; }
.sa-scope.is-enhanced .sa-scope__panels { border: 0; display: block; }
.sa-scope__tabs { display: grid; border-top: 1px solid var(--c-line); }
.sa-tab { display: grid; grid-template-columns: 44px 1fr 24px; align-items: center; gap: 8px; width: 100%; min-height: 64px; padding: 14px 8px 14px 0; background: transparent; border: 0; border-bottom: 1px solid var(--c-line); text-align: left; cursor: pointer; color: var(--c-muted); font-size: 1.1875rem; font-weight: 500; letter-spacing: -.01em; transition: padding-left .25s var(--ease), color .2s; line-height: 1.25; }
.sa-tab__num { font-size: .8125rem; letter-spacing: .12em; font-weight: 600; }
.sa-tab svg { opacity: 0; transition: opacity .2s, transform .25s var(--ease); }
.sa-tab:hover { color: var(--c-text); padding-left: 8px; }
.sa-tab[aria-selected="true"] { color: var(--c-text); padding-left: 8px; }
.sa-tab[aria-selected="true"] .sa-tab__num { color: var(--orange); }
.sa-tab[aria-selected="true"] svg { opacity: 1; transform: translateX(4px); }
.sa-scope.is-enhanced .sa-scope__item { position: relative; overflow: hidden; display: block; padding: 32px 28px 40px; border: 0; min-height: 280px; border-radius: 4px;
  --c-text: #fff; --c-muted: #F1EDFF; --c-accent: #fff; color: #fff;
  background: radial-gradient(60% 70% at 100% 100%, rgba(247, 147, 30, .28), transparent 70%), linear-gradient(135deg, var(--violet-ink), var(--violet-deep)); }
.sa-scope.is-enhanced .sa-scope__item::after { content: attr(data-num); position: absolute; right: 18px; bottom: -34px; font-size: 13rem; font-weight: 800; line-height: 1; color: #fff; opacity: .12; pointer-events: none; letter-spacing: -.06em; }
.sa-scope.is-enhanced .sa-scope__num { display: none; }
.sa-scope.is-enhanced .sa-scope__name { margin-bottom: 14px; color: #fff; }
.sa-scope.is-enhanced .sa-scope__text { color: #F1EDFF; position: relative; z-index: 1; }
@media (min-width: 768px) {
  .sa-scope.is-enhanced { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 48px; align-items: start; }
  .sa-scope.is-enhanced .sa-scope__item { min-height: 340px; padding: 44px 40px; }
}

/* ---------- 03 Rapor (mor bant) ---------- */
.sa-band__grid { display: grid; gap: 40px; }
.sa-giant { font-size: clamp(5.5rem, 21vw, 15rem); font-weight: 800; line-height: .82; letter-spacing: -.06em; color: var(--c-hl); }
.sa-giant small { display: block; font-size: clamp(1.25rem, 3vw, 2rem); font-weight: 500; letter-spacing: -.01em; color: #fff; margin-top: 14px; line-height: 1.1; }
.sa-rows { border-top: 1px solid var(--c-line); }
.sa-row { display: grid; gap: 6px 20px; padding: 22px 0; border-bottom: 1px solid var(--c-line); }
.sa-row__n { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; color: var(--c-text); }
.sa-row h3 { font-size: 1.25rem; font-weight: 600; letter-spacing: -.01em; line-height: 1.25; }
.sa-row p { font-size: 1rem; font-weight: 300; color: var(--c-muted); }
@media (min-width: 768px) { .sa-row { grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1.2fr); align-items: baseline; } }
@media (min-width: 1024px) { .sa-band__grid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: 80px; align-items: start; } }
.sa-band__cta { margin-top: 40px; }

/* ---------- 04 Kapsam dışı ---------- */
.sa-no { border-top: 1px solid var(--c-line); max-width: 860px; }
.sa-no li { display: grid; grid-template-columns: 34px 1fr; gap: 8px; padding: 18px 0; border-bottom: 1px solid var(--c-line); font-size: 1.0625rem; line-height: 1.55; }
.sa-no li::before { content: '\2715'; font-size: .9rem; color: var(--c-accent); font-weight: 700; padding-top: 3px; }
.sa-aside { margin-top: 36px; padding-top: 4px; font-size: 1rem; color: var(--c-muted); }

/* ---------- 05 Güven ---------- */
.sa-trust { display: grid; border-top: 1px solid var(--c-line); }
.sa-trust__i { padding: 30px 0; border-bottom: 1px solid var(--c-line); }
.sa-trust__v { font-size: clamp(2.6rem, 6vw, 4.6rem); font-weight: 700; line-height: 1; letter-spacing: -.04em; color: var(--c-hl); margin-bottom: 12px; display: block; overflow-wrap: anywhere; }
.sa-trust p { color: var(--c-muted); font-weight: 300; font-size: 1.0625rem; max-width: 30ch; }
.sa-trust__more { margin-top: 28px; }
@media (min-width: 768px) {
  .sa-trust { grid-template-columns: repeat(3, 1fr); }
  .sa-trust__i { border-bottom: 0; padding: 40px 28px 0 0; }
  .sa-trust__i + .sa-trust__i { padding-left: 28px; border-left: 1px solid var(--c-line); }
}

/* ---------- 06 Form ---------- */
.sa-formgrid { display: grid; gap: 40px; }
.sa-formintro .sa-h2 { margin-bottom: 22px; }
.sa-next { margin-top: 28px; border-top: 1px solid var(--c-line); }
.sa-next li { display: grid; grid-template-columns: 32px 1fr; padding: 14px 0; border-bottom: 1px solid var(--c-line); font-size: 1rem; color: var(--c-text); font-weight: 300; }
.sa-next b { color: var(--c-accent); font-weight: 600; font-size: .875rem; letter-spacing: .08em; padding-top: 2px; }
@media (min-width: 1024px) { .sa-formgrid { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 80px; align-items: start; } }

.sa-form { position: relative; background: #fff; color: var(--text); padding: 28px 20px 32px; border-radius: 4px; border: 1px solid rgba(26, 22, 48, .18); --c-text: var(--text); --c-muted: var(--muted); --c-line: rgba(26, 22, 48, .18); --c-accent: var(--violet-ink); --focus: var(--violet-ink); }
.sa-form::before { content: ''; position: absolute; left: -1px; right: -1px; top: -1px; height: 5px; background: linear-gradient(90deg, var(--violet), var(--orange)); border-radius: 4px 4px 0 0; }
@media (min-width: 640px) { .sa-form { padding: 44px 44px 44px; } }

.sa-group { border: 0; padding: 0; margin: 0 0 30px; min-width: 0; }
.sa-group__title { display: flex; align-items: baseline; gap: 12px; width: 100%; padding: 0 0 12px; margin-bottom: 20px; border-bottom: 1px solid var(--c-line); font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent); float: left; }
.sa-group__title + * { clear: both; }
.sa-group--opt .sa-group__title { color: var(--muted); }
.sa-fields { display: grid; gap: 22px; clear: both; }
@media (min-width: 768px) { .sa-fields--2 { grid-template-columns: 1fr 1fr; } .sa-span { grid-column: 1 / -1; } }

.sa-field { min-width: 0; }
.sa-labelrow { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 4px 12px; margin-bottom: 8px; font-weight: 600; font-size: 1rem; line-height: 1.3; padding: 0; }
.sa-tag { font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; border-radius: 3px; line-height: 1.3; white-space: nowrap; }
.sa-tag--req { background: var(--violet-tint); color: var(--violet-ink); }
.sa-tag--opt { background: transparent; color: var(--muted); border: 1px solid var(--field-border); }
.sa-hint { font-size: .875rem; color: var(--muted); font-weight: 400; margin-top: 7px; line-height: 1.5; }

.sa-input { width: 100%; min-height: 52px; padding: 12px 16px; background: #fff; color: var(--text); border: 1.5px solid var(--field-border); border-radius: 6px; font-size: 1rem; line-height: 1.4; transition: border-color .2s, box-shadow .2s; appearance: none; -webkit-appearance: none; }
.sa-input::placeholder { color: var(--field-border); opacity: 1; }
.sa-input:hover { border-color: var(--text); }
.sa-input:focus-visible { border-color: var(--violet-ink); box-shadow: 0 0 0 3px rgba(90, 43, 224, .25); outline: 3px solid var(--violet-ink); outline-offset: 2px; }
select.sa-input { padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M5 8l5 5 5-5' fill='none' stroke='%231A1630' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }

/* Hata ve geçerli durumları (renk + ikon + metin; yalnız renge dayanmaz) */
.sa-input[aria-invalid="true"], .sa-fieldset-err .sa-radio, .sa-check--err { border-color: var(--err); border-width: 2px; }
.sa-error { display: flex; gap: 8px; align-items: flex-start; margin-top: 8px; font-size: .9375rem; font-weight: 500; color: var(--err); line-height: 1.45; }
.sa-error svg { flex: none; margin-top: 2px; }
.sa-input.is-valid { border-color: var(--ok); }

/* Radyo grubu (site türü) */
.sa-radios { display: grid; gap: 10px; }
@media (min-width: 480px) { .sa-radios { grid-template-columns: 1fr 1fr; } }
.sa-radio { display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: center; min-height: 56px; padding: 10px 16px; background: #fff; border: 1.5px solid var(--field-border); border-radius: 6px; cursor: pointer; font-size: 1rem; font-weight: 500; line-height: 1.3; transition: border-color .2s, background-color .2s; }
.sa-radio:hover { border-color: var(--text); }
.sa-radio input { appearance: none; -webkit-appearance: none; width: 24px; height: 24px; margin: 0; border: 2px solid var(--field-border); border-radius: 50%; background: #fff; display: grid; place-content: center; cursor: pointer; }
.sa-radio input::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: var(--violet-ink); transform: scale(0); transition: transform .15s; }
.sa-radio input:checked { border-color: var(--violet-ink); }
.sa-radio input:checked::before { transform: scale(1); }
.sa-radio:has(input:checked) { border-color: var(--violet-ink); border-width: 2px; background: var(--violet-tint); }
.sa-radio:has(input:focus-visible) { outline: 3px solid var(--violet-ink); outline-offset: 2px; }
.sa-radio input:focus-visible { outline: 0; }

/* Onay kutuları: iki kutu BİREBİR aynı biçim ve boyutta */
.sa-checks { display: grid; gap: 12px; margin: 8px 0 28px; }
.sa-check { display: grid; grid-template-columns: 28px 1fr; gap: 14px; padding: 16px; background: #fff; border: 1.5px solid var(--field-border); border-radius: 6px; align-items: start; }
.sa-check input { appearance: none; -webkit-appearance: none; width: 28px; height: 28px; margin: 0; border: 2px solid var(--field-border); border-radius: 5px; background: #fff; cursor: pointer; display: grid; place-content: center; flex: none; }
.sa-check input::before { content: ''; width: 16px; height: 16px; transform: scale(0); transition: transform .12s; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8.5l3.5 3.5 7.5-8' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.sa-check input:checked { background: var(--violet-ink); border-color: var(--violet-ink); }
.sa-check input:checked::before { transform: scale(1); }
.sa-check:has(input:focus-visible) { outline: 3px solid var(--violet-ink); outline-offset: 2px; }
.sa-check input:focus-visible { outline: 0; }
.sa-check__body { min-width: 0; }
.sa-check label { display: block; font-size: .9688rem; line-height: 1.55; font-weight: 400; cursor: pointer; }
.sa-check label a { color: var(--violet-ink); text-underline-offset: 3px; font-weight: 500; }
.sa-check__meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 8px; }
.sa-check__meta .sa-hint { margin: 0; }

.sa-submit { display: grid; gap: 14px; }
.sa-submit__note { font-size: .9375rem; color: var(--muted); line-height: 1.55; }
.sa-submit__alt { font-size: .9375rem; color: var(--muted); margin-top: 6px; }
.sa-submit__alt a { color: var(--violet-ink); }

/* ---------- Bildirimler (hata özeti, uyarı, başarı, kontenjan) ---------- */
.sa-notice { display: grid; grid-template-columns: 28px 1fr; gap: 14px; padding: 18px 18px 20px; border-radius: 6px; border: 1.5px solid; margin-bottom: 26px; }
.sa-notice h3, .sa-notice h2 { font-size: 1.1875rem; font-weight: 600; line-height: 1.3; margin-bottom: 6px; letter-spacing: -.01em; }
.sa-notice p { font-size: 1rem; line-height: 1.55; max-width: 60ch; font-weight: 400; color: inherit; }
.sa-notice ul { margin-top: 10px; display: grid; gap: 4px; }
.sa-notice li a { font-weight: 600; text-underline-offset: 3px; }
.sa-notice svg { margin-top: 2px; }
.sa-notice--error { background: var(--err-bg); border-color: var(--err); color: var(--err); }
.sa-notice--error h3, .sa-notice--error li a { color: var(--err); }
.sa-notice--ok { background: var(--ok-bg); border-color: var(--ok); color: var(--ok); }
.sa-notice--warn { background: var(--warn-bg); border-color: var(--warn-line); color: var(--warn-text); }
.sa-notice--info { background: var(--violet-tint); border-color: var(--violet-ink); color: var(--text); }
.sa-notice:focus { outline: 3px solid var(--violet-ink); outline-offset: 3px; }
.sa-notice a { color: inherit; }

.sa-closed { background: #fff; color: var(--text); border: 1px solid rgba(26, 22, 48, .18); border-radius: 4px; padding: 32px 20px; position: relative; --c-text: var(--text); --c-muted: var(--muted); --c-line: rgba(26, 22, 48, .18); --c-accent: var(--violet-ink); --focus: var(--violet-ink); }
.sa-closed::before { content: ''; position: absolute; left: -1px; right: -1px; top: -1px; height: 5px; background: var(--orange); border-radius: 4px 4px 0 0; }
.sa-closed .sa-notice { margin-bottom: 24px; }
.sa-closed__alt { border-top: 1px solid var(--c-line); padding-top: 24px; display: grid; gap: 6px; }
.sa-closed__alt h3 { font-size: 1.1875rem; font-weight: 600; margin-bottom: 4px; }
.sa-closed__links { display: flex; flex-wrap: wrap; gap: 8px 28px; margin-top: 6px; }
@media (min-width: 640px) { .sa-closed { padding: 44px; } }

/* ---------- 07 SSS ---------- */
.sa-faq { border-top: 1px solid var(--c-line); max-width: 880px; }
.sa-faq details { border-bottom: 1px solid var(--c-line); }
.sa-faq summary { display: grid; grid-template-columns: 1fr 28px; gap: 16px; align-items: center; min-height: 64px; padding: 16px 0; cursor: pointer; list-style: none; font-size: 1.1875rem; font-weight: 500; letter-spacing: -.01em; line-height: 1.35; }
.sa-faq summary::-webkit-details-marker { display: none; }
.sa-faq summary::after { content: ''; width: 20px; height: 20px; justify-self: end; background: linear-gradient(currentColor, currentColor) center / 100% 2px no-repeat, linear-gradient(currentColor, currentColor) center / 2px 100% no-repeat; transition: transform .3s var(--ease); color: var(--c-accent); }
.sa-faq details[open] summary::after { transform: rotate(45deg); }
.sa-faq summary:hover { color: var(--c-accent); }
.sa-faq__a { padding: 0 44px 24px 0; }
.sa-faq__a p { font-size: 1.0625rem; font-weight: 300; color: var(--c-muted); max-width: 64ch; }

/* ---------- Kapanış CTA ---------- */
.sa-close { text-align: left; }
.sa-close__in { display: grid; gap: 28px; max-width: 880px; }
.sa-close .sa-note { color: var(--c-muted); }

/* ---------- Alt bilgi ---------- */
.sa-footer { padding: 36px 0 44px; border-top: 1px solid rgba(243, 240, 255, .2); background: var(--ink); color: var(--on-dark); --c-muted: var(--on-dark-muted); --focus: var(--orange); }
.sa-footer__in { display: grid; gap: 16px; font-size: .9375rem; color: var(--on-dark-muted); }
.sa-footer__links { display: flex; flex-wrap: wrap; gap: 4px 24px; }
.sa-footer__links a { min-height: 44px; display: inline-flex; align-items: center; color: var(--on-dark); text-underline-offset: 4px; }
@media (min-width: 768px) { .sa-footer__in { grid-template-columns: 1fr auto; align-items: center; } }

/* ---------- Teşekkür sayfası ---------- */
.sa-thanks__badge { width: 64px; height: 64px; border-radius: 50%; background: var(--orange); color: var(--ink); display: grid; place-items: center; margin-bottom: 26px; }
.sa-date { display: inline-block; margin-top: 6px; padding: 14px 18px; border: 1px solid var(--c-line); border-left: 4px solid var(--orange); font-size: 1.125rem; font-weight: 500; }
.sa-date b { color: var(--orange); font-weight: 700; }
.sa-posts { border-top: 1px solid var(--c-line); margin-top: 18px; }
.sa-posts a { display: block; padding: 16px 0; border-bottom: 1px solid var(--c-line); text-decoration: none; font-size: 1.125rem; font-weight: 500; min-height: 44px; transition: padding-left .25s var(--ease), color .2s; }
.sa-posts a:hover { padding-left: 10px; color: var(--c-accent); }
.sa-quiet { margin-top: 36px; font-size: 1rem; color: var(--c-muted); }

/* ---------- CTA bileşenleri (site içi) ---------- */

.sa-cta-band { padding: 64px 0; }
.sa-cta-band__in { display: grid; gap: 28px; align-items: center; }
.sa-cta-band h2 { font-size: clamp(1.75rem, 3.6vw, 2.75rem); font-weight: 700; line-height: 1.1; letter-spacing: -.03em; margin-bottom: 14px; }
.sa-cta-band p { color: var(--c-muted); font-weight: 300; font-size: 1.0625rem; max-width: 56ch; }
@media (min-width: 900px) { .sa-cta-band { padding: 88px 0; } .sa-cta-band__in { grid-template-columns: minmax(0, 1fr) auto; gap: 64px; } }

.sa-cta-card { display: grid; gap: 18px; padding: 28px 24px; background: #fff; border: 1px solid var(--c-line); border-left: 5px solid var(--violet); border-radius: 4px; }
.sa-cta-card h3 { font-size: 1.4rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.sa-cta-card p { color: var(--c-muted); font-weight: 300; font-size: 1.0625rem; max-width: 60ch; }
@media (min-width: 768px) { .sa-cta-card { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 40px; padding: 36px 40px; } }

.sa-cta-inline { margin: 40px 0; padding: 24px 22px; background: var(--violet-tint); border-top: 3px solid var(--violet); border-radius: 0 0 4px 4px; display: grid; gap: 12px; justify-items: start; --focus: var(--violet-ink); }
.sa-cta-inline__k { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--violet-ink); }
.sa-cta-inline h3 { font-size: 1.35rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.2; }
.sa-cta-inline p { font-size: 1.0625rem; font-weight: 400; color: var(--text); max-width: 60ch; }
.sa-article { max-width: 720px; margin-inline: auto; background: #fff; padding: 28px 22px; border: 1px solid rgba(26, 22, 48, .14); }
.sa-article p { font-size: 1.0625rem; color: var(--muted); font-weight: 300; margin-bottom: 14px; }
.sa-article h3.sa-art-h { font-size: 1.1rem; color: var(--text); margin: 18px 0 8px; font-weight: 600; }

.sa-menu-demo { display: grid; gap: 28px; }
@media (min-width: 900px) { .sa-menu-demo { grid-template-columns: 1.5fr 1fr; align-items: start; } }
.sa-menu { background: #fff; border: 1px solid rgba(26, 22, 48, .18); border-radius: 4px; padding: 24px; --c-text: var(--text); --c-muted: var(--muted); --c-line: rgba(26, 22, 48, .18); --c-accent: var(--violet-ink); --focus: var(--violet-ink); }
.sa-menu__t { font-size: .8125rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 600; color: var(--violet-ink); margin-bottom: 8px; display: block; }
.sa-menu__list { display: grid; gap: 0; }
.sa-menu__list a { display: flex; align-items: center; min-height: 44px; text-decoration: none; font-size: 1.0625rem; font-weight: 500; }
.sa-menu__list a:hover { color: var(--violet-ink); text-decoration: underline; text-underline-offset: 4px; }
.sa-menu__cols { display: grid; gap: 22px; }
@media (min-width: 560px) { .sa-menu__cols { grid-template-columns: repeat(2, 1fr); } }
.sa-menu__foot { margin-top: 18px; padding-top: 6px; border-top: 1px solid var(--c-line); }
.sa-menu__text { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: .9375rem; font-weight: 500; color: var(--violet-ink); text-underline-offset: 4px; }
.sa-menu__text:hover { text-decoration-thickness: 2px; }
.sa-menu--mobile { max-width: 360px; }

.sa-mini { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 16px 20px; background: #fff; border: 1px solid rgba(26, 22, 48, .18); border-radius: 4px; font-size: 1rem; --focus: var(--violet-ink); }
.sa-mini a { color: var(--violet-ink); font-weight: 500; text-underline-offset: 4px; min-height: 44px; display: inline-flex; align-items: center; }

/* ---------- Hareket (AOS benzeri, güvenli) ---------- */
/* .sa-js sınıfını YALNIZ app.js ekler; JS/IntersectionObserver yoksa içerik görünür kalır. */
.sa-js [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: var(--d, 0ms); }
.sa-js [data-reveal].is-in { opacity: 1; transform: none; }
.sa-hero__pan { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .sa-js [data-reveal] { opacity: 1; transform: none; transition: none; }
  .sa-btn, .sa-btn svg, .sa-tab, .sa-tab svg, .sa-posts a, .sa-faq summary::after, .sa-radio, .sa-input { transition: none; }
  .sa-btn:hover { transform: none; }
  .sa-page { scroll-behavior: auto; }
  .sa-report { transform: none; }
}
@media (prefers-reduced-motion: no-preference) { .sa-page { scroll-behavior: smooth; } }

/* ---------- Bağımsız hukuki metin sayfası (/tr/kvkk): düz okuma düzeni ---------- */
.sa-legal { max-width: 78ch; }
.sa-legal p, .sa-legal ul { margin: 0 0 14px; color: var(--c-text); }
.sa-legal ul { list-style: disc; padding-left: 1.4em; display: grid; gap: 6px; }
.sa-legal ul li { list-style: disc; }
.sa-legal a { color: var(--violet-ink); text-underline-offset: 3px; }
.sa-legal .fw-bold { font-weight: 700; font-size: 1.25rem; }
.sa-legal .text-muted { color: var(--c-muted); }
.sa-legal strong { font-weight: 700; color: inherit; }

/* Sistem bildirimi içindeki bağlantı */
.sa-notice a { text-underline-offset: 3px; font-weight: 600; }