/**
 * BLU-D Construction — Button component
 * Full LVHFA state order to prevent visited/hover flash conflicts.
 * Replace css/components/button.css entirely with this file.
 */

/* ============================================================
   PRIMARY BUTTON — Old Pitch on Big Blu background contexts
   ============================================================ */

.btn-blud-primary:link,
.btn-blud-primary:visited {
  background: var(--color-btn-primary-bg);
  color: var(--color-btn-primary-text);
  border: 2px solid var(--color-btn-primary-bg);
  border-radius: var(--border-radius);
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 0.75rem 1.75rem;
  text-decoration: none;
  display: inline-block;
  transition: background var(--transition-speed), border-color var(--transition-speed), color var(--transition-speed);
}

.btn-blud-primary:hover,
.btn-blud-primary:focus {
  background: var(--color-btn-primary-hover-bg);
  border-color: var(--color-btn-primary-hover-bg);
  color: var(--color-white);
  text-decoration: none;
}

.btn-blud-primary:active {
  background: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  color: var(--color-white);
}

/* ============================================================
   SECONDARY BUTTON — outline style
   ============================================================ */

.btn-blud-secondary:link,
.btn-blud-secondary:visited {
  background: var(--color-btn-secondary-bg);
  color: var(--color-btn-secondary-text);
  border: 2px solid var(--color-btn-secondary-border);
  border-radius: var(--border-radius);
  font-weight: 700;
  letter-spacing: 0.03em;
  padding: 0.75rem 1.75rem;
  text-decoration: none;
  display: inline-block;
  transition: background var(--transition-speed), color var(--transition-speed), border-color var(--transition-speed);
}

.btn-blud-secondary:hover,
.btn-blud-secondary:focus {
  background: var(--color-btn-secondary-hover-bg);
  color: var(--color-btn-secondary-hover-text);
  border-color: var(--color-btn-secondary-hover-bg);
  text-decoration: none;
}

.btn-blud-secondary:active {
  background: var(--color-primary-dark);
  color: var(--color-white);
  border-color: var(--color-primary-dark);
}

/* ============================================================
   HERO CONTEXT — Old Pitch primary, white outline secondary
   ============================================================ */

.hero-content-overlay .btn-blud-primary:link,
.hero-content-overlay .btn-blud-primary:visited {
  background: var(--color-old-pitch);
  border-color: var(--color-old-pitch);
  color: var(--color-white);
}

.hero-content-overlay .btn-blud-primary:hover,
.hero-content-overlay .btn-blud-primary:focus {
  background: var(--color-accent-dark);
  border-color: var(--color-accent-dark);
  color: var(--color-white);
}

.hero-content-overlay .btn-blud-secondary:link,
.hero-content-overlay .btn-blud-secondary:visited {
  border-color: var(--color-white);
  color: var(--color-white);
  background: transparent;
}

.hero-content-overlay .btn-blud-secondary:hover,
.hero-content-overlay .btn-blud-secondary:focus {
  background: var(--color-white);
  color: var(--color-big-blu);
  border-color: var(--color-white);
}

/* ============================================================
   FINAL CTA CONTEXT
   ============================================================ */

.blud-final-cta .btn-blud-primary:link,
.blud-final-cta .btn-blud-primary:visited {
  background: var(--color-old-pitch);
  border-color: var(--color-old-pitch);
  color: var(--color-white);
}

.blud-final-cta .btn-blud-primary:hover,
.blud-final-cta .btn-blud-primary:focus {
  background: var(--color-accent-dark);
  border-color: var(--color-accent-dark);
  color: var(--color-white);
}

.blud-final-cta .btn-blud-secondary:link,
.blud-final-cta .btn-blud-secondary:visited {
  border-color: var(--color-white);
  color: var(--color-white);
  background: transparent;
}

.blud-final-cta .btn-blud-secondary:hover,
.blud-final-cta .btn-blud-secondary:focus {
  background: var(--color-white);
  color: var(--color-big-blu);
  border-color: var(--color-white);
}

/* ============================================================
   PROJECT CARD MORE LINK
   ============================================================ */

.project-card__more:link,
.project-card__more:visited {
  color: var(--color-primary);
  text-decoration: none;
}

.project-card__more:hover,
.project-card__more:focus {
  color: var(--color-accent);
}