/* ============================================================
   WINDBASE — notinparis.me DÜZENİ (Ağustos 2026)
   ------------------------------------------------------------
   Kaan'ın isteği: referans sayfanın üst alanı ve "Made to keep"
   bölümü BİREBİR kopyalansın. Ölçüler tarayıcıda referans
   sayfadan okundu, aşağıda her blokta yazılı.

   Sayfa şu an: hero → şerit → expeditions → takvim →
                timer + bülten → (altı boş)

   Bu dosya style.css'ten SONRA yükleniyor ve ilgili bölümleri
   eziyor. Yön onaylanınca ikisi birleştirilecek.
   ============================================================ */

/* ---------- 1. TOKEN'LAR ----------
   Açık zemin soğutuldu: #F2EDE3 (ton 40°, sıcak) → #E7ECEE (197°).
   Referansın kendi açık zemini saf beyaz; Kaan "beyaz yerine bizim
   açık rengin daha soğuk hâli" dedi.
   Ölçüldü — kontrast neredeyse aynı:
     navy metin açık zeminde 15.67 → 15.35
     navy %62 (ikincil metin)  4.87 →  4.82   (eşik 4.5)
     navy, dolu altın buton üstünde 7.56 (değişmedi)
   Alternatif tek satırlık takas: #EFEEEA (nötr) · #E9ECEC (gri)   */
:root{
  --cream:#E7ECEE;
  --cream-2:#DCE3E6;
  --line-l:rgba(3,9,16,.15);
  --line-d:rgba(231,236,238,.15);
  --tx-d:#E7ECEE;
  --tx-d-dim:rgba(231,236,238,.60);   /* 6.1:1 */
  --tx-l-dim:rgba(3,9,16,.62);      /* 4.8:1 */
  --dim-l:rgba(3,9,16,.52);         /* büyük metin, 3.6:1 */
  /* referansın sarmalayıcısı: max 1480, yan dolgu 56 */
  --wrap:1480px;
  --wpad:clamp(20px,4vw,56px);
}
body{background:var(--cream);color:var(--tx-l)}
.light{background:var(--cream);color:var(--tx-l)}

/* ---------- 2. ORTAK ----------
   Referansın mikro etiketi: 10.5px / ls 1.68px (0.16em) / versal.
   ⚠️ Referansta bu katman monospace. "Font aynı kalacak" dendiği
   için üçüncü font EKLENMEDİ, aynı geometri Poppins 600 ile kuruldu.
   Mono'ya geçilecekse değişecek tek yer .lbl.                     */
.lbl{display:block;font-family:var(--body);font-weight:var(--w-ui);
     font-size:10.5px;line-height:16.3px;letter-spacing:.16em;
     text-transform:uppercase;color:var(--tx-l-dim)}
.wrapx{max-width:var(--wrap);margin:0 auto;padding:0 var(--wpad)}
.mono{font-variant-numeric:tabular-nums}

/* Referanstaki bağlantı: aynı mikro punto, alt çizgi 1 px, ok ayrı */
.nx{display:inline-flex;align-items:center;gap:6px;
    font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
    font-weight:var(--w-ui);padding-bottom:4px;
    border-bottom:1px solid currentColor;color:inherit}
.nx::before{content:"";position:absolute}
@media(hover:hover){ .nx:hover{opacity:.6} }

/* ---------- 3. HERO ----------
   Referans ölçüleri (1999 px ekranda okundu):
     bölüm yüksekliği           800 px   (mobil 506)
     iç sarmalayıcı             max 1480, dolgu 40px 56px 48px
     üst blok  .hero-mid        dolgu 80px 0 16px
     başlık                     80 px / lh 0.70 / versal
     alt şerit .hero-bot        üstünde 1px rgba(255,255,255,.2)
                                dolgu-üst 12 px, iki eşit sütun, gap 48
     sol sütun                  10.5px / ls .16em / versal / %78 beyaz
     sağ sütun                  22px / lh 1.30 / w300 / sağa yaslı
   Bizde başlığın yerine WORDMARK var; kaydırma animasyonu (heroLock)
   ana tasarımdaki gibi korundu.                                    */
.hero{height:800px;min-height:0}
.hero-media{position:absolute;inset:0}
.hero-media img,.hero-media video{filter:saturate(.78) contrast(1.05) brightness(.82)}

/* PERDE — YENİDEN ÖLÇÜLDÜ (Kaan: "video gözükmüyor böyle").
   Wordmark ortadan alt banda inince ortadaki koyuluğa gerek kalmadı:
   merkez vinyeti tamamen KALDIRILDI ve dikey perde belirgin
   hafifletildi. Video artık çok daha açık.
     eski: üst .42 · orta .30 · alt .72 + vinyet .26
     yeni: üst .26 · orta .14 · alt .62 + vinyet YOK
   Ölçüm — videodan 4 sn aralıkla 9 kare, metin bandının en kötü %5
   persentili, hepsi beyaz metin için:
     header 4.65 · logo + slogan 4.76 · alt şerit 6.29   (eşik 4.5)
   Daha da hafifletmek denendi (üst .24 / orta .08) — header 3.60'a,
   logo 4.05'e düşüyor, eşiğin altına iniyor. Bu değerler videonun
   en açık kaldığı ve hâlâ geçen ayar.
   VİDEO DEĞİŞİRSE BU ÜÇ DEĞER YENİDEN ÖLÇÜLMELİ.

   ⚠️ 27 AĞU 2026 — VİDEO DEĞİŞTİ (hero3-*), PERDE YENİDEN ÖLÇÜLDÜ.
   Yöntem simülasyon değil GERÇEK RENDER: videodan 3,5 sn aralıkla
   9 kare çıkarıldı, her kare #heroStill'e basıldı (video ile birebir
   aynı CSS: filter + bu perde), metin gizlenip zeminin ekran görüntüsü
   alındı, sonra .hero-tag'in Range dikdörtgeni ve wordmark kutusu o
   PNG'den örneklendi — en kötü %5 persentil, beyaz metne karşı WCAG.
   ÖNCEKİ perde (üst .26 · orta .14 · alt .62) yeni videoda MOBİLDE
   KALIYORDU: slogan 390 px'te 3,39 (kare 9, kemerli sondaki güneş) ve
   4,10 (kare 5) — eşik 4,5. Masaüstü geçiyordu (6,36).
   Tarama: .44/.70 → 4,45 (hâlâ altında) · .48/.72 → 4,91 ✓ · .52/.76
   → 5,45 (fazla koyu). SEÇİLEN: 62%'de .48, 100%'de .72.
   Ölçülen son değerler (9 karenin en kötüsü):
     1440 — slogan 8,69 · wordmark 8,98 · header 5,90
      390 — slogan 4,91 · wordmark 7,03 · header 5,52   (eşik 4,5 / 3,0)
   Üst iki durak (.26 / .14) DEĞİŞMEDİ — videonun parlak orta bölümü
   olduğu gibi duruyor, koyulaşan yalnız alt yarı.                    */
.hero-media::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(3,9,16,.26) 0%,rgba(3,9,16,.14) 38%,rgba(3,9,16,.48) 62%,rgba(3,9,16,.72) 100%)}

.hero-in{position:relative;z-index:2;height:100%;
  max-width:var(--wrap);margin:0 auto;padding:40px var(--wpad) 48px;
  display:flex;flex-direction:column;justify-content:flex-end}

/* WORDMARK + SLOGAN — alt çizginin hemen ÜSTÜNDE (Kaan, Ağu 2026:
   "alttaki çizginin tam üstüne kadar insin, video gözükmüyor böyle").
   Ortalanmış hâlde blok videonun ortasını kapatıyordu.

   Mutlak konum yerine AKIŞA alındı: .hero-in bir flex sütun ve
   içeriği alta yaslıyor, .hero-lock da .hero-bot'un hemen üstünde
   duruyor. Böylece çizgiyle arasındaki mesafe sabit sayı değil —
   alt şerit kaç satıra çıkarsa çıksın hizası bozulmuyor.
   main.js transform'u yine bu kutuya uyguluyor; transform yerleşimi
   etkilemediği için hiza her koşulda korunuyor. JS'e dokunulmadı.

   İkinci %10 küçültme: logo 648 → 583 px, slogan 9,5 → 8,5 px.
   (İlk hâli 720 px / 10,5 px idi.)
   Marka sınırı: 583 × 1.28 = 746 px, gerçek dolu genişlik olan
   996 px'in altında (skill §11).                                    */
/* ⚠️ left/right/bottom AÇIKÇA sıfırlanıyor. style.css'teki eski kural
   .hero-lock'a position:absolute + bottom:clamp(74px,13vh,132px)
   veriyordu. Burada position:relative'e çevirmek yeterli değil:
   relative'de de "bottom" geçerlidir ve bloğu 74–132 px YUKARI
   itiyordu — logonun bir türlü çizgiye inmemesinin sebebi buydu.
   Mobilde aynı kuralın 100–156 px'lik sürümü var, o da aşağıda
   sıfırlanıyor. */
.hero-lock{position:relative;left:auto;right:auto;top:auto;bottom:auto;
  z-index:2;display:flex;flex-direction:column;align-items:center;
  justify-content:flex-end;text-align:center;pointer-events:none;
  margin-bottom:20px;
  will-change:transform;transform-origin:50% 50%}
.hero-lock-in{display:block}
.hero-tag{display:block;margin-bottom:16px;color:#fff;
  font-size:8.5px;letter-spacing:.16em;font-weight:var(--w-ui)}
.hero-wm img{width:min(46.9vw,583px);height:auto;margin:0 auto;object-fit:contain}

.hero-bot{position:relative;z-index:3;
  border-top:1px solid rgba(255,255,255,.2);padding-top:12px;
  display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:end}
.hero-bot .l{display:flex;flex-direction:column;gap:6px}
.hero-bot .l span{font-size:10.5px;line-height:15.8px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:rgba(255,255,255,.85)}
.hero-bot .r{text-align:right;font-size:22px;line-height:1.30;
  letter-spacing:-.01em;font-weight:400;color:#fff}

@media(max-width:899px){
  .hero{height:506px}
  .hero-in{padding:28px var(--wpad) 26px}
  .hero-wm img{width:min(68vw,340px)}
  .hero-lock{bottom:auto;margin-bottom:14px}
  .hero-tag{margin-bottom:11px;font-size:8px}
  .hero-bot{grid-template-columns:1fr;gap:12px}
  .hero-bot .r{text-align:left;font-size:16px}
}
.hero-foot,.scrollcue{display:none}

/* ---------- 4. ŞERİT ----------
   Referans: tam genişlik, 4 eşit sütun, hücre dolgusu 22px 56px,
   hücreler arası 1px dikey çizgi, bölümün altında 1px çizgi,
   etiket 10px / ls .16em / soluk, değer 16px / ls -0.015em.
   Mobilde 2×2.                                                     */
/* Sekiz hücre, iki sıra — eski "By the numbers" rakamları buraya girdi. */
.strip{display:grid;grid-template-columns:repeat(4,1fr);
  border-bottom:1px solid var(--line-l);background:var(--cream)}
/* Yan dolgu 4vw → 2.2vw: referansta ekran 1984 px olduğu için 56 px
   rahat duruyor, 1024–1440 arasında aynı dolgu hücreyi boğuyordu.
   Ölçüm (koordinat satırı en dar içerik): 1440 → 167 px boşluk,
   1200 → 118, 1024 → 81, 900 → 56. */
.strip-cell{display:flex;flex-direction:column;gap:6px;
  padding:22px clamp(14px,2.2vw,56px);border-right:1px solid var(--line-l)}
.strip-cell:nth-child(4n){border-right:0}
.strip-cell:nth-child(-n+4){border-bottom:1px solid var(--line-l)}
.strip-cell .l{font-size:10px;line-height:15.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.strip-cell .v{font-size:16px;line-height:1.1;letter-spacing:-.015em;
  font-weight:var(--w-ui);color:var(--tx-l);font-variant-numeric:tabular-nums}
@media(max-width:899px){
  .strip{grid-template-columns:repeat(2,1fr)}
  .strip-cell{padding:16px}
  .strip-cell:nth-child(2n){border-right:0}
  .strip-cell:not(:nth-last-child(-n+2)){border-bottom:1px solid var(--line-l)}
  .strip-cell:nth-child(4n){border-right:0}
  .strip-cell .v{font-size:15px}
}
/* 380 px altında dört değerin en uzunu ("36.7526°N · 28.9436°E")
   iki sütuna sığmıyor — tek sütuna iniyor. */
@media(max-width:379px){
  .strip{grid-template-columns:1fr}
  .strip-cell{border-right:0;border-bottom:1px solid var(--line-l)}
  .strip-cell:last-child{border-bottom:0}
}

/* ---------- 5. BÖLÜM BAŞLIĞI (referanstaki .section-head) ----------
   Referans: bölüm dolgusu 72px 0 18px, sarmalayıcı max 1480 + 56 yan.
   Başlık bloğu: ızgara [1fr auto], gap 24, alt dolgu 28, altında 1px.
   Etiket ile başlık arası 18 px. Başlık 104px / lh 1.0 / versal.
   ⚠️ Bizde 104 px KULLANILMADI: Archivo Black, referansın Coolvetica
   Condensed'inden çok daha ağır ve geniş. Tavan 78 px'e indirildi. */
.sec{padding:clamp(48px,6vw,72px) 0 18px}
.sec-head{display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:end;gap:24px;padding-bottom:28px;
  border-bottom:1px solid var(--line-l)}
/* sağ sütunu olmayan başlık (Expeditions) tek sütuna düşüyor */
.sec-head:not(:has(.sec-head-r)){grid-template-columns:1fr}
.sec-title{display:flex;flex-direction:column;gap:18px}
.sec-title h2{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(34px,5.4vw,78px);line-height:1;letter-spacing:-.02em;
  color:var(--tx-l)}
.sec-title h2 .dim{color:var(--dim-l)}
.sec-head-r{padding-bottom:6px}
@media(max-width:719px){
  .sec-head{grid-template-columns:1fr;gap:18px;padding-bottom:20px}
  .sec-head-r{padding-bottom:0}
}

/* ---------- 6. EXPEDITIONS KARTLARI ----------
   Kaan (Ağu 2026): kartlar büyüsün, aşağıdaki takvimle aynı genişliği
   kaplasın, içerikleri ortalansın.
   Bu yüzden referanstaki sabit 360 px'lik kaydırmalı ray bırakıldı:
   artık üç eşit sütun, sarmalayıcının tamamını dolduruyor. 1440 px'te
   kart 447 px (eskiden 360). Masaüstünde kaydırma kalmadığı için ok
   düğmeleri de kaldırıldı — ölü düğme bırakmamak için.
   Mobilde (640 altı) yine kaydırmalı tek sıra.                       */
.rail-wrap{position:relative;padding-top:24px}
.rail-x{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(14px,1.6vw,24px);padding-bottom:24px}

.prod{display:flex;flex-direction:column;gap:14px;color:inherit;text-align:center}
.prod-ph{position:relative;aspect-ratio:4/5;overflow:hidden;
  background:var(--cream-2);display:block}
.prod-ph img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;transition:transform .9s var(--e)}
@media(hover:hover){ .prod:hover .prod-ph img{transform:scale(1.04)} }
/* referanstaki "SOLD OUT" yuvası — bizde tarih. İçerik ortalandığı
   için sol alt yerine alt-orta. Perde sadece o bandın arkasında. */
.prod-ph::after{content:"";position:absolute;inset:auto 0 0 0;height:38%;
  background:linear-gradient(to top,rgba(3,9,16,.66),rgba(3,9,16,0))}
.prod-ph .st{position:absolute;left:12px;right:12px;bottom:14px;z-index:2;
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(24px,2.9vw,40px);line-height:.9;letter-spacing:-.02em;
  color:#fff}
.prod-meta{display:flex;flex-direction:column;align-items:center;gap:7px}
.prod-meta .brand{font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.prod-meta .name{font-family:var(--display);font-weight:400;
  text-transform:uppercase;letter-spacing:-.02em;line-height:1;
  font-size:clamp(18px,1.9vw,26px);color:var(--tx-l)}
.prod-meta .side{font-size:13px;color:var(--tx-l-dim);
  font-variant-numeric:tabular-nums}

/* Eşik 780 px — ÖLÇÜLDÜ. Üç sütunlu ızgarada kart genişliği:
   1440 → 427 px · 1024 → 303 · 900 → 266 · 800 → 236 · 780 → 230.
   780'in altında kart tarihi (en uzun: "26 SEP–3 OCT", 178 px)
   taşmaya başlıyor — 640 px'te 15 px taşıyordu. O yüzden 779'dan
   itibaren kaydırmalı tek sıraya geçiyor. */
@media(max-width:779px){
  .rail-x{grid-auto-flow:column;grid-template-columns:none;
    grid-auto-columns:78vw;overflow-x:auto;scroll-snap-type:x mandatory;
    scrollbar-width:none;margin-inline:calc(var(--wpad) * -1);
    padding-inline:var(--wpad)}
  .rail-x::-webkit-scrollbar{display:none}
  .prod{scroll-snap-align:start}
}

/* ---------- 7. TAKVİM ----------
   Referanstaki "This week in the room" listesi:
   satır ızgarası, aralarında 1px çizgi, sağda ince çerçeveli düğme.
   data-slot / data-book AYNEN korundu — modaldaki önseçim çalışıyor. */
.wb-list{list-style:none;margin-top:0}
.wb-row{display:grid;align-items:center;
  grid-template-columns:56px minmax(0,1fr) 200px 130px auto;
  gap:16px;padding:19px 0;border-bottom:1px solid var(--line-l);
  transition:padding-left .35s var(--e)}
@media(hover:hover){ .wb-row:hover{padding-left:10px} }
.wb-row .i{font-size:10.5px;letter-spacing:.16em;color:var(--tx-l-dim);
  font-weight:var(--w-ui);font-variant-numeric:tabular-nums}
.wb-row .n{font-family:var(--display);font-weight:400;text-transform:uppercase;
  letter-spacing:-.02em;line-height:1;font-size:clamp(17px,1.7vw,23px)}
.wb-row .dt,.wb-row .pl{font-size:12.5px;letter-spacing:.04em;
  color:var(--tx-l-dim);font-variant-numeric:tabular-nums}
.wb-row .bk{justify-self:end}
.wb-book{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);border:1px solid var(--line-l);
  padding:12px 20px;color:var(--tx-l);
  transition:background .3s var(--e),color .3s var(--e),border-color .3s var(--e)}
@media(hover:hover){
  .wb-book:hover{background:var(--tx-l);border-color:var(--tx-l);color:var(--cream)}
}
/* MOBİL: satır iki kata düşüyor, hücre yerleri AÇIKÇA yazılı —
   sütun boş bırakılırsa tarayıcı düğmeyi 1. sütuna koyuyor. */
@media(max-width:899px){
  .wb-row{grid-template-columns:46px minmax(0,1fr) auto;
    grid-template-areas:"i n bk" ". dt bk" ". pl bk";
    row-gap:5px;padding:17px 0}
  .wb-row .i{grid-area:i;align-self:start;padding-top:4px}
  .wb-row .n{grid-area:n} .wb-row .dt{grid-area:dt}
  .wb-row .pl{grid-area:pl} .wb-row .bk{grid-area:bk;align-self:center}
}
@media(max-width:429px){
  .wb-row{grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"i bk" "n n" "dt dt" "pl pl"}
  .wb-row .i{padding-top:0}
  .wb-book{padding:11px 15px}
}
.wb-note{margin-top:20px;font-size:12.5px;color:var(--tx-l-dim)}

/* ---------- 8. HEADER ----------
   Referansla aynı üç sütun; logo ORTADA (mobilde de — Kaan'ın kararı,
   referansta mobilde sola kayıyor).

   ⚠️ mix-blend-mode:difference KAPATILDI (Kaan, Ağu 2026: "üstteki
   menü yazıları gözükmüyor"). Sebep: difference, altındaki rengin
   TERSİNİ alıyor; yeni gün batımı videosunda üst bandın rengi
   kareden kareye değişiyor, beyaz metin bazı karelerde turuncunun
   tersi olan koyu maviye dönüp kayboluyordu. Artık metin sabit beyaz
   ve barın arkasına ölçülmüş bir şerit kondu.
   Ölçüm (9 kare, en kötü %5): şeritsiz 3.96 → şeritle 4.98.         */
header{mix-blend-mode:normal!important;color:#fff}
/* Perde hafifleyince bar için ayrı şerit gerekti: 800 px'lik hero'nun
   %14'ü ≈ 112 px, barın (84 px) altını da kapsıyor.
   Ölçüm: şeritsiz 3.60 → .60 opaklıkla 4.65 (eşik 4.5). */
header::before{content:"";position:absolute;inset:0 0 auto 0;height:135px;
  z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,9,16,.60),rgba(3,9,16,0))}
header.solid::before,header.menu-open::before{opacity:0}
.navlink,.cta,.lang-b,.hdr-nav a{color:#fff}
.lang-b{opacity:.7}
.lang-b.is-on{opacity:1}
.hdr-l{display:flex;align-items:center;gap:clamp(12px,1.6vw,22px)}
.hdr-nav{display:flex;align-items:center;gap:clamp(12px,1.6vw,22px)}
.hdr-nav a{font-size:12.6px;letter-spacing:.2em;text-transform:uppercase;
  font-weight:var(--w-ui);transition:color .3s var(--e)}
@media(hover:hover){ .hdr-nav a:hover{color:var(--gold)} }
/* Eşik 1024 px — ÖLÇÜLDÜ. Izgara 1fr|auto|1fr olduğu için logonun
   ortada kalması sol grubun kendi sütununa sığmasına bağlı. Sol
   sütunda kalan boşluk (Menu + iki bağlantı, gerçek Poppins ile):
   1440→298 · 1200→200 · 1100→160 · 1024→130 · 900→80 px.
   Üç bağlantıda bu 900 px'te 2 px'e düşüyordu, o yüzden hem
   bağlantı sayısı ikiye indi hem eşik 1024'e çekildi. */
@media(max-width:1023px){ .hdr-nav{display:none} }

/* ---------- 9. FOOTER ----------
   ⚠️ Zemin AÇIKÇA veriliyor: sayfa gövdesi artık krem, footer'ın kendi
   zemini yoktu ve metinleri koyu zemine göre yazılmış. Zemin verilmezse
   açık metin açık zeminde kayboluyor. Logo da yalnızca koyu zeminde
   kullanılabiliyor (skill §11).                                       */
footer{background:var(--navy);color:var(--tx-d)}
.f-links a{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui)}

/* ---------- 10. HAREKET AZALTMA ---------- */
@media(prefers-reduced-motion:reduce){
  .prod-ph img,.wb-row{transition:none}
}

/* ---------- 11. TIMING BAR — geri sayım + bülten ----------
   Kaan (Ağu 2026): "timer'daki rakamlar beyaz olsun, Get notified
   kısmı ve oradaki bütün yazılar beyaz olsun."
   Bölümün kendi fotoğrafı zaten siyah-beyaz ve ölçülmüş bir perdesi
   var (style.css: brightness .60 + rgba(3,9,16,.34) — o ölçümde
   sol blok 4.7, sağ blok 5.1 veriyordu). Metin krem yerine saf beyaza
   çıkınca kontrast yalnızca ARTIYOR, yeniden ölçüm gerekmiyor:
   beyaz her zaman kremden açık.                                      */
.tbar,.tbar *{color:#fff}
.tbar .eyebrow,.tbar .cd-l,.tbar .cd-when,.tbar .tbar-lede,
.tbar .nl-consent span,.tbar .nl-msg{color:rgba(255,255,255,.88)}
.tbar .cd-n,.tbar .cd-s{color:#fff}
.tbar .nl input[type=email]{color:#fff}
.tbar .nl input[type=email]::placeholder{color:rgba(255,255,255,.7)}
.tbar .nl-btn{color:var(--navy)}

/* ---------- 12. EKİP ----------
   Bölüm eski tasarımdan OLDUĞU GİBİ alındı (Kaan: "team sayfamızı
   ekleyelim"). Markup da CSS de style.css'teki hâliyle çalışıyor;
   burada yalnızca yeni açık zemine oturması sağlanıyor.
   ⚠️ İsimler gerçek (Buse · Sina · Orhan · Tony · Kaan · Çiğdem) ama
   görev, lokasyon ve bio satırları UYDURMA, görseller Unsplash yer
   tutucusu. Yayına almadan önce doğrulat.                            */
/* Genişlik takvimle AYNI olsun (Kaan, Ağu 2026): standart sarmalayıcı
   max 1480 + yan dolgu --wpad. Bölümün kendi --pad dolgusu iptal
   edildi, sınır artık iç ızgarada.
   Timer şeridine DOKUNULMADI — tam genişlik ayırıcı olarak kalıyor. */
#team{background:var(--cream);color:var(--tx-l);padding-inline:0}
#team .team-grid{max-width:var(--wrap);margin:0 auto;padding:0 var(--wpad)}
#team .h2{font-size:clamp(30px,4.2vw,50px);line-height:.94}

/* ---------- 13. ROTA HARİTASI ----------
   Kaan'ın referansı: elle çizilmiş, tek renk, zeminde fotoğraf yok.
   Solda harita, sağda o durağın görseli ve metni.
   Bölüm 340vh; içi yapışkan, yani harita ekranda dururken kaydırma
   ilerliyor ve çizgi çiziliyor. Eski Routes'un mekaniği, yeni dili.

   Serif YALNIZCA burada: EB Garamond. Referanstaki harita hissini
   taşıyan asıl şey bu. Archivo Black ve Poppins'e dokunulmadı.     */
.rt-wrap{position:relative;height:340vh;background:var(--cream);color:var(--tx-l)}
.rt-stick{position:sticky;top:0;height:100vh;height:100svh;
  display:flex;align-items:center;overflow:hidden}
.rt-in{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--wpad);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.82fr);
  gap:clamp(24px,4vw,72px);align-items:center}

.rt-map{position:relative;height:min(78vh,760px)}
.rt-svg{width:100%;height:100%;display:block;overflow:visible}

/* çizgi: saç teli inceliğinde, tek renk. 620 birim genişlik ekranda
   ~450 px'e denk geliyor, yani 2 birim ≈ 1.4 px. */
.rt-line{fill:none;stroke:var(--tx-l);stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.rt-dot{fill:var(--tx-l);opacity:.16;transition:opacity .45s var(--e)}
.rt-dot.on{opacity:1}
.rt-lbl{opacity:.16;transition:opacity .5s var(--e)}
.rt-lbl.on{opacity:1}
.rt-n{font-family:"EB Garamond",Georgia,serif;font-weight:600;
  font-size:21px;fill:var(--tx-l)}
.rt-s{font-family:"EB Garamond",Georgia,serif;font-weight:400;
  font-size:17px;fill:rgba(3,9,16,.66)}
.rt-vig{color:var(--tx-l);opacity:.9}

/* sağ panel */
.rt-side{max-width:44ch}
.rt-fig{position:relative;aspect-ratio:4/5;overflow:hidden;
  background:var(--cream-2);margin-bottom:20px}
.rt-fig img,.rt-fig picture{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;opacity:0;transition:opacity .6s var(--e)}
.rt-fig .on{opacity:1}
.rt-fig picture img{position:static;opacity:1}
.rt-idx{display:block;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.rt-name{margin-top:10px;font-family:"EB Garamond",Georgia,serif;
  font-weight:600;font-size:clamp(26px,3vw,42px);line-height:1.05;
  letter-spacing:-.01em;color:var(--tx-l)}
.rt-desc{margin-top:12px;font-size:clamp(14px,1.15vw,16px);line-height:1.6;
  color:var(--tx-l-dim)}
.rt-prog{display:block;margin-top:20px;font-size:10.5px;letter-spacing:.16em;
  font-weight:var(--w-ui);color:var(--tx-l-dim);font-variant-numeric:tabular-nums}

/* MOBİL: harita üstte, panel altında. Yapışkan yükseklik korunuyor ama
   harita daralıyor — 620 birimlik viewBox telefonda etiketleri
   okunmaz hâle getirdiğinden etiket puntoları büyütülüyor. */
@media(max-width:899px){
  .rt-wrap{height:300vh}
  .rt-in{grid-template-columns:1fr;gap:16px;align-content:center}
  .rt-map{height:min(46vh,380px)}
  .rt-n{font-size:30px}
  .rt-s{font-size:24px}
  .rt-line{stroke-width:3}
  .rt-dot{r:9}
  .rt-fig{aspect-ratio:16/10;margin-bottom:14px}
  .rt-side{max-width:none}
  .rt-name{font-size:26px}
  .rt-desc{font-size:14px}
  .rt-prog{margin-top:12px}
}
/* telefon yatayken yapışkan çerçeve çok basık — harita küçülüyor */
@media(max-height:560px) and (max-width:899px){
  .rt-map{height:34vh}
  .rt-fig{display:none}
}
@media(prefers-reduced-motion:reduce){
  .rt-dot,.rt-lbl,.rt-fig img,.rt-fig picture{transition:none}
}

/* ---------- 14. "WHAT WINDBASE IS" — AYIRICI BANT ----------
   Kaan (Ağu 2026), sırayla: bant çok darmış → yükselt · görseli
   karartma, üst tarafını kullan · paragrafları SAĞDAKİ KOYU kısma al,
   beyaz olsun.

   SONUÇ — iki bölgeli düzen, fotoğraf filtresiz (yalnızca doygunluk .92):
     SOL ÜST : etiket + başlık, LACİVERT, gökyüzünün üstünde
     SAĞ ALT : iki paragraf, BEYAZ, dalganın koyu suyunun üstünde
   Fotoğraf zaten soldan sağa ve yukarıdan aşağıya koyulaşıyor; metin
   renkleri bu doğal geçişi takip ediyor, perdeye gerek kalmadı.

   ÖLÇÜMLER (fotoğraf üstten yaslı, bant 32vw):
     sol lacivert  (x .02-.40 · y .09-.42) : 6.62  en kötü %1
     sağ beyaz     (x .52-.98 · y .44-.76) : 4.73  en kötü %5, PERDESİZ
       aynı bölgeye hafif sağ gradyan (.12) eklenince 5.25 — güvenlik payı
   ⚠️ Neden paragraflar ALTA yaslı: aynı sağ sütun ÜST hizada 1.88'e
   düşüyor (gökyüzü + parlak kabarcıklar). Yukarı çekilirse okunmaz.
   ⚠️ Neden sol sütun %40'ı geçmiyor: %45'te dalga tepesi kadraja
   giriyor, lacivert metin 2.21'e düşüyor.
   ⚠️ Beyaz metni fotoğrafın parlak kısmında tutmak DENENDİ ve olmadı:
   perdesiz 1.97, .28 perdeyle 3.42; geçmesi için .46 gerekiyordu ki o
   da "karartmayalım"ın tersi.

   MOBİL BAŞKA KADRAJ: telefonda iki bölgeli düzen sığmıyor, o yüzden
   görselin KOYU SU bölgesinden kare kesildi (2600×1793 +1400+1692) ve
   metnin tamamı beyaz. Ölçüm: perdesiz 9.41.
   Görsel değişirse bu değerlerin HEPSİ yeniden ölçülmeli.          */
.wi{position:relative;overflow:hidden;isolation:isolate;
  min-height:clamp(340px,32vw,500px);display:flex;align-items:stretch}
.wi-media{position:absolute;inset:0;z-index:0}
.wi-media img{width:100%;height:100%;object-fit:cover;object-position:50% 0%;
  filter:saturate(.92)}
/* yalnızca SAĞ tarafa çok hafif gradyan — beyaz paragraflar için
   güvenlik payı. Sol taraf hiç etkilenmiyor (gradyan %40'ta sıfır). */
.wi::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,rgba(3,9,16,0) 40%,rgba(3,9,16,.12) 100%)}

.wi-in{position:relative;z-index:2;width:100%;
  max-width:var(--wrap);margin:0 auto;
  padding:clamp(34px,4.4vw,58px) var(--wpad);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);
  gap:clamp(20px,3vw,56px)}
.wi-head{align-self:start;max-width:min(94%,560px)}
.wi-body{align-self:end;justify-self:end;max-width:min(96%,520px)}

/* SOL — lacivert, gökyüzünün üstünde */
.wi-head .lbl{color:rgba(3,9,16,.72)}
.wi-head h2{margin-top:14px;font-family:var(--display);font-weight:400;
  text-transform:uppercase;font-size:clamp(26px,3.2vw,46px);line-height:1;
  letter-spacing:-.02em;color:var(--tx-l)}
.wi-head h2 .dim{color:rgba(3,9,16,.62)}   /* büyük metin, eşik 3.0 */

/* SAĞ — beyaz, koyu suyun üstünde */
.wi-body p{font-size:clamp(13.5px,1.05vw,15px);line-height:1.6;color:#fff}
.wi-body p + p{margin-top:14px}

/* 1023 altı: sütunlar daralıyor, düzen aynı */
@media(max-width:1023px){
  .wi-in{gap:18px clamp(16px,2.6vw,32px)}
  .wi-head{max-width:none}
  .wi-body{max-width:none}
}
/* 719 altı: MOBİL KADRAJ (koyu su) — tek sütun, metnin tamamı beyaz */
@media(max-width:719px){
  .wi{min-height:0}
  .wi::after{background:rgba(3,9,16,.10)}
  .wi-in{grid-template-columns:1fr;padding-block:34px}
  .wi-head .lbl{color:rgba(255,255,255,.82)}
  .wi-head h2{margin-top:11px;font-size:26px;color:#fff}
  .wi-head h2 .dim{color:rgba(255,255,255,.6)}
  .wi-body{justify-self:stretch}
  .wi-body p{font-size:13.5px}
}

/* ============================================================
   15. KAMP DETAY SAYFASI  (camps/*.html)
   ------------------------------------------------------------
   Referans: notinparis.me/pages/cote-de-lycia — tarayıcıda ölçüldü.
   Oradan alınan iskelet:
     sayfa başı  : kırıntı (mono) → dev iki tonlu başlık → sağda
                   mono künye → kısa paragraf. HERO GÖRSELİ YOK.
     rakam sırası: 6 hücre, üstte rakam altta etiket, 1px ayraçlar
     lead bloğu  : solda görsel (~%40) + sağda etiket/başlık/paragraf,
                   bir sonraki lead'de yönler ters
     etap listesi: solda dev gün numarası, yanında versal başlık ve
                   açıklama, 1px ayraçlar; dinlenme günü SOLUK
     fiyat/liste : ince başlıklı satır tabloları
     in & out    : iki sütun, madde başına 1px ayraç
     başvuru     : siyah zemin, koyu form
   Bizde farklı olan: BAŞVURU FORMU YOK — sitede tek form var ve o
   modal'ın içinde (skill §13). Bu yüzden başvuru bölümü metin +
   modal açan büyük düğme.                                       */

/* ---- sayfa başı ---- */
.cp-head{padding:clamp(56px,8vw,104px) 0 clamp(26px,3vw,38px);background:var(--cream)}
.cp-crumb{display:flex;gap:10px;align-items:center;font-size:10.5px;
  letter-spacing:.16em;text-transform:uppercase;font-weight:var(--w-ui);
  color:var(--tx-l-dim)}
.cp-crumb a{color:var(--tx-l-dim)}
@media(hover:hover){ .cp-crumb a:hover{color:var(--tx-l)} }
.cp-title{margin-top:clamp(18px,2.4vw,34px);
  display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:end;gap:20px}
/* Taban punto 34 → 28: ÖLÇÜLDÜ, "ENDURANCE LAB." 34 px'te 329 px
   yer kaplıyor ve 360 px telefonda 9 px taşıyordu. 28 px'te 271 px,
   320 px'te bile 9 px boşluk kalıyor. */
.cp-title h1{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(28px,5.6vw,80px);line-height:.98;letter-spacing:-.02em;
  color:var(--tx-l)}
.cp-title h1 .dim{color:var(--dim-l)}
.cp-meta{text-align:right;padding-bottom:8px;font-size:10.5px;line-height:1.55;
  letter-spacing:.16em;text-transform:uppercase;font-weight:var(--w-ui);
  color:var(--tx-l-dim);font-variant-numeric:tabular-nums}
.cp-intro{margin-top:clamp(18px,2vw,26px);max-width:46ch;
  font-size:clamp(14px,1.1vw,16px);line-height:1.6;color:var(--tx-l-dim)}
/* Künye eşiği 719 → 899: ÖLÇÜLDÜ. Künye başlığın yanındayken
   760 px'te başlık sütununa 399 px kalıyor, metin 412 px — taşıyor.
   900 px'te 40 px boşluk var, o yüzden ayrım tam orada. */
@media(max-width:899px){
  .cp-title{grid-template-columns:1fr}
  .cp-meta{text-align:left;padding-bottom:0}
}

/* ---- rakam sırası ---- */
.cp-nums{display:grid;grid-template-columns:repeat(6,1fr);
  border-top:1px solid var(--line-l);border-bottom:1px solid var(--line-l);
  background:var(--cream)}
.cp-num{padding:18px clamp(12px,1.6vw,26px);border-right:1px solid var(--line-l);
  display:flex;flex-direction:column;gap:5px}
.cp-num:last-child{border-right:0}
.cp-num .v{font-family:var(--display);font-weight:400;letter-spacing:-.02em;
  line-height:1;font-size:clamp(20px,2.2vw,30px);font-variant-numeric:tabular-nums;
  color:var(--tx-l);white-space:nowrap}
.cp-num .l{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}
/* 6 → 3 → 2 sütun. ÖLÇÜLDÜ. Etiketler kısa tutulmak ZORUNDA:
   ilk denemede "LEVELS, DAILY CHOICE" (132 px) 1024 px'te 8 px,
   320 px'te 16 px taşıyordu. Kısa etiketlerle en dar durum
   320 px'te 44 px boşluk. Etiket uzatılacaksa yeniden ölç. */
@media(max-width:1023px){
  .cp-nums{grid-template-columns:repeat(3,1fr)}
  .cp-num:nth-child(3n){border-right:0}
  .cp-num:nth-child(-n+3){border-bottom:1px solid var(--line-l)}
}
@media(max-width:519px){
  .cp-nums{grid-template-columns:repeat(2,1fr)}
  .cp-num{border-right:1px solid var(--line-l)}
  .cp-num:nth-child(2n){border-right:0}
  .cp-num:nth-child(3n){border-right:1px solid var(--line-l)}
  .cp-num:not(:nth-last-child(-n+2)){border-bottom:1px solid var(--line-l)}
}

/* ---- lead bloğu: görsel + metin ---- */
.cp-lead{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1fr);
  gap:clamp(24px,4vw,72px);align-items:end;
  padding-top:clamp(30px,4vw,56px)}
.cp-lead-rev{grid-template-columns:minmax(0,1fr) minmax(0,.78fr)}
.cp-lead-rev .cp-lead-m{order:2}
.cp-lead-m{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--cream-2)}
.cp-lead-m img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:saturate(.9)}
.cp-lead-m .cap{position:absolute;left:12px;bottom:11px;
  color:#fff;text-shadow:0 1px 10px rgba(3,9,16,.7)}
.cp-lead-t h2{margin-top:16px;font-family:var(--display);font-weight:400;
  text-transform:uppercase;font-size:clamp(26px,3.4vw,50px);line-height:1;
  letter-spacing:-.02em;color:var(--tx-l)}
.cp-lead-t h2 .dim{color:var(--dim-l)}
.cp-lead-t p{margin-top:20px;max-width:46ch;font-size:clamp(14px,1.1vw,16px);
  line-height:1.6;color:var(--tx-l-dim)}
.cp-lead-t p + p{margin-top:14px}
@media(max-width:899px){
  .cp-lead,.cp-lead-rev{grid-template-columns:1fr;gap:22px}
  .cp-lead-m{aspect-ratio:4/3}
  .cp-lead-rev .cp-lead-m{order:0}
}

/* ---- gün / etap listesi ---- */
.cp-days{list-style:none;margin-top:clamp(18px,2.4vw,30px)}
.cp-day{display:grid;grid-template-columns:88px minmax(0,1fr);gap:clamp(14px,2vw,28px);
  padding:22px 0;border-bottom:1px solid var(--line-l)}
.cp-day .n{font-family:var(--display);font-weight:400;line-height:.9;
  font-size:clamp(26px,3vw,40px);letter-spacing:-.03em;color:var(--tx-l);
  font-variant-numeric:tabular-nums}
.cp-day.rest .n,.cp-day.rest h3{color:var(--dim-l)}   /* dinlenme günü soluk */
.cp-day h3{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(16px,1.6vw,22px);line-height:1.05;letter-spacing:-.02em;
  color:var(--tx-l)}
.cp-day .rt{margin-top:8px;font-size:12.5px;letter-spacing:.04em;
  color:var(--tx-l-dim);font-variant-numeric:tabular-nums}
.cp-day p{margin-top:8px;max-width:62ch;font-size:14px;line-height:1.6;
  color:var(--tx-l-dim)}
.cp-day .tags{margin-top:11px;display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:519px){
  .cp-day{grid-template-columns:52px minmax(0,1fr);gap:14px;padding:18px 0}
}

/* ---- çip (seviye / disiplin) ---- */
.chip{display:inline-block;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;font-weight:var(--w-ui);
  border:1px solid var(--line-l);padding:5px 9px;color:var(--tx-l-dim);
  white-space:nowrap}
.chip.hard{border-color:rgba(3,9,16,.42);color:var(--tx-l)}
.chip.easy{border-color:var(--line-l)}
.chip.queen{border-color:var(--gold-l);color:var(--gold-l)}

/* ---- satır tablosu (rota / oda / tarih) ---- */
.cp-tbl{width:100%;border-collapse:collapse;margin-top:clamp(16px,2vw,26px)}
.cp-tbl caption{text-align:left;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim);
  padding-bottom:12px}
