/* ═══════════════════════════════════════════════════════
   SolarCanopy — Navigation
   ═══════════════════════════════════════════════════════ */

.sc-header { position: sticky; top: 0; z-index: 50; background: var(--sc-white); border-bottom: 1px solid var(--sc-slate-200); box-shadow: var(--sc-shadow-sm); }
.sc-header__inner { display: flex; justify-content: space-between; align-items: center; height: 5rem; }

/* ── Logo ────────────────────────────────────────────── */
.sc-header__logo { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.sc-header__logo .sc-icon { width: 2rem; height: 2rem; color: var(--sc-emerald-600); }
.sc-header__logo-text { font-weight: 700; font-size: 1.25rem; color: var(--sc-slate-900); letter-spacing: -.01em; }
.sc-header__logo-text span { color: var(--sc-emerald-600); }
.sc-header__logo img { height: 2.5rem; width: auto; }

/* ── Desktop Nav ─────────────────────────────────────── */
.sc-nav { display: none; align-items: center; gap: 2rem; }
@media (min-width: 768px) { .sc-nav { display: flex; } }
.sc-nav__list { display: flex; align-items: center; gap: 2rem; list-style: none; }
.sc-nav__link { color: var(--sc-slate-600); font-weight: 500; transition: color .2s ease; font-size: .9375rem; }
.sc-nav__link:hover, .sc-nav__link--active { color: var(--sc-emerald-600); }

/* ── Mobile Toggle ───────────────────────────────────── */
.sc-header__toggle { display: flex; align-items: center; justify-content: center; background: none; border: none; cursor: pointer; padding: .5rem; color: var(--sc-slate-600); }
.sc-header__toggle:hover { color: var(--sc-slate-900); }
.sc-header__toggle .sc-icon { width: 1.5rem; height: 1.5rem; }
@media (min-width: 768px) { .sc-header__toggle { display: none; } }

/* ── Mobile Menu ─────────────────────────────────────── */
.sc-mobile-menu { display: none; background: var(--sc-white); border-bottom: 1px solid var(--sc-slate-200); padding: .5rem 1rem 1.5rem; }
.sc-mobile-menu--open { display: block; }
.sc-mobile-menu__list { list-style: none; }
.sc-mobile-menu__link { display: block; padding: .75rem; font-size: 1rem; font-weight: 500; color: var(--sc-slate-700); border-radius: var(--sc-radius); transition: background .2s ease; }
.sc-mobile-menu__link:hover { background: var(--sc-slate-50); }
.sc-mobile-menu__cta { margin-top: 1rem; }