/* egitapp.com/ara-tatil/ (1. sınıf ara tatil kitapçığı) */
.at{--r:var(--teal)}
.at-etiket{font-weight:900;font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 10px;color:var(--orange-d)}
.at-kahraman{background:radial-gradient(1100px 700px at 80% 10%,#14A6A0 0,var(--teal) 55%,#075E5B 100%);color:#fff;overflow:hidden}
.at-kahraman-ic{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding-top:64px;padding-bottom:72px}
.at-kahraman .at-etiket{color:var(--sun)}
.at-kahraman h1{font-size:clamp(40px,6vw,68px);margin:0 0 18px;letter-spacing:-.02em}
.at-kahraman h1 span{color:#FFD08A}
.at-giris{font-size:20px;line-height:1.55;color:#E2F6F3;margin:0 0 28px;max-width:560px}
.at-dugmeler{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.at-indir{display:inline-flex;align-items:center;gap:10px;font-size:19px;padding:16px 28px;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.at-indir svg{fill:none}
.at-ac{color:#fff;font-weight:800}
.at-ac:hover{color:#FFD08A}
.at-kucuk{margin:16px 0 0;font-size:15px;color:#BFE6E1}
.at-kapak{margin:0;justify-self:center;max-width:400px;transform:rotate(3deg);border-radius:14px;overflow:hidden;box-shadow:0 30px 60px rgba(0,30,28,.40)}
.at-blok{padding:80px 0}
.at-acik{background:var(--mint-2)}
.at-bas{max-width:740px;margin:0 auto 40px;text-align:center}
.at-bas h2,.at-nasil h2{font-size:clamp(28px,3.4vw,40px);text-wrap:balance}
.at-bas p{color:var(--ink-2);font-size:18px;margin:0}
.at-kartlar{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.at-kartlar li{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:0 6px 18px rgba(14,61,69,.05)}
.at-kartlar h3{font-size:20px;margin:14px 0 6px}
.at-kartlar p{margin:0;color:var(--ink-2)}
.at-ikon{display:inline-grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--mint);color:var(--teal)}
.at-kartlar li:nth-child(2n) .at-ikon{background:#FFEBDD;color:var(--orange-d)}
.at-ikon svg{fill:currentColor}
.at-gunler{list-style:none;margin:0 auto;padding:0;max-width:980px;display:grid;gap:12px}
.at-gunler li{display:grid;grid-template-columns:200px 1fr 1.3fr 1fr;gap:18px;align-items:center;background:#fff;border-radius:18px;padding:16px 22px;border-left:8px solid var(--g);box-shadow:0 6px 18px rgba(14,61,69,.06)}
.at-gun{display:flex;align-items:center;gap:14px}
.at-gun>span{width:44px;height:44px;border-radius:14px;background:var(--g);color:#fff;font-weight:900;font-size:22px;display:grid;place-items:center;flex:none}
.at-gun b{display:block;font-size:18px;line-height:1.2}
.at-gun small,.at-hucre small{color:var(--ink-3);font-weight:700;font-size:13px}
.at-hucre p{margin:2px 0 0;font-weight:700;line-height:1.35}
.at-harf{display:flex;gap:6px}
.at-harf b{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--g) 12%,#fff);color:var(--g);font-size:24px;font-weight:900}
.at-nasil{display:grid;grid-template-columns:1.3fr 1fr;gap:48px;align-items:center}
.at-adim{counter-reset:a;list-style:none;margin:18px 0 0;padding:0}
.at-adim li{counter-increment:a;position:relative;padding:0 0 16px 50px;color:var(--ink-2)}
.at-adim li b{color:var(--ink)}
.at-adim li::before{content:counter(a);position:absolute;left:0;top:-2px;width:34px;height:34px;border-radius:11px;background:var(--orange);color:#fff;font-weight:900;display:grid;place-items:center}
.at .madde{list-style:none;margin:0;padding:26px;background:var(--mint-2);border-radius:var(--radius)}
.at .madde li{display:flex;gap:10px;align-items:flex-start;margin:9px 0;font-weight:700}
.at .madde svg{flex:none;margin-top:3px;width:22px;height:22px;padding:3px;border-radius:50%;background:color-mix(in srgb,var(--teal) 14%,#fff);color:var(--teal)}
.at-ornekler{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:18px}
.at-ornekler figure{margin:0}
.at-ornekler img{border-radius:10px;box-shadow:0 10px 26px rgba(14,61,69,.14);background:#fff;transition:transform .2s}
.at-ornekler a:hover img{transform:translateY(-4px)}
.at-ornekler figcaption{font-size:14px;font-weight:700;color:var(--ink-2);margin-top:10px;line-height:1.35}
.at-orta{text-align:center;margin:40px 0 0}
.at-cagri{display:grid;grid-template-columns:150px 1fr;gap:32px;align-items:center;background:var(--mint);border-radius:28px;padding:36px 40px}
.at-cagri h2{font-size:clamp(26px,3vw,34px)}
.at-cagri p{color:var(--ink-2);margin:0 0 18px}
.at-cagri>div{min-width:0}
.at .magaza.web{background:var(--teal)}
.at-lisans{font-size:14px;color:var(--ink-3);text-align:center;padding-bottom:48px}
@media (max-width:900px){
  .at-kahraman-ic,.at-nasil{grid-template-columns:1fr}
  .at-kapak{max-width:300px}
  .at-kartlar{grid-template-columns:1fr 1fr}
  .at-ornekler{grid-template-columns:repeat(3,minmax(0,1fr))}
  .at-gunler li{grid-template-columns:1fr 1fr;gap:12px}
  .at-gun{grid-column:1/-1}
}
@media (max-width:560px){
  .at-blok{padding:56px 0}
  .at-kahraman-ic{padding-top:40px;padding-bottom:52px;gap:36px}
  .at-giris{font-size:18px}
  .at-kartlar{grid-template-columns:1fr}
  .at-ornekler{grid-template-columns:1fr 1fr}
  .at-gunler li{grid-template-columns:1fr}
  .at-cagri{grid-template-columns:1fr;padding:28px 22px;text-align:center}
  .at-cagri img{width:110px;margin:0 auto}
  .at-cagri .magazalar{justify-content:center}
  .at .magaza{flex:1 1 140px;min-width:0}
  .at .magaza.web{flex-basis:100%;justify-content:center}
}
/* Telefonda alt kenarda duran indirme düğmesi (üstteki düğme ekrandan çıkınca görünür) */
.at-yapiskan{display:none}
@media (max-width:900px){
  .at-yapiskan{display:flex;align-items:center;justify-content:center;gap:10px;position:fixed;left:16px;right:16px;bottom:14px;z-index:50;font-size:19px;padding:15px 20px;box-shadow:0 12px 30px rgba(0,0,0,.28);transform:translateY(160%);transition:transform .25s ease}
  .at-yapiskan.gor{transform:none}
  .at-yapiskan svg{fill:none;flex:none}
  .at-yapiskan small{font-weight:700;font-size:14px;opacity:.9}
  .at-lisans{padding-bottom:100px}
}
/* Kitapçık önizlemesi: yana kaydırılan sayfa şeridi + dokununca büyütme (2026-11-10) */
.at-onizleme{padding-top:64px}
.at-onizleme .at-bas{margin-bottom:28px}
.at-serit-kap{position:relative}
.at-serit{list-style:none;margin:0;padding:6px 4px 22px;display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.at-serit li{flex:0 0 clamp(200px,24vw,250px);scroll-snap-align:start;margin:0}
.at-sayfa{display:block;width:100%;padding:0;border:0;background:#fff;border-radius:10px;cursor:zoom-in;box-shadow:0 10px 26px rgba(14,61,69,.16);overflow:hidden;transition:transform .2s}
.at-sayfa:hover{transform:translateY(-4px)}
.at-sayfa img{display:block;width:100%;height:auto}
.at-serit p{margin:10px 2px 0;font-size:14px;font-weight:700;color:var(--ink-2);line-height:1.35;display:flex;gap:8px;align-items:baseline}
.at-serit p b{flex:none;min-width:24px;height:22px;padding:0 6px;border-radius:8px;background:var(--mint);color:var(--teal);font-size:12px;display:inline-grid;place-items:center}
.at-kalan>div{height:100%;min-height:300px;box-sizing:border-box;border-radius:14px;background:radial-gradient(500px 400px at 80% 0,#14A6A0 0,var(--teal) 60%,#075E5B 100%);color:#fff;padding:24px 20px;display:flex;flex-direction:column;justify-content:center;text-align:center}
.at-kalan b{font-size:54px;line-height:1;font-weight:900;color:#FFD08A}
.at-kalan span{font-size:20px;font-weight:900;margin-top:4px}
.at-kalan p{display:block;color:#E2F6F3;font-size:15px;font-weight:600;margin:14px 0 18px}
.at-kalan .dugme{font-size:17px;padding:14px 18px;justify-content:center}
.at-ok{position:absolute;top:calc(50% - 30px);width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:var(--teal);font-size:34px;line-height:1;font-weight:900;box-shadow:0 6px 18px rgba(14,61,69,.22);cursor:pointer;z-index:2}
.at-serit-kap .geri{left:-18px}.at-serit-kap .ileri{right:-18px}
.at-onizleme .at-orta{margin-top:26px}
.at-fbnot{text-align:center;color:var(--ink-2);font-size:15px;margin:12px auto 0;max-width:520px}
.at-buyuk{position:fixed;inset:0;z-index:100;background:rgba(6,30,32,.96);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 12px 16px;gap:12px}
.at-buyuk[hidden]{display:none}
.at-buyuk figure{margin:0;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}
.at-buyuk img{max-width:min(100%,760px);max-height:calc(100% - 30px);width:auto;height:auto;background:#fff;border-radius:6px;box-shadow:0 20px 50px rgba(0,0,0,.4)}
.at-buyuk figcaption{color:#fff;font-weight:800;margin-top:8px;font-size:15px}
.at-buyuk .at-ok{top:calc(50% - 23px)}
.at-buyuk .geri{left:12px}.at-buyuk .ileri{right:12px}
.at-kapat{position:absolute;top:10px;right:12px;width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.16);color:#fff;font-size:30px;line-height:1;cursor:pointer}
.at-buyuk .dugme{flex:none;font-size:18px;padding:14px 24px}
@media (max-width:900px){.at-serit-kap>.at-ok{display:none}.at-buyuk .at-ok{width:40px;height:40px;font-size:28px;background:rgba(255,255,255,.85)}}
@media (max-width:560px){
  .at-kapak{display:none}
  .at-onizleme{padding-top:32px}
  .at-kahraman-ic{padding-bottom:36px}
  .at-serit{margin:0 -16px;padding-left:16px;padding-right:16px;scroll-padding:16px}
  .at-serit li{flex-basis:62vw}
  .at-buyuk .geri{left:4px}.at-buyuk .ileri{right:4px}
}