/* ══════════════════════════════════════════════════════════
   AUDITS SITE NAV — Shared across all pages
   Transparent on dark hero, dark bg on scroll or non-hero pages.
   No Tailwind dependency. Self-contained.
   ══════════════════════════════════════════════════════════ */

.audits-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 10000;
  padding: 20px 40px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: 'DM Sans', sans-serif;
  transition: background 0.35s ease, box-shadow 0.35s ease;
  background: transparent;
}

/* Dark state — on scroll or non-hero pages */
.audits-nav.scrolled {
  background: #1A1918;
  box-shadow: 0 1px 12px rgba(0, 0, 0, 0.4);
}

/* Logo */
.audits-nav-logo {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 26px;
  color: #F5F0EB;
  text-decoration: none;
  letter-spacing: -0.01em;
  transition: opacity 0.3s;
}

.audits-nav-logo:hover { opacity: 0.8; }

/* Desktop links */
.audits-nav-links {
  display: flex;
  align-items: center;
  gap: 36px;
}

.audits-nav-links a {
  font-family: 'DM Sans', sans-serif;
  font-size: 16px;
  color: #F5F0EB;
  text-decoration: none;
  opacity: 0.7;
  transition: opacity 0.3s;
}

.audits-nav-links a:hover { opacity: 1; }

/* CTA button */
.audits-nav-cta {
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #1A1918 !important;
  background: #C5A572;
  padding: 12px 24px;
  opacity: 1 !important;
  transition: opacity 0.3s;
}

.audits-nav-cta:hover { opacity: 0.85 !important; }

/* Mobile hamburger */
.audits-hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  cursor: pointer;
  padding: 4px;
  background: none;
  border: none;
}

.audits-hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: #F5F0EB;
  transition: transform 0.3s, opacity 0.3s;
}

.audits-hamburger.active span:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}

.audits-hamburger.active span:nth-child(2) {
  opacity: 0;
}

.audits-hamburger.active span:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

/* Mobile menu — luddite-mode sectioned. Top section is the primary
   CTAs (Home, Daylight, Pricing, Get Your Audit), then "Learn more"
   and "About" sections divided by labeled headers. The top section
   has bigger, more confident type so a luddite eye lands on it first.
   Top-aligned + scrollable so it fits on every phone size including
   iPhone SE. The nav bar covers the top 52px so we pad-top 72px. */
.audits-mobile-menu {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #1A1918;
  z-index: 9999;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0;
  padding: 72px 24px 32px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.audits-mobile-menu.open {
  display: flex;
}

/* Section wrapper — creates breathing room between Top / Learn / About */
.audits-mobile-section {
  display: flex;
  flex-direction: column;
  margin-bottom: 24px;
}

.audits-mobile-section.primary {
  margin-bottom: 32px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(245, 240, 235, 0.12);
}

/* Section labels — small uppercase mono headers. The Top section
   has no label (its prominence speaks for itself). */
.audits-mobile-section-label {
  font-family: 'DM Mono', monospace;
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(197, 165, 114, 0.8);
  padding: 6px 4px;
  margin-bottom: 4px;
}

.audits-mobile-menu a {
  font-family: 'DM Sans', sans-serif;
  font-size: 17px;
  color: #F5F0EB;
  text-decoration: none;
  opacity: 0.92;
  transition: opacity 0.3s;
  padding: 12px 4px;
  border-bottom: 1px solid rgba(245, 240, 235, 0.06);
  text-align: left;
}

/* Primary section gets bigger, more confident type — these are the
   ones the luddite eye should land on first. */
.audits-mobile-section.primary a {
  font-size: 19px;
  padding: 14px 4px;
  font-weight: 500;
}

/* Learn more + About sections get slightly smaller, more breathable */
.audits-mobile-section:not(.primary) a {
  font-size: 16px;
  padding: 11px 4px;
  opacity: 0.78;
}

.audits-mobile-menu a:last-child,
.audits-mobile-menu a.audits-nav-cta {
  border-bottom: none;
}

.audits-mobile-menu a:hover,
.audits-mobile-menu a:active { opacity: 1; }

.audits-mobile-menu .audits-nav-cta {
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 16px 28px !important;
  margin-top: 14px;
  text-align: center;
  background: #C5A572;
  color: #1A1918 !important;
  opacity: 1 !important;
  border: none !important;
  align-self: stretch;
  font-weight: 600;
}

@media (max-width: 768px) {
  .audits-nav { padding: 12px 16px; }
  .audits-nav-links { display: none; }
  .audits-hamburger { display: flex; }
}

/* Spacer — push page content below fixed nav */
.audits-nav-spacer {
  height: 72px;
}