/*
  Metric-matched fallbacks for Avenir LT Std and Proxima Nova.
  The webfonts stay the fonts that actually paint. These local faces only
  hold the same width and line box until the webfont arrives, so the swap
  does not move text. Overrides are calculated from the font files' em
  square and average character width against Arial / Arial Bold.
*/
@font-face {
  font-family: "Avenir Fallback";
  src: local("Arial"), local("Liberation Sans"), local("Arimo");
  font-weight: 400;
  font-style: normal;
  size-adjust: 101.88%;
  ascent-override: 74.19%;
  descent-override: 23.96%;
  line-gap-override: 19.65%;
}
@font-face {
  font-family: "Avenir Fallback";
  src: local("Arial"), local("Liberation Sans"), local("Arimo");
  font-weight: 500;
  font-style: normal;
  size-adjust: 102.88%;
  ascent-override: 73.47%;
  descent-override: 23.73%;
  line-gap-override: 19.46%;
}
@font-face {
  font-family: "Avenir Fallback";
  src: local("Arial Bold"), local("Liberation Sans Bold"), local("Arimo Bold");
  font-weight: 700;
  font-style: normal;
  size-adjust: 99.69%;
  ascent-override: 75.82%;
  descent-override: 24.49%;
  line-gap-override: 20.08%;
}
@font-face {
  font-family: "Avenir Fallback";
  src: local("Arial Bold"), local("Liberation Sans Bold"), local("Arimo Bold");
  font-weight: 900;
  font-style: normal;
  size-adjust: 99.69%;
  ascent-override: 75.82%;
  descent-override: 24.49%;
  line-gap-override: 20.08%;
}
@font-face {
  font-family: "Proxima Fallback";
  src: local("Arial"), local("Liberation Sans"), local("Arimo");
  font-weight: 400;
  font-style: normal;
  size-adjust: 100.44%;
  ascent-override: 88.62%;
  descent-override: 21.78%;
  line-gap-override: 0%;
}

:root {
  --headerFont: "Avenir LT Std", "Avenir Fallback", Arial, sans-serif;
  --bodyFont: "Proxima Nova", "Proxima Fallback", Arial, sans-serif;
  --primary: #247094;
  --Fallbrook-Blue: #113d63;
  --primary2: #f8fbf8;
  --energy1: #b6cb98;
  --energy2: #66893e;
  --energy-gradient: linear-gradient(60deg, #66893e 0%, #5dad02 100%),
    linear-gradient(84deg, #66893e 0%, #b6cb98 100%);
  --secobdary1: #247094;
  --secondary2: #a3b5c0;
  --secondary3: #dad5cf;
  --yellow: #f9c304;
  --yellow-lite: #fff7dd;
  --color: #1c1c1c;
  --snow-White: #f8fbf8;
}

body {
  font-family: var(--bodyFont);
  color: var(--color);
  line-height: 1.4;
}

span.ms-1 {
  font-size: 14px !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--headerFont);
  color: var(--secobdary1);
}

p {
  font-family: var(--bodyFont);
}

a,
a:hover {
  text-decoration: none;
}

.shadow-none {
  box-shadow: none !important;
}
.btn {
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.21px;
}
.btn-primary {
  color: #fff;
  background-color: var(--primary);
  border-color: var(--primary);
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}
.btn-primary:hover {
  color: #fff;
  background-color: var(--primary);
  border-color: var(--primary);
}
.btn-white {
  color: #0060ba;
  background-color: #fff;
  border-color: #fff;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}
.btn-white:hover {
  color: #0060ba;
  background-color: #fff;
  border-color: #fff;
}
.btn-yellow {
  color: #fff;
  background-color: var(--yellow);
  border-color: var(--yellow);
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}
.btn-yellow:hover {
  color: #fff;
  background-color: var(--yellow);
  border-color: var(--yellow);
}
.btn-secondary {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  border-color: var(--yellow);
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  font-weight: 600;
  font-size: 16px;
  overflow: hidden;
  position: relative;
}

.btn-hover-effect:after {
  background: #fff;
  content: "";
  height: 155px;
  left: -75px;
  opacity: 0.2;
  position: absolute;
  top: -50px;
  transform: rotate(35deg);
  transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
  width: 50px;
  z-index: 10;
}

.btn-hover-effect:hover:after {
  left: 120%;
  transition: all 0.7s cubic-bezier(0.19, 1, 0.22, 1);
}

.btn-secondary:hover {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  border-color: var(--yellow);
}

.text-primary {
  color: var(--primary) !important;
}
.text-fallbrook {
  color: var(--Fallbrook-Blue) !important;
}

.container-fluid {
  max-width: 1650px;
}

.sec_header h3 {
  color: #247094;
  font-size: 40px;
  font-weight: 700;
  line-height: 122.5%;
}
.sec_header p {
  font-size: 18px;
  font-weight: 500;
}
.text-yellow {
  color: var(--yellow) !important;
}
.text-energy {
  color: var(--energy2) !important;
}
.fw-semi {
  font-weight: 600 !important;
}
.bg-primary {
  background-color: var(--primary) !important;
}
.bg-yellow {
  background-color: var(--yellow) !important;
}
.bg-energy {
  background-color: var(--energy2) !important;
}

.bg .form-select,
.form-control {
  border-radius: 50px;
  border: 2.5px solid var(--primary) !important;
  color: var(--primary);
  height: 50px;
  padding: 0 1.5rem;
  box-shadow: none !important;
}
.form-control::placeholder {
  color: var(--primary);
  opacity: 0.5;
}

/*<<==============Header=============>>>>*/
.header {
  background: #fff;
  box-shadow: 0 0 5px 0 #777676;
}
.header .navbar-brand img {
  max-width: 200px;
}
.header .navbar .navbar-nav .nav-link {
  color: #000;
  font-family: var(--bodyFont);
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.21px;
  padding-right: 1rem;
  padding-left: 1rem;
}
.header .navbar .navbar-nav .nav-link.active {
  color: var(--primary);
}
.header .btn-primary {
  margin-left: 1rem;
}
/*<<==============Header=============>>>>*/

/*<<==============HeroBanner=============>>>>*/
.hero_banner {
  position: relative;
  z-index: 0;
  text-shadow: 0 0 1px #111;
  /* min-height: 670px; */
}
.hero_bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
}
.banner_item video {
  object-fit: cover;
  object-position: top;
}
.text-primarys {
  color: #66893e !important;
}
.btn-primarys {
  color: #fff;
  background-color: var(--energy2);
  border-color: var(--energy2);
}
.hero_banner .btn-primarys {
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}
.hero_banner .content {
  display: flex;
  align-items: center;
  height: 100%;
  /* min-height: 670px; */
  position: absolute;
  top: 50%;
  z-index: 2;
  transform: translateY(-50%);
  width: 100%;
  background: #00000062;
  /* height: 100%; */
}
.hero_banner .content .btn {
  text-shadow: none !important;
}
.hero_banner .content.bg_inverse {
  background: #ffffff88;
}
.hero_banner .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}
.text-shadow {
  text-shadow: 0 0 1px #111;
}
.hero_banner .content h2 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%; /* 73.5px */
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}
.hero_banner .content h2 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}
.hero_banner .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  /* line-height: 122.5%; */
  line-height: 102.5%;
  letter-spacing: -1.2px;
}
.hero_banner .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}
/*<<==============HeroBanner=============>>>>*/

/*<<==============HeroBannerInner=============>>>>*/
.hero_banner_inner {
}
.hero_banner_inner h3 {
  color: var(--Fallbrook-Blue);
  font-family: var(--headerFont);
  font-size: 66px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  margin-bottom: 1rem;
}
.hero_banner_inner h2 {
  color: #f9c304;
  font-family: var(--headerFont);
  font-size: 66px;
  font-style: normal;
  font-weight: 750;
  line-height: normal;
}
.hero_banner_inner p {
  color: #1e1e1e;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 1.4;
}
/*<<==============HeroBannerInner=============>>>>*/

/*<<==============Team Area=============>>>>*/
.team_block.card {
  border: 0;
  margin-bottom: 1rem;
  cursor: pointer;
  max-width: 280px;
  margin-left: auto;
  margin-right: auto;
  height: 100%;
}
.team_block.card .card-body {
  padding: 0;
}
.team_block.card .card-footer {
  border: 0;
  background: transparent;
  padding: 0;
}
.team_block.card .card-footer a {
  display: flex;
  align-items: center;
  color: #7b888e;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 99.6%;
  /* text-transform: capitalize; */
}
.team_block.card .team_img {
  border-radius: 25px;
  /* background-color: #ccd7dc; */
  position: relative;
  height: 350px;
  max-width: 280px;
}
.team_block.card .team_content {
  padding: 1rem 0;
}
.team_block.card .team_img img {
  /* max-width: 278px; */
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 30px;
  position: absolute;
  bottom: 0;
  height: 100%;
  left: 0;
}
.team_block.card .team_content h3 {
  color: #1d71a8;
  font-size: 28px;
  font-style: normal;
  font-weight: 300;
  line-height: 95%;
  letter-spacing: -1.14px;
  text-transform: uppercase;
}
.team_block.card .team_content h3 span {
  color: var(--Fallbrook-Blue);
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  line-height: 89.6%;
  letter-spacing: -0.9px;
  text-transform: uppercase;
  display: block;
  margin-bottom: 0.5rem;
}
.team_block.card .team_content p {
  color: #f9c304;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 99.6%;
  letter-spacing: 0.9px;
  text-transform: uppercase;
  position: relative;
  margin-top: 30px;
  border-radius: 5px;
  background: #247094;
  padding: 0.5rem 1rem;
  /* margin: 0; */
}
.team_block.card .team_content p::before {
  content: "";
  width: 37.681px;
  height: 1.077px;
  background: #7b888e;
  position: absolute;
  top: -20px;
  left: 0;
}
.team_right_area.slide {
  padding-left: 550px;
}
.team_left_area {
  position: sticky;
  width: 500px;
  top: 40px;
  z-index: 99;
}
.team_left_area .team_block.card {
  max-width: 300px;
  margin: 0 auto;
}
.footer_social a {
  font-size: 24px !important;
}
.footer_social {
  margin: 1rem 0.5rem;
}
.footer_social p {
  margin-bottom: 5px;
}

.team_left_area .team_block.card .team_content p::before {
  left: 50%;
  transform: translateX(-50%);
}
.team_left_area .team_block.card .card-footer a {
  justify-content: center;
}

