/* ============================================================
   SISIVI HAWIHA — DESIGN SYSTEM
   Luminous Surfaces · Farmers Market Operations Blog
   ============================================================ */


:root {
  
  --clr-bg: #f7f5f0;
  --clr-bg-alt: #faf9f6;
  --clr-surface: #ffffff;
  --clr-dark: #1a1810;
  --clr-dark-alt: #242018;
  --clr-text: #2c2a24;
  --clr-text-muted: #6b6860;
  --clr-text-light: #9a9890;

  
  --clr-primary: #b8860b;       
  --clr-primary-light: #d4a017; 
  --clr-primary-glow: rgba(184,134,11,0.28);
  --clr-secondary: #2d4a2d;     
  --clr-secondary-light: #3d6b3d;
  --clr-secondary-glow: rgba(45,74,45,0.22);
  --clr-accent: #e8c547;        
  --clr-accent-glow: rgba(232,197,71,0.35);
  --clr-accent-soft: rgba(232,197,71,0.12);

  
  --clr-dark-section: #141210;
  --clr-dark-surface: #1e1c17;
  --clr-dark-border: rgba(232,197,71,0.15);

  
  --font-heading: 'Playfair Display', Georgia, serif;
  --font-body: 'Plus Jakarta Sans', system-ui, sans-serif;

  
  --text-xs: clamp(0.75rem, 1.5vw, 0.8125rem);
  --text-sm: clamp(0.875rem, 1.8vw, 0.9375rem);
  --text-base: clamp(1rem, 2vw, 1.0625rem);
  --text-md: clamp(1.0625rem, 2.2vw, 1.1875rem);
  --text-lg: clamp(1.125rem, 2.5vw, 1.375rem);
  --text-xl: clamp(1.25rem, 3vw, 1.625rem);
  --text-2xl: clamp(1.5rem, 4vw, 2rem);
  --text-3xl: clamp(1.875rem, 5vw, 2.75rem);
  --text-4xl: clamp(2.25rem, 6vw, 3.5rem);
  --text-hero: clamp(2.75rem, 8vw, 5rem);

  
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;
  --sp-12: 3rem;
  --sp-16: 4rem;
  --sp-20: 5rem;
  --sp-24: 6rem;
  --sp-32: 8rem;

  
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 22px;
  --radius-2xl: 32px;
  --radius-full: 9999px;

  
  --shadow-xs: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-sm: 0 2px 8px rgba(0,0,0,0.08), 0 1px 3px rgba(0,0,0,0.05);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.06);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.12), 0 4px 12px rgba(0,0,0,0.08);
  --shadow-xl: 0 16px 48px rgba(0,0,0,0.15), 0 8px 24px rgba(0,0,0,0.10);

  
  --glow-primary: 0 0 24px var(--clr-primary-glow), 0 4px 16px rgba(0,0,0,0.10);
  --glow-accent: 0 0 32px var(--clr-accent-glow), 0 4px 16px rgba(0,0,0,0.08);
  --glow-secondary: 0 0 24px var(--clr-secondary-glow), 0 4px 16px rgba(0,0,0,0.10);

  
  --trans-fast: 0.15s ease;
  --trans-base: 0.25s ease;
  --trans-slow: 0.4s ease;

  
  --nav-height: 68px;
}


*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; font-size: 16px; overflow-x: hidden; }

body {
  font-family: var(--font-body);
  font-size: var(--text-base);
  color: var(--clr-text);
  background: var(--clr-bg);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

main { flex: 1; }

img { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; transition: color var(--trans-base); }

ul { list-style: none; }

address { font-style: normal; }


.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--sp-6);
}


.sectionHeader {
  text-align: center;
  margin-bottom: var(--sp-12);
}

.sectionHeader_label {
  display: inline-block;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--clr-primary);
  background: var(--clr-accent-soft);
  border: 1px solid rgba(184,134,11,0.2);
  padding: var(--sp-1) var(--sp-4);
  border-radius: var(--radius-full);
  margin-bottom: var(--sp-4);
}

.sectionHeader_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  line-height: 1.2;
  margin-bottom: var(--sp-4);
}

.sectionHeader_sub {
  font-size: var(--text-md);
  color: var(--clr-text-muted);
  max-width: 640px;
  margin: 0 auto;
  line-height: 1.7;
}


.btn {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  padding: var(--sp-3) var(--sp-6);
  border-radius: var(--radius-full);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all var(--trans-base);
  white-space: nowrap;
}

.btnPrimary {
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-primary-light));
  color: #fff;
  box-shadow: var(--glow-primary);
}

.btnPrimary:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 36px var(--clr-primary-glow), 0 8px 24px rgba(0,0,0,0.15);
  color: #fff;
}

.btnPrimary:active { transform: translateY(0); }

.btnGhost {
  background: transparent;
  color: var(--clr-text);
  border: 1.5px solid rgba(44,42,36,0.25);
}

.btnGhost:hover {
  background: var(--clr-surface);
  border-color: var(--clr-primary);
  color: var(--clr-primary);
  box-shadow: var(--shadow-sm);
}

.btnOutlineLight {
  background: transparent;
  color: var(--clr-accent);
  border: 1.5px solid rgba(232,197,71,0.4);
}

.btnOutlineLight:hover {
  background: rgba(232,197,71,0.1);
  border-color: var(--clr-accent);
  box-shadow: var(--glow-accent);
}


.siteHeader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  background: var(--clr-dark);
  height: var(--nav-height);
  transition: box-shadow var(--trans-slow);
}

.siteHeader_inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--sp-6);
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-8);
}

.siteHeader_logo {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  flex-shrink: 0;
  text-decoration: none;
}

.siteHeader_logoImg { width: 32px; height: 32px; }

.siteHeader_logoText {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--clr-accent);
  letter-spacing: -0.01em;
}

.siteHeader_nav {
  display: flex;
  align-items: center;
  gap: var(--sp-1);
}

.siteHeader_navLink {
  font-size: var(--text-sm);
  font-weight: 500;
  color: rgba(255,255,255,0.75);
  padding: var(--sp-2) var(--sp-4);
  border-radius: var(--radius-md);
  transition: all var(--trans-base);
  position: relative;
}

.siteHeader_navLink:hover,
.siteHeader_navLink.isActive {
  color: var(--clr-accent);
  background: rgba(232,197,71,0.08);
}

