/* General ----------------------- */
:root {
  /* Primary (keep your blue) */
  --bs-primary: #2077ac !important;
  --bs-primary-rgb: 32, 119, 172 !important;

  /* Secondary (deep teal) */
  --bs-secondary: #1f6f78;
  --bs-secondary-rgb: 31, 111, 120;

  /* Accent (soft sky highlight) */
  --bs-accent: #8fd3f4;
  --bs-accent-rgb: 143, 211, 244;
}
html {scroll-behavior: smooth;}

body, html {
	height: 100%;
	min-height: 100%;
}
body {
	font-family: "Poppins", sans-serif;
  font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	color: #444;
	background-color: #FFF;
}
a {text-decoration: none;}

.img-cover {object-fit: cover;}

strong {font-weight: 600;}

.breadcrumb {
	font-family: 'Helvetica', sans-serif;
	font-weight: 300;
	background-color: transparent;
	margin: 0;
	font-size:80%;
}
.sans-serif, label, select, textarea, input {font-family: 'Helvetica', sans-serif;}

.tracking-tighter {letter-spacing: -.1em;}

.tracking-wider {letter-spacing: .1em;}

.fs-tiny {font-size: 70%;}

.fw-bold {font-weight: 600 !important;}

.fw-bolder {font-weight: 700 !important;}

.btn {
	font-weight: 600;
	text-transform: uppercase;
}
.btn, .form-control {
	-moz-border-radius: 0;
	-webkit-border-radius: 0;
	border-radius: 0;
}
.btn:hover {text-decoration: none !important;}

.h-200px {height: 200px;}

.h-150px {height: 150px;}

.h-100px {height: 100px;}

.h-50px {height: 50px;}

.w-200px {width: 200px;}

.w-150px {width: 150px;}

.w-100px {width: 100px;}

.w-50px {width: 50px;}

.lh-100px {line-height: 100px;}

.minw-100 {min-width:100%;}

.minh-100 {min-height:100%;}

.mw-0 {max-width: none;}

.vh-75 {height: 75vh;}

.vh-50 {height: 50vh;}

.vh-25 {height: 25vh;}

.gradient-dark-b {background-image: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.85));}

.gradient-dark-t {background-image: linear-gradient(rgba(0,0,0,.85), rgba(0,0,0,0));}

.border-2 {border-width: 2px;}

.border-3 {border-width: 3px;}

.border-4 {border-width: 4px;}

.border-6 {border-width: 6px;}

.form-control, .form-select {
	background-color: #efefef;
	border-color: #efefef;
	border-radius: 0;
}
cite {
	display: block;
	font-size: .8125rem;
	margin: 5px 0;
}
cite:before {content: "— ";}

.z-1 {z-index:-1;}

.z0 {z-index:0;}

.z1 {z-index:1;}

.z2 {z-index:2;}

