/* GOJOWA magaza — 18. adim, acik tema.
   site.css'teki degiskenleri kullanir; yeni renk TANIMLAMAZ. */

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

.hero--compact { padding-block: clamp(30px, 5vw, 52px) clamp(26px, 4vw, 42px); }
.hero--compact h1 { font-size: clamp(2rem, 5.4vw, 3.4rem); max-width: 18ch; }

.crumb { font-size: 14px; font-weight: 500; color: var(--muted); margin: 0 0 14px; }
.crumb a { text-decoration-color: var(--edge); text-underline-offset: 3px; }
.crumb a:hover { color: var(--ink); text-decoration-color: var(--red); }

/* --------------------------------------------------------- destinasyon basi */
.desthead { display: flex; align-items: center; gap: 18px; }
.destflag {
  width: 56px; height: 56px; border-radius: 50%; flex: none;
  border: 3px solid var(--paper); box-shadow: var(--sh-flag);
  background: var(--sunk); overflow: hidden;
}
@media (max-width: 560px) { .destflag { width: 42px; height: 42px; } }

/* ---------------------------------------------------------------- finder */
.finder { margin-top: clamp(24px, 4vw, 34px); max-width: 620px; }
.finder__label {
  display: block; font-size: 12px; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--faint); margin-bottom: 10px;
}
.finder__input {
  width: 100%; font: inherit; font-size: 1.05rem; color: var(--ink);
  background: var(--paper); border: 1px solid var(--edge-2); border-radius: 13px;
  padding: 17px 18px 17px 48px; box-shadow: var(--sh-1);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 24 24' fill='none' stroke='%238A8075' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 18px 50%;
}
.finder__input::placeholder { color: var(--faint); }
.finder__input:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; border-color: transparent; }
/* Adim 74-A: ARAMA kutusu olmayan alanlar. .finder__input'un buyutec simgesi
   arama icin dogru ama ad, e-posta ve mesaj kutusunda yanlis duruyordu
   (telefonda mesaj kutusunun ortasinda bir buyutec). Simge yok, sol dolgu normal. */
.finder__input--plain { background-image: none; padding-left: 18px; }
textarea.finder__input { padding-top: 14px; line-height: 1.5; }