.siteHeader_navCta {
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-primary-light));
  color: #fff !important;
  padding: var(--sp-2) var(--sp-5);
  border-radius: var(--radius-full);
  box-shadow: var(--glow-primary);
}

.siteHeader_navCta:hover {
  background: rgba(232,197,71,0.08) !important;
  transform: translateY(-1px);
  box-shadow: 0 0 28px var(--clr-primary-glow), 0 4px 12px rgba(0,0,0,0.2);
  color: var(--clr-accent) !important;
}

.siteHeader_hamburger {
  display: none;
  flex-direction: column;
  gap: 5px;
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--sp-2);
  border-radius: var(--radius-md);
}

.siteHeader_hamburger span {
  display: block;
  width: 22px;
  height: 2px;
  background: rgba(255,255,255,0.8);
  border-radius: var(--radius-full);
  transition: all var(--trans-base);
}


.mobileTabBar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: var(--clr-dark);
  border-top: 1px solid rgba(232,197,71,0.15);
  padding: var(--sp-2) 0 max(var(--sp-2), env(safe-area-inset-bottom));
  box-shadow: 0 -4px 24px rgba(0,0,0,0.3);
}

.mobileTabBar_item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: var(--sp-2) var(--sp-3);
  color: rgba(255,255,255,0.5);
  font-size: 10px;
  font-weight: 500;
  transition: all var(--trans-base);
  min-width: 44px;
  border-radius: var(--radius-md);
}

.mobileTabBar_item i { font-size: 18px; }

.mobileTabBar_item.isActive,
.mobileTabBar_item:hover {
  color: var(--clr-accent);
}


.mainHero {
  min-height: 100vh;
  padding-top: var(--nav-height);
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  position: relative;
  overflow: hidden;
  background: var(--clr-dark-section);
}

.mainHero_bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(45,74,45,0.35) 0%, transparent 60%),
    radial-gradient(ellipse at 80% 20%, rgba(184,134,11,0.2) 0%, transparent 50%),
    radial-gradient(ellipse at 60% 80%, rgba(232,197,71,0.08) 0%, transparent 40%);
  pointer-events: none;
}

.mainHero_particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.mainHero_particle {
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--clr-accent);
  opacity: 0.4;
  animation: particleFloat 8s infinite ease-in-out;
}

.mainHero_particle:nth-child(1) { top: 20%; left: 15%; animation-delay: 0s; }
.mainHero_particle:nth-child(2) { top: 60%; left: 8%; animation-delay: 1.5s; width: 2px; height: 2px; }
.mainHero_particle:nth-child(3) { top: 35%; left: 45%; animation-delay: 3s; opacity: 0.25; }
.mainHero_particle:nth-child(4) { top: 75%; left: 30%; animation-delay: 4.5s; width: 4px; height: 4px; opacity: 0.3; }
.mainHero_particle:nth-child(5) { top: 15%; left: 55%; animation-delay: 6s; }

@keyframes particleFloat {
  0%, 100% { transform: translateY(0) scale(1); opacity: 0.4; }
  50% { transform: translateY(-20px) scale(1.3); opacity: 0.7; }
}

.mainHero_content {
  padding: var(--sp-24) var(--sp-16) var(--sp-24) var(--sp-16);
  position: relative;
  z-index: 2;
}

.mainHero_eyebrow {
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--clr-accent);
  margin-bottom: var(--sp-5);
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}

.mainHero_eyebrow::before {
  content: '';
  display: block;
  width: 28px;
  height: 1px;
  background: var(--clr-accent);
}

.mainHero_title {
  font-family: var(--font-heading);
  font-size: var(--text-hero);
  font-weight: 800;
  line-height: 1.08;
  color: rgba(255,255,255,0.92);
  margin-bottom: var(--sp-6);
}

.mainHero_titleGradient {
  background: linear-gradient(135deg, var(--clr-accent) 0%, var(--clr-primary-light) 50%, #f0d060 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
}

.mainHero_subtitle {
  font-size: var(--text-md);
  color: rgba(255,255,255,0.62);
  max-width: 480px;
  line-height: 1.7;
  margin-bottom: var(--sp-8);
}

.mainHero_actions {
  display: flex;
  gap: var(--sp-4);
  flex-wrap: wrap;
}

.mainHero_imageWrap {
  position: relative;
  height: 100%;
  min-height: 500px;
  overflow: hidden;
}

.mainHero_image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 0.75;
}

.mainHero_imageGlow {
  position: absolute;
  inset: 0;
  background: linear-gradient(to right, var(--clr-dark-section) 0%, transparent 30%, transparent 70%, var(--clr-dark-section) 100%),
              linear-gradient(to bottom, var(--clr-dark-section) 0%, transparent 15%);
  pointer-events: none;
}


.topicsGrid {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.topicsGrid_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-6);
}

.topicCard {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-8);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-sm);
  transition: all var(--trans-base);
  position: relative;
  overflow: hidden;
}

.topicCard::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--clr-primary), var(--clr-accent));
  opacity: 0;
  transition: opacity var(--trans-base);
}

.topicCard:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg), 0 0 32px var(--clr-primary-glow);
  border-color: rgba(184,134,11,0.25);
}

.topicCard:hover::before { opacity: 1; }

.topicCard--accent {
  background: linear-gradient(145deg, var(--clr-secondary), #1e3a1e);
  border-color: rgba(45,74,45,0.4);
}

.topicCard--accent .topicCard_title,
.topicCard--accent .topicCard_body,
.topicCard--accent .topicCard_link { color: rgba(255,255,255,0.9); }

.topicCard--accent .topicCard_icon { color: var(--clr-accent); }

.topicCard--accent:hover {
  box-shadow: var(--shadow-lg), 0 0 32px var(--clr-secondary-glow);
  border-color: rgba(45,74,45,0.6);
}

.topicCard_iconWrap {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-lg);
  background: var(--clr-accent-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--sp-5);
  transition: all var(--trans-base);
}

.topicCard:hover .topicCard_iconWrap {
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-primary-light));
  box-shadow: var(--glow-primary);
}

.topicCard--accent .topicCard_iconWrap {
  background: rgba(232,197,71,0.12);
}

.topicCard_icon {
  font-size: 1.25rem;
  color: var(--clr-primary);
}

.topicCard:hover .topicCard_icon { color: #fff; }

.topicCard_title {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-3);
  line-height: 1.3;
}

