/*
Theme Name: Retro Rewind Theme v11
Author: ChatGPT
Description: Retro-styled quiz theme with category images, featured quizzes, archive/single templates, and ad placeholders.
Version: 11.0
*/
body { font-family: 'Trebuchet MS', sans-serif; background: #fff8f0; margin: 0; color: #2b2d42; }
header { background: linear-gradient(135deg, #fcbf49, #ef476f); color: #2b2d42; text-align: center; padding: 2rem 1rem; }
header h1 { font-family: 'Courier New', monospace; font-size: 3rem; font-weight: bold; letter-spacing: 2px; margin: 0; color: #2b2d42; text-shadow: 2px 2px #fcefb4; }
header h2 { font-size: 1.25rem; font-weight: normal; margin-top: 0.5rem; color: #2b2d42; font-style: italic; }
.container { width: 90%; max-width: 1200px; margin: auto; padding: 2rem 0; }
.categories { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
.category-tile { flex: 1 1 calc(33% - 1rem); min-height: 200px; border-radius: 12px; color: white;
    font-size: 1.5rem; font-weight: bold; display: flex; align-items: center; justify-content: center;
    text-decoration: none; background-size: cover; background-position: center; transition: transform 0.2s ease; }
.category-tile:hover { opacity: 0.9; transform: scale(1.05); }
.featured { margin-top: 3rem; }
.featured h3 { margin-bottom: 1rem; text-align: center; font-size: 1.75rem; color: #ef476f; }
.featured-grid { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
.featured-item { flex: 1 1 calc(50% - 1rem); background: white; border-radius: 8px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); padding: 1rem; text-align: center; }
.featured-item img { max-width: 100%; border-radius: 8px; }
.page-content, .post-content, .archive-content { background: white; border-radius: 8px; padding: 2rem; box-shadow: 0 2px 5px rgba(0,0,0,0.1); margin-bottom: 2rem; }
.ad-slot { margin: 1.5rem 0; text-align: center; background: #f0f0f0; border: 1px dashed #aaa; padding: 1rem; color: #555; font-style: italic; }
footer { background: #2b2d42; color: #eee; text-align: center; padding: 1rem; margin-top: 2rem; }
footer a { color: #fcbf49; margin: 0 0.5rem; text-decoration: none; }
footer a:hover { text-decoration: underline; }