/* --- Cinder Dark Mode Palette --- */
:root {
  --cod-gray: #1d1a1b;
  --swirl: #dbd1ca;
  --viking: #57c9dc;
  --tory-blue: #126199;

  /* Semantic names for dark mode */
  --background: var(--cod-gray);        /* Main background */
  --surface: #232021;                   /* Slightly lighter than background for cards/sections */
  --border: var(--tory-blue);           /* Borders */
  --primary: var(--viking);             /* Accent blue (now Viking) */
  --primary-hover: var(--tory-blue);    /* Hover is now Tory Blue */
  --text-main: var(--swirl);            /* Main text */
  --text-muted: #b3ada7;                /* Muted text */
}

/* Reset */
body, html {
  margin: 0;
  padding: 0;
  font-family: Arial, sans-serif;
  background-color: var(--background);
  color: var(--text-main);
  overflow-x: hidden;
}

/* Header/Nav */
header {
  background: var(--background) !important;
  border-bottom: 2px solid var(--swirl) !important;
  color: var(--text-main);
  box-shadow: 0 2px 12px 0 rgba(0,0,0,0.24);
}
#main-header .nav-link,
#main-header .dropdown-link {
  color: var(--text-main);
  background: transparent;
}
#main-header .nav-link:hover,
#main-header .nav-link:focus,
#main-header .dropdown-link:hover,
#main-header .dropdown-link:focus {
  color: var(--primary-hover);
  background: var(--surface);
}
#main-header .nav-link.active {
  color: var(--primary);
}
#main-header .nav-link::after {
  background: var(--primary);
}

/* Dropdowns */
#main-header .dropdown-menu {
  background: var(--surface);
  color: var(--text-main);
  border: 2px solid var(--swirl);
  padding: 0.75rem 1.5rem;
  min-width: 14rem;              /* Wider dropdown */
  min-height: 3.5rem;            /* Taller dropdown */
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.15s, visibility 0.15s;
  top: 100%;
  left: 0;
  position: absolute;
  z-index: 50;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;                   /* Space between links */
}

#main-header .dropdown-link {
  display: block;
  width: 100%;
  padding: 0.5rem 0;
  white-space: nowrap;
}

#main-header .group:hover .dropdown-menu,
#main-header .group:focus-within .dropdown-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

/* CTA Button */
.cta-button, .magnetic {
  display: inline-block;
  padding: 0.75em 2em;
  border-radius: 999px;
  font-weight: bold;
  background: var(--primary) !important;      /* Now Viking */
  color: var(--background) !important;
  border: none;
  box-shadow: 0 2px 12px 0 rgba(87,201,220,0.15); /* Updated shadow to match Viking */
  letter-spacing: 0.02em;
  transition: background 0.2s, color 0.2s, box-shadow 0.2s, transform 0.2s;
  cursor: pointer;
  text-decoration: none;
}
.cta-button:hover, .magnetic:hover {
  background: var(--primary-hover) !important; /* Now Tory Blue */
  color: var(--background) !important;
  box-shadow: 0 4px 24px 0 rgba(18,97,153,0.18);
  transform: translateY(-2px) scale(1.03);
}

/* Section backgrounds */
.section-glow {
  background: var(--surface) !important;
}
.section-glow::before {
  background: radial-gradient(circle at center, rgba(18,97,153,0.10) 0%, var(--surface) 70%);
}

/* Card style */
.card {
  background: var(--background);
  color: var(--text-main);
  border: 1px solid var(--primary);
}
.card:hover {
  background: var(--primary-hover);
  color: var(--background);
}

/* Accent text/icon */
.text-accent {
  color: var(--primary) !important;
}

/* Magnetic Button Interaction */
.magnetic {
  transition: transform 0.2s ease;
  will-change: transform;
}

/* Hero section text override */
.hero-video-text h1 {
  color: var(--swirl) !important;
}
.hero-video-text p {
  color: var(--cod-gray) !important;
}
/* Hero CTA button: Swirl background, Cod Gray text */
.hero-video-text .cta-button,
.hero-video-text .magnetic {
  background: var(--swirl) !important;
  color: var(--cod-gray) !important;
}