/*
  base.css — bütün səhifələrin ORTAQ təməli.

  ⚠️ NİYƏ İNDİ YARANDI: `thanks.html` bu bloku `index.html`-dən söz-söz kopyalamışdı
     və faylın öz şərhi yazırdı: "⛔ ÜÇÜNCÜ səhifə əlavə ediləndə ortaq fayla
     çıxarılmalıdır". `privacy.html` və `sample.html` ilə səhifə sayı 4-ə çatdı →
     dörd nüsxə arasında sürüşmə qaçılmaz olardı (bir rəngi dəyişib birini
     unutmaq kifayətdir).

  ⚠️ QAYDALAR (DESIGN.md) — dəyişməzdən əvvəl oxu:
     · Şriftlər ÖZ origin-imizdən. Google Fonts CDN QADAĞAN (München 2022, GDPR).
     · Mavi/bənövşəyi YOXDUR (rəqiblərin rəngi). Gradient yoxdur.
     · Kənar sorğu SIFIR olmalıdır. Öz iddiamızı pozmuruq.

  ⚠️ Yol qeydi: `url('fonts/…')` bu FAYLA nisbətdir. Fayl `sayt/base.css`-dədir,
     şriftlər `sayt/fonts/`-dadır → yol HTML-dəki ilə eyni çıxır. Faylı başqa
     qovluğa köçürsən, şriftlər səssizcə ölür.

  Burada YALNIZ hər səhifədə təkrarlanan şey var. Səhifəyə xas hər şey
  (hero, hesabat vərəqi, forma, dürüstlük bloku) öz səhifəsində qalır.
*/

@font-face {
  font-family: 'Instrument Serif';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('fonts/instrument-serif-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Source Sans 3';
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  src: url('fonts/source-sans-3-var.woff2') format('woff2');
}

:root {
  --paper:     #FBF9F5;
  --ink:       #1A1A17;
  --ink-muted: #6B6862;
  --rule:      #E2DDD3;
  --surface:   #F4F1EA;
  /* Ciddilik şkalası — SIRALI, işıqlıq monotondur (DESIGN.md).
     Siqnal lampası deyil; rəng dərəcə göstərir, təhlükə yox. */
  --sev-kritik:#8C2F22;
  --sev-ciddi: #AD5A39;
  --sev-orta:  #E8C89A;
  --sev-orta-kenar:#D8B682;

  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 96px;

  --serif: 'Instrument Serif', Georgia, 'Times New Roman', serif;
  --sans:  'Source Sans 3', -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  padding: 0 var(--space-lg);
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

.doc { max-width: 720px; margin: 0 auto; }

/* ---- Tipoqrafiya (DESIGN.md modular scale 1.25) ---- */
h1 {
  font-family: var(--serif);
  font-weight: 400;
  /* 32px (telefon) → 56px (geniş ekran). Alt hədd DESIGN.md-nin mobil
     ölçüsüdür, üst hədd hero-ya afişa çəkisi verir. Aralıq addım yoxdur —
     media query ilə sıçramaq əvəzinə enə görə axır. */
  font-size: clamp(2rem, 1.35rem + 2.1vw, 3.5rem);
  line-height: 1.15;
  letter-spacing: -0.02em;
  margin: 0 0 var(--space-md);
}
h2 {
  font-family: var(--serif);
  font-weight: 400;
  font-size: 26px;
  line-height: 1.25;
  letter-spacing: -0.01em;
  margin: 0 0 var(--space-sm);
}
h3 {
  font-size: 19px;
  line-height: 1.35;
  font-weight: 600;
  margin: 0 0 var(--space-2xs);
}

/*
  ⚠️ Sətir sonu tənzimi — dizayn qərarı deyil, DÜZƏLİŞDİR.
  Ana səhifənin h1-i "changed." sözünü TƏK BAŞINA üçüncü sətrə atırdı:
  başlıq üç sətir tuturdu, sonuncusunda bir söz vardı. `balance` sətirləri
  bərabər paylayır → dul söz qalmır. Brauzer dəstəkləmirsə susur (heç nə
  sınmır), yəni risk sıfırdır. Xronki ~6 sətirdən sonra özü söndürür,
  ona görə uzun mətndə əlavə yük vermir.
  `pretty` isə abzasın SON sətrində tək söz qalmasının qarşısını alır.
*/
h1, h2, h3 { text-wrap: balance; }
p, li, dd, figcaption, caption { text-wrap: pretty; }

p { margin: 0 0 var(--space-md); }
.lead { font-size: 19px; line-height: 1.6; color: var(--ink-muted); }
.micro {
  font-size: 12px;
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ink-muted);
  margin: 0 0 var(--space-xs);
}
.small { font-size: 14px; line-height: 1.6; color: var(--ink-muted); }

a { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }
a:hover { text-decoration-thickness: 2px; }

/* Fokus halqası hər yerdə eynidir — klaviatura istifadəçisi itməməlidir. */
a:focus-visible,
button:focus-visible,
input:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 2px;
}

/* Saytın ADI. Hər səhifədə var: gələn adam hansı sayta düşdüyünü oxuya bilməlidir. */
.wordmark {
  font-family: var(--serif);
  font-size: 22px;
  letter-spacing: -0.01em;
  margin: 0;
}

/* ---- Bölmələr ---- */
section { padding: var(--space-2xl) 0; border-top: 1px solid var(--rule); }
footer { padding: var(--space-xl) 0 var(--space-3xl); border-top: 1px solid var(--rule); }

/* Neytral qeyd — dürüstlük blokundan fərqli: burada xəbərdarlıq yox, vəziyyət var. */
.notice {
  background: var(--surface);
  border: 1px solid var(--rule);
  border-radius: 3px;
  padding: var(--space-md) var(--space-lg);
  margin: 0 0 var(--space-lg);
}
.notice > :last-child { margin-bottom: 0; }

.list { margin: 0 0 var(--space-md); padding: 0 0 0 var(--space-lg); }
.list li { margin-bottom: var(--space-xs); }

/* Ekran oxuyucu üçün var, gözlə görünmür — `display:none` OLMAZ, o zaman
   ekran oxuyucu da görməz. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* Səhifə altı naviqasiyası — hər səhifədə eyni yerdə olmalıdır ki, adam
   privacy/sample arasında itməsin. */
.footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm) var(--space-lg);
  margin: var(--space-lg) 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
}

@media (prefers-reduced-motion: reduce) {
  * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}

@media (max-width: 480px) {
  /* h1 artıq `clamp` ilə axır — burada ölçü təkrarlanmır. */
  h2 { font-size: 22px; }
}