.cp-tbl th{text-align:left;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim);
  padding:0 12px 10px 0;border-bottom:1px solid var(--line-l)}
.cp-tbl th:last-child,.cp-tbl td:last-child{padding-right:0;text-align:right}
.cp-tbl td{padding:15px 12px 15px 0;border-bottom:1px solid var(--line-l);
  font-size:14px;color:var(--tx-l);vertical-align:baseline}
.cp-tbl td.num{font-variant-numeric:tabular-nums;white-space:nowrap;
  color:var(--tx-l-dim);font-size:13.5px}
.cp-tbl td .rn{font-weight:var(--w-ui)}
.cp-tbl tr.total td{border-bottom:0;font-weight:var(--w-ui);color:var(--tx-l);
  padding-top:16px}
.cp-tbl tr.total td.num{color:var(--tx-l)}
/* MOBİL: tablo satırı ızgaraya dönüyor, hücre yerleri açıkça yazılı */
@media(max-width:719px){
  .cp-tbl thead{display:none}
  .cp-tbl,.cp-tbl tbody,.cp-tbl tr,.cp-tbl td{display:block;width:auto}
  .cp-tbl tr{padding:15px 0;border-bottom:1px solid var(--line-l)}
  .cp-tbl td{padding:0;border-bottom:0}
  .cp-tbl td + td{margin-top:5px}
  .cp-tbl td:last-child{text-align:left}
  .cp-tbl td.num::before{content:attr(data-l) " ";letter-spacing:.16em;
    text-transform:uppercase;font-size:9.5px;color:var(--tx-l-dim)}
}

/* ---- iki sütunlu liste (dahil / dahil değil) ---- */
.cp-two{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(24px,4vw,64px);margin-top:clamp(18px,2.4vw,30px)}
.cp-list{list-style:none}
.cp-list li{padding:13px 0;border-bottom:1px solid var(--line-l);
  font-size:14px;line-height:1.5;color:var(--tx-l)}
.cp-list.dim li{color:var(--tx-l-dim)}
.cp-sub{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim);
  padding-bottom:10px;border-bottom:1px solid var(--line-l)}
.cp-sub + .cp-list{margin-top:0}
.cp-two-blk + .cp-two-blk-gap{margin-top:26px}
@media(max-width:719px){ .cp-two{grid-template-columns:1fr;gap:26px} }

/* ---- künye listesi (tekne) ---- */
.cp-spec{margin-top:clamp(16px,2vw,26px)}
.cp-spec div{display:grid;grid-template-columns:minmax(0,.5fr) minmax(0,1fr);
  gap:16px;padding:13px 0;border-bottom:1px solid var(--line-l)}
.cp-spec dt{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim);padding-top:2px}
.cp-spec dd{font-size:14px;color:var(--tx-l)}
@media(max-width:519px){ .cp-spec div{grid-template-columns:1fr;gap:4px} }

/* ---- rotasyon zinciri ---- */
.cp-chain{margin-top:clamp(16px,2vw,26px);display:flex;flex-wrap:wrap;
  align-items:center;gap:8px 12px}
.cp-chain span{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(13px,1.25vw,17px);letter-spacing:-.01em;line-height:1.1;
  color:var(--tx-l)}
.cp-chain i{font-style:normal;font-size:12px;color:var(--tx-l-dim)}

/* ---- ekip yer tutucu kartları ---- */
.cp-team{margin-top:clamp(18px,2.4vw,30px);display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.cp-tc{display:block}
.cp-tc .ph{aspect-ratio:3/4;background:var(--cream-2);
  border:1px solid var(--line-l);position:relative}
.cp-tc .ph::after{content:"";position:absolute;inset:14px;
  border:1px dashed var(--line-l)}
.cp-tc .nm{margin-top:12px;font-family:var(--display);font-weight:400;
  text-transform:uppercase;font-size:15px;letter-spacing:-.02em;color:var(--dim-l)}
.cp-tc .rl{margin-top:5px;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
@media(max-width:899px){ .cp-team{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---- başvuru bandı (koyu) ---- */
.cp-apply{background:var(--navy);color:var(--tx-d)}
.cp-apply .lbl{color:var(--tx-d-dim)}
.cp-apply h2{margin-top:16px;font-family:var(--display);font-weight:400;
  text-transform:uppercase;font-size:clamp(30px,4.6vw,64px);line-height:1;
  letter-spacing:-.02em;color:var(--tx-d)}
.cp-apply h2 .dim{color:var(--dim-d)}
.cp-apply .rule{height:1px;background:var(--line-d);margin:26px 0 0}
.cp-apply-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(22px,3.4vw,56px);align-items:end;padding-top:clamp(24px,3vw,40px)}
.cp-apply p{max-width:44ch;font-size:clamp(14px,1.1vw,16px);line-height:1.6;
  color:var(--tx-d-dim)}
.cp-apply .side{justify-self:end;text-align:right}
.cp-apply .note{margin-top:14px;font-size:12px;color:var(--tx-d-dim)}
@media(max-width:719px){
  .cp-apply-in{grid-template-columns:1fr;gap:20px}
  .cp-apply .side{justify-self:start;text-align:left}
}

/* koyu bölümde ince çerçeveli düğme */
.btn-o{display:inline-block;font-size:10.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);
  border:1px solid currentColor;padding:16px 30px;color:inherit;
  transition:background .3s var(--e),color .3s var(--e),border-color .3s var(--e)}
@media(hover:hover){
  .btn-o:hover{background:var(--gold);border-color:var(--gold);color:var(--navy)}
}

/* ---------- 11. SAYFA BAŞI — FOTOĞRAF ZEMİNİ (kamp detayı) ----------
   Kaan, Ağu 2026: "endurance lab lycian coast yazısı arkasında olsun
   görsel, sonra yazı ve grafikler başlayabilir."

   ⚠️ .cp-head'in krem zemini ve simetrik dolgusu AÇIKÇA eziliyor
   (skill §13 ezme tuzağı): zemin, renk ve padding'in dördü de yeniden
   yazıldı, "position değişti, eskisi düşer" varsayımı yapılmadı.

   Perde ÖLÇÜLDÜ — kompozitte en kötü %5 persentil, dört genişlikte
   (1440·1024·390·360):
     krem başlık (#E7ECEE)          6.95 – 7.11   (eşik 3.0, büyük)
     başlığın soluk satırı (.72)    4.51 – 4.59   (eşik 3.0, büyük)
     künye/ara metin (.82)          5.31 – 5.41   (eşik 4.5, küçük)
     header'ın beyaz metni          6.91 – 7.36   (kendi şeridiyle)
   İkincil metin burada .82 opaklıkta; krem zemindeki .62'lik değer
   fotoğraf üstünde 2.67'ye düşüyordu, o yüzden AYRI verildi.

   Görselin öznesi (bisikletçiler) karenin %45 yüksekliğinde →
   object-position 50% 45%. Metin alta yaslı, çünkü karenin alt
   üçte biri bulanık önplan; en sakin bant orası.                    */
.cp-head-img{position:relative;isolation:isolate;
  background:var(--navy);color:var(--tx-d);
  min-height:clamp(460px,62vh,680px);
  display:flex;align-items:flex-end;
  padding:calc(84px + clamp(40px,6vw,80px)) 0 clamp(30px,3.4vw,46px)}
.cp-head-img .wrapx{width:100%}
.cp-head-bg{position:absolute;inset:0;z-index:-2;display:block}
.cp-head-bg img{display:block;width:100%;height:100%;
  object-fit:cover;object-position:50% 45%}
.cp-head-img::after{content:"";position:absolute;inset:0;z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,
    rgba(3,9,16,.64) 0%,
    rgba(3,9,16,.52) 30%,
    rgba(3,9,16,.76) 70%,
    rgba(3,9,16,.90) 100%)}
.cp-head-img .cp-crumb,
.cp-head-img .cp-crumb a{color:rgba(231,236,238,.82)}
@media(hover:hover){ .cp-head-img .cp-crumb a:hover{color:var(--tx-d)} }
.cp-head-img .cp-title h1{color:var(--tx-d)}
.cp-head-img .cp-title h1 .dim{color:rgba(231,236,238,.72)}
.cp-head-img .cp-meta,
.cp-head-img .cp-intro{color:rgba(231,236,238,.82)}
/* Mobil: bant kısalıyor ama metin bloğu 4 satıra çıkabildiği için
   min-height alt sınırı esnek bırakıldı (içerik taşarsa büyür). */
@media(max-width:719px){
  .cp-head-img{min-height:clamp(400px,58vh,520px);
    padding:calc(72px + clamp(30px,9vw,56px)) 0 clamp(26px,5vw,36px)}
}

/* ---------- 12. GÜN LİSTESİ — SIKILAŞTIRMA ----------
   Kaan, Ağu 2026: "the days bölümü çok güzel ama boyunun kısalması
   lazım. yazıların okunurluğu artmalı — ama açıklama kısmı,
   başlıklar değil."

   İki istek birbirine ters çalışıyor: punto büyürse satır yükselir.
   Boy, PUNTODAN DEĞİL boşluktan ve satır düzeninden alındı:

   1) satır dolgusu 22 → 13 px  (−18 px/satır)
   2) rota satırı ≥900 px'te BAŞLIKLA AYNI SATIRA giriyor
      (h3 ve .rt inline) — sığmazsa kendiliğinden alt satıra
      kayıyor, taşma riski yok. (−~27 px/satır)
   3) iç boşluklar: rota 8→0/inline · paragraf 8→6 · çip 11→9
   4) çip dolgusu 5→4 px, YALNIZCA gün listesinde (tablolardaki
      .chip'e dokunulmadı)

   Açıklama metni: 14 → 15.5 px, satır aralığı 1.6 → 1.5,
   renk .62 → .72 opaklık. Kontrast ÖLÇÜLDÜ: krem zeminde
   4.82 → 6.71 (eşik 4.5). Başlıklar, gün numarası ve rota
   satırı DEĞİŞMEDİ.                                              */
.cp-day{padding:13px 0}
.cp-day .rt{margin-top:6px}
.cp-day p{margin-top:6px;max-width:64ch;
  font-size:15.5px;line-height:1.5;color:rgba(3,9,16,.72)}
.cp-day .tags{margin-top:9px;gap:7px}
.cp-day .chip{padding:4px 8px}
/* Eşik 900 px: bu genişliğin altında metin sütunu 700 px'e iniyor ve
   en uzun rota (Gün 3, altı durak) başlıkla yan yana sığmıyor. */
@media(min-width:900px){
  .cp-day h3{display:inline}
  .cp-day .rt{display:inline;margin:0 0 0 16px}
}
@media(max-width:519px){
  .cp-day{grid-template-columns:46px minmax(0,1fr);gap:12px;padding:13px 0}
  .cp-day p{font-size:15px}
}

/* ---------- 13. ÇERÇEVELİ KUTU — "Two levels, one boat" ----------
   Kaan, Ağu 2026: notinparis.me/pages/cote-de-lycia sayfasındaki
   kutulu lead düzeni, "ama aynı tasarım gibi de gözükmesin".

   Referanstan ÖLÇÜLEN (tarayıcıda, 1781 px ekran):
     kutu 1368 px · ızgara 540 | 826 px (görsel %40)
     çerçeve 1px solid #000, ÜST KENAR YOK (üstündeki rakam
     şeridine yapışıyor), köşe yarıçapı 0
     görsel/metin arası 1px rgba(0,0,0,.16)
     metin sütunu dolgusu 44 px, flex kolon, space-between
     etiket mono 10.5/ls 1.68 · h3 40/42 px · paragraf 14/23.1,
     genişliği 302 px'e kilitli · altta 9.5 px mono künye

   BİZDE BİLEREK FARKLI OLAN (kopya olmasın diye):
     · görsel referansta SOLDA, bizde SAĞDA
     · çerçeve dört kenarda da var → şeridin devamı değil, tek
       başına duran bir alan
     · çerçeve saf siyah değil, rgba(3,9,16,.28) — sayfanın
       geri kalanındaki çizgi diliyle aynı aileden
     · referansın metin sütunu space-between olduğu için ortası
       kocaman boş; bizde metin üstte toplu, alta İKİ KOLLU RAKAM
       PANELİ pinlendi (margin-top:auto). Rakamlar uydurma değil,
       aşağıdaki rota tablolarının toplam satırı
     · görselin sol altındaki künye bizde duruyor, referansta yok
     · kutunun yüksekliğini görselin en-boy oranı değil METİN
       belirliyor; görsel boşluğu dolduruyor (align-items:stretch)  */
.cp-box{border:1px solid rgba(3,9,16,.28);
  gap:0;padding-top:0;margin-top:clamp(8px,1.6vw,20px);
  align-items:stretch}
.cp-box .cp-lead-m{aspect-ratio:auto;height:100%;
  min-height:clamp(300px,32vw,520px);
  border-left:1px solid rgba(3,9,16,.18)}
.cp-box .cp-lead-t{display:flex;flex-direction:column;
  padding:clamp(22px,2.6vw,44px)}
.cp-box .cp-lead-t h2{margin-top:14px}
.cp-box .cp-lead-t p{max-width:44ch}
/* iki kollu rakam paneli — alta pinli */
.cp-branch{margin-top:auto;padding-top:clamp(18px,2vw,28px);
  border-top:1px solid var(--line-l);
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,32px)}
.cp-lead-t p + .cp-branch{margin-top:clamp(24px,3vw,44px)}
.cp-br .l{display:block;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.cp-br .v{display:block;margin-top:9px;font-family:var(--display);
  font-weight:400;font-size:clamp(20px,2.2vw,30px);line-height:1;
  letter-spacing:-.02em;color:var(--tx-l);font-variant-numeric:tabular-nums}
.cp-br .s{display:block;margin-top:6px;font-size:12.5px;
  color:var(--tx-l-dim);font-variant-numeric:tabular-nums}
/* MOBİL: kutu tek sütuna iniyor, ayraç dikeyden yataya dönüyor.
   ⚠️ Üstteki 899 px kuralı .cp-lead'e gap:22px veriyor — kutuda
   AÇIKÇA sıfırlanıyor, yoksa çerçevenin içinde boşluk kalıyor. */
@media(max-width:899px){
  .cp-box{grid-template-columns:1fr;gap:0}
  .cp-box .cp-lead-m{aspect-ratio:16/10;min-height:0;height:auto;
    border-left:0;border-bottom:1px solid rgba(3,9,16,.18)}
  .cp-lead-rev.cp-box .cp-lead-m{order:0}
}
@media(max-width:389px){
  .cp-branch{grid-template-columns:1fr;gap:16px}
}

/* ---------- 14. ROTALAR — KOYU BANT ----------
   Kaan, Ağu 2026: "route kısmını invert edip siyah background beyaz
   font'a dönelim, boyu kısalsın, solda beginner sağda expert."

   Boy iki yerden kısaldı, punto küçültmeden:
     · dört tablo → iki blok (4 caption + 4 başlık satırı → 2 + 2)
     · her satırda iki kol YAN YANA; eskiden alt alta iki tablodaydı
   Rota adı solda, mesafe sağda, aynı satırda (space-between).

   Kontrast (skill §3 ölçümleri): krem metin lacivertte 15.35 ·
   ikincil metin rgba(231,236,238,.60) 6.1 — ikisi de eşiğin üstünde.
   Boş hücrenin tiresi .34 opaklıkta: metin değil, "veri yok"
   işareti; okunması gerekmiyor.                                    */
.rtb-sec{background:var(--navy);color:var(--tx-d);
  padding:clamp(44px,5.5vw,68px) 0 clamp(40px,5vw,60px);
  /* üstteki bölümün alt dolgusu 18 px; koyu bandın kenarı kutuya
     yapışmasın diye ayrıca boşluk veriliyor. */
  margin-top:clamp(24px,3vw,44px)}
.rtb-sec .sec-head{border-bottom-color:var(--line-d)}
.rtb-sec .sec-title h2{color:var(--tx-d)}
.rtb-sec .lbl,.rtb-sec .cp-meta{color:var(--tx-d-dim)}

.rtb{margin-top:clamp(22px,2.8vw,36px)}
.rtb + .rtb{margin-top:clamp(30px,3.6vw,52px)}
/* Gün sütunu clamp(72,7vw,104): blok adı ("BIKE"/"TRAIL") Archivo
   Black'te bu sütuna sığmak zorunda. Ölçü: "ENDURANCE LAB." 34 px'te
   329 px → harf başına ~0.69em. TRAIL (5 harf) 16 px'te 55 px,
   sütun en dar hâlinde 72 px. Uzun sözcük buraya YAZILMAZ. */
.rtb-hd,.rtb-r{display:grid;
  grid-template-columns:clamp(72px,7vw,104px) minmax(0,1fr) minmax(0,1fr);
  gap:clamp(14px,2.4vw,40px);align-items:baseline}
.rtb-hd{padding-bottom:12px;border-bottom:1px solid var(--line-d)}
.rtb-hd span{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-d-dim)}
.rtb-hd .d{font-family:var(--display);font-weight:400;
  font-size:clamp(13px,1.25vw,16px);line-height:1.05;letter-spacing:-.02em;
  text-transform:uppercase;color:var(--tx-d)}
.rtb-r{padding:13px 0;border-bottom:1px solid var(--line-d)}
.rtb-r .d{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-d-dim);font-variant-numeric:tabular-nums}
.rtb-r .c{display:flex;flex-wrap:wrap;align-items:baseline;
  justify-content:space-between;gap:4px 16px}
.rtb-r .rn{font-size:14.5px;line-height:1.4;color:var(--tx-d)}
.rtb-r .m{font-size:13px;line-height:1.4;color:var(--tx-d-dim);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.rtb-r .c.none .rn{color:rgba(231,236,238,.34)}
.rtb-r.is-t{border-bottom:0;padding-top:15px}
.rtb-r.is-t .m{color:var(--tx-d);font-weight:var(--w-ui)}
/* MOBİL: üç sütun 720 px altında okunmuyor → gün başlık satırı olur,
   iki kol alt alta gelir ve etiketini data-b'den ::before ile alır.
   Hücre yerleri AÇIKÇA yazılı (skill §14: tarayıcıya bırakılmıyor). */
@media(max-width:719px){
  .rtb-hd{grid-template-columns:1fr;gap:0;padding-bottom:10px}
  .rtb-hd span:not(.d){display:none}
  .rtb-r{grid-template-columns:1fr;gap:0;padding:14px 0}
  .rtb-r .d{display:block;margin-bottom:10px}
  .rtb-r .c{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 12px}
  .rtb-r .c::before{content:attr(data-b);grid-column:1/-1;
    font-size:9px;letter-spacing:.16em;text-transform:uppercase;
    font-weight:var(--w-ui);color:var(--tx-d-dim)}
  .rtb-r .c + .c{margin-top:11px;padding-top:11px;
    border-top:1px solid rgba(231,236,238,.09)}
  .rtb-r .m{white-space:normal;text-align:right}
}

/* ---------- 15. ROTA HAVUZU — ÇERÇEVELİ, SADELEŞTİRİLMİŞ ----------
   Kaan, Ağu 2026: "Route pool kısmını yeniden düzenleyip
   sadeleştirelim ve kutu içine alalım, disiplinleri kaldıralım."

   Çerçeve dili "Two levels" kutusuyla AYNI (§13): 1px
   rgba(3,9,16,.28), köşe yarıçapı yok, içeride 1px'lik .18
   ayraç. Böylece sayfada iki değil TEK kutu fikri var.

   Sadeleşme:
     · 4 sütunlu tablo (Route/Distance/Climbing/Level) → tek satır:
       ad · mesafe · seviye. Mesafe+tırmanış tek hücrede.
     · seviye çipi kalktı, düz mikro etiket oldu. Dokuz satırda
       dokuz çip çerçevesi gürültüydü; ileri seviye .90 opaklıkla,
       diğerleri .52 ile ayrılıyor — renk kullanılmıyor.
     · "Disciplines" listesi tamamen çıktı.
   Sürücü sütun genişliği 1.35fr / 1fr: sol sütunda hem uzun rota
   adı hem mesafe var, sağdaki yürüyüş listesinde yalnızca ad.     */
.rp-box{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);
  border:1px solid rgba(3,9,16,.28);
  margin-top:clamp(10px,1.8vw,22px)}
.rp-col{padding:clamp(20px,2.4vw,34px) clamp(18px,2.2vw,34px)}
.rp-col + .rp-col{border-left:1px solid rgba(3,9,16,.18)}
.rp-hd{display:flex;align-items:baseline;justify-content:space-between;
  gap:14px;padding-bottom:12px;border-bottom:1px solid var(--line-l)}
.rp-hd .t{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(15px,1.4vw,19px);line-height:1;letter-spacing:-.02em;
  color:var(--tx-l)}
.rp-hd .c{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}
.rp-list{list-style:none}
.rp-list li{display:grid;grid-template-columns:minmax(0,1fr) auto auto;
  align-items:baseline;gap:6px clamp(12px,1.6vw,26px);
  padding:11px 0;border-bottom:1px solid var(--line-l)}
.rp-list li:last-child{border-bottom:0;padding-bottom:0}
.rp-hk li{grid-template-columns:minmax(0,1fr) auto}
.rp-list .n{font-size:14.5px;line-height:1.4;color:var(--tx-l)}
.rp-list .m{font-size:12.5px;color:var(--tx-l-dim);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.rp-list .lv{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--dim-l);white-space:nowrap;
  min-width:6.4em;text-align:right}
.rp-list .lv.is-hard{color:rgba(3,9,16,.90)}
/* 900 px altında kutu tek sütuna iner, ayraç yataya döner.
   ⚠️ Mesafe hücresi 520 px altında kendi satırına geçiyor: ad +
   mesafe + seviye yan yana en dar durumda 320 px'e sığmıyor. */
@media(max-width:899px){
  .rp-box{grid-template-columns:1fr}
  .rp-col + .rp-col{border-left:0;border-top:1px solid rgba(3,9,16,.18)}
}
@media(max-width:519px){
  .rp-list li{grid-template-columns:minmax(0,1fr) auto}
  .rp-list .m{grid-column:1/-1;order:3;text-align:left}
  .rp-list .lv{min-width:0}
}

/* ---------- 16. BLUE ANGEL — TEKNE GÖRSELLERİ ----------
   Kaan, Ağu 2026: "blue angel teknesinin görsellerini ekledim."
   Kaynak klasör 10 kare, hepsi 1920×1080 (16:9). Bölümün eski
   yuvası 4/5 dikeydi; oran uymadığı için düzen değişti:
     üstte tam genişlik yelken karesi (16:9)
     altında solda künye, sağda 2×2 detay ızgarası
   Böylece kırpma yapılmadı, kareler kendi oranında duruyor.

   Görsel künyeleri fotoğrafın ÜSTÜNDE değil ALTINDA (mikro etiket).
   Fotoğraf üstüne yazı koymak her karede ayrı kontrast ölçümü
   demek (skill §16); dördü de iç mekân ve parlak, altına almak
   hem güvenli hem sakin. Tek istisna büyük yelken karesi: onun
   künyesi sol altta, mevcut .cap kalıbıyla (gölge + beyaz).       */
/* Kare 16:9 geliyor, bant 2:1'e kırpılıyor: kırpılan tek şey
   gökyüzü. object-position %62 — ÖLÇÜLDÜ, direk ucu ve tekne
   gövdesi tam kalıyor (%50'de gövdenin altı, 21:9'da hem direk
   hem gövde kesiliyordu). Bantın boyu 1440'ta 747 → 664 px. */
.ba-lead{position:relative;margin-top:clamp(18px,2.4vw,30px);
  aspect-ratio:2/1;overflow:hidden;background:var(--cream-2)}
.ba-lead img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:50% 62%;filter:saturate(.9)}
.ba-lead .cap{position:absolute;left:14px;bottom:12px;z-index:1;
  color:#fff;text-shadow:0 1px 10px rgba(3,9,16,.7)}
.ba-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1fr);
  gap:clamp(24px,4vw,64px);margin-top:clamp(26px,3.4vw,48px)}
