/* Shared color/layout tokens come from home.css's :root, which every
   page loads first. Previously this block redefined --light-gray/--dark-gray
   with different values than the rest of the site (#d3d3d3/#48494b vs.
   the site-wide #808080/#000000) — normalized to match everywhere else. */

/* Header height comes from home.css's .header--compact class. */

/*CTA Button formatting*/
.cta-btn {
  background: var(--primary-blue);
  color: var(--white);
  padding: 0.75rem 3rem 0.85rem 3rem;
  border-radius: 50px;
  text-decoration: none;
  font-weight: bold;
  display: grid;
  transition: all 0.3s;
  border: 2px solid var(--white);
  margin-top: var(--space-lg);
}

/*CTA Button formatting when hovering*/
.cta-btn:hover {
  background: var(--primary-red);
  color: var(--white);
  border-color: var(--primary-red);
}

/*tbd Button formatting*/
.tbd-btn {
  background: var(--bg-light);
  color: var(--black);
  padding: 0.75rem 3rem 0.85rem 3rem;
  border-radius: 50px;
  text-decoration: none;
  font-weight: bold;
  display: grid;
  transition: all 0.3s;
  border: 2px solid var(--white);
  margin-top: var(--space-lg);
  cursor: default;
}

/*tbd Button formatting when hovering*/
.tbd-btn:hover {
  background: var(--black);
  color: var(--bg-light);
}

@media (max-width: 900px) {
 .cta-btn {
  font-size: 1rem;
 }
}

@media (max-width: 480px) {
  .cta-btn {
  font-size: 1rem;
 }
}