.topicCard_body {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.7;
  margin-bottom: var(--sp-5);
}

.topicCard_link {
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--clr-primary);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  transition: all var(--trans-base);
}

.topicCard_link:hover { gap: var(--sp-3); color: var(--clr-primary-light); }


.featureEditorial {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.featureEditorial_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}

.featureEditorial_imageWrap {
  position: relative;
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-xl), 0 0 48px var(--clr-primary-glow);
}

.featureEditorial_image {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  transition: transform var(--trans-slow);
}

.featureEditorial_imageWrap:hover .featureEditorial_image { transform: scale(1.03); }

.featureEditorial_imageAccent {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(184,134,11,0.15) 0%, transparent 60%);
  pointer-events: none;
}

.featureEditorial_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.featureEditorial_body {
  font-size: var(--text-base);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-5);
}

.featureEditorial_pullQuote {
  border-left: 3px solid var(--clr-accent);
  padding: var(--sp-4) var(--sp-6);
  margin: var(--sp-6) 0;
  background: var(--clr-accent-soft);
  border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}

.featureEditorial_pullQuoteText {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-style: italic;
  color: var(--clr-dark);
  line-height: 1.5;
}


.permitsBand {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
  position: relative;
  overflow: hidden;
}

.permitsBand::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 0% 50%, rgba(45,74,45,0.4) 0%, transparent 55%),
    radial-gradient(ellipse at 100% 30%, rgba(184,134,11,0.15) 0%, transparent 50%);
  pointer-events: none;
}

.permitsBand_inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
  position: relative;
  z-index: 1;
}

.permitsBand_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: rgba(255,255,255,0.92);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.permitsBand_body {
  font-size: var(--text-base);
  color: rgba(255,255,255,0.6);
  line-height: 1.8;
  margin-bottom: var(--sp-5);
}

.permitsBand_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  box-shadow: var(--shadow-xl), 0 0 40px rgba(45,74,45,0.3);
  border: 1px solid var(--clr-dark-border);
}


.displaySection {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.displaySection_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: start;
  margin-top: var(--sp-12);
}

.displaySection_imageWrap {
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-xl), 0 0 48px var(--clr-secondary-glow);
  position: sticky;
  top: calc(var(--nav-height) + var(--sp-8));
}

.displaySection_image {
  width: 100%;
  aspect-ratio: 3/4;
  object-fit: cover;
}

.displaySection_item {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--sp-5);
  padding: var(--sp-6);
  border-radius: var(--radius-xl);
  background: var(--clr-surface);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-xs);
  transition: all var(--trans-base);
  margin-bottom: var(--sp-4);
}

.displaySection_item:hover {
  box-shadow: var(--shadow-md), 0 0 20px var(--clr-primary-glow);
  border-color: rgba(184,134,11,0.2);
  transform: translateX(4px);
}

.displaySection_itemNum {
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: 800;
  color: var(--clr-accent);
  line-height: 1;
  opacity: 0.7;
  padding-top: var(--sp-1);
}

.displaySection_itemText h3 {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-2);
}

.displaySection_itemText p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.7;
}


.paymentSection {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
  position: relative;
  overflow: hidden;
}

.paymentSection::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 70% 50%, rgba(184,134,11,0.12) 0%, transparent 60%);
  pointer-events: none;
}

.paymentSection_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
  position: relative;
  z-index: 1;
}

.paymentSection_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: rgba(255,255,255,0.92);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.paymentSection_body {
  font-size: var(--text-base);
  color: rgba(255,255,255,0.6);
  line-height: 1.8;
  margin-bottom: var(--sp-6);
}

.paymentSection_highlights {
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}

.paymentSection_highlight {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.7);
  padding: var(--sp-3) var(--sp-4);
  background: rgba(255,255,255,0.04);
  border-radius: var(--radius-lg);
  border: 1px solid rgba(255,255,255,0.06);
  transition: all var(--trans-base);
}

.paymentSection_highlight:hover {
  background: rgba(232,197,71,0.08);
  border-color: rgba(232,197,71,0.2);
  color: rgba(255,255,255,0.9);
}

.paymentSection_highlightIcon {
  color: var(--clr-accent);
  font-size: 1rem;
  flex-shrink: 0;
}

.paymentSection_imageCol {
  position: relative;
}

.paymentSection_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  border: 1px solid var(--clr-dark-border);
  box-shadow: var(--shadow-xl);
}

.paymentSection_imageGlow {
  position: absolute;
  bottom: -20px;
  left: 10%;
  right: 10%;
  height: 60px;
  background: var(--clr-accent);
  filter: blur(30px);
  opacity: 0.15;
  border-radius: 50%;
  pointer-events: none;
}


.trackingSection {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.trackingSection_cards {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--sp-5);
  margin-top: var(--sp-12);
}

.trackingCard {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-sm);
  transition: all var(--trans-base);
  position: relative;
  overflow: hidden;
}

.trackingCard::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--clr-secondary), var(--clr-accent));
  transform: scaleX(0);
  transition: transform var(--trans-base);
  transform-origin: left;
}

.trackingCard:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-lg), 0 0 28px var(--clr-secondary-glow);
  border-color: rgba(45,74,45,0.2);
}

.trackingCard:hover::after { transform: scaleX(1); }

.trackingCard_icon {
  font-size: 1.5rem;
  color: var(--clr-secondary);
  margin-bottom: var(--sp-4);
  display: block;
  transition: all var(--trans-base);
}

.trackingCard:hover .trackingCard_icon {
  color: var(--clr-primary);
  transform: scale(1.1);
}

.trackingCard_title {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-3);
}

.trackingCard_body {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.7;
}


.editorialFeature2 {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.editorialFeature2_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}

.editorialFeature2_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.editorialFeature2_body {
  font-size: var(--text-base);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-5);
}

.editorialFeature2_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  box-shadow: var(--shadow-xl), 0 0 40px var(--clr-secondary-glow);
}


.faqSection {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
}

.faqSection .sectionHeader_title { color: rgba(255,255,255,0.92); }
.faqSection .sectionHeader_label { color: var(--clr-accent); }

.faqList {
  max-width: 760px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: var(--sp-3);
}

.faqItem {
  background: var(--clr-dark-surface);
  border: 1px solid var(--clr-dark-border);
  border-radius: var(--radius-xl);
  overflow: hidden;
  transition: all var(--trans-base);
}

