.button-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 20px;
    justify-items: center;
}



/* buttons.css *//* -----------------------------------------
   BUTTONS
------------------------------------------*/

.cta-button {
  display: block;            /* ← THIS FIXES THE OVERLAP */
  background: #FDB500;
  color: #000;
  padding: 16px 28px;
  border-radius: 8px;
  font-weight: bold;
  text-decoration: none;

  min-width: 200px;
  text-align: center;
}

.hero-cta-group {
  display: flex;
  justify-content: center;
  gap: 20px;              /* space between buttons */
  margin-top: 30px;
}

.cta-button {
  min-width: 220px;       /* SAME size for both */
}


.cta-button:hover {
    background: #ffcc44;
    color: #000000;
}

.big-button {
    display: block;
    width: 100%;
    text-align: center;
    padding: 15px;
    background: #FDB500;
    color: #000000;
    font-size: 1.2rem;
    font-weight: bold;
    text-decoration: none;
    border-radius: 10px;
    transition: 0.2s ease;
}

.big-button:hover {
    background: #ffcc44;
}
.btn {
  margin-bottom: 16px;
}
a.btn-primary {
  display: block;
  margin-bottom: 18px;
}

/* Health Check button container */
.health-buttons {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 420px;
  margin: 40px auto;
}

/* Health Check buttons ONLY */
.health-buttons .cta-button {
  display: inline-block;
  width: 100%;
  min-width: unset;
  padding: 18px 24px;
}
/* === HEALTH CHECK BUTTON RESET === */

.health-check-actions {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 520px;
  margin: 50px auto 0;
}

.health-btn {
  display: block;
  background: #FDB500;
  color: #000;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  padding: 20px 28px;
  border-radius: 12px;
  text-decoration: none;
}

/* Hover */
.health-btn:hover {
  background: #ffcc44;
  color: #000;
}

/* MOBILE FIX – FORCE RESPONSIVE BUTTONS */
@media (max-width: 768px) {
  .cta-button,
  .big-button {
    width: 100%;
    max-width: 100%;
    display: block;
    box-sizing: border-box;
  }

  .button-grid {
    padding-left: 16px;
    padding-right: 16px;
  }
}
a.btn {
  color: #000 !important;
  text-decoration: none !important;
}
/* FORCE Pet Quote button style */
a.btn {
  color: #000 !important;
  text-decoration: none !important;
  display: block;
}
.pet-btn {
  background: #FDB500 !important;
  color: #000 !important;
  text-decoration: none !important;
  display: block;
  padding: 16px;
  border-radius: 12px;
  text-align: center;
  font-weight: bold;
}

.pet-quote-btn {
    display: inline-block !important;
    background: #FDB500 !important;
    color: #000 !important;
    font-weight: 700 !important;
    padding: 12px 22px !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    text-align: center !important;
}

.pet-quote-btn:hover {
    background: #ffcc33 !important;
    color: #000 !important;
}
.center-text {
    display: flex;
    justify-content: center;
}
/* FORCE BUTTON VISIBILITY – HOME PAGE */
.button-grid,
.link-list {
  display: block !important;
  position: relative !important;
  height: auto !important;
  overflow: visible !important;
  z-index: 9999 !important;
}
/* FORCE STACKED BUTTON LAYOUT (HOME + QR STYLE) */
.button-grid {
  display: flex;
  justify-content: center;
  width: 100%;
}

.link-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 420px;
  width: 100%;
  margin: 40px auto;
  align-items: stretch;
}

/* Ensure all buttons are visible */
.link-list a {
  display: block;
}
/* OVERRIDE ALL HIDING / COLLAPSING RULES */
.button-grid,
.link-list {
  display: flex !important;
  flex-direction: column !important;
  height: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}

/* FORCE BUTTON VISIBILITY */
.link-list a {
  display: block !important;
  margin-bottom: 14px !important;
}
/* FORCE BUTTON VISIBILITY — FINAL OVERRIDE */
.button-grid a,
.link-list a {
  background-color: #FDB500 !important; /* gold */
  color: #000000 !important;            /* black text */
  display: block !important;
  padding: 16px 20px !important;
  margin-bottom: 14px !important;
  border-radius: 12px !important;
  text-align: center !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  border: none !important;
}