.team_left_area .team_block.card::before {
  content: "";
  width: calc(100% + 30px);
  height: 100%;
  position: absolute;
  border-radius: 20.146px;
  /* background: linear-gradient(180deg, #f9c304 0%, rgba(249, 195, 4, 0) 57.29%); */
  background: linear-gradient(180deg, #f9c304 0%, rgba(249, 195, 4, 0) 57.29%);
  top: 90px;
  left: -15px;
  opacity: 0.5;
}

@media only screen and (min-width: 1800px) {
  .team_right_area.slide {
    padding-left: 550px;
  }
  .team_left_area {
    position: sticky;
    width: 500px;
  }
  .team_left_area .team_block.card {
    max-width: 325px;
  }
  .team_left_area .team_block.card .team_img {
    max-width: 325px;
    height: 400px;
  }
  .team_left_area .team_block.card {
    max-width: 380px;
  }
}

@media only screen and (max-width: 1400px) {
  .team_right_area.slide {
    padding-left: 350px;
  }
  .team_left_area {
    position: sticky;
    width: 320px;
  }
  .team_left_area .team_block.card {
    max-width: 300px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .header .navbar .navbar-nav .nav-link {
    padding-left: 7px;
    padding-right: 7px;
  }
  .team_left_area .team_block.card::before {
    width: calc(100% + 10px);
    left: -5px;
  }
}

/* @media only screen and (max-width: 991px) {
  .team_left_area {
    position: static !important;
    width: 100%;
    margin-bottom: 2rem;
  }
  .team_right_area.slide {
    padding-left: 0px;
    margin-top: 0 !important;
  }
} */

@media only screen and (max-width: 991px) {
  .team_left_area {
    position: fixed !important;
    width: 95%;
    margin-bottom: 2rem;
    height: 100vh;
    top: 0;
    left: 0;
    max-width: 320px;
    background: #fff;
    z-index: 9999;
    box-shadow: 0 0 17px 0 #1111;
    overflow-x: hidden;
    padding: 15px;
  }

  .team_left_area .team_block.card {
    max-width: 300px;
    height: auto;
  }

  .team_left_area .team_block.card::before {
    top: -70px;
  }
  .team_right_area.slide {
    padding-left: 0px;
    margin-top: 0 !important;
  }
}
/*<<==============Team Area=============>>>>*/

/*<<==============Banner Menu Area=============>>>>*/
.banner_menu {
  margin-top: -40px;
  position: relative;
  z-index: 999;
}
.banner_menu .nav-item {
  margin: 10px;
}
.banner_menu .nav-link {
  border-radius: 10px;
  background: #fff;
  box-shadow: 0px 20px 30px 0px rgba(5, 75, 141, 0.23);
  color: var(--primary);
  font-family: var(--bodyFont);
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  padding: 1rem 1.5rem;
}
.banner_menu .nav-pills .nav-link.active,
.banner_menu .nav-pills .show > .nav-link {
  color: #fff;
  background-color: var(--primary);
}
/*<<==============Banner Menu Area=============>>>>*/

/*<<==============About us Area=============>>>>*/
.about_us h3 {
  color: #1c1c1c;
  font-family: var(--headerFont);
  font-size: 50px;
  font-weight: 400;
  line-height: 122.5%;
}
.about_us h3 span {
  color: var(--primary);
  font-weight: 700;
}
.about_us h6 {
  color: var(--Fallbrook-Blue);
  font-size: 20px;
  font-weight: 600;
}
.about_us p {
  color: var(--color);
  font-size: 18px;
  font-weight: 400;
  margin: 10px 0;
  line-height: 1.4;
}
.about_us p span {
  font-weight: 600;
  background: var(--primary);
  color: var(--yellow);
  border-radius: 3px;
  padding: 3px;
  margin: 0 5px;
}
.about_us small {
  color: #b5b5b5;
  font-size: 20px;
}
/*<<==============About us Area=============>>>>*/

/*<<==============Specialities=============>>>>*/
.our_specialities {
  background: var(--snow-White);
}
.specialsy_block {
  border-radius: 20px;
  background: #fff;
  box-shadow: 0px 11px 30px -10px rgba(16, 85, 150, 0.25);
  padding: 1.5rem 1rem;
  position: relative;
  z-index: 0;
  overflow: hidden;
}
.specialsy_block::after,
.specialsy_block.active::after {
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: linear-gradient(60deg, #113d63 0%, #247094 100%),
    linear-gradient(84deg, #247094 0%, #209efa 100%, #0083ff 100%);
  position: absolute;
  transition: all ease 0.3s;
  z-index: -1;
  opacity: 0;
}
.specialsy_block:hover::after,
.specialsy_block.active:hover::after {
  opacity: 1;
}
.specialsy_block h4 {
  color: var(--primary);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  text-transform: uppercase;
}
.specialsy_block p {
  color: #000;
  font-size: 16px;
  font-weight: 500;
  line-height: 129.5%;
}
.specialsy_block ul {
  margin: 0;
}
.specialsy_block ul li {
  color: #000;
  font-size: 16px;
  font-weight: 500;
  line-height: 129.5%;
}
/* .specialsy_block:hover,
.specialsy_block.active {
  background: linear-gradient(60deg, #113d63 0%, #247094 100%),
    linear-gradient(84deg, #247094 0%, #209efa 100%, #0083ff 100%);
} */
.specialsy_block:hover p,
.specialsy_block:hover ul li,
.specialsy_block:hover h4,
.specialsy_block.active p,
.specialsy_block.active ul li,
.specialsy_block.active h4 {
  color: #fff;
}
.specialsy_block:hover img,
.specialsy_block.active img {
  filter: hue-rotate(190deg) brightness(1.7);
}

@media only screen and (max-width: 575px) {
  .specialsy_block {
    text-align: center;
  }
  .specialsy_block ul {
    list-style: none;
    padding: 0;
  }
}

/*<<==============Specialities=============>>>>*/

/*<<==============Clients=============>>>>*/
.our_clients {
}
.our_clients .clients_left h3 {
  color: var(--yellow);
}
.client_block {
  border-radius: 20px;
  background: #fff;
  box-shadow: 0px 11px 40px 0px rgba(16, 85, 150, 0.15);
  height: 100%;
}
.client_block img {
  margin-bottom: 2rem;
}
.client_block h5 {
  color: var(--yellow);
  font-size: 20px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 1rem;
}
.client_block p {
  color: #000;
  font-size: 18px;
  font-weight: 500;
  line-height: 129.5%;
}
/*<<==============Clients=============>>>>*/

/*<<==============Invenstment Types=============>>>>*/
.investment_types {
  background-image: linear-gradient(84deg, #f2c94c 0%, #d4a017 100%);
  background-color: #f2c94c;
}

.investment_block {
  border-radius: 30px;
  background: #fff;
  overflow: hidden;
}
.investment_block ol {
  padding: 0;
  margin: 0;
}
.investment_block ol li {
  color: var(--primary);
  font-size: 20px;
  font-weight: 600;
  line-height: normal;
  margin: 20px 0;
  list-style: none;
  position: relative;
  padding-left: 45px;
  width: fit-content;
}
.investment_block ol li span {
  position: absolute;
  left: 0;
  top: -3px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid var(--primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.investment_block ol li:hover {
  color: var(--yellow);
}
.investment_block ol li:hover span {
  border-color: var(--yellow);
}
.investment_left {
  overflow: hidden;
}
.investment_left img {
  animation: scale 15s linear 0s infinite alternate;
  width: 100%;
}
@keyframes scale {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(1.25);
  }
}
/*<<==============Invenstment Types=============>>>>*/

/*<<==============News and Updates=============>>>>*/
.news_block {
  border-radius: 30px;
  background: #fff;
}
.owl-carousel .owl-stage {
  display: flex;
}
.news_item {
  display: flex;
  flex: 1 0 auto;
  height: 100%;
}
.news_block {
  position: relative;
  overflow: hidden;
  /* margin-bottom: 80px; */ /*This is optional*/
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.owl-theme .owl-dots .owl-dot span {
  background: var(--primary);
  opacity: 0.3;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: var(--primary);
  opacity: 1;
}
/*<<==============News and Updates============>>>>*/

/*<<==============NewsLetter============>>>>*/
.letter_card {
  border-radius: 30px;
  background-image: url(../images/pattern.png),
    linear-gradient(270deg, #3891dd 0%, #113d63 100%);
/*   background-repeat: no-repeat; */
  background-blend-mode: darken;
  overflow: hidden;
}
.letter_card h4 {
  color: #fff;
  font-size: 30px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.subscribe_block {
  position: relative;
}
.subscribe_block input.form-control {
  background: transparent;
  color: #fff;
  border: 2.5px solid var(--yellow) !important;
  padding-right: 110px;
}
.subscribe_block input.form-control::placeholder {
  color: #fff;
  opacity: 1;
  font-weight: 500;
}
.subscribe_block .btn {
  position: absolute;
  right: 0;
  top: 0;
  height: 50px;
  width: 100px;
  border-radius: 0px 30px 30px 0px;
}
/*<<==============NewsLetter============>>>>*/

/*<<==============Unlock power============>>>>*/
.unlock_power .accordion {
}
.unlock_power .accordion .accordion-item {
  margin: 1.25rem 0;
  border: 0;
}
.unlock_power .accordion .accordion-item .accordion-button {
  border-radius: 20px;
  background: linear-gradient(84deg, #113d63 0%, #247094 100%), #247094;
  color: #fff;
  padding: 20px 30px;
  color: #f8fbf8;
  font-family: var(--bodyFont);
  font-size: 22px;
  font-weight: 500;
  box-shadow: none;
}
.unlock_power .accordion .accordion-item .accordion-button::after {
  background-color: #fff;
  width: 25px;
  height: 25px;
  display: flex;
  border-radius: 50%;
  background-position: center;
  background-size: 1rem !important;
}
/*<<==============NewsLetter============>>>>*/

/*<<==============Tax Credits============>>>>*/
.investment_credit.our_clients .client_block {
  transition: all ease 0.3s;
}
.investment_credit.our_clients .client_block:hover {
  border-radius: 20px;
  background: linear-gradient(60deg, #113d63 0%, #2279c5 100%),
    linear-gradient(60deg, #373737 0%, #5b5b5b 100%), #fff;
  box-shadow: 0px 11px 40px 0px rgba(16, 85, 150, 0.15);
  transition: all ease 0.3s;
}
.investment_credit.our_clients .client_block:hover h5,
.investment_credit.our_clients .client_block:hover p {
  color: #fff !important;
}
.investment_credit.our_clients .client_block:hover img {
  /* filter: grayscale(1) brightness(2.5); */
}
.investment_credit.our_clients .client_block img {
  transition: all ease 0.1s;
}
.investment_credit.our_clients .client_block img:last-child {
  opacity: 0;
}
.investment_credit.our_clients .client_block:hover img:first-child {
  opacity: 0;
}
.investment_credit.our_clients .client_block:hover img:last-child {
  opacity: 1;
}
/*<<==============Tax Credits============>>>>*/

/*<<==============Export Tax============>>>>*/
.export_tax_block {
  display: flex;
  margin: 1rem 0;
  /* max-width: 400px; */
}
.export_tax_block .icon {
  background: #d1e9ff;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
}
.export_tax_block .dtl {
  width: calc(100% - 50px);
  padding-left: 15px;
}
.export_tax_block .dtl h6 {
  color: var(--primary);
  font-family: var(--bodyFont);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0.26px;
  text-transform: uppercase;
}
.export_tax_block .dtl p {
  color: #1c1c1c;
  font-size: 20px;
  font-weight: 400;
}
.export_tax img {
  object-fit: cover;
  border-radius: 10px;
  object-position: center center;
}
/*<<==============Export Tax============>>>>*/

/*<<==============Inner page Team============>>>>*/
.inner_team_block a {
  color: var(--Fallbrook-Blue);
  font-weight: 600;
}
.inner_team_block a .icon svg {
  transform: translateY(-2px);
}
.inner_team_block {
  border-radius: 20px;
  overflow: hidden;
  margin: 1rem 0;
  height: 100%;
}
.inner_team_block .details {
  background: rgba(210, 221, 231, 0.5);
  padding: 2rem 1.5rem 1rem 1.5rem;
}
.inner_team_block .image img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
/*<<==============Inner page Team============>>>>*/

/*<<==============footer=============>>>>*/
.footer {
  background: var(--primary);
  color: #fff;
}
.footer a {
  color: #fff;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.22px;
}
.footer_alert {
  background: var(--Fallbrook-Blue);
  margin: 1.5rem 0;
  padding: 1rem 1.5rem;
  border-radius: 15px;
}
.footer_alert p {
  color: #f8fbf8;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: -0.24px;
  margin-bottom: 0;
}
.btn-info {
  background-color: var(--yellow) !important;
  border-color: var(--yellow) !important;
  border-radius: 30px;
  color: var(--Fallbrook-Blue) !important;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  padding: 0.5rem 1.5rem;
}
.footer_bottom p {
  text-align: center;
  color: #fff;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  letter-spacing: 0.22px;
  opacity: 0.7;
  margin-bottom: 0;
  margin-top: 1rem;
}
/*<<==============footer=============>>>>*/

/*<<==============Energy Modifications=============>>>>*/
.energy .text-primary {
  color: var(--energy2) !important;
}
.energy .btn-primary {
  color: #fff;
  background-color: var(--energy2);
  border-color: var(--energy2);
}
.energy .sec_header h3 {
  color: var(--energy2);
}
.unlock_power.energy .accordion .accordion-item .accordion-button {
  background-image: var(--energy-gradient);
  background-color: var(--energy2);
}
.unlock_power.energy {
  background: rgba(90, 155, 16, 0.05);
}
/*<<==============Energy Modifications=============>>>>*/

/*<<==============Renewable Energy Type=============>>>>*/
.rt_block {
  display: flex;
  align-items: center;
}
.rt_block .image {
  width: 90px;
  height: 90px;
  background-color: #bcd9f5;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.rt_block .image img {
  width: 65px;
  object-fit: contain;
}
.rt_block .content {
  width: calc(100% - 90px);
  padding-left: 15px;
}
.rt_block .content h5 {
  color: #247094;
  font-size: 24px;
  font-weight: 600;
}
.rt_block .content p {
  color: #383838;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.3;
}
.col-lg-6:last-child .rt_block .image {
  /* background-color: #feedb4; */
}
/*<<==============Renewable Energy Type=============>>>>*/

/*<<==============Renewable Services=============>>>>*/
.renewable_services {
  width: 100%;
  overflow: hidden;
}
.rs_right .badge {
  border-radius: 7px;
  background: var(--energy2);
  text-transform: uppercase;
  padding: 10px 20px;
  font-size: 16px;
  display: block;
  width: fit-content;
  margin-bottom: 1rem;
}
.rs_right p {
  color: #1c1c1c;
  font-size: 18px;
  font-weight: 500;
  line-height: 30px;
  margin: 0;
}
.rs_right h6 {
  color: var(--primary);
  font-size: 18px;
  font-weight: 700;
  line-height: 30px; /* 125% */
  margin-bottom: 0rem;
}
/*<<==============Renewable Services=============>>>>*/

/*<<==============Renewable Form=============>>>>*/
.renewable_form_block {
  border-radius: 20px;
  background-image: url(../images/pattern2.png),
    linear-gradient(270deg, var(--energy2) 0%, var(--energy2) 100%);
  background-blend-mode: darken;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-size: cover;
  color: #fff;
  text-align: center;
}
.renewable_form_block p {
  margin: 0;
  margin-bottom: 0.5rem;
}
.renewable_form_block h3 {
  color: #fff;
  font-weight: 700;
  font-size: 28px;
  margin-bottom: 1.5rem;
}
.renewable_form_block .form-control {
  border-radius: 10px;
  border: 2.5px solid #fff !important;
  background-color: transparent;
  color: #fff !important;
}
.renewable_form_block .form-control::placeholder {
  opacity: 0.75;
  color: #fff;
}
.renewable_form_block .btn {
  border-radius: 10px;
  color: #2f4e0d;
  font-weight: 500;
}
/*<<==============Renewable Form=============>>>>*/

/*<<==============Affordable Experience=============>>>>*/
.affordable_housing {
  background: #f8fbf8;
}
/*<<==============Affordable Experience=============>>>>*/

/*<<==============Tax credit work=============>>>>*/
.tax_credit {
  position: relative;
  z-index: 0;
  min-height: 400px;
}
.tax_credit img {
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  width: 100%;
  object-fit: cover;
  height: 100%;
}
/*<<==============Tax credit work=============>>>>*/

/*<<==============services for investors=============>>>>*/
.bg-custom {
  background: #f8fbf8 !important;
}
.services_investors .si_left img {
  border-radius: 10px;
}
.services_investors .si_right h6 {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  background-color: var(--yellow);
  width: fit-content;
  padding: 5px 15px;
  border-radius: 0px 40px 40px 0px;
}
/*<<==============services for investors=============>>>>*/

/*<<==============Why invest FallBrook=============>>>>*/
.why_fall {
  background: linear-gradient(84deg, #e89d23 0%, #f9c304 100%), #f9c304;
  width: 100%;
  overflow: hidden;
}
.why_fall .owl-theme .owl-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  width: 100%;
  justify-content: flex-end;
}
.why_fall .owl-theme .owl-nav button {
  background: var(--primary) !important;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 26px;
  color: #fff;
}
.why_fall .owl-theme .owl-nav .owl-prev {
  display: none !important;
}
.why_fall .owl-theme .owl-dots {
  margin-top: 20px;
}
.why_fall .owl-nav.disabled {
  display: none !important;
}
@media only screen and (min-width: 601px) {
  .why_fall .owl-carousel .owl-stage-outer {
    /* margin-left: 100px; */
  }
}
.why_fall .owl-carousel .owl-stage {
  display: flex;
}

.why_fall .client_block {
  /* position: relative;   */
  overflow: hidden;
  /* margin-bottom: 80px; */ /*This is optional*/
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-shadow: none;
}

/*<<==============Why invest FallBrook=============>>>>*/

/*<<============== Film Our Services =============>>>>*/
.our_services {
  background: #f8fbf8;
}
.service_block {
  border-radius: 20px;
  border: 2.757px solid rgba(36, 112, 148, 0.2);
  background: #fff;
  height: 100%;
}
.service_block h3 {
  font-size: 40px;
  font-weight: 400;
  line-height: 122.5%;
  margin-bottom: 1rem;
}
.hero_banner .content .col-md-8 .service_block p {
  color: #f8fbf8;
  font-size: 18px;
  font-weight: 500;
  line-height: 129.5%;
  margin-bottom: 1.5rem;
}
.service_block p {
  color: #1c1c1c;
  font-size: 16px;
  font-weight: 400;
  line-height: 129.5%;
}
.service_block h6 {
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  margin: 0.5rem 0;
  color: #1e80dc;
}
.service_block img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  margin-bottom: 0.5rem;
}

.service_block:hover {

  border-radius: 20px;
  border: black;
  background: linear-gradient(84deg, #113d63 0%, #247094 100%), #247094;
  height: 100%;
  color: white;
}
.service_block p:hover {

  color: #ffffff !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 129.5%;
}
.service_block h6:hover {

  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  margin: 0.5rem 0;
  color: #FFC107;
}
/*<<============== Film Our Services =============>>>>*/

/*<<============== Film Finance =============>>>>*/
.film_finance {
  background: linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.3) 0%,
      rgba(0, 0, 0, 0.3) 100%
    ),
    #5698d7;
  background-blend-mode: normal, color;
  box-shadow: 0px 20.68px 41.36px -20.68px rgba(0, 0, 0, 0.15);
  position: relative;
  z-index: 0;
}
.film_finance .bg-image {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  object-fit: cover;
  object-position: bottom;
}
.hover-effect {
  transition: all ease 0.3s;
}
.hover-effect:hover {
  transition: all ease 0.3s;
  border-radius: 30px 0 30px 0;
}
/*<<============== Film Finance =============>>>>*/

/*<<============== ESG Criteria =============>>>>*/
.esg_cblock {
  text-align: center;
}
.esg_cblock p {
  color: var(---Fallbrook-Blue);
  font-family: var(--headerFont);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.24px;
}
.esg_cblock h6 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.28px;
}
.esg_cblock img {
  width: 130px;
  height: 130px;
  object-fit: cover;
  margin-bottom: 1.5rem;
}
/*<<============== ESG Criteria =============>>>>*/

/*<<============== Responsible Investment Practices =============>>>>*/
.res_inv .export_tax_block .icon {
  background-color: var(--yellow-lite);
}
/*<<============== Responsible Investment Practices =============>>>>*/

/*<<============== Sustainable Impact =============>>>>*/
.collaborative_block {
  border-radius: 15px;
  background: #def1fd;
  margin: 1.25rem 0;
  padding: 0.75rem 2rem;
}
.collaborative_block:last-child {
  margin-bottom: 0;
}
.sustainable_impact img {
  height: 100%;
  object-fit: cover;
}
.sustainable_impact h4 {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: 0.28px;
}
.sustainable_impact p {
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.24px;
}
/*<<============== Sustainable Impact =============>>>>*/

/* <<============= ESG Investments =============>>>>*/
.esg-Content h3 {
  font-size: 35px;
}

.esg-Content span {
  font-size: 40px;
  line-height: 45px;
}
.esg-Content p {
  color: #1c1c1c;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 25px;
  letter-spacing: 0.24px;
}
.esg-Content {
  position: relative;
  display: flex;
  align-items: center;
}
.border-esg {
  position: absolute;
  width: 10px;
  right: 0;
  height: 100%;
  background-color: var(--Fallbrook-Blue);
  top: 0;
  border-radius: 5px;
}
/* <<============= ESG Investments =============>>>>*/

/* <<============= Driving Corporate =============>>>>*/
.driving_content-wrap h3 {
  font-size: 40px;
  color: var(--yellow);
}
/* <<============= Driving Corporate =============>>>>*/

/* <<============= Investment Opportunities =============>>>>*/

.table-wrapper {
  margin: 10px 70px 70px;
  border-radius: 10px;
}

.fl-table {
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  border-collapse: collapse;
  width: 100%;
  max-width: 100%;
  white-space: nowrap;
  background-color: white;
  border: 2px solid #e89d23;
  border-radius: 10px;
}

.fl-table td,
.fl-table th {
  text-align: center;
  padding: 8px;
}

.fl-table td {
  border-left: 2px solid #e89d23;
  font-size: 16px;
  padding: 10px;
}

.fl-table thead th {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  font-weight: bold;
  font-size: 17px;
  border: 2px solid #e89d23;
}

.fl-table thead th:nth-child(odd) {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  padding: 15px;
}

.fl-table tbody td {
  border-bottom: 1px solid #e89d23;
  color: var(--Fallbrook-Blue);
  padding: 15px;
}

/* <<============= Investment Opportunities =============>>>>*/

/* <<============= Why Choose Fallbrook =============>>>>*/
.why_choose {
}
.why_choose .client_block h5 {
  color: var(--primary);
}
.why_choose.investment_credit.our_clients .client_block:hover h5 {
  color: var(--yellow) !important;
}
/* <<============= Why Choose Fallbrook =============>>>>*/

/* <<============= ESG investments =============>>>>*/
.esg_invest p {
  color: #1e1e1e;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 0.24px;
}
/* <<============= ESG investments =============>>>>*/

/* <<============= ESG Advancement =============>>>>*/
.export_tax.esg_advc .export_tax_block .dtl h6 {
  color: var(--yellow);
  font-size: 22px;
  font-style: normal;
  font-weight: 750;
  line-height: normal;
  letter-spacing: 0.28px;
  text-transform: capitalize;
}
.export_tax.esg_advc .export_tax_block .dtl p {
  color: #1e1e1e;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.24px;
}
.export_tax.esg_advc .export_tax_block .icon {
  background-color: var(--yellow-lite);
}
.export_tax.esg_advc .export_tax_block .icon img {
  width: 22px;
}
/* <<============= ESG Advancement =============>>>>*/

/* <<============= ESG Advancement =============>>>>*/
.learn_esg .letter_card {
  background-image: url(../images/pattern.png),
    linear-gradient(270deg, #71a5bd 0%, #114f6d 100%);
}
/* <<============= ESG Advancement =============>>>>*/

/* <<============= Benefits for Insurance =============>>>>*/
.bin_block {
  display: flex;
}
.bin_block .img {
  width: 60px;
  height: 60px;
}
.bin_block .img img {
  width: 60px;
  height: 60px;
  object-fit: contain;
}
.bin_block .content {
  width: calc(100% - 60px);
  padding-left: 20px;
}
.bin_block .content h5 {
  color: var(--primary);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.28px;
  text-transform: uppercase;
}
.bin_block .content p {
  color: #1e1e1e;
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.24px;
}
/* <<============= Benefits for Insurance =============>>>>*/

/* <<============= Debt Capital =============>>>>*/
.unlock_power.esg_invest .accordion .accordion-item .accordion-button {
  background-image: linear-gradient(84deg, #e89d23 0%, #f9c304 100%);
  background-color: var(--yellow);
}

/* <<============= Debt Capital =============>>>>*/

/* <<============= Why Fallbrook? =============>>>>*/
.shadow {
  box-shadow: 0px 6px 60px -10px rgba(16, 85, 150, 0.15) !important;
}
.why_fallb .card {
  border-radius: 10px;
}
/* <<============= Why Fallbrook? =============>>>>*/

/* <<============= Tax Credit Services  =============>>>>*/
.tax_credit_block {
  border-radius: 20px;
  background: #247094;
  color: #f8fbf8;
  font-size: 20px;
  font-weight: 700;
  line-height: normal;
  margin-bottom: 0;
}
.tax_credit_service img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0px 11px 40px -10px rgba(16, 85, 150, 0.15);
}
/* <<============= Tax Credit Services  =============>>>>*/

/* <<============= Why Choose Fallbrook   =============>>>>*/
.wcf.why_fallb .img {
  border-radius: 7px;
  background: rgba(36, 112, 148, 0.2);
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0.32px;
}
/* <<============= Why Choose Fallbrook   =============>>>>*/

/* <<============= Contact Fallbrook Form   =============>>>>*/
.renewable_form.contact_fall .renewable_form_block {
  background-image: url(../images/pattern2.png),
    linear-gradient(270deg, var(--primary) 0%, var(--Fallbrook-Blue) 100%);
}
/* <<============= Contact Fallbrook Form  =============>>>>*/

/*<<==============Renewable Form2=============>>>>*/
.renewable_form_block2 {
  border-radius: 20px;
  background-image: url(../images/pattern2.png),
    linear-gradient(270deg, var(--primary) 0%, var(--primary) 100%);
  background-blend-mode: darken;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-size: cover;
  color: #fff;
  text-align: center;
}

.renewable_form_block2 p {
  margin: 0;
  margin-bottom: 0.5rem;
  font-size: 22px;
  font-weight: 400;
}

.renewable_form_block2 h3 {
  color: #fff;
  font-weight: 700;
  font-size: 34px;
  margin-bottom: 1.5rem;
}

.renewable_form_block2 .form-control {
  border-radius: 10px;
  border: 2.5px solid #fff !important;
  background-color: transparent;
  color: #fff !important;
}

.renewable_form_block2 .form-control::placeholder {
  opacity: 0.75;
  color: #fff;
}

.renewable_form_block2 .btn {
  border-radius: 10px;
  color: #2f4e0d;
  font-weight: 500;
}

/*<<==============Renewable Form2============>>>>*/

/*<<==============Financing Services ============>>>>*/
.why_choose_slider.owl-theme .owl-nav {
  text-align: end;
}
.why_choose_slider.owl-theme .owl-nav button {
  width: 55px;
  height: 55px;
  display: inline-flex;
  /* align-items: center; */
  justify-content: center;
  font-size: 34px;
  border: 2px solid var(--primary);
  border-radius: 50%;
  color: var(--primary);
}
.why_choose_slider.owl-theme .owl-nav button:hover {
  background-color: var(--primary);
  color: #fff;
}
.why_choose_slider .card {
  border-radius: 15px;
}
.why_choose_slider .card:hover {
  background: linear-gradient(60deg, #113d63 0%, #2279c5 100%), #d9d9d9;
}
.why_choose_slider .card:hover h5 {
  color: var(--yellow);
}
.why_choose_slider .card:hover p {
  color: #fff;
}
/*<<==============Financing Services ============>>>>*/

/*<<==============Coming Soon Banner ============>>>>*/

/*<<==============Coming Soon Banner ============>>>>*/

/*<<==============Projects page ============>>>>*/
.project_search {
  position: relative;
  z-index: 0;
  /* max-width: 450px; */
  width: 100%;
}
.project_search .btn {
  position: absolute;
  width: 40px;
  height: 100%;
  left: 0;
  top: 0;
}
.project_search .form-control {
  padding-left: 50px;
}
.form-select {
  border-radius: 10px;
  border: 2.5px solid var(--primary);
  height: 50px;
  color: var(--primary);
  font-size: 16px;
  font-weight: 500;
}
.project-filters .btn-primary {
  height: 50px;
  min-width: 110px;
  display: inline-flex;
  align-items: center;
}
.project-filters .form-control {
  border-radius: 10px;
}
.project-body .project_block {
  height: 100%;
  border: 0;
  border-radius: 20px 20px 20px 20px;
}
.project-body .project_block .card-header {
  padding: 0;
  border: 0;
  border-radius: 20px 20px 0px 0px;
}
.project-body .project_block .card-body h3 {
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
}
.project-body .project_block .card-body h6 {
  color: #1c1c1c;
  font-size: 18px;
  font-weight: 500;
}
.project-body .project_block .card-body p {
  color: var(--Fallbrook-Blue);
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}
.project-body .project_block .card-footer {
  background-color: #fff;
  border: 0;
  border-radius: 0px 0px 10px 10px;
}
@media only screen and (max-width: 575px) {
  .project-filters .form-select {
    width: 100%;
  }
}
/*<<==============Projects page ============>>>>*/

/*<<==============team modification ============>>>>*/
.our_team .sec_header h3 {
  margin-bottom: -25px;
}
/*<<==============team modification ============>>>>*/

/*<<==============Philosophy and commitment ============>>>>*/
.phil_com .card {
  border-radius: 15px;
  background: #fff;
  box-shadow: 0px 10px 40px -10px rgba(16, 85, 150, 0.15);
}
.phil_com .card h3 {
  font-size: 28px;
  font-weight: 700;
  text-transform: uppercase;
}
.phil_com .card p {
  color: #000;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
}
/*<<==============Philosophy and commitment ============>>>>*/

/*<<============== Our History ============>>>>*/
.our_history {
}
.history_left {
  position: relative;
  border-left: 2px solid var(--Fallbrook-Blue);
  height: 100%;
  display: flex;
  align-items: center;
  /* padding-left: 5px; */
}
.history_icon {
  position: absolute;
  width: 15px;
  height: 15px;
  background-color: var(--Fallbrook-Blue);
  border-radius: 50%;
  transform: translateY(-50%);
  top: 50%;
  left: -9px;
}
.history_line {
  width: 70%;
  height: 1px;
  border-bottom: 2px dashed var(--Fallbrook-Blue);
  display: block;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
  left: 8px;
}
.history_left h3 {
  padding-left: calc(70% + 15px);
}
.history_right_content h5 {
  font-size: 21px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}
.col-12:nth-child(even) .history_right_content h5 {
  color: var(--yellow);
}
.history_right_content p {
  color: var(--Fallbrook-Blue);
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: 0.24px;
}
@media only screen and (max-width: 991px) {
  .history_left {
    border-left: 0;
    border-top: 2px solid var(--Fallbrook-Blue);
  }
  .history_icon {
    left: 50%;
    transform: translateX(-50%);
    top: -9px;
  }
  .history_line {
    top: 45px;
    height: 100px;
    width: 1px;
    left: calc(50% - 1px);
    transform: translate(0, -50%);
    border-bottom: 0;
    border-left: 2px dashed var(--Fallbrook-Blue);
  }
  .history_left {
    justify-content: center;
  }
  .history_left h3 {
    justify-content: center;
    width: 100%;
    padding-left: 0 !important;
    text-align: center;
    padding-top: 110px;
  }
}
/*<<============== Our History ============>>>>*/

/*<<============== News and Blogs ============>>>>*/
.filter_news .nav-tabs .nav-link {
  border: 0;
  color: #2c2c2c;
  padding: 0.5rem 1.5rem;
  border-radius: 40px;
}
.filter_news .nav-tabs .nav-link.active {
  background-color: var(--primary);
  color: #fff;
}
.filter_news .nav-tabs {
  border: 0;
}
.higlight_item {
  position: relative;
  z-index: 0;
  border-radius: 15px;
  margin: 5px;
  /* padding: 3rem 2rem; */
}
.higlight_item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 15px;
}
.higlight_item .content {
  position: absolute;
  width: 90%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 900px;
}
.higlight_item .content h3 {
  color: #fff;
  font-size: 44px;
  font-weight: 700;
  margin-bottom: 1.5rem;
}
.higlight_item::before {
  content: "";
  width: calc(100%);
  height: calc(100%);
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #0000006b;
  border-radius: 15px;
}
.blog_normal_right {
  max-height: 670px;
  overflow-y: auto;
}
.blog_tblock:first-child {
  padding-top: 0px !important;
}
.blog_tblock:last-child {
  border-bottom: 0px !important;
}
.blog_tblock {
  padding-right: 10px;
}
.blog_block img {
  height: 500px;
  object-fit: cover;
  border-radius: 15px;
  width: 100%;
}
.blog_block h5,
.blog_tblock h5 {
  color: #1e1e1e;
  font-size: 20px;
  font-weight: 750;
}

.scrollbar::-webkit-scrollbar {
  width: 8px;
}

.scrollbar::-webkit-scrollbar-track {
  background: #d9d9d9;
  border-radius: 10px;
}

.scrollbar::-webkit-scrollbar-thumb {
  background: #a4a4a4;
  border-radius: 10px;
}

.scrollbar::-webkit-scrollbar-thumb:hover {
  background: #555;
}
.blog_block {
  position: relative;
  height: 100%;
}

.blog_block .card-header button {
  position: absolute;
  right: 20px;
  top: 20px;
  font-size: 26px;
  box-shadow: none;
}
.blog_block .card-header button.active {
  color: #ec3535;
}
/*<<============== News and Blogs ============>>>>*/

/*<<============== Blog page Inner ============>>>>*/
.fit-content {
  width: fit-content;
}
.border-bottom-primary {
  border-bottom: 1px solid var(--primary);
}
/*<<============== Blog page Inner ============>>>>*/

/*<<============== Blog feature area ============>>>>*/
.border-start-thick {
  border-left: 3px solid #000;
}
/*<<============== Blog feature area ============>>>>*/

/*<<============== Other Blogs ============>>>>*/
.other_blogs .blog_block img {
  height: 400px;
}
/* .item {
  display: flex;
  flex: 1 0 auto;
  height: 100%;
} */
.item > div {
  position: relative;
  overflow: hidden;
  /* margin-bottom: 80px; */ /*This is optional*/
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
/*<<============== Other Blogs ============>>>>*/

.limit_content {
  display: -webkit-box;
  max-height: 200px;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.btn-outline-primary {
  border-color: var(--primary) !important;
  z-index: 9;
  position: relative;
  box-shadow: none !important;
}
.btn-outline-primary:hover {
  background-color: var(--primary) !important;
  color: #fff !important;
}

.header.header_hide {
  transform: translateY(calc(-100% + 5px));
  transition: all ease 0.5s;
}
.header {
  transform: translateY(calc(0));
  transition: all ease 0.5s;
}
.team_left_area {
  /* top: 40px; */
}
.btn-leftbar-close {
  /* background: var(--bs-danger); */
  background: #555;
  border-radius: 15px 15px 0 0;
  color: #fff !important;
  padding: 6px 20px;
  /* margin-bottom: -50px; */
  transform: translateY(50px);
  transition: all ease 0.3s;
  opacity: 0.5;
  text-transform: uppercase;
}
.btn-leftbar-close i {
  transform: rotate(45deg) translateY(6px);
  font-size: 24px;
  line-height: 0;
}
.team_left_area:hover .btn-leftbar-close {
  transform: translateY(0px);
  transition: all ease 0.3s;
}
.btn-leftbar-close:hover {
  opacity: 1;
}


.informed_submit span, .informed_submit input {
  width: 100%;
  background-color: transparent;
  border: none !important;
  padding-right: 5px;
  color: white;
}
@media only screen and (max-width: 1199px) {
  .our_team .sec_header h3 {
    margin-bottom: 0px;
  }
}
@media only screen and (max-width: 991px) {
  .btn-leftbar-close {
    position: absolute;
    z-index: 9;
    opacity: 1;
    border-radius: 0;
    width: 100%;
    left: 0;
    top: 0;
    transform: none;
    background: #76878f;
  }
  .team_left_area {
    padding-top: 50px;
  }
  .team_left_area.animate__bounceIn {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft;
  }
  .limit_content {
    display: block;
  }
  .team_left_area .btn-outline-primary {
    display: none;
  }
}
@media only screen and (max-width: 425px) {
  .hero_banner_inner h2 {
    font-size: 40px;
  }
  .header .navbar-brand img {
    max-width: 140px;
  }
}
/* Submenu Styles */
.submenu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    background: #ffffff;
    box-shadow: 0 8px 24px rgba(17, 61, 99, 0.12);
    border-radius: 8px;
    padding: 8px 0;
    min-width: 220px;
    list-style: none;
    margin: 0;
}

/* Ensure submenu items are visible */
.submenu li {
    display: block;
    margin: 0;
}

.submenu li a {
    display: block;
    padding: 8px 18px;
    color: #212529;
    text-decoration: none;
    white-space: nowrap;
    font-size: 15px;
    font-weight: 500;
    transition: background 0.15s ease, color 0.15s ease;
}

.submenu li a:hover {
    background-color: #f0f7fb;
    color: #247094;
}

@media only screen and (max-width: 991px){
    .submenu,
    ul.submenu {
      position: static !important;
      left: auto !important;
      transform: none !important;
      width: 100%;
      min-width: 0;
      box-shadow: none;
  }
}
body {
  width: 100%;
  overflow-x: hidden;
  overflow-y: scroll; /* CLS FIX: always reserve scrollbar gutter so it never shifts layout */
  scrollbar-gutter: stable; /* Modern browsers: permanently reserve scrollbar space */
}

/* ============================================================
   HOME PAGE STYLES (moved from home.php inline <style> blocks)
   ============================================================ */

/* --- Banner Item Layout --- */
.banner_item {
  width: 100%;
  position: relative;
  z-index: 0;
}

.banner_item video {
  object-fit: cover;
  object-position: top;
  position: relative;
  z-index: -1;
  display: block;
  width: 100%;
  height: auto;
  /* Same 16:9 ratio as the hero files, so the box exists before the file loads.
     Existing min-height / max-height rules still crop it to the current size. */
  aspect-ratio: 16 / 9;
}

.banner_item .hero-lcp-cover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
  z-index: 1;
  pointer-events: none;
}

.banner_item .hero-lcp-cover.is-hidden {
  visibility: hidden;
}

/* CLS FIX: Prevent Owl Carousel from collapsing before JS executes.
   Renders first slide at natural video height and hides subsequent slides until owl is ready.
   Completely eliminates layout shifts on the About section below. */
.banner_slider:not(.owl-loaded) {
  display: block !important;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.banner_slider:not(.owl-loaded) > .item:not(:first-child) {
  display: none !important;
}

.about_us {
  contain: layout paint;
}

/* Mobile hero home — remove fixed min-height, let content drive the height */
@media only screen and (max-width: 768px) {
  .hero_banner_home {
    min-height: unset !important;
    height: auto !important;
  }

  /* Make the video taller on phones so all text is visible */
  .hero_banner_home .banner_item video {
    aspect-ratio: 3 / 4 !important;
    max-height: none !important;
    min-height: unset !important;
    width: 100% !important;
    object-fit: cover;
    object-position: center;
  }

  /* Switch content from absolute-centred to normal flow */
  .hero_banner_home .content {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    transform: none !important;
    height: 100% !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    padding-top: 80px !important;
    padding-bottom: 40px !important;
  }

  /* Scale headings & body down for small screens */
  .hero_banner_home .content h1,
  .hero_banner_home .content h2 {
    font-size: 28px !important;
    letter-spacing: -0.5px !important;
    line-height: 1.2 !important;
  }

  .hero_banner_home .content h3 {
    font-size: 22px !important;
    line-height: 1.2 !important;
  }

  .hero_banner_home .content p {
    font-size: 14px !important;
    line-height: 1.5 !important;
    margin-bottom: 16px !important;
  }
}















/* --- Hero Banner Home (home page specific — scoped to .hero_banner_home) --- */
.hero_banner_home .content {
  display: flex;
  align-items: center;
  height: 100%;
  position: absolute;
  top: 50%;
  z-index: 9;
  transform: translateY(-50%);
  width: 100%;
  background: #00000062;
}

.hero_banner_home .content .btn {
  text-shadow: none !important;
}

.hero_banner_home .content.bg_inverse {
  background: #ffffff88;
}

.hero_banner_home .content.bg_inverse_affordable {
  background-image: linear-gradient(to right, rgb(0 0 0 / 76%), rgb(65 65 65 / 0%));
}

.hero_banner_home .content.bg_inverse_state {
  background-image: linear-gradient(to right, rgb(0 0 0 / 57%), rgb(65 65 65 / 0%));
}

.hero_banner_home .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_home .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_home .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_home .content h2 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_home .content h2 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_home .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_home .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Home-page Button Variants --- */
.hero_banner_home .btn-primarys {
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

.btn-primaryss {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

.btn-primaryisss {
  color: black;
  background-color: #f9c304;
  border-color: var(--primary);
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

/* Override: home page .btn-primarys = yellow pill (overrides the green from external CSS) */
.btn-primarys {
  color: black;
  background-color: #f9c304;
  border-color: #f9c304;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

/* Override: home page .text-primarys = amber/yellow (overrides green from external CSS) */
.hero_banner_home .text-primarys {
  position: relative;
  z-index: 105;
  color: #FFC107 !important;
}

/* --- Banner Nav Pills (home page override) --- */
.banner_menu .nav-link {
  font-size: min(14px, 1vw);
  padding: 1rem 1rem;
}

/* --- Contact Form tweaks --- */
.select.form-select.mb-3 {
  border-radius: 50px;
}

.contact_us_fallbrook br {
  display: none !important;
}

.contact_us_fallbrook label {
  width: 100% !important;
}

textarea.form-control.contact_us_textarea {
  min-height: 130px !important;
}

/* --- Client Block Hover (home page) --- */
.client_block:hover {
  background: linear-gradient(60deg, #113d63 0%, #247094 100%), linear-gradient(84deg, #247094 0%, #209efa 100%, #0083ff 100%);
}

.client_block:hover h5 {
  color: white;
}

.client_block:hover p {
  color: white;
}

/* --- Home About subheading --- */
.home-about-subheading {
  font-size: 1rem;
  font-weight: 600;
  color: var(--Fallbrook-Blue, #113d63);
}

/* --- Home News Card Title --- */
.home-news-card-title {
  font-size: 1.125rem;
  font-weight: 650;
  line-height: 1.35;
}

/* --- Virtual Film Office Section --- */
#virtualFilmOffice {
  position: relative;
  overflow: hidden;
}

#virtualFilmOffice::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.1), transparent);
  animation: rotate 20s linear infinite;
}

.virtual_film_office .vfo-badge {
  transition: transform 0.3s ease;
}

.virtual_film_office .vfo-badge:hover {
  transform: scale(1.05);
}

.virtual_film_office .bullet-point {
  color: #FFD700;
  font-size: 1.5rem;
  font-weight: bold;
}

.virtual_film_office .vfo-benefits li {
  font-size: 1.1rem;
  line-height: 1.5;
}

.virtual_film_office .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}

/* --- AI Button --- */
.ai-button {
  display: grid;
  place-items: center;
}

.ai-button button {
  all: unset;
  width: 100%;
  background: transparent;
  border-width: 0;
  margin-bottom: 10px;
  transform: scale(1);
  transition: transform 0.2s cubic-bezier(0.76, -0.25, 0.51, 1.13);
  animation: infinite-btn-animation 5s infinite ease-in-out;
}

.ai-button button div {
  display: flex;
  align-items: center;
  gap: 3px;
  flex-wrap: nowrap;
  padding: 8px 10px;
  background: #013a6e;
  color: white;
  font-weight: bold;
  border-radius: 30px;
  font-size: 13px;
  position: relative;
  cursor: pointer;
}

.ai-button button div span {
  background: linear-gradient(to right, color(display-p3 0.7 0.7 0.7), color(display-p3 0.83 0.22 0.22), color(display-p3 0.71 0.15 0.75), color(display-p3 0.23 0.37 0.53), #4CAF50, color(display-p3 0.17 0.36 0.6), color(display-p3 0.92 0.86 0.57), hsl(36.5deg 69.77% 66.27%), hsl(0deg 0% 100%), color(display-p3 0 0.3 1), color(display-p3 0.88 0.87 0.83)) no-repeat 100% 0% / 900%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: 0.15ch;
  font-weight: 600;
  white-space: nowrap;
  animation: gradient-move 5s infinite linear;
}

.ai-button button div:before {
  content: "";
  display: block;
  position: absolute;
  border-radius: 30px;
  width: calc(100% + (1.5 * 2) * 1px);
  height: calc(100% + (1.5 * 2) * 1px);
  background: linear-gradient(to right,
      var(--color-white),
      var(--color-white),
      var(--color-cyan),
      var(--color-blue),
      var(--color-purple),
      var(--color-pink),
      var(--color-red),
      hsl(0deg, 100%, 50%),
      hsl(229.6deg, 100%, 75%),
      var(--color-white),
      var(--color-white)) no-repeat 100% 0% / 900%;
  z-index: -1;
  top: -1.5px;
  left: 0%;
  opacity: 0.3;
  animation: gradient-move 5s infinite linear, opacity-pulse 5s infinite ease-in-out;
}

/* --- Section button pulse animation --- */
.section-button {
  animation: slideIn 1s ease-out 0.9s forwards, pulse 2s ease-in-out infinite;
}

/* --- Keyframe Animations --- */
@keyframes pulse {
  0%   { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); }
  70%  { box-shadow: 0 0 0 15px rgba(59, 130, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
}

@keyframes rotate {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes gradient-move {
  0%   { background-position: 100% 0%; }
  50%  { background-position: 0% 0%; }
  100% { background-position: 100% 0%; }
}

/* --- Color variables for AI button (display-p3 fallbacks) --- */
:root {
  --color-white: hsl(0, 0%, 100%);
  --color-cyan: hsl(180, 100%, 50%);
  --color-blue: hsl(240, 100%, 50%);
  --color-purple: hsl(270, 100%, 50%);
  --color-pink: hsl(330, 40%, 70%);
  --color-red: hsl(0, 100%, 50%);
  --color-yellow: hsl(60, 100%, 50%);
  --color-lime: hsl(90, 100%, 75%);
  --color-orange: oklch(69.1% 0.223 36.85);
}

@supports (color: color(display-p3 0 0 0)) {
  :root {
    --color-white: color(display-p3 1 1 1);
    --color-cyan: color(display-p3 0 1 1);
    --color-blue: color(display-p3 0 0 1);
    --color-purple: color(display-p3 0.5 0 1);
    --color-pink: color(display-p3 1 0.4 0.7);
    --color-red: color(display-p3 1 0 0);
    --color-orange: color(display-p3 0.96 0.39 0.2);
  }
}

/* ============================================================
   HOME PAGE — RESPONSIVE BREAKPOINTS
   ============================================================ */

/* Banner video height constraints — desktop/tablet only */
@media only screen and (min-width: 769px) and (max-width: 1500px) {
  .banner_item video {
    max-height: 550px !important;
    min-height: 50vh !important;
  }
}

@media only screen and (max-width: 991px) {
  .banner_menu .nav-link {
    font-size: 14px;
  }

  .banner_item video {
    max-height: unset;
  }
}

@media only screen and (max-height: 1080px) {
  .banner_item video {
    max-height: 580px !important;
    min-height: 50vh !important;
  }

  .hero_banner_home .content h2 {
    font-size: 40px;
  }

  .hero_banner_home .content h3 {
    font-size: 40px;
  }

  .hero_banner_home .content p {
    font-size: 18px;
  }

  .video-background video {
    max-height: 550px !important;
    min-height: 50vh !important;
  }

  .hero_banner_film .content h2 {
    font-size: 40px;
  }

  .hero_banner_film .content h3 {
    font-size: 40px;
  }

  .hero_banner_film .content p {
    font-size: 18px;
  }

  .over_layout {
    max-height: none !important;
    height: 100% !important;
  }

  .hero_banner_film {
    max-height: 550px !important;
    min-height: 50vh !important;
  }
}

@media only screen and (max-height: 700px) {
  .banner_item video {
    max-height: 480px !important;
    min-height: 50vh !important;
  }

  .hero_banner_home .content h2 {
    font-size: 40px;
  }

  .hero_banner_home .content h3 {
    font-size: 40px;
  }

  .hero_banner_home .content p {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  #virtualFilmOffice {
    padding-bottom: 1.5rem !important;
  }

  /* Keep the AI badge in normal flow so it does not cover the CTA. */
  .virtual_film_office .ai-button-main {
    position: static !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 1.25rem;
    padding: 0 16px;
    box-sizing: border-box;
  }

  .virtual_film_office .ai-button,
  .virtual_film_office .ai-button button {
    width: auto;
    max-width: 100%;
  }

  .virtual_film_office .ai-button button {
    margin-bottom: 0;
  }

  .virtual_film_office .ai-button button div {
    max-width: 100%;
    justify-content: center;
  }

  .virtual_film_office .ai-button button div span {
    white-space: normal;
    text-align: left;
  }

  .virtual_film_office .vfo-cta h3 {
    font-size: 1.2rem;
  }

  .virtual_film_office .vfo-benefits li {
    font-size: 1rem;
  }
}

@media (max-width: 380px) {
  .ai-button button div {
    font-size: 12px;
  }
}

/* ============================================================
   RENEWABLE ENERGY PAGE STYLES
   (moved from renewable-energy-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Renewable Energy page specific) --- */
.hero_banner_energy_page {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_energy_page .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 105;
}

.hero_banner_energy_page .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_energy_page .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_energy_page .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_energy_page .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_energy_page .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Scoped: .text-primarys on energy page = amber/yellow
       (overrides the green #66893e from the base external CSS rule) --- */
.hero_banner_energy_page .text-primarys {
  position: relative;
  z-index: 105;
  color: #FFC107 !important;
}

/* --- Scoped: .btn-primary on energy page = yellow pill with black text
       (Does NOT affect other pages' .btn-primary) --- */
.hero_banner_energy_page .btn-primary {
  font-weight: 600;
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

/* --- Scoped: .text-dark on energy page = white text overlay
       (Does NOT affect Bootstrap's .text-dark elsewhere) --- */
.hero_banner_energy_page .text-dark {
  position: relative;
  color: white !important;
  z-index: 105;
}

/* --- Video background overlay (energy page hero) --- */
.video-background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 0;
}

.video-background video,
.video-background .hero_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}

.over_layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
}

/* --- New style h3 (z-index layering for energy page) --- */
h3.new_style {
  z-index: 190;
  position: relative;
}

/* --- Scoped: Investment Types section on energy page uses blue gradient
       (home page uses yellow — both can coexist by specificity) --- */
.energy .investment_types {
  background-image: linear-gradient(84deg, #247094 0%, #113d63 100%);
  background-color: var(--primary);
}

/* --- Informed submit (newsletter form on energy page) --- */
.informed_submit button.btn {
  position: absolute;
  right: 0;
  top: 50%;
  height: 50px;
  width: 100px;
  transform: translate(0%, -50%);
  border-radius: 0px 30px 30px 0px !important;
}

.informed_submit {
  position: relative;
  background: transparent;
  color: #fff;
  border: 2.5px solid var(--yellow) !important;
  border-radius: 30px;
  display: flex;
}

.informed_submit span,
.informed_submit input {
  width: 100%;
  background-color: transparent;
  border: none !important;
  padding-right: 5px;
  color: white;
}

.informed_submit input::placeholder {
  color: #fff;
}

.informed_submit input.form-control:focus {
  color: #fff !important;
  background-color: transparent !important;
  border: none !important;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

label.informed_submit span br,
label.informed_submit br {
  display: none !important;
}

/* --- WP forms success message on energy page --- */
.wpcf7 form.sent .wpcf7-response-output {
  border-color: #46b450;
  color: white;
}

/* --- Renewable Energy Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .video-background video {
    max-height: 550px !important;
    min-height: 50vh !important;
  }

  .hero_banner_energy_page .content h1 {
    font-size: 40px;
  }

  .hero_banner_energy_page .content h3 {
    font-size: 40px;
  }

  .hero_banner_energy_page .content p {
    font-size: 18px;
  }

  .over_layout {
    max-height: none !important;
    height: 100% !important;
    min-height: 100% !important;
  }

  .hero_banner_energy_page {
    max-height: 550px !important;
    min-height: 50vh !important;
  }
}

@media only screen and (max-width: 490px) {
  .hero_banner_energy_page .content h1,
  .hero_banner_energy_page .content h3 {
    font-size: 6vw;
  }

  .hero_banner_energy_page .content p {
    font-size: 3.5vw;
  }

  .hero_banner_energy_page .content .btn-primary {
    font-size: 3vw;
  }
}

/* ============================================================
   STATE TAX CREDIT PAGE STYLES
   (moved from state-tax-credit-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (State Tax Credit page specific) --- */
.hero_banner_state_tax {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_state_tax .content {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
  min-height: 670px;
}

.hero_banner_state_tax .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_state_tax .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_state_tax .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_state_tax .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_state_tax .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Scoped: .text-primarys on state tax page = amber/yellow --- */
.hero_banner_state_tax .text-primarys {
  position: relative;
  z-index: 105;
  color: #FFC107 !important;
}

/* --- Scoped: .btn-primary on state tax page = yellow pill with black text in front of overlay --- */
.hero_banner_state_tax .btn-primary,
.hero_banner_state_tax #scrollTopState {
  color: #000 !important;
  background-color: #ffc107 !important;
  border-color: #ffc107 !important;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
  z-index: 105 !important;
}

/* --- Scoped: .text-dark on state tax page = white text overlay --- */
.hero_banner_state_tax .text-dark {
  position: relative;
  color: white !important;
  z-index: 105;
}

/* --- Scoped: export_tax img on state tax page uses top-center object-position --- */
.state-tax-export .export_tax img {
  object-position: top center;
  width: 100%;
}

/* --- State Tax Credit Page --- Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_state_tax .content h1 { font-size: 40px; }
  .hero_banner_state_tax .content h3 { font-size: 40px; }
  .hero_banner_state_tax .content p  { font-size: 18px; }
  .hero_banner_state_tax { max-height: 550px !important; min-height: 50vh !important; }
}

@media only screen and (max-width: 425px) {
  .state-tax-export .export_tax img { max-height: 100px; }
}

/* ============================================================
   FEDERAL TAX CREDIT PAGE STYLES
   (moved from federal-fax-credit-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (.hero_banners — federal tax page specific) --- */
.hero_banners {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banners .content {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
  min-height: 670px;
}

.hero_banners .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banners .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banners .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banners .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banners .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Scoped: federal page uses a darker overlay gradient (84% vs 76%) --- */
.hero_banners .over_layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
}

/* --- Federal Tax Credit Page --- Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banners .content h1 { font-size: 40px; }
  .hero_banners .content h3 { font-size: 40px; }
  .hero_banners .content p  { font-size: 18px; }
  .hero_banners { max-height: 550px !important; min-height: 50vh !important; }
}

/* ============================================================
   ESG INITIATIVES PAGE STYLES
   (moved from esg-initiatives-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (ESG page specific) --- */
.hero_banner_esg {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_esg .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.hero_banner_esg .over_layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
}

.hero_banner_esg .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_esg .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_esg .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_esg .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_esg .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Scoped: ESG page uses darker overlay gradient (84%) --- */
.hero_banner_esg .over_layout {
  background-image: linear-gradient(to right, rgb(0 0 0 / 84%), rgb(13 12 12 / 0%));
}

/* --- ESG Criteria Block --- */
.esg_cblock {
  text-align: center;
}

.esg_cblock img {
  width: 130px;
  height: 130px;
  object-fit: cover;
  margin-bottom: 1.5rem;
}

.esg_cblock h6 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.28px;
}

.esg_cblock p {
  color: var(--Fallbrook-Blue);
  font-family: var(--headerFont);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.24px;
}

/* --- ESG Content Block --- */
.esg-Content {
  position: relative;
  display: flex;
  align-items: center;
}

.esg-Content h3 {
  font-size: 35px;
}

.esg-Content span {
  font-size: 40px;
  line-height: 45px;
}

.esg-Content p {
  color: #1c1c1c;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 25px;
  letter-spacing: 0.24px;
}

.border-esg {
  position: absolute;
  width: 10px;
  right: 0;
  height: 100%;
  background-color: var(--Fallbrook-Blue);
  top: 0;
  border-radius: 5px;
}

/* --- Sustainable Impact Section --- */
.sustainable_impact img {
  height: 100%;
  object-fit: cover;
}

.sustainable_impact h4 {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: 0.28px;
}

.sustainable_impact p {
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.24px;
}

/* --- Collaborative Blocks --- */
.collaborative_block {
  border-radius: 15px;
  background: #def1fd;
  margin: 1.25rem 0;
  padding: 0.75rem 2rem;
}

.collaborative_block:last-child {
  margin-bottom: 0;
}

/* --- Fallbrook text color utility --- */
.text-fallbrook {
  color: var(--Fallbrook-Blue) !important;
}

/* --- Why Choose Fallbrook (ESG page) --- */
.why_choose .client_block h5 {
  color: var(--primary);
}

.why_choose.investment_credit.our_clients .client_block:hover h5 {
  color: var(--yellow) !important;
}

.why_fallb .card {
  border-radius: 10px;
}

/* --- Why Choose Slider --- */
.why_choose_slider.owl-theme .owl-nav {
  text-align: end;
}

.why_choose_slider.owl-theme .owl-nav button {
  width: 55px;
  height: 55px;
  display: inline-flex;
  justify-content: center;
  font-size: 34px;
  border: 2px solid var(--primary);
  border-radius: 50%;
  color: var(--primary);
}

.why_choose_slider.owl-theme .owl-nav button:hover {
  background-color: var(--primary);
  color: #fff;
}

.why_choose_slider .card {
  border-radius: 15px;
}

.why_choose_slider .card:hover {
  background: linear-gradient(60deg, #113d63 0%, #2279c5 100%), #d9d9d9;
}

.why_choose_slider .card:hover h5 {
  color: var(--yellow);
}

.why_choose_slider .card:hover p {
  color: #fff;
}

/* --- Renewable Form Block 2 (ESG page blue variant) --- */
.renewable_form_block2 {
  border-radius: 20px;
  background-image: url(../images/pattern2.png),
    linear-gradient(270deg, var(--primary) 0%, var(--primary) 100%);
  background-blend-mode: darken;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-size: cover;
  color: #fff;
  text-align: center;
}

.renewable_form_block2 p {
  margin: 0;
  margin-bottom: 0.5rem;
  font-size: 22px;
  font-weight: 400;
}

.renewable_form_block2 h3 {
  color: #fff;
  font-weight: 700;
  font-size: 34px;
  margin-bottom: 1.5rem;
}

.renewable_form_block2 .form-control {
  border-radius: 10px;
  border: 2.5px solid #fff !important;
  background-color: transparent;
  color: #fff !important;
}

.renewable_form_block2 .form-control::placeholder {
  opacity: 0.75;
  color: #fff;
}

.renewable_form_block2 .btn {
  border-radius: 10px;
  color: #2f4e0d;
  font-weight: 500;
}

/* --- Contact button variant --- */
.btn-contact {
  background-color: var(--yellow);
}

/* --- ESG Invest accordion (yellow gradient) --- */
.esg_invest.unlock_power .accordion .accordion-item .accordion-button {
  background-image: linear-gradient(84deg, #e89d23 0%, #f9c304 100%);
  background-color: var(--yellow);
}

/* --- Comparison Table (ESG page) --- */
.table-wrapper {
  margin: 10px 70px 70px;
  border-radius: 10px;
}

.fl-table {
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  border-collapse: collapse;
  width: 100%;
  max-width: 100%;
  white-space: nowrap;
  background-color: white;
  border: 2px solid #e89d23;
  border-radius: 10px;
}

.fl-table td,
.fl-table th {
  text-align: center;
  padding: 8px;
}

.fl-table td {
  border-left: 2px solid #e89d23;
  font-size: 16px;
  padding: 10px;
}

.fl-table thead th {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  font-weight: bold;
  font-size: 17px;
  border: 2px solid #e89d23;
}

.fl-table thead th:nth-child(odd) {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  padding: 15px;
}

.fl-table tbody td {
  border-bottom: 1px solid #e89d23;
  color: var(--Fallbrook-Blue);
  padding: 15px;
}

/* --- ESG Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_esg .content h1 { font-size: 40px; }
  .hero_banner_esg .content h3 { font-size: 40px; }
  .hero_banner_esg .content p  { font-size: 18px; }
  .hero_banner_esg { max-height: 550px !important; min-height: 50vh !important; }
}

@media only screen and (max-height: 700px) {
  .hero_banner_esg .content h1 { font-size: 40px !important; }
  .hero_banner_esg .content h3 { font-size: 40px !important; }
  .hero_banner_esg .content p  { font-size: 18px !important; }
}

@media only screen and (max-height: 600px) {
  .hero_banner_esg .content h1,
  .hero_banner_esg .content h3 { font-size: 36px !important; }
  .hero_banner_esg .content {
    min-height: inherit;
    align-items: flex-start;
    padding-top: 4vh;
  }
  .hero_banner_esg .content p {
    font-size: 16px !important;
    margin-bottom: 4vh;
  }
  .hero_banner_esg,
  .hero_banner_esg ~ .video-background video {
    max-height: unset !important;
    min-height: 92vh !important;
    width: 100% !important;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .esg-hero-section .sec_header h3,
  .esg-hero-section .sec_header h3 span { font-size: 26px !important; }
}

@media only screen and (max-width: 767px) {
  .esg-hero-section .sec_header h3,
  .esg-hero-section .sec_header h3 span { font-size: 26px !important; }
}

@media only screen and (max-width: 490px) {
  .hero_banner_esg .content h1,
  .hero_banner_esg .content h3 { font-size: 8vw !important; }
  .hero_banner_esg .content {
    min-height: inherit;
    align-items: flex-start;
    padding-top: 4vh;
  }
  .hero_banner_esg .content p {
    font-size: 4vw !important;
    margin-bottom: 2vh;
  }
  .hero_banner_esg .btn-primaryisss { font-size: 4vw !important; }
  .esg-hero-section .sec_header h3,
  .esg-hero-section .sec_header h3 span {
    font-size: 5.5vw !important;
    line-height: 1.5;
  }
  .esg-hero-section .export_tax_block .dtl h6 { font-size: 5vw !important; }
}

/* ============================================================
   FILM PRODUCTION PAGE STYLES
   (moved from film-production-page.php inline <style> blocks)
   ============================================================ */

/* --- Hero Banner (Film Production page specific) --- */
.hero_banner_film {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_film .content {
  display: flex;
  align-items: center;
  min-height: 670px;
  /* FIX: ensure content renders above the .over_layout overlay */
  position: relative;
  z-index: 2;
}

.hero_banner_film .over_layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
}

.hero_banner_film .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_film .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_film .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_film .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_film .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Scoped: .text-primarys on film page = amber/yellow --- */
.hero_banner_film .text-primarys {
  color: #f9c304 !important;
}

/* --- Scoped: .btn-primaryss on film page = yellow pill --- */
.btn-primaryss {
  color: #000;
  background-color: #ffc107;
  border-color: #ffc107;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

/* --- .text-darks utility (film page) --- */
.text-darks {
  color: #212529 !important;
  font-weight: 600 !important;
}

/* --- Film Finance section --- */
.film_finance {
  background: linear-gradient(0deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.3) 100%), #5698d7;
  background-blend-mode: normal, color;
  box-shadow: 0px 20.68px 41.36px -20.68px rgba(0, 0, 0, 0.15);
  position: relative;
  z-index: 0;
}

.film_finance .bg-image {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  object-fit: cover;
  object-position: bottom;
}

/* --- Services Investors section --- */
.services_investors .si_left img {
  border-radius: 10px;
}

.services_investors .si_right h6 {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  background-color: var(--yellow);
  width: fit-content;
  padding: 5px 15px;
  border-radius: 0px 40px 40px 0px;
}

/* --- Our Services (Film page) --- */
.our_services {
  background: #f8fbf8;
}

.service_block {
  border-radius: 20px;
  border: 2.757px solid rgba(36, 112, 148, 0.2);
  background: #fff;
  height: 100%;
}

.service_block h3 {
  font-size: 40px;
  font-weight: 400;
  line-height: 122.5%;
  margin-bottom: 1rem;
}

.col-md-8 .service_block p {
  color: #f8fbf8;
  font-size: 18px;
  font-weight: 500;
  line-height: 129.5%;
  margin-bottom: 1.5rem;
}

.service_block p {
  color: #1c1c1c;
  font-size: 16px;
  font-weight: 400;
  line-height: 129.5%;
}

.service_block h6 {
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  margin: 0.5rem 0;
}

.service_block img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  margin-bottom: 0.5rem;
}

/* --- Why Invest with Fallbrook (Film page slider) --- */
.why_fall {
  background: linear-gradient(84deg, #e89d23 0%, #f9c304 100%), #f9c304;
  width: 100%;
  overflow: hidden;
}

.why_fall .owl-theme .owl-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  width: 100%;
  justify-content: flex-end;
}

.why_fall .owl-theme .owl-nav button {
  background: var(--primary) !important;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  font-size: 26px;
  color: #fff;
}

.why_fall .owl-theme .owl-dots {
  margin-top: 20px;
}

.why_fall .owl-nav.disabled {
  display: none !important;
}

.why_fall .owl-carousel .owl-stage {
  display: flex;
}

.why_fall .client_block {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  box-shadow: none;
}

.why_fall .owl-theme .owl-nav button.owl-prev {
  display: block !important;
  position: absolute;
  left: -155px;
  bottom: 24%;
  transform: translate(77px, -50%);
}

.why_fall .owl-theme .owl-nav button.owl-next {
  display: block !important;
  position: absolute;
  bottom: -43%;
  transform: translate(77px, -50%);
}

.why_fall_right.investment_credit.our_clients .item {
  display: contents;
}

/* --- Hover effect utility --- */
.hover-effect {
  transition: all ease 0.3s;
}

.hover-effect:hover {
  transition: all ease 0.3s;
  border-radius: 30px 0 30px 0;
}

/* --- Virtual Film Office section --- */
.virtual_film_office .vfo-badge {
  transition: transform 0.3s ease;
}

.virtual_film_office .vfo-badge:hover {
  transform: scale(1.05);
}

.virtual_film_office .bullet-point {
  color: #FFD700;
  font-size: 1.5rem;
  font-weight: bold;
}

.virtual_film_office .vfo-benefits li {
  font-size: 1.1rem;
  line-height: 1.5;
}

.virtual_film_office .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}

/* --- Virtual Film Office decorative glow --- */
#virtualFilmOffice {
  position: relative;
  overflow: hidden;
}

#virtualFilmOffice::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.1), transparent);
  animation: rotate 20s linear infinite;
}

/* --- Section button animation --- */
.section-button {
  animation: slideIn 1s ease-out 0.9s forwards, pulse 2s ease-in-out infinite;
}

/* --- Film page specific keyframes --- */
@keyframes pulse {
  0%   { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.7); }
  70%  { box-shadow: 0 0 0 15px rgba(59, 130, 246, 0); }
  100% { box-shadow: 0 0 0 0 rgba(59, 130, 246, 0); }
}

@keyframes rotate {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes slideIn {
  from { opacity: 0; transform: translateX(-20px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* --- Film Production Page --- Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_film .content h1 { font-size: 40px; }
  .hero_banner_film .content h3 { font-size: 40px; }
  .hero_banner_film .content p  { font-size: 18px; }
  .hero_banner_film { max-height: 550px !important; min-height: 50vh !important; }
}

@media (max-width: 768px) {
  #virtualFilmOffice { padding-bottom: 1.5rem !important; }
  .virtual_film_office .vfo-cta h3 { font-size: 1.2rem; }
  .virtual_film_office .vfo-benefits li { font-size: 1rem; }
}

/* ============================================================
   AFFORDABLE HOUSING PAGE STYLES
   (moved from affordable-housing-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Affordable Housing page specific) --- */
.hero_banner_house_page {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
}

.hero_banner_house_page .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.hero_banner_house_page .over_layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
}

.hero_banner_house_page .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_house_page .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_house_page .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_house_page .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_house_page .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Scoped: .text-primarys on housing page = yellow --- */
.hero_banner_house_page .text-primarys {
  position: relative;
  z-index: 105;
  color: #f9c304 !important;
}

/* --- Scoped: .btn-primary on housing page = yellow pill in front of overlay --- */
.hero_banner_house_page .btn-primary,
.hero_banner_house_page #scrollTopAff {
  color: black;
  background-color: #f9c304;
  border-color: #f9c304;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
  z-index: 105 !important;
}

/* --- Scoped: .text-dark on housing page = white overlay text --- */
.hero_banner_house_page .text-dark {
  position: relative;
  color: white !important;
  z-index: 105;
}

/* --- Highlighted text badge on housing page --- */
#bold-text {
  background-color: #247094;
  color: #f9c304;
  padding-right: 5px;
  padding-left: 5px;
  border-radius: 4px;
}

/* --- Investment Credit Cards hover (fallback) --- */
.investment_credit.our_clients .client_block {
  transition: all ease 0.3s;
}

.investment_credit.our_clients .client_block:hover {
  border-radius: 20px;
  background: linear-gradient(60deg, #113d63 0%, #2279c5 100%),
    linear-gradient(60deg, #373737 0%, #5b5b5b 100%), #fff;
  box-shadow: 0px 11px 40px 0px rgba(16, 85, 150, 0.15);
  transition: all ease 0.3s;
}

.investment_credit.our_clients .client_block:hover h5,
.investment_credit.our_clients .client_block:hover p {
  color: #fff;
}

.investment_credit.our_clients .client_block img {
  transition: all ease 0.1s;
}

.investment_credit.our_clients .client_block img:last-child {
  opacity: 0;
}

.investment_credit.our_clients .client_block:hover img:first-child {
  opacity: 0;
}

.investment_credit.our_clients .client_block:hover img:last-child {
  opacity: 1;
}

/* --- Affordable Housing Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_house_page .content h1 { font-size: 40px; }
  .hero_banner_house_page .content h3 { font-size: 40px; }
  .hero_banner_house_page .content p  { font-size: 18px; }
  .hero_banner_house_page { max-height: 550px !important; min-height: 50vh !important; }
}

@media only screen and (max-width: 767px) {
  .border-esg {
    display: none;
  }
}

/* ============================================================
   ASSET MANAGEMENT PAGE STYLES
   (moved from asset-management-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Asset Management page specific) --- */
.hero_banner_asset {
  position: relative;
  z-index: 0;
  text-shadow: 0 0 1px #111;
}

.hero_banner_asset .content {
  display: flex;
  align-items: center;
  min-height: 670px;
}

.hero_banner_asset .content .btn {
  text-shadow: none !important;
}

.hero_banner_asset .content.bg_inverse {
  background: #ffffff88;
}

.hero_banner_asset .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.text-shadow {
  text-shadow: 0 0 1px #111;
}

.hero_banner_asset .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_asset .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_asset .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_asset .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

.hero_banner_asset .btn-primarys {
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

/* --- Asset Management Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_asset .content h1 { font-size: 40px; }
  .hero_banner_asset .content h3 { font-size: 40px; }
  .hero_banner_asset .content p  { font-size: 18px; }
  .hero_banner_asset { max-height: 550px !important; min-height: 50vh !important; }
}

/* ============================================================
   HISTORIC REHABILITATION PAGE STYLES
   (moved from historic-rehabilitation-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Historic Rehabilitation page specific) --- */
.hero_banner_historic {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_historic .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.hero_banner_historic .over_layout {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.6) 40%, rgba(0, 0, 0, 0.15) 75%, rgba(0, 0, 0, 0) 100%);
}

.hero_banner_historic .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_historic .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_historic .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_historic .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_historic .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- .btn-primaryisss button style --- */
.btn-primaryisss {
  color: black;
  background-color: #f9c304;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  overflow: hidden;
  position: relative;
}

/* --- Historic Rehabilitation Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_historic .content h1 { font-size: 40px; }
  .hero_banner_historic .content h3 { font-size: 40px; }
  .hero_banner_historic .content p  { font-size: 18px; }
  .hero_banner_historic { max-height: 550px !important; min-height: 50vh !important; }
}

@media only screen and (max-height: 600px) {
  .hero_banner_historic .content h1,
  .hero_banner_historic .content h3 {
    font-size: 36px !important;
  }
  .hero_banner_historic .content {
    min-height: inherit;
    align-items: flex-start;
    padding-top: 4vh;
  }
  .hero_banner_historic .content p {
    font-size: 16px !important;
    margin-bottom: 4vh;
  }
  .hero_banner_historic,
  .hero_banner_historic ~ .video-background video,
  .hero_banner_historic .video-background video {
    max-height: unset !important;
    min-height: 92vh !important;
    width: 100% !important;
  }
}

@media only screen and (max-width: 490px) {
  .hero_banner_historic .content h1,
  .hero_banner_historic .content h3 {
    font-size: 8vw !important;
  }
  .hero_banner_historic .content {
    min-height: inherit;
    align-items: flex-start;
    padding-top: 4vh;
  }
  .hero_banner_historic .content p {
    font-size: 4vw !important;
    margin-bottom: 2vh;
  }
  .btn-primaryisss {
    font-size: 4vw !important;
  }
}

/* ============================================================
   CORPORATIONS PAGE STYLES
   (moved from corporations-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Corporations page specific) --- */
.hero_banner_corporations {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_corporations .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.hero_banner_corporations .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_corporations .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_corporations .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_corporations .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_corporations .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Corporations Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_corporations .content h1 { font-size: 40px; }
  .hero_banner_corporations .content h3 { font-size: 40px; }
  .hero_banner_corporations .content p  { font-size: 18px; }
  .hero_banner_corporations {
    max-height: 550px !important;
    min-height: max(290px, 50vh) !important;
  }
}

@media only screen and (max-width: 490px) {
  .hero_banner_corporations .content h1,
  .hero_banner_corporations .content h3 {
    font-size: 7.2vw;
  }
}

/* ============================================================
   BANK PAGE STYLES
   (moved from bank-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Bank page specific) --- */
.hero_banner_bank_page {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_bank_page .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

.hero_banner_bank_page .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_bank_page .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_bank_page .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_bank_page .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_bank_page .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Bank Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_bank_page .content h1 { font-size: 40px; }
  .hero_banner_bank_page .content h3 { font-size: 40px; }
  .hero_banner_bank_page .content p  { font-size: 18px; }
  .hero_banner_bank_page {
    max-height: 550px !important;
    min-height: max(290px, 50vh) !important;
  }
}

@media only screen and (max-width: 490px) {
  .hero_banner_bank_page .content h1,
  .hero_banner_bank_page .content h3 {
    font-size: 8vw;
  }
  .hero_banner_bank_page .content p {
    color: #333 !important;
    text-shadow: 1px 1px 1px #fff;
    font-weight: 600;
    font-size: 3.8vw;
    margin-bottom: 3vw;
  }
  .hero_banner_bank_page .content .btn-secondary {
    font-size: 3.2vw;
  }
}

/* ============================================================
   INSURANCE COMPANY PAGE STYLES
   (moved from insurance-company-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Insurance Company page specific) --- */
.hero_banner_insurance_company {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_insurance_company .content {
  display: flex;
  align-items: center;
  min-height: 670px;
}

.hero_banner_insurance_company .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_insurance_company .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_insurance_company .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_insurance_company .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_insurance_company .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Insurance Company Page — Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_insurance_company .content h1 { font-size: 40px; }
  .hero_banner_insurance_company .content h3 { font-size: 40px; }
  .hero_banner_insurance_company .content p  { font-size: 18px; }
  .hero_banner_insurance_company {
    max-height: 550px !important;
    min-height: 50vh !important;
  }
}

@media only screen and (max-width: 490px) and (min-height: 600px) {
  .hero_banner_insurance_company .content {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    min-height: unset;
  }
  .hero_banner_insurance_company .content h1,
  .hero_banner_insurance_company .content h3 {
    font-size: 7.5vw;
  }
  .hero_banner_insurance_company .content p {
    font-size: 4.5vw;
    margin-bottom: 3vw;
  }
}





/* ============================================================
   RENEWABLE ENERGY DEVELOPERS PAGE - HERO SECTION STYLING
   (centered text with proper top header spacing)
   ============================================================ */
#renewable-hero-section.hero_banner_energy_page {
  position: relative;
  z-index: 0;
  min-height: 550px;
}

#renewable-hero-section.hero_banner_energy_page .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

#renewable-hero-section .content h1,
#renewable-hero-section #renewable-hero-title {
  color: var(--primary, #247094) !important;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

#renewable-hero-section .content h3,
#renewable-hero-section #renewable-hero-subtitle {
  color: var(--Fallbrook-Blue, #113d63) !important;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

#renewable-hero-section .content p,
#renewable-hero-section #renewable-hero-description {
  color: #383838 !important;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

#renewable-hero-section button#scrollTopBank {
  color: #fff !important;
  background-color: #247094 !important;
  border-color: #247094 !important;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  font-weight: 600;
  font-size: 16px;
  overflow: hidden;
  position: relative;
  border: none;
}

@media only screen and (max-height: 1080px) {
  #renewable-hero-section.hero_banner_energy_page {
    height: 520px !important;
    min-height: 480px !important;
    max-height: 550px !important;
  }
  #renewable-hero-section .content h1,
  #renewable-hero-section #renewable-hero-title {
    font-size: 40px !important;
  }
  #renewable-hero-section .content h3,
  #renewable-hero-section #renewable-hero-subtitle {
    font-size: 40px !important;
  }
  #renewable-hero-section .content p,
  #renewable-hero-section #renewable-hero-description {
    font-size: 18px !important;
    margin: 12px 0 22px 0 !important;
  }
}

@media only screen and (max-width: 991px) {
  #renewable-hero-section .content h1,
  #renewable-hero-section .content h3 {
    font-size: 40px !important;
  }
}

@media only screen and (max-width: 490px) {
  #renewable-hero-section .content h1,
  #renewable-hero-section .content h3 {
    font-size: 7.5vw !important;
  }
  #renewable-hero-section .content p {
    font-size: 4.5vw !important;
    margin-bottom: 3vw !important;
  }
}

@media only screen and (max-width: 490px) {
  #renewable-hero-section .content h1,
  #renewable-hero-section .content h3 {
    font-size: 7.5vw !important;
  }
  #renewable-hero-section .content p {
    font-size: 4.5vw !important;
    margin-bottom: 3vw !important;
  }
}

/* ============================================================
   BORROWERS PAGE STYLES
   (moved from borrowers-page.php inline <style> blocks)
   ============================================================ */

/* --- Hero Banner (Borrowers page specific) --- */
.hero_banner_borrowers {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_borrowers .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero_banner_borrowers .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_borrowers .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_borrowers .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_borrowers .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_borrowers .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

#borrowers-hero-section .content h1,
#borrowers-hero-section #borrowers-hero-title {
  color: var(--primary, #247094) !important;
}

#borrowers-hero-section .content h3,
#borrowers-hero-section #borrowers-hero-subtitle {
  color: var(--Fallbrook-Blue, #113d63) !important;
}

#borrowers-hero-section .content p,
#borrowers-hero-section #borrowers-hero-description {
  color: #383838 !important;
}

/* --- Table styling (Borrowers / shared) --- */
.table-wrapper {
  margin: 10px 70px 70px;
  border-radius: 10px;
}

.fl-table {
  border-radius: 5px;
  font-size: 12px;
  font-weight: 500;
  border-collapse: collapse;
  width: 100%;
  max-width: 100%;
  white-space: nowrap;
  background-color: white;
  border: 2px solid #e89d23;
  border-radius: 10px;
}

.fl-table td,
.fl-table th {
  text-align: center;
  padding: 8px;
}

.fl-table td {
  border-left: 2px solid #e89d23;
  font-size: 16px;
  padding: 10px;
}

.fl-table thead th {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  font-weight: bold;
  font-size: 17px;
  border: 2px solid #e89d23;
}

.fl-table thead th:nth-child(odd) {
  color: var(--Fallbrook-Blue);
  background-color: var(--yellow);
  padding: 15px;
}

.fl-table tbody td {
  border-bottom: 1px solid #e89d23;
  color: var(--Fallbrook-Blue);
  padding: 15px;
}

/* --- Letter card pattern --- */
.letter_card {
  border-radius: 30px;
  background-image: url(../images/pattern.png),
    linear-gradient(270deg, #3891dd 0%, #113d63 100%);
  background-blend-mode: darken;
  overflow: hidden;
}

.esg_invest.unlock_power .accordion .accordion-item .accordion-button {
  background-image: linear-gradient(84deg, #e89d23 0%, #f9c304 100%);
  background-color: var(--yellow);
}

/* --- Borrowers Responsive Breakpoints --- */
@media only screen and (max-width: 991px) {
  .hero_banner_borrowers .content p {
    text-shadow: 1px 1px 1px #fff0f0;
    color: #333 !important;
    font-weight: 700;
  }
  .hero_banner_borrowers .content h1,
  .hero_banner_borrowers .content h3 {
    font-size: 40px !important;
  }
}

@media only screen and (max-height: 1080px) {
  .hero_banner_borrowers .content h1 {
    font-size: 40px;
  }
  .hero_banner_borrowers .content h3 {
    font-size: 40px;
  }
  .hero_banner_borrowers .content p {
    font-size: 18px;
  }
  .hero_banner_borrowers {
    max-height: 550px !important;
    min-height: 50vh !important;
  }
}

@media only screen and (max-width: 490px) and (min-height: 600px) {
  .hero_banner_borrowers .content {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    min-height: unset;
  }
  .hero_banner_borrowers .content h1,
  .hero_banner_borrowers .content h3 {
    font-size: 7.5vw;
  }
  .hero_banner_borrowers .content p {
    font-size: 4.5vw;
    margin-bottom: 3vw;
  }
}

/* ============================================================
   DEVELOPERS PAGE STYLES
   (moved from developers-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Developers page specific) --- */
.hero_banner_developers_page {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_developers_page .content {
  display: flex;
  align-items: center;
  min-height: 670px;
  width: 100%;
}

.hero_banner_developers_page .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_developers_page .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_developers_page .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_developers_page .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_developers_page .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* --- Renewable Form Block 2 (Developers page) --- */
.renewable_form_block2 {
  border-radius: 20px;
  background-image: url(../images/pattern2.png),
    linear-gradient(270deg, var(--primary) 0%, var(--primary) 100%);
  background-blend-mode: darken;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-size: cover;
  color: #fff;
  text-align: center;
}

.renewable_form_block2 p {
  margin: 0;
  margin-bottom: 0.5rem;
  font-size: 22px;
  font-weight: 400;
}

.renewable_form_block2 h3 {
  color: #fff;
  font-weight: 700;
  font-size: 34px;
  margin-bottom: 1.5rem;
}

.renewable_form_block2 .form-control {
  border-radius: 10px;
  border: 2.5px solid #fff !important;
  background-color: transparent;
  color: #fff !important;
}

.renewable_form_block2 .form-control::placeholder {
  opacity: 0.75;
  color: #fff;
}

.renewable_form_block2 .btn {
  border-radius: 10px;
  color: #2f4e0d;
  font-weight: 500;
}

/* --- Why Choose Slider (Developers page) --- */
.why_choose_slider.owl-theme .owl-nav {
  text-align: end;
}

.why_choose_slider.owl-theme .owl-nav button {
  width: 55px;
  height: 55px;
  display: inline-flex;
  justify-content: center;
  font-size: 34px;
  border: 2px solid var(--primary);
  border-radius: 50%;
  color: var(--primary);
}

.why_choose_slider.owl-theme .owl-nav button:hover {
  background-color: var(--primary);
  color: #fff;
}

.why_choose_slider .card {
  border-radius: 15px;
}

.why_choose_slider .card:hover {
  background: linear-gradient(60deg, #113d63 0%, #2279c5 100%), #d9d9d9;
}

.why_choose_slider .card:hover h5 {
  color: var(--yellow);
}

.why_choose_slider .card:hover p {
  color: #fff;
}

/* --- Developers Responsive Breakpoints --- */
@media only screen and (max-height: 1080px) {
  .hero_banner_developers_page .content h1 {
    font-size: 40px;
  }
  .hero_banner_developers_page .content h3 {
    font-size: 40px;
  }
  .hero_banner_developers_page .content p {
    font-size: 18px;
  }
  .hero_banner_developers_page {
    max-height: 550px !important;
    min-height: 50vh !important;
  }
}

@media only screen and (max-width: 490px) and (min-height: 600px) {
  .hero_banner_developers_page .content {
    display: flex;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    min-height: unset;
  }
  .hero_banner_developers_page .content h1,
  .hero_banner_developers_page .content h3 {
    font-size: 7.5vw;
  }
  .hero_banner_developers_page .content p {
    font-size: 4.5vw;
    margin-bottom: 3vw;
  }
}


/* ============================================================
   FILM PRODUCER PAGE STYLES
   (moved from film-producer-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Film Producer page specific) --- */
.hero_banner_film_producer {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_film_producer .hero_bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
}

.hero_banner_film_producer .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 670px;
  z-index: 1;
}

.hero_banner_film_producer .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_film_producer .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_film_producer .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_film_producer .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_film_producer .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* Scoped colors for Film Producer Hero Section */
#film-producer-hero-section .content h1,
#film-producer-hero-section #film-producer-hero-title {
  color: var(--primary, #247094) !important;
}

#film-producer-hero-section .content h3,
#film-producer-hero-section #film-producer-hero-subtitle {
  color: var(--Fallbrook-Blue, #113d63) !important;
}

#film-producer-hero-section .content p,
#film-producer-hero-section #film-producer-hero-description {
  color: #383838 !important;
}

#film-producer-hero-section button#scrollTopPro {
  color: #fff !important;
  background-color: #247094 !important;
  border-color: #247094 !important;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  font-weight: 600;
  font-size: 16px;
  overflow: hidden;
  position: relative;
  border: none;
}

/* Added height on the hero section as requested (670px desktop, min 620px on laptop) */
#film-producer-hero-section.hero_banner_film_producer {
  min-height: 670px !important;
  max-height: none !important;
  height: auto;
}

#film-producer-hero-section.hero_banner_film_producer .content {
  min-height: 670px !important;
}

@media only screen and (max-height: 1080px) {
  #film-producer-hero-section.hero_banner_film_producer {
    min-height: 620px !important;
    max-height: none !important;
  }
  #film-producer-hero-section.hero_banner_film_producer .content {
    min-height: 620px !important;
  }
}

@media only screen and (max-width: 991px) {
  .hero_banner_film_producer .content h1,
  .hero_banner_film_producer .content h3 {
    font-size: 40px !important;
  }
  .hero_banner_film_producer .content p {
    text-shadow: 1px 1px 1px #fff0f0;
    color: #333 !important;
    font-weight: 700;
  }
}

@media only screen and (max-width: 767px) {
  /* Switch from absolute overlay to normal flow so content is never clipped */
  .hero_banner_film_producer {
    min-height: unset !important;
    height: auto !important;
  }
  .hero_banner_film_producer .hero_bg {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
    z-index: -1;
  }
  .hero_banner_film_producer .content {
    position: relative !important;
    height: auto !important;
    min-height: unset !important;
    top: auto !important;
    left: auto !important;
    padding-top: 80px !important;
    padding-bottom: 40px !important;
    display: block !important;
  }
  #film-producer-hero-section.hero_banner_film_producer {
    min-height: unset !important;
  }
  #film-producer-hero-section.hero_banner_film_producer .content {
    min-height: unset !important;
  }
  .hero_banner_film_producer .content h1,
  .hero_banner_film_producer .content h3 {
    font-size: 30px !important;
    letter-spacing: -0.5px !important;
  }
  .hero_banner_film_producer .content p {
    font-size: 15px !important;
    margin-bottom: 20px !important;
    font-weight: 600;
    color: #333 !important;
    text-shadow: 1px 1px 2px rgba(255,255,255,0.6);
  }
}

@media only screen and (max-width: 490px) {
  .hero_banner_film_producer .content h1,
  .hero_banner_film_producer .content h3 {
    font-size: 7.5vw !important;
  }
  .hero_banner_film_producer .content p {
    font-size: 4.5vw !important;
    margin-bottom: 3vw !important;
    text-shadow: 1px 1px 1px #fff0f0;
    color: #333 !important;
    font-weight: 700;
  }
}

/* --- Tax Credit Block (Film Producer page) --- */
.tax_credit_block:hover {
  background: #FFC107;
  color: black;
}

/* --- Collaborative block --- */
.collaborative_block {
  border-radius: 15px;
  background: #def1fd;
  margin: 1.25rem 0;
  padding: 0.75rem 2rem;
}

.collaborative_block:last-child {
  margin-bottom: 0;
}

/* --- Sustainable Impact --- */
.sustainable_impact img {
  height: 100%;
  object-fit: cover;
}

.sustainable_impact h4 {
  font-size: 22px;
  font-weight: 750;
  letter-spacing: 0.28px;
}

.sustainable_impact p {
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.24px;
}

/* --- ESG Content (Film Producer page) --- */
.esg-Content h3 {
  font-size: 35px;
}

.esg-Content span {
  font-size: 40px;
  line-height: 45px;
}

.esg-Content p {
  color: #1c1c1c;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 25px;
  letter-spacing: 0.24px;
}

.esg-Content {
  position: relative;
  display: flex;
  align-items: center;
}

.border-esg {
  position: absolute;
  width: 10px;
  right: 0;
  height: 100%;
  background-color: var(--Fallbrook-Blue);
  top: 0;
  border-radius: 5px;
}

/* --- ESG Cblock --- */
.esg_cblock {
  text-align: center;
}

.esg_cblock p {
  color: var(--Fallbrook-Blue);
  font-family: var(--headerFont);
  font-size: 18px;
  font-weight: 400;
  letter-spacing: 0.24px;
}

.esg_cblock h6 {
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.28px;
}

.esg_cblock img {
  width: 130px;
  height: 130px;
  object-fit: cover;
  margin-bottom: 1.5rem;
}

/* --- Service Block Hover Effects (Film Producer page) --- */
.service_block {
  position: relative;
}

.service_block:hover {
  border-radius: 20px;
  border: black;
  background: linear-gradient(84deg, #113d63 0%, #247094 100%), #247094;
  height: 100%;
  color: white;
}

.service_block p:hover,
.service_block:hover p {
  color: #ffffff !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 129.5%;
}

.service_block h6:hover,
.service_block:hover h6 {
  font-size: 20px;
  font-weight: 500;
  line-height: normal;
  margin: 0.5rem 0;
  color: #FFC107;
}

.on_hover {
  position: absolute;
  top: 0;
  opacity: 0;
  transition: all ease 0.3s;
}

.not_hover {
  opacity: 1;
  transition: all ease 0.3s;
}

.service_block:hover .on_hover {
  opacity: 1;
  top: 25px;
}

.service_block:hover .not_hover {
  opacity: 0;
}

.hover_magic:hover .on_hover {
  opacity: 1;
}

.hover_magic:hover .not_hover {
  opacity: 0;
}

p.lead.mt-0 {
  color: #000000;
  font-weight: 700;
}


/* ============================================================
   OUR COMPANY PAGE STYLES
   (moved from our-company-page.php inline <style> block)
   ============================================================ */

/* --- Hero Banner (Our Company page specific) --- */
.hero_banner_our_company {
  position: relative;
  z-index: 0;
  min-height: 670px;
}

.hero_banner_our_company .hero_bg {
  position: absolute;
  z-index: -1;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  object-fit: cover;
}

.hero_banner_our_company .content {
  display: flex;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 670px;
  z-index: 1;
}

.hero_banner_our_company .content small {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  display: block;
  margin-bottom: 1.25rem;
}

.hero_banner_our_company .content h1 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 750;
  line-height: 122.5%;
  letter-spacing: -1.2px;
  margin-bottom: 0.5rem;
}

.hero_banner_our_company .content h1 span {
  background-color: var(--primary);
  color: var(--yellow);
  padding: 0.3rem 1rem;
  border-radius: 10px;
}

.hero_banner_our_company .content h3 {
  color: #fff;
  font-family: var(--headerFont);
  font-size: 50px;
  font-style: normal;
  font-weight: 400;
  line-height: 102.5%;
  letter-spacing: -1.2px;
}

.hero_banner_our_company .content p {
  color: #fff;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  margin: 15px 0 25px 0;
  line-height: 1.3;
}

/* Scoped colors for Our Company Hero Section */
#company-hero-section .content h1,
#company-hero-section #company-hero-title {
  color: var(--primary, #247094) !important;
}

#company-hero-section .content h3,
#company-hero-section #company-hero-subtitle {
  color: var(--Fallbrook-Blue, #113d63) !important;
}

#company-hero-section .content p,
#company-hero-section #company-hero-description {
  color: #383838 !important;
}

#company-hero-section button#scrollTopOur {
  color: #fff !important;
  background-color: #247094 !important;
  border-color: #247094 !important;
  padding: 0.8rem 1.8rem;
  border-radius: 30px;
  font-weight: 600;
  font-size: 16px;
  overflow: hidden;
  position: relative;
  border: none;
}