.ba-grid .cp-spec{margin-top:0}
.ba-shots{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(12px,1.6vw,22px);align-content:start}
.ba-shots figure{margin:0}
.ba-shots picture{display:block;aspect-ratio:16/9;overflow:hidden;
  background:var(--cream-2)}
.ba-shots img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.9)}
.ba-shots figcaption{margin-top:9px;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.ba-note{margin-top:clamp(20px,2.4vw,30px);font-size:13px;
  color:var(--tx-l-dim)}
@media(max-width:899px){
  .ba-grid{grid-template-columns:1fr;gap:28px}
}
@media(max-width:519px){
  .ba-lead{aspect-ratio:3/2}
  .ba-shots{gap:12px}
}

/* ---------- 17. BLUE ANGEL — BÜYÜTME (lightbox) ----------
   Kaan, Ağu 2026: "fotoğraflara basınca büyüsün, bütün görseller
   kullanılsın, tasarımı değiştirmeden."

   TASARIM DEĞİŞMEDİ: her görsel <button> içine alındı ama düğmenin
   kendi görünümü yok (kenarlık, dolgu, zemin sıfır). Tek görünür
   fark imleç (zoom-in) ve odak halkası. Kutu ölçüleri aynı kaldı.
   Şerit, ızgaranın figür dilinin aynısı — yeni bir dil yok.        */
.ba-z{display:block;width:100%;padding:0;border:0;background:none;
  cursor:zoom-in;font:inherit;color:inherit}
.ba-z:focus-visible{outline:2px solid var(--gold-l);outline-offset:3px}
.ba-lead .ba-z,.ba-lead .ba-z picture{position:static;display:block;height:100%}
.ba-strip{display:grid;grid-template-columns:repeat(5,1fr);
  gap:clamp(12px,1.6vw,22px);margin-top:clamp(22px,2.8vw,38px)}
.ba-strip figure{margin:0}
.ba-strip picture{display:block;aspect-ratio:16/9;overflow:hidden;
  background:var(--cream-2)}
.ba-strip img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.9)}
.ba-strip figcaption{margin-top:9px;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
/* 5 → 3 → 2 sütun. ÖLÇÜLDÜ: 5 sütunda kare 1440'ta 248 px, 1200'de
   200 px, 1024'te 170 px'e düşüyor — iç mekân kareleri o boyutta
   okunmuyor. Eşik bu yüzden 1023 değil 1199: 1024'te üç sütunla
   kare 300 px kalıyor. */
@media(max-width:1199px){ .ba-strip{grid-template-columns:repeat(3,1fr)} }
@media(max-width:599px){ .ba-strip{grid-template-columns:repeat(2,1fr)} }

/* --- büyütme katmanı --- */
/* ⚠️ display:grid, hidden özniteliğinin tarayıcı varsayılanı olan
   display:none'ı EZİYOR. Bu kural olmadan katman kapalıyken de
   ekranı kaplıyor (opacity:0, z-index:120) ve sayfadaki HER tıklamayı
   yutuyordu — fotoğraflar dahil hiçbir şey tıklanmıyordu.
   main.js'teki booking modal'ı da aynı tuzağa düşmüştü (§13 notu).
   pointer-events ikinci emniyet: kapanma geçişi sürerken (260 ms)
   katman hâlâ görünür ama tıklamayı geçiriyor.                     */
.ba-lb[hidden]{display:none}
.ba-lb{position:fixed;inset:0;z-index:120;display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:clamp(6px,1.4vw,18px);padding:clamp(10px,2vw,28px);
  background:rgba(2,5,8,.95);
  opacity:0;pointer-events:none;transition:opacity .26s var(--e)}
.ba-lb.is-on{opacity:1;pointer-events:auto}
.ba-lb-fig{display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:12px;min-width:0;height:100%}
.ba-lb-fig img{max-width:100%;max-height:calc(100vh - 132px);
  max-height:calc(100svh - 132px);
  object-fit:contain;display:block;
  opacity:1;transition:opacity .18s var(--e)}
.ba-lb.is-load .ba-lb-fig img{opacity:.25}
.ba-lb-cap{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:rgba(231,236,238,.72);
  white-space:pre;text-align:center}
/* Dokunma hedefleri 48 px — skill §14'teki 44 px alt sınırının üstünde. */
.ba-lb-x,.ba-lb-p,.ba-lb-n{background:none;border:1px solid rgba(231,236,238,.28);
  color:#fff;width:48px;height:48px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;line-height:1;padding:0;
  transition:border-color .2s var(--e),background .2s var(--e)}
@media(hover:hover){
  .ba-lb-x:hover,.ba-lb-p:hover,.ba-lb-n:hover{
    background:rgba(231,236,238,.10);border-color:rgba(231,236,238,.55)}
}
.ba-lb-x:focus-visible,.ba-lb-p:focus-visible,.ba-lb-n:focus-visible{
  outline:2px solid var(--gold);outline-offset:3px}
.ba-lb-x{position:absolute;top:clamp(10px,2vw,28px);right:clamp(10px,2vw,28px);
  z-index:2;font-size:24px}
/* Telefonda oklar görselin altına iniyor: yanlarda 48+48 px almak
   360 px ekranda kareye 240 px bırakıyordu. */
@media(max-width:599px){
  .ba-lb{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;
    justify-items:center;padding:56px 12px 16px}
  .ba-lb-fig{grid-row:1}
  .ba-lb-fig img{max-height:calc(100svh - 190px)}
  .ba-lb-p{grid-row:2;justify-self:start}
  .ba-lb-n{grid-row:2;justify-self:end}
  .ba-lb-p,.ba-lb-n{position:relative}
}
@media(prefers-reduced-motion:reduce){
  .ba-lb,.ba-lb-fig img{transition:none}
}

/* ---------- 18. DAHİL / DEĞİL — KOYU BANT + KUTU ----------
   Kaan, Ağu 2026: "in out yerine başka bir şey bulalım, bu sayfa
   invert olsun, tasarım kutu içindeki tasarımımız olsun, daha
   toplu düzenli gözüksün."

   Bant .rtb-sec'ten (rotalar) geliyor, kutu .rp-box'tan (rota
   havuzu). Yeni bir dil YOK — iki mevcut parçanın koyu zemindeki
   birleşimi. Değişen tek şey çizgi ve metin renklerinin koyu
   sürümleri.

   Kontrast (skill §3): krem metin lacivertte 15.35 · ikincil
   rgba(231,236,238,.60) 6.1 · başlığın soluk satırı büyük metin
   (eşik 3.0). Hepsi eşiğin üstünde.                                */
.io-sec .sec-title h2 .dim{color:rgba(231,236,238,.60)}
.io-box{border-color:rgba(231,236,238,.28)}
.io-box .rp-col + .rp-col{border-left-color:rgba(231,236,238,.18)}
.io-box .rp-hd{border-bottom-color:var(--line-d)}
.io-box .rp-hd .t{color:var(--tx-d)}
.io-box .rp-hd .c{color:var(--tx-d-dim)}
.io-box .cp-sub{color:var(--tx-d-dim);border-bottom-color:var(--line-d)}
.io-box .cp-list li{color:var(--tx-d);border-bottom-color:var(--line-d)}
.io-box .cp-list li:last-child{border-bottom:0}
/* Kutunun içindeki ilk alt başlık şerit çizgisine yapışmasın */
.io-box .rp-hd + .cp-sub,.io-box .io-cols{margin-top:clamp(18px,2.2vw,28px)}
.io-box .cp-list + .cp-sub{margin-top:clamp(20px,2.4vw,30px)}
/* "Dahil" tarafı kendi içinde iki sütun: ÖLÇÜLDÜ, tek sütunda sol
   yan sağın iki katı uzuyordu (12 maddeye karşı 5). */
.io-cols{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(18px,2.4vw,38px)}
.io-box .io-cols .cp-sub:first-child{margin-top:0}
@media(max-width:899px){
  .io-cols{grid-template-columns:1fr;gap:0}
  /* ⚠️ Seçici .io-box ile başlamak ZORUNDA: üstteki
     .io-box .io-cols .cp-sub:first-child{margin-top:0} kuralı
     4 sınıf, bu kural onsuz 3 sınıf kalıyor ve eziliyordu —
     mobilde "Sport programme" bir önceki maddeye yapışmıştı. */
  .io-box .io-cols > div + div .cp-sub:first-child{
    margin-top:clamp(22px,3vw,32px)}
}

/* ---------- 19. KUM ŞERİDİ — gün listesinin altı ----------
   Kaan, Ağu 2026: "the days'in altına beach_strip görselini strip
   şeklinde kullanalım."

   Tam genişlik: .wrapx'in dışında duruyor, sayfa kenarına dayanıyor
   — künye şeridi ve koyu bantlarla aynı hizada, sayfada zaten olan
   bir hamle. Kutu değil, çerçeve yok, metin yok.

   ÖLÇÜ: 3,4:1 masaüstünde 1440 → 424 px, 1024 → 301 px yükseklik.
   720 px altında mobil kadraj devreye giriyor ve oran 1,86:1'e
   çıkıyor: aynı oranla 390 px'te bant 115 px'e iniyor ve fotoğraf
   okunmaz bir çizgiye dönüyordu.                                   */
.day-strip{margin:clamp(30px,4vw,56px) 0 0;
  aspect-ratio:3.4/1;overflow:hidden;background:var(--cream-2)}
.day-strip img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.9)}
@media(max-width:719px){
  .day-strip{aspect-ratio:1.86/1;margin-top:clamp(24px,5vw,36px)}
}

/* ═══════════════════════════════════════════════════════════════
   20. SAYFA GENELİ SIKILAŞTIRMA (13 Ağustos 2026)
   Kaan: "katmanlar arasındaki boşlukları, ölü alanları azaltalım
   ve başlıklarımızı biraz ufaltalım, fazla büyük gözüküyorlar."

   Bu blok EN SONDA duruyor ve yukarıdaki tavanları eziyor. Tek
   yerden geri alınabilsin diye ayrı tutuldu.
   ═══════════════════════════════════════════════════════════════ */

/* ---- başlık punto tavanları ----
   Genişlikler gerçek Archivo Black ile ölçüldü (skill §16 tablosu).
   En kritik satır "AND WHAT ISN'T.": 60 px'te 479 px (1440'ta sol
   sütunda 1074 px yer var), 30 px'te 239 px (360 px ekranda 320 px
   yer var). İkisi de rahat sığıyor. */
.cp-title h1{font-size:clamp(28px,4.6vw,66px)}      /* 80 → 66 */
.sec-title h2{font-size:clamp(30px,4.2vw,60px)}     /* 78 → 60 */
.cp-lead-t h2{font-size:clamp(24px,2.9vw,42px)}     /* 50 → 42 */
.cp-apply h2{font-size:clamp(28px,3.6vw,52px)}      /* 64 → 52 */

/* ---- bölümler arası boşluk ----
   Önce: alt 18 + üst 72 = iki bölüm arası 90 px (1440).
   Sonra: 14 + 54 = 68 px. Mobilde 66 → 50 px. */
.sec{padding:clamp(36px,4.2vw,54px) 0 14px}
.sec-head{gap:20px;padding-bottom:20px}
.sec-title{gap:12px}
@media(max-width:719px){
  .sec-head{gap:14px;padding-bottom:16px}
}
/* koyu bantlar aynı ritme çekildi */
.rtb-sec{padding:clamp(36px,4.2vw,54px) 0 clamp(32px,3.6vw,46px);
  margin-top:clamp(18px,2.2vw,32px)}
/* sayfa başı ve kum şeridi */
.cp-head-img{padding-bottom:clamp(26px,3vw,38px)}
.day-strip{margin-top:clamp(22px,3vw,40px)}
@media(max-width:719px){
  .day-strip{margin-top:clamp(18px,4vw,28px)}
}

/* ---- ölü alan: ilk lead bloğu ----
   Görsel 4/5 dikeydi; 1440'ta 550 px sütunda 688 px yüksekliğe
   çıkıyor, yanındaki metin ise ~350 px. Aradaki ~340 px tamamen
   boştu. Kare orana alındı: 688 → 550 px.
   ⚠️ Kutulu lead (.cp-box) bundan etkilenmiyor, orada aspect-ratio
   zaten auto'ya çekiliyor. */
.cp-lead:not(.cp-box) .cp-lead-m{aspect-ratio:1/1}
/* Metin alta yaslıydı, üstünde ~130 px boşluk kalıyordu; ortaya
   alınınca aynı boşluk ikiye bölünüp göze batmıyor. */
.cp-lead:not(.cp-box){align-items:center}
/* Mobilde de KARE: kaynak dikey (2000×2542), 16:10 yatay kırpma
   güvertedeki grubun yarısını kesiyordu. 390 px'te 350×350. */
@media(max-width:899px){
  /* Tek sütuna inince kare yuva tam genişliğe yayılıyor ve 899 px'te
     827 px yüksekliğe çıkıyordu — tek fotoğraf için fazla. Tavan
     520 px; bu genişliklerde oran kendiliğinden yatayıyor, object-fit
     cover özneyi ortada tutuyor. 390 px'te 350×350, tavanın altında. */
  .cp-lead:not(.cp-box) .cp-lead-m{aspect-ratio:1/1;max-height:520px}
}

/* ---- 21. DOKUNMA HEDEFLERİ (13 Ağustos 2026 denetimi) ----
   390 px'te ölçüldü: 20 tıklanabilir öğe 44 px'in altındaydı.
   Header logosu 143×21 · EN/TR 18×18 · "Camps" kırıntısı 47×17 ·
   "Apply →" 57×22 · takvimdeki Book düğmeleri 86×41 · footer
   bağlantıları 41 px · "Trailbase.co" 74×18.

   ⚠️ Skill §14 "hepsi 44 px üstüne çıkarıldı" diyordu — ana
   sayfadaki öğeler için doğru, header/footer/kırıntı unutulmuş.

   Yöntem: GÖRÜNÜMÜ DEĞİŞTİRMEDEN alan büyütme. Yerleşimi bozacak
   yerlerde ::after ile şeffaf bir kapak, bozmayacak yerlerde
   doğrudan yükseklik. Kapakların birbirini yutmaması için yatay
   pay dar tutuldu. */
/* ⚠️ .lang-b ATLANMALI — style.css:137'de zaten 30×44'lük bir kapağı
   var (önceki 44 px çalışmasından kalma). Üstüne yazmak gereksiz. */
.hdr-wm,.cp-crumb a,.nx,.f-bot a,
.navlink,.hdr-nav a,.ig,.cta{position:relative}
.navlink::after,.hdr-nav a::after{content:"";position:absolute;inset:-13px -8px}
.ig::after{content:"";position:absolute;inset:-4px}
.cta::after{content:"";position:absolute;inset:-3px -4px}
.hdr-wm::after{content:"";position:absolute;inset:-13px -10px}
.cp-crumb a::after{content:"";position:absolute;inset:-14px -6px}
.nx::after{content:"";position:absolute;inset:-12px -8px}
.f-bot a::after{content:"";position:absolute;inset:-14px -4px}
/* bunlarda yerleşim bozulmuyor, doğrudan yükseklik verildi */
.f-links a{display:inline-flex;align-items:center;min-height:44px}
.wb-book{min-height:44px}
@media(max-width:719px){
  .wb-book{min-height:44px;padding-top:12px;padding-bottom:12px}
}

/* ---- 22. lead görseli de büyütülebilir ----
   "The base is the boat" bloğundaki kare artık galerinin parçası
   (data-lg="5"). Düğme .cp-lead-m'in mutlak konumlu görselini
   sarmaladığı için akıştan çıkarılıyor — kutu ölçüsü değişmiyor. */
.cp-lead-m .ba-z,.cp-lead-m .ba-z picture{position:static;display:block;height:100%}
/* Şerit yine 5 kare: lead'e img/1.jpg geldi, katalog "Aerial" karesi
   şeride döndü (§15 kuralları geçerli: 5 → 3 → 2 sütun). */

/* ═══ 23. ROTA HARİTASI — BAŞLIK, DAHA BÜYÜK HARİTA, İLERLEME ÇUBUĞU
   Kaan, Ağu 2026: "Routes kısmında başlık yok onu ekleyelim ve scroll
   down animasyonunu biraz büyütelim, görünürlüğü artsın." → ikisi de.
   ═══════════════════════════════════════════════════════════════ */

/* ---- başlık bloğu ----
   .rt-wrap'in kendi krem zemini var; başlık bölümü onunla aynı zemine
   oturuyor ve alt dolgusu sıfırlanıyor ki harita başlığa yapışsın. */
#rtHead{padding-bottom:0}

/* ---- harita büyüdü ----
   ÖLÇÜLDÜ (1440×900): harita sütunu 55% → 59%, yükseklik tavanı
   760 → 860 px. Yapışkan çerçeve 100vh olduğu için 86vh tavanı
   900 px'lik ekranda 774 px'e denk geliyor, taşma yok.
   Çizgi ve noktalar SVG BİRİMİ: viewBox 620 birim ≈ 450 px, yani
   1 birim ≈ 0,73 px. Çizgi 2 → 2.6 birim (1,5 → 1,9 px). */
.rt-in{grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)}
.rt-map{height:min(86vh,860px)}
.rt-line{stroke-width:2.6}
.rt-dot{r:7.6}
.rt-n{font-size:23px}
.rt-s{font-size:18.5px}

/* ---- ilerleme: sayaç + dolan çubuk ----
   Sayaç 10,5 → 13 px ve tam kontrasta çekildi (ikincil renkte
   kayboluyordu). Altındaki çubuk kaydırma boyunca doluyor —
   bölümün 340vh olduğunu ve kaydırmanın bir şeyi sürüklediğini
   gösteren tek işaret buydu. */
.rt-prog{margin-top:24px;font-size:13px;color:var(--tx-l)}
.rt-bar{display:block;margin-top:10px;height:2px;width:min(260px,100%);
  background:rgba(3,9,16,.16);overflow:hidden}
.rt-bar i{display:block;height:100%;background:var(--tx-l);
  transform:scaleX(0);transform-origin:0 50%;will-change:transform}
@media(max-width:899px){
  .rt-in{grid-template-columns:1fr}
  .rt-map{height:min(52vh,420px)}
  .rt-n{font-size:31px}
  .rt-s{font-size:25px}
  .rt-dot{r:9.5}
  .rt-line{stroke-width:3.4}
  .rt-prog{margin-top:14px}
  .rt-bar{margin-top:8px;width:100%}
}
@media(max-height:560px) and (max-width:899px){
  .rt-map{height:36vh}
}
@media(prefers-reduced-motion:reduce){
  .rt-bar i{transition:none}
}

/* ---- yapışkan çerçeveye SIĞDIRMA (aynı denetimde çıktı) ----
   .rt-stick 100svh ve overflow:hidden — içerik taşarsa sessizce
   kırpılıyor. Ölçüldü, ÜÇ boyutta taşıyordu ve ilerleme çubuğu
   ekranın altında kalıyordu:
     1440×760  15 px · 899×900  200 px · 360×640  78 px
   Sebep haritanın büyümesi değil, SAĞ PANELİN FOTOĞRAFI: 4/5 oran
   masaüstünde 637 px'e, 899 px'te tek sütuna inince 517 px'e
   çıkıyordu. Yükseklik tavana bağlandı; object-fit:cover zaten
   özneyi ortada tutuyor. */
.rt-fig{max-height:min(46vh,460px)}
@media(max-width:899px){
  .rt-map{height:min(48vh,400px)}
  .rt-fig{max-width:340px;max-height:none}
  .rt-side{max-width:560px}
}
/* Kısa ekran (yatay telefon, küçük Android): fotoğraf düşüyor,
   harita ve panel kalıyor. Eşik 560 → 700 px'e çekildi; 360×640'ta
   560 kuralı devreye girmiyordu ve 78 px kırpılıyordu. */
@media(max-height:700px) and (max-width:899px){
  .rt-map{height:34vh}
  .rt-fig{display:none}
}

/* ---- 25. MODAL'DAKİ DOĞRUDAN İLETİŞİM (14 Ağustos 2026) ----
   Form sunucuya bağlanana kadar modal'ın tek çalışan çıkışı bu satır.
   Altın burada meşru: skill §3'e göre aksan rengi ana çağrıda ve
   modal'da kalıyor. .mdl-wm'in kendi üst çizgisi zaten var, bu satır
   onun ÜSTÜNE geliyor — ikinci bir çizgi çizilmiyor.
   Dokunma hedefi ::after kapağıyla 44 px'e çıkarıldı (§21 yöntemi);
   iki bağlantının kapağı birbirini yutmasın diye yatay pay 4 px. */
.mdl-contact{margin-top:clamp(18px,2.4vw,24px);font-size:13px;line-height:1.5;
             color:var(--tx-d-dim)}
.mdl-contact a{position:relative;color:var(--tx-d);
               border-bottom:1px solid rgba(201,162,39,.45);
               transition:color .3s var(--e),border-color .3s var(--e)}
.mdl-contact a::after{content:"";position:absolute;inset:-14px -4px}
.mdl-contact span{padding:0 4px;opacity:.5}
@media(hover:hover){
  .mdl-contact a:hover{color:var(--gold);border-color:var(--gold)}
}

/* Footer bağlantı satırı uzadı: PHONE/EMAIL etiketleri yerine gerçek
   numara ve adres yazılıyor (43.9+38.7 → 117.5+171.9 px, +206.8 px).
   Ölçüldü: 1024 px ve üstünde logo ile bağlantılar HÂLÂ tek satırda
   (1024'te 29 px pay kalıyor). Altında logo kendi satırına düşüyor —
   eski eşik 599, yeni eşik 960 px.
   Logo alta düştüğünde bağlantıları sağa yaslamak ortada boşluk
   bırakıyordu; iki satır da aynı sol kenardan başlıyor. style.css'teki
   719 px'lik aynı kural bunun altında zaten devrede. */
@media(max-width:959px){ .f-links{justify-content:flex-start} }


/* ---------- 26. MENU DÜĞMESİ ARTIK SADECE MOBİLDE (14 Ağustos 2026) ----------
   Kaan: "ana sayfadaki menüyü kaldıralım, Camps / Calendar / Routes
   kalsın." 1024 px ve üstünde Menu düğmesi gizlendi — orada zaten
   .hdr-nav görünür durumda ve panelin taşıdığı her bağlantı barda var.
   ⚠️ 1024 ALTINDA KALDIRILMADI: .hdr-nav orada gizleniyor (yukarıdaki
   @media max-width:1023 kuralı), Menu paneli mobilin TEK gezinmesi.
   İkisini birden kaldırmak telefonda sayfayı gezilemez bırakırdı.
   Ölçüldü: dört bağlantı (CAMPS · CALENDAR · ROUTES · CONTACT) gerçek
   Poppins 600 / 12.6px / ls .2em ile 287.9 px; Menu'nün 46.2 px'i
   çıktığı için sol sütun 1024 px'te büyümüyor. */
@media(min-width:1024px){ #menuBtn{display:none} }

/* ---------- 27. CONTACT SAYFASI ----------
   Referans: notinparis.me/pages/visit — ölçümler contact.html'in
   başındaki yorumda. Başlık bloğu için yeni sınıf YAZILMADI, sayfanın
   kendi .sec-head / .sec-title / .nx dili kullanıldı; burada yalnızca
   h1 sürümü ve ızgara tanımlanıyor.                                  */

/* .sec-title yalnız h2 için yazılmıştı; contact'ta görünen başlık h1
   (sayfada tek başlık o, gizli sr-only h1 koymak yerine gerçek olan).
   ⚠️ PUNTO SİTENİN GENEL BÖLÜM BAŞLIĞINDAN KÜÇÜK (Kaan, 14 Ağu 2026:
   "sayfa çok büyük geldi"). Tavan 78 → 58, taban 34 → 28 px.
   Taban ölçüyle seçildi: gerçek Archivo Black ile "BEFORE YOU BOOK."
   34 px'te 368.6 px — 360 px ekranda sarmalayıcıda 320 px yer var,
   yani satır ikiye kırılıyordu. 28 px'te 303.5 px, tek satır. */
.sec-title h1{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(28px,4.4vw,58px);line-height:1;letter-spacing:-.02em;
  color:var(--tx-l);margin:0}
.sec-title h1 .dim{color:var(--dim-l)}

/* Sayfanın üstü krem → header'ın beyaz metni için koyu bar şart.
   Bar sabit konumlu olduğu için bölümün üst dolgusu bar yüksekliği
   kadar artırıldı (bar 15px+25px+15px ≈ 55 px, .solid dolgusuyla). */
body.hdr-solid header{mix-blend-mode:normal;background:rgba(3,9,16,.9);
  backdrop-filter:blur(16px);padding-top:15px;padding-bottom:15px}
body.hdr-solid header::before{opacity:0}
/* Üst dolgu = sabit barın altından başlamak. Ölçüldü: bar 1024+ 72.9 px,
   1023 altı 82.4–84.1 px. Taban 116 px → en dar ekranda barın altında
   32 px pay kalıyor; 104'te bu 21.6 px'ti ve başlık bara yapışık duruyordu. */
.ct-sec{padding-top:clamp(112px,9vw,124px)}

/* Referansta oran 702.5 | 585.5 (fotoğraf 1.2 kat GENİŞ) ve gap 80.
   ⚠️ BİZDE TERSİ: 1 | 1.3 (Kaan, 14 Ağu 2026: "fotoğraf da ufalsın").
   1440'ta fotoğraf 688 → 549 px, yüksekliği 576 → 439 px (−%24).
   Gap ve üst dolgu da kısıldı; sayfa aynı içerikle daha az yer tutuyor. */
.ct-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);
  gap:clamp(24px,3.4vw,52px);padding-top:clamp(22px,2.6vw,34px)}

.ct-fig{margin:0;display:flex;flex-direction:column;gap:10px}
.ct-fig picture{display:block;border:1px solid var(--line-l)}
.ct-fig img{display:block;width:100%;height:auto;aspect-ratio:1.25/1;object-fit:cover}
.ct-cap{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}

/* Sağ sütun: 2×2 blok, altında Book.
   ⚠️ Book DİBE YASLANMADI. .cp-box'taki margin-top:auto burada
   çalışmıyor (ızgara align-content:start) ve zorlanırsa bloklarla
   düğme arasında 1440'ta ~180 px boşluk kalıyor — fotoğraf sütunu
   bilgi sütunundan uzun. Düğme akışta, blokların hemen altında. */
.ct-info{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(20px,2.2vw,28px) clamp(18px,1.8vw,24px);align-content:start}
.ct-block p,.ct-block address{margin:8px 0 0;font-style:normal;
  font-size:15.5px;line-height:1.55}
.ct-block a{border-bottom:1px solid var(--line-l);
  transition:color .3s var(--e),border-color .3s var(--e)}
@media(hover:hover){ .ct-block a:hover{color:var(--gold-l);border-color:var(--gold-l)} }
.ct-sub{color:var(--tx-l-dim);font-size:13.5px;line-height:1.5;margin-top:8px}

/* İletişim bağlantıları blok: satır içi bağlantının dokunma hedefi
   24 px'te kalıyordu (§21 eşiği 44). ::after kapağı kullanılmadı —
   iki bağlantı alt alta olduğu için kapaklar birbirini yutuyordu.
   Blok + 10 px dikey dolgu ile her satır 44 px, çakışma yok. */
.ct-lines{margin:8px 0 0}
.ct-lines a{display:block;padding:10px 0;width:fit-content;
  font-size:15.5px;line-height:1.55}

.ct-cta{grid-column:1 / -1;padding-top:clamp(18px,2.1vw,26px);
  border-top:1px solid var(--line-l)}
.ct-note{margin:12px 0 0;font-size:13.5px;line-height:1.5;color:var(--tx-l-dim);
  max-width:38ch}

/* 899 altında tek sütun: önce fotoğraf, sonra bilgi. Bilgi ızgarası
   599'a kadar iki sütunda kalıyor — bloklar kısa, erken tek sütuna
   inmek sayfayı gereksiz uzatıyor. */
@media(max-width:899px){
  .ct-grid{grid-template-columns:1fr;gap:26px}
  .ct-fig img{aspect-ratio:16/10}
}
@media(max-width:599px){
  .ct-info{grid-template-columns:1fr}
  .ct-fig img{aspect-ratio:4/3}
}


/* ---------- 28. DİSİPLİNLER — AKAN ŞERİT (14 Ağustos 2026) ----------
   Kaan: Expeditions'ın altında, aynı kart dili, ama yazı KUTUNUN
   İÇİNDE; sürekli sola akan bir şerit, "çok dar olmasın".

   ÖLÇÜ: kart 1440'ta 340×425 px (Expeditions kartıyla aynı 4/5 oran,
   Kaan'ın seçtiği "orta" boy). Şerit .wrapx'in DIŞINDA, sayfa kenarına
   dayanıyor — kesilmiş kart hissi şeridin sürdüğünü anlatıyor.

   ⚠️ gap YOK, margin-right VAR. Sebep: iki özdeş grup ve -%50'lik
   kaydırmayla döngü kuruluyor; gap kullanınca toplam genişlik
   12·kart + 11·boşluk oluyor ve -%50 tam bir gruba denk gelmiyor,
   her turda yarım boşluk (7 px) sıçrama görünüyordu. margin ile her
   kart (kart+boşluk) katkısı veriyor, -%50 = tam bir grup.

   HIZ: mesafe = 6 × (340+14) = 2.124 px / 48 sn ≈ 44 px/sn.
   720 altında kart küçüldüğü için süre de kısaldı, hız aynı kalsın.

   Perde ÖLÇÜLDÜ (PIL, §16 yöntemi — altı karenin her birinde metin
   bandının en kötü %5 persentili): .78/.40 perdede en kötü kare 3.68
   (sailing), .86/.50 perdede 5.10. İkincisi seçildi.
   Kare bazında en kötü %5: sailing 5.10 · cycling 5.16 · wing 5.60 ·
   kite 6.17 · swim 13.21 · trail 13.92.                              */
.dsc-strip{overflow:hidden;margin-top:clamp(22px,2.8vw,36px)}
.dsc-track{display:flex;width:max-content;
  animation:dscRun 48s linear infinite}
.dsc-grp{display:flex;list-style:none;margin:0;padding:0}
@keyframes dscRun{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}
/* WCAG 2.2.2: 5 sn'den uzun süren hareket durdurulabilmeli. */
@media(hover:hover){ .dsc-strip:hover .dsc-track{animation-play-state:paused} }
.dsc-strip:focus-within .dsc-track{animation-play-state:paused}

.dsc-card{position:relative;flex:0 0 auto;overflow:hidden;
  width:clamp(240px,23.6vw,340px);margin-right:14px}
.dsc-card picture{display:block}
.dsc-card img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
/* perde: alt kenarda .86, %30 yukarıda .50, %62'de biter */
.dsc-card::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(3,9,16,.86) 0%,rgba(3,9,16,.50) 30%,rgba(3,9,16,0) 62%)}
.dsc-name{position:absolute;z-index:1;left:clamp(14px,1.3vw,18px);
  bottom:clamp(13px,1.2vw,17px);right:clamp(14px,1.3vw,18px);
  font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(16px,1.55vw,22px);line-height:1.05;letter-spacing:-.02em;
  color:var(--tx-d)}

/* ⚠️ Mobil genişlik 58vw ile yazılmıştı; 719 px'te kart 240 → 260'a
   ÇIKIYORDU, yani ekran daraldıkça kart büyüyordu. 48vw + tavan 240 ile
   eşik iki yanda da 240 px. Ölçüldü: 720→240 · 719→240 · 599→240 ·
   430→206→200 · 390→200 · 360→200. */
@media(max-width:719px){
  .dsc-card{width:clamp(200px,48vw,240px);margin-right:10px}
  .dsc-track{animation-duration:34s}
}
@media(prefers-reduced-motion:reduce){
  .dsc-track{animation:none}
  .dsc-strip{overflow-x:auto;padding-bottom:6px}
  .dsc-grp[aria-hidden="true"]{display:none}
}


/* ---------- 29. ROTA VİNYETİ — ÇİZGİ GİBİ AÇILMA (14 Ağustos 2026) ----
   Kaan: "tekne çizimi Kızılkuyruk'a gelince rota gibi ortaya çıksın."
   Betik her karede --v (0..1) yazıyor; burada clip-path soldan sağa
   açılıyor. Rota çizgisi stroke-dashoffset ile çiziliyor, vinyet
   yüzlerce kısa polyline'dan oluştuğu için aynı yöntem uygulanamıyordu
   — her birine ayrı dash vermek gerekirdi. Tek bir perde aynı "çiziliyor"
   hissini veriyor ve tek satır.
   Hareket azaltma açıkken perde yok: çizim baştan görünür. */
.rt-vig{clip-path:inset(0 calc((1 - var(--v,0)) * 100%) 0 0);
        opacity:var(--v,0)}
