/* site/ortak.css — gratweather.com
 *
 * TASARIM OKUMASI (10 Ekim, ikinci tur)
 * Ilk tur "yapay zeka kokuyordu" diye geri geldi, hakliydi: koyu kahraman
 * bolumu, uc esit kart, her seyin yuvarlak kutu olmasi, her yere surulmus
 * mavi, baslik altindaki kucuk vurgu cizgisi — bunlarin hepsi LLM varsayilani.
 *
 * YENI YON: **alpin saha dokumani.** Basili bir teknik foy gibi. Dayanaklar:
 *   - Isviçre yol isaretleri (beyaz-mavi-beyaz blaze) zaten markanin isareti.
 *   - Meteoroloji bultenleri ve dag evi tabelalari: dar grotesk, kucuk
 *     harf arali etiketler, cizgi (rule) ile ayrilmis bolumler.
 *   - Uygulamanin kendi duruşu: enstruman gibi, susu olmayan, veriyi gosteren.
 *
 * BUNUN ICIN BILEREK YAPILMAYANLAR:
 *   - Yuvarlak kose + golge "kart" yok. Ayrim KIL CIZGIYLE yapiliyor.
 *   - Koyu, ortalanmis kahraman bolumu yok. Sayfa bir KUNYE ile basliyor:
 *     surum, tarih, diller — bir belgenin ust bilgisi gibi.
 *   - Bolumler NUMARALI (01, 02...) ve numara kenar bosluğunda duruyor.
 *   - Mavi yalniz ANLAM tasidigi yerde: baglanti, blaze, risk. Sus degil.
 *   - Hareket neredeyse yok. Guvenlik uygulamasinin sitesi kipirdamaz.
 *
 * FONT: Archivo Narrow KENDIMIZ BARINDIRIYORUZ (site/font/). Google Fonts
 * baglantisi ziyaretcinin IP'sini Google'a gonderirdi; "takip yok" diyen bir
 * sitede olmaz.
 */

@font-face{
  font-family:"Archivo Narrow";
  src:url("/font/ArchivoNarrow.ttf") format("truetype");
  font-weight:400 700; font-style:normal; font-display:swap;
}

:root{
  --paper:#f4f5f1;      /* marka kagidi */
  --paper2:#eceee6;
  --ink:#14202e;        /* marka murekkebi */
  --ink2:#5a6676;
  --ink3:#8a94a1;
  --rule:#c9cec3;       /* kil cizgi */
  --rule2:#dfe2d9;
  --blue:#1c5da8;
  --safe:#1f7a4d; --watch:#8a5f10; --danger:#a8231c;
  --col:minmax(0,1fr);
}
@media (prefers-color-scheme:dark){
  :root{
    --paper:#0f141a; --paper2:#151c24; --ink:#e6eaef; --ink2:#9aa5b2;
    --ink3:#6c7784; --rule:#2a3540; --rule2:#1e2831; --blue:#7db0f2;
    --safe:#5dc08a; --watch:#e0ad4a; --danger:#ef8279;
  }
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font:16.5px/1.62 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  font-variant-numeric:tabular-nums}

h1,h2,h3,.disp,.num,.kunye b{font-family:"Archivo Narrow",ui-sans-serif,system-ui,sans-serif}

/* Belge izgarasi: metin sutunu, SOLUNDA numara kanali. Numaralar isaretlemeyi
   kirletmesin diye CSS sayaciyla uretiliyor (markup temiz kaliyor). */
.sheet{max-width:980px;margin:0 auto;padding:0 28px 96px}
.body{counter-reset:bolum;padding-left:84px}
@media (max-width:760px){ .body{padding-left:0} }

/* ---------- kunye ---------- */
.kunye{border-bottom:2px solid var(--ink);padding:16px 0 10px;
  display:flex;gap:24px;align-items:flex-end;flex-wrap:wrap}
.kunye .mark{width:34px;height:34px;display:block}
.kunye b{font-size:25px;font-weight:700;letter-spacing:.4px;line-height:1}
.kunye .meta{margin-left:auto;display:flex;gap:22px;flex-wrap:wrap;
  font-size:11.5px;letter-spacing:.9px;text-transform:uppercase;color:var(--ink2)}
.kunye .meta span{display:block}
.kunye .meta i{display:block;font-style:normal;color:var(--ink);letter-spacing:.3px;
  text-transform:none;font-size:14px}

/* ---------- gezinme: sekme degil, dizin satiri ---------- */
.dizin{display:flex;gap:0;border-bottom:1px solid var(--rule);margin-bottom:46px;flex-wrap:wrap}
.dizin a{font-size:12.5px;letter-spacing:1.1px;text-transform:uppercase;text-decoration:none;
  color:var(--ink2);padding:13px 18px 12px;border-bottom:2px solid transparent;margin-bottom:-1px}
