/* Pablo Merhamet Bahçesi — ana sayfa stilleri.
   Dosya sonundaki bloklar revizyon sırasına göre eklenmiştir; sonraki kurallar öncekileri ezer. */

:root{
  --gece:#15202F;
  --lacivert:#202938;
  --duman:#343C4A;
  --sis:#908282;
  --gul:#B3A3A2;
  --tenli:#CEBAB5;
  --pudra:#DECCC6;
  --isik:#F4EDE9;

  --f:"Archivo",system-ui,sans-serif;
  --r-cerceve:26px;
  --r-kart:14px;
  --r-rozet:6px;

  --pad:clamp(20px,3.4vw,50px);
  --ray:clamp(0px,3.4vw,48px);   /* sol rayın açtığı iç boşluk */
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--gece);color:var(--isik);
  font-family:var(--f);font-size:16px;line-height:1.55;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
  padding:clamp(0px,1.3vw,18px);
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--pudra);outline-offset:3px}

.caps{text-transform:uppercase;letter-spacing:.16em;font-weight:700;font-size:11px}

/* ---------- sahne ---------- */
.sahne{
  position:relative;min-height:calc(100svh - clamp(0px,2.6vw,36px));
  display:flex;flex-direction:column;
  padding:clamp(18px,2.1vw,28px) var(--pad) clamp(20px,2.4vw,32px);
  border-radius:var(--r-cerceve);overflow:hidden;
  box-shadow:0 30px 90px rgba(8,12,20,.55);
}
.arka{position:absolute;inset:0;z-index:0}
.arka img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .9s ease}
.arka img.gorunur{opacity:1}
.scrim{position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(97deg,rgba(21,32,47,.95) 0%,rgba(21,32,47,.90) 18%,rgba(21,32,47,.72) 36%,rgba(21,32,47,.40) 54%,rgba(21,32,47,.14) 72%,rgba(21,32,47,.42) 100%),
    linear-gradient(to top,rgba(21,32,47,.92) 0%,rgba(21,32,47,.30) 40%,rgba(21,32,47,.44) 100%);}
.tint{position:absolute;inset:0;z-index:2;background:var(--duman);mix-blend-mode:color;opacity:.24}
.grain{position:absolute;inset:0;z-index:3;pointer-events:none;opacity:.2;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='220' height='220' filter='url(%23n)'/%3E%3C/svg%3E");}
.kat{position:relative;z-index:6}

/* ---------- üst ---------- */
.ust{display:flex;align-items:center;gap:clamp(22px,3.4vw,54px)}
.marka{flex-shrink:0;display:flex;align-items:center;gap:14px}
.marka img{height:clamp(44px,4.4vw,60px);width:auto}
.marka span{display:block;font-size:9px;font-weight:700;letter-spacing:.2em;color:var(--gul);
  border-left:1px solid rgba(244,237,233,.26);padding-left:14px;line-height:1.5}
.ana-nav{display:flex;gap:clamp(14px,1.9vw,30px);font-size:14px;font-weight:600;letter-spacing:.01em}
.ana-nav a{padding-block:7px;border-bottom:1.5px solid transparent;transition:border-color .2s}
.ana-nav a:hover,.ana-nav a[aria-current]{border-bottom-color:var(--pudra)}
.ust-sag{display:flex;align-items:center;gap:9px;margin-left:auto}
.ikon-btn{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(244,237,233,.3);transition:background-color .2s,border-color .2s}
.ikon-btn:hover{background:rgba(244,237,233,.15);border-color:rgba(244,237,233,.65)}
.ikon-btn svg{width:18px;height:18px}
.giris{display:flex;align-items:center;gap:9px;padding:9px 18px 9px 13px;border-radius:999px;
  border:1px solid rgba(244,237,233,.3);font-size:13px;font-weight:700;letter-spacing:.02em;
  transition:background-color .2s,border-color .2s}
.giris:hover{background:rgba(244,237,233,.15);border-color:rgba(244,237,233,.65)}
.giris svg{width:17px;height:17px}
.menu-btn{display:none;border:1px solid rgba(244,237,233,.3);border-radius:999px;padding:10px 16px;font-size:13px;font-weight:700}
.arama{display:flex;align-items:center;width:0;overflow:hidden;
  border-bottom:1px solid rgba(244,237,233,0);transition:width .3s ease,border-color .3s}
.arama.acik{width:clamp(140px,17vw,220px);border-bottom-color:rgba(244,237,233,.5)}
.arama input{width:100%;background:none;border:0;color:var(--isik);font:inherit;font-size:14px;padding:8px 0}
.arama input::placeholder{color:rgba(244,237,233,.5)}

/* ---------- orta ---------- */
.orta{flex:1;display:flex;align-items:center;
  padding:clamp(34px,5.2vw,74px) 0 clamp(28px,3.4vw,48px) calc(var(--ray) + clamp(0px,2.2vw,34px))}
.hero{max-width:min(46ch,41vw)}
.etiket{display:flex;align-items:center;gap:14px;color:var(--tenli);margin-bottom:clamp(20px,2.6vw,34px)}
.etiket i{width:30px;height:1px;background:var(--tenli);display:block;flex-shrink:0}

/* rakam + kırılım tek satırda */
.veri{display:flex;align-items:stretch;gap:clamp(22px,3vw,46px);margin-bottom:clamp(24px,3vw,40px)}
.buyuk{display:flex;flex-direction:column;justify-content:center}
.rakam{
  font-size:clamp(4.4rem,11.5vw,9.4rem);font-weight:900;
  font-variation-settings:"wdth" 122,"wght" 900;
  line-height:.78;letter-spacing:-.045em;font-variant-numeric:tabular-nums;
}
.altbaslik{
  font-size:clamp(11px,1.15vw,14px);font-weight:800;text-transform:uppercase;
  letter-spacing:.3em;color:var(--pudra);margin-top:clamp(14px,1.6vw,22px);
  font-variation-settings:"wdth" 108;
}
.kirilim{display:flex;flex-direction:column;justify-content:center;
  border-left:1px solid rgba(244,237,233,.28);padding-left:clamp(18px,2.4vw,38px)}
.kirilim div{padding-block:clamp(7px,.9vw,12px)}
.kirilim div + div{border-top:1px solid rgba(244,237,233,.16)}
.kirilim b{font-size:clamp(1.3rem,2.3vw,2rem);font-weight:800;
  font-variation-settings:"wdth" 115;line-height:1;letter-spacing:-.02em;
  font-variant-numeric:tabular-nums;display:inline-block;min-width:2.6ch}
.kirilim span{font-size:10.5px;font-weight:700;letter-spacing:.16em;color:var(--gul);margin-left:10px}

.hero p{font-size:clamp(14.5px,1.05vw,16.5px);line-height:1.75;max-width:42ch;
  color:rgba(244,237,233,.84);margin:0 0 clamp(28px,3.2vw,44px)}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.btn-kesfet{display:inline-flex;align-items:center;gap:13px;
  padding:7px 7px 7px 24px;border-radius:999px;border:1px solid rgba(244,237,233,.55);
  font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;
  transition:background-color .22s,border-color .22s}
.btn-kesfet .yuv{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
  background:rgba(244,237,233,.16);transition:background-color .22s,color .22s,transform .22s}
.btn-kesfet svg{width:15px;height:15px}
.btn-kesfet:hover{background:rgba(244,237,233,.13);border-color:var(--pudra)}
.btn-kesfet:hover .yuv{background:var(--pudra);color:var(--gece);transform:translateX(3px)}
.btn-bagis{display:inline-flex;align-items:center;padding:15px 28px;border-radius:999px;
  background:var(--pudra);color:var(--gece);font-size:13px;font-weight:800;white-space:nowrap;
  text-transform:uppercase;letter-spacing:.1em;transition:background-color .22s}
.btn-bagis:hover{background:var(--isik)}

/* ---------- kareler (1-2-3) ---------- */
.kareler{position:relative;width:100%}
.hero[data-kare]{opacity:0;visibility:hidden;pointer-events:none;
  position:absolute;top:0;left:0;width:100%;
  transform:translateY(14px);
  transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.3,1),visibility .55s}
.hero[data-kare].aktif{opacity:1;visibility:visible;pointer-events:auto;
  position:relative;transform:none}

/* acil rozeti (3. kare) */
.acil-rozet{display:inline-flex;align-items:center;gap:9px;
  background:rgba(222,204,198,.14);border:1px solid var(--pudra);color:var(--pudra);
  padding:6px 14px 6px 11px;border-radius:999px;margin-bottom:clamp(12px,1.4vw,18px)}
.acil-rozet .nokta{width:7px;height:7px;border-radius:50%;background:var(--pudra);flex-shrink:0;
  animation:nabiz 1.8s ease-in-out infinite}
@keyframes nabiz{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(222,204,198,.55)}
  50%{opacity:.55;box-shadow:0 0 0 6px rgba(222,204,198,0)}}

/* para birimi rakamın önünde */
.rakam .tl{font-size:.42em;font-weight:800;letter-spacing:0;
  vertical-align:.42em;margin-right:.08em;color:var(--pudra)}

/* ilerleme çubuğu (2. kare) */
.ilerleme{max-width:46ch;margin:0 0 clamp(18px,2vw,26px)}
.ilerleme-ust{display:flex;justify-content:space-between;align-items:baseline;
  gap:14px;margin-bottom:9px;font-size:11px;font-weight:700;letter-spacing:.13em;
  text-transform:uppercase;color:var(--gul)}
.ilerleme-ust b{color:var(--isik);font-size:13px;letter-spacing:.06em;
  font-variant-numeric:tabular-nums}
.ilerleme-ray{height:5px;border-radius:999px;background:rgba(244,237,233,.2);overflow:hidden}
.ilerleme-dolu{height:100%;width:0;border-radius:999px;background:var(--pudra);
  transition:width 1.4s cubic-bezier(.2,.7,.3,1)}
.ilerleme-alt{margin-top:9px;font-size:11.5px;font-weight:600;color:var(--gul);letter-spacing:.03em}

/* ---------- sol ray ---------- */
.ray{position:absolute;left:clamp(14px,2vw,28px);top:50%;transform:translateY(-50%);
  z-index:7;display:flex;flex-direction:column;align-items:center;gap:14px}
.ray .cizgi{width:1px;height:clamp(44px,6.5vw,80px);background:rgba(244,237,233,.3)}
.ray button{width:16px;height:16px;display:grid;place-items:center}
.ray button::before{content:"";width:7px;height:7px;border-radius:50%;background:rgba(244,237,233,.45);transition:all .25s}
.ray button[aria-current]::before{width:11px;height:11px;background:var(--pudra);box-shadow:0 0 0 5px rgba(222,204,198,.18)}
.ray button:hover::before{background:var(--isik)}

/* ---------- alt ---------- */
.alt{display:flex;align-items:flex-end;justify-content:space-between;gap:clamp(22px,3.4vw,54px);padding-left:var(--ray)}
.sosyal{display:flex;flex-direction:column;gap:13px;flex-shrink:0;margin-right:auto}
.sosyal-liste{display:flex;gap:9px}
.sos{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(244,237,233,.3);transition:background-color .2s,border-color .2s,transform .2s}
.sos:hover{background:rgba(244,237,233,.16);border-color:var(--pudra);transform:translateY(-2px)}
.sos svg{width:17px;height:17px}

.kart-blok{flex:0 0 auto;width:min(56%,700px);min-width:0}
.kart-bas{display:flex;align-items:center;gap:16px;margin-bottom:14px}
.kart-bas h2{margin:0;color:var(--pudra);white-space:nowrap}
.kart-bas .uzun{flex:1;height:1px;background:rgba(244,237,233,.3)}
.oklar{display:flex;gap:8px;flex-shrink:0}
.ok{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(244,237,233,.32);transition:background-color .2s,border-color .2s}
.ok:hover{background:rgba(244,237,233,.16);border-color:var(--pudra)}
.ok svg{width:14px;height:14px}

