/* Esquire herkese acik site, telefon ve tablet (Mobil Site sunumu Surum 1, Bulent 07.09 "basla").
   <= 980 px: ustte ince lacivert cubuk (logo · dil · Giris/Panelim), altta sabit sekme cubugu, Menu tam ekran;
   ana sayfa kisa (yatay kategori izgarasi, ogretmen kart seridi), Ogretmenler kompakt liste, profil kimlik satiri.
   981 px ve ustu: masaustu; bu dosyadaki kurallar devreye girmez. Sinif adlari s- onekli (site.css ve panel.css ile cakismaz). */
:root{--s-navy:#0B1F4D;--s-navy2:#12307A;--s-nav-text:#C9D6F7}
.s-ust,.s-sekme,.s-menu{display:none}
@media (max-width:980px){
  /* masaustu ust cubugu gizli; telefon cubugu */
  header.ust{display:none}
  .s-ust{display:flex;align-items:center;gap:8px;padding:10px 14px;background:linear-gradient(90deg,var(--s-navy),var(--s-navy2));color:#fff;position:sticky;top:0;z-index:30;box-shadow:0 8px 24px -18px rgba(11,31,77,.6)}
  .s-ust .logo{color:#fff;flex:1;min-width:0}
  .s-ust .logo small{font:700 .52rem/1 Manrope,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--s-nav-text);opacity:.8;margin-left:6px}
  .s-ust .s-dil{border:1px solid rgba(255,255,255,.3);border-radius:999px;padding:7px 10px;font:800 .7rem/1 Manrope,sans-serif;color:#fff;background:none;cursor:pointer}
  .s-ust .s-gir{background:var(--red);color:#fff;border-radius:10px;padding:8px 12px;font:800 .74rem/1 Manrope,sans-serif;text-decoration:none;white-space:nowrap}
  .s-ust .s-gir.mavi{background:var(--blue)}
  /* govde: alt cubuk payi */
  .govde{padding:14px 12px 20px}
  .alt{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  .mesaj{margin:12px 12px 0}
  /* alt sekme cubugu */
  .s-sekme{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--paper);border-top:1px solid var(--line);padding:6px 4px calc(8px + env(safe-area-inset-bottom));box-shadow:0 -10px 30px -22px rgba(16,26,51,.5)}
  .s-sekme a,.s-sekme button{display:flex;flex-direction:column;align-items:center;gap:3px;font:800 .58rem/1.1 Manrope,sans-serif;color:var(--ink3);text-decoration:none;padding:4px 2px;background:none;border:0;cursor:pointer;text-align:center;position:relative}
  .s-sekme svg{width:22px;height:22px}
  .s-sekme a.ak,body.s-menu-acik .s-sekme button{color:var(--blue)}
  .s-sekme .roz{position:absolute;top:-2px;right:calc(50% - 18px);background:var(--red);color:#fff;border-radius:999px;font-size:.56rem;padding:2px 5px}
  /* tam ekran menu */
  body.s-menu-acik{overflow:hidden}
  body.s-menu-acik .s-menu{display:flex}
  .s-menu{position:fixed;inset:0;z-index:35;background:linear-gradient(180deg,var(--s-navy),var(--s-navy2));color:var(--s-nav-text);flex-direction:column;gap:8px;padding:12px 14px calc(76px + env(safe-area-inset-bottom));overflow:auto}
  .s-menu .s-bas{display:flex;align-items:center;gap:8px;padding:0 0 6px}
  .s-menu .s-bas .logo{color:#fff;flex:1}
  .s-menu .s-kapat{width:36px;height:36px;border-radius:11px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.1);color:#fff;font:800 .9rem/1 Manrope,sans-serif;cursor:pointer}
  .s-menu>a{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.07);border-radius:12px;padding:13px 14px;color:#fff;text-decoration:none;font:800 .92rem/1.2 Manrope,sans-serif}
  .s-menu>a.ak{background:rgba(255,255,255,.16);box-shadow:inset 3px 0 0 var(--red)}
  .s-menu>a.vurgu{color:#FFD08A}
  .s-menu .s-iki{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .s-menu .s-iki a{display:flex;justify-content:center;align-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:12px;color:#fff;text-decoration:none;font:800 .84rem/1.2 Manrope,sans-serif;text-align:center}
  .s-menu .s-cta{display:flex;justify-content:center;background:var(--red);border-radius:12px;padding:14px;color:#fff;text-decoration:none;font:800 .92rem/1 Manrope,sans-serif;margin-top:4px}
  .s-menu .s-kisi{display:flex;gap:10px;align-items:center;background:rgba(255,255,255,.07);border-radius:12px;padding:10px 12px;color:#fff;text-decoration:none}
  .s-menu .s-kisi .av{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--red),var(--orange));display:grid;place-items:center;color:#fff;font:800 .8rem/1 Manrope,sans-serif;flex:none;object-fit:cover}
  .s-menu .s-kisi b{display:block;font-size:.86rem}.s-menu .s-kisi small{font-size:.7rem;opacity:.75}
  .s-menu form button{width:100%;display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.07);border:0;border-radius:12px;padding:13px 14px;color:#fff;font:800 .92rem/1.2 Manrope,sans-serif;cursor:pointer;text-align:left}
  .s-menu .s-diller{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;padding-top:10px;border-top:1px solid rgba(255,255,255,.12)}
  .s-menu .s-diller a{font:800 .68rem/1 Manrope,sans-serif;color:var(--s-nav-text);text-decoration:none;border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:7px 9px}
  .s-menu .s-diller a.ak{background:#fff;color:var(--s-navy);border-color:#fff}
  /* ana sayfa: kisa hero, tam gorunur arama, cip seridi */
  .hero{grid-template-columns:minmax(0,1fr);gap:12px;padding:14px 12px;border-radius:16px}
  .hero h1{font-size:1.35rem}
  .hero p{margin-top:6px;font-size:.9rem}
  .arama{margin-top:12px;grid-template-columns:minmax(0,1fr);gap:6px;padding:8px}
  .arama .btn{width:100%;padding:12px}
  .cipler{flex-wrap:nowrap;overflow-x:auto;margin-top:10px;padding-bottom:4px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .cipler::-webkit-scrollbar{display:none}
  .cipler .cip{flex:none;white-space:nowrap}
  .sahne.reklam{aspect-ratio:16/10}
  .blok{margin-top:18px}
  .baslik-sat h2{font-size:1.05rem}
  /* kategoriler: iki satirli yatay izgara */
  .kategoriler{display:grid;grid-auto-flow:column;grid-template-rows:1fr 1fr;grid-auto-columns:minmax(148px,42vw);gap:8px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x proximity;scrollbar-width:none;margin-top:10px}
  .kategoriler::-webkit-scrollbar{display:none}
  .kategoriler a{scroll-snap-align:start;padding:10px 12px}
  .kategoriler a b{font-size:.86rem}
  /* ogretmen kartlari: ana sayfada yatay serit */
  .kartlar.serit{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin-top:10px}
  .kartlar.serit::-webkit-scrollbar{display:none}
  .kartlar.serit .okart{flex:0 0 min(70vw,260px);scroll-snap-align:start;padding:10px;gap:7px}
  .kartlar.serit .okart .kapak{aspect-ratio:4/3}
  .kartlar.serit .okart b{font-size:.88rem}
  /* Ogretmenler: kompakt liste satiri (K-M2) */
  .kartlar.liste{grid-template-columns:minmax(0,1fr);gap:10px;margin-top:10px}
  .kartlar.liste .okart{display:grid;grid-template-columns:84px minmax(0,1fr);gap:4px 12px;padding:10px;align-items:start}
  .kartlar.liste .okart .kapak{grid-column:1;grid-row:1/span 3;width:84px;aspect-ratio:1;height:auto;border-radius:12px}
  .kartlar.liste .okart .ust{grid-column:2}
  .kartlar.liste .okart .etiketler{grid-column:2;gap:4px}
  .kartlar.liste .okart .etiketler .cip{font-size:.62rem;padding:3px 7px}
  .kartlar.liste .okart .fiyat{grid-column:2;border-top:0;padding-top:0;margin-top:2px}
  .kartlar.liste .okart b{font-size:.9rem}
  .kartlar.liste .okart .ust .avatar{display:none}
  /* Ogretmenler: yapisan kompakt filtre + hizli suzgec cipleri */
  .filtre-kutu{position:sticky;top:56px;z-index:20;background:var(--ground);padding:6px 0 8px;margin:0 -12px;padding-left:12px;padding-right:12px}
  .filtre-kutu .arama.yatay{margin:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:6px;padding:6px}
  .filtre-kutu .arama label{padding:2px 4px}
  .filtre-kutu .arama small{font-size:.58rem}
  .filtre-kutu .arama select{padding:4px 0;font-size:.82rem}
  .filtre-kutu .arama .btn{padding:8px 12px;align-self:center}
  .suzgec-cipler{display:flex;gap:6px;overflow-x:auto;margin-top:8px;padding-bottom:2px;scrollbar-width:none}
  .suzgec-cipler::-webkit-scrollbar{display:none}
  .suzgec-cipler a{flex:none;font:800 .74rem/1 Manrope,sans-serif;padding:8px 11px;border-radius:999px;border:1px solid var(--line);background:var(--paper);color:var(--ink2);text-decoration:none;white-space:nowrap}
  .suzgec-cipler a.ak{background:var(--blue);color:#fff;border-color:var(--blue)}
  /* ogretmen profili: kimlik satiri ustte, iki dugme, bolum cipleri; yan kart gizli (islevi yukarida) */
  .profil2{gap:12px}
  .hero2{grid-template-columns:96px minmax(0,1fr);gap:12px;padding:12px;border-radius:14px}
  .hero-foto{max-width:96px;aspect-ratio:1;border-radius:12px}
  .hero-foto.bas{font-size:1.6rem}
  .kimlik h1{font-size:1.15rem}
  .kimlik .etiketler .cip{font-size:.62rem;padding:3px 7px}
  .kimlik .alt-bilgi{font-size:.8rem}
  .kimlik .dugmeler{display:none}
  .profil-eylem{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .profil-eylem .btn{justify-content:center;padding:12px}
  .profil-eylem form{display:contents}
  .profil-eylem form .btn{width:100%}
  .profil-bolumler{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .profil-bolumler::-webkit-scrollbar{display:none}
  .profil-bolumler a{flex:none;font:800 .74rem/1 Manrope,sans-serif;padding:8px 11px;border-radius:999px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink2);text-decoration:none;white-space:nowrap}
  .istatistik{grid-template-columns:repeat(5,1fr);gap:5px}
  .istatistik div{padding:8px 4px}
  .istatistik b{font-size:1rem}
  .istatistik small{font-size:.52rem}
  .yan-kart{display:none}
  h2[id]{scroll-margin-top:64px}
  .profil2 h2{font-size:1.05rem;margin-top:6px}
}
@media (min-width:981px){.profil-eylem,.profil-bolumler,.suzgec-cipler{display:none}.filtre-kutu{display:contents}}
@media (min-width:761px) and (max-width:980px){
  .hero{grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:16px;padding:18px 16px}
  .hero .sahne{align-self:start}
  .kategoriler{grid-template-rows:1fr;grid-auto-columns:minmax(160px,24vw)}
  .kartlar.serit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));overflow:visible}
  .kartlar.serit .okart{flex:none}
  .kartlar.liste{grid-template-columns:repeat(2,minmax(0,1fr))}
  .uc{grid-template-columns:repeat(3,1fr)}
}