.faqItem:hover {
  border-color: rgba(232,197,71,0.3);
  box-shadow: 0 0 20px rgba(232,197,71,0.08);
}

.faqItem.isOpen {
  border-color: rgba(232,197,71,0.35);
  box-shadow: 0 0 28px rgba(232,197,71,0.1);
}

.faqItem_question {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  padding: var(--sp-5) var(--sp-6);
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-body);
  font-size: var(--text-base);
  font-weight: 600;
  color: rgba(255,255,255,0.85);
  transition: all var(--trans-base);
  min-height: 44px;
}

.faqItem_question:hover { color: var(--clr-accent); }

.faqItem_icon {
  font-size: 0.875rem;
  color: var(--clr-accent);
  flex-shrink: 0;
  transition: transform var(--trans-base);
}

.faqItem.isOpen .faqItem_icon { transform: rotate(180deg); }

.faqItem_answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, padding 0.25s ease;
}

.faqItem_answer p {
  padding: 0 var(--sp-6) var(--sp-5);
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.6);
  line-height: 1.8;
}

.faqItem.isOpen .faqItem_answer { max-height: 400px; }


.aboutPreview {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.aboutPreview_inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}

.aboutPreview_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.aboutPreview_body {
  font-size: var(--text-base);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-5);
}

.aboutPreview_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  box-shadow: var(--shadow-xl), 0 0 40px var(--clr-primary-glow);
}


.pageHero {
  padding-top: var(--nav-height);
  background: var(--clr-dark-section);
  position: relative;
  overflow: hidden;
}

.pageHero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 30% 60%, rgba(45,74,45,0.3) 0%, transparent 60%),
              radial-gradient(ellipse at 80% 20%, rgba(184,134,11,0.15) 0%, transparent 50%);
  pointer-events: none;
}

.pageHero--medium { padding-bottom: var(--sp-20); }

.pageHero_content {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--sp-20) var(--sp-6) 0;
  position: relative;
  z-index: 1;
}

.pageHero_title {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  font-weight: 800;
  color: rgba(255,255,255,0.92);
  line-height: 1.1;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.pageHero_sub {
  font-size: var(--text-md);
  color: rgba(255,255,255,0.6);
  max-width: 600px;
  line-height: 1.7;
}


.benefitsIntro,
.irregularIntro {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.benefitsIntro_grid,
.irregularIntro_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}

.benefitsIntro_title,
.irregularIntro_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-5);
  line-height: 1.2;
}

.benefitsIntro_textCol p,
.irregularIntro_textCol p {
  font-size: var(--text-base);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-4);
}

.benefitsIntro_image,
.irregularIntro_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  box-shadow: var(--shadow-xl), 0 0 40px var(--clr-primary-glow);
}


.audienceCards {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.audienceCards_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-6);
  margin-top: var(--sp-12);
}

.audienceCard {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-8);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-sm);
  transition: all var(--trans-base);
}

.audienceCard:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg), 0 0 28px var(--clr-primary-glow);
  border-color: rgba(184,134,11,0.25);
}

.audienceCard--highlight {
  background: linear-gradient(145deg, var(--clr-secondary), #1e3a1e);
  border-color: rgba(45,74,45,0.4);
}

.audienceCard--highlight .audienceCard_title,
.audienceCard--highlight .audienceCard_body,
.audienceCard--highlight .audienceCard_list li { color: rgba(255,255,255,0.85); }

.audienceCard--highlight .audienceCard_icon { color: var(--clr-accent); }

.audienceCard_header {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
}

.audienceCard_icon {
  font-size: 1.5rem;
  color: var(--clr-primary);
}

.audienceCard_title {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--clr-dark);
}

.audienceCard_body {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.7;
  margin-bottom: var(--sp-5);
}

.audienceCard_list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
}

.audienceCard_list li {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  padding-left: var(--sp-5);
  position: relative;
  line-height: 1.6;
}

.audienceCard_list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--clr-accent);
}


.permitsDeep {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
}

.permitsDeep .sectionHeader_title { color: rgba(255,255,255,0.92); }

.permitsDeep_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-5);
  margin-top: var(--sp-12);
}

.permitsDeep_card {
  background: var(--clr-dark-surface);
  border: 1px solid var(--clr-dark-border);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  transition: all var(--trans-base);
}

.permitsDeep_card:hover {
  border-color: rgba(232,197,71,0.3);
  box-shadow: 0 0 28px rgba(232,197,71,0.1);
  transform: translateY(-3px);
}

.permitsDeep_cardHeader {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
}

.permitsDeep_cardHeader i {
  font-size: 1.25rem;
  color: var(--clr-accent);
}

.permitsDeep_cardHeader h3 {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: rgba(255,255,255,0.85);
}

.permitsDeep_card p {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.75;
}


.calloutBand {
  padding: var(--sp-20) 0;
  background: linear-gradient(135deg, var(--clr-secondary) 0%, #1e3a1e 100%);
}

.calloutBand_inner {
  text-align: center;
  max-width: 640px;
  margin: 0 auto;
}

.calloutBand_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: rgba(255,255,255,0.92);
  margin-bottom: var(--sp-5);
}

.calloutBand_body {
  font-size: var(--text-base);
  color: rgba(255,255,255,0.65);
  line-height: 1.8;
  margin-bottom: var(--sp-8);
}


.beforeAfterSection {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.baScenario {
  margin-bottom: var(--sp-16);
  padding-bottom: var(--sp-16);
  border-bottom: 1px solid rgba(184,134,11,0.1);
}

.baScenario:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.baScenario_label {
  margin-bottom: var(--sp-8);
}

.baScenario_labelTag {
  display: inline-block;
  font-size: var(--text-xs);
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--clr-primary);
  margin-bottom: var(--sp-3);
}

.baScenario_title {
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: 700;
  color: var(--clr-dark);
}

.baScenario_grid {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: var(--sp-6);
  align-items: start;
}

.baScenario_col {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-sm);
}

.baScenario_col--before {
  border-color: rgba(200,50,50,0.15);
}

.baScenario_col--after {
  border-color: rgba(45,74,45,0.2);
  box-shadow: var(--shadow-sm), 0 0 20px rgba(45,74,45,0.1);
}

