/*
Theme Name: Masal Bahçesi
Theme URI: https://example.com/masal-bahcesi
Author: Masal Bahçesi Studio
Author URI: https://example.com
Description: Çocuklar için Türkçe masalların paylaşıldığı sitelere özel, premium bir WordPress teması. "Açık kitap" konseptiyle tasarlanmış: koyu gece tonları kapak, sıcak parşömen tonları iç sayfalar gibi kullanılır. Lale motifleri, fener animasyonu ve sayfa köşesi efektleriyle masal atmosferi yaratır.
Version: 1.0.1
Requires at least: 6.0
Requires PHP: 7.4
Tested up to: 6.6
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: masal-bahcesi
Tags: blog, custom-menu, custom-logo, featured-images, translation-ready, threaded-comments, custom-colors

Masal Bahçesi WordPress Theme, Underscores tabanlı olmadan sıfırdan, bu proje için özel olarak tasarlanmıştır.
*/

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Nunito:wght@400;600;700;800&display=swap');

:root{
  --night-1:#161f3d;
  --night-2:#3a1e46;
  --parchment:#fbf1de;
  --parchment-2:#f4e6c6;
  --gold:#e8a33d;
  --gold-light:#f4c878;
  --rose:#b03a5b;
  --sage:#6e8f6b;
  --ink:#2b2113;
  --ink-soft:#5b4a38;
  --white-warm:#fff8ec;
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family:'Nunito', sans-serif;
  background:var(--parchment);
  color:var(--ink);
  overflow-x:hidden;
}
h1,h2,h3,.brand{font-family:'Baloo 2', sans-serif;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; height:auto; display:block; border-radius:12px;}
ul{list-style:none; margin:0; padding:0;}
button{font-family:inherit; cursor:pointer; border:none;}
.container{max-width:1180px; margin:0 auto; padding:0 28px;}
section{position:relative;}
.screen-reader-text{position:absolute; left:-9999px;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}
html{scroll-behavior:smooth;}
.reveal{opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in{opacity:1; transform:translateY(0);}

/* ---------- Nav ---------- */
header.site-header{
  position:sticky; top:0; z-index:100;
  background:linear-gradient(180deg, var(--night-1), #1c274a);
  border-bottom:1px solid rgba(232,163,61,.25);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 28px; flex-wrap:wrap; gap:12px;}
.brand{display:flex; align-items:center; gap:10px; color:var(--white-warm); font-size:1.35rem; font-weight:700;}
.brand img{max-height:36px; width:auto; border-radius:0;}
.brand svg{width:30px; height:30px; color:var(--gold);}
.nav-links{display:flex; gap:26px; align-items:center; flex-wrap:wrap;}
.nav-links li{position:relative;}
.nav-links a{display:block; color:var(--white-warm); opacity:.85; font-weight:700; font-size:.95rem; padding:6px 2px; border-bottom:2px solid transparent; transition:.25s;}
.nav-links a:hover, .nav-links a:focus{opacity:1; border-color:var(--gold);}
.nav-cta{background:var(--gold); color:var(--night-1); font-weight:800; padding:10px 20px; border-radius:999px; font-size:.9rem; transition:.25s;}
.nav-cta:hover{background:var(--gold-light);}

/* Açılır alt menüler (dropdown) */
.nav-links .sub-menu{
	display:none;
	position:absolute; top:100%; left:0; z-index:200;
	min-width:220px; margin-top:14px; padding:10px;
	background:var(--night-1); border:1px solid rgba(232,163,61,.25); border-radius:12px;
	box-shadow:0 18px 34px rgba(10,8,20,.4);
	flex-direction:column; gap:0;
}
.nav-links .sub-menu .sub-menu{ top:0; left:100%; margin-top:-10px; }
.nav-links .sub-menu li{width:100%;}
.nav-links .sub-menu a{
	padding:10px 12px; border-radius:8px; border-bottom:none; opacity:.85; white-space:nowrap;
}
.nav-links .sub-menu a:hover, .nav-links .sub-menu a:focus{
	opacity:1; background:rgba(232,163,61,.14); color:var(--gold-light);
}
.nav-links li.menu-item-has-children > a{
	display:flex; align-items:center; gap:6px;
}
.nav-links li.menu-item-has-children > a::after{
	content:"▾"; font-size:.7rem; opacity:.7;
}
/* Masaüstünde: üzerine gelince veya odaklanınca aç */
@media (min-width:641px){
	.nav-links li:hover > .sub-menu,
	.nav-links li.menu-open > .sub-menu,
	.nav-links li:focus-within > .sub-menu{
		display:flex;
	}
}

/* Mobil menü butonu (hamburger) */
.nav-toggle{
	display:none; flex-direction:column; justify-content:center; gap:5px;
	width:38px; height:38px; background:transparent; border:none; cursor:pointer;
}
.nav-toggle span{display:block; width:100%; height:2px; background:var(--white-warm); border-radius:2px; transition:.25s;}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- Hero ---------- */
.hero{background:radial-gradient(ellipse at 20% -10%, #263566 0%, transparent 55%), linear-gradient(160deg, var(--night-1) 0%, var(--night-2) 100%); padding:100px 28px 150px; text-align:center; overflow:hidden;}
.stars{position:absolute; inset:0; pointer-events:none;}
.star{position:absolute; width:3px; height:3px; background:var(--white-warm); border-radius:50%; opacity:.6; animation:twinkle 3.4s ease-in-out infinite;}
@keyframes twinkle{0%,100%{opacity:.15; transform:scale(.8);} 50%{opacity:.95; transform:scale(1.3);}}
.moon{width:64px; height:64px; margin:0 auto 18px;}
.moon svg{width:100%; height:100%; color:var(--gold-light); filter:drop-shadow(0 0 22px rgba(244,200,120,.55));}
.lantern{width:46px; margin:0 auto 8px; animation:swing 4.2s ease-in-out infinite; transform-origin:top center;}
@keyframes swing{0%,100%{transform:rotate(-6deg);} 50%{transform:rotate(6deg);}}
.lantern svg{color:var(--gold);}
.eyebrow{color:var(--gold-light); font-weight:800; letter-spacing:1.5px; text-transform:uppercase; font-size:.78rem; margin-bottom:16px; display:block;}
.hero h1{color:var(--white-warm); font-size:clamp(2.1rem, 5vw, 3.5rem); line-height:1.15; max-width:820px; margin:0 auto 20px; font-weight:800;}
.hero h1 span{color:var(--gold-light);}
.hero p{color:rgba(255,248,236,.78); max-width:560px; margin:0 auto 34px; font-size:1.08rem; line-height:1.7;}
.hero-actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; margin-bottom:54px;}
.btn-primary{background:var(--gold); color:var(--night-1); font-weight:800; padding:15px 30px; border-radius:999px; font-size:1rem; transition:.25s; display:inline-block;}
.btn-primary:hover{background:var(--gold-light); transform:translateY(-2px);}
.btn-ghost{color:var(--white-warm); font-weight:700; padding:15px 26px; border-radius:999px; border:1.5px solid rgba(255,248,236,.35); transition:.25s; display:inline-block;}
.btn-ghost:hover{border-color:var(--gold-light); color:var(--gold-light);}
.hero-stats{display:flex; gap:40px; justify-content:center; flex-wrap:wrap; color:var(--white-warm);}
.hero-stats div{text-align:center;}
.hero-stats strong{display:block; font-family:'Baloo 2'; font-size:1.5rem; color:var(--gold-light);}
.hero-stats span{font-size:.82rem; opacity:.7;}
.page-edge{position:relative; height:64px; margin-top:-2px;}
.page-edge svg{width:100%; height:100%; display:block;}
.tile-strip{height:14px; background-image:repeating-linear-gradient(45deg, var(--gold) 0, var(--gold) 2px, transparent 2px, transparent 16px), repeating-linear-gradient(-45deg, var(--rose) 0, var(--rose) 2px, transparent 2px, transparent 16px); opacity:.55;}

/* ---------- Sections ---------- */
.section-pad{padding:96px 28px;}
.section-head{text-align:center; max-width:640px; margin:0 auto 56px;}
.section-head .kicker{color:var(--rose); font-weight:800; letter-spacing:1.2px; text-transform:uppercase; font-size:.78rem; margin-bottom:10px; display:block;}
.section-head h2{font-size:clamp(1.7rem,3.4vw,2.4rem); color:var(--ink); font-weight:700; margin:0;}
.section-head p{color:var(--ink-soft); margin-top:14px; font-size:1.02rem; line-height:1.6;}
.section-alt{background:var(--parchment-2);}

/* ---------- Tale cards ---------- */
.tales-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.tale-card{background:var(--white-warm); border-radius:18px; padding:26px; position:relative; overflow:hidden; box-shadow:0 10px 24px rgba(43,33,19,.08); transition:transform .3s ease, box-shadow .3s ease; border:1px solid rgba(43,33,19,.06); display:block;}
.tale-card:hover{transform:translateY(-6px); box-shadow:0 22px 40px rgba(43,33,19,.16);}
.tale-card::after{content:""; position:absolute; top:0; right:0; width:0; height:0; border-style:solid; border-width:0 0 34px 34px; border-color:transparent transparent var(--gold) transparent; opacity:0; transition:opacity .3s ease;}
.tale-card:hover::after{opacity:1;}
.tale-card .thumb{margin:-26px -26px 18px; border-radius:18px 18px 0 0; overflow:hidden; max-height:170px;}
.tale-card .thumb img{border-radius:0; width:100%; height:170px; object-fit:cover;}
.tale-tag{display:inline-block; font-size:.72rem; font-weight:800; letter-spacing:.4px; padding:5px 12px; border-radius:999px; margin-bottom:14px; color:var(--white-warm); background:var(--rose);}
.tale-card h3{font-size:1.2rem; color:var(--ink); margin:0 0 10px; line-height:1.35;}
.tale-card .excerpt{color:var(--ink-soft); font-size:.92rem; line-height:1.55; margin:0 0 18px;}
.tale-meta{display:flex; justify-content:space-between; align-items:center; font-size:.8rem; color:var(--ink-soft); border-top:1px dashed rgba(43,33,19,.15); padding-top:14px;}
.tale-meta strong{color:var(--rose);}

/* ---------- Categories ---------- */
.cat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.cat-card{background:linear-gradient(160deg, var(--white-warm), var(--parchment-2)); border-radius:16px; padding:28px 24px; text-align:center; border:1px solid rgba(43,33,19,.07); transition:transform .3s ease, border-color .3s ease; display:block;}
.cat-card:hover{transform:translateY(-4px); border-color:var(--gold);}
.cat-icon{width:52px; height:52px; margin:0 auto 16px; color:var(--rose);}
.cat-card h3{font-size:1.05rem; margin:0 0 8px; color:var(--ink);}
.cat-card p{font-size:.85rem; color:var(--ink-soft); line-height:1.5; margin:0;}

/* ---------- Steps ---------- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:32px;}
.step{text-align:center;}
.step-num{width:54px; height:54px; border-radius:50%; margin:0 auto 18px; background:var(--night-1); color:var(--gold-light); font-family:'Baloo 2'; font-weight:700; font-size:1.3rem; display:flex; align-items:center; justify-content:center;}
.step h3{font-size:1.1rem; margin:0 0 10px;}
.step p{color:var(--ink-soft); font-size:.92rem; line-height:1.6; max-width:260px; margin:0 auto;}

/* ---------- Testimonials ---------- */
.testi-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.testi-card{background:var(--white-warm); border-radius:16px; padding:28px; border-left:4px solid var(--gold);}
.testi-card p{font-style:italic; color:var(--ink); line-height:1.6; margin:0 0 16px; font-size:.98rem;}
.testi-name{font-weight:800; color:var(--rose); font-size:.88rem;}
.testi-role{font-size:.78rem; color:var(--ink-soft);}

/* ---------- Closing / Newsletter ---------- */
.closing{background:linear-gradient(160deg, var(--night-2) 0%, var(--night-1) 100%); padding:90px 28px 70px; text-align:center; color:var(--white-warm);}
.closing h2{font-size:clamp(1.6rem,3.4vw,2.2rem); margin:0 0 14px;}
.closing p{color:rgba(255,248,236,.75); max-width:480px; margin:0 auto 32px; line-height:1.6;}
.newsletter-form{display:flex; gap:10px; max-width:440px; margin:0 auto; flex-wrap:wrap; justify-content:center;}
.newsletter-form input{flex:1; min-width:220px; padding:15px 20px; border-radius:999px; font-family:inherit; font-size:.95rem; background:rgba(255,248,236,.1); color:var(--white-warm); border:1.5px solid rgba(255,248,236,.25);}
.newsletter-form input::placeholder{color:rgba(255,248,236,.5);}
.newsletter-form button{background:var(--gold); color:var(--night-1); font-weight:800; padding:15px 26px; border-radius:999px; transition:.25s;}
.newsletter-form button:hover{background:var(--gold-light);}

/* ---------- Footer ---------- */
footer.site-footer{background:#12172c; color:rgba(255,248,236,.6); padding:46px 28px 26px; text-align:center; font-size:.85rem; border-top:1px solid rgba(232,163,61,.15);}
.footer-links{display:flex; gap:22px; justify-content:center; margin:18px 0; flex-wrap:wrap;}
.footer-links a{opacity:.85; transition:.2s;}
.footer-links a:hover{opacity:1; color:var(--gold-light);}
.footer-widgets{display:grid; grid-template-columns:repeat(3,1fr); gap:30px; max-width:1180px; margin:0 auto 30px; text-align:left;}
.footer-widgets .widget h2, .footer-widgets .widget h3{font-size:.95rem; color:var(--gold-light); margin-bottom:12px;}
.footer-widgets .widget a{color:rgba(255,248,236,.7);}

/* ---------- Page / Single content ---------- */
.page-header-band{background:linear-gradient(160deg, var(--night-1) 0%, var(--night-2) 100%); padding:80px 28px 60px; text-align:center; color:var(--white-warm);}
.page-header-band h1{font-size:clamp(1.9rem,4vw,2.8rem); margin:0 0 10px;}
.page-header-band .breadcrumb{opacity:.7; font-size:.85rem;}
.entry-wrap{max-width:760px; margin:0 auto; padding:70px 28px;}
.entry-content{font-size:1.05rem; line-height:1.85; color:var(--ink);}
.entry-content p{margin:0 0 20px;}
.entry-content h2, .entry-content h3{margin:36px 0 16px; color:var(--ink);}
.entry-content blockquote{border-left:4px solid var(--gold); padding:8px 22px; color:var(--ink-soft); font-style:italic; margin:24px 0;}
.entry-content ul, .entry-content ol{margin:0 0 20px 22px;}
.entry-meta-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap; margin-top:18px; font-size:.85rem;}
.entry-meta-row span{background:rgba(255,248,236,.12); padding:6px 14px; border-radius:999px;}
.related-tales{margin-top:70px;}
.related-tales h3{font-size:1.3rem; margin-bottom:24px; text-align:center;}
.pagination-row{display:flex; justify-content:center; gap:10px; margin-top:50px;}
.pagination-row a, .pagination-row span{padding:10px 16px; border-radius:999px; background:var(--white-warm); font-weight:700; font-size:.9rem; border:1px solid rgba(43,33,19,.1);}
.pagination-row .current{background:var(--night-1); color:var(--white-warm);}
.no-results{text-align:center; padding:100px 28px; color:var(--ink-soft);}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .tales-grid, .cat-grid, .testi-grid, .steps, .footer-widgets{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .nav{position:relative;}
  .nav-toggle{display:flex;}
  .nav-links{
    display:none; flex-direction:column; align-items:stretch; gap:2px;
    width:100%; order:10;
    background:var(--night-1); border-radius:12px; padding:10px;
    margin-top:8px; border:1px solid rgba(232,163,61,.2);
  }
  .nav-links.is-open{display:flex;}
  .nav-links a{padding:12px 10px;}
  .nav-links .sub-menu{
    display:none; position:static; box-shadow:none; border:none; background:rgba(255,248,236,.05);
    margin:0 0 0 14px; min-width:0;
  }
  .nav-links li.menu-open > .sub-menu{display:flex;}
  .tales-grid, .cat-grid, .testi-grid, .steps, .footer-widgets{grid-template-columns:1fr;}
  .hero{padding:70px 20px 110px;}
  .section-pad{padding:70px 20px;}
  .hero-stats{gap:26px;}
}