.finder__count { font-size: 14px; color: var(--muted); margin: 12px 0 0; min-height: 1.2em; }
.finder__list { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.finder__list a {
  display: inline-block; text-decoration: none; font-size: 15px; font-weight: 500;
  background: var(--paper); border: 1px solid var(--edge); border-radius: 999px; padding: 8px 15px;
}
.finder__list a:hover { border-color: var(--red); color: var(--red-ink); }
.finder__empty { color: var(--muted); font-size: 15px; }

/* ----------------------------------------------------------------- guven */
.trust {
  display: grid; gap: 14px; background: var(--paper); border: 1px solid var(--edge);
  border-radius: 18px; padding: 20px 26px; box-shadow: var(--sh-1);
  margin-top: clamp(26px, 4vw, 36px);
}
@media (min-width: 900px) { .trust { grid-template-columns: repeat(4, 1fr); gap: 26px; } }
.trust__item { display: flex; align-items: center; gap: 11px; font-size: 14.5px; color: var(--muted); }
.trust__item svg { flex: none; width: 20px; height: 20px; stroke: var(--red); fill: none; stroke-width: 1.8; }

/* ------------------------------------------------------------ destinations */
.dest-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
@media (min-width: 560px) { .dest-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px) { .dest-grid { grid-template-columns: repeat(3, 1fr); } }
.dest-grid a {
  display: flex; align-items: center; justify-content: space-between; gap: 14px;
  background: var(--paper); padding: 17px 20px; text-decoration: none;
  border: 1px solid var(--edge); border-radius: var(--r); box-shadow: var(--sh-1);
  transition: border-color .12s, box-shadow .12s, transform .12s;
}
.dest-grid a:hover { border-color: var(--edge-2); box-shadow: var(--sh-2); transform: translateY(-1px); }
.dest-grid__name { font-weight: 600; letter-spacing: -0.012em; }
.dest-grid__price { font-size: 14px; color: var(--muted); white-space: nowrap; text-align: right; }
.dest-grid__price b {
  display: block; font-size: 1.05rem; font-weight: 700; letter-spacing: -0.02em;
  color: var(--red-loud);
}

/* ---------------------------------------------------------------- sortbar */
.sortbar {
  display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center;
  justify-content: space-between; margin-bottom: clamp(20px, 3vw, 26px);
  background: var(--paper); border: 1px solid var(--edge); border-radius: var(--r);
  padding: 13px 18px; box-shadow: var(--sh-1);
}
.sortbar .section__label { margin: 0; color: var(--ink); font-size: 14px;
  letter-spacing: 0; text-transform: none; font-weight: 600; }
/* flex-wrap: wrap ZORUNLU (Adim 73'te tarayici turu yakaladi). Adim 70'te siralama
   olcutleri ucten BESE cikti ve serit 360 pikselde 6 px tasiyordu - butun sayfa yana
   kayiyordu. Yatay kaydirma (overflow-x:auto) yerine SARMA: kaydirmali bir seritte
   son iki olcut gorunmez olur ve "GB basina fiyat" tam da gorunmesini istedigimiz sey. */
.sortbar__opts { display: flex; flex-wrap: wrap; gap: 4px; padding: 3px; font-size: 13px;
  font-weight: 500; max-width: 100%;
  background: var(--sunk); border: 1px solid var(--edge); border-radius: 10px; }
.sortbar__opts a { text-decoration: none; color: var(--muted); padding: 6px 13px; border-radius: 7px; }
.sortbar__opts a:hover { color: var(--ink); }
.sortbar__opts a[aria-current] { background: var(--cta-bg); color: var(--cta-fg); font-weight: 600; }

/* ------------------------------------------------------------------ cards */
.cards { display: grid; gap: 20px; align-items: start; }
/* align-items:start (Adim 70b): ZORUNLU. Varsayilan 'stretch' ile bir kartin
   <details>'ini acmak ayni siradaki digerlerini de o boya geriyordu - yan yana
   iki bos, 700 px'lik kutu olusuyordu. 'start' ile acilan kart YALNIZ BASINA
   buyur, komsulari kendi boyunda kalir. */
@media (min-width: 760px) { .cards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .cards { grid-template-columns: repeat(3, 1fr); } }

.card {
  display: flex; flex-direction: column; background: var(--paper);
  border: 1px solid var(--edge); border-radius: 20px; overflow: hidden;
  box-shadow: var(--sh-2); transition: box-shadow .14s, transform .14s;
}
.card:hover { box-shadow: var(--sh-3); transform: translateY(-2px); }

/* one cikan kart */
.card--best { border: 1.5px solid var(--best-edge); box-shadow: var(--sh-best); }
.card { position: relative; }
.card__ribbon {
  position: absolute; top: 0; left: 24px; transform: translateY(-50%);
  background: var(--amber-bg); border: 1px solid var(--amber-edge); border-radius: 999px;
  padding: 4px 12px; font-size: 12px; font-weight: 600; color: var(--amber); line-height: 1.3;
}
.card__ribbon--plain { background: var(--sunk); border-color: var(--edge); color: var(--muted); }
.card { overflow: visible; }
.cards { padding-top: 8px; }

/* Kart sirasi (Adim 70): ulke -> veri (buyuk) + sure -> FIYAT + SATIN AL -> "Ayrintilar" (katli).
   Eskiden butun kunye acikti ve tek kart bir ekrani dolduruyordu; Fransa sayfasinda
   uc kart gormek icin uc ekran kaydirmak gerekiyordu. Ayrintilar artik <details>
   icinde - ayni sayfada, bir tik uzakta, DOM'da (arama motoru okur, JS gerekmez). */
.card__head { display: flex; flex-direction: column; gap: 10px; padding: 20px 20px 14px; }
.card__where { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; font-weight: 600; color: var(--muted); }
.card__data { display: flex; flex-direction: column; }
.card__amount { font-size: 2.15rem; font-weight: 700; letter-spacing: -0.034em; line-height: 1; color: var(--ink); }
.card__days { font-size: 14px; font-weight: 500; color: var(--faint); margin-top: 8px; }
.card__caveat { font-size: 13px; color: var(--muted); margin-top: 4px; max-width: 28ch; }
.card__buy { display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 0 20px 16px; }
.card__price { text-align: left; flex: none; }
.card__price { display: block; font-size: 1.85rem; font-weight: 700; letter-spacing: -0.032em;
  line-height: 1; color: var(--price); }
.card__unit { display: block; font-size: 13px; font-weight: 400; color: var(--muted); margin-top: 8px; }
.ok { color: var(--ok); font-weight: 600; }

/* Adim 71: cikis ulkesi kapali kartta da. Satir karti UZATMIYOR - 1440'ta 260 px,
   390'da 247 px, oncesiyle AYNI (olculdu). Kazanilan 22 px dolgudan kisildi.
   Kisma :has ile YALNIZCA satirin oldugu kartta: herkese uygulansaydi cikisi
   olmayan kartlar 22 px kisa kalir ve 70b'den sonra (align-items:start, kartlar
   artik gerilmiyor) sira sonlari tirtikli gorunurdu. :has desteklemeyen eski
   tarayicida satir kartı 22 px uzatir - kirilmaz, sadece eski davranis. */
/* Bosluk dengesi: ustunde 10 px (4 + 6), altinda 6 px. Ilk denemede satirin
   ALTINDA 0 px kalmisti ve "Ayrintilar" cizgisine yapisiyordu (olculdu). Toplam
   bosluk degismedi, yani kart yine uzamiyor - yalnizca yeniden dagitildi. */
.card__exit { margin: 6px 0 0; padding: 0 20px 6px; font-size: 12px; line-height: 16px; color: var(--faint); }
.card:has(.card__exit) .card__head { padding: 16px 20px 10px; }
.card:has(.card__exit) .card__days { margin-top: 6px; }
.card:has(.card__exit) .card__unit { margin-top: 5px; }
.card:has(.card__exit) .card__buy { padding-bottom: 4px; }
.card:has(.card__exit) .card__more > summary { padding-top: 9px; padding-bottom: 9px; }

.card__facts { margin: 0; display: grid; }
.card__facts > div { display: grid; grid-template-columns: 6.6em 1fr; gap: 14px;
  padding: 10px 20px; border-bottom: 1px solid var(--edge-soft); align-items: start; }
.card__facts > div:last-child { border-bottom: 0; }
.card__facts dt { font-size: 11.5px; font-weight: 600; letter-spacing: .07em;
  text-transform: uppercase; color: var(--faint); margin: 0; padding-top: 3px; }
.card__facts dd { margin: 0; font-size: 0.97rem; font-weight: 500; color: var(--ink); }   /* fiyatla ayni aile; belirgin kucuk degil */
.card__from { display: block; font-size: 12.5px; font-weight: 400; color: var(--muted); margin-top: 2px; }

.tech { font-size: 11px; font-weight: 700; letter-spacing: .04em; padding: 2px 7px;
  border-radius: 5px; border: 1px solid var(--edge); color: var(--muted);
  background: var(--sunk); white-space: nowrap; }
.tech--5g { color: var(--amber); border-color: var(--amber-edge); background: var(--amber-bg); }
.no { color: var(--price); font-weight: 600; }

/* Adim 70: katlanabilir ayrintilar. Ok isareti bizim - tarayicinin kendi ucgeni
   iki temada da farkli duruyor ve hizalamasi bozuk. */
.card__more { border-top: 1px solid var(--edge); }
/* summary'ye display:flex / grid VERILMEZ. Bahadir 1 Ekim'de actigi karti Safari
   26.2'de kapatamadi; sebebi buydu - WebKit'te flex'lenmis bir <summary> tiklamayi
   yutuyor, kart bir daha kapanmiyor. Chromium'da sorun GORUNMUYOR, yani burayi
   bizim tarayicida denemek yeterli degil. Ok isareti bu yuzden inline-block;
   hizalama vertical-align ile, flex'siz. */
.card__more > summary {
  cursor: pointer; list-style: none; padding: 12px 20px; font-size: 13.5px; font-weight: 600;
  color: var(--muted); display: block;
}
.card__more > summary::-webkit-details-marker { display: none; }
.card__more > summary::marker { content: ""; }
.card__more > summary::before {
  content: ""; display: inline-block; vertical-align: 1px; margin-right: 9px;
  width: 7px; height: 7px; border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor; transform: rotate(45deg) translate(-1px, -1px);
  transition: transform .12s;
}
.card__more[open] > summary::before { transform: rotate(-135deg) translate(-2px, -2px); }
.card__more > summary:hover { color: var(--ink); }
.card__more > summary:focus-visible { outline: 2px solid var(--cta-bg); outline-offset: -2px; }
.card__more .card__facts { border-top: 1px solid var(--edge-soft); }
.card__note { font-size: 12.5px; color: var(--faint); margin: 0; padding: 12px 20px 18px; }

/* ---------------------------------------------------------------- butonlar */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none; font-weight: 600; font-size: 0.97rem;
  border: 1px solid var(--edge-2); background: var(--paper); color: var(--ink);
  border-radius: 12px; padding: 13px 22px; min-height: 48px;
}
.btn:hover { border-color: var(--ink); }
.btn--primary { background: var(--cta-bg); border-color: var(--cta-bg); color: var(--cta-fg); box-shadow: var(--sh-red); }
.btn--primary:hover { background: var(--cta-hover); border-color: var(--cta-hover); }
.btn--block { display: flex; width: 100%; }
/* Adim 40b: satin al dugmesi kehribar; koyu temada --buy-* bakira doner (kirmizi dugme koyu temada yok) */
.btn--buy { background: var(--buy-bg); border-color: var(--buy-bg); color: var(--buy-fg); flex-direction: column; gap: 1px; line-height: 1.15; padding: 10px 22px; }
.btn--buy:hover { background: var(--buy-hover); border-color: var(--buy-hover); }
.btn__sub { font-size: 11px; font-weight: 500; opacity: .8; }
.card__soon { font-size: 14px; font-weight: 600; color: var(--muted); }
.card__op dd { font-size: 1.06rem; font-weight: 700; color: var(--ink); }   /* operator: fiyattan sonraki en guclu oge */
.card__carrier { display: inline-flex; align-items: center; gap: 8px; }
.card__op .tech--5g { font-size: 12px; padding: 3px 8px; }