.baScenario_colHeader {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
  font-weight: 700;
  font-size: var(--text-sm);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

.baScenario_col--before .baScenario_colHeader { color: #c0392b; }
.baScenario_col--after .baScenario_colHeader { color: var(--clr-secondary); }

.baScenario_col p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.75;
  margin-bottom: var(--sp-4);
}

.baScenario_divider {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: var(--sp-10);
  color: var(--clr-primary);
  font-size: 1.25rem;
}

.baScenario_indicator {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--text-xs);
  font-weight: 600;
  color: #c0392b;
  padding: var(--sp-2) var(--sp-3);
  background: rgba(200,50,50,0.06);
  border-radius: var(--radius-md);
  margin-top: var(--sp-2);
}

.baScenario_indicator--positive {
  color: var(--clr-secondary);
  background: rgba(45,74,45,0.08);
}


.pricingFramework {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
}

.pricingFramework .sectionHeader_title { color: rgba(255,255,255,0.92); }

.pricingFramework_steps {
  max-width: 760px;
  margin: var(--sp-12) auto 0;
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
}

.pricingStep {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--sp-5);
  background: var(--clr-dark-surface);
  border: 1px solid var(--clr-dark-border);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  transition: all var(--trans-base);
}

.pricingStep:hover {
  border-color: rgba(232,197,71,0.3);
  box-shadow: 0 0 20px rgba(232,197,71,0.08);
}

.pricingStep_num {
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: 800;
  color: var(--clr-accent);
  opacity: 0.7;
  line-height: 1;
}

.pricingStep_title {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  margin-bottom: var(--sp-2);
}

.pricingStep_content p {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.75;
}


.displayDeep {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.displayDeep_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}

.displayDeep_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  box-shadow: var(--shadow-xl), 0 0 40px var(--clr-secondary-glow);
}

.displayDeep_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.displayDeep_textCol p {
  font-size: var(--text-base);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-5);
}


.seasonalSection {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.seasonalSection_grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-6);
  margin-top: var(--sp-12);
}

.seasonalCard {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-sm);
  transition: all var(--trans-base);
}

.seasonalCard:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg), 0 0 24px var(--clr-primary-glow);
}

.seasonalCard--peak {
  background: linear-gradient(145deg, var(--clr-secondary), #1e3a1e);
  border-color: rgba(45,74,45,0.4);
}

.seasonalCard_season {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--clr-primary);
  margin-bottom: var(--sp-4);
}

.seasonalCard--peak .seasonalCard_season { color: var(--clr-accent); }

.seasonalCard_body p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.75;
  margin-bottom: var(--sp-4);
}

.seasonalCard--peak .seasonalCard_body p { color: rgba(255,255,255,0.65); }


.paymentDeep {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
}

.paymentDeep .sectionHeader_title { color: rgba(255,255,255,0.92); }

.paymentDeep_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-5);
  margin-top: var(--sp-12);
}

.paymentOption {
  background: var(--clr-dark-surface);
  border: 1px solid var(--clr-dark-border);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  transition: all var(--trans-base);
}

.paymentOption:hover {
  border-color: rgba(232,197,71,0.3);
  box-shadow: 0 0 24px rgba(232,197,71,0.1);
  transform: translateY(-2px);
}

.paymentOption_header {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
}

.paymentOption_icon {
  font-size: 1.5rem;
  color: var(--clr-accent);
}

.paymentOption_header h3 {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: rgba(255,255,255,0.85);
}

.paymentOption p {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.75;
  margin-bottom: var(--sp-4);
}

.paymentOption_note {
  display: flex;
  align-items: flex-start;
  gap: var(--sp-2);
  font-size: var(--text-xs);
  color: var(--clr-accent);
  background: rgba(232,197,71,0.06);
  border-radius: var(--radius-md);
  padding: var(--sp-2) var(--sp-3);
  border: 1px solid rgba(232,197,71,0.12);
}


.trackingDeep {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.trackingDeep_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-16);
  align-items: center;
}

.trackingDeep_title {
  font-family: var(--font-heading);
  font-size: var(--text-3xl);
  font-weight: 700;
  color: var(--clr-dark);
  line-height: 1.2;
  margin-bottom: var(--sp-5);
  margin-top: var(--sp-4);
}

.trackingDeep_textCol p {
  font-size: var(--text-base);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-5);
}

.trackingDeep_image {
  border-radius: var(--radius-2xl);
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  box-shadow: var(--shadow-xl), 0 0 40px var(--clr-primary-glow);
}


.variabilitySection {
  padding: var(--sp-24) 0;
  background: var(--clr-dark-section);
}

.variabilitySection .sectionHeader_title { color: rgba(255,255,255,0.92); }

.variabilitySection_grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-5);
  margin-top: var(--sp-12);
}

.variabilityCard {
  background: var(--clr-dark-surface);
  border: 1px solid var(--clr-dark-border);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  transition: all var(--trans-base);
}

.variabilityCard:hover {
  border-color: rgba(232,197,71,0.3);
  box-shadow: 0 0 24px rgba(232,197,71,0.08);
  transform: translateY(-2px);
}

.variabilityCard_icon {
  font-size: 1.5rem;
  color: var(--clr-accent);
  display: block;
  margin-bottom: var(--sp-4);
  transition: transform var(--trans-base);
}

.variabilityCard:hover .variabilityCard_icon { transform: scale(1.1); }

.variabilityCard_title {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: rgba(255,255,255,0.85);
  margin-bottom: var(--sp-3);
}

.variabilityCard p {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.55);
  line-height: 1.75;
}


.contactSection {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.contactSection_grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: var(--sp-10);
  align-items: start;
}

.contactForm_wrap {
  background: var(--clr-surface);
  border-radius: var(--radius-2xl);
  padding: var(--sp-8);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-lg), 0 0 40px var(--clr-primary-glow);
}

.contactForm_title {
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-2);
}

.contactForm_sub {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  margin-bottom: var(--sp-6);
}

.contactForm_row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-4);
}

.contactForm_field {
  margin-bottom: var(--sp-4);
}

.contactForm_label {
  display: block;
  font-size: var(--text-xs);
  font-weight: 600;
  color: var(--clr-text);
  margin-bottom: var(--sp-2);
  letter-spacing: 0.04em;
}

.contactForm_req { color: var(--clr-primary); }