.kaydirak{display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;
  padding:3px 0;scroll-snap-type:x mandatory;
  -webkit-mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent 100%);
  mask-image:linear-gradient(90deg,#000 0,#000 88%,transparent 100%)}
.kaydirak::-webkit-scrollbar{display:none}
.kart{position:relative;flex:0 0 clamp(150px,15.5vw,186px);height:clamp(140px,14.5vw,170px);
  scroll-snap-align:start;
  border-radius:var(--r-kart);overflow:hidden;border:1px solid rgba(244,237,233,.22);
  background:linear-gradient(150deg,#39424F 0%,#242C39 60%,#1A2330 100%);
  display:flex;flex-direction:column;justify-content:flex-end;padding:14px;
  transition:transform .3s cubic-bezier(.2,.7,.3,1),border-color .3s}
.kart::before{
  content:"";position:absolute;z-index:3;top:12px;right:12px;width:27px;height:27px;
  border-radius:50%;border:1px solid rgba(244,237,233,.45);
  background:rgba(21,32,47,.35) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4EDE9' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12h12M12 6l6 6-6 6'/%3E%3C/svg%3E") center/12px no-repeat;
  transition:background-color .25s,border-color .25s,transform .25s;
}
.kart:hover::before{background-color:rgba(244,237,233,.26);border-color:var(--pudra);transform:translateX(2px)}
.kart:hover{transform:translateY(-6px);border-color:rgba(244,237,233,.62)}
.kart img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;
  transition:transform .55s cubic-bezier(.2,.7,.3,1)}
.kart::after{content:"";position:absolute;inset:0;z-index:1;
  background:linear-gradient(to top,rgba(21,32,47,.93) 8%,rgba(21,32,47,.2) 64%),
             linear-gradient(rgba(52,60,74,.36),rgba(52,60,74,.36))}
.kart:hover img{transform:scale(1.07)}
.kart > span{position:relative;z-index:2}
.kart .ad{font-size:clamp(.95rem,1.35vw,1.1rem);font-weight:800;text-transform:uppercase;
  letter-spacing:.06em;line-height:1.1;font-variation-settings:"wdth" 108}
.kart .not{font-size:10.5px;font-weight:600;letter-spacing:.03em;color:var(--gul);margin-top:6px}
.kart .say{position:absolute;z-index:2;top:12px;left:14px;font-size:9.5px;font-weight:800;
  letter-spacing:.08em;background:rgba(244,237,233,.94);color:var(--gece);
  padding:5px 8px;border-radius:var(--r-rozet)}

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .hero{max-width:min(52ch,52vw)}
  .kart-blok{width:min(62%,660px)}
}
@media (max-width:980px){
  .kart-blok{width:min(68%,580px)}
}
@media (max-width:980px){
  .hero{max-width:none}
}
@media (max-width:880px){
  body{padding:0}
  .sahne{border-radius:0;min-height:100svh}
  .ana-nav,.giris span{display:none}
  .menu-btn{display:inline-flex}
  .ray{display:none}
  .orta,.alt{padding-left:0}
  .alt{flex-direction:column;align-items:stretch;gap:20px}
  .sosyal{flex-direction:row;align-items:center;justify-content:space-between;margin-right:0}
  .kart-blok{width:100%}
  .orta{padding-block:40px 34px}
  .arka img{object-position:66% 68%}
  .scrim{background:linear-gradient(180deg,rgba(21,32,47,.88) 0%,rgba(21,32,47,.4) 30%,rgba(21,32,47,.95) 100%)}
  .veri{gap:20px}
  .kart{flex-basis:150px;height:140px}
}
@media (max-width:560px){
  .veri{flex-direction:column;gap:18px}
  .kirilim{border-left:0;padding-left:0;border-top:1px solid rgba(244,237,233,.28);flex-direction:row;gap:22px}
  .kirilim div + div{border-top:0}
  .kirilim div{padding-top:14px}
  .altbaslik{letter-spacing:.22em}
  .giris{padding:9px 13px}
  .arama.acik{width:120px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;animation:none!important}
  .kaydirak{scroll-behavior:auto}
}
.maket-not{font-size:11px;color:var(--sis);text-align:center;padding:10px 20px 4px;letter-spacing:.04em}

/* ---------- çekmece (mobil menü) ---------- */
.menu-btn{align-items:center;gap:9px}
.menu-btn .cizgi{display:inline-flex;flex-direction:column;gap:3px}
.menu-btn .cizgi i{display:block;width:15px;height:1.5px;background:currentColor;border-radius:2px}

.cek-perde{position:fixed;inset:0;z-index:300;background:rgba(10,15,24,.62);
  backdrop-filter:blur(3px);opacity:0;transition:opacity .3s}
.cek-perde.acik{opacity:1}
.cek{position:fixed;top:0;right:0;bottom:0;z-index:310;width:min(330px,84vw);
  background:rgba(21,32,47,.97);backdrop-filter:blur(22px);
  border-left:1px solid rgba(244,237,233,.18);
  padding:22px clamp(20px,5vw,28px) 30px;overflow-y:auto;
  transform:translateX(100%);transition:transform .34s cubic-bezier(.2,.7,.3,1)}
.cek.acik{transform:none}
.cek-ust{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}
.cek-ust span{font-size:10.5px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gul)}
.cek-kapat{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(244,237,233,.28);transition:background-color .2s,border-color .2s}
.cek-kapat:hover{background:rgba(244,237,233,.15);border-color:rgba(244,237,233,.6)}
.cek-kapat svg{width:16px;height:16px}
.cek .cek-bolum{display:block;margin-bottom:24px}
.cek .cek-bolum:last-of-type{margin-bottom:0}
.cek-baslik{display:block;font-size:10px;font-weight:700;letter-spacing:.2em;
  text-transform:uppercase;color:var(--sis);margin-bottom:8px}
.cek-bolum a{display:block;padding:11px 0;font-size:17px;font-weight:800;
  font-variation-settings:"wdth" 112;letter-spacing:-.012em;
  border-bottom:1px solid rgba(244,237,233,.11);transition:color .2s,padding-left .2s}
.cek-bolum a:hover{color:var(--pudra);padding-left:5px}
.cek-bolum a[aria-current]{color:var(--pudra)}
.cek-giris{margin-top:24px;padding-top:20px;border-top:1px solid rgba(244,237,233,.18)}
.cek-giris a{display:inline-flex;border:1px solid rgba(244,237,233,.26);border-radius:999px;
  padding:11px 20px;font-size:12px;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--gul);transition:all .2s}
.cek-giris a:hover{border-color:var(--pudra);color:var(--isik)}
body.cek-kilit{overflow:hidden}
@media (prefers-reduced-motion:reduce){.cek,.cek-perde{transition:none}}

/* hangel */
.hangel-btn{display:flex;align-items:center;gap:9px;padding:7px 15px 7px 12px;border-radius:999px;
  border:1px solid var(--tenli);color:var(--pudra);transition:background-color .2s,color .2s}
.hangel-btn:hover{background:var(--pudra);color:var(--gece)}
.hangel-btn .hg{font-size:14px;font-weight:900;letter-spacing:-.03em;
  font-variation-settings:"wdth" 108}
.hangel-btn .hg-alt{font-size:11px;font-weight:600;letter-spacing:.01em;opacity:.85;
  padding-left:9px;border-left:1px solid currentColor;white-space:nowrap}