.empty { color: var(--muted); max-width: var(--measure); }
.empty a { color: var(--ink); text-decoration-color: var(--red); text-underline-offset: 3px; }

/* ------------------------------------------------------------------ alert */
.alert { background: var(--paper); border: 1px solid var(--red); border-radius: var(--r);
  padding: 18px 22px; margin-bottom: 8px; box-shadow: var(--sh-1); }
.alert__title { font-weight: 700; margin: 0 0 6px; letter-spacing: -0.01em; }
.alert p:last-child { margin: 0; color: var(--muted); font-size: 0.95rem; }
.alert--quiet { border-color: var(--edge); }

/* ------------------------------------------------------------------- spec */
.spec { width: 100%; border-collapse: collapse; max-width: 880px;
  background: var(--paper); border: 1px solid var(--edge); border-radius: var(--r);
  overflow: hidden; box-shadow: var(--sh-2); }
.spec th, .spec td { text-align: left; vertical-align: top; padding: 17px 22px;
  border-bottom: 1px solid var(--edge-soft); }
.spec tr:last-child th, .spec tr:last-child td { border-bottom: 0; }
.spec th { width: 13em; padding-right: 20px; font-size: 11.5px; font-weight: 600;
  letter-spacing: .07em; text-transform: uppercase; color: var(--faint); }
.spec td { font-size: 1rem; color: var(--ink-2); }
.spec__note { display: block; font-size: 0.88rem; color: var(--muted); margin-top: 6px; }
@media (max-width: 620px) {
  .spec, .spec tbody, .spec tr, .spec th, .spec td { display: block; width: auto; }
  .spec th { border-bottom: 0; padding: 16px 18px 4px; }
  .spec td { padding: 0 18px 16px; }
}

/* ----------------------------------------------------------------- checks */
.checks { counter-reset: c; list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; }
@media (min-width: 860px) { .checks { grid-template-columns: repeat(3, 1fr); } }
.checks li { counter-increment: c; background: var(--paper); border: 1px solid var(--edge);
  border-radius: var(--r); padding: clamp(22px, 3vw, 26px); box-shadow: var(--sh-1); }
.checks li::before { content: counter(c, decimal-leading-zero); display: block;
  font-size: 12px; font-weight: 700; letter-spacing: .08em; color: var(--red); margin-bottom: 12px; }
.checks h3 { font-size: 1.02rem; font-weight: 600; letter-spacing: -0.008em; margin: 0 0 10px; }
.checks p { margin: 0; font-size: 0.94rem; color: var(--muted); }

/* ------------------------------------------------------------------ notes */
.notes { display: grid; gap: 18px; }
@media (min-width: 860px) { .notes { grid-template-columns: repeat(3, 1fr); } }
.notes__item { background: var(--paper); border: 1px solid var(--edge); border-radius: var(--r);
  padding: clamp(22px, 3vw, 26px); box-shadow: var(--sh-1); }
.notes__item h3 { font-size: 1.02rem; font-weight: 600; letter-spacing: -0.008em; margin: 0 0 10px; }
.notes__item p { margin: 0; font-size: 0.94rem; color: var(--muted); }

/* ----------------------------------------------------------------- buybar */
.buybar { display: flex; flex-wrap: wrap; gap: 18px 32px; align-items: center;
  justify-content: space-between; background: var(--paper);
  border: 1px solid var(--edge); border-radius: 18px;
  padding: clamp(20px, 3vw, 28px); box-shadow: var(--sh-2); }
.buybar__price { font-size: 2.2rem; font-weight: 700; letter-spacing: -0.034em; margin: 0; color: var(--red-loud); }
.buybar__sub { margin: 6px 0 0; font-size: 0.95rem; color: var(--muted); }
.buybar__soon { margin: 0; font-size: 0.95rem; color: var(--muted); max-width: 34ch; }

/* telefonda alt cubuk sabit */
@media (max-width: 620px) {
  .buybar { position: sticky; bottom: 0; z-index: 5; border-radius: 0;
    border-inline: 0; border-bottom: 0; margin-inline: calc(var(--gutter) * -1);
    padding-inline: var(--gutter); box-shadow: var(--sh-up); }
  .buybar__price { font-size: 1.6rem; }
}

/* Adim 14: cikis ulkesi */
.exit--local { color: var(--red); font-weight: 700; }

/* -------------------------------------------------------------- bolgeler */
.alsocovers {
  background: linear-gradient(110deg, var(--warm) 0%, var(--paper) 62%);
  border: 1px solid var(--edge); border-radius: 20px;
  padding: clamp(24px, 3vw, 30px) clamp(24px, 3vw, 34px);
  display: flex; flex-wrap: wrap; gap: 20px 34px; align-items: center;
}
.alsocovers > div { flex: 1 1 380px; }
.alsocovers h2 { margin: 0 0 8px; font-size: 1.5rem; font-weight: 700; letter-spacing: -0.024em; }
.alsocovers p { margin: 0; color: var(--muted); font-size: 0.97rem; max-width: 62ch; }

/* ============================================================================
   GOJOWA — 19. adim: vitrin yapisi.
   Bu blok shop.css'in SONUNA eklenir. Mevcut kurallari degistirmez.
   ========================================================================== */