.contactForm_input,
.contactForm_textarea {
  width: 100%;
  padding: var(--sp-3) var(--sp-4);
  background: var(--clr-bg);
  border: 1.5px solid rgba(184,134,11,0.15);
  border-radius: var(--radius-lg);
  font-family: var(--font-body);
  font-size: var(--text-sm);
  color: var(--clr-text);
  transition: all var(--trans-base);
  outline: none;
  resize: vertical;
}

.contactForm_input:focus,
.contactForm_textarea:focus {
  border-color: var(--clr-primary);
  box-shadow: 0 0 0 3px var(--clr-primary-glow);
  background: var(--clr-surface);
}

.contactForm_textarea { min-height: 90px; }

.contactForm_footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  flex-wrap: wrap;
  margin-top: var(--sp-2);
}

.contactForm_privacyLabel {
  display: flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--text-xs);
  color: var(--clr-text-muted);
  cursor: pointer;
}

.contactForm_checkbox {
  width: 16px;
  height: 16px;
  accent-color: var(--clr-primary);
  cursor: pointer;
  flex-shrink: 0;
}

.contactForm_privacyLink {
  color: var(--clr-primary);
  text-decoration: underline;
}

.contactInfo_card {
  background: var(--clr-surface);
  border-radius: var(--radius-2xl);
  padding: var(--sp-8);
  border: 1px solid rgba(184,134,11,0.1);
  box-shadow: var(--shadow-md);
}

.contactInfo_title {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-6);
}

.contactInfo_item {
  display: flex;
  gap: var(--sp-4);
  margin-bottom: var(--sp-5);
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.6;
}

.contactInfo_item strong {
  display: block;
  color: var(--clr-text);
  font-weight: 600;
  margin-bottom: var(--sp-1);
}

.contactInfo_icon {
  color: var(--clr-primary);
  font-size: 1rem;
  flex-shrink: 0;
  margin-top: 3px;
}

.contactInfo_item a {
  color: var(--clr-text-muted);
  transition: color var(--trans-base);
}

.contactInfo_item a:hover { color: var(--clr-primary); }


.contactTimeline {
  padding: var(--sp-24) 0;
  background: var(--clr-bg-alt);
}

.timeline {
  max-width: 680px;
  margin: var(--sp-12) auto 0;
  position: relative;
}

.timeline::before {
  content: '';
  position: absolute;
  left: 24px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, var(--clr-primary), var(--clr-accent), transparent);
}

.timeline_item {
  display: grid;
  grid-template-columns: 48px 1fr;
  gap: var(--sp-5);
  margin-bottom: var(--sp-8);
  position: relative;
}

.timeline_dot {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-primary-light));
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1rem;
  flex-shrink: 0;
  box-shadow: var(--glow-primary);
  position: relative;
  z-index: 1;
}

.timeline_title {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-2);
  padding-top: var(--sp-2);
}

.timeline_body {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.75;
}


.mapSection {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.mapSection_title {
  font-family: var(--font-heading);
  font-size: var(--text-2xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-6);
}

.mapSection_mapWrap {
  border-radius: var(--radius-2xl);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
  border: 1px solid rgba(184,134,11,0.1);
}

.mapSection_iframe { display: block; }


.thanksPage main { flex: 1; }

.thanksMain {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - var(--nav-height) - 200px);
  padding: var(--sp-20) var(--sp-6);
}

.thanksContent {
  text-align: center;
}

.thanksDot {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-accent));
  margin: 0 auto var(--sp-8);
  box-shadow: 0 0 48px var(--clr-accent-glow);
  animation: dotPulse 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
  transform: scale(0);
}

.thanksTitle {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  font-weight: 800;
  color: var(--clr-dark);
  margin-bottom: var(--sp-8);
  opacity: 0;
  animation: fadeInUp 0.6s ease 0.7s forwards;
}

.thanksLink {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--clr-primary);
  opacity: 0;
  animation: fadeInUp 0.5s ease 1.2s forwards;
  transition: gap var(--trans-base), color var(--trans-base);
}

.thanksLink:hover {
  gap: var(--sp-3);
  color: var(--clr-primary-light);
}

@keyframes dotPulse {
  0% { transform: scale(0); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

@keyframes fadeInUp {
  0% { opacity: 0; transform: translateY(16px); }
  100% { opacity: 1; transform: translateY(0); }
}


.legalMain {
  padding: var(--sp-24) 0;
  background: var(--clr-bg);
}

.legalContainer {
  max-width: 800px;
  margin: 0 auto;
  padding: 0 var(--sp-6);
}

.legalHeader {
  text-align: center;
  margin-bottom: var(--sp-12);
  padding-top: var(--nav-height);
}

.legalHeader_title {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  font-weight: 800;
  color: var(--clr-dark);
  margin-bottom: var(--sp-4);
  margin-top: var(--sp-4);
}

.legalHeader_meta {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
}

.legalSection {
  margin-bottom: var(--sp-10);
  padding-bottom: var(--sp-10);
  border-bottom: 1px solid rgba(184,134,11,0.08);
}

.legalSection:last-child { border-bottom: none; }

.legalSection_title {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-4);
}

.legalSection_summary {
  background: var(--clr-accent-soft);
  border-left: 3px solid var(--clr-accent);
  padding: var(--sp-3) var(--sp-5);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  margin-bottom: var(--sp-5);
  font-size: var(--text-sm);
  color: var(--clr-text);
  line-height: 1.6;
}

.legalSection_summary strong { color: var(--clr-primary); }

.legalSection p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-4);
}

.legalSection p a { color: var(--clr-primary); text-decoration: underline; }


.legalBody--terms { }
.legalTermsIntro {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  border: 1px solid rgba(184,134,11,0.1);
  margin-bottom: var(--sp-8);
}
.legalTermsIntro p { font-size: var(--text-sm); color: var(--clr-text-muted); line-height: 1.8; }

.legalTermsSection {
  margin-bottom: var(--sp-8);
  padding-bottom: var(--sp-8);
  border-bottom: 1px solid rgba(184,134,11,0.08);
}
.legalTermsSection:last-child { border-bottom: none; }

.legalTermsSection h2 {
  font-family: var(--font-heading);
  font-size: var(--text-xl);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-4);
}

.legalTerms_callout {
  background: linear-gradient(135deg, rgba(45,74,45,0.06), rgba(45,74,45,0.02));
  border: 1px solid rgba(45,74,45,0.15);
  border-radius: var(--radius-lg);
  padding: var(--sp-3) var(--sp-5);
  font-size: var(--text-sm);
  font-weight: 600;
  color: var(--clr-secondary);
  margin-bottom: var(--sp-4);
}

