/* ============================================================
   PALET — ameliyathane malzemeleri: cerrahi yeşil örtü, serum,
   gazlı bez beyazı, tek sıcak ton olarak ten rengi.
   ============================================================ */
:root{
  --paper:#FBFBFA;
  --raise:#FFFFFF;
  --ink:#0D1412;
  --line:#E3E5E1;
  --line-soft:#EFF0ED;
  --muted:#79837E;
  --surgical:#1F5C50;
  --surgical-deep:#123B33;
  --saline:#A8C6BC;
  --skin:#E7B79E;
  --alert:#C4523F;
  --star:#F0A828;
  --tp:#00B67A;

  --map-land:#EEF1EB;
  --map-block:#E1E7DF;
  --map-block-2:#D8E0D8;
  --map-park:#CFE1D3;
  --map-water:#B6D0C9;
  --map-water-2:#9CBDB4;
  --map-road:#FCFDFC;
  --map-road-edge:#E3E9E3;
  --map-text:#8B978F;

  --ring:conic-gradient(from 200deg,#123B33,#1F5C50,#4E9384,#A8C6BC,#E7B79E,#123B33);
  /* profil fotoğrafındaki hikâye halkası — Instagram'ın kendi hikâye renkleri */
  --ring-story:conic-gradient(from 200deg,#FEDA75,#FA7E1E,#D62976,#962FBF,#4F5BD5,#962FBF,#D62976,#FA7E1E,#FEDA75);
  --r:14px;
  --max:935px;
  /* sayfanın yan boşluğu: telefonda 16px, tablet/laptopta 40px'e kadar açılır */
  --yan:clamp(16px,4vw,40px);
  --fade:.22s cubic-bezier(.4,0,.2,1);
}
[data-theme="dark"]{
  --map-land:#0F1817;
  --map-block:#16211F;
  --map-block-2:#1C2825;
  --map-park:#15302A;
  --map-water:#0D2521;
  --map-water-2:#091B18;
  --map-road:#26332F;
  --map-road-edge:#1A2421;
  --map-text:#5E6E68;
  --paper:#0A0F0E;
  --raise:#121918;
  --ink:#F2F5F3;
  --line:#232E2B;
  --line-soft:#1A2321;
  --muted:#8A968F;
  --saline:#7FA79B;
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:66px}
body{
  overflow-x:clip;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  background:var(--paper);color:var(--ink);
  font-size:14px;line-height:1.45;
  transition:background var(--fade),color var(--fade);
}
img,svg,video,iframe{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer;touch-action:manipulation}
a,button,select,input[type=checkbox]{touch-action:manipulation}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--surgical);outline-offset:2px;border-radius:4px}
[data-theme="dark"] :focus-visible{outline-color:var(--saline)}

.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--yan)}

/* ====== FOTOĞRAF KUTUSU ======
   Her fotoğraf bunun içine giriyor. Dosya bulunamazsa arkadaki yeşil zemin +
   "GÖRSEL YOK" yazısı görünür, sayfa bozulmaz.
   DİKKAT: yazı YALNIZCA kutuda <img> kalmadığında çıkar. Dosya bulunamayınca
   img kendini siler (onerror), yazı o zaman görünür. Fotoğraf inerken img
   yerinde durduğu için yazı çıkmaz — yoksa yüklenme sırasında "görsel yok"
   yazıyor gibi görünüyordu. */
/* --- FOTOĞRAF KUTUSU ---
   Yüklenirken yeşil bir blok yerine nötr bir iskelet zemin durur ve
   üzerinden ince bir parlama geçer. Fotoğraf gelince parlama söner.

   Güvenlik: FOTOĞRAFIN KENDİSİ hiçbir animasyona bağlı değildir, her
   zaman görünürdür. Parlama üstte duran ince bir katmandır ve sayılı
   turdan sonra kendiliğinden biter — JS çalışmasa bile kalıcı olmaz. */
.ph{position:absolute;inset:0;overflow:hidden;display:block;
  background:linear-gradient(150deg,
    color-mix(in srgb,var(--ink) 8%,var(--raise)),
    color-mix(in srgb,var(--ink) 14%,var(--raise)))}
:root[data-theme="dark"] .ph{background:linear-gradient(150deg,#141C1A,#1B2422)}

.ph::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(105deg,transparent 38%,
    color-mix(in srgb,var(--ink) 8%,transparent) 50%,transparent 62%);
  transform:translateX(-100%);
  animation:phParla 1.5s ease-in-out 10;      /* sayılı tur — sonra kendiliğinden biter */
  transition:opacity .4s ease}
:root[data-theme="dark"] .ph::before{
  background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.06) 50%,transparent 62%)}
@keyframes phParla{to{transform:translateX(100%)}}
/* fotoğraf geldiğinde parlama hemen kesilir */
.ph.geldi::before{animation:none;opacity:0}
@media(prefers-reduced-motion:reduce){.ph::before{animation:none;opacity:0}}

.ph:not(:has(img))::after{content:'GÖRSEL YOK';position:absolute;inset:0;display:grid;place-items:center;
  font-family:'IBM Plex Mono',monospace;font-size:9px;letter-spacing:.18em;color:rgba(232,240,237,.42)}
.ph img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover}
/* .fit → fotoğrafın tamamı görünür (kırpılmaz); arkada bulanık kopyası durur */
.ph.fit img{object-fit:contain}
.ph.fit img.zemin{position:absolute;inset:0;z-index:0;object-fit:cover;
  filter:blur(26px) brightness(.55) saturate(1.15);transform:scale(1.2)}
.ph.fit-contain img{object-fit:contain;background:#0B1614}

/* ================= ÜST BAR ================= */
/* ================= MOBİL MENÜ ================= */
.menu-ac svg{stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
.menu-ac.acik svg{opacity:.55}
@media(min-width:900px){ .topbar .menu-ac{display:none} }

.menu-fon{position:fixed;inset:0;z-index:58;background:rgba(5,16,13,.45);
  opacity:0;transition:opacity .22s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.menu-fon.on{opacity:1}
.menu-fon[hidden]{display:none}

.mobil-menu{position:fixed;left:8px;right:8px;top:calc(var(--topbar-h, 54px) + 6px);z-index:61;
  background:var(--raise);border:1px solid var(--line);border-radius:16px;padding:7px;
  box-shadow:0 24px 60px rgba(0,0,0,.28);
  opacity:0;transform:translateY(-10px) scale(.985);transform-origin:top right;
  transition:opacity .22s ease,transform .26s cubic-bezier(.22,.7,.3,1)}
.mobil-menu.on{opacity:1;transform:none}
.mobil-menu[hidden]{display:none}
@media(min-width:560px){ .mobil-menu{left:auto;right:10px;width:320px} }
@media(min-width:900px){ .mobil-menu,.menu-fon{display:none!important} }

.mm-baslik{padding:9px 12px 7px;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted)}
.mm-satir{width:100%;display:flex;align-items:center;gap:12px;padding:12px;border-radius:11px;
  background:none;border:0;color:var(--ink);font-size:14.5px;font-weight:500;text-align:left;
  cursor:pointer;transition:background .15s}
.mm-satir:hover,.mm-satir:active{background:var(--line-soft)}
.mm-ikon{width:34px;height:34px;flex:none;border-radius:10px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--surgical) 11%,var(--raise));
  border:1px solid color-mix(in srgb,var(--surgical) 20%,transparent);color:var(--surgical)}
:root[data-theme="dark"] .mm-ikon{color:var(--saline);
  background:color-mix(in srgb,var(--saline) 12%,var(--raise));
  border-color:color-mix(in srgb,var(--saline) 22%,transparent)}
.mm-ikon svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round}
.mm-ayrac{height:1px;background:var(--line);margin:7px 12px}
.mm-satir.vurgu .mm-ikon{background:#25D366;border-color:#25D366;color:#0A1B12}
@media(prefers-reduced-motion:reduce){
  .mobil-menu,.menu-fon{transition:none}
}

.topbar{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line)}
.topbar-in{max-width:var(--max);margin:0 auto;height:52px;padding:0 14px;display:flex;align-items:center;gap:12px}
.handle{display:flex;align-items:center;gap:5px;font-weight:600;font-size:15px;letter-spacing:-.01em}
/* onay rozeti — Instagram'ın mavisi, her iki temada aynı */
.verified{width:14px;height:14px;flex:none;color:#0095F6;display:inline-block;
  vertical-align:-2px;margin-left:1px}
/* isim satırlarında hizalı dursun */
.p-name .verified{width:16px;height:16px;vertical-align:-3px;margin-left:3px}
.sheet-head .nm .verified{width:13px;height:13px;margin-left:4px}
.reel-who b .verified{width:13px;height:13px;margin-left:4px;
  filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
#s-name .verified{width:13px;height:13px;margin-left:3px}
.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:16px}
.icon-btn{width:26px;height:26px;display:grid;place-items:center;position:relative;color:var(--ink)}
.icon-btn svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.dot{position:absolute;top:-1px;right:-3px;min-width:15px;height:15px;padding:0 4px;border-radius:8px;background:var(--alert);color:#fff;font-size:9px;font-weight:700;display:grid;place-items:center;border:2px solid var(--paper)}

/* ================= PROFİL ================= */
.profile{padding:20px var(--yan) 0}
/* profil fotoğrafı ve isim yan yana; sayılar altta tam genişlikte */
.p-head{display:flex;gap:16px;align-items:center}
.p-kim{min-width:0;flex:1}
/* --- HİKÂYE HALKASI: kalın, dönen degrade + fotoğrafla arasında boşluk --- */
.avatar-ring{width:104px;height:104px;flex:none;border-radius:50%;padding:4px;
  display:grid;place-items:center;position:relative;cursor:pointer;background:none;
  transition:transform .25s cubic-bezier(.22,.7,.3,1),filter .25s ease}
/* dönen renkli halka */
.avatar-ring::before{content:'';position:absolute;inset:0;border-radius:50%;z-index:0;
  background:var(--ring-story);animation:ringDon 7s linear infinite}
/* dışa doğru açılan nabız */
/* Nabız efekti transform+opacity ile yapılır. box-shadow animasyonu ekran
   kartına devredilemediği için her karede yeniden boyama gerektiriyor ve
   sayfa kaydırmasını takılmalı hale getiriyordu. */
.avatar-ring::after{content:'';position:absolute;inset:0;border-radius:50%;z-index:0;
  pointer-events:none;border:2px solid rgba(214,41,118,.5);
  animation:ringNabiz 2.8s ease-out infinite}
.avatar{width:100%;height:100%;border-radius:50%;border:3px solid var(--paper);
  display:grid;place-items:center;overflow:hidden;position:relative;z-index:2}
.avatar .ph:not(:has(img))::after{content:'DR'}
.avatar-ring:hover{transform:scale(1.04)}
.avatar-ring:hover::before{animation-duration:2.2s}

/* profil hikâyesi boşken: renkli halka, nabız ve oynat işareti kalkar */
.avatar-ring.bos{cursor:default}
.avatar-ring.bos::before{background:var(--line);animation:none}
.avatar-ring.bos::after,.avatar-ring.bos .avatar-story-badge{display:none}
.avatar-ring.bos:hover{transform:none}

.avatar-story-badge{position:absolute;right:1px;bottom:0;width:28px;height:28px;border-radius:50%;
  background:#fff;color:var(--surgical-deep);display:grid;place-items:center;z-index:3;
  border:2px solid var(--paper);box-shadow:0 6px 14px rgba(0,0,0,.28)}
.avatar-story-badge svg{width:12px;height:12px;fill:currentColor;margin-left:1px}

@keyframes ringDon{to{transform:rotate(360deg)}}
@keyframes ringNabiz{
  0%{transform:scale(1);opacity:.55}
  70%{transform:scale(1.24);opacity:0}
  100%{transform:scale(1.24);opacity:0}}
@media(prefers-reduced-motion:reduce){
  .avatar-ring::before{animation:none}
  .avatar-ring::after{display:none}
}
/* sayılar ismin altında, fotoğrafın yanında — sola hizalı */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;
  text-align:left;align-items:start;margin-top:11px}