/* --------------------------------------------------------------- ana sayfa */
.homegrid { display: grid; gap: clamp(28px, 4vw, 56px); align-items: start; }
@media (min-width: 1020px) { .homegrid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); } }
.homegrid h1 { max-width: 13ch; }

.finder__row { display: flex; gap: 12px; align-items: stretch; }
.finder__row .finder__input { flex: 1 1 auto; }
.finder__row .btn { flex: none; white-space: nowrap; padding-inline: 26px; }
@media (max-width: 560px) { .finder__row { flex-direction: column; } .finder__row .btn { width: 100%; } }

.pills { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; margin: 18px 0 0; }
.pills__label { font-size: 13px; color: var(--faint); }
.pills a {
  text-decoration: none; font-size: 13.5px; font-weight: 500; color: var(--muted);
  background: var(--paper); border: 1px solid var(--edge); border-radius: 999px; padding: 7px 13px;
}
.pills a:hover { border-color: var(--red); color: var(--red-ink); }

/* ornek paket karti (hero sagi) */
.showcase {
  background: var(--paper); border: 1px solid var(--edge); border-radius: 22px;
  padding: 24px; box-shadow: var(--sh-3);
}
.showcase__head { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid var(--edge); }
.showcase__flag { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; flex: none; border: 1px solid var(--edge); }
.showcase__title { font-size: 15px; font-weight: 600; flex: 1 1 auto; }
.showcase__price { font-size: 1.6rem; font-weight: 700; letter-spacing: -0.03em; color: var(--red-loud); }
.showcase__facts { margin: 16px 0 0; display: grid; gap: 13px; }
.showcase__facts > div { display: grid; grid-template-columns: 8.4em 1fr; gap: 14px; align-items: start; }
.showcase__facts dt { font-size: 11.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); margin: 0; padding-top: 2px; }
.showcase__facts dd { margin: 0; font-size: 0.92rem; color: var(--ink-2); line-height: 1.45; }
.showcase__note { margin: 16px 0 0; font-size: 12.5px; color: var(--faint); }
@media (max-width: 560px) {
  .showcase__facts > div { grid-template-columns: 1fr; gap: 3px; }
  .showcase { padding: 20px; }
}

/* baslik satiri */
.headrow { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: baseline; justify-content: space-between; margin-bottom: 22px; }
.headrow .section__title { margin: 0; }
.headrow__more { font-size: 15px; font-weight: 600; color: var(--red-ink); text-decoration: none; }
.headrow__more:hover { text-decoration: underline; }