.dizin a:first-child{padding-left:0}
.dizin a:hover{color:var(--ink)}
.dizin a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--blue)}
.dizin .diller{margin-left:auto;display:flex;align-items:center;gap:2px;padding:6px 0}
.dizin .diller button{font:inherit;font-size:12.5px;letter-spacing:1.1px;text-transform:uppercase;
  cursor:pointer;background:none;border:0;color:var(--ink3);padding:6px 9px}
.dizin .diller button[aria-pressed="true"]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--blue)}

/* ---------- blaze: Isviçre yol isareti ---------- */
.blaze{display:flex;width:86px;height:9px;margin:0 0 20px}
.blaze i{flex:1}
.blaze i:nth-child(1),.blaze i:nth-child(3){background:var(--ink)}
.blaze i:nth-child(2){background:var(--blue)}

/* ---------- baslik blogu ---------- */
.lede{padding:4px 0 54px;border-bottom:1px solid var(--rule);padding-left:84px}
@media (max-width:760px){ .lede{padding-left:0} }
.lede h1{font-size:clamp(40px,7.2vw,78px);line-height:.98;margin:0 0 20px;font-weight:700;
  letter-spacing:-.6px;max-width:15ch}
.lede p{font-size:clamp(17px,2.1vw,20px);line-height:1.5;color:var(--ink2);margin:0;max-width:52ch}

/* ---------- bolum ---------- */
h2{font-size:clamp(23px,3.2vw,31px);line-height:1.12;margin:46px 0 14px;font-weight:700;
  letter-spacing:-.2px;counter-increment:bolum;position:relative}
/* Saha kilavuzu gelenegi: bolum numarasi kenar bosluğunda asili durur. */
h2::before{content:counter(bolum,decimal-leading-zero);position:absolute;left:-84px;top:.42em;
  font-size:12px;letter-spacing:1.3px;color:var(--ink3);font-weight:700}
@media (max-width:760px){ h2::before{position:static;display:block;margin-bottom:6px} }
h3{font-size:16px;margin:24px 0 5px;font-weight:700;letter-spacing:.1px}
p{margin:0 0 15px;max-width:68ch}
.lead{font-size:18.5px;color:var(--ink2)}
.muted{color:var(--ink2)}
a{color:var(--blue);text-underline-offset:3px}
ul{margin:0 0 15px;padding-left:18px;max-width:68ch} li{margin-bottom:6px}
hr.sep{border:0;border-top:1px solid var(--rule);margin:52px 0 0}

/* kucuk etiket — enstruman dili */
.etiket{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3);
  display:block;margin-bottom:7px;font-weight:600}

/* ---------- veri listesi: kutu degil, cizgi ---------- */
dl.veri{margin:14px 0;border-top:1px solid var(--rule)}
dl.veri div{display:grid;grid-template-columns:minmax(150px,1fr) 2fr;gap:18px;
  padding:13px 0;border-bottom:1px solid var(--rule2);align-items:baseline}
dl.veri dt{font-weight:700;font-size:15.5px}
dl.veri dd{margin:0;color:var(--ink2);font-size:15.5px}
@media (max-width:520px){ dl.veri div{grid-template-columns:1fr;gap:3px} }

table.src,table.feat{width:100%;border-collapse:collapse;font-size:15px;margin:14px 0 18px}
table.src th,table.src td,table.feat th,table.feat td{
  text-align:left;padding:11px 12px 11px 0;border-bottom:1px solid var(--rule2);vertical-align:top}
table.src th,table.feat th{color:var(--ink3);font-weight:600;font-size:11px;letter-spacing:1.1px;
  text-transform:uppercase;border-bottom-color:var(--rule)}
table.feat td+td,table.feat th+th{text-align:center;width:116px;padding-right:0}
.yes{color:var(--safe);font-weight:700}
.no{color:var(--ink3)}

.levels{display:flex;gap:0;margin:16px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.lvl{flex:1;padding:14px 0;font-size:12px;font-weight:700;letter-spacing:1.4px}
.lvl.s{color:var(--safe)} .lvl.w{color:var(--watch)} .lvl.d{color:var(--danger)}

/* ---------- plakalar (ekran goruntuleri) ---------- */
.plates{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:30px;margin:26px 0 10px}
.plate img{display:block;width:100%;border:1px solid var(--rule);background:var(--paper2)}
.plate figcaption{font-size:13px;color:var(--ink2);margin-top:10px;line-height:1.45}
.plate figcaption b{display:block;font-family:"Archivo Narrow",sans-serif;font-size:14px;
  letter-spacing:.3px;color:var(--ink);margin-bottom:2px}
.plate .pl{font-size:10.5px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3);
  display:block;margin-bottom:7px}