.stat{min-width:0}
.stat b{display:block;font-family:'IBM Plex Mono',monospace;font-size:16px;font-weight:500;letter-spacing:-.03em;white-space:nowrap}
.stat span{display:block;font-size:11px;color:var(--muted);white-space:nowrap;margin-top:1px}
.stat-location b{font-family:'Inter',sans-serif;font-size:14px;font-weight:700;letter-spacing:-.01em}
.p-body{padding-top:14px}
.p-name{font-size:16px;font-weight:600;letter-spacing:-.012em;line-height:1.25}
.p-role{font-size:13px;color:var(--muted);line-height:1.4}
/* konum satırı — sayıların yanında değil, unvanın altında */
.p-yer{display:flex;align-items:center;gap:6px;margin-top:5px;font-size:12.5px;color:var(--muted)}
.p-yer svg{width:14px;height:14px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}
.p-yer:empty{display:none}
.p-services{list-style:none;display:flex;flex-wrap:wrap;gap:7px 14px;margin-top:12px;max-width:680px}
.p-services li{display:flex;align-items:center;gap:7px;font-size:13.5px;font-weight:500;line-height:1.35}
.p-services li::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--surgical);box-shadow:0 0 0 3px color-mix(in srgb,var(--surgical) 12%,transparent);flex:none}
[data-theme="dark"] .p-services li::before{background:var(--saline);box-shadow:0 0 0 3px color-mix(in srgb,var(--saline) 12%,transparent)}
.p-cta{display:flex;gap:8px;margin-top:16px}
.btn{flex:1;min-height:38px;border-radius:10px;font-size:13.5px;font-weight:650;display:flex;align-items:center;justify-content:center;gap:8px;padding:0 14px;transition:filter .15s,background .15s,transform .1s,box-shadow .15s}
.btn svg{width:17px;height:17px;flex:none}
.btn:active{transform:scale(.985)}
.btn-primary{background:var(--surgical);color:#F7FAF9;box-shadow:0 6px 18px color-mix(in srgb,var(--surgical) 18%,transparent)}
.btn-primary:hover{filter:brightness(1.12);box-shadow:0 8px 22px color-mix(in srgb,var(--surgical) 24%,transparent)}
.btn-wa{background:#25D366;color:#07130d}
.btn-wa svg{fill:currentColor}

.wa-pulse{position:relative;overflow:hidden;isolation:isolate;animation:waHalo 3.6s cubic-bezier(.24,.6,.28,1) infinite}
.wa-pulse::before{content:'';position:absolute;top:-20%;bottom:-20%;width:32%;left:-45%;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.42),transparent);
  transform:skewX(-16deg);animation:waSheen 3.6s cubic-bezier(.4,0,.2,1) infinite}
@keyframes waHalo{
  0%{box-shadow:0 6px 18px rgba(37,211,102,.16),0 0 0 0 rgba(37,211,102,.38)}
  62%{box-shadow:0 6px 18px rgba(37,211,102,.16),0 0 0 13px rgba(37,211,102,0)}
  100%{box-shadow:0 6px 18px rgba(37,211,102,.16),0 0 0 0 rgba(37,211,102,0)}}
@keyframes waSheen{0%{left:-45%}38%{left:118%}100%{left:118%}}
.wa-pulse:hover,.wa-pulse:hover::before{animation-play-state:paused}
.wa-pulse:hover{filter:brightness(1.06)}
.btn-sq{flex:none;width:38px;background:var(--line-soft);border-radius:9px;display:grid;place-items:center}
@media(max-width:660px){
  .p-head{gap:14px;align-items:center}
  .avatar-ring{width:92px;height:92px}
  .stats{gap:3px}
  .stat b{font-size:15px}
  .stat span{font-size:10.5px}
  .stat b{font-size:15px}
  .stat-location b{font-size:13px}
  .p-services{display:grid;gap:7px;margin-top:12px}
  .p-cta{flex-wrap:wrap}
  .p-cta .btn{flex:1 1 calc(50% - 26px)}
}
@media(max-width:420px){
  .p-cta .btn{flex-basis:100%}
}

