/* ============================= */
/* NAVBAR                        */
/* ============================= */

.bg-black {
  background-color: #222;
}

.navbar-dark .navbar-nav .nav-link {
  color: #f5f5f5;
  transition: color 0.2s ease;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: #ffd200;
}

.navbar-dark .navbar-nav .nav-link.active {
  color: #ffd200;
}

/* ============================= */
/* PRODUCT PAGE                  */
/* ============================= */

/*.product-text-muted p {
  color: var(--bs-secondary-color);
} /*

/* ============================= */
/* ICON COLOUR                   */
/* ============================= */
.icon-easypyro-brand {
  color: #ffD200;
}

.btn-easypyro-brand {
  background-color: #ffd200;
  border-color: #ffd200;
  color: #1a1a1a;
}

.btn-easypyro-brand:hover {
  background-color: #ffd200;
  border-color: #ffd200;
  color: #1a1a1a;
  filter: none !important;
  transform: none !important;
  box-shadow: none !important;
}


/* ============================= */
/* LAYOUT + STRUCTURE            */
/* ============================= */

.site-footer {
  background: #000;
  color: #fff;
  padding: 20px 0;
  margin-top: 50px;
}

.page-header-custom {
  border-bottom: 2px solid #ddd;
}

.page-header-custom h1 {
  font-weight: 600;
}

.page-header-custom p {
  font-size: 1.1rem;
}

.breadcrumb {
  background: none;
  padding: 0;
  margin-top: 5px;
  font-size: 0.9rem;
}

/* Adjust line height for readability */
.content-wrapper {
  line-height: 1.6;
}

/* ============================= */
/* TESTIMONIALS                 */
/* ============================= */

/*.testimonial-item .bi-quote {
  color: #ffd200;
}/*

/* ============================= */
/* OPTIONAL: CONTENT LINKS       */
/* ============================= */

/* Only apply yellow links inside main content areas */
.main-content a {
  color: #ffd200;
}

.main-content a:hover {
  color: #fff;
}

/* ============================= */
/* HERO TEXT RESPONSIVENESS      */
/* ============================= */

/* mobile default */
.hero-title {
  font-size: 2.2rem;   
  line-height: 1.1;
}

.hero-lead {
  font-size: 1.1rem;
}

/* md and up */
@media (min-width: 768px) {
  .hero-title {
    font-size: 3.5rem;
  }

  .hero-lead {
    font-size: 1.5rem;
  }
}

/* lg and up (optional refinement) */
@media (min-width: 992px) {
  .hero-title {
    font-size: 4rem;
  }

  .hero-lead {
    font-size: 1.7rem;
  }
}


/* Ensure page content isn't hidden behind the fixed navbar */
body {
  padding-top: 90px;
}

/* Reduce top offset on small screens where the navbar is more compact */
@media (max-width: 576px) {
  body {
    padding-top: 80px;
  }
}

/* Stop linked content in Table of Contents from being hidden behind the navbar */
h1, h2, h3, h4, h5, h6 {
  scroll-margin-top: 120px; /* adjust to your navbar height */
} 

/* ============================================ */
/* REDUCE WIDTH OF PAGES WITH NARROW ATTRIBUTE  */
/* ======================================= */
.content-wrapper.narrow {
  max-width: 800px;
  margin: 0 auto;
}

/* ===================================== */
/* BLOCKQUOTE STYLING FOR A TESTIMONIAL  */
/* ===================================== */

.blockquote {
  background: #fff8d6;
  border-radius: 12px;
  padding: 1.5rem;
  margin-top: 2rem;
  margin-bottom: 1rem;
  text-align: center;
  position: relative;
}

/* Quote text */
.blockquote p {
  font-style: italic;
  font-size: 1.5rem;
  line-height: 1.7;
  color: #5c4400;
  margin-bottom: 1rem;
  position: relative;
  padding: 0 2rem;
}

/* Opening quote mark */
.blockquote p::before {
  content: "“";
  font-size: 4rem;
  color: #d4a200;
  position: absolute;
  left: 0;
  top: -1rem;
  line-height: 1;
}

/* Closing quote mark */
.blockquote p::after {
  content: "”";
  font-size: 4rem;
  color: #d4a200;
  position: absolute;
  right: 0;
  bottom: -2rem;
  line-height: 1;
}

/* Attribution */
.blockquote-footer {
  text-align: right;
  font-size: 0.95rem;
  color: #7a6a3a;
}