/*
Theme Name: Avonmore Public Library
Theme URI: https://example.com/
Author: The Design Loft
Description: A custom, accessible WordPress theme for Avonmore Public Library.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.0
Text Domain: avonmore-library
*/

:root {
  --navy: #17324d;
  --blue: #2f6f8f;
  --gold: #e8b44f;
  --cream: #f7f2e8;
  --ink: #1f2933;
  --white: #ffffff;
  --radius: 18px;
  --shadow: 0 14px 40px rgba(23, 50, 77, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: Arial, Helvetica, sans-serif; line-height: 1.65; }
a { color: var(--blue); }
a:hover, a:focus { color: var(--navy); }
img { max-width: 100%; height: auto; }
.container { width: min(1120px, calc(100% - 2rem)); margin-inline: auto; }
.screen-reader-text { position:absolute; left:-9999px; }
.screen-reader-text:focus { left:1rem; top:1rem; z-index:9999; background:#fff; padding:1rem; }

.site-header { background: var(--white); border-bottom: 1px solid #e8edf1; position: sticky; top: 0; z-index: 50; }
.header-inner { min-height: 82px; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; }
.site-branding { display:flex; align-items:center; gap:.9rem; text-decoration:none; color:var(--navy); font-weight:800; }
.custom-logo { max-height:58px; width:auto; }
.site-title { font-size:1.15rem; }
.menu-toggle { display:none; border:0; background:var(--navy); color:#fff; padding:.7rem .9rem; border-radius:10px; font-weight:700; }
.main-navigation ul { list-style:none; display:flex; gap:1.15rem; margin:0; padding:0; align-items:center; }
.main-navigation a { text-decoration:none; color:var(--navy); font-weight:700; }

.hero { background: linear-gradient(135deg, rgba(23,50,77,.96), rgba(47,111,143,.88)); color:#fff; padding:6rem 0; }
.hero-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:3rem; align-items:center; }
.eyebrow { text-transform:uppercase; letter-spacing:.14em; font-size:.82rem; font-weight:800; color:var(--gold); }
.hero h1 { font-size:clamp(2.6rem, 7vw, 5.4rem); line-height:1; margin:.5rem 0 1.2rem; }
.hero p { font-size:1.18rem; max-width:680px; }
.button-row { display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.7rem; }
.button { display:inline-block; text-decoration:none; font-weight:800; padding:.85rem 1.15rem; border-radius:999px; background:var(--gold); color:var(--navy); }
.button.secondary { background:#fff; }
.hero-card { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); padding:1.5rem; border-radius:var(--radius); backdrop-filter: blur(8px); }

.section { padding:4.5rem 0; }
.section.alt { background:var(--cream); }
.section-heading { display:flex; justify-content:space-between; gap:1rem; align-items:end; margin-bottom:1.8rem; }
.section h2 { color:var(--navy); font-size:clamp(2rem,4vw,3.2rem); margin:0; }
.grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.card { background:#fff; border-radius:var(--radius); padding:1.4rem; box-shadow:var(--shadow); border:1px solid #edf1f4; }
.card h3 { color:var(--navy); margin-top:0; }
.meta { color:#667582; font-size:.94rem; }
.quick-links { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.quick-link { display:block; background:var(--navy); color:#fff; text-decoration:none; padding:1.25rem; border-radius:14px; font-weight:800; min-height:110px; }
.quick-link span { display:block; color:var(--gold); margin-bottom:.35rem; }

.content-area { padding:4rem 0; }
.entry-title { color:var(--navy); font-size:clamp(2rem,5vw,4rem); }
.notice { border-left:5px solid var(--gold); padding:1rem 1.2rem; background:#fff9e9; border-radius:0 12px 12px 0; }

.site-footer { background:var(--navy); color:#fff; padding:3.5rem 0 1.5rem; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:2rem; }
.site-footer a { color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.18); margin-top:2rem; padding-top:1rem; font-size:.9rem; }

@media (max-width: 820px) {
  .hero-grid, .grid-3, .footer-grid { grid-template-columns:1fr; }
  .quick-links { grid-template-columns:repeat(2,1fr); }
  .menu-toggle { display:block; }
  .main-navigation { display:none; position:absolute; top:82px; left:0; right:0; background:#fff; padding:1rem; border-bottom:1px solid #ddd; }
  .main-navigation.is-open { display:block; }
  .main-navigation ul { flex-direction:column; align-items:flex-start; }
}
@media (max-width: 520px) { .quick-links { grid-template-columns:1fr; } }
