/*
Theme Name: Hikaye Kral Theme
Theme URI: https://example.com/hikaye-kral
Author: Grok AI (xAI Inspired)
Author URI: https://x.ai
Description: Benzersiz hikaye anlatımı teması: SEO uyumlu, hızlı, modern görselli. Hikaye bölümleri için özel post type.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hikaye-kral
Tags: blog, storytelling, seo, fast, modern
*/

/* Reset ve Temel Stiller - Hızlı ve Modern */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Arial', sans-serif; background: #f0f4f8; color: #333; line-height: 1.6; }
.container { max-width: 1200px; margin: 0 auto; padding: 20px; }

/* Header - Modern Görsel */
header { background: linear-gradient(to right, #007bff, #00c6ff); color: white; padding: 40px 0; text-align: center; }
header h1 { font-size: 2.5em; animation: fadeIn 1s ease-in; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

/* Navigasyon - Responsive */
nav ul { list-style: none; display: flex; justify-content: center; gap: 20px; }
nav a { color: white; text-decoration: none; transition: color 0.3s; }
nav a:hover { color: #ffd700; }

/* Main Content - Hikaye Odaklı, SEO Uyumlu */
main { display: grid; grid-template-columns: 1fr 300px; gap: 20px; }
article { background: white; padding: 20px; border-radius: 10px; box-shadow: 0 4px 8px rgba(0,0,0,0.1); }
article h2 { font-size: 1.8em; margin-bottom: 10px; }
article img { max-width: 100%; height: auto; loading: lazy; } /* Lazy loading for speed */
.sidebar { background: #e9ecef; padding: 20px; border-radius: 10px; }

/* Footer - Basit ve Hızlı */
footer { background: #343a40; color: white; text-align: center; padding: 10px; }

/* SEO Enhancements: Schema Markup için CSS (JS ile entegre) */
.schema-article { margin-bottom: 20px; }

/* Responsive Design - Mobile First */
@media (max-width: 768px) {
    main { grid-template-columns: 1fr; }
    header h1 { font-size: 2em; }
}