@media(prefers-reduced-motion:reduce){
  .rt-vig{clip-path:none;opacity:1}
}

/* ═══ 24. DEMİR ATILAN YERLER — 16 durak hücre ızgarası ═══
   Sayfanın başındaki rakam şeridiyle (.cp-nums) AYNI dil: tam
   genişlik, 1px ayraçlar, Archivo Black numara. Yeni bir kalıp
   eklenmedi — o dil sayfada bir kez geçiyordu, ikinciyi hak etti.

   4 → 3 → 2 sütun. ÖLÇÜLDÜ: en uzun ad "Yacht Classic Marina"
   1440'ta 4 sütunda 360 px hücreye 14,5 px puntoda 143 px, iki
   satıra taşmadan sığıyor; 320 px ekranda 2 sütunda hücre 160 px,
   ad iki satıra iniyor ve taşma yok. */
.anc{display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid var(--line-l);border-bottom:1px solid var(--line-l);
  margin-top:clamp(18px,2.4vw,30px)}
.anc-c{padding:clamp(16px,1.8vw,22px) clamp(14px,1.8vw,28px);
  border-right:1px solid var(--line-l);
  display:flex;flex-direction:column;gap:7px;min-width:0}
.anc-c:nth-child(4n){border-right:0}
.anc-c:not(:nth-last-child(-n+4)){border-bottom:1px solid var(--line-l)}
.anc-c .n{font-family:var(--display);font-weight:400;letter-spacing:-.02em;
  line-height:1;font-size:clamp(18px,1.9vw,26px);
  font-variant-numeric:tabular-nums;color:var(--tx-l)}
.anc-c .nm{font-size:14.5px;line-height:1.35;color:var(--tx-l)}
.anc-c .d{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}
@media(max-width:1023px){
  .anc{grid-template-columns:repeat(3,1fr)}
  .anc-c:nth-child(4n){border-right:1px solid var(--line-l)}
  .anc-c:nth-child(3n){border-right:0}
  .anc-c:not(:nth-last-child(-n+4)){border-bottom:1px solid var(--line-l)}
  .anc-c:nth-last-child(-n+4){border-bottom:0}
  .anc-c:not(:nth-last-child(-n+1)){border-bottom:1px solid var(--line-l)}
}
@media(max-width:639px){
  .anc{grid-template-columns:repeat(2,1fr)}
  .anc-c:nth-child(3n),.anc-c:nth-child(4n){border-right:1px solid var(--line-l)}
  .anc-c:nth-child(2n){border-right:0}
  .anc-c:not(:nth-last-child(-n+2)){border-bottom:1px solid var(--line-l)}
  .anc-c:nth-last-child(-n+2){border-bottom:0}
}

/* ---------- 30. THE BOATS — İKİ TEKNE YAN YANA ----------
   Kaan, 18 Ağu 2026: "solda bir tekne sağda bir tekne olsun,
   bütün görseller ve fotolar bu şekilde düzenlensin."

   Yeni sınıf sayısı ÜÇ (.fleet · .fl-b · .fl-lead · .fl-hd).
   Kareler için .ba-shots, künye için .cp-spec, büyütme için .ba-z
   AYNEN yeniden kullanılıyor — sayfada ikinci bir figür dili yok.
   .ba-lead / .ba-grid / .ba-strip kuralları §16–17'de DURUYOR;
   tek tekneye dönülürse markup'ı yapıştırmak yetiyor.

   İki sütun arasında 1 px dikey çizgi: sayfanın kendi ayırıcı dili
   (.anc, .strip-cell). Renk eklenmedi.

   ⚠️ SÜTUNA İNME EŞİĞİ 1199, 899 DEĞİL. ÖLÇÜLDÜ — her tekne 2×2
   kare taşıdığı için iki sütunda ekranda dört kare yan yana:
     1440 → kare 305 px · 1280 → 283 px · 1200 → 265 px
     1024 → 216 px  ← §17'de "iç mekân kareleri okunmuyor" denen bant
   1199'da tek sütuna inince kare 463 px'e çıkıyor. Eşik bu yüzden
   .ba-grid'in 899'u değil 1199.                                  */
/* ⚠️ AYIRICI ÇİZGİ SÜTUNUN İÇİNE KONMAZ. İlk deneme ikinci sütuna
   border-left + padding-left verdi; padding sütunun İÇİNDEN gittiği
   için sağdaki teknenin görselleri soldakinden dar çıktı (1440'ta
   632 px'e karşı 568 px — ölçüldü). Çizgi şimdi .fleet'in kendi
   ::before'u, boşluğun tam ortasında; iki sütun eşit kalıyor. */
.fleet{position:relative;display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(28px,4.4vw,64px);margin-top:clamp(26px,3.4vw,48px)}
.fleet::before{content:"";position:absolute;left:50%;top:0;bottom:0;
  width:1px;background:var(--line-l);transform:translateX(-.5px)}
.fl-b{margin:0;min-width:0}
.fl-lead{margin:0}
.fl-lead picture{display:block;aspect-ratio:16/9;overflow:hidden;
  background:var(--cream-2)}
.fl-lead img{width:100%;height:100%;object-fit:cover;display:block;
  filter:saturate(.9)}
.fl-lead figcaption{margin-top:9px;font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
/* Ad + model: kart dilindeki gibi görselin ALTINDA. Punto tavanı 34 px
   — ölçülen Archivo Black genişlikleri (§16) ile "BLUE ANGEL" 34'te
   213 px; sütun en dar iki-sütun hâlinde (1200'de 526 px, punto
   orada zaten 28.8 px) rahat sığıyor. */
.fl-hd{margin-top:clamp(16px,1.8vw,22px);
  display:flex;flex-direction:column;gap:8px}
.fl-hd h3{font-family:var(--display);font-weight:400;text-transform:uppercase;
  letter-spacing:-.02em;line-height:1;font-size:clamp(22px,2.4vw,34px);
  color:var(--tx-l)}
.fl-b .cp-spec{margin-top:clamp(14px,1.6vw,20px);
  padding-top:clamp(14px,1.6vw,20px);border-top:1px solid var(--line-l)}
.fl-b .ba-shots{margin-top:clamp(16px,2vw,26px)}
@media(max-width:1199px){
  .fleet{grid-template-columns:1fr;gap:clamp(30px,4vw,44px)}
  .fleet::before{display:none}
  .fleet .fl-b + .fl-b{border-top:1px solid var(--line-l);
    padding-top:clamp(30px,4vw,44px)}
}
@media(max-width:519px){
  .fl-b .ba-shots{gap:12px}
}

/* ---------- 31. MOBİL SIKILAŞTIRMA (Kaan, 18 Ağu 2026, iPhone 14) ----------
   "season calendar'da turlar arası çok boş alan var" +
   "2026 season'da kamp, tarih ve Book alt alta olmuş, sayfayı uzatmış.
    Book sağa gelsin, satır kısalsın. Sadece mobilde, desktop değişmesin."
   İki blok da yalnız medya sorgusu içinde — masaüstünde tek piksel
   değişmiyor.                                                            */

/* --- 31a. Ana sayfa takvimi (.wb-row) ---
   ≤429'da satır DÖRT kata çıkıyordu: (i|bk) · n · dt · pl.
   Tarih ve yer aynı satıra alındı, ayırıcı nokta ::before ile
   eklendi (markup'a dokunulmadı). Satır 4 kattan 3'e indi. */
@media(max-width:429px){
  /* dt sütunu AUTO, pl 1fr: tarih içeriği kadar yer kaplıyor, yer adı
     hemen yanına geliyor. Ters kurulunca (dt 1fr) tarih boşluğu
     yutuyor ve yer adı sağ kenara yapışık, kopuk duruyordu. */
  .wb-row{grid-template-columns:auto minmax(0,1fr) auto;
    grid-template-areas:"i  i  bk"
                        "n  n  bk"
                        "dt pl bk";
    column-gap:12px;row-gap:3px;padding:12px 0}
  .wb-row .dt{grid-area:dt}
  .wb-row .pl{grid-area:pl;white-space:nowrap}
  .wb-row .pl::before{content:"· "}
  .wb-row .bk{align-self:center}
}
/* 430–899 arasında da satır arası biraz sıkıldı (17 → 13). */
@media(min-width:430px) and (max-width:899px){
  .wb-row{padding:13px 0;row-gap:4px}
}

/* --- 31b. Tur sayfası "2026 season" tablosu (#dates .cp-tbl) ---
   Genel .cp-tbl mobil kuralı her hücreyi display:block yapıyor;
   bu tabloda Camp / tarih / Book üst üste üç satır oluyor ve bölüm
   gereksiz uzuyordu. Burada satır TEK SATIRA indi:
     [Camp 1] [26 Sep – 3 Oct 2026] .................. [Book →]
   ⚠️ Kural #dates ile SINIRLI — .cp-tbl'in genel mobil davranışı
   (rota/oda tabloları) aynen duruyor.
   ⚠️ td.num::before "CAMP" ön ekini basıyordu, hücrenin kendi metni
   zaten "Camp 1" olduğu için mobilde "CAMP Camp 1" çıkıyordu.
   Bu tabloda ön ek kapatıldı.
   ⚠️ Book düğmesinin 44 px dokunma hedefi KORUNDU (§21 denetimi). */
@media(max-width:719px){
  #dates .cp-tbl tr{display:grid;
    grid-template-columns:auto minmax(0,1fr) auto;
    align-items:center;column-gap:12px;padding:9px 0}
  #dates .cp-tbl td{display:block;padding:0;margin:0;border-bottom:0;
    text-align:left}
  #dates .cp-tbl td.num::before{content:none}
  #dates .cp-tbl td:last-child{text-align:right}
}
/* 380 px altında tarih ile Book yan yana sığmıyor (ölçüldü):
   tarih 130 px + Camp 48 px + düğme 88 px + boşluklar = 290 px,
   350 px'e sığar ama 320 px'lik ekranda taşar. Orada tarih alt
   satıra iner, düğme yine SAĞDA ve iki satır boyunca ortalı. */
@media(max-width:379px){
  #dates .cp-tbl tr{grid-template-columns:minmax(0,1fr) auto}
  #dates .cp-tbl td.num{grid-column:1;grid-row:1}
  #dates .cp-tbl td:nth-child(2){grid-column:1;grid-row:2;margin-top:3px}
  #dates .cp-tbl td:last-child{grid-column:2;grid-row:1/span 2}
}
/* ≤379'da tarih + yer aynı satıra sığmıyor: ÖLÇÜLDÜ, 360 px'te tarih
   sütununa 160 px kalıyor ve "Sat · 26 Sep–3 Oct 2026" iki satıra
   düşüyor — o satır 85 yerine 105 px oluyor, liste dişli görünüyor.
   Orada yer adı yine kendi satırına iniyor. */
@media(max-width:379px){
  .wb-row{grid-template-areas:"i  i  bk"
                              "n  n  bk"
                              "dt dt bk"
                              "pl pl bk"}
  .wb-row .pl::before{content:none}
}

/* ---------- 32. THE ROUTES — MOBİL YAN YANA (Kaan, 18 Ağu 2026) ----------
   iPhone 14 / Chrome'da bildirilen iki sorun:
   (1) ilerleme "start to finish" gitmiyor, ortada zıplıyor
   (2) fotoğraf haritanın ALTINDA kalıyor, hangi durakta olduğun
       görünmüyor.

   (1)'in sebebi JS'te: ilerleme `wrap.offsetHeight - innerHeight` ile
   hesaplanıyordu. iOS'ta adres çubuğu kaydırırken açılıp kapanınca
   `innerHeight` değişiyor → payda kayıyor → ilerleme zıplıyor.
   Masaüstünde adres çubuğu sabit olduğu için pencereyi daraltmakla
   ÇIKMIYOR. Düzeltme index.html'in kendi betiğinde: payda artık
   yapışkan çerçevenin ölçülen boyu (.rt-stick, 100svh — svh adres
   çubuğuyla değişmez).

   (2) için Kaan'ın seçimi: "solda küçük harita, sağda büyük fotoğraf".
   ≤719'da bölüm iki sütuna dönüyor; harita dar bir şerit, panel
   fotoğrafıyla birlikte yanında. 720–899 arası (tablet) DEĞİŞMEDİ,
   orada alt alta düzenin yeri var. Masaüstü hiç etkilenmiyor.

   ⚠️ SVG İÇİNDEKİ ETİKETLER KAPATILDI. Harita 390 px ekranda ~127 px
   sütuna düşüyor, ölçek 127/620 = 0.205; 31 birimlik etiket ekranda
   6,4 px'e iniyor ve okunmuyor. Durak adı zaten sağ panelde büyük
   punto ile yazıyor, aynı bilgi iki kez verilmiyor.
   ⚠️ ÇİZGİ VE NOKTALAR SVG BİRİMİ, ekranla ölçekleniyor. Aynı ölçekte
   masaüstü değerleri (stroke 2.6 · r 7.6) 0,5 ve 1,6 px'e iner —
   görünmez. Burada birim değerleri büyütüldü: stroke 9 birim ≈ 1,8 px,
   r 22 birim ≈ 4,5 px.                                              */
@media(max-width:719px){
  .rt-in{grid-template-columns:minmax(0,36fr) minmax(0,64fr);
    gap:14px;align-items:center}
  .rt-map{height:min(66vh,440px)}
  .rt-lbl{display:none}
  /* Vinyetler de kapalı: SVG overflow:visible olduğu için 121 px'lik
     sütunun dışına taşıp sağdaki fotoğrafın oluğuna giriyorlar, ve
     bu ölçekte (yaklaşık 45 px) zaten okunmuyorlar. */
  .rt-vig{display:none}
  /* Çizgi non-scaling-stroke: kalınlık artık SVG birimi değil ekran
     pikseli, yani 320–719 arasında sütun genişliği ne olursa olsun
     1,8 px kalıyor. Nokta yarıçapı ölçeklendiği için iki banda
     ayrıldı — ÖLÇÜLDÜ, tek değer verilince 390'da 8,6 px olan nokta
     719'da 16,5 px'e çıkıp lekeye dönüyordu. */
  .rt-line{vector-effect:non-scaling-stroke;stroke-width:1.8}
  .rt-dot{r:22}
  .rt-side{max-width:none}
  /* Bölümün genel "kısa ekranda fotoğrafı düşür" kuralı burada
     GEÇERSİZ: fotoğraf zaten bu düzenin sebebi. Yerine küçülüyor. */
  .rt-fig{display:block;aspect-ratio:4/5;max-width:none;
    max-height:min(44vh,340px);margin-bottom:12px}
  .rt-idx{font-size:9.5px}
  .rt-name{margin-top:8px;font-size:22px}
  .rt-desc{margin-top:8px;font-size:13.5px;line-height:1.5}
  .rt-prog{margin-top:12px;font-size:11.5px}
  .rt-bar{margin-top:7px}
}
/* 480–719: harita sütunu 158 → 233 px'e çıkıyor, aynı yarıçap orada
   iki katına biniyor. Ölçüldü: r 11 birim → 719'da 8,3 px çap. */
@media(min-width:480px) and (max-width:719px){
  .rt-dot{r:11}
}
/* Gerçekten kısa ekran (yatay telefon): fotoğraf 4/5'ten 4/3'e
   iniyor, metin iki satıra kırpılıyor — düşürmek yerine sıkıştır. */
@media(max-width:719px) and (max-height:620px){
  .rt-fig{aspect-ratio:4/3;max-height:38vh}
  .rt-desc{display:none}
  .rt-map{height:min(70vh,360px)}
}

/* ---------- 33. THE ROUTES — MOBİLDE KALDIRILDI (Kaan, 18 Ağu 2026) ----------
   "bence biz routes kısmını kaldıralım mobilde."
   §32'deki yan yana düzen denendi, Kaan telefonda bölümün tamamen
   çıkmasını istedi. §32 SİLİNMEDİ: aşağıdaki tek blok kaldırılınca
   yan yana düzen olduğu gibi geri gelir.

   ⚠️ Başlık da gidiyor. Yalnız .rt-wrap gizlenirse ekranda altı boş
   bir "The routes." başlığı kalıyor.
   ⚠️ Menü panelindeki Routes bağlantısı da mobilde gizlendi — sayfada
   olmayan bölüme çapa bırakılmıyor. Alt sayfalarda bağlantı
   "index.html#rtWrap" olduğu için seçici href SONUYLA eşleşiyor.
   ⚠️ JS'e dokunulmadı: gizlenen bölümde offsetHeight 0 oluyor,
   payda negatife düşüyor, tick p=0 ile sessizce çıkıyor — hata yok. */
@media(max-width:719px){
  #rtHead,.rt-wrap{display:none}
  #menuPanel a[href$="#rtWrap"],.hdr-nav a[href$="#rtWrap"]{display:none}
}

/* ---------- 34. BOOK MODAL — GENİŞ (YATAY) DÜZEN (Kaan, 18 Ağu 2026) ----------
   "book'a basınca açılan sayfa aşağı doğru çok uzun, onu yataya
   çevirelim, aşağı kaydırması zor oluyordu."

   ÖLÇÜLDÜ (önce): panel 640 px sabit, tek sütun, içerik 1.068–1.152 px.
   Her boyutta kaydırma gerekiyordu:
     1440×900 276 px · 1280×800 364 px · 1024×768 356 px
     390×844  308 px · 390×740  412 px

   ≥900 px'te panel iki sütuna dönüyor: solda başlık + açıklama, sağda
   formun tamamı, sol sütunun altında iletişim satırı ve logo.
   <900'de HİÇBİR ŞEY değişmiyor — sarmalayıcılar display:contents
   olduğu için kutu bile oluşturmuyorlar; mobilde yerleşim eskisiyle
   birebir aynı, sıra da aynı (başlık → form → iletişim → logo).

   ⚠️ .mdl-x mobilde float:right + sticky. Grid konteyneri float'un
   yanına akmaz, kenara itilir; bu yüzden ≥900'de düğme float'tan
   çıkarılıp panele göre absolute konumlandırıldı. O genişlikte panel
   zaten kaydırılmıyor, sticky'ye gerek yok.                         */
.mdl-grid,.mdl-side,.mdl-main,.mdl-foot{display:contents}
/* Telefon ve e-posta satır ortasından bölünmesin — dar sol sütunda
   "+90 532 / 136 17 35" diye iki satıra iniyordu. */
.mdl-contact a{white-space:nowrap}

@media(min-width:900px){
  .mdl-panel{width:min(1000px,100%);max-height:92svh}
  .mdl-grid{display:grid;
    grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
    column-gap:clamp(30px,3.6vw,54px);align-items:start}
  .mdl-side{display:block;grid-column:1;grid-row:1}
  .mdl-main{display:block;grid-column:2;grid-row:1/span 2}
  .mdl-foot{display:block;grid-column:1;grid-row:2;align-self:end}
  .mdl-x{position:absolute;float:none;margin:0;
    top:clamp(14px,1.6vw,22px);right:clamp(14px,1.6vw,22px);z-index:2}
  /* Başlık artık kendi sütununda, 16ch sınırı gereksiz dar kalıyordu. */
  .mdl-h{margin-top:14px;max-width:none;font-size:clamp(28px,2.6vw,36px)}
  .mdl-note{max-width:none;margin-bottom:0}
  .mdl-foot .mdl-wm{text-align:left}
}

/* ---- mobilde sıkıştırma ----
   Yatay düzen telefonda kurulamıyor (390 px'te iki sütun form okunmaz),
   onun yerine dikey yığın inceltildi. Alan kaybı yok: alan yükseklikleri
   ve 44 px dokunma hedefleri korundu, yalnız aralar ve başlık küçüldü. */
@media(max-width:719px){
  .mdl-panel{padding:clamp(20px,4vw,28px)}
  .field{margin-bottom:14px}
  .mdl-h{margin:10px 0 8px;font-size:clamp(23px,6.4vw,28px);max-width:18ch}
  .mdl-note{margin-bottom:16px;font-size:13px}
  .field textarea{min-height:62px}
  .field label{margin-bottom:4px}
  .mdl-wm{margin-top:16px;padding-top:14px}
  .mdl-contact{margin-top:14px}
  /* Telefon + grup sayısı yan yana: ikisi de kısa alan, 390 px'te
     sütun 162 px kalıyor ve ikisi de sığıyor (ÖLÇÜLDÜ). Ad/e-posta
     çifti YAN YANA ALINMADI — e-posta adresi 162 px'lik alanda
     okunmuyor, orada tek sütun daha doğru. */
  #bookForm .two + .two{grid-template-columns:1fr 1fr;gap:0 16px}
  /* Boş durum satırı 30 px yer tutuyordu; mesaj geldiğinde zaten
     kendi yüksekliğini alıyor. */
  .mdl-msg{margin-top:10px;min-height:0}
  .field textarea{min-height:54px}
  .mdl-panel{-webkit-overflow-scrolling:touch}
}

/* ═══ 30 · EKİP PANELİ — çok paragraflı bio (20 Ağustos 2026) ═══
   Buse'nin gerçek bio metni üç paragraf. .tp-bio artık <div>;
   global reset margin:0 verdiği için paragraf arası burada veriliyor.
   Tek paragraflı panellerde hiçbir etkisi yok. */
.tp-bio p+p{margin-top:.75em}

/* ═══ 31 · KÜNYE ŞERİDİ v2 — EKSEN DÜZENİ (20 Ağustos 2026) ═══
   Kaan'ın referansı: 8 hücreli ızgara → tek sıra rakam + nokta-ekseni
   + altta location/coordinates. Bizim dilimize çevrildi:
   rakam Archivo Black versal, etiket iki tonlu, nokta rengi mürekkep
   (altın YOK — altın yalnız ana çağrıda), çizgi 1px --line-l.
   §4'teki .strip kuralları artık kullanılmıyor; markup kaldırıldı. */
.strip2{background:var(--cream);border-bottom:1px solid var(--line-l);
  padding:clamp(30px,3.4vw,46px) 0 clamp(20px,2.4vw,30px)}
.s2-wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--wpad)}

.s2-row{display:grid;grid-template-columns:repeat(6,1fr);
  gap:clamp(8px,1.2vw,20px);list-style:none;margin:0;padding:0}
.s2-cell{display:flex;flex-direction:column;align-items:center;text-align:center}
.s2-n{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(26px,3.2vw,46px);line-height:.92;letter-spacing:-.02em;
  color:var(--tx-l);font-variant-numeric:tabular-nums}
.s2-l{font-size:10.5px;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l)}
.s2-cell .s2-l{margin-top:clamp(10px,1.1vw,16px)}
.s2-s{font-size:10.5px;line-height:1.5;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}

/* Eksen: hücrelerle aynı ızgara, nokta her sütunun merkezinde.
   Çizgi noktaların arkasından geçiyor — referanstaki hâli. */
.s2-axis{position:relative;display:grid;grid-template-columns:repeat(6,1fr);
  gap:clamp(8px,1.2vw,20px);align-items:center;height:9px;
  margin-top:clamp(16px,1.8vw,24px)}
.s2-axis::before{content:"";position:absolute;left:0;right:0;top:50%;
  height:1px;background:var(--line-l)}
.s2-axis i{position:relative;justify-self:center;width:7px;height:7px;
  border-radius:50%;background:var(--tx-l)}

.s2-foot{display:flex;justify-content:space-between;align-items:flex-end;
  gap:clamp(16px,2vw,40px);margin-top:clamp(18px,2.1vw,28px)}
.s2-b{display:flex;flex-direction:column;gap:6px}
.s2-b-r{text-align:right;align-items:flex-end}
.s2-v{font-family:var(--display);font-weight:400;text-transform:uppercase;
  font-size:clamp(17px,1.8vw,25px);line-height:1;letter-spacing:-.02em;
  color:var(--tx-l);font-variant-numeric:tabular-nums}

/* MOBİL: 3+3. Altı nokta 390 px'de 3 px'lik bir sıraya düşüp
   okunmuyor → eksen gizlenir, satırlar 1px çizgiyle ayrılır. */
@media(max-width:899px){
  .s2-row{grid-template-columns:repeat(3,1fr);row-gap:0}
  .s2-cell{padding:16px 4px}
  .s2-cell:nth-child(-n+3){border-bottom:1px solid var(--line-l)}
  .s2-axis{display:none}
  .s2-foot{margin-top:20px}
}
@media(max-width:479px){
  .s2-n{font-size:22px}
  .s2-l,.s2-s{font-size:9.5px;letter-spacing:.12em}
  .s2-foot{flex-direction:column;align-items:flex-start;gap:14px}
  .s2-b-r{text-align:left;align-items:flex-start}
}

/* ═══ 32 · İKİNCİL METİN RENGİ — POSTER SARISI (20 Ağustos 2026) ═══
   Kaan: "sitedeki ikinci font rengimiz bu sarıya yakın olsun,
   gri olanlar bu renge dönsün." Poster sarısı: #AB9C63 (h 47.5°).

   ⚠️ TEK RENKLE OLMUYOR, ÖLÇÜLDÜ:
     #AB9C63 krem zeminde  2.30:1  → normal metin eşiği 4.5, büyük 3.0.
                                     İKİSİNİ DE geçmiyor, okunmaz.
     #AB9C63 koyu zeminde  7.30:1  → sorunsuz.
   Bu yüzden sitenin kendi kalıbı (--gold / --gold-l) korundu: koyu
   zeminde posterin tonu birebir, krem zeminde aynı hue ve doygunlukta
   koyultulmuş sürüm. Değerler tek tek ölçüldü:
     #756A44 krem üstünde 4.52:1  (normal metin — eski gri 4.82 idi)
     #8A7E4E krem üstünde 3.41:1  (yalnız büyük metin — eski 3.86 idi)
     #AB9C63 koyu üstünde 7.30:1  (eski soluk krem 6.29 idi, yükseldi)
   Geri almak için bu bloğu sil: alttaki gri değerler geri gelir.  */
:root{
  --gold:#AB9C63;                 /* poster sarısı — koyu zeminde */
  --gold-l:#756A44;               /* krem zemin sürümü */
  --tx-l-dim:#756A44;             /* açık zeminde ikincil metin */
  --tx-d-dim:#AB9C63;             /* koyu zeminde ikincil metin */
  --dim-l:#8A7E4E;                /* açık zeminde soluk BÜYÜK metin */
}
/* Değişken yerine doğrudan rgba yazılmış altı yer — aynı tona çekildi. */
.tp-bio,.s2-s,.strip-cell .l{color:var(--tx-l-dim)}
/* Değişken yerine doğrudan yazılmış iki "soluk başlık satırı": */
.wi-head h2 .dim{color:var(--dim-l)}                 /* krem zemin, 3.41:1 */
.io-sec .sec-title h2 .dim{color:var(--tx-d-dim)}    /* koyu zemin, 7.30:1 */

/* ═══ 33 · ENDURANCE ŞERİDİ — beş hücre, iki seviye (20 Ağustos 2026) ═══
   Müşteri revizyonu: fiyat hücresi çıktı (fiyat artık iletişimde
   söyleniyor), km ve tırmanış hücreleri hem expert hem beginner
   veriyor. Izgara 6 → 5 sütun; yoksa son sütun boş kalıyordu.
   İkinci değer bilerek küçük ve ikincil renkte: hücrenin ana rakamı
   expert kalıyor, beginner onun altında okunuyor — şerit genişlemiyor. */
.cp-nums{grid-template-columns:repeat(5,1fr)}
.cp-num-2 .v2{font-family:var(--display);font-weight:400;letter-spacing:-.02em;
  line-height:1;font-size:clamp(15px,1.5vw,20px);color:var(--tx-l-dim);
  font-variant-numeric:tabular-nums;white-space:nowrap;margin-top:3px}
.cp-num-2 .l2{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}
@media(max-width:899px){ .cp-nums{grid-template-columns:repeat(3,1fr)} }
@media(max-width:519px){ .cp-nums{grid-template-columns:repeat(2,1fr)} }

/* ═══ 34 · INCLUDED KUTUSU KISALDI + BAŞVURU AÇIK ZEMİN (20 Ağustos 2026) ═══
   Kaan: "included/and what's not sayfası çok uzamış, dahil olmayanlar
   kısmı özellikle. Tasarımsal olarak kısaltalım aynı bilgilerle.
   Sonra sayfanın devamı açık renk gitsin."

   1) "Not included" tarafı da artık iki sütun (dört grup 2×2).
      Bilgi aynen duruyor, yalnız dizilim değişti.
   2) Kutu içi boşluklar bu bölümde sıkıldı: alt başlık üstü
      30 → 22, madde satır dolgusu 9 → 7, iki sütun arası 38 → 26.
   3) Başvuru bölümü lacivertten kreme döndü; ölçülen kontrastlar
      aşağıda, hiçbiri eşiğin altında değil. */
.io-cols-out{grid-template-columns:1fr 1fr}
.io-box .io-cols-out .cp-sub:first-child{margin-top:0}
.io-sec .io-cols{gap:clamp(16px,1.8vw,26px)}
.io-sec .cp-list + .cp-sub{margin-top:clamp(16px,1.8vw,22px)}
.io-sec .cp-list li{padding-top:7px;padding-bottom:7px}
.io-sec .sec{padding-bottom:0}
@media(max-width:899px){
  .io-cols-out{grid-template-columns:1fr;gap:0}
  .io-box .io-cols-out > div + div .cp-sub:first-child{margin-top:clamp(22px,3vw,32px)}
}

/* Başvuru bölümü — açık zemin.
   ÖLÇÜLDÜ (krem #E7ECEE üstünde): başlık 16.78:1 · başlığın soluk
   satırı 4.52:1 (eşik 3.0) · paragraf 4.52:1 (eşik 4.5) · çerçeveli
   düğme kenarı 16.78:1. Koyu zemindeki hâlinden düşen tek şey yok. */
.cp-apply-l{background:var(--cream);color:var(--tx-l)}
.cp-apply-l .lbl{color:var(--tx-l-dim)}
.cp-apply-l h2{color:var(--tx-l)}
.cp-apply-l h2 .dim{color:var(--dim-l)}
.cp-apply-l .rule{background:var(--line-l)}
.cp-apply-l p{color:var(--tx-l-dim)}
.cp-apply-l .note{color:var(--tx-l-dim)}
.cp-apply-l .btn-o{color:var(--tx-l);border-color:var(--tx-l)}
@media(hover:hover){ .cp-apply-l .btn-o:hover{background:var(--tx-l);color:var(--cream)} }

/* ═══ 35 · FOOTER AÇIK ZEMİN (20 Ağustos 2026) ═══
   Kaan: "footer da açık renkten devam." Başvuru bölümü kreme
   döndükten sonra footer'ın lacivert kalması sayfanın sonunda
   tek başına bir bant bırakıyordu.

   ⚠️ Bu, skill §11'deki "logo yalnızca koyu zeminde" kuralını
   ilk kez esnetiyor. Çözüm: krem zeminde beyaz wordmark yerine
   klasörde hazır duran KOYU sürüm (logo-wordmark-navy.png)
   kullanılıyor — üç sayfada da değiştirildi.

   ÖLÇÜLDÜ (krem #E7ECEE üstünde):
     koyu wordmark   ~17:1     · bağlantılar (--tx-l-dim) 4.52:1
     künye satırı    4.52:1    · üst çizgi/ayraç 1px --line-l
   Geri almak için bu bloğu sil + üç sayfada logo dosyasını
   logo-wordmark.png yap. */
footer{background:var(--cream);color:var(--tx-l);border-top-color:var(--line-l)}
.f-links a{color:var(--tx-l-dim)}
@media(hover:hover){ .f-links a:hover{color:var(--gold-l)} }
.f-bot{color:var(--tx-l-dim);border-top-color:var(--line-l)}
.f-bot a{color:var(--tx-l-dim);border-bottom-color:rgba(3,9,16,.28)}
@media(hover:hover){ .f-bot a:hover{color:var(--gold-l);border-color:var(--gold-l)} }

/* ═══ 36 · TUR SAYFASI ŞERİDİ = ANA SAYFA EKSEN DÜZENİ (20 Ağustos 2026) ═══
   Kaan: "tur sayfamızdaki grid yapı ana sayfadaki yeni timeline gibi
   olsun." Endurance Lab'deki .cp-nums ızgarası kaldırıldı, ana sayfanın
   .strip2 dili kullanıldı. Tek fark yedi değer olması — .s2-7.
   .strip2-in: burada hero'nun hemen altında değil, sayfa içinde
   duruyor; üst çizgi eklendi ki başlık bloğundan ayrılsın. */
.strip2-in{border-top:1px solid var(--line-l)}
.s2-7{grid-template-columns:repeat(7,1fr)}
@media(max-width:1099px){ .s2-7{grid-template-columns:repeat(4,1fr)} }
@media(max-width:899px){
  .s2-7{grid-template-columns:repeat(3,1fr)}
  .s2-7 .s2-cell:nth-child(-n+3){border-bottom:1px solid var(--line-l)}
  .s2-7 .s2-cell:nth-child(n+4):nth-child(-n+6){border-bottom:1px solid var(--line-l)}
}
@media(max-width:479px){ .s2-7{grid-template-columns:repeat(2,1fr)} }

