/* BetterFit CSS Scaffold */

:root {
  --betterfit-blue: #002c84; /* Royal Blue */
  --betterfit-gold: #d4af37; /* Gold */
}

body {
  font-family: system-ui, sans-serif;
  background-color: #fff;
  color: #1f2937;
}

/* ===================== */
/* Navigation (Solid Royal Blue) */
/* ===================== */
nav {
  background-color: var(--betterfit-blue); /* Solid royal blue */
  color: #fff;
}

nav a {
  color: #fff;
  transition: color 0.2s ease-in-out;
}

nav a:hover {
  color: var(--betterfit-gold);
}

/* Hero Section */
.hero {
  background: linear-gradient(to bottom, #fff, var(--betterfit-blue));
  color: white;
}

.hero-title {
  font-size: 2.25rem;
  line-height: 1.2;
  font-weight: 800;
  color: var(--betterfit-gold);
}

@media (min-width: 768px) {
  .hero-title {
    font-size: 3.75rem;
  }
}

.hero-subtitle {
  font-size: 1.125rem;
}

/* Features Section */
.section-title {
  font-size: 1.875rem;
  font-weight: bold;
  color: var(--betterfit-blue);
}

.feature-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--betterfit-blue);
}

.feature-text {
  font-size: 0.875rem;
  color: #4b5563;
}

/* Footer */
.footer-bg {
  background-color: var(--betterfit-blue);
}

.footer-title {
  font-size: 1.875rem;
  font-weight: 600;
  color: var(--betterfit-gold);
}

.footer-text {
  color: var(--betterfit-gold);
}

.text-gold {
  color: var(--betterfit-gold);
}

/* Smooth anchor scrolling */
html { scroll-behavior: smooth; }

/* Offset in-page links for fixed nav (tweak if your nav height changes) */
#hero, #features, #contact { scroll-margin-top: 96px; }

/* ===== Site Footer (Blue Background, White Text) ===== */
.site-footer {
  background: var(--betterfit-blue);
  border-top: 1px solid #1e3a8a; /* darker blue border for subtle separation */
  position: relative;
  overflow: hidden;
  color: #fff; /* default text white */
}

.site-footer a {
  color: #fff;
  text-decoration: none;
}

.site-footer a:hover {
  color: var(--betterfit-gold); /* gold hover for brand consistency */
  text-decoration: underline;
}

/* Footer headings */
.footer-heading {
  font-size: 1rem;
  font-weight: 600;
  color: #fff;
}

/* Background logo (lower-right) */
.footer-logo-bg {
  position: absolute;
  right: 0;
  bottom: 0;
  opacity: 0.5;
  pointer-events: none;
  user-select: none;
  transform: translate(24px, 24px);
  width: 10rem;
  height: auto;
}


@media (min-width: 768px) {   /* md */
  .footer-logo-bg { width: 14rem; }  /* 224px */
}
@media (min-width: 1024px) {  /* lg */
  .footer-logo-bg { width: 18rem; }  /* 288px */
}

}

/* Keep navbar solid royal blue (already added) */
nav { background-color: var(--betterfit-blue); color: #fff; }
nav a { color: #fff; transition: color .2s; }
nav a:hover { color: var(--betterfit-gold); }