/* Background & Text Utilities */
.bg-primary {
  background-color: var(--bs-primary) !important;
  color: #fff !important;
}
.text-primary {
  color: var(--bs-primary) !important;
}
.bg-secondary {
  background-color: var(--bs-secondary) !important;
  color: #fff !important;
}
.text-secondary {
  color: var(--bs-secondary) !important;
}
.text-accent {
  color: var(--bs-accent) !important;
}
.bg-darker{background-color:#3A3D42}
.bg-accent {
  background-color: var(--bs-accent) !important;
  color: #000 !important;
}
/* Buttons----------------------- */
.btn {
  border-radius:7px;
  letter-spacing:1px  
}
/* Solid Primary Button */
.btn-primary {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  background-color: rgba(var(--bs-primary-rgb), 1) !important;
  border-color: rgba(var(--bs-primary-rgb), 1) !important;
  color: #fff !important;
}
.btn-primary:disabled,
.btn-primary.disabled {
  background-color: rgba(var(--bs-primary-rgb), 0.65) !important;
  border-color: rgba(var(--bs-primary-rgb), 0.65) !important;
  color: #fff !important;
  opacity: 0.65;
}
/* Outline Primary Button */
.btn-outline-primary {
  color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
  background-color: transparent !important;
}
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
  color: #fff !important;
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}
.btn-outline-primary:disabled,
.btn-outline-primary.disabled {
  color: rgba(var(--bs-primary-rgb), 0.65) !important;
  border-color: rgba(var(--bs-primary-rgb), 0.65) !important;
  background-color: transparent !important;
  opacity: 0.65;
}
/*  Solid Secondary Button */
.btn-secondary {
  background-color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
  color: #fff !important;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:active {
  background-color: rgba(var(--bs-secondary-rgb), 1) !important;
  border-color: rgba(var(--bs-secondary-rgb), 1) !important;
  color: #fff !important;
}
.btn-secondary:disabled,
.btn-secondary.disabled {
  background-color: rgba(var(--bs-secondary-rgb), 0.65) !important;
  border-color: rgba(var(--bs-secondary-rgb), 0.65) !important;
  color: #fff !important;
  opacity: 0.65;
}
/*  Outline Secondary Button */
.btn-outline-secondary {
  color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
  background-color: transparent !important;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus,
.btn-outline-secondary:active {
  color: #fff !important;
  background-color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
}
.btn-outline-secondary:disabled,
.btn-outline-secondary.disabled {
  color: rgba(var(--bs-secondary-rgb), 0.65) !important;
  border-color: rgba(var(--bs-secondary-rgb), 0.65) !important;
  background-color: transparent !important;
  opacity: 0.65;
}
/*  Accent Buttons */
.btn-accent {
  background-color: var(--bs-accent) !important;
  border-color: var(--bs-accent) !important;
  color: #000 !important; /* black text for contrast */
}
.btn-outline-accent {
  color: var(--bs-accent) !important;
  border-color: var(--bs-accent) !important;
  background-color: transparent !important;
}
.btn-outline-accent:hover,
.btn-outline-accent:focus,
.btn-outline-accent:active {
  color: #000 !important;
  background-color: var(--bs-accent) !important;
  border-color: var(--bs-accent) !important;
}
/* Header ----------------------- */
#header .nav-item.active .nav-link {
  color: #fff;
}
.navbar-collapse.show {
	position: absolute;
	top: 0;
	left: 0;
	padding: 6.5em 1em 1em;
	background-color: #222;
	width: 100%;
	z-index: -1;
	text-align: center;
}
/* ARTICLES ----------------------- */
article p, article li, article > div {
  font-size: 125%;
	line-height: 1.6;
}
article p, article li {
	margin-bottom: 1em;
}
article img {
	max-width: 100%;
}
article h1, article h2, article h3, article h4, article h5, article h6 {
	margin: 1em 0 .5em;
}
/* Pagination ------------------ */
.pagination {
	-webkit-box-pack: center!important;
	-ms-flex-pack: center!important;
	justify-content: center!important;
	font-family: 'Montserrat', sans-serif;
}
.pagination a:not(:disabled):not(.disabled) {
	cursor: pointer;
}
.pagination a, .pagination span {
	position: relative;
	display: block;
	padding: .5rem .75rem;
	margin: 0;
	line-height: 1.25;
}
.pagination .disabled span, .pagination .active span {
	color: #6c757d;
	pointer-events: none;
	cursor: auto;
	border-color: #dee2e6;
}
/****************agent Cards ****************************/
.agent-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 12px;
  height: 100%;
  background: white;
}
.agent-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.agent-image-wrapper {
  position: relative;
  width: 180px;
  height: 180px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.agent-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.agent-card:hover .agent-image {
  transform: scale(1.1);
}
.agent-name {
  font-weight: 600;
  color: #2c3e50;
}
.agent-title {
  font-size: 0.9rem;
}
.agent-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 12px;
  height: 100%;
  background: white;
}
.agent-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}
.agent-image-wrapper {
  position: relative;
  width: 180px;
  height: 180px;
  margin: 0 auto;
  overflow: hidden;
  border-radius: 50%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.agent-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.agent-card:hover .agent-image {
  transform: scale(1.1);
}
.agent-name {
  font-weight: 600;
  color: #2c3e50;
}
.agent-title {
  font-size: 0.9rem;
}
/********** Section with statistics / circle icons *****************/
.section-bg-fixed{
  background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('../img/wfh-2.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-attachment: fixed;
}
.icon-circle {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  font-size: 2rem;
}
/********** Hero carousel to replace single image *****************/
.hero-carousel {
  position: relative;
  width: 100%;
  height: 90vh;
  overflow: hidden;
}
/********** Updates to allow carousel items to fade without black flash *****************/
.hero-carousel .slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1.8s ease-in-out;
  background-size: cover;
  background-position: center;
}
/* Active slide */
.hero-carousel .slide.active {
  opacity: 1;
  z-index: 2;
}
/********** hero carousel caption overlay *****************/
.hero-carousel .caption {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: rgba(0,0,0,0.45);
  color: #fff;
  z-index: 3;
  padding: 0 1rem;
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 700;
}
/********** Hero Carousel controls *****************/
.hero-carousel .control {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  font-size: 2rem;
  color: #fff;
  background: rgba(0,0,0,0.3);
  border: none;
  padding: 0.5rem 1rem;
  cursor: pointer;
}
.hero-carousel .prev { left: 1rem; }
.hero-carousel .next { right: 1rem; }
/* Indicators */
/* Indicators as horizontal lines */
.hero-carousel .indicators {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.5rem;
  z-index: 5;
}
.hero-carousel .indicators button {
  width: 30px;       /* line length */
  height: 4px;       /* line thickness */
  border-radius: 2px;
  border: none;
  background: rgba(255,255,255,0.5);
  cursor: pointer;
  transition: background 0.3s;
}
.hero-carousel .indicators button.active {
  background: #fff;  /* filled line */
}
/* Gradient overlay over each slide */
.hero-carousel .slide::before {
  content: "";
  position: absolute;
  inset: 0; /* top:0; right:0; bottom:0; left:0; */
  background: linear-gradient(40deg,rgba(2, 0, 36, 1) 0%, rgba(9, 9, 121, 1) 35%, rgba(5, 103, 183, 1) 65%, rgba(2, 165, 224, 1) 85%);
  opacity: 0.5;
  z-index: 2; /* behind caption (z-index:3) but above image (z-index:1) */
}
/***** corner number style *****/
.step-corner {
  width: 100px;
  height: 100px;
  color: #3579ad;
  font-size: 72px;
  font-weight: 700;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0 0 32px 0;
  position: absolute;
  left: 20px;
  top: 20px;
}
.col-lg-10 li::marker {
  color: rgba(144, 195, 225, 0.6);
}
/* FOOTER ----------------------- */
#footer a {color: #F8F9FA;}

#footer a:hover {text-decoration: underline;}

.social-links .rounded-circle {
	padding: 0;
	height: 35px;
	width: 35px;
	line-height: 35px;
	text-align: center;
}
/********** preheadline for carousel hero items *****************/
.subhead{
font-family: open sans;
  font-style: italic;
  color: var(--bs-primary) !important;
 letter-spacing: 4px;
  font-weight: normal;
  font-size: 22px !important;}

/***** learn how button style (may not be used)***/
.learn-how{color:#59707D;font-weight:bold}

/**** constrain site logo****/
.site-logo {max-width:200px;padding:10px 0px}

/**** blog images***/
.blog-img {border-radius: 0 0 32px 0;}

/*****Menu Underline Swoosh*****/
.swoosh {
  position: relative;
  display: inline-block;
  text-decoration: none;
}
.swoosh::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 3px; /* thickness of swoosh */
  background:#29739C; /* swoosh color */
  transform: scaleX(0);
  transform-origin: bottom right;
  transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
}
.swoosh:hover::after {
  transform: scaleX(1);
  transform-origin: bottom left;
}
/**** Underline penlike swoosh to highlight word(s) in headlines***/
/* Ensure the parent h1 is relative for proper stacking */
.slide.active .caption h1 {
  position: relative;
}
/* ----------------------- */
/* Base highlight swoosh */
.highlight-swoosh {
  position: relative;
  display: inline-block;
  z-index: 0;
}
.highlight-swoosh::after {
  content: '';
  position: absolute;
  left: 0;
 bottom: 0.05em;    /* distance under text */
  width: 100%;
  height: 8px;          /* swoosh thickness */
  z-index: -1;
  background-color: var(--swoosh-color, var(--bs-primary));
  /* Pen-like curve using SVG mask */
  -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" width="100" height="8"><path d="M0,4 Q25,0 50,4 T100,4" stroke="white" stroke-width="8" fill="none" stroke-linecap="round"/></svg>') repeat-x;
  -webkit-mask-repeat: repeat-x;
  -webkit-mask-size: 100% 100%;
  mask: url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" width="100" height="8"><path d="M0,4 Q25,0 50,4 T100,4" stroke="white" stroke-width="8" fill="none" stroke-linecap="round"/></svg>') repeat-x;
  mask-repeat: repeat-x;
  mask-size: 100% 100%;
}
/* Modifier classes for each color */
.highlight-swoosh.primary { --swoosh-color: var(--bs-primary); }
.highlight-swoosh.secondary { --swoosh-color: var(--bs-secondary); }
.highlight-swoosh.accent { --swoosh-color: var(--bs-accent); }
/********************* Footer ***************************************/
.contact-icon-circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: var(--bs-primary) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background-color 0.3s ease;
  padding: 10px;
}
.contact-icon-circle:hover {
  background-color: #1a5f8a;
}
.contact-icon-circle i {
  font-size: 14px;
  color: #ffffff;
}
.contact-icon-circle svg {
  width: 14px;
  height: 14px;
  color: #ffffff;
}
/*****************Ken Burns Effect *************************/
@keyframes kenBurns {
  0% {
    transform: scale(1) translate(0, 0);
  }
  100% {
    transform: scale(1.1) translate(-2%, -2%);
  }
}
.ken-burns-effect {
  animation: kenBurns 20s ease-in-out infinite alternate;
  transform-origin: center center;
}
/************ Hamburger Menu styling to replace hamburger img ********/
/* Smooth transitions */
.navbar-collapse {
  transition: all 0.3s ease-in-out;
}
.navbar-toggler {
  position: relative;
  width: 40px;
  height: 40px;
  border: none !important;
  padding: 0;
  background: transparent;
}
.navbar-toggler .hamburger-bar {
  display: block;
  width: 28px;
  height: 3px;
  background-color: #fff;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  transition: all 0.3s ease;
  border-radius: 2px;
}
/* Initial spacing */
.navbar-toggler .hamburger-bar:nth-child(1) { top: 11px; }
.navbar-toggler .hamburger-bar:nth-child(2) { top: 18.5px; }
.navbar-toggler .hamburger-bar:nth-child(3) { top: 26px; }