/* Added height on the hero section as requested (670px desktop, min 620px on laptop) */
#company-hero-section.hero_banner_our_company {
  min-height: 670px !important;
  max-height: none !important;
  height: auto;
}

#company-hero-section.hero_banner_our_company .content {
  min-height: 670px !important;
}

@media only screen and (max-height: 1080px) {
  #company-hero-section.hero_banner_our_company {
    min-height: 620px !important;
    max-height: none !important;
  }
  #company-hero-section.hero_banner_our_company .content {
    min-height: 620px !important;
  }
}

@media only screen and (max-width: 767px) {
  .hero_banner_our_company .content h1,
  .hero_banner_our_company .content h3 {
    font-size: 40px !important;
  }
  .hero_banner_our_company .content p {
    font-size: 18px !important;
    font-weight: 600;
    text-shadow: 1px 1px 1px #fff;
  }
  .hero_banner_our_company .content button.btn-primary {
    font-size: 15px !important;
  }
}

@media only screen and (max-width: 490px) {
  .hero_banner_our_company .content h1,
  .hero_banner_our_company .content h3 {
    font-size: 6.5vw !important;
  }
  .hero_banner_our_company .content p {
    font-size: 4vw !important;
  }
  .hero_banner_our_company .content button.btn-primary {
    font-size: 3vw !important;
  }
}