/* ------------------------------------------------- populer destinasyon karti */
.popcards { list-style: none; margin: 0; padding: 0; display: grid; gap: 20px; }
@media (min-width: 640px) { .popcards { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .popcards { grid-template-columns: repeat(3, 1fr); } }

.popcards a {
  display: block; text-decoration: none; color: inherit; overflow: hidden;
  background: var(--paper); border: 1px solid var(--edge); border-radius: 20px;
  box-shadow: var(--sh-2); transition: box-shadow .14s, transform .14s;
}
.popcards a:hover { box-shadow: var(--sh-3); transform: translateY(-2px); }

.popcard__band {
  display: block; height: 104px; background: var(--sunk); position: relative; overflow: hidden;
}
.popcard__band img {
  /* bayragin RENGI, sekli degil: bulanik zemin - hicbir bayrak kirpilmis gorunmez, ek dosya yok */
  width: 100%; height: 100%; object-fit: cover; display: block;
  filter: blur(28px) saturate(1.3); transform: scale(1.25);
}
.popcard__body { display: block; padding: 18px 20px 20px; }
.popcard__top { display: flex; align-items: baseline; gap: 12px; }
.popcard__name { font-size: 1.28rem; font-weight: 700; letter-spacing: -0.024em; flex: 1 1 auto; }
.popcard__price { font-size: 12.5px; color: var(--faint); white-space: nowrap; text-align: right; }
.popcard__price b { display: block; font-size: 1.15rem; font-weight: 700; letter-spacing: -0.022em; color: var(--red-loud); }
.popcard__meta { display: block; margin-top: 8px; font-size: 13.5px; color: var(--muted); line-height: 1.5; }

/* ----------------------------------------------------- A-Z listesinde bayrak */
.finder__list a { display: inline-flex; align-items: center; gap: 8px; }
.pillflag { width: 18px; height: 18px; border-radius: 50%; object-fit: cover; flex: none; border: 1px solid var(--edge); }

/* ---------------------------------------------------------- dort sey kartlari */
.notes--4 { gap: 18px; }
@media (min-width: 640px) { .notes--4 { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .notes--4 { grid-template-columns: repeat(4, 1fr); } }
.notes__icon { width: 24px; height: 24px; stroke: var(--red); fill: none; stroke-width: 1.7;
  stroke-linecap: round; stroke-linejoin: round; display: block; margin-bottom: 12px; }

/* --------------------------------------------------------- destinasyon basi */
.desthero { display: grid; gap: clamp(24px, 3vw, 44px); align-items: start; }
@media (min-width: 980px) { .desthero { grid-template-columns: minmax(0, 1fr) 320px; } }
.desthero h1 { margin: 0; }
.desthead { display: flex; align-items: center; gap: 18px; }
.destflag {
  width: 58px; height: 58px; border-radius: 50%; flex: none; overflow: hidden;
  border: 3px solid var(--paper); box-shadow: var(--sh-flag); background: var(--sunk);
}
.destflag img { width: 100%; height: 100%; object-fit: cover; display: block; }
.destflag--none { box-shadow: none; border: 1px dashed var(--edge-2); background: var(--sunk); }
@media (max-width: 560px) { .destflag { width: 42px; height: 42px; border-width: 2px; } }

.goodtoknow {
  background: var(--paper); border: 1px solid var(--edge); border-radius: 16px;
  padding: 20px 22px; box-shadow: var(--sh-2); display: grid; gap: 12px;
}
.goodtoknow__label { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase; color: var(--faint); }
.goodtoknow__item { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px;
  color: var(--muted); line-height: 1.5; }
.goodtoknow__item svg { width: 17px; height: 17px; flex: none; margin-top: 2px;
  stroke: var(--red); fill: none; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

/* grup basligi */
.grouphead { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: baseline; margin-bottom: 20px; }
.grouphead .section__title { margin: 0; }
.grouphead p { margin: 0; font-size: 15px; color: var(--muted); }

/* para birimi etiketi (Stripe: sembol tek basina yetmez) - kucuk ve soluk, fiyatin agirligini bozmaz */
.ccy { font-size: 0.4em; font-weight: 500; letter-spacing: .05em; color: var(--faint); margin-left: .4em; }

/* ------------------------------------------- 21. adim: bayrak rozeti + filtreler */
.popcards a { position: relative; }
.popcard__flag {
  position: absolute; left: 20px; top: 81px;             /* band 104px; rozet yari tasar */
  width: 46px; height: 46px; border-radius: 50%; object-fit: cover;
  border: 3px solid var(--paper); box-shadow: var(--sh-flag); background: var(--sunk);
}
.popcard__body { padding-top: 32px; }

.filters { flex-basis: 100%; display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  padding-top: 12px; border-top: 1px solid var(--edge); }
.filters a {
  text-decoration: none; font-size: 13px; font-weight: 500; color: var(--muted);
  background: var(--sunk); border: 1px solid var(--edge); border-radius: 999px; padding: 6px 12px;
}
.filters a:hover { color: var(--ink); border-color: var(--edge-2); }
.filters a[aria-pressed="true"] { background: var(--cta-bg); border-color: var(--cta-bg); color: var(--cta-fg); font-weight: 600; }
.filters__clear { background: transparent !important; border-color: transparent !important; color: var(--red-ink) !important; }

/* 63-3: cok secenekli filtreler acilir kutu. Seritler (5G/hotspot/yukleme) yukarida
   kaldi - "evet/hayir" olan bir filtreyi acilir kutuya koymak iki tik yapar. */
.filters--pick { gap: 10px 14px; }
.filters__pick { display: inline-flex; align-items: center; gap: 6px; }
.filters__lab { font-size: 12px; color: var(--muted); }
.filters--pick select {
  font: inherit; font-size: 13px; color: var(--ink); background: var(--paper);
  border: 1px solid var(--edge-2); border-radius: 8px; padding: 6px 8px; max-width: 200px;
}
.filters--pick select:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
@media (max-width: 560px) {
  /* Telefonda kutular alt alta ve tam genislik - yan yana sigismaya calisinca
     ulke adlari kirpiliyordu. */
  .filters--pick { flex-direction: column; align-items: stretch; }
  .filters__pick { justify-content: space-between; }
  .filters--pick select { flex: 1 1 auto; max-width: none; margin-left: 10px; }
}

/* 63-4 / 67-6: adet + iki dugme TEK SATIR. 63'te yazilmisti ama masaustunde yine alt
   alta dusuyordu: tablonun bes sutunu var, paket adi sutunu genisleyince islem sutunu
   sikisiyor ve flex-wrap satiri kiriyordu. Yalnizca "flex" demek yetmedi; sutunun
   KENDISINE de daralma izni vermek gerekti:
     - td:last-child { width: 1%; white-space: nowrap }  -> sutun icerigi kadar yer alir,
       kalan genisligi paket adi sutunu yutar (tablolarda bilinen yol),
     - .buyrow { flex-wrap: nowrap }                     -> satir kirilmaz.
   Telefonda (720px alti) bilerek alt alta duser. */
.buyrow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.buyrow__lab { margin: 0; }
.buyrow .qtyfield { width: 52px; }
@media (min-width: 720px) {
  .dealer-table td:last-child, .dealer-table th:last-child { width: 1%; white-space: nowrap; }
  .buyrow { flex-wrap: nowrap; }
}
@media (max-width: 719px) {
  .buyrow { flex-direction: column; align-items: stretch; }
  .buyrow .btn { width: 100%; }
}
.dealer-table .buyrow .btn { padding: 4px 9px; font-size: 13px; }
.dealer-table .qtyfield { padding: 4px 6px; }

/* ------------------------------------------- 30. adim: genis tablolar dar ekranda satir satir */
.spec--wide thead th { font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); width: auto; }
.spec--wide tbody th { width: 11em; }
@media (max-width: 600px) {
  .spec--wide thead { display: none; }
  .spec--wide, .spec--wide tbody, .spec--wide tr, .spec--wide th, .spec--wide td { display: block; width: auto; }
  .spec--wide tr { border-bottom: 1px solid var(--edge); padding: 12px 0; }
  .spec--wide th, .spec--wide td { padding: 4px 0; border-bottom: 0; }
  .spec--wide tbody th { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--faint); }
}

/* ----------------------------------------------------- odeme formu (Adim 34) */
/* Iki temada da calisir: yalnizca token, sabit hex yok. Form uzun; telefonda yapisik degil. */
.buybar--form { display: block; }
.buybar__head { margin-bottom: 22px; }
@media (max-width: 620px) {
  .buybar--form { position: static; border-radius: 18px; border: 1px solid var(--edge); margin-inline: 0;
    padding-inline: clamp(20px, 3vw, 28px); box-shadow: var(--sh-2); }
}
.buy { display: grid; gap: 18px; max-width: 560px; }
.buy__field { display: grid; gap: 7px; }
.buy label { font-weight: 600; font-size: 0.97rem; color: var(--ink); }
.buy input[type="email"], .buy select {
  width: 100%; font: inherit; font-size: 1.05rem; color: var(--ink);
  background: var(--paper); border: 1px solid var(--edge-2); border-radius: 12px;
  padding: 14px 16px; min-height: 48px; box-shadow: var(--sh-1);
}
.buy select { appearance: none; -webkit-appearance: none; padding-right: 44px;
  background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
  background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px, 6px 6px; background-repeat: no-repeat; }
.buy input:focus-visible, .buy select:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; border-color: transparent; }
.buy__hint { margin: 0; font-size: 0.88rem; color: var(--muted); }
.buy__hint--center { text-align: center; }
/* Adim 50-2: puan aciklamasi onay kutusu grid'inin DISINDA duruyor; kendi araligi burada. */
.buy__points-note { margin: -4px 0 0; }
/* Adim 50-3: kasada "su hesapla girdiniz" satiri */
.buy__signedin { margin: -4px 0 0; }
.buy__consent { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; }
.buy__consent input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--cta-bg); }
.buy__consent label { font-weight: 400; font-size: 0.93rem; color: var(--ink-2); line-height: 1.45; }
.buy__consent a { color: inherit; }
.buy__pay { min-height: 52px; font-size: 1.05rem; }
.buy__pay:disabled { opacity: .55; cursor: not-allowed; box-shadow: none; }
.buy__error { margin: 0; padding: 12px 14px; border-radius: 10px; font-size: 0.93rem;
  color: var(--amber); background: var(--amber-bg); border: 1px solid var(--amber-edge); }