/* ================= ÖNE ÇIKANLAR ================= */
.hl{margin-top:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.hl-scroll{display:flex;gap:16px;overflow-x:auto;scrollbar-width:none;padding:2px var(--yan);max-width:var(--max);margin:0 auto}
.hl-scroll::-webkit-scrollbar{display:none}
.hl-item{flex:none;width:70px;text-align:center;cursor:pointer}
.hl-circle{width:66px;height:66px;border-radius:50%;padding:2px;background:var(--ring);transition:transform .18s}
/* --- vurgulu hikâye (örn. Events): dönen parlak halka + nefes alan ışık --- */
.hl-item.vurgu .hl-circle{position:relative;background:none;padding:3px;overflow:visible}
.hl-item.vurgu .hl-circle::before{content:'';position:absolute;inset:0;border-radius:50%;z-index:0;
  background:conic-gradient(from 0deg,#F6E6C8,#E7B79E,#C4523F,#E7B79E,#F6E6C8);
  animation:vurguDon 4.5s linear infinite}
.hl-item.vurgu .hl-circle::after{content:'';position:absolute;inset:0;border-radius:50%;z-index:0;
  pointer-events:none;border:2px solid rgba(231,183,158,.55);
  animation:vurguParla 2.4s ease-out infinite}
.hl-item.vurgu .hl-inner{position:relative;z-index:1}
@keyframes vurguDon{to{transform:rotate(360deg)}}
@keyframes vurguParla{
  0%{transform:scale(1);opacity:.6}
  70%{transform:scale(1.2);opacity:0}
  100%{transform:scale(1.2);opacity:0}}
.hl-item.vurgu .hl-label{color:var(--ink);font-weight:600}
@media(prefers-reduced-motion:reduce){
  .hl-item.vurgu .hl-circle::before{animation:none}
  .hl-item.vurgu .hl-circle::after{display:none}
}
.hl-item:hover .hl-circle,.hl-item:focus-visible .hl-circle{transform:scale(1.045)}
.hl-inner{width:100%;height:100%;border-radius:50%;border:2.5px solid var(--paper);background:var(--raise);display:grid;place-items:center;overflow:hidden;position:relative}
.hl-inner .ph:not(:has(img))::after{font-size:7px}
.hl-item.seen .hl-circle{background:var(--line)}
.hl-label{font-size:11.5px;margin-top:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ================= SEKMELER ================= */
.tabs{display:flex;justify-content:center;max-width:var(--max);margin:0 auto;border-bottom:1px solid var(--line-soft)}
.tab{flex:1;max-width:200px;height:46px;display:flex;align-items:center;justify-content:center;gap:6px;color:var(--muted);border-top:1px solid transparent;margin-top:-1px;font-size:10.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;transition:color .15s}
.tab svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8}
.tab[aria-selected="true"]{color:var(--ink);border-top-color:var(--ink)}
.tab-label{display:none;white-space:nowrap}
@media(min-width:700px){.tab-label{display:inline}}
.panel[hidden]{display:none}

/* ================= ÖNCESİ & SONRASI IZGARASI ================= */
.ba-shell{padding-top:14px}
.ba-toprow{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:14px}
.ba-copy h2{font-family:'Newsreader',serif;font-weight:300;font-size:24px;letter-spacing:-.02em;line-height:1.1}
.ba-copy p{margin-top:5px;font-size:12.5px;color:var(--muted);max-width:50ch}
.ig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;margin:0 calc(var(--yan)*-1);padding:2px 0 6px}
@media(min-width:640px){.ig-grid{gap:4px;margin:0}}
.tile{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--surgical-deep);cursor:pointer;border:0;padding:0;display:block;width:100%}
.tile .single{position:absolute;inset:0}
.tile .multi{position:absolute;top:7px;right:7px;z-index:3;color:#fff;opacity:.95;filter:drop-shadow(0 1px 3px rgba(0,0,0,.45))}
.tile .multi svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2;stroke-linejoin:round}
.tile-ov{position:absolute;inset:0;z-index:4;background:rgba(6,16,13,.46);display:flex;align-items:center;justify-content:center;gap:18px;color:#fff;font-size:13px;font-weight:600;opacity:0;transition:opacity .16s}
.tile:hover .tile-ov,.tile:focus-visible .tile-ov{opacity:1}
.tile-ov span{display:flex;align-items:center;gap:6px}
.tile-ov svg{width:16px;height:16px;fill:currentColor}
@media(hover:none){.tile-ov{display:none}}
.load-more{display:block;margin:16px auto 6px;height:42px;padding:0 22px;border:1px solid var(--line);border-radius:21px;background:var(--raise);color:var(--ink);font-size:13px;font-weight:600;transition:background .15s,border-color .15s}
.load-more:hover{background:var(--line-soft);border-color:var(--muted)}
.load-more[hidden]{display:none}
.tile-new{animation:tileIn .34s cubic-bezier(.2,.9,.3,1.1) backwards}
@keyframes tileIn{from{opacity:0;transform:scale(.96)}}
@media(max-width:600px){.ba-toprow{align-items:flex-start;flex-direction:column;gap:4px}}

/* ================= HASTA VİDEOLARI ================= */
.ugc-head{padding:16px 0 4px}
.ugc-head h2{font-family:'Newsreader',serif;font-weight:300;font-size:22px;letter-spacing:-.02em}
.ugc-head p{font-size:12.5px;color:var(--muted);margin-top:4px;max-width:54ch}
.reels{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;padding-top:14px}
@media(min-width:560px){.reels{grid-template-columns:repeat(3,1fr);gap:5px}}
.reel{position:relative;aspect-ratio:9/16;overflow:hidden;background:var(--surgical-deep);cursor:pointer;border-radius:2px}
.reel .veil{position:absolute;inset:0;z-index:2;background:linear-gradient(to top,rgba(6,20,16,.85) 12%,rgba(6,20,16,.05) 55%)}
.reel-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.16);backdrop-filter:blur(3px);border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;transition:transform .2s;z-index:3}
.reel:hover .reel-play{transform:translate(-50%,-50%) scale(1.12)}
.reel-play svg{width:15px;height:15px;fill:#fff;margin-left:2px}
.reel-dur{position:absolute;top:9px;right:9px;z-index:3;background:rgba(6,20,16,.55);border:1px solid rgba(255,255,255,.22);color:#EDF3F1;padding:3px 7px;border-radius:10px;font-size:8.5px;display:flex;align-items:center;gap:4px}
.reel-dur svg{width:9px;height:9px;fill:currentColor}
.reel-txt{position:absolute;inset:auto 0 0 0;z-index:3;padding:12px 11px;color:#EDF3F1}
.reel-txt .t{display:block;font-size:13px;font-weight:500;line-height:1.25;letter-spacing:-.01em}
.reel-who{display:flex;align-items:center;gap:6px;margin-top:8px}
.reel-who .av{width:18px;height:18px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:8px;font-weight:700;color:#fff}
.reel-who .hn{font-size:11px;opacity:.9}
.reel-who .vw{margin-left:auto;font-size:10px;opacity:.7;display:flex;align-items:center;gap:4px}
.reel-who .vw svg{width:10px;height:10px;fill:currentColor}

/* ================= YORUMLAR ================= */
.score-row{display:grid;gap:10px;padding:18px 0 4px}
@media(min-width:560px){.score-row{grid-template-columns:1fr 1fr}}
.score{background:var(--raise);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;display:flex;align-items:center;gap:13px}
.score .brand{width:26px;height:26px;flex:none}
.score .num{font-family:'IBM Plex Mono',monospace;font-size:20px;font-weight:500;letter-spacing:-.02em;line-height:1}
.score .of{font-size:11px;color:var(--muted);margin-left:2px}
.score .who{font-size:12.5px;font-weight:600;letter-spacing:-.01em}
.score .cnt{font-size:11px;color:var(--muted);margin-top:2px}
.score .right{margin-left:auto;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.stars{display:flex;gap:2px}
.stars svg{width:13px;height:13px}
.stars.tp svg{width:14px;height:14px}
.rev{display:grid;gap:12px;padding:14px 0 4px}
@media(min-width:640px){.rev{grid-template-columns:1fr 1fr}}
.rev-card{background:var(--raise);border:1px solid var(--line);border-radius:var(--r);padding:15px 16px 14px}
.rev-top{display:flex;align-items:center;gap:9px}
.rev-av{width:32px;height:32px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:12px;font-weight:700;color:#fff}
.rev-name{font-size:13px;font-weight:600;display:flex;align-items:center;gap:5px}
.rev-name .chk{width:12px;height:12px;flex:none}
.rev-loc{font-size:11px;color:var(--muted)}
.rev-src{margin-left:auto;width:18px;height:18px;flex:none;opacity:.9}
.rev-stars{display:flex;align-items:center;gap:8px;margin-top:11px}
.rev-stars .mono{color:var(--muted)}
.rev-baslik{font-size:14px;font-weight:600;letter-spacing:-.01em;margin-bottom:5px;line-height:1.3}
.rev-txt{font-size:13.5px;margin-top:8px;
  display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}
.rev-card.acik .rev-txt{-webkit-line-clamp:unset;overflow:visible}
.rev-daha{margin-top:8px;font-size:12.5px;font-weight:600;color:var(--surgical);
  background:none;border:0;padding:0;cursor:pointer}
:root[data-theme="dark"] .rev-daha{color:var(--saline)}
.rev-daha:hover{text-decoration:underline}

/* ================= LEAD / DM ================= */
.dm{scroll-margin-top:64px;margin-top:6px;border-top:1px solid var(--line);padding:32px var(--yan) 42px}

/* ================= HER ŞEY DAHİL PAKET (sağlık turizmi bölümü) ================= */
/* html'de zaten scroll-padding-top:66px var; buraya ek boşluk gerekmiyor
   yoksa bölüm çubuğun çok altında kalıyor */
.paket{scroll-margin-top:0;border-top:1px solid var(--line);padding:36px var(--yan) 48px;
  display:grid;gap:26px}

/* --- kademeli beliriş ---
   Gizleme YALNIZCA .animasyonlu sınıfı varken uygulanır; o sınıfı JS ekler.
   Böylece JS çalışmazsa içerik olduğu gibi görünür, gizli kalmaz. */
.paket.animasyonlu [data-gir]{opacity:0;transform:translateY(18px);
  transition:opacity .55s ease,transform .55s cubic-bezier(.22,.7,.3,1)}
.paket.animasyonlu [data-gir].gor{opacity:1;transform:none}
/* liste maddeleri soldan kayarak gelir — sırayla işaretlenen bir liste hissi */
.paket.animasyonlu .paket-liste li[data-gir]{transform:translate(-10px,10px)}
.paket.animasyonlu .paket-liste li[data-gir].gor{transform:none}
@media(prefers-reduced-motion:reduce){
  .paket.animasyonlu [data-gir],
  .paket.animasyonlu .paket-liste li[data-gir]{opacity:1;transform:none;transition:none}
}

/* --- üst etiket: yanıp sönen nokta + küçük yazı --- */
.paket-etiket{display:inline-flex;align-items:center;gap:7px;color:var(--surgical);
  letter-spacing:.14em;text-transform:uppercase;font-size:10px;margin-bottom:14px;
  border:1px solid color-mix(in srgb,var(--surgical) 26%,transparent);
  border-radius:20px;padding:6px 12px 6px 10px;
  background:color-mix(in srgb,var(--surgical) 7%,transparent)}
:root[data-theme="dark"] .paket-etiket{color:var(--saline);
  border-color:color-mix(in srgb,var(--saline) 26%,transparent);
  background:color-mix(in srgb,var(--saline) 8%,transparent)}
.paket-etiket i{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;
  animation:pkNabiz 2s ease-in-out infinite}
@keyframes pkNabiz{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}

.paket h2{font-family:'Newsreader',serif;font-weight:300;font-size:clamp(30px,7.2vw,44px);
  line-height:1.06;letter-spacing:-.028em;max-width:16ch}
/* başlığın altında kendini çizen ince degrade çizgi */
.paket h2::after{content:'';display:block;height:2px;width:92px;margin-top:16px;border-radius:2px;
  background:linear-gradient(90deg,var(--surgical),color-mix(in srgb,var(--skin) 75%,transparent));
  transition:width .9s cubic-bezier(.22,.7,.3,1) .2s}
:root[data-theme="dark"] .paket h2::after{
  background:linear-gradient(90deg,var(--saline),color-mix(in srgb,var(--skin) 55%,transparent))}
.paket.animasyonlu h2[data-gir]:not(.gor)::after{width:0}
.paket .aciklama{margin-top:15px;font-size:14px;line-height:1.62;color:var(--muted);max-width:54ch}

/* --- süre kutuları --- */
.paket-sayilar{margin-top:24px;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.paket-sayilar div{background:var(--raise);padding:16px 8px;text-align:center;
  position:relative;overflow:hidden}
/* üstte, kutu belirince soldan sağa açılan ince vurgu şeridi */
.paket-sayilar div::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,var(--surgical),color-mix(in srgb,var(--skin) 70%,transparent));
  transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.22,.7,.3,1) .15s}
:root[data-theme="dark"] .paket-sayilar div::before{
  background:linear-gradient(90deg,var(--saline),color-mix(in srgb,var(--skin) 50%,transparent))}
.paket-sayilar div[data-gir].gor::before,
.paket:not(.animasyonlu) .paket-sayilar div::before{transform:scaleX(1)}
.paket-sayilar b{display:block;font-size:16px;font-weight:600;letter-spacing:-.01em}
.paket-sayilar span{display:block;margin-top:3px;font-size:11.5px;color:var(--muted)}
@media(prefers-reduced-motion:reduce){
  .paket h2::after{transition:none}
  .paket-sayilar div::before{transform:scaleX(1);transition:none}
}

/* --- ikonlu "pakete dahil" listesi --- */
.paket-icerik{margin-top:30px}
.paket-icerik h3{font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);font-weight:600;margin-bottom:16px}
/* --- ADIMLARI BİRLEŞTİREN YOL ---
   01→02→03… sırasını dolaşan bir çizgi; üzerinde kısa bir ışık adımdan
   adıma ilerler. Yol JS ile ölçülüp çizilir; çizilemezse hiçbir şey bozulmaz.
   Işık stroke-dashoffset ile ilerler, düzen hesabı yapılmaz. */
.pk-sarmal{position:relative}
.pk-iz{position:absolute;inset:0;width:100%;height:100%;overflow:visible;
  pointer-events:none;z-index:0}
.pk-iz path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.pk-iz .taban{stroke:color-mix(in srgb,var(--surgical) 20%,transparent);stroke-width:2}
.pk-iz .isik{stroke:var(--surgical);stroke-width:2.5;
  stroke-dasharray:90 910;stroke-dashoffset:1000;
  animation:pkIz 6s linear infinite}
:root[data-theme="dark"] .pk-iz .taban{stroke:color-mix(in srgb,var(--saline) 18%,transparent)}
:root[data-theme="dark"] .pk-iz .isik{stroke:var(--saline)}
@keyframes pkIz{to{stroke-dashoffset:0}}
.paket.dur .pk-iz .isik{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.pk-iz .isik{animation:none;opacity:0}}

.paket-liste{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:16px 26px;
  position:relative;z-index:1}
@media(min-width:1000px){.paket-liste{gap:18px 34px}}
.paket-liste li{display:flex;flex-direction:column;align-items:center;gap:11px;
  position:relative;text-align:center}
/* Madde sayısı tekse son adım tek başına sol sütunda kalıp eğreti durur;
   iki sütunu birden kaplar. */
.paket-liste li:last-child:nth-child(odd){grid-column:1 / -1}

/* --- İKON DÜĞÜMÜ ---------------------------------------------------------
   Büyük, belirgin bir daire: içi degrade dolgu, çevresinde yavaşça dönen
   degrade halka. Halka ::after ile çizilir, dairenin DIŞINDA durur; bu
   yüzden ikonun üstünü kapatmaz ve maskeye/negatif z-index'e gerek yoktur. */
.pk-ikon{flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;
  position:relative;overflow:visible;color:var(--surgical-deep);isolation:isolate;
  background:
    radial-gradient(120% 120% at 30% 18%,rgba(255,255,255,.55),transparent 58%),
    linear-gradient(145deg,
      color-mix(in srgb,var(--surgical) 40%,var(--raise)),
      color-mix(in srgb,var(--surgical) 12%,var(--raise)));
  border:1px solid color-mix(in srgb,var(--surgical) 34%,transparent);
  box-shadow:0 6px 16px color-mix(in srgb,var(--surgical) 20%,transparent);
  transition:opacity .62s ease,
             transform .5s cubic-bezier(.2,.65,.3,1),
             box-shadow .4s ease,border-color .4s ease}
:root[data-theme="dark"] .pk-ikon{color:var(--saline);
  background:
    radial-gradient(120% 120% at 30% 18%,rgba(255,255,255,.10),transparent 58%),
    linear-gradient(145deg,
      color-mix(in srgb,var(--saline) 30%,var(--raise)),
      color-mix(in srgb,var(--saline) 8%,var(--raise)));
  border-color:color-mix(in srgb,var(--saline) 32%,transparent);
  box-shadow:0 6px 18px rgba(0,0,0,.42)}

.pk-ikon svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.8;
  stroke-linecap:round;stroke-linejoin:round;position:relative;z-index:1;
  opacity:1;transition:opacity .5s ease .16s,transform .62s cubic-bezier(.2,.65,.3,1) .12s}

/* dönen halka — yalnızca transform döner, yeniden çizim yapmaz */
.pk-ikon::after{content:'';position:absolute;inset:-5px;border-radius:50%;pointer-events:none;
  border:2px solid transparent;
  /* yalnızca üst + sağ yay boyanır: dönüş net görülsün diye alt/sol boş */
  border-top-color:var(--surgical);
  border-right-color:color-mix(in srgb,var(--surgical) 40%,transparent);
  animation:pkDon 5.5s linear infinite;
  animation-delay:calc(var(--adim,0) * -.55s);   /* her ikon farklı açıdan başlar */
  opacity:.9;transition:opacity .4s ease}
:root[data-theme="dark"] .pk-ikon::after{
  border-top-color:var(--saline);
  border-right-color:color-mix(in srgb,var(--saline) 40%,transparent)}
@keyframes pkDon{to{transform:rotate(360deg)}}
/* düğümün arkasında yavaşça nefes alan ışık — göz oraya gitsin */
.pk-ikon::before{content:'';position:absolute;inset:-16px;border-radius:50%;z-index:0;
  pointer-events:none;
  background:radial-gradient(circle,
    transparent 40%,
    color-mix(in srgb,var(--surgical) 24%,transparent) 55%,
    transparent 76%);
  animation:pkNefes 4.4s ease-in-out infinite;
  animation-delay:calc(var(--adim,0) * -.55s)}
:root[data-theme="dark"] .pk-ikon::before{
  background:radial-gradient(circle,
    transparent 40%,
    color-mix(in srgb,var(--saline) 20%,transparent) 55%,
    transparent 76%)}
@keyframes pkNefes{0%,100%{opacity:.25;transform:scale(.86)}50%{opacity:.75;transform:scale(1.04)}}

/* bölüm ekrandan çıkınca halkalar ve ışık durur */
.paket.dur .pk-ikon::after,
.paket.dur .pk-ikon::before{animation-play-state:paused}

/* üzerine gelince düğüm öne çıkar, halka hızlanır */
.paket-liste li:hover .pk-ikon{transform:translateY(-4px) scale(1.06);
  border-color:color-mix(in srgb,var(--surgical) 55%,transparent);
  box-shadow:0 14px 26px color-mix(in srgb,var(--surgical) 26%,transparent)}
:root[data-theme="dark"] .paket-liste li:hover .pk-ikon{
  border-color:color-mix(in srgb,var(--saline) 55%,transparent);
  box-shadow:0 14px 26px rgba(0,0,0,.5)}
.paket-liste li:hover .pk-ikon::after{animation-duration:1.6s;opacity:1}

/* --- ADIM NUMARASI --- düğümün sağ altına oturur */
.pk-no{position:absolute;right:-5px;bottom:-3px;z-index:2;
  min-width:21px;height:21px;padding:0 5px;border-radius:11px;
  display:grid;place-items:center;
  font-family:'IBM Plex Mono',monospace;font-size:10px;font-weight:500;letter-spacing:.04em;
  background:var(--surgical);color:#F7FAF9;
  border:2px solid var(--paper);
  transition:transform .4s cubic-bezier(.2,.65,.3,1),background .3s ease}
:root[data-theme="dark"] .pk-no{background:var(--saline);color:#08120F}
.paket-liste li:hover .pk-no{transform:scale(1.12)}

@media(prefers-reduced-motion:reduce){
  .pk-ikon::after,
  .paket-liste li:hover .pk-ikon::after{animation:none}
  .pk-ikon::before{animation:none;opacity:.4;transform:none}
}

.paket.animasyonlu [data-gir]:not(.gor) .pk-ikon{opacity:0;transform:scale(.86) translateY(8px)}
.paket.animasyonlu [data-gir]:not(.gor) .pk-ikon svg{opacity:0;transform:scale(.8)}

@media(prefers-reduced-motion:reduce){
  .pk-ikon,.pk-ikon svg{transition:none}
  .paket.animasyonlu [data-gir]:not(.gor) .pk-ikon,
  .paket.animasyonlu [data-gir]:not(.gor) .pk-ikon svg{opacity:1;transform:none}
  .pk-ikon::after{display:none}
}
.pk-yazi{min-width:0;padding-top:1px;max-width:22ch;margin:0 auto}
.pk-yazi b{display:block;font-size:14px;font-weight:600;line-height:1.35}
.pk-yazi i{display:block;margin-top:3px;font-size:12.5px;font-style:normal;color:var(--muted);line-height:1.45}

/* --- teklif kartı --- */
.paket-kart{border-radius:var(--r);padding:24px 20px;position:relative;overflow:hidden;
  background:color-mix(in srgb,var(--skin) 18%,var(--raise));
  border:1px solid color-mix(in srgb,var(--skin) 40%,transparent)}
:root[data-theme="dark"] .paket-kart{background:color-mix(in srgb,var(--skin) 9%,var(--raise));
  border-color:color-mix(in srgb,var(--skin) 26%,transparent)}
:root[data-theme="dark"] .paket-kart::before{background:radial-gradient(circle,color-mix(in srgb,var(--skin) 20%,transparent),transparent 70%)}
.paket-kart::before{content:'';position:absolute;top:-70px;right:-70px;width:180px;height:180px;
  border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,color-mix(in srgb,var(--skin) 38%,transparent),transparent 70%)}
.paket-kart h3{position:relative;font-family:'Newsreader',serif;font-weight:400;
  font-size:clamp(26px,6.2vw,32px);line-height:1.08;letter-spacing:-.02em}
.paket-kart .alt{position:relative;margin-top:9px;font-size:13px;line-height:1.55;color:var(--muted);max-width:40ch}

.paket-cta{position:relative;margin-top:20px;height:54px;border-radius:12px;background:#25D366;
  color:#000;font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;gap:9px}
.paket-cta svg{width:19px;height:19px;flex:none;fill:currentColor;stroke:none}
.paket-not{position:relative;margin-top:12px;font-size:12.5px;color:var(--muted);line-height:1.5;
  display:flex;align-items:center;gap:7px}
.paket-not .nokta{width:7px;height:7px;border-radius:50%;background:#25D366;flex:none;
  animation:pkNabiz 1.8s ease-in-out infinite}
.paket-ikinci{position:relative;display:inline-block;margin-top:15px;font-size:13.5px;color:var(--ink);
  border-bottom:1px solid color-mix(in srgb,var(--ink) 40%,transparent);padding-bottom:2px}
.paket-ikinci:hover{border-bottom-color:var(--ink)}

@media(min-width:900px){
  .paket{padding:52px var(--yan) 64px;grid-template-columns:1.15fr .85fr;gap:44px;align-items:start}
  .paket-kart{position:sticky;top:84px;padding:30px 28px}
  .paket-sayilar{margin-top:28px}
}
}
.lead-head{max-width:660px}
.lead-head .eyebrow{color:var(--muted);margin-bottom:11px}
.lead-head h2{font-family:'Newsreader',serif;font-weight:300;font-size:clamp(26px,5vw,34px);letter-spacing:-.025em;line-height:1.08}
.lead-head p{margin-top:10px;font-size:13.5px;color:var(--muted);max-width:54ch;line-height:1.55}
.lead-grid{display:grid;gap:22px;margin-top:26px}
@media(min-width:880px){.lead-grid{grid-template-columns:minmax(0,1fr) 396px;gap:32px;align-items:start}}
.lead-conv{background:var(--raise);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.dm-head{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid var(--line-soft)}
.dm-av{width:36px;height:36px;border-radius:50%;background:var(--ring);padding:2px;flex:none}
.dm-av>div{width:100%;height:100%;border-radius:50%;border:2px solid var(--raise);display:grid;place-items:center;overflow:hidden;position:relative}
.dm-title{font-size:14px;font-weight:600;display:flex;align-items:center;gap:4px}
.dm-sub{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:5px}
.live{width:6px;height:6px;border-radius:50%;background:#25D366;flex:none;animation:live 1.9s ease-in-out infinite}
@keyframes live{0%,100%{opacity:1}50%{opacity:.35}}
/* sohbetteki soru sayacı (2 / 6) */
.dm-ilerleme{margin-left:auto;font-size:11px;letter-spacing:.08em;color:var(--muted);
  padding:3px 9px;border-radius:12px;background:var(--line-soft);white-space:nowrap}
.dm-ilerleme:empty{display:none}
.thread{display:flex;flex-direction:column;gap:9px;padding:16px 16px 4px}
.bub{max-width:84%;padding:9px 13px;border-radius:19px;font-size:13.5px;line-height:1.42;background:var(--line-soft);border-bottom-left-radius:5px;animation:pop .34s cubic-bezier(.2,.9,.3,1.2) backwards}
@keyframes pop{from{opacity:0;transform:translateY(7px) scale(.97)}}
.bub.me{align-self:flex-end;background:var(--surgical);color:#F7FAF9;border-bottom-left-radius:19px;border-bottom-right-radius:5px}
.chips{display:flex;flex-wrap:wrap;gap:7px;padding:12px 16px 16px}
.chip{border:1px solid var(--surgical);color:var(--surgical);padding:7px 13px;border-radius:16px;font-size:12.5px;font-weight:500;transition:background .14s,color .14s}
.chip:hover{background:var(--surgical);color:#F7FAF9}
[data-theme="dark"] .chip{border-color:var(--saline);color:var(--saline)}
[data-theme="dark"] .chip:hover{background:var(--saline);color:#0A0F0E}
.lead-points{display:grid;gap:14px;margin-top:20px}
@media(min-width:560px) and (max-width:879px){.lead-points{grid-template-columns:1fr 1fr;gap:14px 22px}}
.lp{display:flex;gap:11px;align-items:flex-start}
.lp>svg{width:19px;height:19px;flex:none;margin-top:1px;stroke:var(--surgical);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
[data-theme="dark"] .lp>svg{stroke:var(--saline)}
.lp b{display:block;font-size:13px;font-weight:600;letter-spacing:-.01em}
.lp span{font-size:12px;color:var(--muted);line-height:1.45}
.lead-card{background:var(--raise);border:1px solid var(--line);border-radius:16px;padding:20px 20px 18px;box-shadow:0 18px 44px rgba(5,16,13,.07)}
@media(min-width:880px){.lead-card{position:sticky;top:70px}}
.lead-badge{display:inline-flex;align-items:center;gap:6px;background:color-mix(in srgb,var(--surgical) 11%,transparent);color:var(--surgical);border-radius:999px;padding:5px 11px}
[data-theme="dark"] .lead-badge{color:var(--saline);background:color-mix(in srgb,var(--saline) 14%,transparent)}
.lead-card h3{font-size:18px;font-weight:650;letter-spacing:-.02em;margin-top:13px}
.lead-card .sub{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.5}
.fields{display:grid;gap:13px;margin-top:18px}
.field{display:grid;gap:6px}
.field label{font-size:11.5px;font-weight:600;color:var(--muted);display:flex;align-items:center;gap:4px}
.field label i{color:var(--alert);font-style:normal}
.field input,.field select{height:44px;padding:0 13px;border-radius:11px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-size:14px;font-family:inherit;transition:border-color .15s,box-shadow .15s;width:100%}
.field select{appearance:none;cursor:pointer;padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 20px,calc(100% - 13px) 20px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.field input::placeholder{color:var(--muted);opacity:.75}
.field input:focus,.field select:focus{outline:none;border-color:var(--surgical);box-shadow:0 0 0 3px color-mix(in srgb,var(--surgical) 14%,transparent)}
/* --- telefon alanı: intl-tel-input'u sayfanın temasına uydurur --- */
.field .iti{display:block;width:100%}
.iti__flag-container{z-index:2}
.iti__selected-flag{border-radius:11px 0 0 11px;padding:0 8px 0 12px;font-family:inherit}
.iti--separate-dial-code .iti__selected-flag{background-color:color-mix(in srgb,var(--ink) 4%,transparent)}
.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag{background-color:color-mix(in srgb,var(--ink) 8%,transparent)}
.iti__selected-dial-code{font-size:13.5px;color:var(--muted)}
.iti__arrow{border-top-color:var(--muted)}
.iti__arrow--up{border-bottom-color:var(--muted)}
.iti__country-list{z-index:30;background:var(--raise);border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 34px rgba(5,16,13,.16);color:var(--ink);font-family:inherit;font-size:13.5px;max-height:232px;padding:4px;margin:4px 0 0}
.iti__country{padding:8px 10px;border-radius:8px;line-height:1.3}
.iti__country.iti__highlight{background:color-mix(in srgb,var(--surgical) 13%,transparent)}
.iti__dial-code{color:var(--muted)}
.iti__divider{border-bottom-color:var(--line);margin:4px 0;padding-bottom:4px}
.field.bad input,.field.bad select{border-color:var(--alert)}
.err{font-size:11px;color:var(--alert);display:none;line-height:1.4}
.field.bad .err{display:block}
.consent{display:flex;gap:9px;align-items:flex-start;margin-top:16px;font-size:11.5px;color:var(--muted);line-height:1.5;cursor:pointer}
.consent input{appearance:none;width:17px;height:17px;flex:none;margin-top:1px;border:1.5px solid var(--line);border-radius:5px;background:var(--paper);cursor:pointer;position:relative;transition:background .15s,border-color .15s}
.consent input:checked{background:var(--surgical);border-color:var(--surgical)}
.consent input:checked::after{content:'';position:absolute;left:4.5px;top:1px;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
.consent.bad input{border-color:var(--alert)}
.consent.bad{color:var(--alert)}
.consent b{color:var(--ink);font-weight:600}
.lead-submit{width:100%;height:50px;margin-top:17px;border-radius:12px;background:var(--surgical);color:#F7FAF9;font-size:14.5px;font-weight:650;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 10px 24px color-mix(in srgb,var(--surgical) 22%,transparent);transition:filter .15s,transform .1s}
.lead-submit:hover{filter:brightness(1.1)}
.lead-submit:active{transform:scale(.99)}
.lead-submit[disabled]{opacity:.72;cursor:default}
.lead-submit svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.spin{width:16px;height:16px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.lead-micro{display:flex;flex-wrap:wrap;gap:7px 14px;margin-top:14px}
.lead-micro span{display:flex;align-items:center;gap:5px;font-size:10.5px;color:var(--muted)}
.lead-micro svg{width:12px;height:12px;flex:none;stroke:var(--surgical);fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
[data-theme="dark"] .lead-micro svg{stroke:var(--saline)}
.dm-note{font-size:11px;color:var(--muted);line-height:1.5;margin-top:12px}
.lead-done{display:none;text-align:center;padding:12px 4px 6px}
.lead-card.done .lead-body{display:none}
.lead-card.done .lead-done{display:block}
.lead-done .tick{width:56px;height:56px;margin:0 auto 15px;border-radius:50%;background:color-mix(in srgb,var(--surgical) 12%,transparent);display:grid;place-items:center;animation:pop .4s cubic-bezier(.2,.9,.3,1.3) backwards}
.lead-done .tick svg{width:26px;height:26px;stroke:var(--surgical);fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
[data-theme="dark"] .lead-done .tick svg{stroke:var(--saline)}
.lead-done h4{font-size:17px;font-weight:650;letter-spacing:-.015em}
.lead-done p{font-size:13px;color:var(--muted);margin-top:8px;line-height:1.55}

/* ================= FOOTER ================= */
.footer{background:var(--raise);border-top:1px solid var(--line);margin-top:8px}
.foot-in{max-width:var(--max);margin:0 auto;padding:0 var(--yan)}
.locate{display:grid;gap:0}
@media(min-width:800px){.locate{grid-template-columns:1.1fr .9fr;gap:26px;align-items:stretch;padding:28px 0}}
.map{position:relative;aspect-ratio:16/11;overflow:hidden;background:var(--map-land);margin:0 calc(var(--yan)*-1)}
@media(min-width:800px){.map{margin:0;border-radius:var(--r);aspect-ratio:auto;min-height:360px;border:1px solid var(--line)}}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:saturate(.85)}
[data-theme="dark"] .map iframe{filter:invert(.92) hue-rotate(175deg) saturate(.7) brightness(.95)}
.map-card{position:absolute;left:12px;right:12px;bottom:12px;z-index:4;background:color-mix(in srgb,var(--raise) 92%,transparent);backdrop-filter:saturate(160%) blur(12px);border:1px solid var(--line);border-radius:14px;padding:12px 13px;display:flex;align-items:center;gap:12px;box-shadow:0 10px 26px rgba(5,16,13,.13)}
.map-card .t{font-size:12.5px;font-weight:600;letter-spacing:-.01em}
.map-card .s{font-size:11px;color:var(--muted);margin-top:2px;display:flex;align-items:center;gap:5px}
.map-card .s svg{width:11px;height:11px}
.contact{padding:22px 0 6px}
@media(min-width:800px){.contact{padding:0;display:flex;flex-direction:column;justify-content:center}}
.contact h2{font-family:'Newsreader',serif;font-weight:300;font-size:26px;letter-spacing:-.025em;line-height:1.12}
.contact .eyebrow{color:var(--muted);margin-bottom:10px}
.crow{display:flex;gap:11px;align-items:flex-start;padding:13px 0;border-bottom:1px solid var(--line-soft)}
.crow:first-of-type{border-top:1px solid var(--line-soft);margin-top:16px}
.crow svg{width:16px;height:16px;flex:none;margin-top:2px;stroke:var(--surgical);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
[data-theme="dark"] .crow svg{stroke:var(--saline)}
.crow .k{font-size:11px;color:var(--muted);margin-bottom:2px}
.crow .v{font-size:13.5px;font-weight:500;line-height:1.4;display:block}
.crow a.v:hover{color:var(--surgical)}
.call-row{display:flex;gap:8px;margin-top:16px}
.call-row a{flex:1;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:13.5px;font-weight:600}
.call-row svg{width:16px;height:16px}
.call-wa{background:#25D366;color:#07130d;font-weight:700}
.trust{border-top:1px solid var(--line);padding:22px 0;display:flex;flex-wrap:wrap;gap:20px 34px;align-items:center}
.trust-item{display:flex;align-items:center;gap:11px}
.trust-item .cap{font-size:10.5px;color:var(--muted);line-height:1.5;max-width:34ch}
.trust-item .cap b{color:var(--ink);font-size:12px}
.htr-plate{display:inline-flex;align-items:center;justify-content:center;flex:none;
  padding:10px 14px;border-radius:14px;background:#12211d;border:1px solid rgba(255,255,255,.10);
  box-shadow:0 2px 10px rgba(0,0,0,.22)}
.htr{display:block;height:52px;width:auto}
/* Sağlık Bakanlığı logosu yatay olduğu için daha kısa tutulur */
.sb{display:block;height:38px;width:auto}
/* İki plaka yan yana ve aynı yükseklikte dursun */
.trust-logos{display:flex;flex-wrap:wrap;align-items:stretch;gap:10px;min-width:0;max-width:100%}
.trust-logolar{min-width:0}
/* CLINICHUB kelime logosu — plaka koyu olduğu için beyaz durur */
.ch-logo{display:block;height:26px;width:auto;color:#fff}
/* Üç plaka aynı yükseklikte dursun — satır kaysa bile hizalı kalır */
.trust-logos .htr-plate{min-height:74px}

/* Belge metni her zaman kendi satırında durur */
.trust-belge{flex:1 1 100%}
.trust-belge .cap{max-width:none}

/* Masaüstünde sıra: logolar · Trustpilot · Google, belge metni en altta */
@media(min-width:561px){
  .trust-logolar{order:1}
  #trust-t{order:2}
  #trust-g{order:3}
  .trust-belge{order:4;margin-top:-4px}
}

/* Mobil: logolar üstte, belge metni altında tam genişlikte.
   Bu blok TEMEL KURALLARDAN SONRA gelmeli, yoksa ezilir. */
@media(max-width:560px){
  .trust{gap:18px 22px}
  .trust-logolar{flex:1 1 100%}
  .trust-logos{gap:9px}
  .trust-logos .htr-plate{min-height:64px;padding:9px 12px}
  .htr{height:42px}
  .sb{height:31px}
  .ch-logo{height:21px}
  .trust-item[id^=trust-]{flex:1 1 calc(50% - 11px);min-width:0}
}
.legal{border-top:1px solid var(--line);padding:18px 0 calc(30px + env(safe-area-inset-bottom));color:var(--muted);font-size:11px;line-height:1.65}
.legal p+p{margin-top:8px}

/* ================= ALT BAR ================= */
.send{height:30px;padding:0 15px;border-radius:15px;background:var(--surgical);color:#F7FAF9;font-size:12.5px;font-weight:600;display:grid;place-items:center;flex:none}

/* ================= HİKAYE ================= */
.story{position:fixed;inset:0;z-index:200;background:rgba(5,16,13,var(--dim,1));display:none;place-items:center}
.story.on{display:grid}
.story-stage{position:relative;width:100%;height:100%;max-width:430px;max-height:100dvh;background:var(--surgical-deep);overflow:hidden;will-change:transform;
  /* yatay kaydırma hikâye geçişi için kullanılır, tarayıcı el koymasın */
  touch-action:none;transition:transform .22s cubic-bezier(.22,.7,.3,1),opacity .22s ease}
@media(min-width:640px){.story-stage{height:min(92dvh,780px);border-radius:8px;box-shadow:0 30px 80px rgba(0,0,0,.6)}}
/* --- hikâyeler arası geçiş --- yeni hikâye yandan kayarak girer.
   fill-mode YOK: durağan hâl yerindedir, animasyon çalışmasa da görünür. */
@keyframes stGirSag{from{transform:translateX(100%);opacity:.4}to{transform:none;opacity:1}}
@keyframes stGirSol{from{transform:translateX(-100%);opacity:.4}to{transform:none;opacity:1}}
@keyframes stCikSol{from{transform:none;opacity:1}to{transform:translateX(-24%) scale(.94);opacity:0}}
.story-stage.gir-sag{animation:stGirSag .3s cubic-bezier(.22,.7,.3,1)}
.story-stage.gir-sol{animation:stGirSol .3s cubic-bezier(.22,.7,.3,1)}
/* kapanış kısa sürer ve hemen ardından hikâye zaten kapatılır */
.story-stage.cik-sol{animation:stCikSol .24s cubic-bezier(.4,0,.6,1) forwards}
@media(prefers-reduced-motion:reduce){
  .story-stage.gir-sag,.story-stage.gir-sol,.story-stage.cik-sol{animation:none}
}
.story-bg{position:absolute;inset:0}
/* hikâyede yazı yok: medya kararmasın, sadece üstteki isim ve alttaki
   buton okunabilsin diye ince bir gölge bırakıldı */
.story-bg::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(to top,rgba(5,16,13,.72) 0,rgba(5,16,13,0) 26%,rgba(5,16,13,0) 76%,rgba(5,16,13,.55) 100%)}
.story-bg video,.story-bg iframe{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border:0}
/* YouTube slaytında küçük resim çerçevenin arkasında kalır */
.story-bg iframe{z-index:1}
.bars{position:absolute;top:0;left:0;right:0;display:flex;gap:3px;padding:10px 9px 0;z-index:5}
.bar{flex:1;height:2.5px;border-radius:2px;background:rgba(255,255,255,.32);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:#fff;border-radius:2px}
.bar.done i{width:100%}
.story-top{position:absolute;top:20px;left:0;right:0;z-index:5;display:flex;align-items:center;gap:9px;padding:10px 14px;color:#fff}
.story-top .av{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;overflow:hidden;flex:none;position:relative}
.story-top .nm{font-size:13px;font-weight:600}
.story-sound{margin-left:auto;width:34px;height:34px;display:grid;place-items:center;color:#fff}
/* sesi olmayan slaytta gizlenir; kapatma tuşu yine sağa yaslansın */
.story-sound[hidden]{display:none}
.story-sound[hidden] + .story-close{margin-left:auto}
.story-sound svg{grid-area:1/1;width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.story-sound .on{display:none}
.story-sound.sesli .off{display:none}
.story-sound.sesli .on{display:block}
.story-close{color:#fff}
.story-close svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2}
.story-cta{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:16px 20px calc(20px + env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;gap:10px}
/* ================= SORU-CEVAP (FAQ) SLAYTI ================= */
/* Fotoğraf verilmeyen soru slaytının zemini: yavaşça süzülen iki renk
   bulutu. Her slayt üç tondan birini alır (t1/t2/t3), böylece sorular
   arasında geçerken ekran canlı durur. */
.story-degrade{position:absolute;inset:0;overflow:hidden;
  background:linear-gradient(165deg,#15453A 0%,#1B5A4C 46%,#0E3129 100%)}
.story-degrade::before,.story-degrade::after{content:'';position:absolute;
  border-radius:50%;will-change:transform}
.story-degrade::before{width:100vmin;height:100vmin;left:-18%;top:-14%;
  background:radial-gradient(circle,var(--bulut-1) 0%,transparent 70%);
  animation:sqBulut1 19s ease-in-out infinite alternate}
.story-degrade::after{width:92vmin;height:92vmin;right:-16%;bottom:-12%;
  background:radial-gradient(circle,var(--bulut-2) 0%,transparent 68%);
  animation:sqBulut2 24s ease-in-out infinite alternate}
/* üç ton — slaytlar arasında sırayla döner */
.story-degrade.t1{--bulut-1:rgba(190,222,211,.62);--bulut-2:rgba(90,175,155,.55)}
.story-degrade.t2{--bulut-1:rgba(240,196,170,.58);--bulut-2:rgba(64,150,131,.62)}
.story-degrade.t3{--bulut-1:rgba(150,205,189,.60);--bulut-2:rgba(214,110,88,.40)}
@keyframes sqBulut1{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(9%,7%,0) scale(1.16)}}
@keyframes sqBulut2{
  from{transform:translate3d(0,0,0) scale(1.08)}
  to{transform:translate3d(-8%,-9%,0) scale(1)}}
/* ince doku — düz degradeyi kırar, derinlik verir */
.story-degrade::before{mix-blend-mode:screen}

.story-soru{position:absolute;inset:0;z-index:5;display:grid;align-items:center;
  padding:76px 18px 126px;pointer-events:none}
.story-soru[hidden]{display:none}
/* Fotoğraf arkalı soru slaytında yazı okunsun diye hafif karartma kalır. */
.story-stage.soru-cevap .story-bg::after{
  background:linear-gradient(to top,rgba(5,16,13,.62) 0,rgba(5,16,13,.18) 45%,rgba(5,16,13,.5) 100%)}
/* Degrade zeminli slaytta karartma tamamen kalkar — renkler canlı kalsın.
   Üst ve alt çubukların okunması için yalnızca kenarlara ince gölge. */
.story-stage.soru-degrade .story-bg::after{
  background:linear-gradient(to top,rgba(5,16,13,.42) 0,transparent 18%,transparent 84%,rgba(5,16,13,.34) 100%)}

/* --- buzlu cam kart: yazı her zeminde net okunur --- */
.sq-kart{color:#F2F7F5;max-width:32ch;margin:0 auto;padding:26px 22px 24px;
  border-radius:20px;background:rgba(6,20,16,.42);
  -webkit-backdrop-filter:blur(16px) saturate(130%);backdrop-filter:blur(16px) saturate(130%);
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 24px 60px rgba(0,0,0,.4),inset 0 1px 0 rgba(255,255,255,.12)}
.sq-rozet{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
  font-family:'Newsreader',serif;font-size:23px;line-height:1;
  color:#0C2A23;background:linear-gradient(145deg,#CFE3DB,#A8C6BC);margin-bottom:17px;
  box-shadow:0 6px 16px rgba(0,0,0,.28)}
.sq-kart h2{font-family:'Newsreader',serif;font-weight:300;
  font-size:clamp(26px,6.8vw,35px);line-height:1.13;letter-spacing:-.022em}
.sq-kart p{margin-top:15px;font-size:14.5px;line-height:1.62;color:rgba(242,247,245,.9);
  max-height:40dvh;overflow-y:auto;scrollbar-width:none;pointer-events:auto}
.sq-kart p::-webkit-scrollbar{display:none}
/* kartın üstünde ince bir ışık çizgisi */
.sq-kart::before{content:'';position:absolute;left:22px;right:22px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent)}
.sq-kart{position:relative;overflow:hidden}

/* --- etkinlik kartı: tarih bloğu, altın aksan, şehir büyük --- */
.ev-kart{text-align:left;padding-left:30px}
/* solda ince altın aksan çizgisi */
.ev-cizgi{position:absolute;left:0;top:26px;bottom:26px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,#F0D9A8,#E7B79E 55%,transparent)}

.ev-tarih{display:flex;align-items:center;gap:11px;margin-bottom:15px}
.ev-gun{font-family:'IBM Plex Mono',monospace;font-size:44px;font-weight:500;line-height:.86;
  letter-spacing:-.045em;
  background:linear-gradient(140deg,#F6E6C8,#E7B79E 70%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.ev-ay{display:grid;gap:2px;font-family:'IBM Plex Mono',monospace;line-height:1;padding-top:2px}
.ev-ay b{font-size:13px;font-weight:600;letter-spacing:.16em;color:#EFD8B6}
.ev-ay i{font-size:11px;font-style:normal;letter-spacing:.14em;color:rgba(242,247,245,.55)}

.ev-kart h2{font-size:clamp(31px,8.6vw,43px);line-height:1.03;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.ev-bayrak{font-size:.76em;line-height:1;filter:drop-shadow(0 3px 8px rgba(0,0,0,.4))}
.ev-kart p{margin-top:12px;font-size:14px;color:rgba(242,247,245,.82)}

.ev-geri{display:inline-flex;align-items:center;gap:8px;margin-top:20px;padding:6px 12px 6px 10px;
  border-radius:16px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.12em;
  text-transform:uppercase;color:rgba(242,247,245,.82)}
.ev-geri::before{content:'';width:7px;height:7px;border-radius:50%;flex:none;
  background:#7CD6A6;animation:evNabiz 2s ease-in-out infinite}
@keyframes evNabiz{0%,100%{opacity:.45;transform:scale(.82)}50%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){ .ev-geri::before{animation:none} }
@media(min-width:620px){ .ev-kart{padding-left:34px} }

/* --- yorum kartı (hikâyede) --- */
.yr-kart{text-align:left}
.yr-ust{display:flex;align-items:center;gap:10px;margin-bottom:15px}
/* kaynak logosu ile puan yıldızları arasına ince ayırıcı — Trustpilot'un
   yeşil yıldızı puan yıldızlarıyla karışmasın */
.yr-kaynak{width:22px;height:22px;flex:none;display:grid;place-items:center;
  padding-right:10px;border-right:1px solid rgba(255,255,255,.18);box-sizing:content-box}
.yr-kaynak svg{width:100%;height:100%}
.yr-kart .stars svg{width:15px;height:15px}
.yr-kart h2{font-size:clamp(21px,5.4vw,27px);line-height:1.18;font-weight:400}
.yr-kart p{margin-top:12px;font-size:14.5px;line-height:1.62;max-height:34dvh;
  overflow-y:auto;scrollbar-width:none;pointer-events:auto}
.yr-kart p::-webkit-scrollbar{display:none}
.yr-kim{margin-top:16px;padding-top:13px;border-top:1px solid rgba(255,255,255,.14);
  display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.yr-kim b{font-size:14px;font-weight:600}
.yr-kim span{font-size:12px;color:rgba(242,247,245,.6)}

/* beliriş — yazı yumuşakça girsin */
.story-soru .sq-kart{animation:sqKartGir .5s cubic-bezier(.22,.7,.3,1) backwards}
.story-soru .sq-rozet,.story-soru .ev-tarih,.story-soru .yr-ust,.story-soru h2,.story-soru p,.story-soru .ev-geri,.story-soru .yr-kim{animation:sqGir .5s cubic-bezier(.22,.7,.3,1) backwards}
.story-soru .ev-tarih{animation-delay:.08s}
.story-soru .ev-geri,.story-soru .yr-kim{animation-delay:.3s}
.story-soru .yr-ust{animation-delay:.08s}
.story-soru .sq-rozet{animation-delay:.08s}
.story-soru h2{animation-delay:.15s}
.story-soru p{animation-delay:.24s}
@keyframes sqKartGir{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
@keyframes sqGir{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){
  .story-degrade::before,.story-degrade::after{animation:none}
  .story-soru .sq-kart,.story-soru .sq-rozet,.story-soru h2,.story-soru p{animation:none}
}
@media(min-width:620px){ .sq-kart{padding:30px 26px 28px} }

.story-cta[hidden]{display:none}      /* iki buton da kapalıysa gizlenir */
.story-btn[hidden],.story-wa[hidden]{display:none}
.story-btn{width:100%;max-width:330px;height:44px;border-radius:22px;background:#fff;color:var(--surgical-deep);font-weight:600;font-size:14px;display:grid;place-items:center}
/* hikâyelerdeki WhatsApp butonu */
.story-wa{width:100%;max-width:330px;height:44px;border-radius:22px;background:#25D366;color:#07130d;
  font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;gap:9px}
.story-wa svg{width:18px;height:18px;flex:none}
.nav-zone{position:absolute;top:0;bottom:0;width:32%;z-index:4}
.nav-zone.l{left:0}
.edge-back{position:absolute;left:0;top:0;bottom:0;width:26px;z-index:5;touch-action:pan-y}
@media(hover:hover) and (pointer:fine){.edge-back{display:none}}
.swiping{transition:none!important}
.snapping{transition:transform .24s cubic-bezier(.22,.7,.3,1)}
.nav-zone.r{right:0;width:68%}

/* ================= VAKA PENCERESİ ================= */
.modal{position:fixed;inset:0;z-index:180;background:rgba(5,16,13,calc(.84*var(--dim,1)));display:none}
.modal.on{display:block}

/* --- DİKEY GÖNDERİ AKIŞI (Instagram mantığı) ---
   Tek gönderi yerine listenin tamamı alt alta basılır; kaydırdıkça bir
   sonraki gönderi kendiliğinden gelir, açılışta altta devamı görünür. */
.post-feed{position:relative;height:100dvh;overflow-y:auto;overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;will-change:transform;
  /* son gönderiden sonra bırakılan boşluk: buranın da sonuna gelinince
     akış kapanır ve sayfaya dönülür (JS'teki sonaGelindiMi) */
  padding-bottom:46vh}
/* boşluğun ortasındaki kapanış ipucu */
.post-feed::after{content:'That’s all — keep scrolling to go back';
  position:absolute;left:0;right:0;bottom:20vh;text-align:center;pointer-events:none;
  font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);opacity:.75}
.post-feed::-webkit-scrollbar{display:none}
.sheet{position:relative;background:var(--raise);width:100%;display:flex;flex-direction:column}
/* gönderiler arasındaki boşluk: altta başka gönderi olduğunu belli eder */
.sheet+.sheet{margin-top:9px}

/* üstteki ince çubuk — kaydırırken kapat düğmesi hep elin altında */
.feed-top{position:absolute;top:0;left:0;right:0;height:var(--feed-top-h);z-index:8;
  display:flex;align-items:center;gap:10px;padding:0 6px;color:var(--ink);
  background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--line)}
.feed-close{width:38px;height:38px;display:grid;place-items:center;color:var(--ink)}
.feed-close svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.feed-title{font-size:15px;font-weight:600}
@media(min-width:900px){.feed-top{display:none}}

@media(max-width:899px){
  :root{--feed-top-h:46px}
  /* akış tam ekranı kaplar: gönderi araları arkadaki sayfayı göstermesin,
     ince bir ayırıcı çizgi gibi dursun */
  .post-feed{background:var(--paper)}
  /* çubuk yer kaplamaz, fotoğrafın üstünde yüzer — böylece gönderi daha kısa
     kalır ve altta bir sonraki gönderinin başı görünür */
  .feed-top{background:linear-gradient(to bottom,rgba(4,12,10,.62),rgba(4,12,10,0));
    backdrop-filter:none;border-bottom:0;color:#EDF4F1}
  .feed-close{color:#EDF4F1}
  .feed-title{color:#EDF4F1;text-shadow:0 1px 4px rgba(0,0,0,.45)}
}
@media(min-width:900px){
  :root{--feed-top-h:0px}
  .post-feed{padding:28px}
  .sheet{max-height:92vh;max-width:900px;margin:0 auto;border-radius:6px;flex-direction:row;overflow:hidden}
  .sheet+.sheet{margin-top:28px}
}
/* Fotoğraf kutusunun oranı --oran ile belirlenir; JS açılan gönderinin ilk
   fotoğrafını ölçüp buraya yazar (kare fotoğraf → kare kutu). Ölçüm gelmezse
   4:5 kullanılır. */
.sheet-art{position:relative;aspect-ratio:var(--oran,4/5);flex:none;background:var(--surgical-deep);overflow:hidden;user-select:none}
@media(min-width:900px){.sheet-art{width:min(52%,470px);align-self:flex-start}}
.m-track{position:absolute;inset:0;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.m-track::-webkit-scrollbar{display:none}
.m-slide{flex:none;width:100%;height:100%;position:relative;scroll-snap-align:center;scroll-snap-stop:always;overflow:hidden}
/* Fotoğrafın üstünde durduğu için şeffaf: altındaki before/after görünsün.
   Okun kendisi beyaz ve hafif gölgeli, zemin sadece hafif bir koyulaştırma. */
/* Oklar fotoğrafın ORTASINDA değil, sağ ALT köşesinde durur — yüzün ve
   before/after ayrımının üstünü kapatmasınlar. Sol altta vaka başlığı
   olduğu için sağ alt köşe boştur. */
.m-arrow{position:absolute;top:auto;bottom:12px;transform:none;z-index:6;
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:rgba(12,20,18,.26);color:#fff;
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  border:1px solid rgba(255,255,255,.22);
  transition:opacity .15s,background .18s}
.m-arrow:hover{background:rgba(12,20,18,.45)}
.m-arrow svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:2.4;
  stroke-linecap:round;stroke-linejoin:round;
  /* açık fotoğrafta da seçilsin diye okun kendi gölgesi */
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.55))}
.m-arrow.prev{left:auto;right:56px}
.m-arrow.next{right:12px}
.m-arrow.off{opacity:0;pointer-events:none}
.m-count{position:absolute;top:14px;right:14px;z-index:6;background:rgba(6,20,16,.5);border:1px solid rgba(255,255,255,.24);color:#EDF4F1;padding:4px 9px;border-radius:11px}
/* Noktalar da alt satırda: okların hemen solunda. Böylece fotoğrafın
   üstü tamamen boş kalır. */
.m-dots{position:absolute;top:auto;bottom:24px;left:auto;right:102px;z-index:6;
  display:flex;gap:5px;justify-content:flex-end;pointer-events:none;
  max-width:42%;flex-wrap:wrap}
.m-dots i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.42);transition:background .18s}
.m-dots i.on{background:#fff}
.m-dots[hidden],.m-arrow[hidden],.m-count[hidden]{display:none}
.ba-tag{position:absolute;top:14px;z-index:4;background:rgba(6,20,16,.5);border:1px solid rgba(255,255,255,.24);color:#EDF4F1;padding:4px 9px;border-radius:11px}
.ba-tag.l{left:14px}
.ba-foot{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:34px 18px 16px;color:#EDF4F1;background:linear-gradient(to top,rgba(6,20,16,.8),transparent);pointer-events:none}
/* sağ alttaki nokta+ok kümesine girmesin diye başlık erken satır atlar */
.ba-foot .eyebrow,.ba-foot h3{max-width:56%}
.ba-foot .eyebrow{color:var(--saline);margin-bottom:6px}
.ba-foot h3{font-family:'Newsreader',serif;font-weight:300;font-size:25px;line-height:1.1;letter-spacing:-.02em}
/* telefonda üstteki çubuk fotoğrafın üstünde yüzdüğü için rozetler onun
   altına iner (bu kurallar .m-count/.ba-tag/.m-dots'tan SONRA gelmeli) */
@media(max-width:899px){
  .m-count,.ba-tag{top:calc(14px + var(--feed-top-h))}
}
.sheet-side{flex:1;display:flex;flex-direction:column;min-width:0}
.sheet-head{display:flex;align-items:center;gap:9px;padding:13px 15px;border-bottom:1px solid var(--line-soft)}
.sheet-head .av{width:30px;height:30px;border-radius:50%;background:var(--ring);padding:2px;flex:none}
.sheet-head .av>div{width:100%;height:100%;border-radius:50%;border:2px solid var(--raise);overflow:hidden;display:grid;place-items:center;position:relative}
.sheet-head .nm{font-size:13px;font-weight:600}
.sheet-close{margin-left:auto;color:var(--muted)}
.sheet-close svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2}
.sheet-body{padding:15px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:14px}
.case-meta{display:flex;flex-wrap:wrap;gap:6px}
.case-meta span{border:1px solid var(--line);border-radius:11px;padding:4px 9px;color:var(--muted)}
.cap-line{font-size:13.5px;line-height:1.55}
.cap-line b{font-weight:600}
.sheet-acts{border-top:1px solid var(--line-soft);padding:11px 15px 14px;display:flex;flex-direction:column;gap:9px}
.act-row{display:flex;gap:15px;align-items:center}
.act svg{width:23px;height:23px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s}
.act.liked svg{fill:var(--alert);stroke:var(--alert);transform:scale(1.1)}
.act:last-child{margin-left:auto}
.likes{font-size:13px;font-weight:600}
.time{color:var(--muted)}
.sheet-cta{height:40px;border-radius:10px;background:#25D366;color:#000;font-weight:800;font-size:13.5px;display:flex;align-items:center;justify-content:center;gap:8px;text-align:center}
.sheet-cta svg{width:17px;height:17px;flex:none;fill:currentColor;stroke:none}
/* --- telefonda gönderi tek parça akar ---
   Açıklama kendi içinde kaydırılan küçük bir kutuya sıkışmaz: fotoğraf,
   açıklama ve butonlar alt alta akar, gönderi içeriği kadar yer kaplar. */
@media(max-width:899px){
  .sheet-side{flex:1 0 auto}
  .sheet-body{flex:1 0 auto;overflow:visible}
  .sheet-close{display:none}          /* kapatma üstteki sabit çubukta */
}

/* --- gönderiden gönderiye atlama düğmeleri --- */
.post-nav{position:fixed;right:18px;z-index:190;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.94);color:#0D1412;display:none;place-items:center;box-shadow:0 4px 14px rgba(0,0,0,.3);transition:opacity .16s}
.post-nav svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.post-nav.up{top:calc(50% - 46px)}
.post-nav.down{top:calc(50% + 8px)}
.post-nav.off{opacity:0;pointer-events:none}
@media(min-width:900px){.modal.on .post-nav{display:grid}}

/* ================= VİDEO PENCERESİ ================= */
.vmodal{position:fixed;inset:0;z-index:220;background:#000;display:none}
.vmodal.on{display:block}

/* --- REELS: tam ekran dikey video akışı ---
   Her video ekranın tamamını kaplar, kaydırınca bir sonrakine oturur
   (scroll-snap). Ekranda duran video kendiliğinden oynar, diğerleri durur. */
.reel-feed{height:100dvh;overflow-y:auto;overscroll-behavior:contain;
  scroll-snap-type:y mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.reel-feed::-webkit-scrollbar{display:none}
.reel-item{position:relative;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;
  display:grid;place-items:center;overflow:hidden;background:#000}
.reel-stage{position:relative;width:100%;height:100%;overflow:hidden;background:#000}
.reel-stage video,.reel-stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;
  object-fit:cover;background:#000;display:block}
.reel-stage.yatay video{object-fit:contain}
/* kapak: video inmeden önce ve YouTube videolarında görünür */
.reel-poster{position:absolute;inset:0;z-index:1}
.reel-poster img{width:100%;height:100%;object-fit:cover;display:block}
.reel-item.oynuyor .reel-poster{opacity:0;transition:opacity .25s ease}

/* okunabilirlik için alt/üst karartma */
.reel-stage::after{content:'';position:absolute;left:0;right:0;bottom:0;height:46%;z-index:2;
  background:linear-gradient(to top,rgba(0,0,0,.82),rgba(0,0,0,.35) 42%,transparent);pointer-events:none}

/* duraklatınca ortada beliren oynat işareti */
.reel-pause{position:absolute;inset:0;z-index:5;display:grid;place-items:center;pointer-events:none;
  opacity:0;transition:opacity .16s ease}
.reel-item.durdu .reel-pause{opacity:1}
.reel-pause svg{width:62px;height:62px;fill:rgba(255,255,255,.92);filter:drop-shadow(0 3px 12px rgba(0,0,0,.5))}

/* sağ şerit: beğeni, paylaş, izlenme */
.reel-side{position:absolute;right:10px;bottom:132px;z-index:6;display:flex;flex-direction:column;
  align-items:center;gap:17px;color:#fff}
.reel-side .ract{display:grid;justify-items:center;gap:4px;color:#fff;font-size:11px;font-weight:600;
  text-shadow:0 1px 4px rgba(0,0,0,.6)}
.reel-side .ract svg{width:27px;height:27px;stroke:currentColor;fill:none;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}
.reel-side .ract.liked svg{fill:var(--alert);stroke:var(--alert)}

/* sol alt: kim, açıklama, buton */
.reel-info{position:absolute;left:0;right:64px;bottom:0;z-index:6;padding:0 14px 20px;color:#fff}
.reel-who{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.reel-who .av{width:30px;height:30px;border-radius:50%;overflow:hidden;flex:none;position:relative;
  border:1.5px solid rgba(255,255,255,.85)}
.reel-who b{font-size:13.5px;font-weight:600;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.reel-cap{font-size:13px;line-height:1.45;text-shadow:0 1px 4px rgba(0,0,0,.6);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;cursor:pointer}
.reel-cap.acik{-webkit-line-clamp:unset;max-height:34dvh;overflow-y:auto}
.reel-cta{margin-top:12px;height:40px;border-radius:10px;background:#25D366;color:#000;font-weight:800;
  font-size:13.5px;display:flex;align-items:center;justify-content:center;gap:8px}
.reel-cta svg{width:17px;height:17px;flex:none;fill:currentColor;stroke:none}

/* alttaki ilerleme çubuğu */
.reel-bar{position:absolute;left:0;right:0;bottom:0;height:3px;z-index:7;background:rgba(255,255,255,.22)}
.reel-bar i{display:block;height:100%;width:0;background:#fff}

/* üstteki çubuk: kapat + ses */
.reel-top{position:absolute;top:0;left:0;right:0;height:52px;z-index:10;display:flex;align-items:center;
  gap:10px;padding:0 6px;color:#fff;
  background:linear-gradient(to bottom,rgba(0,0,0,.55),rgba(0,0,0,0));pointer-events:none}
.reel-top>*{pointer-events:auto}
.reel-top .feed-close,.reel-sound{color:#fff}
.reel-top .feed-title{color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.reel-sound{margin-left:auto;width:38px;height:38px;display:grid;place-items:center}
.reel-sound svg{grid-area:1/1;width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.reel-sound .on{display:none}
.vmodal.sesli .reel-sound .off{display:none}
.vmodal.sesli .reel-sound .on{display:block}

/* masaüstü: ortada 9:16 kart */
@media(min-width:900px){
  .reel-item{padding:20px}
  .reel-stage{width:auto;height:100%;aspect-ratio:9/16;border-radius:12px}
  .reel-stage video{object-fit:contain}
  .vmodal.on .post-nav{display:grid}
}
.vmodal .post-nav{display:none}

.toast{position:fixed;left:50%;bottom:calc(22px + env(safe-area-inset-bottom));transform:translate(-50%,14px);background:var(--ink);color:var(--paper);padding:11px 18px;border-radius:24px;font-size:13px;font-weight:500;z-index:300;opacity:0;pointer-events:none;transition:.26s}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ================= MOBİL İNCE AYAR ================= */
@media(max-width:700px){
  .field input,.field select{font-size:16px;height:48px}
  .lead-submit{height:52px}
  .icon-btn{width:40px;height:40px;margin:-7px}
  .btn{min-height:44px}
  .btn-sq{height:44px}
  .chip{padding:9px 14px;font-size:13px}
  .load-more{height:46px;width:100%;border-radius:12px}
  .lead-head h2{font-size:26px}
  .lead-card{padding:18px 16px 16px;border-radius:14px}
  .lead-conv{border-radius:14px}
  .ba-copy h2,.ugc-head h2{font-size:21px;line-height:1.15}
  .contact h2{font-size:23px}
  .ba-foot h3{font-size:21px}
  .ba-foot{padding:30px 16px 14px}
  .sheet-body{padding:14px}
  .sheet-acts{padding:11px 14px calc(14px + env(safe-area-inset-bottom))}
  .call-row{flex-direction:column}
  .call-row a{width:100%;padding:11px 0}
}
@media(max-width:344px){
  /* yalnızca çok dar telefonlarda sayılar 2'şerli iner */
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:380px){
  .tabs .tab{padding:0 2px}
  .lead-micro span{font-size:10px}
}
@media(max-height:520px){.story-stage{height:100dvh;border-radius:0}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;transition-duration:.001ms!important}}
@media(prefers-reduced-motion:reduce){.wa-pulse{animation:none!important;box-shadow:0 6px 18px rgba(37,211,102,.16)!important}.wa-pulse::before{display:none}}

/* ====== MOBİLDE KAYDIRMA PERFORMANSI ======
   backdrop-filter (arka plan bulanıklığı) ekranda sabit duran öğelerde
   her kaydırma karesinde yeniden hesaplanır ve telefonlarda kaydırmayı
   takılmalı hale getirir. Mobilde bulanıklık yerine düz zemin kullanılır;
   masaüstünde bulanıklık aynen kalır. */
@media(max-width:899px){
  .topbar{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--paper)}
  .map-card{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--raise)}
  .reel-play{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(255,255,255,.24)}
  .menu-fon{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(5,16,13,.55)}
}

/* Dönen/nabız atan halkalar ekrandan çıkınca durur. Görünmeyen bir şey için
   her karede çizim yapmak kaydırmayı yavaşlatıyordu. */
.profile.dur .avatar-ring::before,
.profile.dur .avatar-ring::after,
.hl.dur .hl-item.vurgu .hl-circle::before,
.hl.dur .hl-item.vurgu .hl-circle::after{animation-play-state:paused}


/* ---------- HEALTH TÜRKİYE rozeti (paket kartının altı) ---------- */
.paket-rozet{display:flex;align-items:center;gap:12px;margin-top:16px;padding-top:15px;
  border-top:1px solid var(--line)}
.paket-rozet .rozet-yazi{display:block;line-height:1.45;min-width:0}
.paket-rozet .rozet-yazi b{display:block;font-size:11.5px;font-weight:650;color:var(--ink)}
.paket-rozet .rozet-yazi i{display:block;font-style:normal;font-size:10.5px;color:var(--muted);margin-top:2px}
@media(max-width:560px){.paket-rozet{gap:10px}.paket-rozet .rozet-yazi b{font-size:11px}}

.trust-item .cap .nb{white-space:nowrap}
