@charset "utf-8";

/* =====================================================
   Components
   ===================================================== */

/* =====================================================
   Buttons
   ===================================================== */

.btn-ghs-primary,
.btn-ghs-outline,
.btn-ghs-light {
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
}

/* Primary */
.btn-ghs-primary {
  --bs-btn-bg: var(--impact-crimson);
  --bs-btn-border-color: var(--impact-crimson);
  --bs-btn-color: #fff;

  --bs-btn-hover-bg: var(--pulse-gold);
  --bs-btn-hover-border-color: var(--pulse-gold);
  --bs-btn-hover-color: var(--grind-black);
}

/* Outline */
.btn-ghs-outline {
  --bs-btn-color: #fff;
  --bs-btn-border-color: rgba(255, 255, 255, 0.75);

  --bs-btn-hover-bg: rgba(255, 255, 255, 0.12);
  --bs-btn-hover-border-color: #fff;
  --bs-btn-hover-color: #fff;
}

/* Light */
.btn-ghs-light {
  --bs-btn-color: #fff;
  --bs-btn-bg: transparent;
  --bs-btn-border-color: #fff;

  --bs-btn-hover-color: var(--grind-black);
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;

  --bs-btn-focus-shadow-rgb: 255, 255, 255;

  transition:
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}

/* =====================================================
   Cards
   ===================================================== */

.card-ghs {
  height: 100%;
  border: 1px solid color-mix(in srgb, var(--concrete-ash) 60%, white);
  border-radius: var(--radius-lg);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.card-ghs:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-soft);
}

.card-ghs .card-title {
  font-weight: 800;
}

/* =====================================================
   Background Cards
   ===================================================== */

.card-ghs.bg-card {
  position: relative;
  color: #fff;
  background-image: var(--card-bg);
  background-size: cover;
  background-position: center;
}

.card-ghs.bg-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--card-overlay);
}

.card-ghs.bg-card > * {
  position: relative;
  z-index: 1;
}

/* =====================================================
   Card Background Images
   ===================================================== */

.card-bg-1 { --card-bg: url("../img/cards/small-group.png"); }
.card-bg-2 { --card-bg: url("../img/cards/large-group.png"); }
.card-bg-3 { --card-bg: url("../img/cards/combo.png"); }
.card-bg-4 { --card-bg: url("../img/cards/one-on-one.png"); }
.card-bg-5 { --card-bg: url("../img/cards/youth-training.png"); }
.card-bg-6 { --card-bg: url("../img/cards/membership.png"); }