.legalTermsSection p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-4);
}

.legalTermsSection p a { color: var(--clr-primary); text-decoration: underline; }


.cookiesHero {
  text-align: center;
  padding-top: var(--nav-height);
  margin-bottom: var(--sp-12);
}

.cookiesHero_icon {
  font-size: 3rem;
  color: var(--clr-primary);
  margin-bottom: var(--sp-4);
  display: block;
}

.cookiesHero_title {
  font-family: var(--font-heading);
  font-size: var(--text-4xl);
  font-weight: 800;
  color: var(--clr-dark);
  margin-bottom: var(--sp-3);
}

.cookiesHero_meta {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
}

.cookieIntroCard {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  border: 1px solid rgba(184,134,11,0.1);
  margin-bottom: var(--sp-8);
}

.cookieIntroCard p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.8;
}

.cookieSection {
  margin-bottom: var(--sp-10);
}

.cookieSection_marker {
  font-size: var(--text-xl);
  font-family: var(--font-heading);
  font-weight: 700;
  color: var(--clr-dark);
  margin-bottom: var(--sp-4);
  padding-bottom: var(--sp-3);
  border-bottom: 2px solid rgba(184,134,11,0.15);
}

.cookieSection p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.8;
  margin-bottom: var(--sp-4);
}

.cookieSection p a { color: var(--clr-primary); text-decoration: underline; }

.cookieSection code {
  font-size: 0.85em;
  background: rgba(184,134,11,0.08);
  padding: 2px 6px;
  border-radius: var(--radius-sm);
  color: var(--clr-primary);
}

.cookieCategory {
  background: var(--clr-surface);
  border-radius: var(--radius-xl);
  padding: var(--sp-6);
  border: 1px solid rgba(184,134,11,0.1);
  margin-bottom: var(--sp-5);
}

.cookieCategory_header {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
}

.cookieCategory_badge {
  font-size: var(--text-xs);
  font-weight: 700;
  padding: var(--sp-1) var(--sp-3);
  border-radius: var(--radius-full);
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.cookieCategory_badge--required {
  background: rgba(45,74,45,0.12);
  color: var(--clr-secondary);
}

.cookieCategory_badge--optional {
  background: var(--clr-accent-soft);
  color: var(--clr-primary);
}

.cookieCategory_title {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--clr-dark);
}

.cookieCategory p {
  font-size: var(--text-sm);
  color: var(--clr-text-muted);
  line-height: 1.75;
  margin-bottom: var(--sp-4);
}

.cookieTable_wrap {
  overflow-x: auto;
  border-radius: var(--radius-md);
  border: 1px solid rgba(184,134,11,0.1);
}

.cookieTable {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--text-xs);
}

.cookieTable th {
  background: rgba(184,134,11,0.06);
  padding: var(--sp-2) var(--sp-4);
  text-align: left;
  font-weight: 600;
  color: var(--clr-text);
  border-bottom: 1px solid rgba(184,134,11,0.1);
}

.cookieTable td {
  padding: var(--sp-2) var(--sp-4);
  color: var(--clr-text-muted);
  border-bottom: 1px solid rgba(184,134,11,0.06);
}

.cookieTable tr:last-child td { border-bottom: none; }


.pageFooter {
  background: var(--clr-dark);
  padding-top: var(--sp-16);
}

.pageFooter_inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 var(--sp-6) var(--sp-12);
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: var(--sp-16);
}

.pageFooter_logo {
  display: flex;
  align-items: center;
  gap: var(--sp-3);
  margin-bottom: var(--sp-4);
  text-decoration: none;
}

.pageFooter_logoImg { width: 28px; height: 28px; }

.pageFooter_logo span {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: var(--clr-accent);
}

.pageFooter_tagline {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.5);
  line-height: 1.6;
  margin-bottom: var(--sp-5);
  max-width: 320px;
}

.pageFooter_address {
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.45);
  line-height: 1.8;
}

.pageFooter_address a {
  color: rgba(255,255,255,0.45);
  transition: color var(--trans-base);
}

.pageFooter_address a:hover { color: var(--clr-accent); }

.pageFooter_nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-8);
}

.pageFooter_navTitle {
  font-size: var(--text-xs);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--clr-accent);
  margin-bottom: var(--sp-4);
}

.pageFooter_navLink {
  display: block;
  font-size: var(--text-sm);
  color: rgba(255,255,255,0.5);
  margin-bottom: var(--sp-2);
  transition: color var(--trans-base);
}

.pageFooter_navLink:hover { color: rgba(255,255,255,0.85); }

.pageFooter_bottom {
  border-top: 1px solid rgba(255,255,255,0.06);
  padding: var(--sp-5) var(--sp-6);
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--sp-4);
  flex-wrap: wrap;
}

.pageFooter_bottom p {
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.35);
}

.pageFooter_disclaimer {
  font-style: italic;
  max-width: 420px;
  text-align: right;
}


.cookieConsent {
  position: fixed;
  bottom: var(--sp-5);
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  width: auto;
  min-width: 280px;
  max-width: 480px;
  background: var(--clr-dark);
  border: 1px solid var(--clr-dark-border);
  border-radius: var(--radius-full);
  padding: var(--sp-3) var(--sp-5);
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  box-shadow: var(--shadow-xl), 0 0 32px rgba(0,0,0,0.4);
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.cookieConsent.isExpanded {
  border-radius: var(--radius-xl);
  flex-direction: column;
  align-items: flex-start;
  min-width: 340px;
  padding: var(--sp-5) var(--sp-6);
  white-space: normal;
}

.cookieConsent_pill {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
  width: 100%;
}

.cookieConsent.isExpanded .cookieConsent_pill { display: none; }

.cookieConsent_pillText {
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.7);
  flex: 1;
}

.cookieConsent_pillText a {
  color: var(--clr-accent);
  text-decoration: underline;
}

.cookieConsent_modal {
  display: none;
  width: 100%;
}

.cookieConsent.isExpanded .cookieConsent_modal { display: block; }

.cookieConsent_modalTitle {
  font-family: var(--font-heading);
  font-size: var(--text-lg);
  font-weight: 700;
  color: rgba(255,255,255,0.9);
  margin-bottom: var(--sp-3);
}

