/* ============================================================
   PAM — sade mobil görünüm (yalnız telefon, ≤640px)
   Masaüstü stillerine dokunmaz; tüm sayfalarda en son yüklenir.
   ============================================================ */

/* Alt menü çubuğu: masaüstünde gizli */
.m-bar{display:none}

@media (max-width:640px){
  html{-webkit-text-size-adjust:100%}
  body{font-size:16px;padding-bottom:calc(64px + env(safe-area-inset-bottom))}
  .wrap{padding-left:16px;padding-right:16px}
  h2,.sec-title{font-size:30px;line-height:1.1}
  .lead,.sec-note{font-size:16px}
  .btn{min-height:48px;padding:12px 20px;font-size:16px}

  /* --- Alt menü çubuğu --- */
  .m-bar{display:grid;grid-template-columns:repeat(4,1fr);position:fixed;left:0;right:0;bottom:0;z-index:60;
    background:#fff;border-top:1px solid var(--line);box-shadow:0 -6px 18px rgba(0,60,120,.08);padding:4px 4px calc(4px + env(safe-area-inset-bottom))}
  .m-bar a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;
    font-size:12px;font-weight:800;color:var(--ink-soft);text-decoration:none;border-radius:12px}
  .m-bar a svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  .m-bar a.on,.m-bar a:active{color:var(--sky-deep);background:var(--sky-pale)}
  .m-bar a.m-wa{color:#128C4A}
  .m-bar .m-badge{position:absolute;top:5px;left:calc(50% + 6px);min-width:18px;height:18px;border-radius:9px;background:var(--orange);color:#fff;font-size:11px;line-height:18px;text-align:center;padding:0 5px}
  .m-bar .m-badge:empty,.m-bar .m-badge[data-n="0"]{display:none}
  .wa-float{display:none!important}

  /* ================= ANA SAYFA ================= */
  body .hero{padding-bottom:28px}
  body .hero-copy{padding-top:12px}
  body .hero-title{font-size:44px;line-height:1.08}
  body .hero-sub{font-size:16px;margin-top:12px}
  body .hero-cta{gap:10px}
  body .hero-cta .btn{width:100%;justify-content:center}
  body .h1-kicker{font-size:13px}
  body .stage{margin-top:20px}
  body .stage-oval,body .stage-orange,body .sticker{display:none}
  body .stage-photo{width:100%;transform:none}
  body .ticker a,body .ticker span{font-size:15px}

  body .notebook-sec,body .fark,body .countdown,body .program,body .cards-promo,body .kadro,body .galeri,body .sss,body .iletisim{padding:40px 0}
  body .nb-owl,body .nb-rings,body .tape,body .nb-polaroid,body .fark-owl,body .cd-owl,body .program-owl,body .galeri-owl,body .sss-owl,body .il-owl,body .demo-owl{display:none}
  body .nb-grid{grid-template-columns:1fr;gap:18px}
  body .nb-intro{display:block}
  body .nb-intro h2{font-size:36px}
  body .nb-intro p{max-width:none;font-size:16px}
  html.js-anim body .note.pop{opacity:1;transform:none;transition:none}
  body .notebook{height:auto;min-height:0;aspect-ratio:auto;padding:16px;transform:none;box-shadow:0 8px 0 -4px var(--sky-pale)}
  body .nb-photo{transform:none}
  body .nb-notes{position:static;display:grid;gap:10px;margin-top:14px}
  body .note{position:static;transform:none;width:auto;max-width:none;opacity:1}
  body .note .arrow{display:none}

  body .fark-grid{gap:10px}
  body .feat{display:grid;grid-template-columns:44px 1fr;column-gap:12px;align-items:start;padding:14px}
  body .feat-ic{grid-row:span 2;width:44px;height:44px;margin:0}
  body .feat b{font-size:17px}

  body .countdown h2{font-size:30px}
  body .cd-row b{font-size:34px}

  body .steps{gap:10px}
  body .steps li{padding:14px}
  body .steps li::after{display:none}

  body .promo-copy h2{font-size:30px}
  body .promo-facts{gap:8px}
  body .demo{padding:0}

  /* kadro ve galeri: yana kaydırmalı şerit */
  body .kadro-photo{max-width:180px;margin:0 auto}
  body .galeri-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;grid-template-rows:none;padding-bottom:8px;-webkit-overflow-scrolling:touch}
  body .galeri-grid .ph{flex:0 0 78%;height:220px;scroll-snap-align:start;grid-column:auto;grid-row:auto}
  body .galeri h2{font-size:30px}

  body .faq summary{font-size:16px;padding:14px 40px 14px 14px}
  body .map{min-height:260px}
  body .contact-btns .btn{width:100%;justify-content:center}
  body .haber{padding:28px 0 0}
  body .kayit,body .yorum,body .vaka{padding:48px 0}
  body .kayit-form{padding:20px;border-radius:var(--r-md)}
  body .kayit-copy .contact-btns .btn{width:100%}
  body .yorum-google .row,body .yorum-google .btn{width:100%}

  body .footer{padding:36px 0 24px}
  body .footer-big{font-size:52px}
  body .footer-owl{width:110px}
  body .haber-row{align-items:flex-end;gap:12px}
  body .haber-owl{display:block;width:96px;align-self:flex-end}
  body .haber-row>div{padding-bottom:40px;min-width:0}
  body .footer-ders p{font-size:13px}
  body .footer-links{flex-wrap:wrap;gap:12px}

  /* ================= PAM CARDS ================= */
  body .pc-head .logo img{width:34px;height:34px}
  body .pc-head .logo-word b{font-size:22px}
  body .pc-head-row{min-height:56px;padding-top:6px;padding-bottom:6px}
  body .pc-stats span{font-size:13px;padding:6px 10px}
  body .pc-stats span:nth-child(3){display:none}

  body .pc-hero{padding:20px 0 0}
  body .pc-title{font-size:34px;line-height:1.08}
  body .oyss-badge{font-size:13px;padding:6px 12px 6px 6px}
  body .pc-lead{display:none}
  body .pc-facts{display:none}
  body .pc-title{margin-bottom:14px}
  body .pickers{padding:14px;gap:10px;margin-bottom:-8px}
  body .pick>span{font-size:13px}
  body .pick select,body .pick input{min-height:48px;font-size:16px}
  body .seg,body .pickers .seg{display:flex;width:100%}
  body .pick,body .pick select{width:100%}
  body .seg button{flex:1;min-height:44px}

  body .subj-grid{grid-template-columns:1fr;gap:10px}
  body .subj-card{padding:14px 40px 14px 14px;grid-template-columns:44px 1fr;column-gap:12px}
  body .subj-card .kit-icon{width:44px;height:44px;font-size:18px}
  body .subj-card strong{font-size:17px}

  body .oyss-head img,body .about img{display:none}
  body .oyss-facts article{padding:12px 14px}
  body .about{margin:40px 0;padding:16px}
  body .ders-index{margin-top:40px}
  body .di-links b{display:block}

  /* ders ve kit başlığı */
  body .kit-head{padding:14px 0 0}
  body .kit-title{font-size:32px;line-height:1.05;padding-bottom:16px}
  body .kit-crumb{font-size:13px}
  body .back{min-height:40px;font-size:15px;padding:4px 14px 4px 10px;margin-left:-10px}
  body .crumbs{font-size:13px}
  body .ders-body{padding:16px 0 40px}
  body .ders-bar{gap:10px;margin-bottom:14px}
  body .ders-bar .sec-note{display:none}
  body #s-grades{width:100%}

  /* yazılı sekmeleri: tek satır, yana kaydırmalı */
  body .yz-tabs,body .yz-jump{display:flex;overflow-x:auto;gap:8px;margin:0 -16px 12px;padding:2px 16px 6px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
  body .yz-tab{flex:0 0 auto;min-width:148px;padding:10px 12px;scroll-snap-align:start}
  body .yz-tab b{font-size:14px}
  body .yz-panel{padding:14px;border-radius:16px}
  body .yz-panel h2{font-size:19px}
  body .yz-note{font-size:13px;padding:8px 10px}
  body .konu-box{padding:8px 12px}
  body .konu-box li{font-size:13px}

  body .tema-row{grid-template-columns:34px 1fr;gap:10px;padding:12px 12px 16px;border-radius:14px}
  body .tema-no{width:34px;height:34px;font-size:18px;border-radius:10px}
  body .tema-body strong{font-size:16px}
  body .tema-name{font-size:12px}
  body .tema-sum{display:none}
  body .lv-dot{min-width:22px;height:22px;font-size:11px}

  /* kit ekranı */
  body .kit-tabs{position:sticky;top:56px;z-index:20;background:linear-gradient(180deg,#36ABFF,#4DB6FF)}
  body .kit-body{padding-top:16px}
  body .lesson-lead{font-size:17px}
  body .lesson-part h2{font-size:18px}
  body .lesson-part p{font-size:16px}
  body .kz-box{padding:10px 12px}
  body .kz-box li{font-size:14px}
  body .q-card{padding:16px;box-shadow:none}
  body .q-opt{min-height:52px;font-size:16px}
  body .scenario{padding:16px}
  body .sc-text{font-size:15px}
  body .sq{padding:14px}
  body .lv-h{font-size:18px}
  body .ilce-grid,body .dk-wrap{grid-template-columns:1fr;gap:10px}
  body .ilce{padding:14px}
  body .ilce h2{font-size:18px}
  body .faq-list .sq summary{font-size:16px}

  body .pc-foot{padding-bottom:16px}
  body .pc-foot-row{flex-direction:column;align-items:flex-start;gap:10px}
  body .toast{bottom:calc(76px + env(safe-area-inset-bottom))}
}