.buy__eu { padding: 18px 20px; border-radius: 14px; background: var(--sunk); border: 1px solid var(--edge-2); }
.buy__eu p { margin: 0 0 10px; font-size: 0.95rem; color: var(--ink-2); max-width: 56ch; }
.buy__eu p:last-child { margin-bottom: 0; }
.buy__eu-title { font-weight: 700; color: var(--ink); }
.buy__eu:focus { outline: 2px solid var(--red); outline-offset: 2px; }
/* Adim 44b: AB engeli altindaki "acildigimizda haber ver" kutusu */
.euwait { margin-top: 14px; padding: 18px 20px; border-radius: 14px; border: 1px dashed var(--edge-2); background: var(--paper); display: grid; gap: 10px; }
.buy__eu .euwait { margin-bottom: 0; }
.buy__eu .euwait p { max-width: none; }
.euwait__title { margin: 0; font-weight: 700; color: var(--ink); }
.euwait__hint { margin: 0; font-size: 0.9rem; color: var(--muted); }
.euwait__row { display: flex; gap: 8px; flex-wrap: wrap; align-items: stretch; }
.euwait__row .finder__input { flex: 1 1 200px; margin: 0; min-width: 0; }
.euwait__row .btn { flex: 0 0 auto; white-space: nowrap; }
.euwait__consent label { font-size: 0.86rem; }
.hero .euwait { max-width: 560px; text-align: left; }
.buy__turnstile { min-height: 65px; }
.buy__cards { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 0; }
.buy__card { font-size: 12px; font-weight: 600; letter-spacing: .04em; color: var(--muted);
  border: 1px solid var(--edge); border-radius: 6px; padding: 4px 8px; background: var(--paper); }

/* Adim 40b: destinasyon sayfasinda 'Good to know' sekmelerin altinda yatay serit */
.goodtoknow--row { margin-top: 18px; box-shadow: none; background: var(--sunk); }
@media (min-width: 760px) {
  .goodtoknow--row { grid-template-columns: auto 1fr 1fr 1fr; align-items: center; gap: 22px; padding: 14px 22px; }
  .goodtoknow--row .goodtoknow__label { align-self: center; }
}

/* Adim 40c: siparis sayfasi eSIM parcasi (QR + LPA + adimlar + kunye) */
.esim__grid { display: grid; gap: 28px; }
@media (min-width: 860px) { .esim__grid { grid-template-columns: 320px 1fr; gap: 40px; } }
.esim__img { display: block; width: 260px; max-width: 100%; height: auto; border: 1px solid var(--edge); border-radius: 14px;
  background: var(--paper); padding: 10px; box-sizing: content-box; }
.esim__hint { font-size: 13.5px; color: var(--muted); margin: 10px 0 0; }
.esim__label { font-size: 11.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); margin: 20px 0 6px; }
.esim__lpa { display: flex; gap: 8px; align-items: center; background: var(--sunk); border: 1px solid var(--edge); border-radius: 12px; padding: 8px 8px 8px 12px; margin: 0 0 16px; }
.esim__lpa code { flex: 1 1 auto; min-width: 0; font-size: 13px; word-break: break-all; color: var(--ink); }
.esim__steps h3 { margin: 0 0 8px; font-size: 1.05rem; }
.esim__steps h3 + ol { margin: 0 0 22px; padding-left: 22px; }
.esim__steps li { margin: 0 0 8px; color: var(--ink-2); }
.esim__spec { max-width: 720px; }
.esim__spec .pillflag { vertical-align: -3px; border-radius: 50%; }

