/* ─────────────────────────────────────────────────────────────────────────────
   RadarGrowth base — EV ALTYAPISI, tasarım DEĞİL.
   Her üretilen sitenin proje dizinine olduğu gibi kopyalanır; ajan bu dosyayı
   düzenlemez, üstüne `site.css` yazar.

   NEDEN VAR: Tailwind'i bıraktık (tarayıcıda derleme yok, üçüncü taraf CSS yok).
   Tailwind'in gerçek faydası sınıf sözdizimi değildi — HER SİTEDE YENİDEN İCAT
   EDİLMEYEN tutarlı bir ölçekti. Onu buradan veriyoruz: tip ölçeği, boşluk ölçeği,
   ölçü genişliği. Ajan doğaçlama bir ölçek uydurmak zorunda kalmıyor, ve
   skill'lerin Tailwind lehçesindeki tavsiyeleri (`text-4xl`, `space-y-8`)
   mekanik olarak çevrilebiliyor: `text-4xl` → `--step-5`.

   SAHİP OLDUĞU: reset, ölçekler, konteyner, odak halkası, reveal mekaniği.
   SAHİP OLMADIĞI: renk, yazı tipi, gölge, köşe yuvarlaklığı, kişilik.
   Onlar `site.css`'in işi — bu dosya bir sitenin nasıl GÖRÜNECEĞİNE dair tek bir
   karar vermez. Verirse tasarım otoritesi ikiye bölünür ve ortalama = slop.
   ───────────────────────────────────────────────────────────────────────────── */

:root {
    /* ── Tip ölçeği (akışkan: her boy telefonla masaüstü arasında kendi ölçekler) ──
       Küçük ekranda 1.2, geniş ekranda 1.333 oranlı modüler ölçek. Bir boy seçtiğinde
       ara değerlere ihtiyacın olmaz — ölçek zaten sürekli. */
    --step--2: clamp(0.69rem, 0.68rem + 0.07vw, 0.75rem);
    --step--1: clamp(0.83rem, 0.80rem + 0.14vw, 0.94rem);
    --step-0: clamp(1.00rem, 0.95rem + 0.24vw, 1.19rem);
    --step-1: clamp(1.20rem, 1.12rem + 0.39vw, 1.50rem);
    --step-2: clamp(1.44rem, 1.31rem + 0.62vw, 1.89rem);
    --step-3: clamp(1.73rem, 1.53rem + 0.96vw, 2.38rem);
    --step-4: clamp(2.07rem, 1.79rem + 1.44vw, 3.00rem);
    --step-5: clamp(2.49rem, 2.07rem + 2.10vw, 3.79rem);
    --step-6: clamp(2.99rem, 2.39rem + 3.00vw, 4.77rem);
    --step-7: clamp(3.58rem, 2.75rem + 4.19vw, 6.01rem);

    /* ── Boşluk ölçeği ── Dikey ritim buradan gelir. Karışık değerler (18px, 22px,
       27px) bir sayfayı yayın kalitesinden amatöre düşüren en sessiz sebeptir. */
    --space-3xs: 0.25rem;
    --space-2xs: 0.5rem;
    --space-xs: 0.75rem;
    --space-s: 1rem;
    --space-m: 1.5rem;
    --space-l: 2rem;
    --space-xl: 3rem;
    --space-2xl: 4.5rem;
    --space-3xl: 7rem;

    /* ── Ölçü ve konteyner ── */
    --measure: 68ch;          /* okunabilir satır uzunluğu tavanı */
    --container: 1180px;
    --gutter: clamp(1.25rem, 4vw, 3rem);

    /* ── Hareket ── Süre ve easing tek yerde; her bölüm kendi zamanlamasını
       uydurursa sayfa tutarsız hisseder. Değerleri site.css'te ezebilirsin. */
    --ease: cubic-bezier(0.22, 1, 0.36, 1);
    --reveal-duration: 0.7s;
    --reveal-shift: 1.25rem;
}

/* ── Reset ── Yalnız zararlı varsayılanları kaldırır, görünüş kararı vermez. */
*, *::before, *::after { box-sizing: border-box; }

html {
    -webkit-text-size-adjust: 100%;   /* iOS yatay çevirince metni büyütmesin */
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100svh;
    font-size: var(--step-0);
    line-height: 1.6;
}

/* Görsel varsayılan olarak satır içi eleman gibi davranır ve altında açıklanamayan
   4px boşluk bırakır — üretilen sayfalarda tekrar tekrar görülen bir kusur. */
img, picture, video, canvas, svg, iframe { display: block; max-width: 100%; }
img, video { height: auto; }

input, button, textarea, select { font: inherit; color: inherit; }

h1, h2, h3, h4 { line-height: 1.1; margin: 0; text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
a { color: inherit; }

/* Klavye odağı GÖRÜNÜR olmalı — fare kullanıcısını rahatsız etmeden. */
:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 3px;
}

/* ── Konteyner ── */
.container {
    width: 100%;
    max-width: var(--container);
    margin-inline: auto;
    padding-inline: var(--gutter);
}

/* ─────────────────────────────────────────────────────────────────────────────
   REVEAL — kaydırdıkça beliren içerik.

   ★BU DESEN BİR HATA SINIFINI YAPISAL OLARAK KAPATIR. Ölçülmüş kusur: animasyon
   kütüphanesi elemanı gizler, tetikleyici bir sebeple ateşlenmez, ve içerik
   sayfada SONSUZA KADAR görünmez kalır — ziyaretçi o bölümü hiç görmez. Bir kez
   müşteriye kadar gitti.

   Çözüm sırası: DİNLENME HÂLİ GÖRÜNÜR. Gizleme yalnız `html.rg-armed` altında,
   ve o sınıfı JavaScript ancak animasyonu gerçekten yürütebileceğini doğruladıktan
   sonra ekliyor (bkz. base.js). JS yüklenmezse, patlarsa, IntersectionObserver
   yoksa ya da ziyaretçi hareketi kapattıysa → hiçbir şey gizlenmez, sayfa okunur.

   KULLANIMI: belirmesini istediğin elemana `class="reveal"` ekle. Hepsi bu.
   Sıralı gecikme için `style="--reveal-delay:.12s"`. Başka bir şey kurma.
   ───────────────────────────────────────────────────────────────────────────── */
html.rg-armed .reveal {
    opacity: 0;
    transform: translateY(var(--reveal-shift));
}

html.rg-armed .reveal.rg-seen {
    opacity: 1;
    transform: none;
    transition:
        opacity var(--reveal-duration) var(--ease) var(--reveal-delay, 0s),
        transform var(--reveal-duration) var(--ease) var(--reveal-delay, 0s);
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    html.rg-armed .reveal,
    html.rg-armed .reveal.rg-seen {
        opacity: 1;
        transform: none;
        transition: none;
    }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* Ekran okuyucuya görünür, göze görünmez — atlama linkleri ve etiketler için. */
.visually-hidden {
    position: absolute;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}