/*
Theme Name: QuranLearn OnePage
Theme URI: https://example.com/quranlearn-onepage
Author: Azhar
Author URI: https://example.com
Description: Clean, responsive single-page Quran learning theme in white, green & gold.
Version: 1.0.2
License: GNU General Public License v2 or later
Text Domain: ql-onepage
Tags: one-column, responsive, education, one-page
*/

/* ==== Brand Palette ==== */
:root{
  --brand-green: #0f8a5f;   /* primary green */
  --brand-gold:  #c9a227;   /* accent gold */
  --brand-white: #ffffff;
  --text-dark:   #111827;   /* near-black */
  --text-mid:    #374151;   /* gray-700 */
  --muted:       #6b7280;   /* gray-500 */
  --bg:          #ffffff;
  --bg-soft:     #f9fafb;
  --ring:        rgba(15,138,95,.25);
}

/* CSS Reset (minimal) */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Naskh Arabic", "Scheherazade New", Arial, sans-serif;
  color:var(--text-dark);
  background:var(--bg);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--brand-green);text-decoration:none}
a:hover{opacity:.9}
.container{width:min(1200px, 92%);margin-inline:auto}
.section{padding:64px 0}
.section .section-title{
    text-align: center;
  font-size:clamp(1.5rem, 2.5vw, 2rem);
  margin:0 0 16px;
  color:var(--text-dark);
}
.section .section-sub{
  color:var(--muted);
  margin:0 0 32px;
}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:.5rem;
  padding:.75rem 1.1rem;border-radius:999px;font-weight:600;
  border:1px solid transparent;cursor:pointer
}
.btn-primary{
  background:var(--brand-green);color:#fff;
  box-shadow:0 6px 20px -8px var(--ring)
}
.btn-outline{
  background:transparent;border-color:var(--brand-green);color:var(--brand-green)
}


/* Hero placeholder */
.hero{
  padding:88px 0 64px;background:
  linear-gradient(180deg, rgba(201,162,39,.08), transparent 60%) ,
  linear-gradient(90deg, rgba(15,138,95,.06), transparent 50%);
}
.hero h1{font-size:clamp(2rem, 4vw, 3rem);margin:0 0 12px}
.hero p{color:var(--text-mid);max-width:60ch}

/* Footer base */
.site-footer{background:#0d1b16;color:#d1d5db}
.site-footer a{color:#d1fae5}
.site-footer .footer-inner{padding:28px 0;display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.small{font-size:.9rem;color:#9ca3af}