@media (max-width:1100px){.hangel-btn .hg-alt{display:none}}
@media (max-width:880px){.hangel-btn{padding:7px 13px}}
/* ===== canlı tasarım + renkli eylem butonları ===== */
:root{--sahiplen:#796EB1;--sahiplen-yazi:#A99FE0;--gecici:#EF859F;--bagis:#FBB040;--bagis-hover:#FCC265;--kahve:#895848;--kahve-yazi:#C08A78}
.y-serit{background:#0E1622;border-bottom:1px solid rgba(244,237,233,.14);font-size:13.5px;margin:calc(-1 * clamp(0px,1.3vw,18px)) calc(-1 * clamp(0px,1.3vw,18px)) clamp(0px,1.3vw,18px)}
.y-serit-ic{max-width:1500px;margin:0 auto;height:42px;display:flex;align-items:center;gap:16px;padding:0 clamp(16px,3vw,40px)}
.y-hg{display:flex;align-items:center;gap:10px;min-width:0;color:var(--tenli)}
.y-hg:hover{color:var(--isik)}
.y-hg-logo{flex-shrink:0;background:var(--pudra);color:var(--gece);font-weight:900;letter-spacing:-.03em;padding:2px 9px;border-radius:6px;font-size:13px}
.y-hg-metin{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.y-hg u{text-decoration:none;border-bottom:1px solid currentColor;white-space:nowrap}
.y-sag{margin-left:auto;display:flex;align-items:center;gap:4px;flex-shrink:0}
.y-btn{display:flex;align-items:center;gap:7px;height:34px;padding:0 12px;border-radius:999px;color:var(--pudra);font-weight:600;font-size:13.5px}
.y-btn:hover,.y-btn[aria-expanded="true"]{background:rgba(244,237,233,.09);color:var(--isik)}
.y-btn svg{width:16px;height:16px}
.y-btn .y-ok{width:13px;height:13px;transition:transform .2s}
.y-btn[aria-expanded="true"] .y-ok{transform:rotate(180deg)}
.y-ayrac{width:1px;height:18px;background:rgba(244,237,233,.2);margin:0 4px}
.y-dil{position:relative}
.y-dil-liste{position:absolute;right:0;top:calc(100% + 6px);min-width:180px;padding:6px;margin:0;list-style:none;z-index:50;
  background:var(--lacivert);border:1px solid rgba(244,237,233,.18);border-radius:12px;box-shadow:0 18px 40px rgba(6,10,18,.5);
  opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .18s,visibility .18s}
.y-dil-liste.acik{opacity:1;visibility:visible;transform:none}
.y-dil-liste a{display:flex;justify-content:space-between;align-items:center;min-height:40px;padding:0 12px;border-radius:8px;font-size:14px;font-weight:600}
.y-dil-liste a:hover{background:rgba(244,237,233,.07)}
.y-dil-liste a[aria-current]{color:var(--pudra)}
.y-dil-liste small{color:var(--gul);font-weight:600}

.y-bas{display:flex;align-items:center;gap:clamp(16px,2.4vw,34px);position:relative;z-index:20}
.y-bas .marka img{height:clamp(52px,4.8vw,66px)}
.y-nav{display:flex;align-items:center;gap:4px}
.y-oge{position:relative}
.y-nav-btn{display:flex;align-items:center;gap:6px;height:44px;padding:0 14px;border-radius:999px;font-size:15px;font-weight:600;color:var(--pudra);transition:background-color .2s,color .2s}
.y-nav-btn svg{width:15px;height:15px;transition:transform .25s}
.y-nav-btn:hover,.y-nav-btn[aria-expanded="true"]{background:rgba(244,237,233,.1);color:var(--isik)}
.y-nav-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.y-panel{position:absolute;top:calc(100% + 8px);left:0;min-width:320px;padding:8px;z-index:60;
  background:rgba(32,41,56,.97);backdrop-filter:blur(14px);border:1px solid rgba(244,237,233,.18);border-radius:16px;box-shadow:0 24px 60px rgba(6,10,18,.5);
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s,transform .2s,visibility .2s}
.y-panel.acik{opacity:1;visibility:visible;transform:none}
.y-panel a{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:center;padding:10px 12px;border-radius:10px}
.y-panel a:hover{background:rgba(244,237,233,.07)}
.y-panel .ik{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:rgba(244,237,233,.07);color:var(--tenli)}
.y-panel .ik svg{width:18px;height:18px}
.y-panel b{display:block;font-size:15px;font-weight:700;color:var(--isik)}
.y-panel small{display:block;font-size:13px;color:var(--gul);line-height:1.35}
.y-panel .ayr{height:1px;background:rgba(244,237,233,.14);margin:6px 12px}
.y-panel .hgk .ik{background:var(--pudra);color:var(--gece);font-weight:900;font-size:13px;letter-spacing:-.03em}

.y-eylem{margin-left:auto;display:flex;align-items:center;gap:10px}
.y-cta{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border-radius:999px;font-size:14px;font-weight:700;white-space:nowrap;transition:background-color .2s}
.y-sahiplen{border:1.5px solid var(--sahiplen);color:var(--sahiplen-yazi)}
.y-sahiplen:hover{background:rgba(121,110,177,.2)}
.y-gecici{border:1.5px solid var(--gecici);color:var(--gecici)}
.y-gecici:hover{background:rgba(239,133,159,.14)}
.y-rozet{min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--gecici);color:var(--gece);font-size:12px;font-weight:800;display:inline-grid;place-items:center}
.y-bagis{background:var(--bagis);color:var(--gece);padding:0 22px}
.y-bagis:hover{background:var(--bagis-hover)}
.y-bagis svg{width:16px;height:16px}
.y-araclar{display:flex;align-items:center;gap:8px;padding-left:10px;border-left:1px solid rgba(244,237,233,.2)}
.y-bas .menu-btn{display:none}

/* çekmecede renkli kutular */
.y-kutular{display:grid;gap:10px;margin-bottom:24px}
.y-kutu{display:flex!important;align-items:center;justify-content:space-between;gap:12px;min-height:62px;padding:12px 18px!important;border-radius:14px;font-size:17px!important;font-weight:800;border-bottom:0!important}
.y-kutu small{display:block;font-size:13px;font-weight:600;opacity:.85;margin-top:2px}
.y-kutu:hover{padding-left:18px!important}
.y-k-bagis{background:var(--bagis);color:var(--gece)!important}
.y-k-sahiplen{background:rgba(121,110,177,.18);border:1.5px solid var(--sahiplen)!important;color:var(--sahiplen-yazi)!important}
.y-k-gecici{background:rgba(239,133,159,.12);border:1.5px solid var(--gecici)!important;color:var(--gecici)!important}
.y-cek-dil{display:flex;gap:8px;margin-top:14px}
.y-cek-dil a{flex:1;height:42px;display:grid;place-items:center;border-radius:12px;border:1px solid rgba(244,237,233,.18);font-weight:700;color:var(--tenli);font-size:14px}
.y-cek-dil a[aria-current]{border-color:var(--pudra);color:var(--isik);background:rgba(244,237,233,.07)}

/* hero ve kartlarda aynı renk dili */
.btn-bagis{background:var(--bagis)!important;color:var(--gece)!important}
.btn-bagis:hover{background:var(--bagis-hover)!important}
.acil-rozet{background:rgba(239,133,159,.14)!important;border-color:var(--gecici)!important;color:var(--gecici)!important}
.acil-rozet .nokta{background:var(--gecici)!important}
.ilerleme-dolu{background:var(--bagis)!important}
.kart .say{color:var(--gece)!important}
.kart[data-renk="bagis"] .say{background:var(--bagis)!important}
.kart[data-renk="sahiplen"] .say{background:#C9C2F0!important}
.kart[data-renk="gecici"] .say{background:var(--gecici)!important}
.kart[data-renk="ihtiyac"] .say{background:#E3C3B6!important}

/* alt eylem çubuğu (mobil) */
.y-alt{display:none}
@media (max-width:1180px){.y-nav,.y-araclar{display:none}.y-bas .menu-btn{display:inline-flex}}
@media (max-width:900px){.y-hg-uzun{display:none}}
@media (max-width:760px){
  .y-sahiplen,.y-gecici{display:none}
  .y-giris-metin,.y-ayrac,.y-hg u,.y-btn .y-ok{display:none}
  .y-btn{padding:0 8px}
  .y-bagis{height:42px;padding:0 16px}
  .y-alt{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:250;
    padding:10px 12px calc(env(safe-area-inset-bottom,0px) + 10px);background:rgba(21,32,47,.97);border-top:1px solid rgba(244,237,233,.16)}
  .y-alt a{display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:14px;font-weight:700;font-size:14px;position:relative}
  .y-alt .a1{border:1.5px solid var(--sahiplen);color:var(--sahiplen-yazi)}
  .y-alt .a2{border:1.5px solid var(--gecici);color:var(--gecici)}
  .y-alt .a3{background:var(--bagis);color:var(--gece)}
  .y-alt .y-rozet{position:absolute;top:-9px;right:6px}
  body{padding-bottom:84px!important}
}


/* ===== canlı hero: mavi ton ve gren kaldırıldı, sadece yazı tarafında sıcak bir gölge ===== */
.tint,.grain{display:none!important}
.arka img{filter:saturate(1.08) brightness(1.03)}
.scrim{background:
  linear-gradient(90deg,rgba(40,24,14,.80) 0%,rgba(40,24,14,.62) 26%,rgba(40,24,14,.28) 46%,rgba(40,24,14,0) 64%),
  linear-gradient(to top,rgba(40,24,14,.62) 0%,rgba(40,24,14,.18) 26%,rgba(40,24,14,0) 42%),
  linear-gradient(to bottom,rgba(40,24,14,.45) 0%,rgba(40,24,14,0) 18%)!important}
@media (max-width:880px){
  .scrim{background:linear-gradient(180deg,rgba(40,24,14,.55) 0%,rgba(40,24,14,.35) 30%,rgba(40,24,14,.72) 72%,rgba(40,24,14,.88) 100%)!important}
}
.y-sahiplen,.y-gecici,.ikon-btn,.menu-btn{background:rgba(40,24,14,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.y-sahiplen:hover{background:rgba(121,110,177,.45)}.y-gecici:hover{background:rgba(239,133,159,.3)}

/* ===== çerçeve ve üst şerit: lacivert yerine kremsi beyaz ===== */
:root{--krem-zemin:#FBF6EE;--koyu-kahve:#3A2418}
body{background:var(--krem-zemin)!important}
.sahne{box-shadow:0 24px 60px -18px rgba(90,60,30,.35)!important}
.y-serit{background:var(--krem-zemin);border-bottom:1px solid rgba(58,36,24,.1)}
.y-hg,.y-btn{color:var(--koyu-kahve)}
.y-hg:hover{color:#895848}
.y-hg-logo{background:#895848;color:#fff}
.y-btn:hover,.y-btn[aria-expanded="true"]{background:rgba(58,36,24,.08);color:var(--koyu-kahve)}
.y-ayrac{background:rgba(58,36,24,.2)}
.y-dil-liste{background:#fff;border-color:rgba(58,36,24,.12);box-shadow:0 18px 40px -12px rgba(90,60,30,.35)}
.y-dil-liste a{color:var(--koyu-kahve)}
.y-dil-liste a:hover{background:var(--krem-zemin)}
.y-dil-liste a[aria-current]{color:#895848}
.y-dil-liste small{color:#7A6259}
.maket-not{color:#7A6259}
@media (max-width:760px){
  .y-alt{background:rgba(251,246,238,.97);border-top:1px solid rgba(58,36,24,.12)}
  .y-alt .a1{border-color:#5E5396;color:#5E5396}
  .y-alt .a2{background:#EF859F;border-color:#EF859F;color:var(--koyu-kahve)}
  .y-alt .a2 .y-rozet{background:#fff}
}
/* ===== kaydırılan ana sayfa: spot + rakamlar + hakkımızda + footer ===== */
:root{--kk:#3A2418;--kk2:#5A4238;--kahve:#895848;--krem2:#F3EADF;--mor-koyu:#5E5396;--pembe-acik:#FDE8EE;--mor-acik:#EFEDF8}
html{scroll-behavior:smooth}
.sahne{min-height:0!important;height:clamp(520px,calc(100svh - 42px - clamp(0px,2.6vw,36px) - 92px),calc((100vw - clamp(0px,2.6vw,36px)) * .56))}
.arka img{object-position:62% 42%!important;transition:none!important}
.spot-orta{flex:1;display:flex;align-items:center;padding:clamp(20px,3vw,40px) 0 clamp(40px,5vw,64px) clamp(0px,2vw,26px)!important}
.spot{max-width:min(760px,54vw)}
.spot h1{margin:0 0 clamp(16px,2vw,24px);font-size:clamp(2.3rem,4.3vw,4.1rem);font-weight:900;font-variation-settings:"wdth" 122,"wght" 900;
  line-height:.94;letter-spacing:-.035em;text-transform:uppercase;color:var(--isik)}
.spot-vurgu{color:#FBB040}
.spot p{margin:0 0 clamp(24px,3vw,34px);font-size:clamp(16px,1.2vw,18px);line-height:1.7;color:rgba(244,237,233,.9);max-width:42ch}
.asagi{position:absolute;z-index:8;left:50%;bottom:22px;transform:translateX(-50%);width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  border:1px solid rgba(244,237,233,.5);color:var(--isik);background:rgba(40,24,14,.35);backdrop-filter:blur(6px);animation:zipla 2.4s ease-in-out infinite}
.asagi svg{width:20px;height:20px}
@keyframes zipla{50%{transform:translate(-50%,6px)}}

body{color:var(--kk)}
main{display:block}
.bolum{padding:clamp(40px,6vw,88px) clamp(16px,3vw,40px)}
.bolum-ic{max-width:1360px;margin:0 auto}
.rakamlar{padding-top:26px}
.b-bas{margin-bottom:clamp(22px,3vw,38px)}
.b-et{display:inline-flex;align-items:center;gap:10px;font-size:12.5px!important;color:var(--kahve);margin-bottom:12px}
.b-et i{width:9px;height:9px;border-radius:50%;background:#FBB040;display:block}
.b-bas h2{margin:0;font-size:clamp(2.1rem,4.4vw,3.8rem);font-weight:900;font-variation-settings:"wdth" 122,"wght" 900;line-height:.95;letter-spacing:-.03em;text-transform:uppercase;color:var(--kk)}
.b-giris{margin:14px 0 0;max-width:60ch;font-size:18px;color:var(--kk2)}

.rk-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:clamp(12px,1.4vw,18px)}
.rk{background:#fff;border:1px solid rgba(58,36,24,.1);border-radius:24px;padding:clamp(20px,2.2vw,28px);display:flex;flex-direction:column}
.rk-ana{grid-row:span 2;background:#FBB040;border-color:transparent}
.rk-k{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--kahve)}
.rk-ana .rk-k{color:var(--kk)}
.rk-v{display:block;margin:10px 0 12px;font-size:clamp(2.8rem,4.6vw,4.2rem);font-weight:900;font-variation-settings:"wdth" 122,"wght" 900;line-height:.9;letter-spacing:-.035em;color:var(--kk);font-variant-numeric:tabular-nums}
.rk-v small{font-size:.5em;vertical-align:.55em;margin-right:4px}
.rk-ana .rk-v{font-size:clamp(5rem,10vw,9rem);margin:auto 0 16px}
.rk-kir{display:flex;gap:24px;padding:14px 0;border-top:2px solid rgba(58,36,24,.2);border-bottom:2px solid rgba(58,36,24,.2);margin-bottom:14px}
.rk-kir b{font-size:30px;font-weight:900;font-variation-settings:"wdth" 118;display:block;line-height:1}
.rk-kir span{font-size:14px;font-weight:700}
.rk p{margin:0;color:var(--kk2);font-size:15.5px;line-height:1.6}
.rk-ana p{color:var(--kk);font-weight:600}
.rk-cubuk{height:12px;border-radius:999px;background:var(--krem2);overflow:hidden;margin:4px 0 10px}
.rk-cubuk i{display:block;height:100%;width:0;background:#FBB040;border-radius:999px;transition:width 1.4s cubic-bezier(.2,.7,.3,1)}
.rk-alt{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:14.5px;font-weight:700;color:var(--kk2)}
.rk-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:auto;padding-top:18px}
.rk-btn{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 22px;border-radius:999px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;transition:transform .15s,background-color .2s}
.rk-btn:hover{transform:translateY(-2px)}
.rk-btn svg{width:16px;height:16px}
.rk-btn-bagis{background:#FBB040;color:var(--kk)}
.rk-btn-gecici{background:#EF859F;color:var(--kk)}
.rk-btn-hg{background:var(--mor-koyu);color:#fff}
.rk-btn-cizgi{border:2px solid var(--kk);color:var(--kk);margin-top:clamp(18px,2vw,26px)}
.rk-lnk{font-weight:800;font-size:14.5px;color:var(--mor-koyu);text-decoration:underline;text-underline-offset:4px}
.rk-acil{background:var(--pembe-acik);border-color:transparent}
.rk-acil .rk-v{color:#B8375A}
.nabiz{width:8px;height:8px;border-radius:50%;background:#EF859F;display:block;animation:nb 1.8s ease-in-out infinite}
@keyframes nb{50%{opacity:.35}}
.rk-hg{background:var(--mor-acik);border-color:transparent}
.rk-hg .rk-v{color:var(--mor-koyu)}

.yollar{padding-top:clamp(20px,3vw,40px)}
.yollar .kart-blok{width:100%!important;max-width:none!important}
.yollar .kart-bas h2{color:var(--kahve)!important;font-size:12.5px}
.yollar .kart-bas .uzun{background:rgba(58,36,24,.2)!important}
.yollar .ok{border-color:rgba(58,36,24,.3)!important;color:var(--kk)}
.yollar .ok:hover{background:#fff!important}
.yollar .kaydirak{-webkit-mask-image:none!important;mask-image:none!important;gap:14px}
.yollar .kart{flex-basis:clamp(210px,21vw,270px)!important;height:clamp(210px,19vw,250px)!important;border-color:transparent!important}

.hk-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,64px);align-items:start}
.hk-metin p{margin:0 0 16px;font-size:17px;line-height:1.75;color:var(--kk2)}
.hk-alinti{margin:24px 0 0;padding:6px 0 6px 20px;border-left:4px solid #FBB040;font-size:clamp(20px,2vw,26px);font-weight:800;line-height:1.3;color:var(--mor-koyu)}
.hk-alinti cite{display:block;margin-top:8px;font-style:normal;font-size:14px;font-weight:700;color:var(--kahve)}
.hk-foto{margin:0}
.hk-foto img{width:100%;aspect-ratio:4/3.2;object-fit:cover;border-radius:24px}
.hk-foto figcaption{margin-top:10px;font-size:14px;color:var(--kk2)}
.hk-sayilar{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,18px);margin:clamp(30px,4vw,52px) 0 clamp(14px,2vw,20px)}
.hk-sayilar div{background:#fff;border-radius:20px;padding:18px 20px;border-top:5px solid #FBB040}
.hk-sayilar div:nth-child(2){border-top-color:#796EB1}.hk-sayilar div:nth-child(3){border-top-color:#EF859F}.hk-sayilar div:nth-child(4){border-top-color:var(--kahve)}
.hk-sayilar b{display:block;font-size:clamp(2rem,3.4vw,3rem);font-weight:900;font-variation-settings:"wdth" 118;line-height:1;color:var(--kk)}
.hk-sayilar span{font-size:14.5px;font-weight:700;color:var(--kk2)}
.hk-isleyis{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.4vw,18px)}
.hk-isleyis div{background:#fff;border-radius:20px;padding:20px}
.hk-isleyis svg{width:26px;height:26px;color:var(--kahve);margin-bottom:10px}
.hk-isleyis div:nth-child(2) svg{color:var(--mor-koyu)}.hk-isleyis div:nth-child(3) svg{color:#D05878}.hk-isleyis div:nth-child(4) svg{color:#C98410}
.hk-isleyis b{display:block;font-size:17px;font-weight:800;margin-bottom:6px;color:var(--kk)}
.hk-isleyis span{font-size:15px;line-height:1.55;color:var(--kk2)}
.hk-not{margin:18px 0 0;font-size:14px;color:var(--kk2)}

.ayak2{background:var(--krem2);color:var(--kk);margin-top:clamp(20px,3vw,40px)}
.ayak2-ic{max-width:1360px;margin:0 auto;padding:clamp(40px,5vw,64px) clamp(16px,3vw,40px) 26px;display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:clamp(22px,3.4vw,50px)}
.a-marka img{height:92px;width:auto;margin-bottom:14px}
.a-marka p{margin:0 0 16px;font-size:15px;line-height:1.6;color:var(--kk2)}
.ayak2 h3{margin:0 0 12px;font-size:12.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--kahve)}
.ayak2 ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.ayak2 ul a{display:inline-block;padding:5px 0;font-size:15.5px;font-weight:600;color:var(--kk)}
.ayak2 ul a:hover{color:var(--mor-koyu)}
.ayak2 .sos{border-color:rgba(58,36,24,.25)!important;color:var(--kk)}
.ayak2 .sos:hover{background:#fff!important;border-color:var(--kk)!important}
.a-iban{margin-top:16px;display:grid;gap:6px;font-size:14px;color:var(--kk2)}
.a-iban code{font-family:inherit;font-weight:800;font-size:15px;color:var(--kk)}
.a-iban button{justify-self:start;margin-top:4px;padding:8px 16px;border-radius:999px;border:2px solid var(--kk);font-weight:800;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--kk)}
.a-iban button:hover{background:#fff}
.ayak2-alt{max-width:1360px;margin:0 auto;padding:16px clamp(16px,3vw,40px) 28px;border-top:1px solid rgba(58,36,24,.14);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:13.5px;color:var(--kk2)}

@media (max-width:1100px){
  .rk-grid{grid-template-columns:1fr 1fr}
  .rk-ana{grid-row:auto;grid-column:1/-1}
  .rk-ana .rk-v{margin-top:8px}
  .hk-isleyis{grid-template-columns:1fr 1fr}
  .ayak2-ic{grid-template-columns:1fr 1fr}
}
@media (max-width:880px){
  .sahne{height:clamp(480px,calc(100svh - 42px - 84px - 76px),760px)}
  .arka img{object-position:72% 40%!important}
  .spot{max-width:none}
  .spot-orta{align-items:flex-end;padding:24px 0 72px!important}
  .asagi{bottom:14px}
  .hk-grid{grid-template-columns:1fr}
}
@media (max-width:600px){
  .rk-grid{grid-template-columns:1fr}
  .hk-sayilar{grid-template-columns:1fr 1fr}
  .hk-isleyis{grid-template-columns:1fr}
  .ayak2-ic{grid-template-columns:1fr}
  .ayak2 ul a{white-space:nowrap;font-size:14px}
}
@media (prefers-reduced-motion:reduce){.asagi,.nabiz{animation:none}html{scroll-behavior:auto}}
@media (max-width:880px){.y-serit{margin:0!important}}
.yollar .kart-bas h2{white-space:normal!important}
.yollar .kart-bas{flex-wrap:nowrap}
.yollar .oklar{flex-shrink:0}
.sahne{color:var(--isik)}
.yollar .kart{color:#F4EDE9}
.ayak2{margin-left:calc(-1 * clamp(0px,1.3vw,18px));margin-right:calc(-1 * clamp(0px,1.3vw,18px));margin-bottom:calc(-1 * clamp(0px,1.3vw,18px))}
@media (max-width:880px){.ayak2{margin:0}}

/* ===== yana kaydırmalı main ===== */
.sahne{padding:0!important}
.y-bas{position:absolute!important;z-index:30;top:clamp(18px,2.1vw,28px);left:clamp(20px,3.4vw,50px);right:clamp(20px,3.4vw,50px)}
.yatay{position:absolute;inset:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;overscroll-behavior-x:contain}
.yatay::-webkit-scrollbar{display:none}
.yatay:focus-visible{outline:3px solid #FBB040;outline-offset:-3px}
.panel{position:relative;flex:0 0 100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;display:flex;align-items:center;overflow:hidden}
.panel-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.panel-perde{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(40,24,14,.80) 0%,rgba(40,24,14,.62) 28%,rgba(40,24,14,.26) 50%,rgba(40,24,14,0) 68%),
  linear-gradient(to top,rgba(40,24,14,.55) 0%,rgba(40,24,14,0) 30%),
  linear-gradient(to bottom,rgba(40,24,14,.45) 0%,rgba(40,24,14,0) 20%)}
.panel-ic{position:relative;z-index:2;max-width:min(720px,54vw);padding:112px 0 96px clamp(28px,5.2vw,96px);color:var(--isik)}
.panel-baslik{margin:0 0 22px;font-size:clamp(2.2rem,4vw,3.9rem);font-weight:900;font-variation-settings:"wdth" 118,"wght" 900;line-height:1.04;letter-spacing:-.015em;text-transform:uppercase;color:var(--isik)}
.panel-ic p{margin:0 0 32px;font-size:clamp(16.5px,1.25vw,19px);line-height:1.7;letter-spacing:.005em;color:rgba(244,237,233,.92);max-width:46ch}
.panel-ic .etiket{margin-bottom:22px}
.panel-ic .etiket .caps{letter-spacing:.08em!important;font-size:12.5px!important}
.vurgu-t{color:#FBB040}.vurgu-m{color:#C9C2F0}.vurgu-p{color:#F6A9BC}
.btn-mor{display:inline-flex;align-items:center;padding:15px 28px;border-radius:999px;background:#6F63A8;color:#fff;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em!important;white-space:nowrap}
.btn-mor:hover{background:#796EB1}
.btn-bagis,.btn-kesfet{letter-spacing:.06em!important}
.hero-cta{gap:14px!important}
.yatay-kontrol{position:absolute;z-index:25;left:clamp(28px,5.2vw,96px);right:clamp(20px,3.4vw,50px);bottom:clamp(18px,2.2vw,28px);display:flex;align-items:center;justify-content:space-between;gap:16px;pointer-events:none}
.sekmeler,.yatay-oklar{pointer-events:auto;display:flex;gap:6px}
.sekmeler{background:rgba(40,24,14,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:5px;border-radius:999px;border:1px solid rgba(244,237,233,.18);overflow-x:auto;scrollbar-width:none}
.sekmeler button{display:flex;align-items:center;gap:8px;height:38px;padding:0 16px;border-radius:999px;font-size:13.5px;font-weight:700;color:rgba(244,237,233,.85);white-space:nowrap}
.sekmeler button span{font-size:11.5px;font-weight:800;opacity:.6;font-variant-numeric:tabular-nums}
.sekmeler button:hover{color:#fff;background:rgba(244,237,233,.1)}
.sekmeler button[aria-selected="true"]{background:#F4EDE9;color:#3A2418}
.sekmeler button[aria-selected="true"] span{opacity:.7}
.y-ok-btn{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(40,24,14,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(244,237,233,.3);color:#fff}
.y-ok-btn:hover{background:rgba(40,24,14,.7)}
.y-ok-btn[disabled]{opacity:.35;cursor:default}
.y-ok-btn svg{width:18px;height:18px}

/* ===== header butonları: düz dolgu, net kontrast ===== */
.y-cta{height:44px!important;border:0!important;font-size:14px!important;font-weight:800!important;padding:0 20px!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:0 6px 18px -8px rgba(20,10,5,.5)}
.y-sahiplen{background:#6F63A8!important;color:#fff!important}
.y-sahiplen:hover{background:#7D71B6!important}
.y-gecici{background:#EF859F!important;color:#3A2418!important}
.y-gecici:hover{background:#F398AE!important}
.y-gecici .y-rozet{background:#fff!important;color:#3A2418!important}
.y-bagis{background:#FBB040!important;color:#3A2418!important}
@media (max-width:760px){.y-alt .a1{background:#6F63A8;border-color:#6F63A8;color:#fff}}

/* ===== aralıklar (harf, satır, boşluk) ===== */
.b-bas h2{letter-spacing:-.012em!important;line-height:1.04!important}
.b-et,.rk-k,.ayak2 h3,.yollar .kart-bas h2{letter-spacing:.08em!important}
.rk-v{letter-spacing:-.02em!important;line-height:.95!important}
.rk-btn,.a-iban button{letter-spacing:.06em!important}
.rk p,.hk-metin p,.hk-isleyis span{line-height:1.7!important}
.bolum{padding-block:clamp(48px,6.4vw,96px)!important}
.rakamlar{padding-top:28px!important}
.b-bas{margin-bottom:clamp(26px,3.2vw,42px)!important}

@media (max-width:880px){
  .panel-ic{max-width:none;padding:96px 22px 110px;align-self:flex-end}
  .panel-perde{background:linear-gradient(180deg,rgba(40,24,14,.5) 0%,rgba(40,24,14,.25) 30%,rgba(40,24,14,.72) 66%,rgba(40,24,14,.9) 100%)}
  .yatay-kontrol{left:14px;right:14px;bottom:14px}
  .yatay-oklar{display:none}
  .sekmeler{margin:0 auto;max-width:100%}
  .sekmeler button{padding:0 12px;font-size:13px}
  .sekmeler button span{display:none}
}
@media (prefers-reduced-motion:reduce){.yatay{scroll-behavior:auto}}
.panel-baslik{font-size:clamp(2rem,3.3vw,3.3rem)!important}
.panel-ic{max-width:min(760px,58vw)!important;padding-top:120px!important;padding-bottom:100px!important}
.panel-ic p{margin-bottom:28px!important}
#p2 .panel-baslik{font-size:clamp(1.9rem,2.9vw,2.9rem)!important}
@media (max-width:880px){.panel-ic{max-width:none!important;padding:96px 22px 110px!important}.panel-baslik,#p2 .panel-baslik{font-size:clamp(1.8rem,7.4vw,2.4rem)!important}}
@media (max-width:880px){
  .sahne{height:clamp(560px,calc(100svh - 42px - 84px - 48px),780px)!important}
  .panel-ic{padding:104px 20px 96px!important}
  .panel-ic .etiket{display:none}
  .panel-baslik,#p2 .panel-baslik{font-size:clamp(1.6rem,6.6vw,2.1rem)!important;margin-bottom:14px!important}
  .panel-ic p{font-size:15px!important;line-height:1.6!important;margin-bottom:18px!important}
  .panel .hero-cta{flex-wrap:wrap}
  .panel .hero-cta a{padding:12px 18px!important;font-size:12px!important}
  .panel .btn-kesfet{padding:5px 5px 5px 18px!important}
  .panel .btn-kesfet .yuv{width:30px;height:30px}
}

/* ===== sade gösterge: ince çizgiler + oklar ===== */
.yatay-kontrol{left:50%!important;right:auto!important;transform:translateX(-50%);bottom:clamp(20px,2.6vw,34px)!important;gap:28px!important}
.sekmeler{background:none!important;border:0!important;padding:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;gap:10px!important;overflow:visible!important}
.sekmeler button{height:28px!important;padding:0 2px!important;background:none!important;display:flex;align-items:center}
.sekmeler button i{display:block;width:28px;height:4px;border-radius:999px;background:rgba(244,237,233,.45);transition:width .3s,background-color .3s}
.sekmeler button:hover i{background:rgba(244,237,233,.8)}
.sekmeler button[aria-selected="true"] i{width:56px;background:#FBB040}
.sekmeler button em{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.yatay-oklar{gap:10px!important}
.y-ok-btn{width:40px!important;height:40px!important;background:rgba(40,24,14,.28)!important;border-color:rgba(244,237,233,.35)!important}
.y-ok-btn svg{width:16px!important;height:16px!important}
@media (max-width:880px){.yatay-kontrol{bottom:18px!important}.sekmeler button i{width:22px}.sekmeler button[aria-selected="true"] i{width:40px}}

/* ===== header hiyerarşisi: Bağış tek baskın buton ===== */
.y-sahiplen,.y-gecici{background:rgba(251,246,238,.94)!important;color:#3A2418!important;box-shadow:0 6px 18px -10px rgba(20,10,5,.55)!important}
.y-sahiplen:hover,.y-gecici:hover{background:#fff!important}
.y-nokta{width:9px;height:9px;border-radius:50%;flex-shrink:0;display:inline-block}
.y-sahiplen .y-nokta{background:#796EB1}
.y-gecici .y-nokta{background:#EF859F}
.y-gecici .y-rozet{background:#EF859F!important;color:#3A2418!important}
.y-bagis{box-shadow:0 8px 22px -8px rgba(251,176,64,.7)!important}
@media (max-width:760px){
  .y-alt .a1,.y-alt .a2{background:#fff!important;border:1.5px solid rgba(58,36,24,.18)!important;color:#3A2418!important;gap:7px}
  .y-alt .a1::before,.y-alt .a2::before{content:"";width:8px;height:8px;border-radius:50%;background:#796EB1}
  .y-alt .a2::before{background:#EF859F}
  .y-alt .a2 .y-rozet{background:#EF859F!important;color:#3A2418!important}
}

/* ===== hamburger menü: krem zemin ===== */
.cek-perde{background:rgba(58,36,24,.35)!important}
.cek{background:#FBF6EE!important;color:#3A2418!important;border-left:1px solid rgba(58,36,24,.12)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:-20px 0 50px -20px rgba(58,36,24,.35)}
.cek-ust span{color:#895848!important}
.cek-kapat{border-color:rgba(58,36,24,.2)!important;color:#3A2418!important}
.cek-kapat:hover{background:#fff!important;border-color:rgba(58,36,24,.45)!important}
.cek-baslik{color:#895848!important}
.cek-bolum a{color:#3A2418!important;border-bottom-color:rgba(58,36,24,.1)!important}
.cek-bolum a:hover,.cek-bolum a[aria-current]{color:#5E5396!important}
.cek-giris{border-top-color:rgba(58,36,24,.12)!important}
.cek-giris a{border-color:rgba(58,36,24,.25)!important;color:#3A2418!important}
.cek-giris a:hover{background:#fff!important;border-color:#3A2418!important}
.y-kutu{border:0!important}
.y-k-bagis{background:#FBB040!important;color:#3A2418!important}
.y-k-sahiplen{background:#fff!important;color:#3A2418!important;box-shadow:inset 0 0 0 1.5px rgba(58,36,24,.14)}
.y-k-gecici{background:#fff!important;color:#3A2418!important;box-shadow:inset 0 0 0 1.5px rgba(58,36,24,.14)}
.y-k-sahiplen > span:first-child,.y-k-gecici > span:first-child{position:relative;padding-left:18px}
.y-k-sahiplen > span:first-child::before,.y-k-gecici > span:first-child::before{content:"";position:absolute;left:0;top:8px;width:9px;height:9px;border-radius:50%;background:#796EB1}
.y-k-gecici > span:first-child::before{background:#EF859F}
.y-k-gecici .y-rozet{background:#EF859F!important;color:#3A2418!important}
.y-kutu small{color:#5A4238;opacity:1!important}
.y-k-bagis small{color:#3A2418}
.y-cek-dil a{border-color:rgba(58,36,24,.18)!important;color:#5A4238!important}
.y-cek-dil a[aria-current]{background:#fff!important;border-color:#3A2418!important;color:#3A2418!important}

/* ===== koruma altındaki can: öne çıkan bileşen ===== */
.rk-grid{grid-template-columns:repeat(4,1fr)!important}
.rk-ana{grid-column:1/-1!important;grid-row:auto!important;display:grid!important;grid-template-columns:.9fr 1.1fr;gap:clamp(20px,3vw,48px);align-items:center;
  padding:clamp(24px,3.2vw,44px)!important;position:relative;overflow:hidden;background:#FBB040!important}
.ca-sol{position:relative;z-index:2;display:flex;flex-direction:column}
.ca-sayi{display:block;margin:6px 0 10px;font-size:clamp(5.6rem,12vw,11rem);font-weight:900;font-variation-settings:"wdth" 122,"wght" 900;line-height:.86;letter-spacing:-.02em;color:#3A2418;font-variant-numeric:tabular-nums}
.ca-cumle{margin:0 0 20px!important;font-size:clamp(17px,1.4vw,20px)!important;font-weight:700!important;color:#3A2418!important;max-width:30ch;line-height:1.45!important}
.ca-kir{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:22px}
.ca-cip{display:flex;align-items:center;gap:10px;background:#FBF6EE;border-radius:18px;padding:8px 16px 8px 10px}
.ca-ik{width:30px;height:40px;color:#3A2418}
.ca-cip span{font-size:15px;font-weight:700;color:#5A4238}
.ca-cip b{font-size:26px;font-weight:900;font-variation-settings:"wdth" 118;color:#3A2418;margin-right:4px;font-variant-numeric:tabular-nums}
.ca-lnk{display:inline-flex;align-items:center;gap:10px;align-self:flex-start;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#3A2418;border-bottom:2px solid #3A2418;padding-bottom:4px}
.ca-lnk svg{width:16px;height:16px;transition:transform .2s}
.ca-lnk:hover svg{transform:translateX(4px)}
.ca-sag{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0}
.ca-sahne{position:relative;height:clamp(200px,20vw,280px);color:#3A2418}
.ca-halka{position:absolute;right:8%;top:0;width:clamp(90px,10vw,140px);height:clamp(90px,10vw,140px);color:#FBF6EE;opacity:.9}
.ca-kivrim{position:absolute;width:70px;height:26px;color:#6F63A8}
.ca-kivrim.k1{left:6%;top:6%;transform:rotate(-14deg)}
.ca-kivrim.k2{right:34%;top:2%;transform:rotate(10deg);color:#FBF6EE}
.ca-pati{position:absolute;width:26px;height:26px;color:#EF859F}
.ca-pati.p1{left:30%;top:10%;transform:rotate(-20deg)}.ca-pati.p2{left:36%;top:0;width:20px;height:20px;transform:rotate(10deg)}
.ca-fig{position:absolute;bottom:10px;height:78%;aspect-ratio:200/260;color:#3A2418;transform-origin:50% 100%;animation:nefes 3.6s ease-in-out infinite}
.ca-fig.f1{left:4%;height:70%}
.ca-fig.f2{left:28%;height:92%;animation-delay:-.8s}
.ca-fig.f3{left:52%;height:74%;transform:scaleX(-1);animation-name:nefes-ters;animation-delay:-1.6s}
.ca-fig.f4{left:74%;height:58%;animation-delay:-2.3s}
@keyframes nefes{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-4px) rotate(-1.2deg)}}
@keyframes nefes-ters{0%,100%{transform:scaleX(-1) translateY(0) rotate(0)}50%{transform:scaleX(-1) translateY(-4px) rotate(-1.2deg)}}
.ca-zemin{position:absolute;left:0;right:0;bottom:4px;width:100%;height:14px;color:#3A2418}
.ca-noktalar{background:rgba(251,246,238,.35);border-radius:18px;padding:14px 16px 10px}
.ca-noktalar svg{display:block;width:100%;height:auto}
.ca-noktalar circle{opacity:0;transition:opacity .35s}
.ca-noktalar.gorunur circle{opacity:1}
.ca-lejant{display:flex;gap:18px;justify-content:flex-end;margin-top:8px;font-size:13px;font-weight:700;color:#3A2418}
.ca-lejant span{display:flex;align-items:center;gap:6px}
.ca-lejant i{width:9px;height:9px;border-radius:50%;display:block}
.ca-lejant .kp{background:#3A2418}.ca-lejant .es{background:#FBF6EE;box-shadow:0 0 0 2px #6F63A8}
@media (max-width:1100px){.rk-grid{grid-template-columns:1fr 1fr!important}}
@media (max-width:880px){.rk-ana{grid-template-columns:1fr}.ca-sahne{height:190px}}
@media (max-width:600px){.rk-grid{grid-template-columns:1fr!important}.ca-sayi{font-size:6.2rem}}
@media (prefers-reduced-motion:reduce){.ca-fig{animation:none!important}.ca-noktalar circle{transition:none}}

/* ===== erişilebilirlik: görünür odak çerçevesi + içeriğe geç bağlantısı ===== */
:focus-visible{outline:3px solid #3A2418;outline-offset:3px}
.sahne :focus-visible{outline-color:#FBF6EE}
.sahne .y-panel :focus-visible,.sahne .cek :focus-visible{outline-color:#3A2418}
.yatay:focus-visible{outline:3px solid #FBF6EE;outline-offset:-8px}
#icerik:focus{outline:none}
.atla{position:fixed;top:12px;left:12px;z-index:1000;padding:12px 22px;border-radius:999px;background:#FBF6EE;color:#3A2418;font-size:14px;font-weight:800;box-shadow:0 8px 28px rgba(58,36,24,.28);translate:0 -180%;transition:translate .35s cubic-bezier(.16,1,.3,1)}
.atla:focus{translate:0 0}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ===== hareket: açılış, görünür olunca belirme, rulet sayaç ===== */
:root{--ease-cikis:cubic-bezier(.16,1,.3,1)}
@keyframes pmb-foto{from{opacity:0;scale:1.08}to{opacity:1;scale:1}}
@keyframes pmb-yukari{from{opacity:0;translate:0 26px}to{opacity:1;translate:0 0}}
@keyframes pmb-asagi{from{opacity:0;translate:0 -14px}to{opacity:1;translate:0 0}}
@keyframes pmb-rv{from{opacity:0;translate:0 32px}to{opacity:1;translate:0 0}}
/* açılış: yalnızca "backwards" dolgu, bitince eleman kendi stiline döner (katman/z-index etkilenmez) */
.panel-foto{animation:pmb-foto 1.8s var(--ease-cikis) backwards}
.y-bas{animation:pmb-asagi .9s var(--ease-cikis) .1s backwards}
.panel-ic > *{animation:pmb-yukari 1s var(--ease-cikis) backwards}
.panel-ic > :nth-child(1){animation-delay:.25s}
.panel-ic > :nth-child(2){animation-delay:.37s}
.panel-ic > :nth-child(3){animation-delay:.49s}
.panel-ic > :nth-child(4){animation-delay:.61s}
.yatay-kontrol{animation:pmb-yukari .9s var(--ease-cikis) .8s backwards}
/* belirme (js/main.js sınıfları ekler ve animasyon bitince kaldırır) */
.rv{opacity:0;translate:0 32px}
.rv.rv-acik{animation:pmb-rv .95s var(--ease-cikis) var(--rv-g,0ms) both}
/* üzerine gelme geçişleri aynı eğriyle */
.kart,.kart img,.kart::before,.rk-btn,.btn-kesfet .yuv,.ca-lnk svg,.y-nav-btn svg{transition-timing-function:var(--ease-cikis)}
/* rulet */
.rl-hane{position:relative;display:inline-block;-webkit-mask-image:linear-gradient(transparent,#fff 8%,#fff 92%,transparent);mask-image:linear-gradient(transparent,#fff 8%,#fff 92%,transparent)}
.rl-gorsel{white-space:nowrap}
/* .hk-sayilar span, .ca-cip span gibi eski kurallar rulet parçalarına sızmasın */
span.rl-gorsel,.rl-gorsel span{font:inherit;color:inherit;letter-spacing:inherit}
.rl-hayalet{visibility:hidden}
.rl-gorsel .rl-serit{position:absolute;left:50%;top:0;display:flex;flex-direction:column;align-items:center;translate:-50% 0;font-variant-numeric:tabular-nums;will-change:transform}
.rl-serit span{display:block}
@media (prefers-reduced-motion:reduce){
  .panel-foto,.y-bas,.panel-ic > *,.yatay-kontrol,.rv.rv-acik{animation:none!important}
  .rv{opacity:1;translate:none}
  .atla{transition:none}
}

/* ===== açılır menüler: krem buzlu cam ===== */
.y-panel{background:rgba(251,246,238,.74);-webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);
  border:1px solid rgba(255,255,255,.6);box-shadow:0 26px 60px -14px rgba(40,24,14,.45),inset 0 1px 0 rgba(255,255,255,.7)}
.y-panel a{transition:background-color .2s var(--ease-cikis)}
.y-panel a:hover{background:rgba(255,255,255,.62)}
.y-panel .ik{background:rgba(255,255,255,.6);color:#895848}
.y-panel b{color:#3A2418}
.y-panel small{color:#5A4238}
.y-panel .ayr{background:rgba(58,36,24,.12)}
.y-panel .hgk .ik{background:#6F63A8;color:#fff}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.y-panel{background:#FBF6EE}}

/* ===== yapışkan header: aşağı kaydırınca cam şerit olarak iner ===== */
@keyframes pmb-in{from{opacity:.3;translate:0 -130%}to{opacity:1;translate:0 0}}
.y-bas.yapiskan{position:fixed!important;top:10px;left:max(10px,calc(clamp(0px,1.3vw,18px) + 10px));right:max(10px,calc(clamp(0px,1.3vw,18px) + 10px));z-index:200;
  padding:8px 10px 8px 18px;border-radius:24px;background:rgba(251,246,238,.8);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);
  border:1px solid rgba(255,255,255,.65);box-shadow:0 16px 40px -18px rgba(58,36,24,.45);animation:pmb-in .6s var(--ease-cikis) backwards}
.y-bas.yapiskan .marka img{height:44px}
.y-bas.yapiskan .y-nav-btn{color:#3A2418}
.y-bas.yapiskan .y-nav-btn:hover,.y-bas.yapiskan .y-nav-btn[aria-expanded="true"]{background:rgba(58,36,24,.07);color:#3A2418}
.y-bas.yapiskan .y-sahiplen,.y-bas.yapiskan .y-gecici{background:#fff!important;box-shadow:inset 0 0 0 1.5px rgba(58,36,24,.12)!important}
.y-bas.yapiskan .y-bagis{box-shadow:0 6px 16px -8px rgba(251,176,64,.8)!important}
.y-bas.yapiskan .ikon-btn,.y-bas.yapiskan .menu-btn{background:rgba(255,255,255,.65);border-color:rgba(58,36,24,.2);color:#3A2418;-webkit-backdrop-filter:none;backdrop-filter:none}
.y-bas.yapiskan .ikon-btn:hover{background:#fff;border-color:rgba(58,36,24,.4)}
.y-bas.yapiskan .y-araclar{border-left-color:rgba(58,36,24,.15)}
.y-bas.yapiskan .arama input{color:#3A2418}
.y-bas.yapiskan .arama input::placeholder{color:rgba(58,36,24,.55)}
.y-bas.yapiskan .arama.acik{border-bottom-color:rgba(58,36,24,.4)}
.sahne .y-bas.yapiskan :focus-visible{outline-color:#3A2418}
/* camın içindeki cam arkasını bulanıklaştıramaz (backdrop root); yapışkan hâlde menü neredeyse opak */
.y-bas.yapiskan .y-panel{background:rgba(251,246,238,.97)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.y-bas.yapiskan{background:#FBF6EE}}
@media (max-width:760px){.y-bas.yapiskan{padding:6px 8px 6px 14px;border-radius:20px}.y-bas.yapiskan .marka img{height:38px}}

/* ===== bahçe rakamlarla: daha az nokta (1 nokta = 10 köpek) ===== */
.ca-noktalar{padding:16px 18px 12px}
.ca-noktalar circle{transform-box:fill-box;transform-origin:center;transform:scale(.3);transition:opacity .45s,transform .7s var(--ease-cikis)}
.ca-noktalar.gorunur circle{transform:none}
.ca-lejant{margin-top:10px}

/* ===== alışveriş: kayan dayanışma ürünleri ===== */
.mg-bas{display:flex;align-items:flex-end;justify-content:space-between;gap:20px 32px;flex-wrap:wrap}
.mg-bas .b-bas{margin-bottom:0!important}
.mg-eylem{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mg-eylem .rk-btn-cizgi{margin-top:0}
.mg-dur{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 18px;border-radius:999px;border:2px solid rgba(58,36,24,.2);color:#3A2418;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;transition:background-color .2s,border-color .2s}
.mg-dur:hover{background:#fff;border-color:rgba(58,36,24,.45)}
.mg-dur[hidden]{display:none}
.mg-dur svg{width:14px;height:14px}
.mg-ik-oyna,.mg-dur.durdu .mg-ik-dur{display:none}
.mg-dur.durdu .mg-ik-oyna{display:block}
.mg-serit{margin:clamp(26px,3.2vw,42px) calc(-1 * clamp(16px,3vw,40px)) 0;padding:8px clamp(16px,3vw,40px) 22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#fff 4%,#fff 96%,transparent);mask-image:linear-gradient(90deg,transparent,#fff 4%,#fff 96%,transparent)}
.mg-serit::-webkit-scrollbar{display:none}
.mg-serit:focus-visible{outline-offset:-3px}
.mg-iz{list-style:none;margin:0;padding:0;display:flex;width:max-content}
.mg-iz > li{flex:0 0 auto;margin-right:18px;scroll-snap-align:start}
.mg-serit.kayar{overflow:hidden;scroll-snap-type:none}
.mg-serit.kayar .mg-iz{animation:mg-kay var(--mg-sure,60s) linear infinite}
.mg-serit.kayar:hover .mg-iz,.mg-serit.kayar:focus-within .mg-iz,.mg-serit.durdu .mg-iz{animation-play-state:paused}
@keyframes mg-kay{to{transform:translateX(-50%)}}
.urun{display:flex;flex-direction:column;width:clamp(230px,21vw,272px);height:100%;padding:10px 10px 18px;border-radius:22px;background:#fff;color:#3A2418;
  box-shadow:0 12px 30px -20px rgba(58,36,24,.4);transition:translate .4s var(--ease-cikis),box-shadow .4s var(--ease-cikis)}
.urun:hover{translate:0 -6px;box-shadow:0 22px 44px -22px rgba(58,36,24,.5)}
.u-gorsel{position:relative;aspect-ratio:1/1;border-radius:16px;display:grid;place-items:center;background:#F3EADF;overflow:hidden}
.urun[data-ton="0"] .u-gorsel{background:#FBB040}
.urun[data-ton="1"] .u-gorsel{background:#C9C2F0}
.urun[data-ton="2"] .u-gorsel{background:#F6A9BC}
.u-ik{width:44%;height:44%;color:#3A2418;transition:transform .6s var(--ease-cikis)}
.urun:hover .u-ik{transform:scale(1.08) rotate(-5deg)}
.u-kat{position:absolute;top:12px;left:12px;padding:5px 10px;border-radius:999px;background:rgba(251,246,238,.88);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#3A2418}
.u-ic{display:flex;flex-direction:column;flex:1;padding:14px 8px 0}
.u-ust{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.u-ad{margin:0;font-size:17px;font-weight:800;font-variation-settings:"wdth" 110;line-height:1.2;letter-spacing:-.008em}
.u-fiyat{font-size:17px;font-weight:900;font-variation-settings:"wdth" 116;white-space:nowrap;font-variant-numeric:tabular-nums}
.u-alt{display:block;margin:6px 0 12px;font-size:13.5px;line-height:1.45;color:#5A4238}
.u-etki{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:12px;border-top:1px solid rgba(58,36,24,.1);font-size:13px;font-weight:800;color:#895848}
.u-mama{width:17px;height:17px;flex-shrink:0;color:#EF859F}
@media (prefers-reduced-motion:reduce){.mg-serit.kayar .mg-iz{animation:none}}

/* ===== bağış paneli başlığı kısaldı: diğer panellerle aynı boyut ===== */
#p2 .panel-baslik{font-size:clamp(2rem,3.3vw,3.3rem)!important}
@media (max-width:880px){#p2 .panel-baslik{font-size:clamp(1.6rem,6.6vw,2.1rem)!important}}

/* ===== Bağış butonu yazısı: lacivert (--gece) yerine koyu kahve ===== */
.btn-bagis{color:#3A2418!important}

/* ===== inceleme düzeltmeleri: renk, odak, arama, şerit, sürekli hareket, yazdırma ===== */
/* eski lacivert değişken yalnızca metin renginde kalmıştı (mobil alt çubuk, hero oku vb.): koyu kahveye çekilir */
:root{--gece:#3A2418}
/* sabit header ve mobil alt çubuk odağı/çapa hedeflerini örtmesin */
html{scroll-padding-top:96px}
#icerik{scroll-margin-top:96px}
@media (max-width:760px){html{scroll-padding-bottom:90px}}
/* kapalı arama kutusu görünmez bir Tab durağı olmasın */
.arama:not(.acik) input{visibility:hidden}
.y-bas.yapiskan .arama input::placeholder{color:#76665E}
/* ürün şeridi: klavye odağı girince kayma durur, şerit elle kaydırılır */
.mg-serit.kayar.odakta{overflow-x:auto;scroll-snap-type:x proximity}
.mg-serit.kayar.odakta .mg-iz{animation:none;transform:none}
/* "görünür olunca bir kez" kuralı: sürekli dönen hareketler birkaç turda durur */
.ca-fig{animation-iteration-count:3!important}
.nabiz{animation-iteration-count:4}
/* yazdırma / PDF: belirme animasyonu içeriği gizlemesin, sabit öğeler basılmasın */
@media print{
  .rv{opacity:1!important;translate:none!important;animation:none!important}
  .ca-noktalar circle{opacity:1!important;transform:none!important}
  .y-bas.yapiskan{position:absolute!important;animation:none!important}
  .y-alt,.cek,.cek-perde,.atla,.mg-dur{display:none!important}
  .mg-serit.kayar .mg-iz{animation:none!important}
}

/* ===== hangel paneli: arka plan videosu ===== */
.panel-video{object-position:58% 50%}
.panel-video-dur{position:absolute;z-index:4;right:clamp(20px,3.4vw,50px);bottom:clamp(84px,7vw,100px);width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  color:#fff;background:rgba(40,24,14,.35);border:1px solid rgba(244,237,233,.4);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background-color .2s}
.panel-video-dur:hover{background:rgba(40,24,14,.6)}
.panel-video-dur[hidden]{display:none}
.panel-video-dur svg{width:14px;height:14px}
.panel-video-dur .ik-oyna,.panel-video-dur.duruyor .ik-dur{display:none}
.panel-video-dur.duruyor .ik-oyna{display:block}
@media (max-width:880px){.panel-video-dur{top:96px;bottom:auto;right:16px}}

/* ===== mobil tam ekran hero + otomatik slayt deneyimi ===== */
.y-oto-dur{display:none}
@media (max-width:880px){
  .sahne{height:calc(100svh - 42px)!important;min-height:560px!important;max-height:none!important}
  .yatay-kontrol{gap:12px!important}
  .y-oto-dur{pointer-events:auto;display:grid;width:34px;height:34px;place-items:center;flex:0 0 34px;border-radius:50%;color:#fff;background:rgba(40,24,14,.4);border:1px solid rgba(244,237,233,.38);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  .y-oto-dur svg{width:13px;height:13px}
  .y-oto-oyna-ik,.y-oto-dur.durdu .y-oto-dur-ik{display:none}
  .y-oto-dur.durdu .y-oto-oyna-ik{display:block}
}
@media (max-width:760px){
  .yatay-kontrol{bottom:calc(env(safe-area-inset-bottom,0px) + 94px)!important}
  .panel-ic{padding-bottom:150px!important}
}
@media (max-width:880px) and (prefers-reduced-motion:no-preference){
  .panel-foto{animation:none!important;transform:scale(1.035);transition:transform 6.5s cubic-bezier(.2,.7,.2,1)}
  .panel.aktif .panel-foto{transform:scale(1)}
  .panel .panel-ic>*{animation:none!important;opacity:0;transform:translateY(18px);transition:opacity .6s ease,transform .72s cubic-bezier(.2,.7,.3,1)}
  .panel.aktif .panel-ic>*{opacity:1;transform:none}
  .panel.aktif .panel-ic>:nth-child(2){transition-delay:.08s}
  .panel.aktif .panel-ic>:nth-child(3){transition-delay:.16s}
  .panel.aktif .panel-ic>:nth-child(4){transition-delay:.24s}
  .sekmeler button i{position:relative;overflow:hidden}
  .sekmeler button[aria-selected="true"] i{background:rgba(244,237,233,.45)!important}
  .sekmeler button[aria-selected="true"] i::after{content:"";position:absolute;inset:0;background:#FBB040;transform:scaleX(0);transform-origin:left center}
  .sekmeler.oto-hazir button[aria-selected="true"] i::after{animation:hero-oto-ilerle var(--hero-oto-sure,5600ms) linear forwards}
}
@keyframes hero-oto-ilerle{to{transform:scaleX(1)}}

/* ===== hero yazıları: dengeli satırlar, fotoğraftaki konuya binmeyen dar sütun ===== */
@media (min-width:881px){
  .panel-ic{max-width:min(700px,50vw)!important}
  #p1 .panel-ic{max-width:min(620px,44vw)!important}   /* 1. panelde köpeğin yüzüne binmesin */
  .panel-ic p{max-width:40ch}
}
.panel-baslik,.panel-ic p,.ic-spot,.b-bas h2,.b-giris{text-wrap:balance}
main p{text-wrap:pretty}

/* ===== ana sayfa düzeni: eşit bölüm aralıkları, birleşik bütçe kartı, koruma altındaki can mizanpajı, başlıksız ürün şeridi ===== */
:root{--ana-ara:clamp(56px,6vw,88px)}
.ana > .bolum{padding-top:var(--ana-ara)!important;padding-bottom:0!important}
.ana > .bolum:last-child{padding-bottom:0!important}
.ana ~ .ayak2{margin-top:var(--ana-ara)!important}   /* son bölüm → footer arası da aynı */
/* ürünler: başlık yok, şerit doğrudan başlar; durdur + tüm ürünler altta sağda */
.magaza .mg-serit{margin-top:0}
.mg-alt{justify-content:flex-end;margin-top:4px}
/* bir günün maliyeti + eylül bütçesi tek kartta iki yarı */
.rk-butce{grid-column:span 2;display:grid!important;grid-template-columns:1fr 1fr;padding:0!important}
.rk-yarim{display:flex;flex-direction:column;min-width:0;padding:clamp(20px,2.2vw,28px)}
.rk-yarim + .rk-yarim{border-left:1px solid rgba(58,36,24,.1)}
.rk-yarim .rk-v{font-size:clamp(2.2rem,3vw,3.4rem)!important}   /* yarım genişlikte rakamlar birbirine binmesin */
@media (max-width:600px){.rk-butce{grid-column:auto;grid-template-columns:1fr}.rk-yarim + .rk-yarim{border-left:0;border-top:1px solid rgba(58,36,24,.1)}}
/* koruma altındaki can: sol sütun iki uca yaslanır (rakam üstte, çipler + bağlantı altta, sağdaki nokta tablosuyla aynı hizada) */
.rk-ana{align-items:stretch!important}
.ca-sol{height:100%}
.ca-sol .ca-kir{margin-top:auto}
.ca-sag{justify-content:space-between}

/* ===== koruma altındaki can: toparlama (süsler figürlere binmez, sol sütun ortalı blok, mobilde çipler yan yana) ===== */
.ca-sol{justify-content:center;gap:0}
.ca-sol .ca-kir{margin-top:0}
.ca-cumle{max-width:34ch!important}
.ca-fig{z-index:2}
.ca-halka,.ca-kivrim,.ca-pati{z-index:1}
.ca-halka{right:1%!important;top:-2%!important;width:clamp(64px,6.5vw,96px)!important;height:clamp(64px,6.5vw,96px)!important}
.ca-kivrim.k1{left:1%!important;top:2%!important}
.ca-kivrim.k2{left:57%!important;right:auto!important;top:4%!important}
.ca-pati.p1{left:15%!important;top:6%!important}
.ca-pati.p2{left:21%!important;top:0!important}
@media (max-width:600px){
  .ca-kir{flex-wrap:nowrap;gap:8px}
  .ca-cip{padding:6px 12px 6px 8px;gap:8px}
  .ca-cip b{font-size:22px}
  .ca-ik{width:24px;height:32px}
}

/* ===== hakkımızda: ekip fotoğrafı (16:9, kenardaki kişiler kesilmesin) ===== */
.hk-foto-ekip img{aspect-ratio:16/9;object-position:50% 40%}

/* ===== tanıtım videosu penceresi (ana sayfa, ilk ziyaret) ===== */
html.vp-acik{overflow:hidden}
.vp{position:fixed;inset:0;z-index:400;display:grid;place-items:center;padding:16px}
.vp[hidden]{display:none}
.vp-perde{position:absolute;inset:0;background:rgba(58,36,24,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .25s ease}
.vp-kutu{position:relative;width:min(960px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:#FBF6EE;border-radius:24px;padding:clamp(14px,2vw,22px);
  box-shadow:0 30px 80px -30px rgba(58,36,24,.6);opacity:0;transform:translateY(16px) scale(.98);transition:opacity .25s ease,transform .3s cubic-bezier(.2,.8,.2,1)}
.vp.gorunur .vp-perde,.vp.gorunur .vp-kutu{opacity:1}
.vp.gorunur .vp-kutu{transform:none}
.vp-ust{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 2px 14px}
.vp-et{margin:0 0 4px;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#895848}
.vp-bas{margin:0;font-size:clamp(1.3rem,2.4vw,1.9rem);font-weight:900;font-variation-settings:"wdth" 120;line-height:1.05;letter-spacing:-.01em;text-transform:uppercase;color:#3A2418}
.vp-kapat{flex-shrink:0;width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(58,36,24,.2);background:#fff;color:#3A2418;display:grid;place-items:center;cursor:pointer;transition:border-color .2s,transform .2s}
.vp-kapat:hover{border-color:#3A2418;transform:rotate(90deg)}
.vp-kapat:focus-visible{outline:3px solid #3A2418;outline-offset:3px}
.vp-kapat svg{width:20px;height:20px}
.vp-video{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#3A2418}
.vp-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vp-alt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin:14px 2px 0}
.vp-not{margin:0;font-size:13.5px;color:#5A4238}
.vp-bagis{display:inline-flex;align-items:center;min-height:44px;padding:0 22px;border-radius:999px;background:#FBB040;color:#3A2418;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;text-decoration:none}
.vp-bagis:hover{background:#F9A21E}
.vp-bagis:focus-visible{outline:3px solid #3A2418;outline-offset:3px}
@media (max-width:560px){.vp-bagis{width:100%;justify-content:center}}
@media (prefers-reduced-motion:reduce){.vp-perde,.vp-kutu{transition:none}.vp-kapat:hover{transform:none}}

/* ===== tipografi ve ritim (revize: "Ocean Cleanup gibi ferah" + Türkçe büyük harf) =====
   Archivo 900'de İ/Ü/Ğ işareti taban çizgisinin 0.885em üstüne, Ş/Ç çengeli 0.211em altına taşar.
   Büyük harf başlıkta iki satır birbirine değmesin diye satır yüksekliği en az 1.10 olmalı; nefes payıyla 1.16.
   Harf aralığı eksi değil 0: Türkçe işaretli büyük harfler sıkışık görünmesin.
   Boşluklar Ocean Cleanup ritmi: bölümler arası geniş, başlık → metin sabit, okuma sütunu dar. Tüm sayfalarda aynı değişkenler. */
:root{
  --baslik-lh:1.16;
  --baslik-ls:0em;
  --etiket-ls:.08em;
  --ritim:clamp(84px,10vw,152px);          /* bölümden bölüme */
  --ritim-et:16px;                          /* etiket → başlık */
  --ritim-baslik:clamp(18px,1.8vw,26px);    /* başlık → giriş paragrafı */
  --ritim-icerik:clamp(40px,4.6vw,68px);    /* bölüm başı → içerik */
  --metin-lh:1.65;                          /* okuma metni */
  --metin-olcu:58ch;                        /* giriş paragrafı en fazla ~58 karakter */
  --ana-ara:var(--ritim);
}
:is(h1,h2,h3,.panel-baslik,.ic-baslik,.kh-katil-bas):not(.ic-etiket):not(.sr-only):not(.ayak2 h3){line-height:var(--baslik-lh)!important;letter-spacing:var(--baslik-ls)!important}
/* küçük büyük harf etiketler ve butonlar: tek harf aralığı */
.caps,.b-et,.rk-k,.ayak2 h3,.vp-et,.btn,.btn-kesfet,.btn-bagis,.btn-mor,.rk-btn,.ca-lnk,.mg-dur,.cek-giris a,.a-iban button,.kart .ad,
.ic-etiket,.ic-rozet,.ic-dl dt,.ic-bagis .bg-adim-bas,.ic-bagis .bg-dagilim-bas,.ic-giris .gr-ayirici,.ic-alisveris .al-serit dt,.ic-alisveris .al-sb-sol dt,
.ic-hangel .hgl-marka span,.ic-hangel .hgl-magaza-yazi small,.ic-hesabim .hs-uye,.ic-hesabim .hs-kart-baslik,.ic-hesabim .hs-dagilim-bas,.ic-hesabim .hs-indir,
.ic-hesabim .hs-kutuk,.ic-hesabim .hs-zaman-t,.ic-kahramanlarimiz .kh-iz dt,.ic-kahramanlarimiz .kh-ay-sayilar dt,.ic-sahiplen .sh-can-aylik span{letter-spacing:var(--etiket-ls)!important}
/* bölüm başı: etiket → başlık → giriş → içerik */
.b-et{margin-bottom:var(--ritim-et)!important}
.b-giris{margin-top:var(--ritim-baslik)!important;max-width:var(--metin-olcu)!important;line-height:1.6!important}
.b-bas{margin-bottom:var(--ritim-icerik)!important}
.panel-ic p{line-height:1.6!important}
/* okuma metni */
main p{line-height:var(--metin-lh)!important}

/* ===== dil seçimi: seçili dil yüklenene kadar Türkçe metin bir an görünüp değişmesin (js/dil.js kaldırır; en geç 2,5 sn) ===== */
html.dil-bekle body{visibility:hidden}
/* Başlıkları kelimenin ortasından bölme. Uzun çeviriler sayfaya özel ölçülendirilir. */
html:lang(de) :is(h1,h2,h3,.panel-baslik,.ic-baslik,.btn),html:lang(en) :is(h1,h2,h3,.panel-baslik,.ic-baslik){
  -webkit-hyphens:none;hyphens:none;overflow-wrap:normal;word-break:normal
}

/* Dar telefonlarda üst şeritte Hangel logosu yeterli; uzun slogan kırpılmasın. */
@media (max-width:520px){
  body:not(.ana-sayfa) .y-hg-metin{display:none}
  body:not(.ana-sayfa) .y-hg{gap:6px}
}

/* ===== mobil hızlı eylemler: hero sonrası beliren yüzen cam butonlar ===== */
@media (max-width:760px){
  .y-alt{
    display:flex!important;grid-template-columns:none!important;align-items:stretch;gap:8px;
    left:50%!important;right:auto!important;bottom:max(18px,calc(env(safe-area-inset-bottom,0px) + 10px))!important;
    width:min(calc(100% - 24px),520px);padding:0!important;background:transparent!important;border:0!important;
    opacity:0;visibility:hidden;pointer-events:none;transform:translate(-50%,18px) scale(.97);
    transition:opacity .24s ease,transform .32s cubic-bezier(.2,.8,.2,1),visibility 0s linear .32s;
  }
  .y-alt.gorunur{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1);transition-delay:0s}
  .y-alt a{
    flex:1 1 0;min-width:0;min-height:56px!important;padding:7px 9px!important;gap:7px!important;
    border:1px solid rgba(255,255,255,.72)!important;border-radius:18px!important;
    background:rgba(255,250,245,.84)!important;color:#3A2418!important;
    -webkit-backdrop-filter:blur(18px) saturate(1.18);backdrop-filter:blur(18px) saturate(1.18);
    box-shadow:0 12px 30px -16px rgba(58,36,24,.62),inset 0 0 0 1px rgba(58,36,24,.06)!important;
    font-size:clamp(11px,3.3vw,14px)!important;line-height:1.05;text-align:center;
  }
  .y-alt .a3{background:rgba(251,176,64,.9)!important;border-color:rgba(255,218,161,.78)!important}
  .y-alt-ik{display:block;flex:0 0 25px;width:25px;height:25px;background:currentColor;
    -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
  .y-alt-ik-sahiplen{color:#65599D;-webkit-mask-image:url('../assets/icons/arcticons/emoji_dog_face.svg');mask-image:url('../assets/icons/arcticons/emoji_dog_face.svg')}
  .y-alt-ik-yuva{color:#C65370;-webkit-mask-image:url('../assets/icons/arcticons/home.svg');mask-image:url('../assets/icons/arcticons/home.svg')}
  .y-alt-ik-bagis{color:#3A2418;-webkit-mask-image:url('../assets/icons/arcticons/emoji_heart.svg');mask-image:url('../assets/icons/arcticons/emoji_heart.svg')}
  .y-alt .a2 .y-rozet{top:-7px!important;right:6px!important;min-width:21px;height:21px;padding:0 6px;font-size:11px;
    border:2px solid #FBF6EE;background:#EF859F!important;box-shadow:0 4px 12px -5px rgba(58,36,24,.45)}
  .y-alt a:focus-visible{outline:3px solid #3A2418;outline-offset:3px}
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))!important}
}
@media (max-width:360px){
  .y-alt{gap:6px;width:calc(100% - 16px)}
  .y-alt a{padding-inline:6px!important;font-size:11px!important}
  .y-alt-ik{flex-basis:22px;width:22px;height:22px}
}
@media (max-width:760px) and (prefers-reduced-motion:reduce){.y-alt{transition:none}}

/* ===== mobil ilk ekran: tarayıcı görünür alanını dolduran tek parça hero ===== */
@media (max-width:880px){
  body.ana-sayfa .sahne{
    height:100vh!important;height:100svh!important;min-height:560px!important;max-height:none!important;
    margin:0!important;border-radius:0!important;box-shadow:none!important;
  }
  /* hangel / dil / giriş şeridi artık hero fotoğrafının üzerindeki yüzen cam katmandır */
  body.ana-sayfa .y-serit{
    position:absolute;z-index:45;
    top:max(10px,env(safe-area-inset-top,0px));left:12px;right:12px;
    margin:0!important;border:1px solid rgba(255,255,255,.34)!important;border-radius:18px;
    background:rgba(49,31,23,.55)!important;color:#fff;
    -webkit-backdrop-filter:blur(18px) saturate(1.28);backdrop-filter:blur(18px) saturate(1.28);
    box-shadow:0 12px 30px -18px rgba(20,10,5,.72),inset 0 1px 0 rgba(255,255,255,.12);
  }
  body.ana-sayfa .y-serit-ic{height:48px;padding:0 12px;gap:10px}
  body.ana-sayfa .y-hg,body.ana-sayfa .y-btn{color:#fff!important;text-shadow:0 1px 10px rgba(20,10,5,.42)}
  body.ana-sayfa .y-hg:hover{color:#fff!important}
  body.ana-sayfa .y-hg-logo{background:rgba(255,255,255,.94)!important;color:#674334!important;box-shadow:0 4px 14px -8px rgba(20,10,5,.7)}
  body.ana-sayfa .y-btn:hover,body.ana-sayfa .y-btn[aria-expanded="true"]{background:rgba(255,255,255,.14)!important;color:#fff!important}
  body.ana-sayfa .y-ayrac{background:rgba(255,255,255,.3)}
  /* cam şeridin altındaki ana navigasyon */
  body.ana-sayfa .y-bas{top:calc(max(10px,env(safe-area-inset-top,0px)) + 62px)}
  body.ana-sayfa .y-bas:not(.yapiskan) .menu-btn{
    background:rgba(49,31,23,.5);border-color:rgba(255,255,255,.34);color:#fff;
    -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2);
    box-shadow:0 10px 28px -16px rgba(20,10,5,.75);
  }
  body.ana-sayfa .panel-perde{background:
    linear-gradient(180deg,rgba(40,24,14,.58) 0%,rgba(40,24,14,.2) 32%,rgba(40,24,14,.68) 66%,rgba(40,24,14,.92) 100%)}
  body.ana-sayfa .yatay-kontrol{bottom:calc(env(safe-area-inset-bottom,0px) + 22px)!important}
  body.ana-sayfa .panel-ic{padding-top:148px!important;padding-bottom:88px!important}
}
@media (max-width:380px) and (max-height:700px){
  body.ana-sayfa .y-serit{left:8px;right:8px;border-radius:16px}
  body.ana-sayfa .y-serit-ic{height:44px;padding-inline:10px}
  body.ana-sayfa .y-hg{gap:7px}
  body.ana-sayfa .y-hg-logo{font-size:11px;padding-inline:7px}
  body.ana-sayfa .y-hg-metin{font-size:11.5px}
  body.ana-sayfa .y-btn{padding-inline:7px}
  body.ana-sayfa .y-bas{top:calc(max(8px,env(safe-area-inset-top,0px)) + 54px)}
  body.ana-sayfa .y-bas .marka img{height:46px}
  body.ana-sayfa .panel-ic{padding-top:130px!important;padding-bottom:76px!important}
  body.ana-sayfa .panel-baslik,body.ana-sayfa #p2 .panel-baslik{font-size:clamp(1.45rem,6.3vw,1.9rem)!important}
  body.ana-sayfa .panel-ic p{font-size:14px!important;margin-bottom:14px!important}
  body.ana-sayfa .panel .hero-cta a{padding-block:10px!important}
  body.ana-sayfa .yatay-kontrol{bottom:calc(env(safe-area-inset-bottom,0px) + 14px)!important}
}

/* ===== mobil hero sadeleştirme: ilk karede yalnızca hikâye, logo, menü ve panel aksiyonu ===== */
@media (max-width:880px){
  /* Hangel, dil ve giriş seçenekleri mobil menüde zaten var; hero fotoğrafıyla yarışmasın. */
  body.ana-sayfa .y-serit{display:none!important}
  body.ana-sayfa .y-bas{top:max(14px,env(safe-area-inset-top,0px))}
  /* Hero içindeki panel CTA'sı bağış aksiyonunu zaten taşıyor. Üst bağış düğmesi içerik başladıktan sonra geri gelir. */
  body.ana-sayfa .y-bas:not(.yapiskan) .y-bagis{display:none!important}
  body.ana-sayfa .y-bas:not(.yapiskan){right:20px}
  body.ana-sayfa .y-bas:not(.yapiskan) .y-eylem{margin-left:auto}
  /* Küçük kategori etiketi başlıkla aynı bilgiyi tekrar ediyor. */
  body.ana-sayfa .panel-ic>.etiket{display:none!important}
  body.ana-sayfa .panel-ic{padding-top:104px!important;padding-bottom:88px!important}
  body.ana-sayfa .panel-perde{background:
    linear-gradient(180deg,rgba(40,24,14,.42) 0%,rgba(40,24,14,.12) 30%,rgba(40,24,14,.62) 62%,rgba(40,24,14,.92) 100%)}
}
@media (max-width:380px) and (max-height:700px){
  body.ana-sayfa .y-bas{top:max(10px,env(safe-area-inset-top,0px))}
  body.ana-sayfa .panel-ic{padding-top:88px!important;padding-bottom:76px!important}
}

/* ===== hangel marka varlıkları ===== */
.y-hg-logo{
  display:inline-flex!important;align-items:center;justify-content:center;flex:0 0 auto;
  width:74px;height:24px;padding:0!important;border-radius:0!important;background:transparent!important;
  box-shadow:none!important;color:inherit!important;overflow:visible;
}
.y-hg-logo img{display:block;width:100%;height:auto;max-height:22px;object-fit:contain}
.y-panel .hgk .ik-hangel{padding:0!important;overflow:hidden;background:#f94621!important;border-color:rgba(249,70,33,.25)!important}
.y-panel .hgk .ik-hangel img{display:block;width:100%;height:100%;object-fit:cover}
.hgl-marka b{display:inline-flex;align-items:center;width:112px;min-width:112px}
.hgl-marka b img{display:block;width:100%;height:auto}
.etiket-hangel{gap:8px!important}
.etiket-hangel-logo{display:block;width:70px;height:auto;max-height:22px;object-fit:contain}

/* Mobil menüde ayrı hangel alanı */
.cek-hangel-kart{
  display:flex;align-items:center;gap:12px;margin:0 0 24px;padding:11px 12px;
  border:1px solid rgba(58,36,24,.14);border-radius:18px;background:rgba(255,255,255,.72);
  color:#3A2418;box-shadow:0 12px 28px -24px rgba(58,36,24,.6);
  transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease;
}
.cek-hangel-kart:hover{transform:translateY(-1px);background:#fff;box-shadow:0 14px 30px -22px rgba(58,36,24,.72)}
.cek-hangel-kart[aria-current]{box-shadow:0 0 0 2px rgba(249,70,33,.34)}
.cek-hangel-ikon{display:block;flex:0 0 48px;width:48px;height:48px;border-radius:14px;object-fit:cover}
.cek-hangel-kart>span{display:flex;min-width:0;flex:1;flex-direction:column;align-items:flex-start;gap:4px}
.cek-hangel-logo{display:block;width:84px;height:auto;max-height:24px;object-fit:contain}
.cek-hangel-kart small{font-size:11px;font-weight:650;line-height:1.25;color:#766457}
.cek-hangel-kart>b{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:#f94621;color:#fff;font-size:17px}

/* Mobil ana sayfa: hangel logosu yalnızca ilgili hero panelinin içinde görünür. */
@media (max-width:880px){
  body.ana-sayfa #p3 .etiket-hangel{display:flex!important;align-items:center;gap:0!important;margin-bottom:14px!important}
  body.ana-sayfa #p3 .etiket-hangel>i,
  body.ana-sayfa #p3 .etiket-hangel>.caps{display:none!important}
  body.ana-sayfa #p3 .etiket-hangel-logo{width:108px;max-height:32px;filter:drop-shadow(0 2px 10px rgba(20,10,5,.35))}
}

/* Mobil tarayıcılar arasında viewport ve genişlik farklarını sabitle. */
@media (max-width:880px){
  html{overflow-x:clip}
  body.ana-sayfa .sahne{height:100vh!important;height:100svh!important;min-height:0!important;width:100%!important}
  body.ana-sayfa .panel-ic{min-width:0!important;width:100%;padding-inline:18px!important;padding-bottom:92px!important}
  body.ana-sayfa .yatay-kontrol{bottom:max(14px,env(safe-area-inset-bottom,0px))!important}
  body.ana-sayfa .panel .hero-cta{gap:10px!important}
  body.ana-sayfa .panel .hero-cta a{max-width:100%;white-space:normal;text-align:center}
  .cek{width:min(88vw,390px)!important;max-width:100%!important;padding-bottom:max(28px,env(safe-area-inset-bottom,0px))!important}
}
@media (max-width:420px) and (max-height:780px){
  body.ana-sayfa .y-bas{top:max(9px,env(safe-area-inset-top,0px))!important;left:16px!important;right:16px!important}
  body.ana-sayfa .y-bas .marka img{height:44px!important}
  body.ana-sayfa .panel-ic{padding-top:76px!important;padding-bottom:72px!important}
  body.ana-sayfa .panel-baslik,body.ana-sayfa #p2 .panel-baslik{font-size:clamp(1.42rem,6.2vw,1.82rem)!important;margin-bottom:10px!important}
  body.ana-sayfa .panel-ic p{font-size:13.5px!important;line-height:1.48!important;margin-bottom:12px!important}
  body.ana-sayfa .panel .hero-cta a{padding-block:9px!important;font-size:10.5px!important}
  body.ana-sayfa #p3 .etiket-hangel{margin-bottom:9px!important}
  body.ana-sayfa #p3 .etiket-hangel-logo{width:92px;max-height:27px}
  body.ana-sayfa .sekmeler{gap:7px!important}
  body.ana-sayfa .sekmeler button i{width:19px}
  body.ana-sayfa .sekmeler button[aria-selected="true"] i{width:34px}
  body.ana-sayfa .y-oto-dur{width:32px;height:32px;flex-basis:32px}
}