@font-face{font-family:'Baloo 2';src:url(/varlik/font/baloo-800.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:Nunito;src:url(/varlik/font/nunito-400.woff2) format('woff2');font-weight:400 600;font-display:swap}
@font-face{font-family:Nunito;src:url(/varlik/font/nunito-700.woff2) format('woff2');font-weight:700 900;font-display:swap}

:root{
  --mor:#6C3BFF;--mor-orta:#4A1FD6;--mor-koyu:#2E0F99;--mor-derin:#1B0A5C;
  --lila:#F4F0FF;--lila-2:#E9E2FF;--sari:#FFC93C;--turuncu:#FF8A3D;--turuncu-yazi:#B8470A;
  --yazi:#1F1B3A;--soluk:#4B4768;--zemin:#FBFAFF;--beyaz:#fff;
  --cikis:cubic-bezier(.16,1,.3,1);
  --baslik:'Baloo 2','Nunito',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:Nunito,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;background:var(--zemin);color:var(--yazi);line-height:1.65;font-size:17px;text-wrap:pretty}
img{max-width:100%;height:auto}
::selection{background:var(--sari);color:var(--mor-derin)}
a{color:var(--mor-orta);text-underline-offset:.18em}
a:hover{color:var(--mor-koyu)}
:focus-visible{outline:3px solid var(--mor);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--baslik);font-weight:800;line-height:1.08;margin:0;text-wrap:balance;color:var(--mor-koyu)}
h1{font-size:clamp(2.2rem,6.4vw,3.6rem)}
h2{font-size:clamp(1.75rem,4.4vw,2.6rem);margin:2.4em 0 .5em}
h3{font-size:1.35rem;margin:0 0 .3em}
p{margin:.8em 0}
.atla{position:absolute;left:-999px;top:8px;background:var(--sari);color:var(--mor-derin);padding:8px 14px;border-radius:8px;font-weight:800;z-index:99}
.atla:focus{left:8px}