.watchrow{display:flex;gap:26px;align-items:flex-start;flex-wrap:wrap;margin:20px 0}
.watchrow img{width:144px;border:1px solid var(--rule);display:block}

ol.steps{list-style:none;counter-reset:s;margin:0;padding:0;max-width:68ch;
  border-top:1px solid var(--rule)}
/* TUZAK: li'yi grid yapmak calismiyor -- <strong> ve ardindaki metin AYRI
   grid ogeleri oluyor, metin ikinci satira dusup 40 px'lik sutuna sikisiyordu.
   Numara mutlak konumlu isaret olarak duruyor. */
ol.steps li{counter-increment:s;position:relative;padding:16px 0 16px 52px;
  border-bottom:1px solid var(--rule2)}
ol.steps li::before{content:counter(s,decimal-leading-zero);position:absolute;left:0;top:18px;
  font-family:"Archivo Narrow",sans-serif;font-size:14px;font-weight:700;color:var(--blue);
  letter-spacing:.6px}
ol.steps strong{display:block;margin-bottom:3px}

/* Durusu olan tek vurgu: cerceve degil, kalin sol cizgi. */
.honest{border-left:3px solid var(--ink);padding-left:20px;margin:20px 0;max-width:68ch}
.honest p:last-child{margin-bottom:0}

/* ---------- planlar: kart degil, sutun ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:0;
  margin:22px 0;border-top:2px solid var(--ink)}
.plan{padding:22px 24px 26px 0;border-bottom:1px solid var(--rule)}
.plan+.plan{padding-left:24px;border-left:1px solid var(--rule2)}
@media (max-width:700px){ .plan+.plan{padding-left:0;border-left:0} }
.plan h3{margin:0;font-size:12px;letter-spacing:1.3px;text-transform:uppercase;color:var(--ink3)}
.plan .price{font-family:"Archivo Narrow",sans-serif;font-size:38px;font-weight:700;
  margin:6px 0 2px;line-height:1}
.plan.now .price{color:var(--blue)}
.plan .note{font-size:12.5px;color:var(--ink3);margin:0 0 16px;letter-spacing:.3px}
.plan ul{padding-left:16px;font-size:14.5px;margin:0;color:var(--ink2)}

/* ---------- durum ---------- */
.state{margin:16px 0;border-top:1px solid var(--rule)}
.state div{display:grid;grid-template-columns:22px minmax(140px,1fr) 2fr;gap:14px;
  padding:13px 0;border-bottom:1px solid var(--rule2);align-items:baseline}
.state b{font-size:15.5px}
.state span{color:var(--ink2);font-size:15px}
.dot{width:9px;height:9px;border-radius:50%;display:block;margin-top:7px}
.dot.ok{background:var(--safe)} .dot.wip{background:var(--watch)} .dot.no{background:var(--ink3)}
@media (max-width:560px){ .state div{grid-template-columns:22px 1fr} .state span{grid-column:2} }

.log{list-style:none;padding:0;margin:16px 0;max-width:68ch;border-top:1px solid var(--rule)}
.log li{padding:15px 0;border-bottom:1px solid var(--rule2)}
.log time{font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:var(--ink3);
  display:block;margin-bottom:4px}

/* Sosyal baglantilar: yuvarlak renkli ikon dugmesi YOK -- o sablon dili
   sayfanin geri kalaniyla kavga ediyor. Belgenin kunyesi gibi: kucuk
   etiket, duz adlar, saga yaslanmis kullanici adi.
   Yalniz GERCEKTEN acik hesaplar listeleniyor; X hesabi yok, konmadi. */
nav.sosyal{display:flex;align-items:baseline;gap:22px;flex-wrap:wrap;
  border-top:1px solid var(--rule);margin-top:56px;padding-top:16px}
nav.sosyal .etiket{margin:0}
nav.sosyal a{font-size:15px;text-decoration:none;color:var(--ink);
  border-bottom:1px solid var(--rule);padding-bottom:2px}
nav.sosyal a:hover{border-bottom-color:var(--blue);color:var(--blue)}
nav.sosyal .kulp{margin-left:auto;font-size:11px;letter-spacing:1.2px;
  text-transform:uppercase;color:var(--ink3)}
@media (max-width:620px){ nav.sosyal .kulp{margin-left:0} }

footer{border-top:1px solid var(--rule);margin-top:26px;padding-top:18px;font-size:13.5px;
  color:var(--ink2);display:flex;gap:26px;flex-wrap:wrap;align-items:baseline}
footer a{color:var(--ink2)}
footer nav{display:flex;gap:18px;flex-wrap:wrap}
footer .son{margin-left:auto;font-size:11px;letter-spacing:1.1px;text-transform:uppercase;color:var(--ink3)}

.locale{display:none}
.locale.on{display:block}