/* NURTAŞI İRFAN VAKFI — stil dosyası
   Palet logodan: bordo, kemik beyazı, altın vurgu */
:root{
  --bordo:#8a1420;
  --bordo-koyu:#5e0d15;
  --bordo-acik:#a5273517;
  --altin:#b8912e;
  --kemik:#faf7f1;
  --kagit:#ffffff;
  --murekkep:#231d18;
  --gri:#6b625a;
  --cizgi:#e7ded2;
  --radius:14px;
  --golge:0 10px 30px rgba(94,13,21,.08);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Source Sans 3','Segoe UI',system-ui,sans-serif;
  color:var(--murekkep);
  background:var(--kemik);
  line-height:1.65;
  font-size:1.0625rem;
}
h1,h2,h3,.serif{font-family:'Lora',Georgia,serif;line-height:1.25;color:var(--bordo-koyu)}
img{max-width:100%;display:block}
a{color:var(--bordo)}
a:focus-visible,button:focus-visible{outline:3px solid var(--altin);outline-offset:3px;border-radius:4px}
.skip-link{position:absolute;left:-999px;top:0;background:var(--bordo);color:#fff;padding:.7rem 1.2rem;z-index:100}
.skip-link:focus{left:0}
.container{width:min(1100px,92%);margin-inline:auto}

/* ---------- HEADER ---------- */
header.site{
  position:sticky;top:0;z-index:50;
  background:rgba(250,247,241,.92);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--cizgi);
}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.65rem 0;gap:1rem}
.marka{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.monogram{
  width:46px;height:46px;flex:none;
  border:2px solid var(--bordo);border-radius:8px;
  display:grid;place-items:center;background:#fff;
  box-shadow:inset 0 0 0 3px #fff, inset 0 0 0 4px var(--bordo);
}
.monogram span{font-family:'Pirata One',serif;font-size:1.7rem;color:var(--bordo);transform:translateY(-1px)}
.monogram img{width:100%;height:100%;object-fit:contain}
.marka b{font-family:'Lora',serif;color:var(--bordo-koyu);font-size:1.05rem;letter-spacing:.04em;line-height:1.15;display:block}
.marka small{color:var(--gri);letter-spacing:.14em;font-size:.68rem;text-transform:uppercase}
nav.menu ul{display:flex;gap:.2rem;list-style:none;flex-wrap:wrap}
nav.menu a{
  text-decoration:none;color:var(--murekkep);font-weight:600;font-size:.95rem;
  padding:.55rem .8rem;border-radius:8px;transition:background .25s,color .25s;
}
nav.menu a:hover{background:var(--bordo-acik);color:var(--bordo)}
nav.menu a[aria-current="page"]{background:var(--bordo);color:#fff}
#menuBtn{display:none;background:none;border:2px solid var(--bordo);color:var(--bordo);
  border-radius:8px;padding:.45rem .7rem;font-size:1rem;font-weight:700;cursor:pointer}

/* ---------- HERO ---------- */
.hero{
  position:relative;overflow:hidden;
  background:linear-gradient(160deg,var(--bordo-koyu) 0%,var(--bordo) 60%,#a12633 100%);
  color:#fff;text-align:center;
  padding:clamp(4rem,10vw,7.5rem) 0 clamp(4.5rem,10vw,8rem);
}
.hero::before,.hero::after{
  content:"";position:absolute;inset:auto;border:1px solid rgba(255,255,255,.18);
  border-radius:50%;animation:nefes 9s ease-in-out infinite;
}
.hero::before{width:520px;height:520px;top:-190px;right:-150px}
.hero::after{width:380px;height:380px;bottom:-160px;left:-110px;animation-delay:-4.5s}
@keyframes nefes{0%,100%{transform:scale(1);opacity:.5}50%{transform:scale(1.12);opacity:1}}
.hero .monogram{width:84px;height:84px;margin:0 auto 1.4rem;border-radius:12px;animation:belir 1s ease both}
.hero .monogram span{font-size:3.1rem}
.hero h1{color:#fff;font-size:clamp(2rem,5vw,3.4rem);letter-spacing:.03em;animation:belir 1s .15s ease both}
.hero p.slogan{
  margin-top:.9rem;font-size:clamp(1.05rem,2.2vw,1.35rem);color:#f3e3c8;
  font-family:'Lora',serif;font-style:italic;animation:belir 1s .3s ease both;
}
.hero .cta{margin-top:2.2rem;display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;animation:belir 1s .45s ease both}
@keyframes belir{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.btn{
  display:inline-block;text-decoration:none;font-weight:700;border-radius:999px;
  padding:.85rem 1.7rem;transition:transform .25s,box-shadow .25s,background .25s;
}
.btn:hover{transform:translateY(-3px)}
.btn-altin{background:var(--altin);color:#241a04;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.btn-cerceve{border:2px solid rgba(255,255,255,.7);color:#fff}
.btn-cerceve:hover{background:rgba(255,255,255,.12)}
.btn-bordo{background:var(--bordo);color:#fff}
.btn-bordo:hover{background:var(--bordo-koyu)}

/* ---------- BÖLÜMLER ---------- */
section.blok{padding:clamp(3rem,7vw,5rem) 0}
.blok-baslik{text-align:center;max-width:640px;margin:0 auto 2.6rem}
.blok-baslik .ust{color:#8a6a15;font-weight:700;letter-spacing:.22em;text-transform:uppercase;font-size:.8rem}
.blok-baslik h2{font-size:clamp(1.6rem,3.4vw,2.3rem);margin-top:.4rem}
.susleme{width:70px;height:3px;background:linear-gradient(90deg,transparent,var(--altin),transparent);margin:1rem auto 0}

.kartlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.4rem}
.kart{
  background:var(--kagit);border:1px solid var(--cizgi);border-radius:var(--radius);
  padding:1.8rem;box-shadow:var(--golge);
  transition:transform .3s,box-shadow .3s;
}
.kart:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(94,13,21,.14)}
.kart h3{font-size:1.2rem;margin-bottom:.5rem}
.kart .ikon{
  width:52px;height:52px;border-radius:12px;background:var(--bordo-acik);
  display:grid;place-items:center;margin-bottom:1rem;color:var(--bordo);font-size:1.5rem;
}
.kart a.devam{font-weight:700;text-decoration:none}
.kart a.devam::after{content:" →";transition:margin .2s}
.kart a.devam:hover::after{margin-left:4px}

/* scroll-reveal */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.reveal.gorunur{opacity:1;transform:none}

/* ---------- İÇERİK SAYFALARI ---------- */
.sayfa-baslik{
  background:linear-gradient(160deg,var(--bordo-koyu),var(--bordo));color:#fff;
  padding:clamp(2.8rem,6vw,4.2rem) 0;text-align:center;
}
.sayfa-baslik h1{color:#fff;font-size:clamp(1.8rem,4vw,2.7rem);animation:belir .8s ease both}
.sayfa-baslik p{color:#f3e3c8;margin-top:.5rem;font-family:'Lora',serif;font-style:italic;animation:belir .8s .15s ease both}
.icerik{max-width:760px;margin-inline:auto}
.icerik p{margin-bottom:1.1rem}
.icerik h2{margin:2rem 0 .8rem;font-size:1.45rem}
.icerik blockquote{
  border-left:4px solid var(--altin);background:var(--kagit);
  padding:1.2rem 1.5rem;border-radius:0 var(--radius) var(--radius) 0;
  font-family:'Lora',serif;font-style:italic;margin:1.6rem 0;color:var(--bordo-koyu);
}
.not-kutusu{
  background:#fdf6e7;border:1px dashed var(--altin);border-radius:var(--radius);
  padding:1.1rem 1.4rem;margin:1.6rem 0;font-size:.95rem;color:#6b5518;
}

/* ---------- DERSLER ---------- */
.filtreler{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center;margin-bottom:2.2rem}
.filtre-grup{display:flex;align-items:center;gap:.5rem;background:var(--kagit);
  border:1px solid var(--cizgi);border-radius:999px;padding:.45rem .9rem}
.filtre-grup label{font-weight:700;font-size:.9rem;color:var(--bordo-koyu)}
.filtre-grup select{
  border:none;background:transparent;font:inherit;font-weight:600;color:var(--bordo);
  padding:.2rem .3rem;cursor:pointer;
}
.ders-kart .rozetler{display:flex;gap:.5rem;flex-wrap:wrap;margin:.6rem 0 .8rem}
.rozet{font-size:.78rem;font-weight:700;padding:.25rem .7rem;border-radius:999px}
.rozet.konu{background:var(--bordo-acik);color:var(--bordo)}
.rozet.kisi{background:#f3ead2;color:#7a5f14}
.video-alan{aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:var(--bordo-koyu);
  display:grid;place-items:center;color:#f3e3c8;font-family:'Lora',serif;font-style:italic;margin-top:1rem}
.video-alan iframe{width:100%;height:100%;border:0}
.bos-mesaj{text-align:center;color:var(--gri);padding:2rem 0}

/* ---------- ETKİNLİK ---------- */
.etkinlik{display:flex;gap:1.2rem;align-items:flex-start}
.etkinlik .tarih-kutu{
  flex:none;background:var(--bordo);color:#fff;border-radius:10px;
  padding:.7rem .9rem;text-align:center;font-weight:700;font-size:.85rem;min-width:86px;
}
/* ---------- İLETİŞİM ---------- */
.iletisim-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.4rem}
.iletisim-grid .kart p{margin:.3rem 0}
.harita-btn{margin-top:.8rem}

/* ---------- FOOTER ---------- */
footer.site{background:var(--bordo-koyu);color:#e9d9c4;margin-top:3rem}
footer .ust-footer{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;padding:3rem 0 2rem}
footer h3{color:#fff;font-size:1.05rem;margin-bottom:.8rem}
footer a{color:#f0e2cd;text-decoration:none}
footer a:hover{text-decoration:underline}
footer ul{list-style:none}
footer li{margin:.4rem 0}
footer .alt-footer{border-top:1px solid rgba(255,255,255,.15);padding:1.1rem 0;text-align:center;font-size:.85rem;color:#cbb59a}

/* ---------- MOBİL ---------- */
@media (max-width:820px){
  #menuBtn{display:block}
  nav.menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--kemik);
    border-bottom:1px solid var(--cizgi);box-shadow:var(--golge)}
  nav.menu.acik{display:block}
  nav.menu ul{flex-direction:column;padding:.8rem}
  nav.menu a{display:block;padding:.9rem 1rem;font-size:1.05rem}
}
/* hareket hassasiyeti (WCAG 2.3.3) */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
  .reveal{opacity:1;transform:none}
}
/* ---------- SOSYAL MEDYA ---------- */
.sosyal{display:flex;gap:.7rem;margin-top:1rem}
.sosyal a{display:grid;place-items:center;width:40px;height:40px;border-radius:10px;
  background:rgba(255,255,255,.1);color:#f0e2cd;transition:background .25s,transform .25s}
.sosyal a:hover{background:var(--altin);color:#241a04;transform:translateY(-3px)}

/* ---------- VİDEO KARTLARI (nurdersi tarzı) ---------- */
.video-grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.ders-kart{padding:0;overflow:hidden;display:flex;flex-direction:column}
.ders-kart .kapak{position:relative;aspect-ratio:16/9;background:var(--bordo-koyu);cursor:pointer;border:0;padding:0;width:100%}
.ders-kart .kapak img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.ders-kart:hover .kapak img{transform:scale(1.05)}
.ders-kart .kapak .oynat{position:absolute;inset:0;display:grid;place-items:center;color:#fff}
.ders-kart .kapak .oynat span{width:58px;height:58px;border-radius:50%;background:rgba(138,20,32,.92);
  display:grid;place-items:center;font-size:1.4rem;padding-left:4px;box-shadow:0 6px 18px rgba(0,0,0,.35);transition:transform .25s}
.ders-kart .kapak:hover .oynat span{transform:scale(1.12)}
.ders-kart .kapak.yakinda{display:grid;place-items:center;color:#f3e3c8;font-family:'Lora',serif;font-style:italic}
.ders-kart .govde{padding:1.1rem 1.2rem 1.3rem;display:flex;flex-direction:column;gap:.45rem}
.ders-kart .govde h3{font-size:1.05rem;line-height:1.35;margin:0}
.ders-kart .etiketler{display:flex;gap:.4rem;flex-wrap:wrap}
.ders-kart .etiketler a,.ders-kart .etiketler span{color:var(--bordo);font-weight:700;font-size:.85rem;text-decoration:none}
.ders-kart .etiketler .ayrac{color:var(--cizgi)}
.ders-kart .meta{display:flex;gap:1rem;color:var(--gri);font-size:.83rem;margin-top:.2rem}
.ders-kart .video-acik{aspect-ratio:16/9;width:100%}
.ders-kart .video-acik iframe{width:100%;height:100%;border:0}

/* ---------- DUYURU KAYDIRAĞI (Swiper) ---------- */
.duyuru-kaydirak{max-width:720px;margin-inline:auto;padding:0 2.6rem 2.6rem}
.duyuru-kaydirak .duyuru-kart{height:100%;text-align:center}
.duyuru-kaydirak .duyuru-kart p{font-family:'Lora',serif;font-size:1.1rem;color:var(--bordo-koyu)}
.duyuru-kaydirak .duyuru-kart small{display:block;margin-top:.8rem;color:var(--gri);
  letter-spacing:.12em;text-transform:uppercase;font-size:.75rem}
.duyuru-kaydirak .swiper-button-prev,
.duyuru-kaydirak .swiper-button-next{
  color:var(--bordo);background:var(--kagit);border:1px solid var(--cizgi);
  width:40px;height:40px;border-radius:50%;box-shadow:var(--golge);margin-top:-32px;
}
.duyuru-kaydirak .swiper-button-prev::after,
.duyuru-kaydirak .swiper-button-next::after{font-size:1rem;font-weight:700}
.duyuru-kaydirak .swiper-pagination-bullet-active{background:var(--bordo)}
/* Swiper JS yüklenmezse (CDN erişilemezse) duyurular düz liste olarak görünsün */
.duyuru-kaydirak:not(.swiper-initialized){padding:0}
.duyuru-kaydirak:not(.swiper-initialized) .swiper-wrapper{display:grid;gap:1rem}
.duyuru-kaydirak:not(.swiper-initialized) .swiper-pagination,
.duyuru-kaydirak:not(.swiper-initialized) .swiper-button-prev,
.duyuru-kaydirak:not(.swiper-initialized) .swiper-button-next{display:none}
@media (max-width:560px){
  .duyuru-kaydirak{padding:0 0 2.4rem}
  .duyuru-kaydirak .swiper-button-prev,
  .duyuru-kaydirak .swiper-button-next{display:none}
}

/* ---------- MOTION TOKEN ---------- */
:root{
  --sure-hizli:160ms; --sure-orta:220ms; --sure-yavas:500ms;
  --esne:cubic-bezier(.22,1,.36,1);
}
.btn{transition:transform var(--sure-hizli) var(--esne),box-shadow var(--sure-hizli) var(--esne),background var(--sure-hizli) var(--esne)}
.btn:active{transform:translateY(-1px) scale(.97)}
.kart{transition:transform var(--sure-orta) var(--esne),box-shadow var(--sure-orta) var(--esne),border-color var(--sure-orta) var(--esne)}
.kart:hover{border-color:var(--altin)}
nav.menu a{position:relative}
nav.menu a::after{content:"";position:absolute;left:.8rem;right:.8rem;bottom:.3rem;height:2px;
  background:var(--altin);transform:scaleX(0);transform-origin:left;transition:transform var(--sure-orta) var(--esne)}
nav.menu a:hover::after{transform:scaleX(1)}
nav.menu a[aria-current="page"]::after{display:none}

/* ---------- LOGO ---------- */
.logo-img{height:56px;width:auto;border-radius:8px}
.hero-logo{
  width:min(280px,58%);height:auto;margin:0 auto 1.6rem;border-radius:14px;
  box-shadow:0 16px 40px rgba(0,0,0,.32);
  animation:belir .9s var(--esne) both, yuzer 7s 1.5s ease-in-out infinite alternate;
}
@keyframes yuzer{from{transform:translateY(0)}to{transform:translateY(-9px)}}
.hero{background-size:180% 180%;animation:zeminKay 16s ease-in-out infinite alternate}
@keyframes zeminKay{from{background-position:0% 0%}to{background-position:100% 100%}}
.ders-kart .kapak:focus-visible{outline:3px solid var(--altin);outline-offset:-3px}
.sosyal a{transition:background var(--sure-hizli) var(--esne),transform var(--sure-hizli) var(--esne)}

/* kademeli reveal (stagger) */
.kartlar .kart.reveal:nth-child(2){transition-delay:80ms}
.kartlar .kart.reveal:nth-child(3){transition-delay:160ms}
.kartlar .kart.reveal:nth-child(4){transition-delay:240ms}

/* ---------- KOYU TEMA ---------- */

@media (prefers-reduced-motion:reduce){
  .hero,.hero-logo{animation:none!important}
  .kartlar .kart.reveal{transition-delay:0ms}
}

/* ---------- KOMPAKT MENÜ (tek satır) ---------- */
.nav{flex-wrap:nowrap}
.logo-img{height:48px}
nav.menu ul{flex-wrap:nowrap;gap:.1rem}
nav.menu a{font-size:.9rem;padding:.5rem .55rem;white-space:nowrap}
@media (max-width:1080px){
  nav.menu a{font-size:.85rem;padding:.45rem .45rem}
}

/* ---------- MENÜ TEK SATIR GARANTİSİ ---------- */
@media (max-width:1180px) and (min-width:961px){
  nav.menu a{font-size:.82rem;padding:.45rem .4rem}
  .logo-img{height:42px}
}
@media (max-width:960px){
  #menuBtn{display:block}
  nav.menu{display:none;position:absolute;top:100%;left:0;right:0;background:var(--kemik);
    border-bottom:1px solid var(--cizgi);box-shadow:var(--golge)}
  nav.menu.acik{display:block}
  nav.menu ul{flex-direction:column;padding:.8rem;flex-wrap:wrap}
  nav.menu a{display:block;padding:.9rem 1rem;font-size:1.05rem;white-space:normal}
}

/* ---------- OKU SAYFASI ---------- */
.eserler{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.2rem}
.eser{
  display:flex;flex-direction:column;gap:.45rem;
  background:var(--kagit);border:1px solid var(--cizgi);border-radius:var(--radius);
  padding:1.4rem 1.5rem;box-shadow:var(--golge);
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.eser:hover{transform:translateY(-5px);box-shadow:0 16px 36px rgba(94,13,21,.14);border-color:var(--altin)}
.eser h3{font-size:1.15rem}
.eser p{font-size:.9rem;color:var(--gri);flex:1}
.eser a{
  align-self:flex-start;text-decoration:none;font-weight:700;font-size:.92rem;
  padding:.55rem 1.1rem;border-radius:999px;border:2px solid var(--bordo);color:var(--bordo);
  transition:background .25s,color .25s;min-height:44px;display:inline-flex;align-items:center;gap:.3rem;
}
.eser a:hover{background:var(--bordo);color:#fff}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- MARKA (N monogram + yazı) ---------- */
.marka{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.marka-logo{
  width:46px;height:46px;flex:none;border:2px solid var(--bordo);border-radius:8px;
  background:#fff;padding:3px;object-fit:contain;
  transition:transform var(--sure-orta) var(--esne);
}
.marka:hover .marka-logo{transform:rotate(-4deg) scale(1.07)}
.marka-yazi b{font-family:'Lora',serif;color:var(--bordo-koyu);font-size:1.05rem;letter-spacing:.04em;line-height:1.15;display:block}
.marka-yazi small{color:var(--gri);letter-spacing:.14em;font-size:.66rem;text-transform:uppercase;white-space:nowrap}
@media (max-width:1180px) and (min-width:961px){
  .marka-yazi small{display:none}
  .marka-logo{width:42px;height:42px}
}

/* ---------- SİNEMATİK FOTOĞRAFLAR (Said Nursî) ---------- */
.foto-sahne{
  position:relative;max-width:460px;margin:0 auto 2.6rem;
  border-radius:var(--radius);overflow:hidden;
  box-shadow:0 26px 60px rgba(94,13,21,.28);
}
.foto-sahne img{
  width:100%;height:auto;display:block;transform-origin:50% 18%;
  animation:kenburns 20s ease-in-out infinite alternate;
}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.09)}}
.foto-sahne::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(94,13,21,.14),transparent 32%,transparent 58%,rgba(20,8,6,.74));
}
.foto-sahne figcaption{
  position:absolute;left:0;right:0;bottom:0;z-index:1;
  padding:1rem 1.3rem;color:#f3e3c8;
  font-family:'Lora',serif;font-style:italic;font-size:.95rem;text-align:center;
}
.foto-yan{
  float:right;width:min(280px,44%);margin:.4rem 0 1.2rem 1.6rem;
  position:relative;border-radius:var(--radius);overflow:hidden;
  box-shadow:0 16px 40px rgba(94,13,21,.22);
}
.foto-yan img{
  width:100%;height:auto;display:block;
  filter:sepia(.28) contrast(1.03);
  transition:filter 1.2s var(--esne),transform 9s ease;
}
.foto-yan:hover img{filter:none;transform:scale(1.07)}
.foto-yan figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:.7rem 1rem;
  background:linear-gradient(transparent,rgba(20,8,6,.82));
  color:#f3e3c8;font-size:.8rem;font-style:italic;text-align:center;
}
@media (max-width:600px){
  .foto-yan{float:none;width:100%;max-width:340px;margin:0 auto 1.4rem}
}
@media (prefers-reduced-motion:reduce){
  .foto-sahne img{animation:none}
  .foto-yan img,.foto-yan:hover img{transition:none;transform:none}
}