/* ==========================================================================
   Ananas Pilates — site-responsive.css
   site.css ve site-pages.css'ten SONRA yüklenir.

   1. Eskiden view'larda inline duran yerleşimlerin sınıf karşılıkları
      (masaüstü görünümü birebir aynı; mobilde kırılabilsinler diye taşındı)
   2. Masaüstü düzeltmeleri
   3. Kırılım noktaları: 1240 (dizüstü) · 1024 (tablet, burger menü) · 760 (telefon) · 420 (dar telefon)

   Yalnız docs/tasarim-sistemi.md token'ları kullanılır. Bazı kurallarda
   !important var: view'larda hâlâ inline duran yükseklik/yazı boyutlarını
   (hero height, h1 font-size) yalnız dar ekranda ezmek için.
   ========================================================================== */

/* ---------- 1. inline yerleşimlerin sınıfları ---------- */
.home-feats-band{background:linear-gradient(var(--sand) 0 96px,var(--paper) 96px 100%);padding-bottom:6px}
.home-feats-wrap{margin-top:-108px;position:relative;z-index:2}
.home-feats{background:#fff;border-radius:26px;box-shadow:var(--shadow);padding:44px 24px;display:grid;grid-template-columns:repeat(4,1fr)}
.home-about{display:grid;grid-template-columns:330px 1fr 300px;gap:44px;align-items:center;padding:24px 0}
.home-stats{display:grid;gap:22px}
.hero-proof{display:flex;align-items:center;gap:13px;margin-top:34px}
.hero-motto{display:flex;align-items:center;gap:16px;margin-top:38px}
.yorum-slider{display:flex;align-items:center;justify-content:center;gap:26px;margin-top:22px}

.split-portrait{display:grid;grid-template-columns:366px 1fr;gap:56px;align-items:start}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px}
.stat-row .stat,.ders-bilgi .stat{justify-content:center}
.about-studio{display:grid;grid-template-columns:480px 1fr;gap:56px;align-items:center}
.about-gallery{display:grid;grid-template-columns:1.55fr 1fr;grid-template-rows:repeat(2,142px);gap:14px}
.val-row{display:grid;grid-template-columns:repeat(var(--n,4),1fr);margin-top:42px}
.about-cta{position:relative;background:linear-gradient(90deg,#FEF3CE 0%,#FEF3CE 46%,#FDF0C6 100%);border-radius:22px;overflow:hidden;
  display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:250px}
.about-cta-txt{padding:44px 48px;position:relative;z-index:1}
.about-cta-ph{position:absolute;right:0;top:0;bottom:0;width:52%;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%);mask-image:linear-gradient(90deg,transparent 0,#000 16%,#000 100%)}

.c-cols{display:grid;grid-template-columns:1.05fr 1fr;gap:30px;align-items:start}
.c-cols-v2{grid-template-columns:1fr 1.02fr;gap:28px}
.c1-info{margin-top:-92px;position:relative;z-index:2}
.c2-info{margin-top:-140px;gap:20px}
.c-minis{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:22px}
.c-submit{min-width:196px}
.info-t{font-size:20px}
.map-txt{padding:38px 34px}
.c2-asude{position:relative;margin-top:22px;background:var(--cream);border-radius:20px;overflow:hidden;display:flex;align-items:center;
  gap:22px;padding:26px 28px;min-height:186px}
.c2-asude-ring{width:70px;height:70px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;flex:0 0 auto;position:relative;z-index:1}
.c2-asude-txt{max-width:300px;position:relative;z-index:1}
.c2-asude-ph{position:absolute;right:0;top:0;bottom:0;width:168px;overflow:hidden}
.c2-asude-blob{position:absolute;left:14px;top:-10px;bottom:-10px;right:-40px;border-radius:50%;background:#FBDF93}
.c2-asude-ph img{position:absolute;right:0;bottom:0;height:176px;width:132px;object-fit:cover;object-position:top center}

.dd-bilgi-wrap{position:relative;margin-top:-46px;z-index:3}
.dd-cols{display:grid;grid-template-columns:1fr 372px;gap:52px;align-items:start}
.dd-saat-cols{display:grid;grid-template-columns:1fr 330px;gap:40px;align-items:start}
.dd-sss-cols{display:grid;grid-template-columns:352px 1fr;gap:44px;align-items:start}

/* ---------- 2. masaüstü düzeltmeleri ---------- */
/* Başlık iç kutusu 1440px sabitti; kaydırma çubuğu olan ekranda 1440'ta bile yatay kaydırma açıyordu */
.hd .in{width:100%;max-width:1440px}
.blog-hero{overflow:hidden}
/* Hero metni fotoğrafın ALTINA değil üstüne düşsün (dar kolonda üst üste gelirse okunur kalır) */
.hero-in{z-index:2}
/* Hero mini özellikleri kolona sığsın: fotoğraf yayının altına girmesin */
.hero .minif{padding:0 16px}
.hero .minif:first-child{padding-left:0}
.hero .minif span{font-size:13.5px}
/* Stil verilmemiş linkler varsayılan maviye düşüyordu (ders detayı telefon) */
.contactline a{color:inherit;text-decoration:none}
.contactline a:hover,.contactline a:focus-visible{color:var(--gold-ink)}
/* Footer: logo tıklanabilir, yasal linkler arası ayraç CSS'ten */
.ft-logo{display:inline-block;line-height:0}
.ft .cc span a+a:before{content:"|";color:rgba(90,71,18,.35);margin:0 12px 0 -2px}
.ft a:hover,.ft a:focus-visible{color:var(--gold-ink)}
/* Menüde yalnız mobilde görünen üyelik linki */
.nav .nav-cta{display:none}
/* Yorum kartı: tırnak işareti görünür olsun */
.quote .mark{color:var(--gold)}
/* Blog kategori sekmeleri buton gibi davransın */
.blog-cats .cat,.ders-filtre .cat{cursor:pointer;transition:color .15s}
.blog-cats .cat:hover span,.ders-filtre .cat:hover span,.blog-cats .cat:focus-visible span,.ders-filtre .cat:focus-visible span{color:var(--gold-ink)}
.pcard .th img[src=""]{visibility:hidden}
/* Görseller kapsayıcısını taşırmasın */
.pg img{max-width:100%}
.kcard .thumb img,.pcard .th img,.ekip-card .ph img{max-width:none}
/* Kart başlıkları: uzun başlık 3 satırdan fazla yer kaplamasın */
.pcard h5{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ==========================================================================
   3a. ≤1240 — dizüstü: sabit 1152/1440 genişlikler esnesin
   ========================================================================== */
@media (max-width:1240px){
  .ct{width:calc(100% - 64px);max-width:1152px;margin-left:auto;margin-right:auto}
  .yazi-head .ct{max-width:816px}
  .hd .in{width:100%;padding:0 32px 0 200px}
  .logo-badge{left:40px}
  .nav{gap:28px}
  .hero{--arc-left:calc(50% - 60px)}
  .hero .h1{font-size:46px !important}
  .home-about{grid-template-columns:290px 1fr 220px;gap:32px}
  .split-portrait{grid-template-columns:320px 1fr;gap:40px}
  .portrait img{width:100%}
  .about-studio{grid-template-columns:1fr 1fr;gap:40px}
  .dd-cols{grid-template-columns:1fr 330px;gap:36px}
  .ft .cols{grid-template-columns:200px 1fr 1fr 1.25fr 1.2fr;gap:24px}
  .blog-cols,.yazi-cols{grid-template-columns:1fr 290px;gap:28px}
  .rnd-cols,.rnd-bottom{grid-template-columns:minmax(0,1fr) 340px}
  .auth-card{width:min(496px,100%)}
  .auth-side{padding:64px 32px}
  .auth-note{left:32px;right:32px;bottom:32px}
  .nf-deco-fan{display:none}
}

/* ==========================================================================
   3b. ≤1024 — tablet: burger menü, hero üst üste, gridler 2 sütun
   ========================================================================== */
@media (max-width:1024px){
  /* başlık */
  .hd{height:76px}
  .hd .in{height:76px;padding:0 84px 0 124px}
  .logo-badge{left:20px;top:4px;width:96px;height:96px}
  .logo-badge .wm-img{width:76px;height:auto}
  .hd .nav{top:76px;z-index:9}
  .hd .hd-cta{margin-left:auto}
  .hd .nav .nav-cta{display:block;margin-top:8px;padding-top:16px;border-top:1px solid var(--line);color:var(--gold-ink);font-weight:700}

  /* hero: metin üstte, fotoğraf altta kubbe kırpmalı */
  .hero,.blog-hero{height:auto !important;display:flex;flex-direction:column}
  .hero-in,.blog-hero-in{order:1;padding-top:56px !important;padding-bottom:28px}
  .hero .arcphoto,.blog-hero .arcphoto{order:2;position:relative;inset:auto;left:auto;height:min(46vw,440px);width:100%;
    clip-path:ellipse(85% 100% at 50% 100%)}
  .hero .arcphoto img,.blog-hero .arcphoto img{object-position:50% 22%}
  .hero .arcline,.blog-hero .arcline{display:none}
  .hero .lead{max-width:560px !important}

  .home-feats-band{background:var(--paper)}
  .home-feats-wrap{margin-top:-48px}
  .home-feats{grid-template-columns:repeat(2,1fr);row-gap:32px;padding:36px 12px}
  .home-feats .feat:nth-child(2n){border-right:0}

  .cards.c4{grid-template-columns:repeat(2,1fr)}
  .kcard p{min-height:0}
  .home-about{grid-template-columns:290px 1fr;row-gap:28px;padding:40px 0}
  .home-stats{grid-column:1 / -1;grid-template-columns:repeat(3,auto);justify-content:space-between}

  .split-portrait{grid-template-columns:1fr;gap:28px}
  .split-portrait > div:last-child{padding-top:0 !important}
  .portrait{width:min(366px,100%);margin:0 auto}
  .about-studio{grid-template-columns:1fr}
  .val-row{grid-template-columns:repeat(3,1fr);row-gap:32px}
  .val-row .val:nth-child(3n){border-right:0}
  .about-cta{grid-template-columns:1fr}
  .about-cta-ph{position:relative;width:100%;height:240px;-webkit-mask-image:linear-gradient(180deg,transparent 0,#000 22%);mask-image:linear-gradient(180deg,transparent 0,#000 22%)}

  .info-row{grid-template-columns:repeat(2,1fr)}
  .c1-info,.c2-info{margin-top:-24px}
  .info{min-height:0}
  .c-cols,.c-cols-v2{grid-template-columns:1fr}
  .map-card{grid-template-columns:1fr}
  .map-card img,.map-card .map-frame{height:260px;min-height:0}

  .dd-cols,.dd-saat-cols,.dd-sss-cols{grid-template-columns:1fr;gap:32px}
  .ders-egitmen{max-width:420px}
  .ders-bilgi{grid-template-columns:repeat(2,1fr);row-gap:24px;padding:24px 16px}
  .ders-bilgi .stat{padding:0 16px}
  .ders-bilgi .stat:nth-child(2n){border-right:0}
  .ders-filtre,.blog-cats{display:flex;overflow-x:auto;padding:16px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ders-filtre::-webkit-scrollbar,.blog-cats::-webkit-scrollbar{display:none}
  .ders-filtre .cat,.blog-cats .cat{flex:0 0 auto;min-width:104px;padding:0 16px}
  .ders-prog-head{flex-direction:column;align-items:flex-start;gap:16px}
  /* tablolar yatay kaydırılır, sayfa kaymaz */
  .ders-prog,.ders-saat,.panel-tbl{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .ders-prog th+th,.ders-prog td+td{min-width:128px}

  .blog-cols,.yazi-cols{grid-template-columns:1fr}
  .blog-aside{grid-template-columns:repeat(2,1fr);align-items:start}
  .yazi-aside{position:static;grid-template-columns:repeat(2,1fr)}
  .yazi-cover img{height:340px}
  .yazi-rel-grid{grid-template-columns:repeat(2,1fr)}

  .paket-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
  .paket-desc{min-height:0}
  .paket-tbl{overflow-x:auto}
  .paket-tr{min-width:680px}
  .paket-faq{grid-template-columns:1fr;gap:24px}

  .rnd-cols,.rnd-bottom{grid-template-columns:1fr}
  .rnd-side{position:static}
  .rnd-cal{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:24px}

  .auth-split{grid-template-columns:1fr;min-height:0}
  .auth-visual{height:320px}
  .auth-side{padding:48px 24px}
  .auth-band-in{grid-template-columns:1fr;gap:32px}

  .panel-wrap{grid-template-columns:minmax(0,1fr);gap:20px}
  .panel-side{padding:12px}
  .panel-me{display:none}
  .panel-menu{margin-top:0;display:flex;overflow-x:auto;gap:8px;scrollbar-width:none}
  .panel-menu::-webkit-scrollbar{display:none}
  .panel-menu a{flex:0 0 auto;white-space:nowrap}
  .panel-menu .sep{display:none}
  .panel-cols{grid-template-columns:minmax(0,1fr)}

  .legal-grid{grid-template-columns:1fr;gap:28px}
  .legal-toc{position:static}
  .nf-cards{grid-template-columns:repeat(auto-fit,minmax(200px,260px));justify-content:center}

  .ft .cols{grid-template-columns:repeat(3,1fr);row-gap:28px}
  .ft .cols > div:first-child{grid-column:1 / -1}
  .ekip-join,.yazi-cta,.paket-cta{flex-direction:column;align-items:flex-start;gap:20px}
}

/* ==========================================================================
   3c. ≤760 — telefon
   ========================================================================== */
@media (max-width:760px){
  .ct{width:calc(100% - 32px)}
  .pg{font-size:15px}

  .hd{height:68px}
  .hd .in{height:68px;padding:0 64px 0 96px}
  .hd .nav{top:68px}
  .hd-burger{right:12px}
  .logo-badge{left:12px;top:4px;width:76px;height:76px}
  .logo-badge .wm-img{width:60px}
  .hd .hd-cta{display:none}

  /* tipografi: inline yazı boyutlarını telefonda ez */
  .h1,.hero .h1{font-size:34px !important;line-height:1.16}
  .h2{font-size:25px !important}
  .h3{font-size:19px}
  .lead{font-size:15px !important}
  .script{font-size:30px !important}
  .yazi-h1,.legal-title,.paket-h1,.rnd-h1,.nf-title{font-size:30px !important}
  .nf-num{font-size:76px}

  .hero-in,.blog-hero-in{padding-top:36px !important;padding-bottom:20px}
  .hero .arcphoto,.blog-hero .arcphoto{height:240px;clip-path:ellipse(95% 100% at 50% 100%)}
  .btn-row{flex-wrap:wrap;gap:8px}
  .btn-row .btn{flex:1 1 auto}
  .minif-row,.paket-minif{flex-wrap:wrap;gap:16px 0}
  .minif,.hero .minif{padding:0 16px 0 0;margin-right:16px}
  .minif.bd{border-right:0}
  .hero-motto .ic{width:40px !important;height:40px !important}
  .hero-motto .script{font-size:24px !important}

  .home-feats-wrap{margin-top:-28px}
  .home-feats{padding:28px 8px;row-gap:24px}
  .feat{padding:0 12px}
  .feat p{font-size:13.5px;line-height:1.6}
  .cards.c4,.cards.c3{grid-template-columns:1fr;gap:16px}
  .kcard .thumb{height:190px}

  .home-about{grid-template-columns:1fr;justify-items:center;text-align:center;padding:36px 0}
  .home-about .rule{margin-left:auto;margin-right:auto}
  .portrait.sm{width:288px}
  .home-stats{grid-template-columns:repeat(3,1fr);width:100%;gap:8px;text-align:left}
  .home-stats .stat{flex-direction:column;align-items:center;gap:8px;text-align:center}
  .home-stats .stat b{font-size:21px}

  .yorum-slider{gap:0;position:relative;padding:0 0 52px}
  .yorum-slider .arrow{position:absolute;bottom:0}
  .yorum-slider .arrow:first-child{left:calc(50% - 46px)}
  .yorum-slider .arrow:last-child{right:calc(50% - 46px)}
  .quote{padding:16px 16px;gap:8px}
  .quote .mark{font-size:36px}

  .portrait{height:auto;aspect-ratio:366/348}
  .portrait img{height:100%}
  .portrait .sign{right:0;bottom:12px}
  .portrait .sign .script{font-size:30px !important}
  .stat-row{grid-template-columns:repeat(3,1fr);gap:8px}
  .stat-row .stat,.ders-bilgi .stat{flex-direction:column;align-items:center;gap:8px;text-align:center}
  .stat-row .stat.bd{border-right:0}
  .stat b{font-size:20px}
  .about-gallery{grid-template-rows:repeat(2,110px);gap:8px}
  .val-row{grid-template-columns:1fr 1fr;row-gap:24px}
  .val{padding:0 8px}
  .val.bd,.val-row .val:nth-child(3n){border-right:0}
  .val-row .val:nth-child(2n+1){border-right:1px solid #F1ECE1}
  .val-row .val:last-child{border-right:0}
  .val-row .val:last-child:nth-child(odd){grid-column:1 / -1}
  .about-cta-txt{padding:32px 24px 8px}
  .about-cta-ph{height:200px}

  .info-row{grid-template-columns:1fr;gap:16px}
  .info{padding:24px 20px}
  .form-card{padding:24px 20px}
  .soft-card{padding:24px 20px !important}
  .fld-row{grid-template-columns:1fr;gap:12px}
  .c-minis{grid-template-columns:1fr}
  .c-submit{width:100%}
  .c2-asude{padding:24px 20px 0;flex-direction:column;align-items:flex-start;min-height:0}
  .c2-asude-ph{position:relative;width:100%;height:190px;align-self:stretch;margin-top:8px}
  .c2-asude-blob{left:auto;right:10%;width:220px;top:10px;bottom:-60px}
  .c2-asude-ph img{right:calc(10% + 44px)}
  .map-txt{padding:24px 20px}
  .map-card img,.map-card .map-frame{height:210px;min-height:0}
  .cta-band{flex-direction:column;align-items:flex-start;padding:24px 20px;gap:16px}
  .cta-band .btn{margin-left:0}
  .cta-band .deco{display:none}

  .ders-bilgi{grid-template-columns:1fr 1fr;padding:20px 8px}
  .ders-bilgi .stat{padding:0 8px}
  .ders-kazanim{grid-template-columns:1fr}
  .ders-saat .st{width:auto;white-space:nowrap}
  .ders-saat .g{width:96px}
  .ders-prog-head + .ders-prog + div,.ders-prog + div{flex-wrap:wrap}
  .ders-ayir{padding:24px 20px}
  .ders-egitmen-ph img{left:50%;transform:translateX(-50%)}

  .ekip-card .ph{height:300px}
  .ekip-join{padding:28px 24px}
  .ekip-join .btn,.yazi-cta .btn{white-space:normal}

  .blog-aside,.yazi-aside{grid-template-columns:1fr}
  .blog-grid,.yazi-rel-grid{grid-template-columns:1fr}
  .pcard .th{height:180px}
  .pcard h5,.pcard p{min-height:0}
  .yazi-head{padding:32px 0 40px}
  .yazi-cover img{height:220px}
  .yazi-body p{font-size:15.5px}
  .yazi-quote,.yazi-author{flex-direction:column;padding:24px 20px}
  .yazi-foot{flex-direction:column;align-items:flex-start;gap:16px}
  .yazi-share{flex-wrap:wrap}
  .yazi-cta{padding:24px 24px}

  .paket-grid{grid-template-columns:1fr}
  .paket-steps{grid-template-columns:1fr;gap:20px}
  .paket-step{border-right:0;padding-right:0}
  .paket-cta{padding:28px 24px}
  .paket-cta-btns{flex-wrap:wrap}
  .paket-cta-fan{display:none}

  .rnd-steps{flex-wrap:wrap;gap:12px}
  .rnd-steps-line{display:none}
  .rnd-panel,.rnd-info{padding:24px 16px}
  /* Ders kartları masaüstünde 4, telefonda 2+2 (bkz. site-pages.css .rnd-classes) */
  .rnd-classes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rnd-teachers{grid-template-columns:1fr}
  .rnd-cal-head{flex-direction:column;align-items:flex-start;gap:8px}
  .rnd-cal-head .rnd-legend{margin-left:0}
  .rnd-cal{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rnd-legend{flex-wrap:wrap;gap:8px 16px}
  .rnd-legend-note{margin-left:0}
  .rnd-first{padding:24px 20px}
  .panel-yeni-nav{flex-wrap:wrap}

  .auth-visual{display:none}
  .auth-side{padding:32px 16px}
  .auth-card{padding:28px 20px}
  .auth-grid{grid-template-columns:1fr}
  .auth-row{flex-wrap:wrap;gap:12px}

  .panel-greet .in{flex-direction:column;align-items:flex-start;gap:12px}
  .panel-greet .sp{margin-left:0;flex-wrap:wrap}
  .panel-stats{grid-template-columns:1fr}
  .panel-lesson{grid-template-columns:76px 1fr;gap:16px}
  .panel-lesson .rt{grid-column:1 / -1;flex-direction:row;align-items:center;justify-content:space-between}
  .panel-f2{grid-template-columns:1fr}
  .panel-ch,.panel-foot,.panel-danger{flex-wrap:wrap}
  .panel-tabs{overflow-x:auto;gap:20px;padding:0 16px}
  .panel-tabs a{white-space:nowrap}

  .legal-band{padding:32px 0}
  .legal-help .in{flex-direction:column;align-items:flex-start}
  .nf-wrap{padding:48px 0 40px}
  .nf-btns{flex-wrap:wrap}
  .nf-cards{grid-template-columns:1fr}

  .ft .cols{grid-template-columns:1fr 1fr;gap:24px 16px}
  .ft .cols > div:nth-child(4),.ft .cols > div:nth-child(5){grid-column:1 / -1}
  .ft .cc{flex-direction:column;gap:8px;padding-bottom:16px}
  .ft .cc span{flex-wrap:wrap}

  .yuzen-butonlar{right:14px;bottom:14px;gap:10px}
  .yuzen-btn{width:46px;height:46px}
  .yuzen-btn svg{width:21px;height:21px}
}

/* ==========================================================================
   3c2. ≤768 — üye paneli: telefon eşiği (760) ile tablet eşiği (1024)
   arasında kalan genişlikte satır-içi aksiyonların/başlıkların kırpılmaması.
   ========================================================================== */
@media (max-width:768px){
  .panel-acts{flex-wrap:wrap;row-gap:8px}
  .panel-ch,.panel-foot,.panel-danger{flex-wrap:wrap}
}

/* ≤420 — dar telefon */
@media (max-width:420px){
  .h1,.hero .h1{font-size:30px !important}
  .home-feats{grid-template-columns:1fr}
  .home-feats .feat{border-right:0}
  .rnd-cal{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
}

/* Panel: grid öğeleri içerik genişliğine göre büyüyüp sayfayı taşırmasın
   (yatay menü ve tablolar kendi kutusunda kayar). */
.panel-wrap > *,.panel-main > *,.panel-cols > *{min-width:0}
.panel-card{overflow-x:auto}
a.contactline{color:inherit;text-decoration:none}
.rnd-saat-uyari{margin-top:12px}
