/*
 Theme Name:   Alliance Veterinary Procedure Center
 Theme URI:    https://eoshealthcaremarketing.com/
 Description:  Alliance Veterinary Procedure Center — EOS Divi 5 child theme.
 Author:       EOS Healthcare Marketing
 Author URI:   https://eoshealthcaremarketing.com/
 Template:     Divi
 Version:      1.0.1
 Text Domain:  alliance
*/

:root {
  /* Fonts */
  --font-p22-mackinac-pro: "p22-mackinac-pro", serif;
  --font-pacaembu: "pacaembu", sans-serif;
  --font-arial: "Arial", sans-serif;

  /* Colors */
  --dark-navy: #313443;
  --navy: #323c49;
  --brown: #352118;
  --bronze: #8d7234;
  --light-brown: #ba9e77;
  --cream: #e5e1d6;
  --beige: #dcd3bc;
  --light-blue: #dbdfe5;
  --grey: #c1c5c8;
  --medium-grey: #5e6d74;
}

body {
  max-width: 2560px;
  margin: 0 auto;
}

/* ── Buttons ──────────────────────────────────────────────── */
.btn {
  padding: 0.75rem 2rem;
  text-align: center;
  display: inline-block;
}

.btn-navy,
.btn-bronze,
.btn-light-blue,
.btn-grey,
.btn-cream {
  transition:
    background-color 0.25s ease,
    color 0.25s ease !important;
}

.btn-navy {
  background-color: var(--navy) !important;
  color: #fff;
}
.btn-navy:hover {
  background-color: var(--light-blue) !important;
  color: var(--dark-navy);
}

.btn-bronze {
  background-color: var(--bronze) !important;
  color: #fff;
}
.btn-bronze:hover {
  background-color: var(--cream) !important;
  color: var(--bronze);
}

.btn-light-blue {
  background-color: var(--light-blue) !important;
  color: var(--dark-navy);
}
.btn-light-blue:hover {
  background-color: var(--dark-navy) !important;
  color: var(--light-blue);
}

.btn-grey {
  background-color: var(--grey) !important;
  color: var(--dark-navy);
}
.btn-grey:hover {
  background-color: var(--dark-navy) !important;
  color: var(--grey);
}

.btn-cream {
  background-color: var(--cream) !important;
  color: var(--dark-navy);
}
.btn-cream:hover {
  background-color: var(--dark-navy) !important;
  color: var(--cream);
}

.btn-sm {
  display: inline-block;
  padding: 0 4px 12px;
  border-bottom: 1px solid currentColor;
  background: none;
  font-family: var(--font-pacaembu);
  font-size: 1rem;
  font-weight: 300;
  line-height: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
}

.btn-navy-underline {
  color: var(--navy);
  border-bottom-color: var(--navy);
  transition: transform 0.25s ease;
}
.btn-navy-underline:hover {
  transform: translateY(-4px);
}

@media (min-width: 1600px) {
  #menu-main-menu li a {
    padding-left: 2.5rem;
  }
}

/* Page-specific */
.home-hero-btn {
  padding: 2rem;
  white-space: nowrap;
  display: block;
}

@media (max-width: 600px) {
  .home-hero-btn {
    padding: 1.25rem;
  }
}

@media (max-width: 980px) {
  .pa-open-mobile-menu .et_pb_menu__menu {
    display: flex !important;
    flex-direction: column !important;
  }
  .pa-open-mobile-menu .et_mobile_nav_menu {
    display: none !important;
  }
  #menu-footer-menu {
    flex-direction: column !important;
    align-items: center;
  }
}


/*  Header CTA Buttons  */
/* Shared base style for the three header CTAs:
 *    Pet Portal, New Patient Referral, Request an Appointment */
.btn-pet-portal,
.btn-referral,
.btn-book {
	  display: flex;
	  height: 42px;
	  padding: var(--sds-size-space-300, 12px) 20px;
	  justify-content: center;
	  align-items: center;
	  gap: var(--sds-size-space-200, 8px);
	  border-radius: 10px;
	  border: 0 solid var(--cream, #E5E1D6);
	  color: #FFF !important;
	  font-family: var(--font-pacaembu);
	  font-size: 12px;
	  font-style: normal;
	  font-weight: 400;
	  line-height: normal;
	  letter-spacing: 3.6px;
	  text-transform: uppercase;
	  box-sizing: border-box;
}

.btn-pet-portal {
	  width: 238px;
	  background: var(--brown, #352118) !important;
}

.btn-referral {
	  width: 334px;
	  background: #55441C !important;
}

.btn-book {
	  width: 360px;
	  background: #454E59 !important;
}

/* Mobile overrides */
@media (max-width: 980px) {
	  .btn-pet-portal,
	  .btn-referral,
	.btn-book {
		    width: auto;
		    height: auto;
		    padding: 8px 12px;
		    gap: 10px;
		    border-radius: 6px;
		    font-weight: 300;
	}
}

	}
}
}
}
}
}