/* ═══ 37 · KART KÖŞELERİ HAFİF YUVARLAK (20 Ağustos 2026) ═══
   Kaan: "ana sayfadaki tur görselleri ve disiplin görsellerinin
   köşeleri hafif round olsun." 6 px seçildi — 4 px ekranda fark
   edilmiyor, 10 px'ten sonra kartlar 'uygulama' hissi vermeye
   başlıyor ve sayfanın keskin ızgara diliyle çatışıyor.
   Kartların kendisinde overflow:hidden zaten var, perde (::after)
   ve fotoğraf birlikte kırpılıyor; kartın alt yazısı dışarıda
   olduğu için etkilenmiyor. */
.prod-ph{border-radius:6px}
.dsc-card{border-radius:6px}
.dsc-card::after{border-radius:6px}

/* Aynı yuvarlaklık sayfadaki DİĞER görsel yuvalarına da (Kaan, 20 Ağu):
   ekip panelinin üç karesi, rota panelinin fotoğrafı, kamp sayfasındaki
   lead görsel, tekne galerisi ve gün şeridi.
   ⚠️ DIŞARIDA BIRAKILANLAR — kenardan kenara giden tam genişlik
   bantlar: hero videosu, "Windbase nedir" bandı, timer bandı ve
   kamp sayfasının fotoğraflı başlığı. Ekran kenarına dayanan bir
   bandın köşesini yuvarlatmak kenarda boşluk bırakır. */
.tp-m,.rt-fig,.cp-lead-m,.fl-lead picture,.ba-shots picture,.day-strip{border-radius:6px}
.fl-lead,.ba-shots figure{overflow:visible}

/* ═══ 38 · YENİ TİPOGRAFİ — SYNE + ARCHIVO + INTER (20 Ağustos 2026) ═══
   Kaan/müşteri kararı: tipografi denemesi PDF'indeki üçlü benimsendi.
   Üçü de SIL Open Font License — ticari kullanım, web ve baskı serbest,
   lisans bedeli yok. Türkçe karakterler (ı İ ş Ş ğ Ğ ç ö ü â) test edildi.

     Syne 700/800   → display: tüm başlıklar, rakamlar, kart adları
     Archivo 400/500 → uzun metin: paragraf, lede, bio, açıklama
     Inter 500/600   → arayüz: mikro etiket, menü, buton, künye, tablo

   ESKİSİ: Archivo Black (display) + Poppins (her şey).
   Dosyalar assets/fonts/ altında, yerel yükleniyor — Google Fonts
   bağlantısı artık yalnız EB Garamond için gerekiyor (rota haritası).

   ⚠️ Syne, Archivo Black'ten GENİŞ. Başlık puntoları bu yüzden
   aşağıda ayrıca kısıldı; her genişlikte taşma taraması yapıldı. */