/* Perfect X - all bars meet at center (18.5px) */
.navbar-toggler.active .hamburger-bar:nth-child(1) {
  top: 18.5px;
  transform: translateX(-50%) rotate(45deg);
}
.navbar-toggler.active .hamburger-bar:nth-child(2) {
  opacity: 0;
  transform: translateX(-50%) scale(0.1);
}
.navbar-toggler.active .hamburger-bar:nth-child(3) {
  top: 18.5px;
  transform: translateX(-50%) rotate(-45deg);
}
.navbar-toggler {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler:focus-visible {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}
/* RESPONSIVE CSS ----------------------- */
@media (max-width: 767px) {
  .hero-carousel {
    height: 65vh;
  }
  .hero-carousel .caption {
    font-size: clamp(1.5rem, 5vw, 2.5rem);
  }
}
@media (min-width: 768px) {
  
}
@media (min-width: 768px) and (max-width: 991px) {
  
}
@media (max-width: 991px) {
  .navbar-brand img {
    max-height: 70px;
  }
  .wrap-content {
    margin-top: -95px;
  }
  .step {
    position: absolute;
    top: -50px;
  }
  .step-corner {
    top: -40px;
    left:0px;
    width: 80px;
    height: 80px;
    font-size: 60px;
    left: 0px;
  }
}
@media (min-width: 992px) {
  .navbar-brand img {
    max-height: 90px;
  }
  .wrap-content {
    margin-top: -110px;
  }
}
@media (min-width: 992px) and (max-width: 1200px) {
  .step {
    margin-left: -35px;
  }
}
@media (max-width: 1200px) {
  .navbar-brand {
    line-height: 65px;
    padding: 0;
    margin: 0;
  }
}
@media (min-width: 1201px) {
  .h1, h1 {
    font-size: 3.2rem;
  }
  #header .nav-item .nav-link {
    line-height: 65px;
  }
}