body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }

h1, h2, h3, h4, h5, h6 {
    font-family: 'Courgette', 'Helvetica', arial, serif;
}

.py-5 {
    padding-top: 1rem !important;
    padding-bottom: 3rem !important;
}
.slogan{
	color: #ffffff;
    line-height: 1em;
    font-family: 'Courgette', cursive;
    text-shadow: -1px -1px 0 #2376A6, 1px -1px 0 #2376A6, -1px 1px 0 #2376A6, 1px 1px 0 #2376A6;
}

/* Base nav link style */
.nav-link {
  color: #000000;
  text-decoration: none;
  border-bottom: 4px solid transparent; /* reserve space to avoid jump */
  transition: color 0.3s ease, border-color 0.3s ease;
  padding-bottom: 2px; /* ensure clickable area looks even */
  padding: 2px 30px !important;
}

/* Hover + focus state */
.nav-link:hover,
.nav-link:focus {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Active/current page */
.nav-link.active,
.nav-link[aria-current="page"] {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Optional: reduce underline flash when clicked */
.nav-link:active {
  color: #1F6D9A;
}
div.paddingdiv{
	min-height:200px;
}
div.box1{
	background-color:#2376A6;padding:5px 20px;color:#69b4df;text-align:justify;
}
div.box2{
	background-color:#1F6D9A;padding:5px 20px;color:#69b4df;text-align:justify;
}
div.box3{
	background-color:#1A648E;padding:5px 20px;color:#69b4df;text-align:justify;
}
div.box1 h5{
	color:#ffffff;
}
div.box2 h5{
	color:#ffffff;
}
div.box3 h5{
	color:#ffffff;
}
.btn-primary {
  background-color: #2376A6;   /* normal state */
  border-color: #2376A6;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #1A648E;   /* hover/focus state */
  border-color: #1A648E;
}
.shadeback {
  background-color: rgba(0,0,0,0.3); /* optional subtle background */
  padding: 15px;
  color:#ffffff;
  border-radius: 4px;
}
.col-md-6.bg-cat {
  display: flex;
  flex-direction: column;
  justify-content: flex-end; /* pushes children to the bottom */
  padding: 20px; /* optional */
  color: #fff;
}
.list-group-item {
    background-color: transparent !important;border: transparent !important;
}
#testimonialCarousel {
  background-color: #f8f9fa;
  border-radius: 8px;
  padding: 2rem;
  max-width: 700px;
  margin: 0 auto;
}
.blockquote {
  font-style: italic;
  color: #333;
}
.blockquote-footer {
  color: #1F6D9A;
}
.list-group-item {
  position: relative;
  padding-left: 2rem;      /* space for the icon */
  border: none;            /* optional: remove Bootstrap’s borders */
  background: transparent; /* optional */
}
.list-group-item::before {
  content: "\f111";        /* Font Awesome 'circle' icon */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;        /* solid style */
  position: absolute;
  left: 0.75rem;
  top: 0.9rem;
  color: #1F6D9A;          /* your accent colour */
  font-size: 0.5rem;       /* adjust bullet size */
}

/*****MEET PET MATE STYLING*****/

body.meet-pet-mate .nav-link {
  color: #ffffff;
  text-decoration: none;
  border-bottom: 4px solid transparent; /* reserve space to avoid jump */
  transition: color 0.3s ease, border-color 0.3s ease;
  padding-bottom: 2px; /* ensure clickable area looks even */
}

/* Hover + focus state */
body.meet-pet-mate .nav-link:hover,
body.meet-pet-mate .nav-link:focus {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Active/current page */
body.meet-pet-mate .nav-link.active,
body.meet-pet-mate .nav-link[aria-current="page"] {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Optional: reduce underline flash when clicked */
body.meet-pet-mate .nav-link:active {
  color: #1F6D9A;
}
body.meet-pet-mate div.paddingdiv{
	min-height:400px;
}

/******Services Page******/
body.services .nav-link {
  color: #ffffff;
  text-decoration: none;
  font-weight:900;
  border-bottom: 4px solid transparent; /* reserve space to avoid jump */
  transition: color 0.3s ease, border-color 0.3s ease;
  padding-bottom: 2px; /* ensure clickable area looks even */
}

/* Hover + focus state */
body.services .nav-link:hover,
body.services .nav-link:focus {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Active/current page */
body.services .nav-link.active,
body.services .nav-link[aria-current="page"] {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Optional: reduce underline flash when clicked */
body.services .nav-link:active {
  color: #1F6D9A;
}
body.services div.paddingdiv{
	min-height:400px;
}
/******Contact Page******/
body.contact .nav-link {
  color: #ffffff;
  text-decoration: none;
  font-weight:900;
  border-bottom: 4px solid transparent; /* reserve space to avoid jump */
  transition: color 0.3s ease, border-color 0.3s ease;
  padding-bottom: 2px; /* ensure clickable area looks even */
}

/* Hover + focus state */
body.contact .nav-link:hover,
body.contact .nav-link:focus {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Active/current page */
body.contact .nav-link.active,
body.contact .nav-link[aria-current="page"] {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Optional: reduce underline flash when clicked */
body.contact .nav-link:active {
  color: #1F6D9A;
}
body.contact div.paddingdiv{
	min-height:300px;
}

/******Gallery Page******/
body.gallery .nav-link {
  color: #ffffff;
  text-decoration: none;
  font-weight:900;
  border-bottom: 4px solid transparent; /* reserve space to avoid jump */
  transition: color 0.3s ease, border-color 0.3s ease;
  padding-bottom: 2px; /* ensure clickable area looks even */
}

/* Hover + focus state */
body.gallery .nav-link:hover,
body.gallery .nav-link:focus {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Active/current page */
body.gallery .nav-link.active,
body.gallery .nav-link[aria-current="page"] {
  color: #1F6D9A;
  border-bottom-color: #1F6D9A;
}

/* Optional: reduce underline flash when clicked */
body.gallery .nav-link:active {
  color: #1F6D9A;
}
body.gallery div.paddingdiv{
	min-height:300px;
}

/****Table Styling*****/
table.table {
  border-radius: 6px;
  overflow: hidden;
}
table.table th {
  background-color: #1A648E;
  color: #fff;
}

/****Bootstrap Gallery*******/
/* Masonry-style layout using CSS columns */
.masonry {
  column-count: 7;        /* Desktop */
  column-gap: 0.75rem;    /* Spacing between thumbnails */
}

/* Tablet (≤ 992px wide) */
@media (max-width: 992px) {
  .masonry {
    column-count: 4;
  }
}

/* Mobile landscape (≤ 768px wide) */
@media (max-width: 768px) {
  .masonry {
    column-count: 3;
  }
}

/* Mobile portrait (≤ 576px wide) */
@media (max-width: 576px) {
  .masonry {
    column-count: 2;
  }
}
.masonry-item {
  break-inside: avoid;
  margin-bottom: 1rem;
}
.masonry-item img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: .5rem;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  cursor: pointer;
}

/* Responsive columns */
@media (max-width: 992px) { .masonry { column-count: 2; } }
@media (max-width: 576px) { .masonry { column-count: 1; } }
/* Default (inactive) tab color */
.nav-tabs .nav-link {
  color: #555 !important;          /* Medium gray for visibility on white */
  background-color: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  font-weight: 500;
  transition: color 0.3s ease, border-color 0.3s ease;
}

/* Hovered tab */
.nav-tabs .nav-link:hover {
  color: #1F6D9A !important;       /* Your site’s blue */
  border-color: #1F6D9A;
}

/* Active tab */
.nav-tabs .nav-link.active {
  color: #1F6D9A !important;
  border-color: #1F6D9A;
  background-color: #fff;          /* Keeps it consistent with your white content background */
  font-weight: 600;
}

/*****References on Contact Page******/
/* Reference card */
.reference-card {
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.reference-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
}

/* Gradient header */
.reference-card .card-header {
  background: linear-gradient(135deg, #1F6D9A 0%, #2F8CBF 100%);
  padding: 0.75rem 1rem;
}

/* Card title styling */
.reference-card .card-title {
  font-weight: 600;
  font-size: 1.1rem;
}

/* Reference details */
.reference-item h6 {
  font-weight: 600;
}

.reference-email {
  display: inline-block;
  color: #1F6D9A;
  text-decoration: none;
  font-size: 0.9rem;
}

.reference-email:hover {
  text-decoration: underline;
  color: #125272;
}
/* Reference card */
.reference-card {
  border-radius: 10px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.reference-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
}

/* Gradient header */
.reference-card .card-header {
  background: linear-gradient(135deg, #1F6D9A 0%, #2F8CBF 100%);
  padding: 0.75rem 1rem;
}

/* Title */
.reference-card .card-title {
  font-weight: 600;
  font-size: 1.1rem;
}

/* Reference info */
.reference-item h6 {
  font-weight: 600;
}

.reference-email {
  display: inline-block;
  color: #1F6D9A;
  text-decoration: none;
  font-size: 0.9rem;
}

.reference-email:hover {
  text-decoration: underline;
  color: #125272;
}

/* Note beneath references */
.reference-note {
  font-weight: 600;
  color: #1F6D9A;
  background-color: rgba(31, 109, 154, 0.05);
  padding: 10px 12px;
  border-radius: 6px;
  font-size: 0.95rem;
}
/*****Footer*******/
/* Footer pets section */
.footer-pets {
  background: linear-gradient(135deg, #1F6D9A 0%, #2F8CBF 100%);
  border-top: 3px solid rgba(255, 255, 255, 0.3);
  border-bottom: 3px solid rgba(255, 255, 255, 0.2);
  color: #fff;
}

.footer-pets .footer-heading {
  font-family: 'Courgette', cursive;
  font-size: 1.4rem;
  font-weight: 600;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
}

.footer-pets .footer-list {
  font-size: 1rem;
  line-height: 1.6;
  max-width: 800px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.9);
}
span.navbar-toggler-icon {
	background:rgba(255,255,255, 0.5) !important;