/* --- Philosophy and Commitment (Our Company page) --- */
.phil_com .card {
  border-radius: 15px;
  background: #fff;
  box-shadow: 0px 10px 40px -10px rgba(16, 85, 150, 0.15);
}

.phil_com .card h3 {
  font-size: 28px;
  font-weight: 700;
  text-transform: uppercase;
}

.phil_com .card p {
  color: #000;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.4;
}

/* --- Our History (Our Company page) --- */
.history_left {
  position: relative;
  border-left: 2px solid var(--Fallbrook-Blue);
  height: 100%;
  display: flex;
  align-items: center;
}

.history_icon {
  position: absolute;
  width: 15px;
  height: 15px;
  background-color: var(--Fallbrook-Blue);
  border-radius: 50%;
  transform: translateY(-50%);
  top: 50%;
  left: -9px;
}

.history_line {
  width: 70%;
  height: 1px;
  border-bottom: 2px dashed var(--Fallbrook-Blue);
  display: block;
  position: absolute;
  transform: translateY(-50%);
  top: 50%;
  left: 8px;
}

.history_left h3 {
  padding-left: calc(70% + 15px);
}

.history_right_content h5 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
}

.col-12:nth-child(even) .history_right_content h5 {
  color: var(--yellow);
}

.history_right_content p {
  color: var(--Fallbrook-Blue);
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: 0.24px;
}

@media only screen and (max-width: 991px) {
  .history_left {
    border-left: 0;
    border-top: 2px solid var(--Fallbrook-Blue);
  }

  .history_icon {
    left: 50%;
    transform: translateX(-50%);
    top: -9px;
  }

  .history_line {
    top: 45px;
    height: 100px;
    width: 1px;
    left: calc(50% - 1px);
    transform: translate(0, -50%);
    border-bottom: 0;
    border-left: 2px dashed var(--Fallbrook-Blue);
  }

  .history_left {
    justify-content: center;
  }

  .history_left h3 {
    justify-content: center;
    width: 100%;
    padding-left: 0 !important;
    text-align: center;
    padding-top: 110px;
  }
}