.cookieConsent_modalText {
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.55);
  line-height: 1.6;
  margin-bottom: var(--sp-4);
}

.cookieConsent_modalText a {
  color: var(--clr-accent);
  text-decoration: underline;
}

.cookieConsent_categories {
  display: flex;
  flex-direction: column;
  gap: var(--sp-2);
  margin-bottom: var(--sp-4);
}

.cookieConsent_category {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: var(--text-xs);
  color: rgba(255,255,255,0.6);
  padding: var(--sp-2) var(--sp-3);
  background: rgba(255,255,255,0.04);
  border-radius: var(--radius-md);
}

.cookieConsent_categoryName { font-weight: 600; color: rgba(255,255,255,0.8); }

.cookieConsent_toggle {
  position: relative;
  width: 36px;
  height: 20px;
  flex-shrink: 0;
}

.cookieConsent_toggle input {
  opacity: 0;
  width: 0;
  height: 0;
}

.cookieConsent_toggleSlider {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.15);
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: all var(--trans-base);
}

.cookieConsent_toggleSlider::before {
  content: '';
  position: absolute;
  width: 14px;
  height: 14px;
  left: 3px;
  top: 3px;
  background: white;
  border-radius: 50%;
  transition: transform var(--trans-base);
}

.cookieConsent_toggle input:checked + .cookieConsent_toggleSlider {
  background: var(--clr-primary);
}

.cookieConsent_toggle input:checked + .cookieConsent_toggleSlider::before {
  transform: translateX(16px);
}

.cookieConsent_toggle input:disabled + .cookieConsent_toggleSlider {
  opacity: 0.5;
  cursor: not-allowed;
}

.cookieConsent_modalActions {
  display: flex;
  gap: var(--sp-3);
  flex-wrap: wrap;
}

.cookieConsent_btn {
  padding: var(--sp-2) var(--sp-4);
  border-radius: var(--radius-full);
  font-size: var(--text-xs);
  font-weight: 600;
  cursor: pointer;
  border: none;
  transition: all var(--trans-base);
  font-family: var(--font-body);
}

.cookieConsent_btn--accept {
  background: linear-gradient(135deg, var(--clr-primary), var(--clr-primary-light));
  color: #fff;
  box-shadow: var(--glow-primary);
}

.cookieConsent_btn--accept:hover { opacity: 0.9; transform: translateY(-1px); }

.cookieConsent_btn--decline {
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.7);
}

.cookieConsent_btn--decline:hover { background: rgba(255,255,255,0.12); }

.cookieConsent_btn--customize {
  background: transparent;
  color: var(--clr-accent);
  border: 1px solid rgba(232,197,71,0.3);
}

.cookieConsent_btn--customize:hover {
  background: rgba(232,197,71,0.08);
}

.cookieConsent_pillBtns {
  display: flex;
  gap: var(--sp-2);
  flex-shrink: 0;
}


@media (max-width: 1024px) {
  .topicsGrid_grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .trackingSection_cards {
    grid-template-columns: repeat(2, 1fr);
  }

  .permitsDeep_grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .mainHero {
    grid-template-columns: 1fr;
    min-height: auto;
  }

  .mainHero_imageWrap {
    min-height: 360px;
    height: 360px;
  }

  .mainHero_content {
    padding: var(--sp-16) var(--sp-8) var(--sp-12);
  }
}

@media (max-width: 768px) {
  :root {
    --nav-height: 60px;
  }

  .siteHeader_nav { display: none; }
  .siteHeader_hamburger { display: flex; }
  .mobileTabBar {
    display: flex;
    justify-content: space-around;
  }

  body { padding-bottom: 70px; }

  .mainHero {
    grid-template-columns: 1fr;
  }

  .mainHero_content {
    padding: var(--sp-12) var(--sp-5) var(--sp-8);
  }

  .mainHero_imageWrap { display: none; }

  .mainHero_actions {
    flex-direction: column;
    align-items: flex-start;
  }

  .featureEditorial_grid,
  .permitsBand_inner,
  .displaySection_grid,
  .paymentSection_grid,
  .editorialFeature2_grid,
  .aboutPreview_inner,
  .benefitsIntro_grid,
  .irregularIntro_grid,
  .displayDeep_grid,
  .trackingDeep_grid,
  .contactSection_grid {
    grid-template-columns: 1fr;
    gap: var(--sp-8);
  }

  .featureEditorial_imageCol { order: -1; }
  .editorialFeature2_imageCol { order: -1; }

  .displaySection_imageWrap {
    position: static;
  }

  .topicsGrid_grid {
    grid-template-columns: 1fr;
  }

  .trackingSection_cards {
    grid-template-columns: 1fr;
  }

  .audienceCards_grid {
    grid-template-columns: 1fr;
  }

  .permitsDeep_grid {
    grid-template-columns: 1fr;
  }

  .seasonalSection_grid {
    grid-template-columns: 1fr;
  }

  .paymentDeep_grid {
    grid-template-columns: 1fr;
  }

  .variabilitySection_grid {
    grid-template-columns: 1fr;
  }

  .baScenario_grid {
    grid-template-columns: 1fr;
  }

  .baScenario_divider { display: none; }

  .contactForm_row {
    grid-template-columns: 1fr;
  }

  .contactForm_footer {
    flex-direction: column;
    align-items: flex-start;
  }

  .pageFooter_inner {
    grid-template-columns: 1fr;
    gap: var(--sp-8);
  }

  .pageFooter_bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  .pageFooter_disclaimer { text-align: left; }

  .sectionHeader_title {
    font-size: var(--text-2xl);
  }

  .cookieConsent {
    bottom: 80px;
    left: var(--sp-4);
    right: var(--sp-4);
    transform: none;
    min-width: unset;
    max-width: unset;
    width: auto;
  }

  .cookieConsent.isExpanded {
    min-width: unset;
  }

  .timeline::before { left: 23px; }

  .pageFooter_nav {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 480px) {
  .container { padding: 0 var(--sp-4); }

  .mainHero_title {
    font-size: clamp(2rem, 10vw, 3rem);
  }

  .pageHero_title {
    font-size: var(--text-3xl);
  }

  .btn {
    padding: var(--sp-3) var(--sp-5);
    font-size: var(--text-xs);
  }

  .legalHeader { padding-top: var(--nav-height); }

  .cookiesHero { padding-top: var(--nav-height); }
}