/*
Theme Name: Harnett NC Pre-K
Theme URI: https://prek.harnettsmartstart.org
Author: Harnett County Partnership for Children
Description: Friendly, accessible WordPress theme for the Harnett County NC Pre-K subdomain. Matches the look and feel of harnettsmartstart.org — sticky logo bar, photo/gradient hero with a clear call to action, program cards, an enrollment-steps strip, and a contact footer. Pairs with the Harnett NC Pre-K Manager plugin.
Version: 0.1.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: harnett-prek
Tags: education, custom-logo, custom-header, custom-menu, featured-images, two-columns, right-sidebar, full-width-template
*/

:root{
  --hcpc-blue:#1b6ca8;
  --hcpc-blue-dark:#155a8a;
  --hcpc-teal:#2a9d8f;
  --hcpc-green:#5a9e3f;
  --hcpc-orange:#f0883e;
  --hcpc-orange-dark:#e0762c;
  --hcpc-yellow:#f6c453;
  --ink:#21323d;
  --muted:#5f6b73;
  --bg:#f6f9fb;
  --card:#ffffff;
  --line:#e6ebee;
  --navy:#173042;
  --maxw:1140px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Open Sans",system-ui,-apple-system,sans-serif;color:var(--ink);background:var(--bg);line-height:1.6}
h1,h2,h3,h4,.brandfont{font-family:"Nunito",sans-serif}
a{color:var(--hcpc-blue);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 20px}

/* Accessibility */
.skip-link{position:absolute;left:-9999px;top:0;background:#fff;color:var(--hcpc-blue);padding:10px 16px;z-index:999;border-radius:0 0 8px 0}
.skip-link:focus{left:0}
a:focus,button:focus,input:focus,.btn:focus{outline:3px solid var(--hcpc-yellow);outline-offset:2px}

/* Buttons */
.btn{display:inline-block;background:var(--hcpc-orange);color:#fff;font-family:"Nunito";font-weight:800;padding:11px 22px;border-radius:30px;font-size:14px;line-height:1.2;box-shadow:0 4px 14px rgba(240,136,62,.35);border:0;cursor:pointer}
.btn:hover{background:var(--hcpc-orange-dark);color:#fff;text-decoration:none}
.btn.blue{background:var(--hcpc-blue);box-shadow:0 4px 14px rgba(27,108,168,.3)}
.btn.blue:hover{background:var(--hcpc-blue-dark)}
.btn.white{background:#fff;color:var(--hcpc-blue)}
.btn.white:hover{background:#eef4f8}
.btn.ghost{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.7)}
.btn.ghost:hover{background:rgba(255,255,255,.12)}

/* ---------- Top bar ---------- */
.site-topbar{background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.site-topbar .wrap{display:flex;align-items:center;justify-content:space-between;min-height:84px;gap:16px}
.site-brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.site-brand:hover{text-decoration:none}
.site-brand .mark{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,var(--hcpc-blue),var(--hcpc-teal));display:grid;place-items:center;color:#fff;font-weight:900;font-family:"Nunito";font-size:18px;flex:0 0 auto}
.site-brand .txt b{font-family:"Nunito";font-weight:900;color:var(--hcpc-blue);font-size:17px;display:block;line-height:1.05}
.site-brand .txt span{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.site-brand img.custom-logo{max-height:60px;width:auto}

.nav-primary ul{display:flex;align-items:center;gap:4px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.nav-primary a{color:var(--ink);font-weight:700;font-family:"Nunito";font-size:14px;padding:8px 12px;border-radius:8px;display:block}
.nav-primary a:hover{background:#eef4f8;color:var(--hcpc-blue);text-decoration:none}
.nav-primary .current-menu-item>a{color:var(--hcpc-blue);background:#eef4f8}
.nav-primary li.menu-item-has-children{position:relative}
.nav-primary ul ul{position:absolute;top:100%;left:0;display:none;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 30px rgba(20,40,60,.12);min-width:220px;padding:6px;z-index:60}
.nav-primary li:hover>ul,.nav-primary li:focus-within>ul{display:flex}
.header-actions{display:flex;align-items:center;gap:10px}

.menu-toggle{display:none;background:none;border:0;font-size:26px;color:var(--hcpc-blue);cursor:pointer;line-height:1}

/* ---------- Hero ---------- */
.hero{position:relative;overflow:hidden;color:#fff;background:linear-gradient(120deg,var(--hcpc-blue) 0%,var(--hcpc-teal) 100%)}
.hero.has-image{background-size:cover;background-position:center}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(120deg,rgba(21,90,138,.88),rgba(42,157,143,.78));z-index:1}
.hero::after{content:"";position:absolute;right:-80px;top:-80px;width:380px;height:380px;background:rgba(255,255,255,.08);border-radius:50%;z-index:1}
.hero::before{content:"";position:absolute;left:-60px;bottom:-120px;width:300px;height:300px;background:rgba(246,196,83,.18);border-radius:50%;z-index:1}
.hero .wrap{position:relative;z-index:2;padding:66px 20px 78px;max-width:780px}
.eyebrow{display:inline-block;background:rgba(255,255,255,.2);padding:6px 16px;border-radius:30px;font-family:"Nunito";font-weight:800;font-size:13px;letter-spacing:.05em;text-transform:uppercase;margin-bottom:18px}
.hero h1{font-size:46px;font-weight:900;line-height:1.08;margin:0 0 16px;text-transform:uppercase;letter-spacing:-.01em}
.hero p.lead{font-size:18px;max-width:580px;opacity:.96;margin:0 0 28px}
.hero .cta-row{display:flex;gap:14px;flex-wrap:wrap}

/* wave divider — the one signature flourish */
.wave-divider{display:block;width:100%;height:48px;margin-top:-1px;color:var(--bg)}
.wave-divider svg{display:block;width:100%;height:100%}

/* ---------- Sections ---------- */
.section{padding:64px 0}
.section.alt{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{text-align:center;max-width:640px;margin:0 auto 40px}
.section-head h2{font-size:30px;font-weight:900;text-transform:uppercase;color:var(--hcpc-blue);margin:0 0 8px}
.section-head p{color:var(--muted);margin:0}

/* Program cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.feature-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:30px 26px;box-shadow:0 6px 20px rgba(20,40,60,.04);transition:transform .18s,box-shadow .18s}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(20,40,60,.1)}
.feature-card .ico{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:26px;margin-bottom:16px;background:#e8f1f8}
.feature-card:nth-child(2) .ico{background:#e7f4ef}
.feature-card:nth-child(3) .ico{background:#fdf0e4}
.feature-card h3{font-size:20px;font-weight:800;margin:0 0 10px}
.feature-card p{color:var(--muted);font-size:15px;margin:0 0 18px}
.feature-card .more{font-family:"Nunito";font-weight:800;font-size:14px}
.feature-card .more:hover{text-decoration:none}
.feature-card .more::after{content:" \2192"}

/* Steps */
.steps-row{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;text-align:center}
.step .num{width:42px;height:42px;border-radius:50%;background:var(--hcpc-yellow);color:#5a4400;font-family:"Nunito";font-weight:900;display:grid;place-items:center;margin:0 auto 10px;font-size:17px}
.step b{display:block;font-family:"Nunito";font-size:15px;margin-bottom:4px}
.step span{font-size:13px;color:var(--muted)}

/* ---------- Interior page ---------- */
.page-hero{background:linear-gradient(120deg,var(--hcpc-blue),var(--hcpc-teal));color:#fff;padding:48px 0}
.page-hero h1{margin:0;font-size:36px;font-weight:900}
.page-body{padding:48px 0}
.page-body .entry-content{max-width:820px;margin:0 auto;font-size:16px}
.page-body .entry-content h2{color:var(--hcpc-blue);font-size:26px;margin-top:1.6em}
.page-body .entry-content h3{color:var(--ink);font-size:20px}
.page-body img{border-radius:12px}
.breadcrumbs{font-size:13px;color:rgba(255,255,255,.85);margin-bottom:8px}
.breadcrumbs a{color:#fff;text-decoration:underline}

/* ---------- Footer ---------- */
.site-footer{background:var(--navy);color:#cdd9e1;padding:48px 0 24px}
.site-footer .grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px}
.site-footer h4{font-family:"Nunito";color:#fff;font-size:15px;letter-spacing:.05em;text-transform:uppercase;margin:0 0 14px}
.site-footer a{color:#cdd9e1}
.site-footer a:hover{color:#fff}
.site-footer ul{list-style:none;font-size:14px;margin:0;padding:0}
.site-footer ul li{margin-bottom:8px}
.site-footer .footer-contact li{margin-bottom:6px}
.site-copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:32px;padding-top:18px;font-size:13px;color:#9fb0bc;text-align:center}

/* ---------- Responsive ---------- */
@media (max-width:920px){
  .cards{grid-template-columns:1fr}
  .steps-row{grid-template-columns:1fr 1fr}
  .site-footer .grid{grid-template-columns:1fr}
  .hero h1{font-size:34px}
  .menu-toggle{display:block}
  .nav-primary{display:none;position:absolute;top:84px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(20,40,60,.08)}
  .nav-primary.open{display:block}
  .nav-primary ul{flex-direction:column;align-items:stretch;padding:10px 14px;gap:2px}
  .nav-primary ul ul{position:static;box-shadow:none;border:0;padding-left:14px}
  .nav-primary li:hover>ul{display:none}
  .nav-primary li.open>ul{display:flex}
}

@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto !important;transition:none !important}
}