/* Adim 41a: hesap sayfasi, flash mesajlar */
.flash { margin: 0 0 8px; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--edge); background: var(--sunk); font-size: 14px; }
.flash--success { border-color: var(--ok); color: var(--ok); }
.flash--error { border-color: var(--price); color: var(--price); }
.linkbtn { background: none; border: 0; padding: 0; font: inherit; color: var(--cta-bg); text-decoration: underline; cursor: pointer; }
.socialbtn { gap: 10px; }
.masthead__acct { white-space: nowrap; }
.acct__head { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.acct { display: grid; gap: 28px; }
@media (min-width: 900px) { .acct { grid-template-columns: 1fr 320px; gap: 40px; align-items: start; } }
.acct__card { border: 1px solid var(--edge); border-radius: 14px; padding: 16px 18px; background: var(--paper); margin-bottom: 16px; }
.acct__card--danger { border-style: dashed; }
.acct__card--claim { background: var(--sunk); border-color: var(--best-edge); }
.acct__claimlist { margin: 0 0 12px; padding-left: 18px; font-size: 14px; color: var(--muted); }
.acct__card--claim form { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; }
.acct__card--inline { display: block; }
.acct__inlineform { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.acct__inlineform .finder__input { flex: 1 1 220px; margin: 0; }
.acct__big { font-size: 2rem; font-weight: 800; margin: 0; color: var(--price); }
.acct__big small { font-size: 0.9rem; font-weight: 600; color: var(--muted); }
.acct__orders td, .acct__orders th { padding: 12px 14px; font-size: 14px; }
.acct__orders thead th { width: auto; font-size: 11.5px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); }
.acct__ledger td { padding: 6px 4px; font-size: 13px; border-bottom: 1px solid var(--edge-soft); }
.acct__ledger td.num { text-align: right; font-variant-numeric: tabular-nums; }
.acct__check { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; }

/* Adim 42: dar ekranda siparis tablosunun baslik satiri (stacked gorunumde anlamsiz) */
@media (max-width: 640px) { .acct__orders thead { display: none; } .acct__orders td { padding: 6px 14px; } .acct__orders tr { display: block; padding: 8px 0; border-bottom: 1px solid var(--edge); } }

/* ------------------------------------------- Adim 73: siparisler katlanir
   Desen 70b'nin ayni. Iki kural burada da gecerli:
   1) summary'ye display:flex / grid VERILMEZ - WebKit'te tiklamayi yutuyor ve
      acilan satir bir daha kapanmiyor (Bahadir Safari 26.2 kullaniyor). Duzen
      summary'nin ICINDEKI .ord__row'da.
   2) align-items:start - acilan satir komsusunu germesin. */
.ords { display: grid; gap: 10px; align-items: start; }
.ord { border: 1px solid var(--edge); border-radius: 14px; background: var(--paper); }
.ord[open] { border-color: var(--best-edge); box-shadow: var(--sh-2); }
.ord > summary { cursor: pointer; list-style: none; display: block; padding: 13px 16px; }
.ord > summary::-webkit-details-marker { display: none; }
.ord > summary::marker { content: ""; }
.ord > summary:hover { background: var(--sunk); border-radius: 13px; }
.ord > summary:focus-visible { outline: 2px solid var(--cta-bg); outline-offset: -2px; }

/* Telefon: iki satir. Tabloyu yigmak YOK (66b dersi) - izgara alanlari. */
.ord__row {
  display: grid; gap: 3px 12px; align-items: center; font-size: 14px;
  grid-template-columns: 14px minmax(0, 1fr) auto;
  grid-template-areas: "ok nerede odenen" ".  orta   durum";
}
.ord__ok { grid-area: ok; width: 7px; height: 7px; align-self: center;
  border-right: 2px solid var(--faint); border-bottom: 2px solid var(--faint);
  transform: rotate(45deg) translate(-1px, -1px); transition: transform .12s; }
.ord[open] .ord__ok { transform: rotate(-135deg) translate(-2px, -2px); }
.ord__where { grid-area: nerede; font-weight: 600; color: var(--ink);
  display: inline-flex; align-items: center; gap: 7px; min-width: 0; }
.ord__mid { grid-area: orta; color: var(--muted); font-size: 13px; min-width: 0; }
.ord__paid { grid-area: odenen; font-weight: 600; white-space: nowrap; }
.ord__state { grid-area: durum; color: var(--muted); font-size: 13px; white-space: nowrap; }

@media (min-width: 760px) {
  .ord__row { grid-template-columns: 14px minmax(0, 1fr) minmax(0, 1.5fr) auto auto;
              grid-template-areas: "ok nerede orta odenen durum"; gap: 0 18px; }
}

.ord__body { border-top: 1px solid var(--edge-soft); padding: 4px 16px 16px; }
.ord__no { margin: 12px 0 0; font-size: 13px; color: var(--muted); }
.ord__no code { font-size: 13.5px; }
.ord__pending { margin: 10px 0 4px; font-size: 14px; color: var(--muted); }
/* eSIM parcasi sayfa bolumu olarak yazilmis (wrap + section); kart icinde o
   dolgular fazla. Parcanin KENDISI degismiyor - uc yerde daha kullaniliyor. */
.ord__body > .esim { max-width: none; padding-inline: 0; padding-block: 0; }
.ord__body > .esim > h2 { margin-top: 26px; }

/* Adim 45: bayi basvuru formu */
.dform { display: grid; gap: 12px; }
.dform__field { display: grid; gap: 6px; }
.dform__field label { font-weight: 600; font-size: 0.93rem; }
.dform__field input:not([type=checkbox]), .dform__field select, .dform__field textarea { width: 100%; box-sizing: border-box; font: inherit;
  padding: 10px 12px; border: 1px solid var(--edge-2); border-radius: 10px; background: var(--paper); color: var(--ink); }
.dform__field textarea { resize: vertical; }
.dform__field--check { grid-template-columns: 22px 1fr; gap: 10px; align-items: start; }
.dform__field--check input { width: 22px; height: 22px; margin: 2px 0 0; accent-color: var(--cta-bg); }
.dform__field--check label { font-weight: 400; font-size: 0.88rem; color: var(--ink-2); line-height: 1.45; }
.dform__field--check .dform__error { grid-column: 1 / -1; }
.dform__field.is-invalid input, .dform__field.is-invalid select { border-color: var(--price); }
.dform__error { margin: 0; font-size: 0.86rem; color: var(--price); }
.dealer-table { width: 100%; border-collapse: collapse; font-size: 0.93rem; }
.dealer-table th, .dealer-table td { text-align: left; padding: 5px 6px; border-bottom: 1px solid var(--edge); vertical-align: top; }
.dealer-table td.num, .dealer-table th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* Adim 46c: operator listesi - 2'den fazlaysa katlanir (<details>, JavaScript yok) */
.ops { display: block; }
.ops__sum { cursor: pointer; list-style: none; display: block; }
.ops__sum::-webkit-details-marker { display: none; }
.ops__more { display: inline-block; margin-top: 4px; font-size: 0.85rem; font-weight: 700; color: var(--cta-bg);
  border-bottom: 1px dashed currentColor; }
.ops__sum:focus-visible { outline: 2px solid var(--cta-bg); outline-offset: 2px; border-radius: 6px; }
.ops[open] > .ops__sum .ops__prev { display: none; }          /* acikken tam liste asagida; ayni ad iki kez yazilmaz */
.ops[open] > .ops__sum .ops__more::after { content: " ×"; }
.ops__all { margin-top: 4px; }
.ops__group { margin-bottom: 8px; }
.ops__country { font-size: 0.82rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }

/* Adim 52: kullanim karti (kalan veri) */
.esim__usage { margin: 18px 0 0; padding: 14px 16px; border: 1px solid var(--edge); border-radius: 12px;
  background: var(--paper); }
.usage__big { margin: 0 0 8px; font-size: 1.35rem; font-weight: 700; color: var(--ink); }
.usage__bar { height: 8px; border-radius: 99px; background: var(--sunk); overflow: hidden; margin: 0 0 8px; }
.usage__bar span { display: block; height: 100%; background: var(--cta-bg); }
.usage__line { margin: 0; font-size: 0.9rem; color: var(--ink-2); }
.usage__note { margin: 8px 0 0; font-size: 0.9rem; color: var(--ink-2); }
.usage__foot { display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
  margin: 12px 0 0; font-size: 0.8rem; color: var(--muted); }

/* Adim 55: uyumluluk sayfasi + kurulum videolari */
.devcheck { margin: 18px 0 26px; padding: 18px 20px; border-radius: 14px;
  background: var(--sunk); border: 1px solid var(--edge-2); }
.devcheck__lead { margin: 0 0 8px; font-size: 1.1rem; color: var(--ink); }
.devcheck__note { margin: 0; font-size: 0.9rem; color: var(--ink-2); }
.devcheck__warn { margin: 0 0 10px; padding: 12px 14px; border-radius: 10px;
  color: var(--amber); background: var(--amber-bg); border: 1px solid var(--amber-edge); }
.devcheck__shots, .devcheck__videos { display: grid; gap: 16px; margin: 16px 0 0; }
@media (min-width: 720px) { .devcheck__shots, .devcheck__videos { grid-template-columns: 1fr 1fr; } }
.devcheck__shots figure { margin: 0; }
.devcheck__shots img { width: 100%; height: auto; border-radius: 10px; border: 1px solid var(--edge); }
.devcheck__shots figcaption { margin-top: 6px; font-size: 0.85rem; color: var(--muted); }
.buy__check { text-align: center; margin: 0 0 4px; }

.ytbox { margin: 0; }
.ytbox__play { display: block; position: relative; width: 100%; padding: 0; border: 0;
  background: none; cursor: pointer; border-radius: 12px; overflow: hidden; }
.ytbox__cover { display: block; width: 100%; height: auto; }
/* Renkler belirtecten: fotograf uzerindeki metin icin --on-photo ve --photo-text-shadow var. */
.ytbox__icon { position: absolute; inset: 0; display: grid; place-items: center;
  font-size: 2.6rem; color: var(--on-photo); text-shadow: var(--photo-text-shadow); }
.ytbox__title { margin: 8px 0 0; font-size: 0.9rem; color: var(--ink-2); }
.ytbox iframe { width: 100%; aspect-ratio: 16 / 9; border: 0; border-radius: 12px; }

/* 63-5: bayi acilis sayfasinin sade ust bolumu. Ortalanmis logo, tek satir, iki dugme.
   Aciklayici metin silinmedi - asagida duruyor. */
.dealhero { text-align: center; }
.dealhero__mark { width: min(260px, 64vw); height: auto; margin: 0 auto 18px; }
.dealhero h1 { max-width: 22ch; margin-left: auto; margin-right: auto; font-size: clamp(1.6rem, 4vw, 2.5rem); }
.dealhero__cta { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 20px 0 0; }
.dealhero__note { margin: 14px auto 0; max-width: 46ch; font-size: 0.86rem; color: var(--muted); }
.dealhero__more { margin: 16px 0 0; font-size: 0.86rem; }
@media (max-width: 480px) { .dealhero__cta .btn { width: 100%; } }

/* 67-6: bayi katalogunda toplu CSV karti tablonun ALTINDA ve dar. Yan sutunda
   dururken tabloya 1280 piksellik ekranda yalnizca 641 piksel kaliyordu ve paket adi
   sutunu 98 piksele sikisip her satiri 196 piksel yapiyordu. */
.catalog__bulk { display: block; margin-top: 26px; max-width: 560px; }

/* ------------------------------------- 66b: bayi tablolari TELEFONDA (tarayici turu)
   360 piksel genislikte katalog 530, sepet 672 piksele tasiyordu: bes-alti sutunlu bir
   tablo telefona sigmaz. 30. adimda teknik ozellik tablosu icin kurulan desenin ayni:
   baslik satiri gizlenir, her satir kendi blogu olur ve HER HUCRE KENDI ETIKETINI
   tasir (data-label). Etiketsiz yigmak "$68,00"i baglamsiz birakirdi.

   Etiketlenmemis bayi tablolari icin guvenlik agi: kendi icinde kayar, SAYFA kaymaz.
   Boylece yeni bir tablo eklendiginde sayfa bozulmaz, en kotu ihtimalle tablo kayar. */
@media (max-width: 620px) {
  .dealer-table--stack thead { display: none; }
  .dealer-table--stack, .dealer-table--stack tbody,
  .dealer-table--stack tr, .dealer-table--stack td { display: block; width: auto; }
  .dealer-table--stack tr { border-bottom: 1px solid var(--edge); padding: 10px 0; }
  .dealer-table--stack td { display: grid; grid-template-columns: 7.2em minmax(0, 1fr);
    gap: 10px; padding: 3px 0; border-bottom: 0; text-align: left; }
  .dealer-table--stack td.num { text-align: left; white-space: normal; }
  .dealer-table--stack td::before {
    content: attr(data-label); font-size: 11.5px; font-weight: 600; letter-spacing: .06em;
    text-transform: uppercase; color: var(--faint); }
  .dealer-table--stack td[data-label=""] { grid-template-columns: 1fr; }
  .dealer-table--stack td[data-label=""]::before { content: none; }
  .dealer-table:not(.dealer-table--stack) { display: block; overflow-x: auto; }
}

/* 66b: kart bilgi satirlari telefonda ALT ALTA. "6.6em etiket + 1fr deger" duzeni 320
   piksellik kartta operator listesine yer birakmiyordu: kart en az 368 piksel istiyor,
   sayfa yana kayiyordu (Japonya sayfasinda 58 kart birden). */
@media (max-width: 480px) {
  .card__facts > div { grid-template-columns: 1fr; gap: 4px; padding: 10px 16px; }
  .card__facts dt { padding-top: 0; }
}

/* ------------------------------------------- Adim 79/B1: destek talepleri
   Satir duzeni .ord__row'un aynisi: tabloyu YIGMAK yok, izgara ALANLARI
   (66b dersi - telefonda tasmanin uc kalici sebebinden biri tablo yigmakti).
   minmax(0, 1fr): 1fr tek basina icerigi kadar genisler ve uzun konu adi
   satiri 390 pikselde tasirir. */
.tix { display: grid; gap: 10px; align-items: start; }
.tix__row {
  display: grid; gap: 3px 12px; align-items: center; font-size: 14px;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "topic state" "no    when";
  border: 1px solid var(--edge); border-radius: 14px; background: var(--paper);
  padding: 13px 16px; text-decoration: none; color: var(--ink);
}
.tix__row:hover { border-color: var(--best-edge); box-shadow: var(--sh-2); }
.tix__row:focus-visible { outline: 2px solid var(--cta-bg); outline-offset: -2px; }
.tix__row--done { opacity: .72; }
.tix__topic { grid-area: topic; font-weight: 600; min-width: 0; }
.tix__no { grid-area: no; color: var(--muted); font-size: 13px; min-width: 0; }
.tix__when { grid-area: when; color: var(--muted); font-size: 13px; white-space: nowrap; }
.tix__state { grid-area: state; font-size: 13px; white-space: nowrap; color: var(--price); font-weight: 600; }
.tix__row--done .tix__state { color: var(--muted); font-weight: 600; }

@media (min-width: 760px) {
  .tix__row { grid-template-columns: 11ch minmax(0, 1fr) auto auto;
              grid-template-areas: "no topic when state"; gap: 0 18px; }
}

/* Yazisma: bizim mesajlar sagda degil SOLDA ve farkli zeminde. Sohbet
   balonu taklidi yapilmadi - bu bir KAYIT, mesajlasma uygulamasi degil. */
.tix__thread { display: grid; gap: 14px; max-width: 720px; margin-top: 8px; }
.tix__msg { border: 1px solid var(--edge); border-left: 3px solid var(--edge);
            border-radius: 12px; padding: 12px 16px; background: var(--paper); }
.tix__msg--us { background: var(--sunk); border-left-color: var(--cta-bg); }
.tix__meta { margin: 0 0 6px; font-size: 11.5px; letter-spacing: .06em;
             text-transform: uppercase; color: var(--faint); }
.tix__body { margin: 0; font-size: 15px; line-height: 1.55; overflow-wrap: anywhere; }