@font-face{font-family:"Syne WB";src:url(fonts/syne-700.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:"Syne WB";src:url(fonts/syne-800.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:"Archivo WB";src:url(fonts/archivo-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:"Archivo WB";src:url(fonts/archivo-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:"Inter WB";src:url(fonts/inter-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:"Inter WB";src:url(fonts/inter-600.woff2) format('woff2');font-weight:600;font-display:swap}

:root{
  --display:"Syne WB","Archivo Black",sans-serif;
  --body:"Inter WB","Helvetica Neue",Arial,sans-serif;   /* arayüz + etiket */
  --text:"Archivo WB","Helvetica Neue",Arial,sans-serif;  /* uzun metin */
  --w-body:500;
  --w-ui:600;
}
/* Display yüzleri: Syne'de 400 yok — başlıklar 800, ikincil display 700. */
.h1,.h2,.h3,.hero-wm + *,.s2-n,.s2-v,.prod-ph .st,.prod-meta .name,
.tp-name,.cp-title h1,.sec-title h2,.cp-lead-t h2,.cp-apply h2,
.wb-row .n,.cd-n,.rt-name,.fl-hd h3,.cp-num .v{font-weight:800}
.tp-spec dd,.card .date{font-weight:700}

/* Uzun metin Archivo'ya geçiyor — okuma konforu için.
   Etiket/menü/buton Inter'de kalıyor (yukarıdaki --body). */
p,.lede,.tp-bio,.cp-intro,.cp-lead-t p,.tbar-lede,.rt-desc,.s2-b .s2-v + *,
.cp-list li,.dsc-card p,.f-bot{font-family:var(--text)}

/* Syne geniş: başlık puntoları kısıldı (ölçümle) */
.sec-title h2{font-size:clamp(30px,4.6vw,64px)}
.cp-title h1{font-size:clamp(32px,5vw,58px)}
.h2{font-size:clamp(26px,3.6vw,44px)}
.s2-n{font-size:clamp(22px,2.7vw,38px)}
.prod-ph .st{font-size:clamp(20px,2.4vw,32px)}
/* Inter, Poppins'ten geniş: header düğmeleri 4–8 px taşıyordu
   (Book 93>89, Menu 60>52). Punto 12.6 → 12, harf arası .20 → .16em. */
.cta,.navlink,.menu-btn,.hdr-r .lang-b{font-size:12px;letter-spacing:.16em}

/* ═══ 39 · BAŞLIK PUNTOLARI KISILDI (20 Ağustos 2026) ═══
   Kaan: "başlıklar çok büyük, genel olarak hepsini biraz ufaltalım."
   Syne, Archivo Black'ten hem geniş hem optik olarak daha iri
   göründüğü için §38'deki değerler bile büyük kalmış. Tüm display
   öğeleri ~%15 kısıldı; oranlar korundu (bölüm başlığı > sayfa
   başlığı > h2 > kart adı) ki hiyerarşi bozulmasın. */
.sec-title h2{font-size:clamp(26px,3.9vw,54px)}
.cp-title h1{font-size:clamp(27px,4.2vw,49px)}
.cp-apply h2{font-size:clamp(25px,3.8vw,52px)}
.h2{font-size:clamp(22px,3.1vw,37px)}
.s2-n{font-size:clamp(19px,2.3vw,32px)}
.s2-v{font-size:clamp(15px,1.5vw,21px)}
.prod-ph .st{font-size:clamp(17px,2vw,27px)}
.prod-meta .name{font-size:clamp(15px,1.5vw,22px)}
.tp-name{font-size:clamp(24px,2.5vw,37px)}
.wb-row .n{font-size:clamp(15px,1.6vw,23px)}
.cd-n{font-size:clamp(28px,4vw,54px)}
.fl-hd h3{font-size:clamp(20px,2.2vw,31px)}
.cp-lead-t h2{font-size:clamp(21px,2.8vw,35px)}
/* Kendi kuralı olan iki başlık da aynı oranda kısıldı. */
#team .h2{font-size:clamp(25px,3.5vw,42px)}
.wi-head h2{font-size:clamp(24px,3.3vw,40px)}

/* ═══ 40 · SYNE'DE 400 YÜZÜ YOK — EKSİK AĞIRLIKLAR (20 Ağustos 2026) ═══
   Kaan: "'Not a holiday / A training block at sea' kısmında eski
   fontlar mı kalmış?" — Font doğruydu (Syne), ağırlık yanlıştı.
   Eski Archivo Black tek yüzlüydü ve her yerde font-weight:400
   yazıyordu; Syne'de 400 yok, tarayıcı en yakınına düşünce o
   başlıklar diğerlerinden ince ve farklı görünüyordu.
   Sayfaların tamamı tarandı, Syne kullanıp 700'ün altında kalan
   HER öğe bulundu ve düzeltildi. */
.wi-head h2,.wi-head h2 .dim,
.dsc-name,
.tname span,.tname sup,
.day-list h3,.day-list .n,.days .n,
.cp-branch .v,.rtb .d,.rp-hd .t,
.cd-s{font-weight:800}
/* İkincil display kullanımları 700'de kalıyor — hiyerarşi için. */
.dsc-name,.tname span,.rp-hd .t{font-weight:700}
/* Gün listesi: gün numarası ve gün başlığı (kamp sayfası). */
.cp-day .n,.cp-day h3{font-weight:800}

/* ═══ 41 · KÜNYE ŞERİDİ SADELEŞTİ (20 Ağustos 2026) ═══
   Kaan: "site girişindeki timeline bu fontla garip geldi, daha sade
   olabilir." Üç varyant denendi, C seçildi.
   Değişenler: rakamlar Syne yerine INTER 500 (şerit bir künye,
   dekoratif display değil) · mikro etiket harf arası .16 → .20em,
   punto 10.5 → 9.5 · nokta ekseni kalktı, yerine tek ince çizgi.
   Hem ana sayfadaki şeride hem kamp sayfasının yedi hücreli
   sürümüne uygulanıyor — ikisi aynı dil olmalı. */
.s2-n{font-family:var(--body);font-weight:500;
  font-size:clamp(24px,3vw,42px);letter-spacing:-.02em}
.s2-v{font-family:var(--body);font-weight:500;letter-spacing:-.01em}
.s2-l,.s2-s{font-size:9.5px;letter-spacing:.2em}
.s2-axis{margin-top:clamp(14px,1.6vw,20px);height:1px}
.s2-axis i{display:none}
.s2-axis::before{background:var(--line-l)}

/* ═══ 42 · KAMP SAYFASI BAŞLIKLARI BİR TUR DAHA KISILDI (20 Ağu 2026) ═══
   Kaan: "tur sayfasındaki başlıkları da küçültelim, çok büyük ve
   uzamışlar." Ölçüm (1440): bölüm başlıkları 54 px ve iki satıra
   düşenler var — "Select / your boat." ve "Included / and what's not."
   108 px yer kaplıyordu. Bu sayfada başlıklar ~%20 daha kısıldı ve
   satır aralığı sıkıldı; ana sayfa etkilenmiyor (seçiciler .cp- ve
   sayfa içi bölümlere bağlı). */
.cp-title h1{font-size:clamp(24px,3.4vw,40px);line-height:.96}
.cp-page .sec-title h2,body.cp .sec-title h2{font-size:clamp(22px,3vw,42px)}
.cp-lead-t h2{font-size:clamp(19px,2.3vw,29px);line-height:.98}
.cp-apply h2{font-size:clamp(22px,3vw,40px);line-height:.98}
.cp-day h3{font-size:clamp(16px,1.5vw,19px)}
.fl-hd h3{font-size:clamp(18px,1.9vw,26px)}

/* ═══ 43 · KÜNYE ŞERİDİ — ALT SATIR VE BOY (21 Ağustos 2026) ═══
   Kaan: "timeline güzel ama Göcek ve koordinatlar bir garip;
   boyutunu optimize edelim, bu bölümün kapladığı alan boydan
   biraz kısalsın."

   GARİPLİĞİN SEBEBİ ÖLÇÜLDÜ — punto değil, SIRA. Alt satırın iki
   bloğu birbirinin aynası çıkıyordu: solda değer üstte etiket altta
   (GÖCEK · TR / LOCATION), sağda etiket üstte değer altta
   (COORDINATES / 36.75°N). Üstteki altı hücre ise istisnasız
   değer → etiket → alt etiket sırasında. Sağ blok markup'ta
   çevrildi; artık üç sıra da aynı yönde okunuyor.

   İkinci sebep: değer 21 px'ti, mikro etiket 9.5 px. Şerit bir
   künye — alt satır başlık değil dipnot. 21 → 17 px.

   BOY: hiçbir punto küçültülmeden yalnız boşluklardan alındı
   (rakamlar 42 px'te DURUYOR, Kaan "güzel" dedi).
   Ölçüm 1440 px: 250 → 211 px (−39, %16).
   1024: 203 → 174 · 390: 342 → 302.
   Geri almak için bu bloğu sil — yukarıdaki §41 ve orijinal
   değerler yerinde duruyor. */
.strip2{padding:clamp(22px,2.5vw,34px) 0 clamp(16px,1.8vw,24px)}
.s2-cell .s2-l{margin-top:clamp(8px,.85vw,12px)}
.s2-axis{margin-top:clamp(11px,1.15vw,16px)}
.s2-foot{margin-top:clamp(14px,1.4vw,20px)}
.s2-b{gap:5px}
.s2-v{font-size:clamp(14px,1.35vw,17px)}
@media(max-width:899px){
  /* Eşik şeridin KENDİ eşiği (899) — 3 sütuna indiği yer orası.
     Hücre dolgusu 16 → 13, iki sırada toplam 12 px kazanç. */
  .s2-cell{padding:13px 4px}
  .s2-foot{margin-top:16px;gap:12px}
}

/* ═══ 44 · KÜNYE ŞERİDİ — ALT SATIR IZGARAYA OTURDU (21 Ağustos 2026) ═══
   Kaan: "Göcek TR ve koordinatlar dışarıda kalıyor, tasarımın içine
   getirsene — sağdan ve soldan bir tık dışarda, büyük beyaz alan
   yaratıyor."

   SEBEP ÖLÇÜLDÜ: alt satır flex'ti ve iki ucu sarmalayıcının
   KENARINA yaslanıyordu. Üstteki rakamlar ise 6 sütunlu ızgarada
   ve her biri KENDİ SÜTUNUNUN ORTASINDA duruyor. 1440'ta sütun
   genişliği 206.9 px → ilk rakam "8" x=159'da, alt satır ise
   x=56'da başlıyordu. Yani alt satır rakam bloğunun 100 px kadar
   dışına taşıyor, ortada da geniş bir boşluk kalıyordu.

   Alt satır artık rakamlarla ve eksen çizgisiyle AYNI ızgarada:
   6 sütun, aynı gap, sol blok 1. sütunda, sağ blok 6. sütunda,
   ikisi de sütun ortasına hizalı. Üç sıra (rakam · eksen · künye)
   tek ızgaraya oturdu.

   Ölçüm (1440): "GÖCEK · TR" x 56 → 111 (+55 içeri) ·
   koordinatların sağ kenarı 1384 → 1337 (−47 içeri) ·
   aradaki boşluk 1134 → 1032 px.
   Mobilde (≤719) değişmiyor: orada şerit 3 sütuna iniyor ve alt
   satır zaten alt alta, tam genişlikte bir dipnot. */
/* ⚠️ EŞİKLER ŞERİDİN KENDİ EŞİKLERİ. Şerit ≤899'da 6 sütundan
   3 sütuna iniyor, ≤479'da alt satır alt alta yığılıyor. Alt satır
   ızgarası bu ikisini birebir takip etmeli, yoksa 760 px'te alt
   satır 6 sütuna, rakamlar 3 sütuna göre hizalanıp ikisi ayrışıyor
   (ölçüldü: sol blok x=30, ilk rakamın merkezi x=144). */
@media(min-width:900px){
  .s2-foot{display:grid;grid-template-columns:repeat(6,1fr);
    gap:clamp(8px,1.2vw,20px);align-items:end}
  .s2-b{grid-column:1}
  .s2-b-r{grid-column:6}
}
@media(min-width:480px) and (max-width:899px){
  .s2-foot{display:grid;grid-template-columns:repeat(3,1fr);
    gap:clamp(8px,1.2vw,20px);align-items:end}
  .s2-b{grid-column:1}
  .s2-b-r{grid-column:3}
}
@media(min-width:480px){
  /* Sütun ortasına hizalanıyorlar — üstteki rakamlar da öyle. */
  .s2-b,.s2-b-r{align-items:center;text-align:center}
}
@media(max-width:479px){
  /* Aynı gerekçe telefonda: şerit orada da ortalı (3 sütun, rakamlar
     hücre ortasında), alt satır ise sola yaslıydı — ilk rakamın
     merkezi x=76, künye metni x=20'de başlıyordu. Alt alta yığılı
     düzen korunuyor, yalnız hiza ortaya alındı. Sola geri almak
     için bu bloğu sil. */
  .s2-foot{align-items:center}
  .s2-b,.s2-b-r{align-items:center;text-align:center}
}

/* ═══ 45 · KINETIC TİPOGRAFİSİ (23 Ağustos 2026) ═══
   Kaan/müşteri kararı: tipografi yön board'undaki "A / DIRECTION 01
   — KINETIC" yönü seçildi. Board'un font eşleşmesi:

     Archivo Black Italic → başlıklar (display)
     Inter Regular        → uzun metin (gövde)
     IBM Plex Mono        → mikro etiket, arayüz, veri

   ⚠️ "Archivo Black Italic" diye bir dosya YOK. Archivo Black tek
   yüzlü, italiği yok (fonts.googleapis.com/css2?family=Archivo+Black
   :ital@1 → HTTP 400). Gerçek karşılığı Archivo ailesinin
   900 (Black) italik yüzü; board'daki görüntüyle aynı yere düşüyor.
   Aynı aile, aynı OFL lisansı, bedel yok.

   Dosyalar assets/fonts/ altında yerel, latin + latin-ext birlikte
   subset edildi (fonttools). Türkçe ı İ ş Ş ğ Ğ ç Ç ö Ö ü Ü â Â
   dördünde de tam — kontrol edildi, eksik glif yok.
     archivo-900-italic.woff2  21,8 KB · 481 glif
     inter-400.woff2           59,0 KB · 1003 glif
     plexmono-400.woff2        21,9 KB · 422 glif
     plexmono-500.woff2        22,4 KB · 422 glif

   ESKİSİ: Syne 700/800 (display) + Archivo 400/500 (metin) +
   Inter 500/600 (arayüz). Syne ve Archivo 400/500 dosyaları
   fonts/ altında DURUYOR ama artık çağrılmıyor — geri dönmek
   gerekirse bu bloğu silmek yetiyor, §38–§44 yerinde.

   ⚠️ İTALİK NASIL ÇALIŞIYOR: dosyanın kendisi italik. Aşağıda
   aynı dosya hem font-style:normal hem italic olarak tanımlı.
   Böylece --display kullanan HER öğe, CSS'inde font-style yazsa
   da yazmasa da gerçek italik yüzü alıyor ve tarayıcı hiçbir
   yerde sahte eğme (synthetic oblique) yapmıyor.
   Ağırlık aralığı 100–900 verildi: §40'ta 700/800 isteyen
   kurallar da bu tek yüze düşüyor, sahte kalınlaştırma yok.   */
@font-face{font-family:"ArchivoBlkIt WB";src:url(fonts/archivo-900-italic.woff2) format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"ArchivoBlkIt WB";src:url(fonts/archivo-900-italic.woff2) format('woff2');font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"Inter WB";src:url(fonts/inter-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono WB";src:url(fonts/plexmono-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:"Plex Mono WB";src:url(fonts/plexmono-500.woff2) format('woff2');font-weight:500;font-display:swap}

:root{
  --display:"ArchivoBlkIt WB","Arial Black",Impact,sans-serif;
  --body:"Inter WB","Helvetica Neue",Arial,sans-serif;    /* taban + gövde */
  --text:"Inter WB","Helvetica Neue",Arial,sans-serif;    /* uzun metin    */
  --data:"Plex Mono WB",ui-monospace,"SF Mono",Menlo,monospace;
  --w-body:400;
  --w-ui:500;
}

/* Uzun metin Inter Regular'a iniyor (board: "Inter Regular").
   §38 bu seçicileri Archivo'ya vermişti; aile değişti, liste aynı. */
p,.lede,.tp-bio,.cp-intro,.cp-lead-t p,.tbar-lede,.rt-desc,.s2-b .s2-v + *,
.cp-list li,.dsc-card p{font-family:var(--text);font-weight:400}

/* ── Mikro tipografi ve veri → IBM Plex Mono ──────────────────
   Board'da versal-küçük-puntolu ne varsa mono: bölüm etiketleri
   (ABOUT / EXPERIENCE / ROUTE / EVENTS), menü ve düğmeler,
   koordinatlar, mesafe-rakım verileri, tablo başlıkları.
   Başlıklar ve büyük tarihler mono DEĞİL — onlar display italik. */
.eyebrow,.scrollcue,.hero-tag,.arrow,.backlink,.f-bot,
.navlink,.menu-col a,.menu-btn,.cta,.hdr-r .lang-b,.hdr-nav a,
.s2-n,.s2-v,.s2-l,.s2-s,
.cd-n,.cd-l,.cd-s,
.chip,.cp-tbl th,.cp-tbl td,
.cp-num .v,.cp-num .l,.cp-br .v,.cp-br .l,
.rtb-hd span,.rtb .d,.rp-hd .c,.rp-list .lv,
.tp-spec dt,.tp-spec dd{font-family:var(--data)}

/* Mono, Inter'den ~%15 geniş yazar. Versal + geniş harf arası
   üstüne binince satırlar taşıyordu; harf araları buna göre
   kısıldı. Puntolar aşağıda §46'da ölçümle ayarlanıyor. */
.eyebrow{letter-spacing:.12em}
.navlink,.menu-col a,.menu-btn,.cta,.hdr-r .lang-b,.hdr-nav a{letter-spacing:.08em}
.s2-l,.s2-s{letter-spacing:.12em}
.scrollcue,.hero-tag,.arrow,.backlink{letter-spacing:.12em}
.chip,.cp-tbl th,.cp-num .l,.cp-br .l,.rtb-hd span,.rp-hd .c,
.rp-list .lv{letter-spacing:.08em}

/* ═══ 46 · BAŞLIK PUNTOLARI %10 GERİ AÇILDI (23 Ağustos 2026) ═══
   §39 ve §42'deki kısma SYNE'YE ÖZGÜYDÜ: o blokların kendi yorumu
   "Syne, Archivo Black'ten hem geniş hem optik olarak daha iri"
   diyor. Display Archivo Black italiğe döndüğü için o telafi
   fazla kaldı — ölçüldü:

     .h2 @1440 : 568,8 px genişlik / 118,4 px boy (iki satır)
              → 448,2 px / 78,9 px (tek satır)   = %21 dar
     .h2 @390  : 70,5 → 47,0 px boy
     Header "Book" düğmesi 86 → 77 px, "Menu" 48 → 37 px (390)

   Bu yüzden puntolar %10 geri açıldı — %21'lik daralmanın yarısı.
   Optik boy Kaan'ın 20 Ağustos'ta onayladığı yere geliyor, ama
   ölçülen genişlik hâlâ eskisinin altında, yani taşma riski yok.
   Oranlar korundu (bölüm başlığı > sayfa başlığı > h2 > kart adı).

   Daha büyük isterse: aşağıdaki değerleri 1,10 yerine 1,20 ile
   çarp. Eski hâline dönmek için bu bloğu sil.                  */
.sec-title h2{font-size:clamp(29px,4.3vw,59px)}
.cp-title h1{font-size:clamp(30px,4.6vw,54px)}
.cp-apply h2{font-size:clamp(27px,4.2vw,57px)}
.h2{font-size:clamp(24px,3.4vw,41px)}
.prod-ph .st{font-size:clamp(19px,2.2vw,30px)}
.prod-meta .name{font-size:clamp(16px,1.65vw,24px)}
.tp-name{font-size:clamp(26px,2.75vw,41px)}
.wb-row .n{font-size:clamp(16px,1.75vw,25px)}
.fl-hd h3{font-size:clamp(22px,2.4vw,34px)}
.cp-lead-t h2{font-size:clamp(21px,2.5vw,32px)}
#team .h2{font-size:clamp(27px,3.85vw,46px)}
.wi-head h2{font-size:clamp(26px,3.6vw,44px)}
/* Kamp sayfası §42'de bir tur daha kısılmıştı; aynı oranda açıldı. */
.cp-page .cp-title h1,body.cp .cp-title h1{font-size:clamp(26px,3.7vw,44px)}
.cp-page .sec-title h2,body.cp .sec-title h2{font-size:clamp(24px,3.3vw,46px)}
.cp-page .cp-apply h2,body.cp .cp-apply h2{font-size:clamp(24px,3.3vw,44px)}
.cp-day h3{font-size:clamp(17px,1.65vw,21px)}
.cp-page .fl-hd h3,body.cp .fl-hd h3{font-size:clamp(20px,2.1vw,29px)}

/* Archivo Black italik: eğim yüzünden son harfin sağ ucu
   kutunun dışına taşabiliyor. Başlık kutularına 1 px'lik
   sağ pay verildi — yerleşimi kaydırmıyor, kırpmayı önlüyor. */
.h1,.h2,.h3,.sec-title h2,.cp-title h1,.cp-apply h2,.cp-lead-t h2{padding-right:1px}

/* ═══ 47 · KALAN VERİ HÜCRELERİ DE MONO'YA GEÇTİ (23 Ağustos 2026) ═══
   §45'te gözden kaçan hücreler. Board'da EVENTS kartındaki
   "26 SEP – 03 OCT 2026 / GÖCEK · TR / 8 PEOPLE MAX" bloğunun
   tamamı mono; bizde takvim satırının tarihi ve yeri hâlâ
   Inter'de kalmıştı, aynı satırdaki sıra numarası ve Book
   düğmesi mono olduğu için satır kendi içinde ikiye ayrılıyordu.

   Eklenenler: takvim satırının tarih + yer hücresi, Book düğmesi,
   sıra numarası · kart üstündeki disiplin etiketi ve alt satırı
   (konum · kontenjan) · .mono yardımcı sınıfı.                */
.wb-row .i,.wb-row .dt,.wb-row .pl,.wb-book,
.prod-meta .brand,.prod-meta .side,
.mono{font-family:var(--data)}
.wb-row .dt,.wb-row .pl{letter-spacing:0}
.wb-row .i,.wb-book,.prod-meta .brand{letter-spacing:.08em}

/* ═══ 48 · "WHAT WINDBASE IS" BANDI — DEKUPE GÖRSEL (23 Ağustos 2026) ═══
   Kaan gökyüzünü silip denizi dekupe etti (whatis-band copy.png,
   2200×936 RGBA — eski whatis-band.jpg ile birebir aynı kadraj,
   üstü şeffaf). Artık bandın üst kısmında fotoğraf yok: dalga
   tepesinin üstünde sayfanın kendi krem zemini görünüyor.

   Alfa profili ölçüldü: y 0–100 tam şeffaf · y 100–550 yumuşak
   geçiş · y 550–936 tam opak deniz. Yani kesim sert değil,
   yarım bandı kaplayan bir geçiş — metin bölgeleri buna göre
   yeniden ölçüldü (aşağıda).

   ⚠️ FORMAT: dosya WEBP, PNG değil. Alfa korunuyor ama
   2,1 MB → 146 KB. Bandın kendisi zaten yumuşak degrade,
   q82'de bant görünmüyor.
   ⚠️ AD DEĞİŞTİ (whatis-band.jpg → whatis-band-v2.webp).
   _headers /assets/img/* için bir yıl immutable veriyor;
   içerik değişince ad da değişmek zorunda (§0, 21 Ağu hatası).

   ⚠️ MOBİL DEĞİŞMEDİ. ≤719 px hâlâ whatis-band-m.jpg kullanıyor:
   o kare aynı fotoğrafın KOYU SU bölgesinden alınmış opak bir
   kırpma ve telefonda metnin tamamı beyaz. Dekupe sürümü orada
   çalışmaz — şeffaf üst bölge krem olur, beyaz metin kaybolur.

   Zemin artık görselin değil sayfanın işi: .wi'ye krem zemin
   AÇIKÇA veriliyor. Gövde zaten krem ama band bir gün koyu bir
   bölümün yanına taşınırsa şeffaf yerler kararır ve soldaki
   lacivert başlık yok olur.                                     */
.wi{background:var(--cream)}

/* ── 48b · BANDIN BOYU GÖRSELİN ORANINA OTURDU ──────────────────
   Dekupe görsel eski yükseklikte ÖLÇÜMDEN KALDI. Sebep:
   bant 1440'ta 461 px, görsel ise aynı genişlikte 613 px —
   yani alttan 152 px kırpılıyordu ve kırpılan yer görselin
   TAM OPAK derin su kısmıydı. Sağdaki beyaz paragraf da tam o
   yarı saydam geçiş bölgesine düşüyordu:

     beyaz paragraf, eski boy : 1440'ta 3.39 · 1024'te 4.04  ✗
     (eşik 4,5 — normal metin)

   object-position ile aşağı kaydırmak denendi ve OLMADI: beyaz
   6,17'ye çıkıyor ama dalga tepesi başlığın içine giriyor ve
   soldaki lacivert başlık 16,63 → 1,25'e düşüyor. Ortalamak da
   ikisini birden düşürüyor (h2 1,44). Tek doğru çözüm bandın
   boyunu görselin oranına (2,35:1) oturtmak: o zaman görsel
   dikeyde hiç kırpılmıyor, üstte şeffaf gökyüzü + altta tam
   opak deniz ikisi de kadrajda kalıyor.

   1440 → 612 px · 1024 → 435 · 900 → 382. Bant eskisine göre
   ~%33 uzuyor; dekupenin işe yaraması bunu gerektiriyor.
   Boy kısa kalsın istersen bu satırı sil — ama o zaman sağdaki
   beyaz paragraf eşiğin altında kalır, rengi değişmeli.      */
.wi{min-height:clamp(340px,42.5vw,640px)}

/* ═══ 49 · KÜNYE ŞERİDİ — İKİNCİ TUR SIKILAŞTIRMA (23 Ağustos 2026) ═══
   Kaan: "timeline boyu kısalsın, çok beyaz alan var, orayı biraz
   toparlayalım ve en alttaki çizgiyi kaldıralım."

   §43'te bir tur alınmıştı (250 → 211). Kalan boyun nereye
   gittiği ölçüldü (1440, toplam 211 px):

     üst dolgu            34        rakam                39 (42px, lh .92)
     rakam→etiket boşluğu 12        etiket + alt etiket  28
     eksen çizgisi öncesi 16        çizgi                 1
     alt satır öncesi     20        alt satır            36
     alt dolgu            24        alt çerçeve           1

   Yani 211 px'in **106'sı boşluk ve dolgu**, 104'ü metin.
   Rakamlara DOKUNULMADI — 42 px'te duruyor (§43'te "güzel"
   denmişti). Sadece boşluklar kısıldı ve alt çerçeve kalktı.

   1440: 211 → 168 px (−43, %20)   ·   1024: 171 → 137
   390 : 304 → 250                 ·   Endurance şeridi aynı
   sınıfı paylaştığı için o da orantılı kısalıyor.

   ⚠️ ALT ÇERÇEVE KALKTI. .strip2'nin border-bottom'ı vardı
   (1px rgba(3,9,16,.15)) ve altındaki "What Windbase is"
   bandından ayırıyordu. Band artık dekupe — üstü sayfanın kendi
   kremi olduğu için çizgi zaten iki krem alanı bölüyordu,
   gereksizdi. ORTADAKİ ince eksen çizgisi (.s2-axis) DURUYOR;
   o şeridin kendi ayracı.

   ⚠️ Eşikler şeridin KENDİ eşikleri: 899 (3 sütuna iner) ve
   479 (alt satır alt alta). Başka eşik yazma.
   Geri almak için bu bloğu sil — §41/§43 yerinde duruyor.    */
.strip2{padding:clamp(16px,1.6vw,22px) 0 clamp(11px,1.05vw,14px);
  border-bottom:0}
.s2-cell .s2-l{margin-top:clamp(5px,.5vw,7px)}
.s2-axis{margin-top:clamp(7px,.7vw,10px)}
.s2-foot{margin-top:clamp(9px,.85vw,12px)}
.s2-b{gap:4px}
@media(max-width:899px){
  /* §43'teki 899 bloğunun değerleri de aynı oranda kısıldı. */
  .s2-cell{padding:9px 4px}
  .s2-foot{margin-top:11px;gap:12px}
}

/* ── 48c · SAĞDAKİ PERDE KALKTI (23 Ağustos 2026) ──────────────
   Kaan: "sağ üstte siyah gradient çizgi var, olmasın."

   Sebep bulundu: .wi::after — soldan sağa rgba(3,9,16,0) → .12
   giden perde. §14'te beyaz paragraflara güvenlik payı olsun
   diye konmuştu ve o zaman GÖRÜNMÜYORDU, çünkü fotoğraf bandın
   tamamını opak kaplıyordu; perde koyu suyun üstüne biniyordu.

   Dekupeden sonra bandın sağ ÜST köşesi artık fotoğraf değil,
   sayfanın kremi. Perde orada kremi karartıyor:
     E7ECEE üstüne %12 siyah → CCD1D3  = gözle seçilen gri bir bant.

   Perde tamamen kaldırıldı. Ölçüldü, gerek de kalmamıştı —
   bant §48b'de görselin oranına oturunca beyaz paragraf zaten
   tam opak derin suya düşüyor:

     beyaz paragraf, perdesiz : 1440 → 5.52 · 1024 → 5.61
                                900 → 5.37 · 760 → 5.30
     (eşik 4,5 · perdeliyken 5,92–6,24 idi, yani pay gitti,
      eşik geçilmeye devam ediyor)

   ⚠️ Görsel bir gün opak bir kareyle değiştirilirse bu ölçüm
   yeniden yapılmalı; perdesiz eski fotoğrafta beyaz metin
   1,97'ye kadar düşüyordu (§14).                            */
.wi::after{background:none}

/* ═══ 50 · BANT BAŞLIĞI BÜYÜDÜ (23 Ağustos 2026) ═══
   Kaan: "'Not a holiday. / A training block at sea.' kısmında
   daha büyük ve iddialı başlık olsun." (yalnız masaüstü)

   Başlığı büyütmenin önündeki engel punto değil, KUTUYDU:
   .wi-head'in max-width'i 560 px'e sabitlenmişti, oysa ızgaranın
   sol sütunu 1440'ta 623,7 px. Yani 64 px'lik boş sütun payı
   kullanılmadan duruyordu. Kapak kaldırıldı, başlık sütunun
   tamamını kullanıyor.

   Punto tavanı ölçümle seçildi. Gerçek Archivo Black italik
   genişlikleri (100 px'te, ls dahil):
     "NOT A HOLIDAY."           847
     "A TRAINING BLOCK AT SEA." 1437   ("A TRAINING" 627 +
                                        "BLOCK AT SEA." 793)
   Üç satırda kalmanın şartı en uzun satırın sütuna sığması:
   847 × (F/100) ≤ sütun. 1440'ta sütun 623,7 → F ≤ 73,6 px.
   4,85vw / tavan 70 px seçildi: 1440'ta 69,8 px, en uzun satır
   591 px — %5 pay var. Tavanı 74'e dayarsan bir sonraki
   kırılmada başlık DÖRT satıra düşer ve bant taşar.

   Satır arası 1 → .90, harf arası -.02 → -.03em: "iddialı"
   olan kısım büyük ölçüde bu ikisi.

   1440: 44 → 70 px (%59 büyüdü) · 1200: 43 → 58 · 1024: 37 → 50
   Üç satır her genişlikte korunuyor.

   ⚠️ MOBİL DEĞİŞMEDİ — ≤719 px'te başlık 26 px'te kalıyor
   (kendi medya sorgusu, style.css:521). Kaan "desktop" dedi.

   ⚠️ Başlık büyüyünce dalganın içine daha çok giriyor;
   kontrast yeniden ölçüldü, aşağıda.                          */
@media(min-width:720px){
  .wi-head{max-width:100%}
  .wi-head h2{font-size:clamp(27px,4.3vw,62px);line-height:.90;
    letter-spacing:-.03em}
}

/* ── 50b · TAVAN 70 DEĞİL 62 (23 Ağustos 2026, aynı gün düzeltme)
   70 px'i yazdıktan sonra kontrastı GERÇEK RENDER PİKSELLERİNDEN
   ölçtüm (metni gizleyip bandı fotoğraflayıp metin satırlarının
   altındaki zemini örnekleyerek) ve başlığın soluk ikinci satırı
   dalganın içine giriyordu. Punto taraması (1440 eşdeğeri):

     punto   1440   1280   1024    900
      44     3.38   3.38   3.38   3.38   ✓
      58     3.38   3.38   3.38   3.38   ✓
      62     3.38   3.38   3.38   3.38   ✓  ← tavan
      66     3.38   3.38   3.08   2.28   ✗
      70     3.01   2.22   1.68   1.39   ✗

   62 px'e kadar başlık tamamen krem bölgede kalıyor ve kontrast
   hiç değişmiyor. 66'dan itibaren soluk satır dalgaya giriyor.
   Tavan 62 (4,3vw) — mevcut 44'e göre yine %41 büyük, üç satır
   her genişlikte korunuyor.

   ⚠️ Bu bandın gerçek sınırı bu. Daha büyük başlık istenirse
   punto değil DÜZEN değişmeli (başlık dalganın üstünde kalacak
   şekilde bandın kendisi yeniden kurulmalı) — ayrı bir iş.   */

/* ═══ 51 · MOBİL REVİZYON TURU (25 Ağustos 2026) ═══
   Kaan telefonda gezip madde madde verdi. HEPSİ MOBİL — masaüstünde
   hiçbir kural değişmiyor. Eşikler bölümlerin KENDİ eşikleri:
   künye şeridi 899/479 · bant 719 · timer 899 · ekip 899.

   Ölçümler gerçek Chrome'da, 390 px viewport, gerçek fontlarla
   alındı. (Kaan bir mobil simülatör eklentisi kurdu; eklenti sayfayı
   AYNI ORIGIN'de bir iframe'de açıyor, yani iframe'in içine girip
   ölçülebiliyor. macOS Chrome penceresi 500 px'in altına inmediği
   için resize_window bu işi görmüyordu.)

   ── ÖLÇÜLEN BOY DEĞİŞİMİ (390 px) ──────────────────────
     künye şeridi              262.7 → 200.4 px   (−62,  %24)
     "What Windbase is" bandı  356.5 → 286.3 px   (−70,  %20)
     timer + bülten            523.2 → 407.5 px   (−116, %22)
     ekip (Buse açık)           1584 → 1347 px
   Geri almak için bu bloğun tamamını sil — §41/§43/§44/§48/§49/§50
   yerinde duruyor.                                              */

/* ── 51a · KÜNYE ŞERİDİ: ALT SATIR YAN YANA (≤479) ──────────────
   Kaan: "Göcek TR ve koordinatlar üst üste duruyor. Bunlar yan yana
   dursun, üstteki rakamlar gibi."

   ≤479'da alt satır flex sütundu (style.css:1961) ve iki blok alt
   alta yığılıyordu. Artık ikisi de ızgarada, rakamlar gibi hücre
   ortasında.

   ⚠️ NEDEN 3 DEĞİL 2 SÜTUN: rakamlar ≤899'da 3 sütuna iniyor,
   390 px'te sütun 111.3 px. Koordinat değeri ("36.75°N · 28.94°E",
   mono 14 px) ÖLÇÜLDÜ: 140.4 px — 3 sütuna sığmıyor, ikinci satıra
   kırılırdı. 2 sütunda hücre 170 px, tek satır, 30 px pay kalıyor.
   Koordinatın punto veya metni büyürse burayı yeniden ölç.
   Kazanç: alt satır 76.5 → 32.3 px.                              */
@media(max-width:479px){
  .s2-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;
    align-items:start}
  .s2-b{grid-column:1}
  .s2-b-r{grid-column:2}
  .s2-b,.s2-b-r{align-items:center;text-align:center}
}

/* ── 51b · KÜNYE ŞERİDİ: MOBİLDE BOY (≤899) ─────────────────────
   Kaan: "bu timeline bölümü mobilde boydan kısalsın, çok yer
   kaplıyor."

   §43 ve §49'daki yöntemin aynısı: RAKAMLARA DOKUNULMUYOR (390'da
   24 px'te duruyorlar, Kaan iki kez "güzel" dedi), yalnız boşluklar
   kısılıyor.
     üst/alt dolgu   16/11 → 12/10
     hücre dolgusu   9px 4px → 6px 4px   (iki sıra, −12 px)
     alt satır önü      11 → 10
   51a ile birlikte 262.7 → 200.4 px.

   ⚠️ Endurance sayfasının şeridi (.strip2-in / .s2-7) aynı sınıfları
   paylaşıyor, o da orantılı kısalıyor — §49'da da böyle olmuştu. */
@media(max-width:899px){
  .strip2{padding:12px 0 10px}
  .s2-cell{padding:6px 4px}
  .s2-foot{margin-top:10px}
}

/* ── 51c · "WHAT WINDBASE IS" BANDI: MOBİLDE PUNTO (≤719) ───────
   Kaan: "bir altında what is windbase bölümündeki yazıların
   kapladığı alan biraz azalsın, yani yazılar biraz küçülsün."

     başlık    26 → 22 px, satır arası 1.0 → .94
     gövde   13.5 → 12.5 px, satır arası 1.6 → 1.55
     iç dolgu  34 → 26 px

   ⚠️ BAŞLIK ÜÇ SATIRDAN İKİYE İNDİ. 26 px'te "A training block at
   sea." kendi içinde kırılıyordu (başlık 78 px); 22 px'te tek satıra
   sığıyor → 41.3 px. Punto burada satır sayısını değiştirdiği için
   kazanç puntonun kendisinden büyük.

   ⚠️ ASIL BOYU MIN-HEIGHT BELİRLİYORDU, PUNTO DEĞİL. §48b'deki
   .wi{min-height:clamp(340px,42.5vw,640px)} 390 px'te tabana (340)
   oturuyor; punto küçülünce içerik 286'ya indi ama bölüm 340'ta
   kaldı, yani ilk denemede yalnız 16 px kazanılmıştı. Mobil taban
   280'e çekildi — artık boyu içerik belirliyor (286.3).
   MASAÜSTÜ TAVANI DEĞİŞMEDİ: kural @media(max-width:719px) içinde,
   görselin 2.35:1 oranına oturtulmuş 612 px yerinde duruyor.

   KONTRAST YENİDEN ÖLÇÜLDÜ (§16'daki yöntem: gerçek render
   pikselleri, blok kutusu değil HER METİN SATIRI ayrı):
     "Not a holiday."            beyaz  10.34  ✓
     "A training block at sea."  altın   4.17  ✓  (büyük metin 3.0)
     gövde paragrafları          10.78 / 12.13  ✓
   Öncesi: başlık 11.21 · paragraflar 10.93 / 12.52. Pay bol.     */
@media(max-width:719px){
  .wi{min-height:280px}
  .wi-in{padding:26px 20px}
  .wi-head h2{font-size:22px;line-height:.94;margin-top:9px}
  .wi-body p{font-size:12.5px;line-height:1.55}
}

/* ── 51d · TIMER + BÜLTEN: ORTALANDI VE KISALDI (≤899) ──────────
   Kaan: "geri sayım sayacı ve newsletter, background'a göre yazılar
   çok dağınık gözüküyor. Timer'ı yukarıya ortaya alalım — siteye
   geldiğinde sola yapışmış gözüküyor. E-mail yazılan bölümü de
   biraz küçültelim, daha az alan kaplasın."

   Dağınıklığın sebebi: iki blok da x=20'de sola yaslıydı, arkadaki
   fotoğraf ise ortada yoğunlaşıyor. Mobilde ikisi de ortalandı.
   Yalnız rıza cümlesi sola dayalı kaldı (iki satırlık hukuk metni
   ortalanınca daha dağınık duruyor).

   ⚠️ FORM TEK SIRAYA ALINDI VE MIN-WIDTH TUZAĞINA DÜŞTÜ:
   .tbar-in bir grid; grid öğesinin varsayılan min-width'i "auto"
   olduğu için input+buton sütunu 379.5 px'e şişti ve .tbar'ın
   overflow:hidden'ı SESSİZCE KIRPTI. Belge genişliği 390'da kaldığı
   için yatay taşma taraması bunu YAKALAMAZ — ölçüm elemanın kendi
   kutusundan yapılmalı. Çözüm: .tbar-l/.tbar-r/.nl-row'a
   min-width:0, input'a flex:1 1 0.
   Ölçüm: input 187.5 + gap 10 + buton 152.5 = 350, tam sığıyor.

     iç dolgu       38 → 26 px      form satırı  107.4 → 50.4 px
     bloklar arası  28 → 22 px      rıza satırı     36 → 34.5 px
     lede         14.5 → 13.5 px    input/buton boyu 50.4 (≥44 ✓)
   523.2 → 407.5 px.

   KONTRAST YENİDEN ÖLÇÜLDÜ: 13 metin öğesinin en kötüsü 5.60 ✓  */
@media(max-width:899px){
  .tbar-in{padding:26px var(--pad);gap:22px}
  .tbar-l,.tbar-r{min-width:0;text-align:center}
  .cdown{justify-content:center;margin-top:12px}
  .cd-when{margin-top:12px}
  .tbar-lede{margin-top:10px;font-size:13.5px;max-width:34ch;
    margin-left:auto;margin-right:auto}
  .nl{margin-top:14px}
  .nl-row{flex-wrap:nowrap;align-items:stretch;justify-content:center;
    min-width:0}
  .nl input[type=email]{flex:1 1 0;min-width:0;padding:13px 16px}
  .nl-btn{padding:13px 16px;white-space:nowrap}
  .nl-consent{margin-top:10px;font-size:11.5px;text-align:left}
}

/* ── 51e · EKİP: MOBİLDE AKORDEON (≤899) ────────────────────────
   Kaan: "takım sayfasında isimlere basınca kart ismin altında
   açılsın. Buse'ye bastığımızda Buse'nin altında, Sina'ya
   bastığımızda Sina'nın altında."

   MASAÜSTÜ AYNI: solda liste, sağda panel. Değişen yalnız ≤899.
   Panel taşıma işini index.html'in sonundaki kısa betik yapıyor
   (.tstage aktif ismin <li>'sinin içine giriyor). Sadece CSS ile
   olmuyor: paneller listeden ayrı bir kapsayıcıda duruyor ve DOM
   sırası değişmeden isim–panel komşuluğu kurulamıyor.

   ⚠️ .tpanel ≤899'da display:grid (style.css:860) ve paneller
   grid-area:1/1 ile ÜST ÜSTE duruyor — sahne yüksekliği EN UZUN
   panele sabit. Akordeonda bu, kısa panellerin altında kocaman boş
   alan demek. Bu yüzden mobilde sahne akışa alındı ve pasif paneller
   display:none. Sonuç: bölüm boyu artık AKTİF panele göre —
   Buse açıkken 1584 → 1347 px.

   ⚠️ Panelin kendi .tp-name başlığı mobilde gizlendi: panel ismin
   hemen altında açıldığı için aynı isim iki kez yazıyordu.        */
/* ⚠️ 25 AĞUSTOS, AYNI GÜN: MEDYA SORGUSU KALDIRILDI.
   Kaan akordeonu mobilde görüp "masaüstüne de taşıyalım" dedi.
   Kurallar artık HER GENİŞLİKTE geçerli; ayrıntı ve masaüstü
   ızgarasının tek sütuna inmesi §53'te.                          */
.tstage{display:block}
.tpanel{grid-area:auto;opacity:1;visibility:visible;transform:none;
  transition:none}
.tpanel:not(.is-on){display:none}
.tlist li .tstage{border-top:1px solid var(--line-l);margin-top:14px;
  padding-top:18px;padding-bottom:6px}
.tlist .tstage .tp-name{display:none}
.tlist .tstage .tp-spec{margin-top:0}

/* ═══ 52 · BOOKING MODAL — MOBİLDE TEK EKRAN (25 Ağustos 2026) ═══
   Kaan: "mobilde Book'a bastığımızda açılan sayfa ekranın tam sayfası
   olsun, aşağı kaydırma olmasın. Bu herkesin sayfayı aşağı kaydırıp
   keşfedebileceği bir yer olmayabilir."

   BAŞLANGIÇ ÖLÇÜMÜ (390 px genişlik): panelin içeriği 877 px,
   görünen alan 657 → **220 px taşıyordu.** Gönder düğmesi ve iletişim
   satırı ilk ekranda hiç görünmüyordu.

   ⚠️ ≥720 px HİÇBİR ŞEY DEĞİŞMİYOR. Bütün blok ≤719 içinde.

   ── YÜKSEKLİK BİRİMİ: svh, vh DEĞİL ────────────────────────────
   `100vh` iOS'ta adres çubuğu KAPALIYKENki boyu verir; çubuk açıkken
   panelin altı ekranın dışında kalır ve gönder düğmesi görünmez —
   yani tam çözmek istediğimiz sorun. `100svh` en küçük viewport'tur,
   çubuk açıkken de tamamı görünür. `dvh` de yanlış olurdu: kaydırmayla
   değiştiği için panel boyu oynardı. Eski tarayıcı için önce vh
   yazılıp svh ile eziliyor.

   ── NEREDEN KISILDI ────────────────────────────────────────────
     ad + e-posta yan yana                        −79 px
     panel dolgusu 20 → 16, başlık 25 → 22 px     −25
     alan araları 14 → 10 (altı alan)             −24
     input/select dolgusu (yalnız kısa ekranda, §52b)  −16
     açıklama 13 → 12 px                          −12
     "Anything else" kutusu 3 → 2 satır           −30
     gönder düğmesi dolgusu 19 → 13 px            −12
     modal logosu mobilde gizlendi                −37
     iletişim satırı 13 → 12 px, üst boşluk 14 → 8 −23

   ⚠️ AD VE E-POSTA ARTIK YAN YANA — bu §29'daki kararın TERSİ.
   Orada "e-posta adresi 162 px'lik alanda okunmuyor" denip tek sütunda
   bırakılmıştı. O karar KAYDIRMA SERBESTKEN verildi; tek ekran şartı
   gelince 79 px'i başka yerden bulmak mümkün değil (bütün diğer
   kısıntıların toplamı bile taşmayı kapatmıyor — ölçüldü). Panel
   dolgusu 16'ya inince sütun 162 değil **172 px**. Geri istenirse
   `#bookForm .two:first-of-type` kuralını sil — o zaman tek ekran
   şartı düşer, bunu bilerek yap.

   ⚠️ INPUT PUNTOSU 16 px'TE BIRAKILDI, KÜÇÜLTÜLMEDİ. iOS Safari
   16 px'in altındaki bir alana odaklanınca sayfayı ZORLA yakınlaştırır
   ve düzen bozulur. Kısıntı yalnız dolgudan alındı.

   ⚠️ MODAL LOGOSU MOBİLDE GİZLENDİ (skill §11: modal logonun dört
   kullanım yerinden biri). Dekoratif olan tek öğe oydu; masaüstünde
   duruyor. Geri istenirse `.mdl-wm{display:none}` satırını sil ve
   37 px'i başka yerden bul.

   ⚠️ `overflow-y:auto` BİLEREK DURUYOR. İçerik sığdığı için kaydırma
   çubuğu çıkmıyor; ama çok kısa bir ekranda, tarayıcı yazı boyutu
   büyütülmüşse ya da klavye açılınca hiçbir şey KIRPILMIYOR.
   `overflow:hidden` yazmak "kaydırma yok"u garanti ederdi ama gönder
   düğmesini erişilemez yapabilirdi.                                */
@media(max-width:719px){
  .mdl-panel{padding:16px;height:100vh;height:100svh;max-height:100svh}
  .mdl-h{margin:6px 0 6px;font-size:22px;max-width:20ch}
  .mdl-note{margin-bottom:12px;font-size:12px;line-height:1.45}
  .field{margin-bottom:10px}
  .field label{margin-bottom:3px;font-size:9.5px}
  /* ⚠️ ALAN DOLGUSU (9px) BURADA KISILMADI. Uzun telefonlarda 70–158 px
     pay ölçüldü; alanları inceltmeye gerek yok ve 41 px'lik bir alan
     45'ten daha zor vuruluyor. Kısıntı yalnız §52b'ye, kısa ekranlara
     taşındı. */
  .field textarea{min-height:44px;height:44px;padding:7px 0}
  /* İkisi de yan yana: ad|e-posta ve telefon|grup. §29'da yalnız
     ikincisi yan yanaydı. */
  #bookForm .two{grid-template-columns:1fr 1fr;gap:0 14px}
  #bookForm .submit{padding:13px}
  .mdl-panel .mdl-wm{display:none}
  .mdl-panel .mdl-contact{margin-top:8px;font-size:12px}
}

/* ── 52b · KISA EKRANLAR (25 Ağustos 2026, aynı gün) ────────────
   §52 ile 390–430 px'lik telefonlarda taşma sıfırlandı, ama DAR VE
   KISA olanlarda kalıyordu (Playwright ölçümü, gerçek fareyle Book'a
   basılarak):

     430×745  taşma 0        375×553 (SE)  taşma 52
     393×659  taşma 0        360×568       taşma 37
     390×657  taşma 0

   Kalanı puntodan kısarak kapatmak bütün telefonlarda metni
   küçültürdü. Onun yerine BOY tabanlı ikinci bir eşik: yalnız
   viewport 620 px'ten kısaysa açıklama cümlesi düşüyor ve başlık bir
   tık iniyor. Uzun telefonlarda hiçbir şey değişmiyor.

   Sonuç — hepsinde taşma 0, gönder düğmesi ve iletişim satırı
   görünür, alan puntosu 16 px'te (iOS zoom yok):
     430×745 ✓ · 393×659 ✓ · 390×657 ✓ · 375×553 ✓ · 360×568 ✓

   ⚠️ AÇIKLAMA CÜMLESİ KISA EKRANDA GİZLENİYOR ("We come back within
   a day. No payment at this stage…"). Güven veren cümle o; kısa
   ekranda alternatifi kaydırmaktı. Metni kısaltmak isterseniz bu
   kural kalkabilir — cümle iki satıra inerse ~25 px yeter.

   ⚠️ SINIRI OLAN İKİ DURUM, ikisi de bilerek bırakıldı:
   • 320×460 gibi çok eski/küçük cihazlarda hâlâ taşıyor (taşma 79).
     Bugünkü hiçbir telefonun dik viewport'u bu kadar kısa değil.
   • TELEFON YATAYKEN genişlik 720'yi geçtiği için bu kuralların
     hiçbiri çalışmaz, modal eskisi gibi kaydırılır. Yataya ayrı
     tasarım istenirse ayrı iş.                                    */
@media(max-width:719px) and (max-height:620px){
  .mdl-panel{padding:14px}
  .field input,.field select{padding:7px 0}
  .mdl-note{display:none}
  .mdl-h{font-size:20px;margin:4px 0 6px}
  .field{margin-bottom:8px}
}

/* ═══ 53 · EKİP AKORDEONU MASAÜSTÜNE DE GELDİ + AÇ/KAPA (25 Ağu 2026) ═══
   Kaan: "takım sayfasında kişinin üstüne basınca bilgilerin ve
   fotoğrafların onun altında açılmasını, yani mobildeki görüntüyü
   masaüstüne de taşıyalım. Bir de açık olan isme tekrar basınca
   kapansın — açıp kapatabileceğimiz bir yapı."

   İKİ DEĞİŞİKLİK:
   1) §51e'nin `@media(max-width:899px)` sargısı kaldırıldı (yukarıda),
      `.team-grid` de her genişlikte tek sütuna indi. Sağdaki 55'lik
      panel sütunu artık yok; liste tam genişlikte, panel tıklanan
      ismin <li>'sinin içinde açılıyor. Bu düzen sayfadaki takvim
      listesiyle aynı dili konuşuyor (tam genişlik satırlar).
   2) Aç/kapa index.html'in sonundaki betikte.

   ⚠️ MASAÜSTÜNDE PANEL IZGARASI DEĞİŞTİ. `.tpanel` ≥900'de üç sütun
   (`clamp(58px,7vw,104px) 1fr 1fr`) ve 1. satırda solda `.tp-name`,
   sağda `.tp-spec` duruyordu. İsim başlığı artık gizli (isim zaten
   satırın kendisi) — o satır boş kalıp `.tp-spec` sağa yapışık tek
   başına asılı kalıyordu. Spec 1. sütundan başlayıp iki sütun
   kaplıyor, künye satırı gibi soldan okunuyor.

   ⚠️ KAPALI DURUM. Hiçbir panel açık değilken sahne `.is-empty`
   alıyor ve gizleniyor; yoksa `.tlist li .tstage`in üst çizgisi ve
   32 px'lik boşluğu listede boş bir şerit olarak duruyordu.

   ⚠️ AÇILIŞ ARTIK ANİMASYON, GEÇİŞ DEĞİL. Paneller üst üste değil
   akışta olduğu için `transition` çalışmıyor (`display:none`'dan
   gelen öğe geçiş almaz). Kısa bir `animation` konuldu; kapanış
   anlık. `prefers-reduced-motion`'da ikisi de kapalı.

   Geri almak için: bu bloğu sil ve §51e'nin başına
   `@media(max-width:899px){` sargısını geri koy.                 */
#team .team-grid{grid-template-columns:1fr}
.tstage.is-empty{display:none}

/* ⚠️ PANEL TAM GENİŞLİĞE ÇIKINCA GÖRSELLER PATLIYORDU — ÖLÇÜLDÜ.
   Panel eskiden ızgaranın 55'lik sütunundaydı (1440'ta ~700 px) ve
   üç sütunu ~283 px'ti. Tek sütuna geçince panel 1328 px oldu:

     görsel      283×189  →  599×399   (iki katından fazla)
     .tp-m3      283×283  →  599×599   (1:1 olduğu için dev bir kare)
     bio satırı  38 karakter → 81 karakter (okuma ölçüsü 45–75)
     panel 817 → 1062 px · #team 943 → 1827 px

   Kaan düzeni istedi, "her şey iki katı olsun" demedi. Üç kapak:
     panel  max-width 980 px  → görseller 425×283
     .tp-m3 1:1 → 3:2         → 425×283, kare devliği bitti
     .tp-bio max-width 52ch   → 56 karakter/satır
   Sonuç: panel 630 px · #team 1395 (açıkken; kapalıyken 726).
   Panel listeye SOL kenardan hizalı, başlığın altındaki girintili
   içerik gibi okunuyor.                                          */
@media(min-width:900px){
  /* İsim başlığı gizlenince boşalan 1. satır: spec soldan başlıyor. */
  .tlist .tstage .tp-spec{grid-column:1/3;justify-self:start}
  .tlist .tstage .tpanel{max-width:980px}
  .tlist .tstage .tp-m3{aspect-ratio:3/2}
  .tlist .tstage .tp-bio{max-width:52ch}
}

@keyframes tpIn{from{opacity:0;transform:translateY(8px)}
                to{opacity:1;transform:none}}
.tpanel.is-on{animation:tpIn .38s var(--e) both}
@media(prefers-reduced-motion:reduce){
  .tpanel.is-on{animation:none}
}

/* ═══ 54 · ROTA ↔ EKİP ARASINDAKİ BOŞLUK (25 Ağustos 2026) ═══
   Kaan: "desktop sayfada routes ile takım bölümü arasında boşluk var,
   bunu kaldıralım."

   ÖLÇÜLDÜ (1440×900): haritanın son mürekkebi ("Marina" durağı) ile
   "TEAM" mikro etiketi arasında **174 px** boşluk. Üç ayrı kaynaktan
   geliyordu — ikisi kaldırıldı, biri duruyor:

     63 px  #team'in kendi üst dolgusu (.pad)      → KALDIRILDI (burada)
     63 px  yapışkan çerçevenin altındaki ölü alan → KALDIRILDI (betik)
     ~48 px SVG'nin kendi çizim alanı içindeki pay → DURUYOR

   Sonuç 174 → ~48 px. Kalan pay haritanın viewBox'ının içinde;
   kaldırmak için çizimin yeniden kırpılması gerekir, o ayrı iş.

   ⚠️ İKİ BÖLÜM ARASINDA MARGIN YOKTU — ilk bakışta orada arayanlar
   için: `#team` tam `#rtWrap`'in bittiği yerde başlıyor (ölçüldü, 0).
   Boşluk kutuların ARASINDA değil, İÇİNDEydi.

   ⚠️ ÇERÇEVE PAYI SABİT DEĞİL, PENCERE YÜKSEKLİĞİYLE DEĞİŞİYOR:
   1440 px genişlikte pencere 700 → 49 px · 800 → 56 · 900 → 63 ·
   1000 → 70 · 1080 → 110. Bu yüzden buraya sabit bir negatif margin
   YAZILAMAZ (kısa pencerede haritanın üstüne biner). Ölçüp yazma işi
   index.html'deki rota betiğinde, `trimTail()`.

   ⚠️ EŞİK 720, 900 DEĞİL. İlk yazışta 900 vermiştim ve 720–899
   arasında betik çekiyor ama #team'in 63 px'lik dolgusu duruyordu —
   yani o aralıkta iş yarım kalıyordu. Rota bölümünün KENDİ eşiği
   719'dur (§33: `@media(max-width:719px){#rtHead,.rt-wrap{display:none}}`),
   bu kural da onu takip ediyor. ≤719'da rota yok, ekip bölümü
   timer'ın altından geliyor ve dolgusu olduğu gibi duruyor.       */
@media(min-width:720px){
  #team{padding-top:0}
}

/* ═══ 55 · ENDURANCE ŞERİDİ — MOBİLDE TOPARLANDI (25 Ağustos 2026) ═══
   Kaan: "mobilde endurance sayfasındaki timeline biraz dağınık
   gözüküyor, toparlansın, boyu azalsın, alttaki bölümle boşluk
   minimuma insin."

   DAĞINIKLIĞIN SEBEBİ ÖLÇÜLDÜ — punto ya da boşluk değil, IZGARA.
   Şeritte YEDİ değer var (§36) ve ızgara ≤479'da 2, 480–899'da 3
   sütundu. Yedi tek sayı olduğu için ikisinde de SON HÜCRE YALNIZ
   KALIYORDU:
     390 px'te 2 sütun → 4 sıra, son sırada tek başına "+714 M
     Beginner", sağı boş.
     760 px'te 3 sütun → 3 sıra, yine son sırada tek hücre.

   İkinci ve asıl sebep: sıralar ANLAMI BÖLÜYORDU. Uzman ve başlangıç
   seviyelerinin km/rakım çiftleri ayrı sıralara düşüyordu —
   390 px'te sıralar şöyleydi:
     7 Days | 8 People
     2 Levels | 130.9 Km (Expert)      ← Expert km, rakımından ayrı
     +3,506 M (Expert) | 50 Km (Beginner)  ← iki seviye AYNI sırada
     +714 M (Beginner) | —

   ÇÖZÜM: 6 sütunluk bir ızgara ve açık yerleşim.
     1. sıra: üç genel bilgi, her biri 2 sütun  (Days · People · Levels)
     2. sıra: Expert çifti, her biri 3 sütun     (Km · M)
     3. sıra: Beginner çifti, her biri 3 sütun   (Km · M)
   Yalnız hücre yok, seviye çiftleri yan yana, üç sıra.
   ÖLÇÜM (390 px): şerit 296 → 227 px (−69, %23). 4 sıra → 3 sıra.

   ⚠️ ÇİZGİLER YENİDEN DAĞITILDI. §36'daki kurallar 1–3 ve 4–6.
   hücrelere alt çizgi veriyordu; yeni yerleşimde 2. sıra 4–5,
   3. sıra 6–7. Çizgi 1–5'e verilip 6–7'den kaldırıldı.
   ⚠️ 6–7'yi sıfırlayan kural §36'nınkiyle AYNI ÖZGÜLLÜKTE yazılmak
   zorunda: §36'daki `:nth-child(n+4):nth-child(-n+6)` iki pseudo-class
   taşıyor (0,4,0). Tek pseudo-class'lı bir kural onu EZEMEZ — bu
   yüzden aşağıda da iki pseudo-class var.

   ⚠️ Eşik 899 — şeridin kendi eşiği (§36 ve style.css:1950 orada
   3 sütuna iniyor). 479 eşiği artık gereksiz: her iki aralıkta da
   aynı üç sıralı düzen geçerli.

   ALTTAKİ BÖLÜMLE BOŞLUK: şerit sonu ile bir sonraki bölümün ilk
   içeriği arası 66 px'ti (şerit alt dolgusu 10 + `.sec` üst dolgusu
   36 + kalanı). `.sec`in kendi dolgusuna dokunulmadı — sayfadaki
   BÜTÜN bölümler o sınıfı paylaşıyor. Yalnız şeridin hemen
   ardından gelen bölüm hedeflendi (`.strip2-in + .sec`).         */
@media(max-width:899px){
  .s2-7{grid-template-columns:repeat(6,1fr)}
  .s2-7 .s2-cell{grid-column:span 3}
  .s2-7 .s2-cell:nth-child(-n+3){grid-column:span 2}
  .s2-7 .s2-cell:nth-child(-n+5){border-bottom:1px solid var(--line-l)}
  .s2-7 .s2-cell:nth-child(n+6):nth-child(-n+7){border-bottom:0}
  .strip2-in + .sec{padding-top:12px}
  /* ⚠️ ASIL BOŞLUK BURADAYDI. `.sec`in üst dolgusunu kısmak yetmedi;
     zinciri ölçünce çıktı: son yazı 701 → hücre dolgusu 6 → şerit alt
     dolgusu 10 → `.sec` 12 → **`.cp-lead`in kendi 30 px üst dolgusu**
     → görsel. Yani 59 px'in yarısı `.cp-lead`ten geliyordu.
     Yalnız şeridin ardından gelen ilk lead hedeflendi; sayfadaki
     diğer `.cp-lead` kullanımları dolgusunu koruyor.
     Ölçüm: son yazı → görsel 59 → 29 px.                          */
  .strip2-in + .sec .cp-lead{padding-top:0}
}

/* ═══ 56 · ENDURANCE "THE ROUTES" — MOBİL SATIR ARALARI (25 Ağu 2026) ═══
   Kaan: "mobilde endurance'daki routes kısmının satır aralarını
   hafiften azaltalım."

   ⚠️ Ana sayfadaki rota HARİTASI değil (o mobilde zaten `display:none`,
   §33) — bu, kamp sayfasındaki koyu bant, `#routes` / `.rtb`.

   ÖLÇÜLEN DAĞILIM (390 px, bölüm 1549 px). Boyun tamamı boşluk
   değil ama aralar §14'teki mobil düzenden kalma cömert değerlerdi:

     .rtb-r dolgusu        14/14 px   (sekiz satır)
     gün etiketi altı      10 px      (sekiz satır)
     Beginner→Expert arası 11+11 px   (sekiz satır)
     başlık satırı altı    10 px      (iki blok)
     Total satırı üstü     15 px      (iki blok)
     iki blok arası        30 px

   Hepsi ~%25 kısıldı. PUNTOLARA VE OKUMA SATIR ARALIĞINA
   DOKUNULMADI: `.rn` 14.5px/1.4 ve `.m` 13px/1.4 aynen duruyor —
   kısılan şey satırların ARASI, satırın kendi içi değil.
   Rota adları 390 px'te bir ve iki satıra düşüyor; ara kısılınca
   satır sayısı değişmiyor (ölçüldü).

   ÖLÇÜM: bölüm 1549 → 1395 px (−154, %10).

   ⚠️ Eşik 719 — bandın kendi mobil eşiği (§14, üç sütun orada tek
   sütuna iniyor). Masaüstünde hiçbir değer değişmiyor.
   ⚠️ `.rtb-sec` sınıfını `#included` bölümü de kullanıyor ama
   `.rtb-r`/`.rtb-hd` yalnız `#routes`'ta geçiyor — bu blok oraya
   bulaşmıyor (kontrol edildi).                                    */
@media(max-width:719px){
  .rtb-hd{padding-bottom:8px}
  .rtb-r{padding:10px 0}
  .rtb-r .d{margin-bottom:7px}
  .rtb-r .c + .c{margin-top:8px;padding-top:8px}
  .rtb-r.is-t{padding-top:11px}
  .rtb + .rtb{margin-top:24px}
}

/* ═══ 57 · TEKNELER BÖLÜMÜ — MOBİL BOŞLUKLAR (25 Ağustos 2026) ═══
   Kaan: "mobilde teknelerin bölümlerindeki boşlukları da minimuma
   indirelim."

   ÖLÇÜLEN DAĞILIM (390 px, `#boat` toplam 2332 px):
     iki tekne bloğu     1010 + 1041 px  (%88)
     bölüm başlığı        134
     .fleet üst boşluğu    26 · iki blok arası 30 + 30 · not 20

   Blok içinde nereye gittiği (tek tekne, 1010 px):
     ad satırı (.fl-hd)    44   künye listesi (.cp-spec)  448  ← %44
     kapak görseli        221   dört kare (.ba-shots)     251

   Yani boyun büyük kısmı KÜNYE LİSTESİNDE ve orada altı satırın her
   biri 72 px: dolgu 13+13, etiket ile değer arası 4. ≤519'da etiket
   ve değer ALT ALTA (`.cp-spec div{grid-template-columns:1fr}`) —
   o düzen korundu, yalnız araları kısıldı.

   ⚠️ PUNTOLARA DOKUNULMADI. `.cp-spec dt` 10.5px, `dd` 14px,
   `figcaption` 9.5px aynen duruyor; kısılan yalnız boşluk —
   künye satırlarının yan yana alınması dışında (aşağıda).

   ÖLÇÜM (390 px): yalnız boşluklar kısılınca 2332 → 2103 px (%10).
   Künye satırları yan yana da alınınca **2332 → 1853 px (−479, %21)**;
   tekne bloğu 1010 → 785, künye listesi 448 → 247.

   ⚠️ `.cp-spec` bu sayfada YALNIZ iki tekne bloğunda geçiyor
   (kontrol edildi) ama yine de `.fl-b` ile kapsandı.

   ⚠️ Eşik 719 — bölümün kendi mobil eşiği. `.fleet` tek sütuna
   1199'da iniyor, ama o tablet düzeni; boşluk kısıntısı telefonda
   isteniyordu, 1199'a yazılsaydı tablet de sıkışırdı.             */
@media(max-width:719px){
  .fleet{margin-top:18px;gap:22px}
  .fleet .fl-b + .fl-b{padding-top:22px}
  .fl-lead figcaption{margin-top:6px}
  .fl-hd{margin-top:12px;gap:6px}
  .fl-b .cp-spec{margin-top:10px;padding-top:10px}
  /* ⚠️ ETİKET VE DEĞER YENİDEN YAN YANA — bu bir DÜZEN değişikliği,
     sadece boşluk kısıntısı değil, ayrıca söylendi.
     Taban CSS ≤519'da künye satırlarını alt alta yığıyordu
     (`.cp-spec div{grid-template-columns:1fr}`) ve satır 72 px'e
     çıkıyordu. Yan yana koyunca ÖLÇÜLDÜ: değer sütunu 390 px'te
     230 px ve ALTI DEĞERİN ALTISI DA TEK SATIRA sığıyor — en uzunları
     "Yacht Classic Marina, Fethiye" ve "Skipper · private chef · host".
     Satır 72 → 39 px, künye listesi 448 → 247 px.
     Alt alta düzene dönmek için bu iki satırı sil.               */
  .fl-b .cp-spec div{padding:8px 0;gap:0 14px;
    grid-template-columns:minmax(0,.46fr) minmax(0,1fr)}
  .fl-b .ba-shots{margin-top:12px;gap:10px}
  .fl-b .ba-shots figcaption{margin-top:6px}
  .ba-note{margin-top:14px}
}

/* ═══ 58 · TAKVİMDE TEKNE ADI (.wb-row .n .bt) — 25 Ağustos 2026 ═══
   Ana sayfa takvimi 2 satırdan 11'e çıktı ve Endurance satırları
   artık tekne adı taşıyor (tek kaynak: camps/endurance-lab.html).

   ⚠️ NEDEN AYRI BİR ETİKET: adı düz metin olarak yazınca
   ("Endurance Lab · Blue Angel") başlık mobilde ikiye bölünüyordu —
   ölçüldü: 320/360/390/430'da "BLUE ANGEL" alt satıra düşüyor, ama
   "LALOM" düşmüyor. Yani dört satır iki kat, dördü tek kat: liste
   kertikli görünüyordu. Tekne adı kendi etiketine alınınca kırılma
   yeri TASARIM KARARI oluyor, tarayıcının tahmini değil.

   Tipografi: başlık display italik kalıyor, tekne adı mono —
   sitenin "büyük başlık display, küçük veri mono" kuralı (§32).
   Renk --gold-l (#756A44): krem zeminde 4.52:1, küçük metin eşiği
   4.5'in üstünde. Dolu altın (#AB9C63) burada 2.30:1 kalırdı.      */
.wb-row .n .bt{font-family:var(--data);font-weight:500;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold-l);
  /* display italik büyük harfin optik ortasına hizalanıyor */
  /* ⚠️ HTML'de etiketten önce GERÇEK BİR BOŞLUK var: yoksa
     textContent "Endurance LabLalom" oluyor — ekran okuyucu ve
     kopyala-yapıştır bitişik okuyor. Boşluk oraya girince görsel
     aralık da büyüdüğü için margin 12 → 8'e indi. */
  vertical-align:.22em;margin-left:8px}

/* ≤899: satır zaten iki kata düşüyor (§7). Tekne adı da kendi
   satırına iniyor — böylece her Endurance satırı AYNI yükseklikte,
   Lalom ile Blue Angel arasında fark kalmıyor. */
@media(max-width:899px){
  .wb-row .n .bt{display:block;margin:6px 0 0;vertical-align:0}
}

/* ═══ 59 · TAKVİM SATIRLARI SIKILDI (25 Ağustos 2026) ═══
   Kaan: "takvimdeki satır aralarını biraz azaltalım, boydan
   kısalalım." Liste 2 satırdan 11'e çıktığı için bölüm bir anda
   uzamıştı — ölçüldü (11 satır, §58 sonrası):
     1440  liste 913 px · satır 83 px
      768  liste 1151   · satır 108
      390  liste 1058   · satır 101
   Aşağıdaki değerler ÖLÇÜLEREK seçildi, tahminle değil.

   ⚠️ ALT SINIR DÜĞME: satır yüksekliğini metin değil sağdaki Book
   düğmesi belirliyor (39 px: 12+12 dolgu + 13 satır + 2 kenarlık).
   Dolgu 12'nin altına inince satır kısalmıyor, sadece çizgiler
   düğmeye yapışıyor. O yüzden masaüstünde 19 → 12'de durduk.     */
.wb-row{padding:12px 0}

/* 430–899: iki katlı satır. Dolgu 13 → 9, kat arası 4 → 3. */
@media(min-width:430px) and (max-width:899px){
  .wb-row{padding:9px 0;row-gap:3px}
}

/* ≤429: üç katlı satır (i / n+tekne / tarih+yer). */
@media(max-width:429px){
  .wb-row{padding:9px 0;row-gap:2px}
}

/* Tekne adı satırı (§58) mobilde kendi katında; üst boşluğu 6 → 4.
   Bu tek başına 8 Endurance satırında 16 px kazandırıyor. */
@media(max-width:899px){
  .wb-row .n .bt{margin-top:4px}
}

/* ⚠️ 360 px'te tarih hücresi İKİ SATIRA düşüyordu: "Sat · 31 Oct–7
   Nov 2026" + "· Göcek" yan yana 244 px istiyor, hücreye 236 px
   kalıyordu — satır 3 kattan 4'e çıkıp 124 px oluyordu (390'da 101).
   Punto ve harf arası bu genişlikte bir tık kısıldı; 390 ve üstü
   ETKİLENMİYOR, çünkü kural yalnız ≤389'da geçerli. */
@media(max-width:389px){
  .wb-row .dt,.wb-row .pl{font-size:11.5px;letter-spacing:.02em}
}

/* §31 (≤379) tarih ve yeri ayrı katlara ayırmıştı, çünkü o gün
   "Sat · 31 Oct–7 Nov 2026 · Göcek" 360 px'te yan yana sığmıyordu.
   Yukarıdaki punto kısması bunu değiştirdi — ölçüldü, 3 katlı düzen
   zorlanıp her satırın kaç kata çıktığı sayıldı:
     379 · 375 · 360  → hiçbir satır taşmıyor, hepsi tek satır
     340              → 2 satır taşıyor
     320              → 8 satırın 8'i taşıyor
   Yani sınır artık 379 değil, 360 ile 340 arasında. Güvenli tarafta
   kalıp 360'ı içeri aldık: ≤359 hâlâ dört katlı (§31 aynen duruyor).
   360 px'te satır 110 → 89 px.                                    */
@media(min-width:360px) and (max-width:379px){
  .wb-row{grid-template-areas:"i  i  bk"
                              "n  n  bk"
                              "dt pl bk"}
  .wb-row .pl::before{content:"· "}
}

/* ═══════════════════════════════════════════════════════════════
   §60 — EKİP GİRİŞİ İKİ KOLLU (Kaan, 26 Ağu 2026)
   "Six people run the boat and the blocks." + BUNUN YANINA
   "Different disciplines, one boat, one crew, one week, one journey."

   Neden yan yana sığıyor: §53'ten beri #team tek sütun, yani
   .team-side 1440'ta 1328 px genişliğinde; lede ise 38ch (≈410 px)
   kapağıyla duruyordu ve sağında ~900 px boşluk kalıyordu. İki cümle
   o boşluğu kullanıyor, bölüm boyu artmıyor.

   ⚠️ ≤899'da alt alta. Telefonda yan yana iki metin sütunu okunmaz;
   ayrıca .team-side orada zaten dar.
   ⚠️ Renk .light .lede'den geliyor (--tx-l-dim = --gold-l, §32),
   iki cümle de aynı tonda — biri vurgulu değil.               */
#team .team-lede{margin-top:20px}
#team .team-lede .lede{margin-top:0}
@media (min-width:900px){
  #team .team-lede{display:grid;grid-template-columns:auto auto;
                   justify-content:start;align-items:start;
                   column-gap:clamp(30px,3.6vw,58px)}
  /* Kapak yok: iki cümle de tek satır. Ölçüldü (doğal genişlik +
     boşluk): 1440'ta 933 px / sütun 1328 · 1024'te 772 / 942 ·
     900'de 767 / 828. Sığmazsa grid kendiliğinden daraltıp
     sardırır, taşma olmaz.                                      */
  #team .team-lede .lede{max-width:none}
  #team .team-lede .lede-2{max-width:none}
}
@media (max-width:899px){
  #team .team-lede .lede{max-width:38ch}
  #team .team-lede .lede-2{margin-top:9px}
}

/* ═══════════════════════════════════════════════════════════════
   §61 — "The days" DİPNOTU (Kaan, 26 Ağu 2026)
   "The routes" bölümü tamamen kaldırıldı; oranın sağ üstünde duran
   "GPX files included / Strava links to follow" satırı gün
   listesinin altına yıldızlı dipnot olarak indi.
   .ba-note ile aynı dil, ama .rtb-sec'e değil açık zemine ait.   */
.days-note{margin-top:clamp(18px,2.2vw,28px);font-size:13px;line-height:1.5;
           color:var(--tx-l-dim);font-family:var(--data);letter-spacing:.01em}
@media (max-width:719px){ .days-note{margin-top:14px;font-size:12px} }

/* ═══════════════════════════════════════════════════════════════
   §62 — KOL PANELİNDE BEKLEYEN DİSİPLİNLER (Kaan, 26 Ağu 2026)
   "Expert or beginner" kutusundaki büyük rakam bisiklet toplamı.
   Koşu ve yüzme verisi Orhan'dan gelecek; gelene kadar değer "?".
   Etiket dili .cp-br .l ile aynı (mono, 9.5px, ls .08em, --tx-l-dim);
   değer bir tık büyük ki "?" kaybolmasın.                        */
.cp-pend{margin-top:clamp(11px,1.3vw,16px);display:grid;gap:5px}
.cp-pend > div{display:grid;grid-template-columns:44px 1fr;
               gap:10px;align-items:baseline}
.cp-pend dt{font-family:var(--data);font-size:9.5px;letter-spacing:.08em;
            text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.cp-pend dd{margin:0;font-family:var(--data);font-size:12.5px;
            color:var(--tx-l-dim);font-variant-numeric:tabular-nums}

/* ═══════════════════════════════════════════════════════════════
   §63 — FOOTER TEK SIRA (Kaan, 26 Ağu 2026)
   "İki satırdan tek satıra. Derinlik minimumda, çok kalın olmasın —
   Windbase logosundan bir tık kalın olabilir. Logo ortada, Trailbase
   solda, Instagram ve Contact sağda."

   Üç bölgeli ızgara: 1fr | auto | 1fr. Yan sütunlar eşit olduğu için
   logo, içeriklerin genişliğinden BAĞIMSIZ olarak sayfanın tam
   ortasında duruyor (flex + space-between'de durmuyordu).

   ⚠️ SIRA YÜKSEKLİĞİNİN ALT SINIRI DOLGU DEĞİL, DOKUNMA HEDEFİ.
   .f-links a'nın 44 px'lik min-height'ı (§ dokunma hedefi bloğu)
   satırı zaten 44'te tutuyor; dikey dolgu bu yüzden 0'a çekildi.
   Daha ince istenirse min-height düşürülemez — WCAG 2.5.8.        */
footer{padding-block:0}
.f-row{max-width:var(--wrap);margin:0 auto;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:clamp(14px,2.6vw,40px);min-height:46px}
.f-row .f-l{justify-self:start;display:flex;align-items:center;
  gap:8px;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tx-l-dim);white-space:nowrap}
.f-row .f-l a{color:inherit;border-bottom:1px solid currentColor;
  position:relative;transition:color .3s var(--e),border-color .3s var(--e)}
.f-row .f-l a::after{content:"";position:absolute;inset:-15px -6px}
@media(hover:hover){ .f-row .f-l a:hover{color:var(--gold-l)} }
.f-row .f-sep{opacity:.5}
.f-row .f-wm{justify-self:center;line-height:0}
.f-row .f-wm img{height:22px;width:auto;display:block}
.f-row .f-links{justify-self:end;justify-content:flex-end;flex-wrap:nowrap;
  gap:clamp(16px,2.2vw,28px);white-space:nowrap}

/* MOBİL — üç bölge tek sıraya sığmıyor. ÖLÇÜLDÜ (390 px): sol blok
   126 px + logo 139 + sağ 107 + iki boşluk = 384, yan dolgu 40 ile
   birlikte 424 > 390. Logo 16 px'e küçültülse bile 408 çıkıyor.
   O yüzden logo üstte ortada, altında Trailbase solda / bağlantılar
   sağda: iki sığ satır, toplam ~74 px.
   ⚠️ "© 2026 Windbase" 26 Ağu'da kaldırıldı (Kaan'ın üç maddesi:
   Trailbase sol, logo orta, Instagram+Contact sağ). 320 px'te
   satır 21 px taşıyordu, sebebi oydu.                             */
@media (max-width:719px){
  .f-row{grid-template-columns:auto auto;grid-template-areas:"wm wm" "l r";
         justify-content:space-between;gap:4px 14px;min-height:0;padding-block:7px}
  .f-row .f-wm{grid-area:wm;justify-self:center}
  .f-row .f-wm img{height:20px}
  .f-row .f-l{grid-area:l;justify-self:start;font-size:9.5px;letter-spacing:.06em}
  .f-row .f-links{grid-area:r;justify-self:end;gap:14px}
  .f-row .f-links a{font-size:9.5px;letter-spacing:.06em}
}

/* ═══════════════════════════════════════════════════════════════
   §64 — "THE BASE IS THE BOAT" YUVASI İKİ KARE ARASINDA DÖNÜYOR
   (Kaan, 27 Ağu 2026: "7 numaralı görsel endurance'daki base is the
   boat ile beraber arka arkaya dönsün.")

   Yuva zaten position:relative ve içindeki img mutlak (§ .cp-lead-m).
   İki <picture> aynı kutuya bindiriliyor, opaklıkla geçiyorlar; her
   karenin KENDİ künyesi var ve künye görselle birlikte geçiyor —
   yoksa drone karesinin üstünde "On board" yazardı.

   ⚠️ <picture>'a AÇIKÇA position:absolute veriliyor. Çıplak <picture>
   satır içi bir kutu; opaklık verilince yığın bağlamı açıyor ama
   kendisi akışta kalıyor ve iki katman üst üste gelmiyordu.
   ⚠️ Geçiş süresi .9 sn, bekleme data-xf ile HTML'de (6000 ms).
   ⚠️ prefers-reduced-motion: geçiş yok, ilk karede duruyor (betik de
   sayacı hiç kurmuyor).                                              */
.cp-xf .xf-l{position:absolute;inset:0;display:block;
  opacity:0;transition:opacity .9s ease}
.cp-xf .xf-l.is-on{opacity:1}
.cp-xf .xf-c{opacity:0;transition:opacity .9s ease}
.cp-xf .xf-c.is-on{opacity:1}
@media (prefers-reduced-motion:reduce){
  .cp-xf .xf-l,.cp-xf .xf-c{transition:none}
}

/* ═══════════════════════════════════════════════════════════════
   §65 — YASAL SAYFALAR (privacy · terms · aydinlatma) 27 Ağu 2026
   Şirket unvanı geldi (Buse Hilal İnceler — şahıs şirketi), üç
   sayfanın önü açıldı. Sayfaların kendi düzeni YOK, sitenin mevcut
   dilini kullanıyorlar: .sec light + .wrapx + .sec-head/.sec-title.
   Buradaki tek yeni şey metin sütunu.

   ⚠️ GÖVDE METNİNDE --tx-l-dim KULLANILMIYOR. §32 o değişkeni
   #756A44'e (gold-l) çevirdi; krem zeminde 4,52:1 ile eşiği geçiyor
   ama sayfa dolusu paragraf altın-kahve çıkıyor. Yasal metin okunmak
   için var, dekor değil — düz mürekkep rgba(3,9,16,.78) kullanıldı.
   ⚠️ Başlıklarda nokta yok (25 Ağu kuralı) ve display italik olduğu
   için kutuya 1 px sağ pay bırakıldı.
   ⚠️ Sütun 68ch: 14,5 px'te 1440'ta ~620 px — sitenin okuma satırı.  */
.lg{max-width:68ch;margin-top:clamp(22px,2.6vw,36px)}
.lg-lead{font-size:clamp(14.5px,1.15vw,16.5px);line-height:1.6;
  color:rgba(3,9,16,.86)}
/* ⚠️ .55 ÖLÇÜLDÜ VE KALDI: krem zeminde 4,26 — küçük metin eşiği 4,5.
   .62'ye çekildi (4,82), sitenin kendi ikincil mürekkep değeri. */
.lg-updated{margin-top:14px;font-family:var(--data);font-size:9.5px;
  letter-spacing:.12em;text-transform:uppercase;color:rgba(3,9,16,.62)}
.lg-sec{margin-top:clamp(26px,3.2vw,40px);
  padding-top:clamp(18px,2.2vw,26px);border-top:1px solid var(--line-l)}
.lg-sec > h2{font-family:var(--display);font-weight:400;
  text-transform:uppercase;font-size:clamp(16px,1.35vw,20px);line-height:1.06;
  letter-spacing:-.02em;color:var(--tx-l);padding-right:1px}
.lg-sec > h2 + *{margin-top:12px}
.lg-sec p,.lg-sec li{font-size:clamp(13.5px,1.02vw,14.5px);line-height:1.62;
  color:rgba(3,9,16,.78)}
.lg-sec p + p{margin-top:11px}
.lg-sec ul{margin-top:11px;padding-left:0;list-style:none}
.lg-sec li{position:relative;padding-left:16px;margin-top:7px}
.lg-sec li::before{content:"";position:absolute;left:0;top:.62em;
  width:5px;height:1px;background:rgba(3,9,16,.45)}
.lg-sec a{color:var(--tx-l);text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px}
.lg-sec a:hover{text-decoration-color:rgba(3,9,16,.4)}
/* ⚠️ SEÇİCİ .lg-sec p.lg-id: yalın .lg-id (0,1,0) yukarıdaki
   .lg-sec p (0,1,1) kuralını EZEMİYOR, punto 14,5'te kalıyordu. */
.lg-sec p.lg-id{margin-top:12px;font-family:var(--data);font-size:12.5px;
  line-height:1.75;letter-spacing:.01em;color:rgba(3,9,16,.78)}
/* Dil köprüsü — İngilizce sayfadan Türkçe KVKK metnine ve tersi.
   Dokunma hedefi 44 px: satır kendi başına dururken küçük kalıyordu. */
.lg-alt{display:inline-flex;align-items:center;min-height:44px;
  margin-top:6px;font-family:var(--data);font-size:11px;
  letter-spacing:.08em;text-transform:uppercase;color:var(--tx-l);
  text-decoration:underline;text-underline-offset:4px}
@media(max-width:719px){
  .lg{max-width:100%}
  .lg-sec{margin-top:24px;padding-top:16px}
}

/* §65b — bülten rıza satırındaki bağlantı (27 Ağu 2026)
   Satır KOYU FOTOĞRAF bandının üstünde (.tbar) ve rengi
   rgba(255,255,255,.88); bağlantı o rengi miras almazsa sitenin
   varsayılan mürekkebiyle çizilip fotoğrafın içinde kayboluyor.
   Altı çizili — 11,5 px'te renk farkı tek başına yeterli işaret değil. */
.tbar .nl-consent a{color:#fff;text-decoration:underline;
  text-underline-offset:2px;text-decoration-thickness:1px}

/* §65c — MOBİLDE FOOTER ÜÇ SIRA (27 Ağu 2026)
   Yasal bağlantılar geri gelince footer'da 5 bağlantı oldu ve §63'ün
   ≤719 düzeni ("wm wm" / "l r") TAŞTI: ölçüldü, 390 px'te belge
   genişliği 431 (KVKK sağdan 41 px dışarıda).
   ⚠️ Sebep punto değil, SIRA PAYLAŞIMI. Bağlantı şeridi 275 px; tek
   başına 350 px'lik içerik genişliğine SIĞIYOR, ama solundaki
   "Site by Trailbase.co" ile aynı sırayı paylaşınca sığmıyor.
   Çözüm: bağlantılara kendi sırası verildi, üçü de ortalandı —
   wordmark zaten ortada, footer tek eksende hizalanmış oluyor.
   flex-wrap güvenlik ağı: 320 px'te ya da bir bağlantı daha eklenirse
   taşmak yerine alt satıra kırılır.                                  */
@media(max-width:719px){
  .f-row{grid-template-areas:"wm wm" "r r" "l l";gap:8px 14px}
  .f-row .f-links{grid-area:r;justify-self:center;
    flex-wrap:wrap;justify-content:center;gap:8px 13px}
  .f-row .f-l{grid-area:l;justify-self:center}
}

/* §65d — YASAL SAYFALARIN ÜST DOLGUSU + LİSTE SONRASI PARAGRAF
   (27 Ağu 2026, render'da görüldü)
   ⚠️ ÜST DOLGU: bu sayfalar da body.hdr-solid, yani header SABİT ve
   opak. §26'daki `.ct-sec{padding-top:clamp(112px,9vw,124px)}` kuralı
   YALNIZCA contact sayfasının bölümünü hedefliyor; yasal sayfalar
   düz `.sec light` olduğu için "PRIVACY" mikro etiketi barın ALTINDA
   KALIYORDU (1440'ta üstten kırpılmış çıktı). Aynı dolgu #legal'a da
   verildi — değer §26'dan kopyalandı, ikisi ayrışmasın.
   ⚠️ LİSTE SONRASI PARAGRAF: `.lg-sec p + p` yalnız p→p'yi yakalıyor;
   <ul>'den sonra gelen paragraf son maddeye yapışıyordu.            */
#legal{padding-top:clamp(112px,9vw,124px)}
.lg-sec ul + p{margin-top:13px}

/* §66 — ROTA BÖLÜMÜ BAŞLIĞIN ÜSTÜNE BİNİYOR (27 Ağu 2026)
   index.html'deki trimHead() .rt-wrap'e negatif üst margin veriyor
   (ölçülen ölü alan kadar, pencere boyuna göre 49–110 px). Bölüm
   böylece başlığın son satırının üstüne biniyor ve .rt-wrap'in krem
   zemini — DOM'da sonra geldiği için — başlık metnini boyuyordu.
   Aynı renk olduğu için ekranda "yazı kayboldu" diye görünüyor,
   sebebi belli olmuyor. Başlığa kendi yığın bağlamı verildi.       */
#rtHead{position:relative;z-index:1}

/* §67 — KOL PANELİNDEKİ KOŞU/YÜZME DEĞERLERİ ARTIK VERİ (27 Ağu 2026)
   §62'de bu satırlar "?" yer tutucusuydu ve değeri de etiketi de
   --tx-l-dim ile yazılıyordu. Veri geldi: değer artık okunacak bir
   rakam, etiket gibi soluk kalmamalı.
   ⚠️ --tx-l-dim §32'den beri ALTIN (#756A44). Etikette meşru (mikro
   etiket dili), ama rakamda değil: yanındaki .v (130.9 km) tam
   mürekkeple yazılıyor, ikisi ayrışıyordu.
   Etiket (dt) olduğu gibi bırakıldı.                                */
.cp-pend dd{color:var(--tx-l)}

/* §67b — DAR EKRANDA ETİKET DEĞERİN ÜSTÜNE (27 Ağu 2026)
   ⚠️ "?" tek karakterdi, veri gelince satır uzadı ve KIRILDI.
   ÖLÇÜLDÜ (390 px): .cp-branch iki kolon (145|145), satır ızgarası
   `44px 1fr` + 10 px gap → değere kalan 91 px. "10 km · +276 m" ise
   tek satırda ~102 px; ikinci satıra "· +276 m" düşüyor, ayraç satır
   başında kalıyordu. Etiket sütununu daraltmak 14 px kazandırıyor,
   yani sınırda — kalıcı çözüm değil.
   Etiket değerin ÜSTÜNE alındı: değer kolonun tamamını (145 px)
   kullanıyor, tek satırda bitiyor, ayraç dangling kalmıyor.
   Eşik 479: 480–719 arasında panel zaten tek kolon ve yer bol,
   ≤359'da da tek kolona iniyor.                                    */
@media(max-width:479px){
  .cp-pend > div{grid-template-columns:1fr;gap:2px}
}

/* ═══════════════════════════════════════════════════════════════════
   68 · RIZA BANDI (28 Ağustos 2026)
   ───────────────────────────────────────────────────────────────────
   Markup assets/consent.js tarafından çalışma anında basılıyor.
   Dil: koyu zemin + krem metin + mono etiket — sitenin kendi dili.
   ⚠️ Kontrast: --navy #030910 üstünde --cream #E7ECEE = 18,4:1.
      Düğme kenarlıkları da 3:1 eşiğinin üstünde.
   ⚠️ Dokunma hedefi 44 px (skill kuralı) — min-height ile sabit.
   ⚠️ z-index 90: booking modal 100'de, bandın modalin ÜSTÜNE
      çıkmaması gerekiyor.                                          */
.wb-cc{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  background:var(--navy); color:var(--cream);
  border-top:1px solid rgba(231,236,238,.16);
  transform:translateY(100%); transition:transform .32s ease;
}
.wb-cc.is-on{transform:translateY(0)}
.wb-cc-in{
  max-width:1480px; margin:0 auto; padding:14px 56px;
  display:flex; align-items:center; gap:28px; justify-content:space-between;
}
.wb-cc-tx{
  margin:0; font-family:var(--data,ui-monospace,monospace);
  font-size:12px; line-height:1.55; letter-spacing:.02em;
  color:var(--cream); max-width:78ch;
}
.wb-cc-tx a{color:var(--cream); text-decoration:underline; text-underline-offset:3px;
  text-decoration-thickness:1px}
/* ⚠️ text-decoration AÇIKÇA yazılıyor: style.css:61'de global
   a{text-decoration:none} var. Onsuz bağlantı gövde metniyle
   aynı renkte ve altı çizgisiz kalıyor — rıza bandında
   aydınlatma metnine giden bağlantının görünür olması şart. */
.wb-cc-btns{display:flex; gap:10px; flex:0 0 auto}
.wb-cc-b{
  min-height:44px; padding:0 20px; cursor:pointer;
  font-family:var(--data,ui-monospace,monospace);
  font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  background:transparent; color:var(--cream);
  border:1px solid rgba(231,236,238,.42); border-radius:0;
}
.wb-cc-b:hover{border-color:var(--cream)}
.wb-cc-yes{background:var(--cream); color:var(--navy); border-color:var(--cream)}
.wb-cc-yes:hover{opacity:.9}

/* ⚠️ Yan dolgu sarmalayıcının kendi 56 px'i; dar ekranda 20'ye iner.
   ≤719'da metin ve düğmeler alt alta — yan yana kalırsa metin
   3-4 satıra kırılıyor ve bant ekranın üçte birini yiyor.          */
@media(max-width:899px){
  .wb-cc-in{padding:14px 20px; gap:16px}
}
@media(max-width:719px){
  .wb-cc-in{flex-direction:column; align-items:stretch; gap:12px}
  .wb-cc-tx{font-size:11.5px; max-width:none}
  .wb-cc-btns{justify-content:stretch}
  .wb-cc-b{flex:1 1 0}
}

/* ---------- 6b. DÖRDÜNCÜ ÜRÜN KARTI (3 Eyl 2026) ----------
   Dördüncü kamp eklenince .rail-x'in üç sütunu 4 kartta 3+1 kırılıyordu.
   (O kart 3 Eyl'de "Hike Safari" adıyla açıldı, 4 Eyl'de Kaan
   "Into Lycia" yaptı — kural addan bağımsız, kart sayısına bağlı.)
   ⚠️ Eşik ÖLÇÜMLE seçildi, tahminle değil: dört sütunda kart genişliği
   1240 px'te 267 px'e iniyor ve karttaki tarih çipi (.prod-ph .st,
   clamp(20px,2.4vw,32px)) taşmaya başlıyor. Bu yüzden dört sütun
   YALNIZCA ≥1240'ta; 780–1239 arası iki sütun (bugünkü üç sütundan
   daha GENİŞ kart, yani gerileme yok); ≤779 zaten kaydırmalı tek sıra
   (§6) ve kart sayısından bağımsız çalışıyor. */
@media(min-width:780px) and (max-width:1239px){
  .rail-x{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(min-width:1240px){
  .rail-x{grid-template-columns:repeat(4,minmax(0,1fr))}
  /* ⚠️ ÖLÇÜLDÜ: dört sütunda çip iki satıra kırılıyordu. En uzun çip
     "8 dates · Sep–Dec"; 1440'ta 30 px puntoyla 291 px istiyor, kutu
     291 px — yani tam sınırda ikinci satıra düşüyordu. 1240'ta da aynı.
     Punto burada kısıldı: 1240'ta 19,2 px → ~186 px (kutu 246),
     1600'de 23 px → ~223 px (kutu 300). Sınıf zinciri .rail-x ile
     üç seviyeye çıkarıldı ki §2166/2183/2430'daki .prod-ph .st
     kurallarını özgüllükle ezsin, dosya sırasına güvenmesin. */
  .rail-x .prod-ph .st{font-size:clamp(17px,1.55vw,23px)}
}


/* ═══════════════════════════════════════════════════════════════════
   69 · GÜN LİSTESİNDE STRAVA BAĞLANTILARI (4 Eylül 2026)
   ───────────────────────────────────────────────────────────────────
   Kaan'ın kararı: çip sırasına DEĞİL, rota zincirinin ALTINA ince bir
   satır. Sebebi ölçülebilir: 03. güne dört rota düşüyor (expert ride,
   beginner ride, iki hike) ve bunlar çip olsaydı o günün çip sırası
   üçten yediye çıkıyordu.

   ⚠️ SINIF ADI `.day-stv` — `.rt-` ÖNEKİ KULLANILMADI. Ana sayfadaki
      rota haritası bütün bir `.rt-*` ad alanı tutuyor (.rt-wrap,
      .rt-line, .rt-dot …). Buraya `.rt-strava` yazmak iki ayrı bölümü
      aynı ada bağlardı.

   ⚠️ `<div>` kullanıldı, `<p>` DEĞİL: `.cp-day p` kendi puntosunu ve
      rengini dayatıyor (§ "The days" 15,5px / .72), onunla özgüllük
      kavgası etmemek için.

   ⚠️ ≥900'de `.cp-day .rt{display:inline}` — başlıkla aynı satıra
      giriyor. `.day-stv` flex olduğu için kendi satırında kalıyor,
      o kuraldan etkilenmiyor.

   ⚠️ text-decoration AÇIKÇA yazılıyor: style.css:61'de global
      `a{text-decoration:none}` var. Onsuz bu linkler mono gövde
      metninden ayırt edilemiyordu (aynı tuzak §68'de de vardı).

   Kontrast (krem #E7ECEE zemin, ikisi de bu dosyada daha önce
   ölçülmüş değerler):
     link  rgba(3,9,16,.78) → 9,52:1  (§65'te ölçüldü, eşik 4,5) ✓
     etiket var(--tx-l-dim) = #756A44 → 4,52:1  (§58'de ölçüldü) ✓
   ⚠️ Etiket 4,52 ile eşiğin hemen üstünde. Bu satırın rengini veya
      zeminini değiştiren biri kontrastı YENİDEN ölçmek zorunda.     */
.day-stv{margin-top:8px;display:flex;flex-wrap:wrap;align-items:baseline;
  column-gap:14px;row-gap:4px;
  font-family:var(--data);font-size:11.5px;letter-spacing:.06em;line-height:1.5}
.stv-l{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:var(--w-ui);color:var(--tx-l-dim)}
.day-stv a{color:rgba(3,9,16,.78);text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px}
.day-stv a:hover{color:var(--tx-l)}
@media(max-width:519px){
  .day-stv{margin-top:7px;column-gap:12px;font-size:11px}
}

/* ---- 69b · ALTERNATİF ROTALAR BLOĞU (4 Eylül 2026) ----
   15 rotanın 6'sı hiçbir günün metnindeki bir aktiviteye oturmuyor.
   Bir güne rastgele yazmak yerine listenin altında kendi bloğunda.
   ⚠️ Burada km/irtifa YAZILIYOR (gün satırlarında yazılmıyor): bu
      rotalar hiçbir çipte geçmediği için çakışacak ikinci bir rakam
      yok.
   ⚠️ İki sütun yalnız ≥720'de: 12px mono ile "Trail run or hike ·
      6.4 km · +210 m" satırı dar sütunda kırılıyor.                */
.alt-rts{margin-top:clamp(24px,3vw,38px);padding-top:clamp(16px,2vw,22px);
  border-top:1px solid var(--line-l)}
.alt-rts-h{font-family:var(--data);font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:var(--w-ui);color:var(--tx-l-dim)}
.alt-rts-s{margin-top:6px;font-family:var(--data);font-size:12px;
  line-height:1.5;color:rgba(3,9,16,.72)}
.alt-rts-l{list-style:none;margin-top:14px;display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 32px}
.alt-rts-l li{display:flex;flex-wrap:wrap;align-items:baseline;
  column-gap:10px;row-gap:2px;
  font-family:var(--data);font-size:12px;line-height:1.5}
.alt-rts-l a{color:rgba(3,9,16,.78);text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px}
.alt-rts-l a:hover{color:var(--tx-l)}
.alt-rts-n{color:var(--tx-l-dim);font-variant-numeric:tabular-nums;
  white-space:nowrap}
@media(max-width:719px){
  .alt-rts-l{grid-template-columns:1fr;gap:9px}
  .alt-rts-s{font-size:11.5px}
}


/* ═══════════════════════════════════════════════════════════════════
   70 · CREW BÖLÜMÜ — surf-safari.html (4 Eylül 2026, 2. tur)
   ───────────────────────────────────────────────────────────────────
   1. TUR YANLIŞTI. Kaan "çok yer kaplamasın" dedi, ben görselleri
   üçlü şeride sıkıştırdım: 1440'ta kare başına 135 px, sütunun %9'u.
   Kaan: "fotoları çok kötü yapmışsın… bu alanın kapladığı alan
   diğer bölümler gibi olsun."

   ⭐ HEDEF ÖLÇÜLDÜ, TAHMİN EDİLMEDİ (surf-safari, 1440 px):
       lead      681 px   görsel 557×557  (sütunun %39)
       coaching  563 px   görsel 580×473  (sütunun %40)
       pricing   554 px
       crew (1. tur) 521 px  görsel 135×168 (%9)  ← sapma buradaydı
   Yeni hedef: bölüm 560–680 px, görsel alanı sütunun ~%50'si,
   ana kare ≥400 px.

   Kolaj: ANA kare (4:5) solda iki satır boyunca, iki DESTEK karesi
   (1:1) sağda alt alta. Ana sayfadaki ekip panelinin dili de bu —
   iki küçük + bir büyük.
   ⚠️ Satır yüksekliğini SAĞDAKİ iki kare belirliyor; ana kare
      onlara stretch oluyor. object-fit:cover olduğu için ezilme
      yok, sadece 4:5'ten bir tık uzuyor (ölçüldü: 0.78).

   ⚠️ .crew-t BLOK — grid DEĞİL (style.css:816-821 global .tp-*
      ızgara kuralları blok kapsayıcıda etkisiz).
   ⚠️ .tp-spec'in üç kuralı açıkça geri alınıyor: 1. turda künye
      bölümün SAĞ KENARINA yapışmıştı, sebebi style.css:817'deki
      `justify-self:end` — .tpanel'e kapsanmamış, global, ve Chrome
      onu blok kutusuna da uyguluyor.                              */
.crew{list-style:none;margin-top:clamp(18px,2.2vw,28px);
  display:grid;grid-template-columns:1fr;gap:clamp(26px,3vw,44px)}
.crew-m{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);
  gap:clamp(20px,2.6vw,36px);align-items:start}

.crew-ph{display:grid;grid-template-columns:1.62fr 1fr;
  grid-template-rows:auto auto;gap:clamp(8px,.8vw,12px)}
.crew-ph picture{display:block;position:relative;overflow:hidden}
.crew-a{grid-column:1;grid-row:1/3;aspect-ratio:4/5}
.crew-b{grid-column:2;grid-row:1;aspect-ratio:1/1}
.crew-c{grid-column:2;grid-row:2;aspect-ratio:1/1}
.crew-ph img{position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;filter:saturate(.62) contrast(1.05)}
/* ⚠️ filter .tp-m img ile AYNI (style.css) — iki yerdeki ekip
   kareleri aynı görünsün diye. Birini değiştiren diğerini de. */

.crew-t{min-width:0}
.crew .tp-name{font-size:clamp(22px,2vw,30px);margin-bottom:12px}
.crew .tp-spec{margin-bottom:14px;
  grid-column:auto;grid-row:auto;justify-self:start;justify-content:start}
.crew .tp-lbl{display:block;margin-bottom:7px}
.crew .tp-bio{max-width:60ch}

@media(min-width:1200px){
  /* İkinci kişi (instructor) gelince otomatik iki sütun. */
  .crew{grid-template-columns:repeat(auto-fit,minmax(560px,1fr));
        column-gap:clamp(32px,3.4vw,56px)}
}
@media(max-width:899px){
  .crew-m{grid-template-columns:1fr;gap:16px}
  .crew .tp-bio{max-width:none}
}
@media(max-width:519px){
  /* ⚠️ Dar ekranda kolaj çöküyor: 390 px'te destek kareleri 131 px'e
     iniyor — 1. turdaki hatanın aynısı. Ana kare tam genişlik,
     destekler altında ikili sıra: 390'da 172 px, iki katı. */
  .crew-ph{grid-template-columns:1fr 1fr}
  .crew-a{grid-column:1/-1;grid-row:1;aspect-ratio:4/5}
  .crew-b{grid-column:1;grid-row:2}
  .crew-c{grid-column:2;grid-row:2}
}


/* ============================================================
   §69 — FİYAT (8 Eylül 2026, Kaan: Endurance Lab 2.800 € kişi başı)
   İki yerde görünüyor:
     .cp-price   kamp sayfasının Apply bölümünde, düğmenin üstünde
     .mdl-price  booking modalinde, kamp seçiminin altında
   Dil künye şeridinden alındı: rakam --display, birim --data mikro
   etiket (.s2-n / .s2-l ile aynı mantık).
   ⚠️ MODALDEKİ SATIR KAMPA GÖRE GİZLENİYOR (main.js → PRICES).
   Aşağıdaki [hidden] güvencesi bunun için: display veren herhangi
   bir kural `hidden` özniteliğini ezerse fiyatı OLMAYAN kampta
   2.800 € görünür — yani yanlış fiyat. (Aynı tuzak tam ekran
   katmanda bir kez yaşandı.)
   ============================================================ */
.cp-price[hidden],.mdl-price[hidden]{display:none!important}

.cp-price{margin:0 0 20px;line-height:1}
.cp-price .v{display:block;font-family:var(--display);font-weight:400;
  font-size:clamp(28px,3.2vw,42px);letter-spacing:-.01em;padding-right:1px}
.cp-price .u{display:block;margin-top:10px;font-family:var(--data);
  font-size:10.5px;line-height:1.5;letter-spacing:.16em;text-transform:uppercase}

/* Koyu zeminli Apply (diğer kamp sayfaları) — sırası önemli:
   .cp-apply-l aynı özgüllükte ve SONRA geliyor, krem zeminde o kazanıyor. */
.cp-apply .cp-price .v{color:var(--tx-d)}
.cp-apply .cp-price .u{color:var(--tx-d-dim)}
.cp-apply-l .cp-price .v{color:var(--tx-l)}
.cp-apply-l .cp-price .u{color:var(--tx-l-dim)}

@media(max-width:899px){
  /* .side soldan hizalı oluyor; fiyat düğmeye yapışmasın diye pay korunur */
  .cp-price{margin-bottom:18px}
  .cp-price .v{font-size:clamp(26px,7vw,34px)}
}

/* Modal.
   ⚠️ 8 Eyl 2026 — İLK HÂLİ GÖZDEN KAÇIYORDU. Satır mono 11,5 px altın
   mikro etiketti, yani hemen üstündeki "CAMP AND DATES" ve altındaki
   "LEVEL / EXPERIENCE" etiketleriyle BİREBİR aynı dildeydi; Kaan
   modalde fiyatı göremediğini söyledi ve haklıydı. Ders: bir satır
   teknik olarak görünür olması yetmiyor, çevresindeki dilden AYRILMASI
   gerekiyor. Rakam artık --display ve tam mürekkep, birim mono kaldı.
   ⚠️ display:flex `hidden` özniteliğini ezer — yukarıdaki
   .mdl-price[hidden] güvencesi tam olarak bunun için duruyor. */
.mdl-price{margin:12px 0 0;display:flex;align-items:baseline;
  gap:10px;line-height:1}
.mdl-price .v{font-family:var(--display);font-weight:400;font-size:22px;
  letter-spacing:-.01em;color:var(--tx-d);padding-right:1px}
.mdl-price .u{font-family:var(--data);font-size:10px;line-height:1.5;
  letter-spacing:.16em;text-transform:uppercase;color:var(--tx-d-dim)}
@media(max-width:519px){
  .mdl-price{margin-top:10px;gap:8px}
  .mdl-price .v{font-size:19px}
  .mdl-price .u{font-size:9.5px;letter-spacing:.12em}
}


/* ============================================================
   §70 — APPLY BÖLÜMÜ TEK SIRA (8 Eylül 2026, Kaan)
   Üç sütun: başlık · fiyat + düğme · paragraf.
   Başlık artık ızgaranın içinde, o yüzden puntosu bölümün kendi
   ölçeğine göre değil SÜTUN genişliğine göre kuruldu.
   ⚠️ ÖZGÜLLÜK: dosyanın üst kısmında `body.cp .cp-apply h2`
   (0,3,0) var. Buradaki kural `.cp-apply-row .cp-apply-in .ca-h`
   ile aynı özgüllükte ama DAHA SONRA geldiği için kazanıyor.
   Punto düşürmek için basitçe `.ca-h` yazmak (0,1,0) YETMEZDİ.
   ⚠️ MOBİL: yukarıdaki @media(max-width:899px) `.cp-apply-in`i
   tek sütuna indiriyor ama o kural (0,1,0); buradaki üç sütunlu
   kural (0,2,0) onu EZERDİ. Bu yüzden mobil karşılığı aşağıda
   ayrıca yazıldı — eksik olsaydı telefonda üç sütun kalırdı.
   ============================================================ */
.cp-apply-row .cp-apply-in{
  grid-template-columns:minmax(0,.78fr) minmax(0,.86fr) minmax(0,1fr);
  align-items:start;
  column-gap:clamp(28px,3.6vw,64px);
  margin-top:clamp(26px,2.8vw,40px)}

.cp-apply-row .cp-apply-in .ca-h{
  margin-top:0;font-size:clamp(21px,2.15vw,30px);line-height:1.02}

.cp-apply-row .ca-c .cp-price{margin:0 0 18px}
/* ⚠️ Fiyat puntosu başlığın ALTINDA kalmalı. İlk denemede
   clamp(23px,...) idi ve 1024 px'te fiyat 23, başlık 22 çıkıyordu —
   yani iki genişlikte hiyerarşi ters dönüyordu. Ölçülmeden
   fark edilmiyor; iki clamp'ın kesişimi gözle görünmüyor. */
.cp-apply-row .ca-c .cp-price .v{font-size:clamp(21px,2vw,28px)}
@media(max-width:719px){ .cp-apply-row .ca-c .cp-price .v{font-size:23px} }
.cp-apply-row .ca-c .cp-price .u{margin-top:8px}
/* Düğme sütuna göre daralsın ama satırı kırılmasın */
.cp-apply-row .ca-c .btn-o{white-space:nowrap}

/* ⚠️ SATIR UZUNLUĞU: eskiden 44ch idi ve tek başına yarım sayfa
   kaplıyordu. Üç sütunda 36ch okunabilir ölçüyü koruyor. */
.cp-apply-row .cp-apply-in p{max-width:36ch;
  font-size:clamp(13px,1vw,14.5px);line-height:1.62}

@media(max-width:1023px){
  .cp-apply-row .cp-apply-in{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    row-gap:clamp(22px,3vw,32px)}
  /* Paragraf iki sütunun altına tam genişlikte geçer */
  .cp-apply-row .ca-r{grid-column:1/-1}
  .cp-apply-row .cp-apply-in p{max-width:52ch}
}

@media(max-width:719px){
  .cp-apply-row .cp-apply-in{grid-template-columns:1fr;row-gap:20px}
  .cp-apply-row .ca-r{grid-column:auto}
  .cp-apply-row .cp-apply-in p{max-width:none}
  .cp-apply-row .ca-c .btn-o{width:100%}
}


/* ============================================================
   §71 — APPLY: SİMETRİK ÜÇLÜ + ÜST BOŞLUKLAR (8 Eylül 2026, Kaan)
   "üstteki boşluklar azalsın, 3 bölüm de simetrik olsun,
    2800 tam ortada."
   §70'te sütunlar .78 / .86 / 1fr idi (içeriğe göre ölçülmüştü);
   artık ÜÇ EŞİT sütun. Orta sütun ortalanınca fiyatın merkezi
   sarmalayıcının merkeziyle birebir çakışıyor — eşit olmayan
   sütunlarda çakışmıyordu, ölçüm aşağıda.
   Üst boşluk üç ayrı yerden geliyordu ve üçü de kısıldı:
     bölüm üst dolgusu   54 → 40 px
     etiket ↔ çizgi      26 → 16 px
     çizgi ↔ ızgara      40 → 26 px                (1440'ta)
   ⚠️ .sec'in `padding` KISA YAZIMI yukarıda duruyor; buradaki
   padding-top longhand'i sonra geldiği için eziyor. Kısa yazımı
   burada tekrar etmek alt dolguyu da sıfırlardı.
   ============================================================ */
.cp-apply-row{padding-top:clamp(26px,3vw,40px)}
.cp-apply-row .rule{margin-top:clamp(12px,1.2vw,16px)}
.cp-apply-row .cp-apply-in{
  grid-template-columns:repeat(3,minmax(0,1fr));
  margin-top:clamp(18px,1.9vw,26px)}

/* Orta sütun ortalanır — sağ ve sol kendi kenarlarına yaslanır,
   böylece üçlü aynadaki gibi dengeli durur. Sağdaki paragrafın
   METNİ sola dayalı kalıyor: sağa dayalı gövde metni okunmuyor. */
.cp-apply-row .ca-c{text-align:center}
.cp-apply-row .ca-r{justify-self:end}

/* ⚠️⚠️ İKİ HATA — ÖLÇÜMLE YAKALANDI, GÖZLE GÖRÜNMÜYORDU (8 Eyl 2026).

   ① FİYAT ORTADA DEĞİLDİ. §70'teki `.cp-apply-row .cp-apply-in p
   {max-width:36ch}` kuralı .cp-price'a DA uyuyor (o da bir <p>).
   Sütun 408 px, kutu 36ch = 327 px, yani metin kendi kutusunda
   ortalanıyor ama KUTU sola yaslı duruyordu: 1440'ta merkez
   41 px, 1280'de 33 px sapıyordu. Düğme 0 sapmayla tam ortadaydı,
   o yüzden ekrana bakınca "ortalanmış" görünüyordu.
   ② MOBİLDE İKİ SÜTUN KALIYORDU. §70'in @media(max-width:719px)
   tek sütun kuralı yukarıda; buradaki 1023 px kuralı DAHA SONRA
   geldiği için 390 px'te de o kazanıyordu — 161+161 px'lik iki
   sütun. §70'in kendi yorumunda bu tuzak yazılıydı ve yine de
   tekrarlandı: aşağı ekleme yapan CSS'te ALT eşik de tekrar
   yazılmak zorunda. */
.cp-apply-row .ca-c .cp-price{max-width:none}

@media(max-width:1023px){
  /* İki sütuna inince ortalama anlamını yitiriyor */
  .cp-apply-row .cp-apply-in{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cp-apply-row .ca-c{text-align:left}
  .cp-apply-row .ca-r{justify-self:start}
}
@media(max-width:719px){
  .cp-apply-row .cp-apply-in{grid-template-columns:1fr}
}


/* ============================================================
   §72 — APPLY, INCLUDED'IN HEMEN ALTINDA (8 Eylül 2026, Kaan)
   "Apply · Endurance Lab yazısı kalksın, included'dan sonra hemen
    başlasın, dikeyde boş alan görmek istemiyorum."
   Boşluk ÜÇ ayrı yerden geliyordu ve üçü de burada kesiliyor:
     #included alt dolgusu      46 → 24 px
     .cp-apply-row üst dolgusu  40 →  0 px   (§71'i eziyor)
     etiket + çizgi margin'i    16 →  0 px
   Etiket HTML'den çıktı, o yüzden kendi yüksekliği de gitti.
   ⚠️ .sec'in `padding` kısa yazımı yukarıda; burada yalnız
   padding-top longhand'i yazılıyor ki alt dolgu bozulmasın.
   ⚠️ #included kuralı surf-safari ve into-lycia sayfalarındaki
   aynı bölüme de uyar — bilerek, dördü de aynı düzeni kullanıyor.
   ============================================================ */
/* ⚠️ SADECE BU SAYFA. Düz `#included` yazılınca kural surf-safari
   ve into-lycia sayfalarına da uyuyordu — oysa onların Apply bölümü
   hâlâ eski düzende (etiketli, 40 px üst dolgulu), yani Kaan'ın
   istemediği bir sayfada sessiz bir değişiklik olurdu.
   `:has(+ .cp-apply-row)` kuralı yalnız YENİ düzenin üstündeki
   Included'a bağlıyor. Desteklemeyen tarayıcıda kural tümden
   yok sayılır ve eski 46 px kalır — bozulma değil, eski hâl. */
#included:has(+ .cp-apply-row){padding-bottom:clamp(16px,1.7vw,24px)}
.cp-apply-row{padding-top:0}
.cp-apply-row .rule{margin-top:0}
/* ⚠️ DÖRDÜNCÜ BOŞLUK KAYNAĞI — ölçüm zinciri çıkarılmasa bulunamazdı.
   Üç dolgu sıfırlandıktan sonra çizgi ile başlık arasında hâlâ 66 px
   vardı: 26'sı ızgaranın margin'i, kalan 40'ı `.cp-apply-in`in
   ESKİ padding-top'u (dosyanın üst kısmı, 757. satır). Bölüm bölüm
   ölçmeden "boşluk azaldı" demek yanlış olurdu. */
.cp-apply-row .cp-apply-in{padding-top:0;margin-top:clamp(20px,2vw,28px)}

/* ═══ 72 · "WHAT WINDBASE IS" PARAGRAFI BELİRGİNLEŞTİ (11 Eyl 2026) ═══
   Kaan: "Turkey's first boat-based… yazısı iyi okunmuyor deniyor,
   biraz daha belirgin hale getir."
   Sebep ölçüldü (gerçek render, satır satır en kötü %5): ince (400)
   ve küçük (13,5–15 px) beyaz metin dalganın parlak kabarcıklarının
   üstüne düşüyordu. Önce → sonra:
     1920  1,17 → 8,10     1440  5,25 → 10,37    1280  5,26 → 10,54
     1024  4,66 → 6,21      900  2,02 → 8,09      760  2,42 → 8,29
      720  2,37 → 8,84      390 11,10 → 10,50 (mobil kadraj zaten koyu)
   Bu, §50b'den beri açık duran "720–1279 px'te eşik altı" işini de kapattı.

   ÜÇ ŞEY BİRDEN:
   1. Ağırlık 400 → 500 (inter-500.woff2; @font-face ~2140. satırda zaten tanımlı;
      +47 KB yalnız bu paragraf için iniyor).
   2. Punto: ≥720'de 13,5–15 → 14,5–17 px (1440'ta 17) · mobilde 12,5 → 13,5.
   3. PARAGRAFA BAĞLI YUMUŞAK PERDE (≥720): .wi-body::before, metin
      bloğunun etrafında kenarı sıfıra inen radyal gölge. §48c'de
      bandın geneline konan perde krem köşeyi griye boyadığı için
      kaldırılmıştı — bu perde bandın değil METNİN kutusuna bağlı,
      metin nereye kayarsa onunla gidiyor ve kreme uzanmıyor.
   + çok hafif text-shadow (0 1px 3px) kabarcık kenarlarını ayırıyor.
   ⚠️ .wi-in z-index:2 bir yığın bağlamı; ::before'un z-index:-1'i
   o bağlamın içinde kalıyor, yani fotoğrafın üstünde, metnin altında.
   ⚠️ Görsel değişirse bu ölçümler yeniden yapılır.                 */
.wi-body p{font-weight:500;text-shadow:0 1px 3px rgba(3,9,16,.55)}
@media(min-width:720px){
  .wi-body{position:relative}
  .wi-body::before{content:"";position:absolute;inset:-45% -22% -35% -22%;
    z-index:-1;pointer-events:none;
    background:radial-gradient(closest-side,rgba(3,9,16,.76),rgba(3,9,16,.50) 55%,rgba(3,9,16,0))}
  .wi-body p{font-size:clamp(14.5px,1.18vw,17px);line-height:1.55}
}
@media(max-width:719px){
  .wi-body p{font-size:13.5px;line-height:1.55}
}

/* ---------- 69. TEK TEKNE — 13 Eyl 2026 (Kaan) ----------
   "endurance de sadece Blue Angel teknesi olsun." Lalom bu sayfadan
   çıktı; Lalom'un tarihleri Surf Safari ve Into Lycia satırlarına
   geçti (ana sayfa takvimi). Burada geriye TEK tekne bloğu kaldı.

   §30'un iki sütunlu ızgarası ve sütunlar arasındaki ayırıcı
   ::before çizgisi tek blokta anlamsız: çizgi boşlukta asılı
   kalıyordu, blok da sol yarıya sıkışıp sağ yarıyı boş bırakıyordu.
   İkisi de bu bölümde kapatıldı.

   ⚠️ GENİŞLİK ÖLÇÜYLE SEÇİLDİ, tam genişlik DEĞİL. .ba-shots 2×2
   olduğu için blok wrapx'e (1440'ta 1368 px) yayılsaydı kareler
   ~672 px'e çıkıyordu — sayfanın hiçbir yerinde o ölçüde iç mekân
   karesi yok. 860 px tavanı §30'da ölçülen "1199'da tek sütun →
   kare 463 px" deneyimini koruyor (860'ta kare 418 px).

   Lalom geri gelirse: HTML'den .fleet-solo sınıfını kaldırmak
   yeter, §30 olduğu gibi çalışıyor.                              */
.fleet.fleet-solo{grid-template-columns:minmax(0,860px)}
.fleet.fleet-solo::before{display:none}


/* ═══ §73 — ALTERNATİF ROTALAR: DAR EKRANDA KÜNYE KIRILABİLİR ═══════
   24 Eyl 2026. Türkçe sayfada "Patika koşusu ya da yürüyüş · 6,4 km ·
   +210 m" nowrap olduğu için 320 px'te belge 344 px'e taşıyordu
   (İngilizcesi sığıyor). ≤479'da künye satır içinde kırılabiliyor.  */
@media(max-width:479px){
  .alt-rts-n{white-space:normal}
}


/* ═══ §74 — TARİH TABLOSU VE TEKNE TAM GENİŞLİK ═══════════════════
   24 Eyl 2026 (Kaan). İlk istek "ortada olsun"du; ortalandı ama
   genişlik aynı kaldı (tablo 636 · tekne 860 px) ve Kaan düzeltti:
   "sayfanın diğer bölümleri gibi en boyutunda olsun."
   Artık ikisi de .wrapx'in tam içerik genişliğinde (1440'ta 1328 px),
   gün listesi / Included kutusu / lead ile aynı kenarlarda.
   Yalnız Endurance'ın iki sürümünde var: #dates yalnız orada,
   .fleet-solo yalnız orada. Surf Safari'nin .cp-two'su etkilenmiyor.
   ⚠️ Yukarıdaki .fleet.fleet-solo{minmax(0,860px)} bununla EZİLİYOR. */
#dates .cp-two{grid-template-columns:minmax(0,1fr)}
.fleet.fleet-solo{grid-template-columns:minmax(0,1fr)}


/* ═══ §75 — BİLGİ AL DÜĞMESİ + GERİ ARAMA PENCERESİ (29 Eyl 2026) ═══
   Markup main.js (callbackSheet) tarafından basılıyor, her sayfada.
   Dil rıza bandıyla (§68) aynı: lacivert zemin, krem metin, mono etiket.
   ⚠️ z-index sırası: header 60 < düğme 85 < rıza bandı 90 < pencere 95
      < booking modal 200. Bant açıkken düğme --wb-cc-h kadar yukarıda.
   ⚠️ Dokunma hedefleri ≥44 px · alan puntosu 16 px (iOS yakınlaştırma).
   ⚠️ [hidden] AÇIKÇA display:none — .wb-cb flex, hidden'ı ezerdi.     */
.wb-fab{
  position:fixed; z-index:85; right:24px;
  bottom:calc(24px + var(--wb-cc-h,0px) + env(safe-area-inset-bottom,0px));
  display:inline-flex; align-items:center; gap:10px;
  min-height:46px; padding:0 20px; cursor:pointer;
  font-family:var(--data,ui-monospace,monospace); font-size:11.5px;
  letter-spacing:.08em; text-transform:uppercase;
  background:var(--navy); color:var(--cream);
  border:1px solid rgba(231,236,238,.42); border-radius:0;
  box-shadow:0 6px 24px rgba(3,9,16,.28);
  transition:bottom .32s ease, opacity .25s ease, transform .25s ease;
}
.wb-fab:hover{border-color:var(--cream)}
.wb-fab-dot{width:6px; height:6px; border-radius:50%; background:var(--cream)}
html.cb-open .wb-fab, html.mdl-open .wb-fab{opacity:0; transform:translateY(8px); pointer-events:none}

.wb-cb[hidden]{display:none}
.wb-cb{
  position:fixed; z-index:95; right:24px;
  bottom:calc(24px + var(--wb-cc-h,0px) + env(safe-area-inset-bottom,0px));
  width:360px; max-width:calc(100vw - 32px);
  display:flex; flex-direction:column;
  padding:22px 22px 18px; box-sizing:border-box;
  background:var(--navy); color:var(--cream);
  border:1px solid rgba(231,236,238,.22);
  box-shadow:0 18px 48px rgba(3,9,16,.36);
  transform:translateY(calc(100% + 40px + var(--wb-cc-h,0px)));
  transition:transform .32s ease, bottom .32s ease;
}
.wb-cb.is-on{transform:translateY(0)}
.wb-cb-x{
  position:absolute; top:6px; right:6px; width:44px; height:44px;
  background:transparent; border:0; color:var(--cream); cursor:pointer;
  font-size:15px; line-height:1;
}
.wb-cb-eb{font-family:var(--data,ui-monospace,monospace); font-size:10.5px;
  letter-spacing:.12em; text-transform:uppercase; color:rgba(231,236,238,.72)}
.wb-cb-h{margin:8px 44px 6px 0; padding-right:1px;
  font-family:var(--display); font-style:italic; font-weight:900;
  font-size:24px; line-height:1.08; text-transform:uppercase; color:var(--cream)}
.wb-cb-p{margin:0 0 14px; font-family:var(--text,Inter,sans-serif);
  font-size:13.5px; line-height:1.5; color:rgba(231,236,238,.82)}
.wb-cb-f{display:flex; flex-direction:column; gap:10px; margin:0}
.wb-cb-l{display:block}
.wb-cb-l span{display:block; margin-bottom:2px;
  font-family:var(--data,ui-monospace,monospace); font-size:10px;
  letter-spacing:.12em; text-transform:uppercase; color:rgba(231,236,238,.72)}
.wb-cb-l input{
  width:100%; box-sizing:border-box; min-height:40px; padding:6px 0;
  background:transparent; border:0; border-bottom:1px solid rgba(231,236,238,.42);
  border-radius:0; color:var(--cream); font:16px/1.3 var(--text,Inter,sans-serif);
}
.wb-cb-l input:focus{outline:none; border-bottom-color:var(--cream)}
.wb-cb-hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0}
.wb-cb-s{
  margin-top:6px; min-height:46px; cursor:pointer;
  font-family:var(--data,ui-monospace,monospace); font-size:11.5px;
  letter-spacing:.08em; text-transform:uppercase;
  background:var(--cream); color:var(--navy); border:1px solid var(--cream); border-radius:0;
}
.wb-cb-s:disabled{opacity:.6; cursor:default}
.wb-cb-m{margin:0; min-height:0; font-family:var(--text,Inter,sans-serif);
  font-size:13px; line-height:1.45; color:var(--cream)}
.wb-cb-m:empty{display:none}
.wb-cb-m.is-err{color:#F2B8A9}

/* Mobil: düğme küçülür, pencere tam genişlikte alttan açılan tabaka */
@media(max-width:719px){
  .wb-fab{right:16px; bottom:calc(16px + var(--wb-cc-h,0px) + env(safe-area-inset-bottom,0px));
    min-height:44px; padding:0 16px}
  .wb-cb{left:0; right:0; bottom:var(--wb-cc-h,0px); width:auto; max-width:none;
    padding:20px 16px calc(16px + env(safe-area-inset-bottom,0px));
    border-width:1px 0 0}
  .wb-cb-h{font-size:22px}
}