/* üst çubuk */
header{background:var(--beyaz);border-bottom:1px solid #E7E2F7;position:relative;z-index:5}
.ust{max-width:1120px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.marka{flex:none}
.marka img{display:block;height:36px;width:auto}
nav{display:flex;gap:2px;align-items:center}
nav a{white-space:nowrap;color:var(--yazi);text-decoration:none;font-weight:700;padding:8px 12px;border-radius:10px}
nav a:hover{background:var(--lila)}
.anasayfa header{background:transparent;border:0;position:absolute;inset:0 0 auto 0}
.anasayfa nav a{color:#fff}
.anasayfa nav a:hover{background:#ffffff22}

/* içerik sayfaları */
main{max-width:1120px;margin:0 auto;padding:0 20px 48px}
.metin{max-width:760px}
main>h1,.metin h1{margin:1.1em 0 0}
.alt{color:var(--soluk);margin-top:.3em}
ul,ol{padding-left:1.3em}li{margin:.35em 0}
.kart{background:var(--beyaz);border:1px solid #E7E2F7;border-radius:20px;padding:20px 22px;margin:18px 0;box-shadow:0 1px 2px #2e0f9914,0 10px 24px -14px #2e0f9933}
.uyari{background:#FFF6DC;border-radius:14px;padding:12px 16px;color:#5A3B00;font-weight:600}
.etiket{display:inline-block;background:var(--lila-2);color:var(--mor-koyu);font-weight:800;font-size:.85rem;padding:4px 12px;border-radius:99px}
.etiket.sari{background:var(--sari);color:var(--mor-derin)}
table{border-collapse:collapse;width:100%;font-size:.95rem;display:block;overflow-x:auto}
th,td{border:1px solid #E1DAF5;padding:8px 10px;text-align:left;vertical-align:top}
th{background:var(--lila)}
.dugme{display:inline-block;background:var(--mor);color:#fff;font-weight:800;padding:12px 22px;border-radius:14px;text-decoration:none;transition:transform .25s var(--cikis),box-shadow .25s var(--cikis)}
.dugme:hover{color:#fff;transform:translateY(-2px);box-shadow:0 10px 18px -8px #2e0f9966}
.dugme.sari{background:var(--sari);color:var(--mor-derin)}
.dugme.sari:hover{color:var(--mor-derin)}
details.sss{background:var(--beyaz);border:1px solid #E7E2F7;border-radius:16px;margin:10px 0;padding:0 18px}
details.sss summary{cursor:pointer;font-weight:800;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:12px;align-items:center}
details.sss summary::-webkit-details-marker{display:none}
details.sss summary::after{content:'+';font-size:1.5rem;line-height:1;color:var(--mor);transition:transform .3s var(--cikis)}
details.sss[open] summary::after{transform:rotate(45deg)}
details.sss p{margin:0 0 14px;color:var(--soluk)}

/* mağaza düğmeleri */
.magaza{display:flex;gap:12px;flex-wrap:wrap}
.m-dugme{display:inline-flex;align-items:center;gap:12px;background:#0E0A24;color:#fff;text-decoration:none;padding:9px 20px 9px 16px;border-radius:16px;border:1.5px solid #ffffff40;min-width:186px;transition:transform .3s var(--cikis),box-shadow .3s var(--cikis),background .2s}
.m-dugme:hover{color:#fff;transform:translateY(-3px);background:#000;box-shadow:0 14px 22px -12px #000a}
.m-dugme svg{width:28px;height:28px;flex:none;fill:#fff}
.m-dugme span{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.m-dugme small{font-size:.74rem;font-weight:700;color:#D9D0FF}
.m-dugme b{font-size:1.2rem;font-weight:800;white-space:nowrap}
.m-dugme.yakinda small{color:var(--sari)}
.magaza-not{margin:.9em 0 0;color:#F3EFFF;font-size:1rem}
.magaza-not a{color:#fff;font-weight:800}

/* açılış: kahraman */
.kahraman{background:var(--mor);color:#fff;position:relative;overflow:hidden;isolation:isolate}
.kahraman::before{content:'';position:absolute;z-index:-1;right:-12%;top:-30%;width:62vw;height:62vw;max-width:820px;max-height:820px;border-radius:50%;background:var(--mor-orta)}
.kahraman::after{content:'';position:absolute;z-index:-1;left:-8%;bottom:-24%;width:34vw;height:34vw;max-width:420px;max-height:420px;border-radius:50%;background:#8359FF}
.kah-ic{max-width:1120px;margin:0 auto;padding:108px 20px 56px;display:grid;gap:36px;align-items:center}
.kahraman h1{color:#fff;font-size:clamp(2.5rem,7.4vw,4.4rem);letter-spacing:-.015em}
.kahraman h1 em{font-style:normal;color:var(--sari)}
.kah-yazi p.alt-yazi{font-size:1.2rem;color:#F3EFFF;max-width:30em;margin:1em 0 1.5em}
.kah-sahne{position:relative;display:flex;justify-content:center;min-height:540px}

.telefon{position:relative;width:min(290px,72vw);aspect-ratio:9/19;border-radius:42px;background:#14102B;padding:9px;box-shadow:0 2px 0 #ffffff33 inset,0 50px 70px -30px #14004dcc,0 18px 28px -14px #14004d99;transform:rotate(-4deg);animation:yuz 6s ease-in-out infinite}
.telefon .ekran{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;background:#fff}
.telefon .ekran img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;visibility:hidden}
.telefon .ekran img.onceki{opacity:1;visibility:visible;z-index:1}
.telefon .ekran img.acik{opacity:1;visibility:visible;z-index:2;animation:ekran-gir .7s var(--cikis) both}
@keyframes ekran-gir{from{transform:translateX(34px);clip-path:inset(0 0 0 100%)}to{transform:none;clip-path:inset(0)}}
@keyframes yuz{50%{transform:rotate(-1.5deg) translateY(-14px)}}
.rozet{position:absolute;background:#fff;color:var(--mor-orta);font-weight:800;padding:9px 16px;border-radius:99px;box-shadow:0 12px 20px -10px #14004d88;font-size:.95rem;transition:background .4s,color .4s,transform .5s var(--cikis);white-space:nowrap}
.rozet.acik{background:var(--sari);color:var(--mor-derin);transform:scale(1.12)}
.rozet:nth-of-type(1){left:0;top:16%}.rozet:nth-of-type(2){right:0;top:34%}.rozet:nth-of-type(3){left:2%;top:58%}.rozet:nth-of-type(4){right:2%;top:78%}
.kah-pofi{position:absolute;width:150px;height:auto;left:50%;bottom:-8px;margin-left:-190px;z-index:2;animation:pofi 4.5s ease-in-out infinite;pointer-events:none}
@keyframes pofi{50%{transform:translateY(-10px) rotate(3deg)}}

/* açılış girişi: tek yazılı an */
.giris>*{animation:gir .9s var(--cikis) both}
.giris>*:nth-child(2){animation-delay:.08s}.giris>*:nth-child(3){animation-delay:.16s}.giris>*:nth-child(4){animation-delay:.24s}.giris>*:nth-child(5){animation-delay:.32s}
@keyframes gir{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* kaydıran ders bölümü */
.ders-bolum{background:var(--lila);padding:72px 0 48px}
.ders-ic{max-width:1120px;margin:0 auto;padding:0 20px}
.ders-ic>h2{margin:0 0 8px;max-width:16em}
.ders-ic>p{color:var(--soluk);max-width:34em}
.ders-govde{display:grid;gap:12px;grid-template-columns:1fr;margin-top:12px}
.ders-tel{position:sticky;top:70px;z-index:3;display:flex;justify-content:center;padding:12px 0;background:linear-gradient(var(--lila) 80%,#F4F0FF00)}
.ders-tel .telefon{width:170px;animation:none;transform:rotate(-2deg)}
.adimlar{display:flex;flex-direction:column}
.adim{min-height:46vh;display:flex;flex-direction:column;justify-content:center;opacity:.5;transition:opacity .5s var(--cikis);padding:8px 0}
.adim.aktif,.no-js .adim{opacity:1}
.adim h3{font-size:clamp(1.8rem,5vw,2.6rem);color:var(--mor-koyu)}
.adim p{color:var(--soluk);max-width:26em;font-size:1.1rem}
.adim .ad{display:inline-block;align-self:flex-start;background:var(--mor);color:#fff;font-weight:800;border-radius:99px;padding:4px 14px;font-size:.9rem;margin-bottom:10px}

/* farkı bul */
.fark{background:var(--mor-koyu);color:#fff;padding:80px 20px;position:relative;overflow:hidden}
.fark-ic{max-width:860px;margin:0 auto}
.fark h2{color:#fff;margin:0 0 .4em}
.fark h2 em{font-style:normal;color:var(--sari)}
.fark p.alt-yazi{color:#E4DCFF;font-size:1.15rem}
.cumle{background:var(--mor-orta);border-radius:28px;padding:34px 20px;margin:26px 0 10px;display:flex;flex-wrap:wrap;gap:10px;justify-content:center;box-shadow:0 24px 40px -24px #0c0033}
.kelime{font:800 clamp(1.3rem,4.6vw,2.1rem)/1 var(--baslik);background:#fff;color:var(--yazi);border:0;border-radius:14px;padding:12px 16px;cursor:pointer;transition:transform .3s var(--cikis),background .25s,box-shadow .25s}
.kelime:hover{transform:translateY(-4px) rotate(-1.5deg);box-shadow:0 10px 14px -8px #0c0033}
.kelime:focus-visible{outline-color:var(--sari)}
.kelime.yanlis{animation:salla .4s}
.kelime.dogru{background:var(--sari);color:var(--mor-derin);text-decoration:line-through;text-decoration-thickness:3px}
.kelime.duzelt{background:#7EE0A5;color:#052e14;animation:gir .5s var(--cikis) both}
@keyframes salla{25%{transform:translateX(-8px)}75%{transform:translateX(8px)}}
.tr-anlam{text-align:center;color:#E4DCFF;font-weight:700;margin:0 0 12px}
.fark-ileti{min-height:5.2em;text-align:center;font-weight:700;color:var(--sari);font-size:1.12rem;margin:10px auto;max-width:34em}
.fark-alt{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.fark-alt button{background:transparent;color:#fff;border:2px solid #ffffff66;border-radius:12px;padding:8px 16px;font:800 1rem Nunito,sans-serif;cursor:pointer}
.fark-alt button:hover{background:#ffffff1f}
.fark-not{color:#CFC4F5;font-size:.92rem;text-align:center;margin-top:14px}

/* neler var */
.ozellik-bolum{padding:24px 0 8px}
.ozellik-bolum h2{margin-top:2em;max-width:14em}
.o-izgara{display:grid;gap:0;margin-top:20px}
.o-satir{display:grid;grid-template-columns:44px 1fr;gap:6px 16px;padding:22px 0;border-top:1.5px solid #DDD3F7;align-items:start}
.o-satir:last-child{border-bottom:1.5px solid #DDD3F7}
.o-satir svg{width:34px;height:34px;stroke:var(--mor);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;grid-row:span 2}
.o-satir h3{margin:0;font-size:1.4rem}
.o-satir p{margin:0;color:var(--soluk)}

/* pofi bandı + son çağrı */
.son{background:var(--mor);color:#fff;margin:56px 0 0;position:relative;overflow:hidden;isolation:isolate}
.son::before{content:'';position:absolute;z-index:-1;left:-10%;top:-40%;width:50vw;height:50vw;max-width:560px;max-height:560px;border-radius:50%;background:var(--mor-orta)}
.son-ic{max-width:1120px;margin:0 auto;padding:64px 20px 0;display:grid;gap:12px;align-items:end}
.son h2{color:#fff;margin:0 0 .3em}
.son .magaza-not{margin-bottom:28px}
.son img{width:min(300px,70vw);justify-self:center;display:block;animation:pofi 4.5s ease-in-out infinite}
.diger{max-width:1120px;margin:0 auto;padding:44px 20px 0}
.diger h2{font-size:1.6rem;margin:0 0 14px}
.uyg-liste{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.uyg-kart{display:flex;gap:14px;align-items:center;text-decoration:none;color:var(--yazi);background:var(--beyaz);border:1px solid #E7E2F7;border-radius:20px;padding:14px 18px;transition:transform .3s var(--cikis),box-shadow .3s var(--cikis)}
a.uyg-kart:hover{transform:translateY(-3px);box-shadow:0 14px 22px -14px #2e0f9955;color:var(--yazi)}
.uyg-kart img{width:72px;height:72px;flex:none}
.uyg-kart h3{margin:0}
.uyg-kart p{margin:0;color:var(--soluk)}
.uyg-kart.bos{border-style:dashed;background:transparent}

/* alt bilgi */
footer{border-top:1px solid #E7E2F7;background:var(--beyaz);margin-top:56px}
.alt-bilgi{max-width:1120px;margin:0 auto;padding:24px 20px 32px}
.alt-baglar{display:flex;flex-wrap:wrap;gap:6px 20px}
.alt-baglar a{color:var(--yazi);font-weight:700;text-decoration:none}
.alt-baglar a:hover{text-decoration:underline}
.alt-bilgi p{color:var(--soluk);margin:14px 0 0;font-size:.95rem}
.anasayfa footer{margin-top:0}

@media(min-width:900px){
  .kah-ic{grid-template-columns:1.05fr .95fr;padding-top:130px;padding-bottom:84px}
  .ders-govde{grid-template-columns:1fr 1fr;gap:48px}
  .ders-tel{order:2;top:96px;padding:0;background:none;align-self:start;height:min(86vh,640px);align-items:center}
  .ders-tel .telefon{width:min(300px,100%);transform:rotate(-3deg)}
  .adim{min-height:72vh}
  .o-izgara{grid-template-columns:1fr 1fr;column-gap:56px}
  .o-satir:nth-last-child(2){border-bottom:1.5px solid #DDD3F7}
  .son-ic{grid-template-columns:1.2fr .8fr}
}
@media(max-width:760px){nav .n-b{display:none}}
@media(max-width:560px){
  nav a{padding:8px}
  .rozet{font-size:.82rem;padding:6px 11px}
  .kah-pofi{width:110px;margin-left:-150px}
  .m-dugme{min-width:0;flex:1 1 150px;gap:8px;padding:8px 10px}
  .m-dugme svg{width:24px;height:24px}
  .m-dugme b{font-size:1.05rem}
}

/* hareket azaltma */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01s!important}
  .telefon{transform:rotate(-3deg)}
}
.no-js .telefon .ekran img:first-child{opacity:1;visibility:visible}

nav a.n-cta{background:var(--sari);color:var(--mor-derin);margin-left:8px;padding:8px 16px;border-radius:99px}
nav a.n-cta:hover{background:#FFD661;color:var(--mor-derin)}
.anasayfa nav a.n-cta{color:var(--mor-derin)}
@media(max-width:420px){.ust{padding:12px 14px}nav a.n-cta{padding:7px 12px;margin-left:4px;font-size:.95rem}}

/* rehber yazıları */
.kirinti{font-size:.92rem;color:var(--soluk);margin:22px 0 0}
.kirinti a{color:var(--soluk)}
.metin h1{font-size:clamp(2rem,5.4vw,3rem);margin:.5em 0 .2em}
.metin h2{font-size:clamp(1.5rem,3.6vw,2rem);margin:1.9em 0 .4em}
.metin h3{font-size:1.2rem;margin:1.5em 0 .4em}
.metin p,.metin li{max-width:68ch}
.kisa{background:var(--lila);border-radius:18px;padding:16px 20px;margin:1.2em 0;color:var(--yazi)}
.hata{background:var(--beyaz);border:1px solid #E7E2F7;border-radius:18px;padding:6px 20px;margin:0 0 14px}
.hata p{margin:.55em 0}
.hata .yt,.hata .dt{display:inline-block;min-width:4.6em;font-weight:800;font-size:.85rem;padding:2px 10px;border-radius:99px;margin-right:8px;text-align:center}
.hata .yt{background:#FDE3DD;color:#8A2A12}
.hata .dt{background:#D9F5E3;color:#0E5A2B}
.hata .y{text-decoration:line-through;text-decoration-color:#D14B2B;color:var(--soluk)}
.hata .n{color:var(--soluk)}
.kart.cagri{background:var(--mor);color:#fff;border:0;margin-top:2.4em}
.kart.cagri h3{color:#fff}
.kart.cagri p{color:#F3EFFF}
.kart.cagri .dugme{background:var(--sari);color:var(--mor-derin)}
.yazi-liste{margin-top:18px}
