* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*  
font-family: "Aboreto", system-ui;
font-family: "Tenor Sans", sans-serif;
*/
body {
  background: #fff;
  transition: 0.3s;
  font-size: 1rem;
  font-weight: 400;
  color: #fff;
  font-family: "Tenor Sans", sans-serif;
}

a {
  text-decoration: none;
  background: transparent;
  color: #fff;
  transition: 0.4s all ease;
}

a:hover {
  color: #fff;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  font-family: "Aboreto", system-ui;
}

p {
  margin-top: 0;
  font-size: 16px;
  margin-bottom: 0rem;
  color: #5f5f5f;
  font-weight: 400;
}

section {
  padding: 80px 0;
  display: block;
  width: 100%;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

/* SITE BTN */
.site-btn {
  font-size: 14px;
  line-height: 1;
  text-transform: capitalize;
  color: var(--s-white);
  font-weight: 500;
  text-align: center;
  padding: 13px 25px;
  background-color: var(--s-primary);
  border: 1px solid var(--s-primary);
  border-radius: 8px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
  transition: all 0.5s;
  letter-spacing: 1.5px;
}

.site-btn:hover {
  color: var(--s-primary);
  border: 1px solid var(--s-secondary);
  background-color: var(--s-secondary);
}

.revSite-btn {
  background-color: #fff;
  color: var(--s-primary);
  border-color: #fff;
}

.revSite-btn:hover {
  background-color: var(--s-primary);
  color: var(--s-white);
}

.site-outline-btn {
  background-color: transparent;
  border-color: var(--s-primary);
  color: var(--s-primary);
}

.revSite-outline-btn {
  background-color: transparent;
  border-color: var(--s-white);
  color: var(--s-white);
}

/* TITLE BAR */
.titleBar {
  margin-bottom: 35px;
  position: relative !important;
}

.titleBar h6 {
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--s-primary);
  margin-bottom: 15px;
  position: relative;
}

.titleBar h3 {
  font-size: 45px;
  font-weight: 600;
  color: var(--s-primary);
  margin-bottom: 20px;
}

.iconbg {
  background: var(--s-primary);
  border-radius: 5px;
  padding: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

:root {
  --s-primary: #102854;
  --s-secondary: #E3E3E3;
  /* --s-third: #34838a; */
  --s-white: #ffffff;
  --s-black: #1b1b1b;
}

.bg-s-primary {
  background-color: var(--s-primary) !important;
}

.text-s-primary {
  color: var(--s-primary) !important;
}

.bg-s-secondary {
  background-color: var(--s-secondary) !important;
}

.text-s-secondary {
  color: var(--s-secondary) !important;
}

.text-s-white {
  color: var(--s-white) !important;
}

.bg-s-white {
  background-color: var(--s-white) !important;
}

.text-s-black {
  color: var(--s-black) !important;
}

.bg-s-black {
  background-color: var(--s-black) !important;
}

/*=========================================  
                    HOME PAGE CSS START HERE 
    ============================================*/
/* Sticky Header CSS Start */
header .header-scrolled {
  transition: all 0.5s;
  position: fixed;
  left: 0;
  right: 0;
  width: 100%;
  top: 0;
  background-color: #000000;
  z-index: 99;
  border-radius: 0;
  padding: 0px 0px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.header-scrolled .nav-link {
  /* color: var(--s-black) !important; */
  font-size: 15px !important;
}

/*================================
          HEADER CSS START HERE 
      ==================================*/
header {
  background-color: transparent;
  width: 100%;
}

/* Bottom Header Start Here */
.dropdown-menu {
  left: 15px;
  border-radius: 0;
  border: none;
  background-color: var(--s-white);
  color: var(--s-primary);
}

.dropdown-menu li a {
  color: var(--s-black);
  border-bottom: 1px solid var(--s-black);
  padding: 10px 20px;
}

.dropdown-item:hover {
  background-color: var(--s-black);
  border-color: var(--s-black);
  color: var(--s-white);
}

@media (min-width: 992px) {
  .dropdown-hover:hover>.dropdown-menu {
    display: block;
    margin-top: 0;
  }
}

.bottom-header {
  background-color: transparent;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 99;
  border-radius: 0px;
  /* padding: 40px 40px 0 40px; */
}

.navbar-toggler {
  border: 1PX SOLID #FFF;
}

.bottom-header nav .navbar-brand {
  font-size: 20px;
  font-weight: 700;
  color: var(--s-white);
  margin: 0;
}

.bottom-header nav .navbar-nav .nav-item .nav-link.active::after {
  transform: scale(1);
}

.bottom-header nav .navbar-nav .nav-item .nav-link {
  text-transform: capitalize;
  font-size: 15px;
  font-weight: 400;
  color: var(--s-white);
  padding: 3px 2px;
  margin: 0 10px;
  border-radius: 50px;
  position: relative;
  letter-spacing: 1px;
}

.bottom-header nav .navbar-nav .nav-item .nav-link::after {
  content: "";
  position: absolute;
  bottom: 0%;
  left: 0%;
  right: 0%;
  height: 1px;
  border-radius: 0px;
  border: 0 !important;
  background: currentColor;
  z-index: 1;
  transform: scale(0);
  transition: transform 0.8s cubic-bezier(0.16, 1.08, 0.38, 0.98);
}

.bottom-header nav .navbar-nav .nav-item .nav-link:hover::after {
  transform: scale(1);
}

/*************************************/
/***     Banner CSS Start Here     ***/
/*************************************/

/* Banner section start here */
.banner {
  background-color: #ffffff;
  padding: 4em 0em 4em 0em;
  position: relative;
}

.video-banner {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.video-banner::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: transparent;
  --background-overlay: '';
  background-image: linear-gradient(0deg, #000000 0%, #19197000 100%);
  left: 0;
  top: 0;
  right: 0;
  z-index: 1;
}

.banner-video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  transform: translate(-50%, -50%);
  /* Centers the video */
  z-index: 1;
  object-fit: cover;
  /* Ensures the video covers the entire banner area */
}

.bannerContent h5 {
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  color: var(--s-white);
  margin-bottom: 15px;
}

.bannerContent h1 {
  font-size: 50px;
  color: var(--s-white);
  filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.322));
  text-shadow: 1px 2px 3px rgba(0, 0, 0, 0.678);
  margin-bottom: 15px;
}

.bannerContent p {
  font-size: 17px;
  font-weight: bold;
  color: var(--s-white);
  filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.322));
  text-shadow: 1px 2px 3px rgba(0, 0, 0, .5);
  margin-bottom: 25px;
}

/* Hero Section Start here */
.heroImagesSection {
  height: 100vh;
  background-image: url(https://norcalexecutivetransportation.com/wp-content/uploads/2025/10/hero-images.jpg);
  background-attachment: fixed;
}

.heroImagesSection::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: transparent;
  --background-overlay: '';
  background-image: linear-gradient(180deg, #000000 0%, #19197000 100%);
}

/* Services Section Start Here */
.services-box {
  background-color: var(--s-secondary);
  border-radius: 10px;
  border: 1px solid var(--s-primary);
  /* padding: 30px; */
  margin-top: 100px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  transition: all.3s;
}

.services-content {
  background-color: var(--s-primary);
  padding: 50px 30px;
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
  transition: all.3s;
}

.services-box:hover .services-content {
  background-color: var(--s-black);
}

.services-content h3 {
  color: var(--s-white);
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 20px;
}

.services-content p {
  color: var(--s-white);
  margin-bottom: 15px;
}

.services-image {
  background-image: url('https://norcalexecutivetransportation.com/wp-content/uploads/2025/10/services-image-1.jpg');
  /* height: 350px; */
  /* width: 100%; */
  object-fit: cover;
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

}

/* Fleet Section Start Here */
.fleetBox {
  position: relative;
  overflow: hidden;
  height: 550px;
  display: block;
  border-radius: 8px;
  transition: all.3s;
}

.fleetBox:hover img {
  transform: scale(1.1);
}

.fleetBox img {
  object-fit: cover;
  object-position: center;
  position: relative;
  height: 550px;
  transition: all.3s;
  transform: scale(1);
}

.owl-carousel .item {
  overflow: hidden;
}

.fleetBox::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #0000005b;
  z-index: 1;
}

.fleetName {
  position: absolute;
  left: 30%;
  top: 30%;
  z-index: 2;
}

.fleetName h2 {
  color: var(--s-white);
  padding: 20px;
  height: 190px;
  width: 370PX;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  background: rgba(16, 40, 84, 0.46);
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(4.7px);
  -webkit-backdrop-filter: blur(4.7px);
  border: 1px solid rgba(16, 40, 84, 1);

}

/* Testimonials Sectiom */
.testimonialSection {
  position: relative;
  background: linear-gradient(#102854a9, #102854a9), url(https://norcalexecutivetransportation.com/wp-content/uploads/2025/10/testi-image.webp) no-repeat center center / cover;
}

.td-single-testimonial-item {
  background: transparent;
  padding: 30px;
  transition: 0.8s;
  border-radius: 0px;
  border: 1px solid #eaeaea;
  text-align: left;
}

.td-testimonial-rating ul li {
  margin: 0 1px;
}

.td-testimonial-header .td-testimonial-image {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  height: 50px;
  width: 50px;
  margin-right: 15px;
  position: relative;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--s-white);
}

.td-testimonial-image h3 {
  margin-bottom: 0;
  font-size: 25px;
  color: var(--s-primary);
}

.td-name-designation h6 {
  font-size: 18px;
  margin-bottom: 3px;
  font-weight: 400;
  color: var(--s-white);
  transition: 0.3s;
}

.td-name-designation p {
  color: var(--s-white);
  font-weight: 300;
  font-size: 13px;
}

.td-testimonial-description {
  margin: 0px 0 30px 0;
}

.td-testimonial-description p {
  display: block;
  font-weight: 400;
  font-size: 16px;
  margin-bottom: 1rem;
  color: var(--s-white);
}

/* COntact Sectionm */
.content-box h5 {
  font-family: "Tenor Sans", sans-serif;
  font-weight: 400;
}

/* Footer Section Start Here */
footer {
  background-color: var(--s-primary);
  position: relative;
  padding-top: 25px;
}

/* footer:after {
          content: "";
          position: absolute;
          left: 0;
          right: 0;
          top: 0;
          width: 100%;
          height: 100%;
          background-color: #222222f5;
          z-index: 0;
        } */
.footer-box h2 {
  font-weight: 400;
  font-size: 25px;
  margin-bottom: 17px;
  color: var(--s-white);
}

.footer-box p {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 15px;
  color: var(--s-white);
}

.footer-box h3 {
  font-weight: 600;
  font-size: 20px;
  letter-spacing: 1px;
  margin-bottom: 25px;
  color: var(--s-white);
  text-transform: uppercase;
}

.footer-box ul li {
  margin-bottom: 0.5rem;
}

.footer-box ul li a {
  font-size: 15px;
  color: var(--s-white);
}

.footer-box ul li a:hover {
  color: var(--s-white);
  letter-spacing: 1px;
}

.footer1stRow {
  padding: 2rem 0 1.5rem 0;
  position: relative;
  z-index: 1;
  /* border-top: 1px solid #2525251e; */
}

.socialmediaicon ul li a i {
  background-color: var(--s-white);
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  margin-right: 8px;
  padding: 0;
  color: var(--s-primary);
  transition: 0.3s;
  border-radius: 100px;
}

.socialmediaicon ul li a i:hover {
  transform: rotate(360deg);
  background-color: var(--s-secondary);
  color: var(--s-white);
}

.SocialIcon h3 {
  font-size: 17px;
  margin-bottom: 15px;
  display: block;
  font-weight: 600;
}

.copyRight {
  border-top: 1px solid #ffffff5b;
  padding: 20px 0;
  position: relative;
  z-index: 1;
}

/* Back To Top CSS Start Here */
.button {
  height: 50px;
  width: 50px;
  position: fixed;
  right: 20px;
  bottom: 20px;
  background-color: transparent;
  cursor: pointer;
  border: 2px solid var(--s-primary);
  overflow: hidden;
  border-radius: 30px;
  color: var(--s-primary);
  transition: all 0.5s ease-in-out;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

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

.type1::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  transition: all 0.5s ease-in-out;
  background-color: var(--s-primary);
  border-radius: 30px;
  visibility: hidden;
  height: 10px;
  width: 10px;
  z-index: -1;
}

.button:hover {
  box-shadow: 1px 1px 200px var(--s-primary);
  color: #fff;
  border: none;
}

.type1:hover::after {
  visibility: visible;
  transform: scale(100) translateX(2px);
}



/*=========================================  
       ABOUT US PAGE CSS START HERE 
============================================*/
.innerPagesBanner {
  background-color: var(--s-black);
  background-image: url(https://norcalexecutivetransportation.com/wp-content/uploads/2025/10/hero-images.jpg);
  background-position: 0% 55%;
  background-repeat: no-repeat;
  background-size: cover;
  height: 350px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.innerPagesBanner::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  background-color: #000000a4;
}

.innerpage-title {
  position: relative;
  z-index: 2;
  margin-top: 50px;
}

.innerpage-title h2 {
  font-size: 60px;
  font-style: normal;
  font-weight: 800;
  line-height: 78px;
  position: relative;
  display: block;
  color: var(--s-white);
  margin-bottom: 10px;
}

.breadcrumb-content ul li {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  color: var(--s-white);
  margin: 0 5px;
}

.breadcrumb-content ul li a {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  color: var(--s-white);
  margin-right: 5px;
}

.about_image img {
  width: 100%;
  height: 500px;
  object-fit: cover;
  object-position: center center;
  border-radius: 8px;
}

/* Mission Section Start here */
.ourMission {
  background-color: var(--s-primary);
}

.valueBox {
  box-shadow: 0px 30px 60px 0px rgba(0, 0, 0, 0.1);
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  /* margin: 10px 10px 10px 10px; */
  --e-column-margin-right: 10px;
  --e-column-margin-left: 10px;
  padding: 3em 1em 3em 1em;
  background-color: #f5fbfb;
}

.valueBox h4 {
  color: var(--s-primary);
  margin-bottom: 15px;
  font-weight: 400;
  font-size: 25px;
  margin-top: 25px;
  letter-spacing: 1px;
}

.contactIcon h5 {
  font-size: 17px;
  font-weight: 600;
}

.innerservicescontent {
  margin: 0;
}

.innerservicescontent {
  padding: 40px 30px;
}

.innerservicescontent h2 {
  font-size: 17px;
}

.innerservicescontent p {
  font-size: 17px;
}

/* FAQs Section Start Here */
.FAQs-box {
  background-image: url(https://norcalexecutivetransportation.com/wp-content/uploads/2025/10/faqs-image.jpg);
  border-radius: 30px;
}

.accordion-header .accordion-button {
  font-size: 17px;
  background-color: #FFFFFF;
  color: var(--black);
  /* padding: 17px 25px 17px 25px; */
  border-radius: 30px !important;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  font-weight: 700;
}

.accordion-button:not(.collapsed) {
  color: var(--s-white);
  background-color: var(--s-primary);
}

.accordion-item {
  background-color: transparent;
}


/* serve section */
.serve-banner {
  background:linear-gradient(rgb(0 0 0 / 92%), rgb(0 0 0 / 73%)), /* dark overlay */ url(https://norcalexecutivetransportation.com/wp-content/uploads/2025/10/9.jpg) center / cover no-repeat;
  width: 100%;
  background-attachment: fixed;
}

.serve-content {
  padding: 100px;
}
.animatePulse {
    animation: animatePulse .5s infinite alternate;
}
@keyframes animatePulse{
  0% {
      transform: scale(1.1);
  }
  100% {
      transform: scale(1.0);
  }
}
/*============================================
     Inner Services Pages CSS STart Here 
=============================================*/
.innerServicesPage p {
  margin-bottom: 20px;
}

.innerServicesImage img {
  height: 430px;
  object-fit: cover;
}

.innerServices-overlay {
  background-color: #00000088;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
}

/*============================================
    Responsive CSS STart Here 
=============================================*/
@media (max-width: 991px) {

  .bottom-header {
    position: relative;
    background-color: var(--s-primary);
  }

  .bottom-header .container {
    padding: 0 5px !important;
  }

  section {
    padding: 80px 0;
  }

  .header-btn {
    display: none;
  }

  .navbar-brand img {
    width: 90px;
  }

  .navbar-nav {
    align-items: self-start !important;
    border-top: 1px solid #ffffff7e;
    margin-top: 10px;
    padding: 8px 0;
  }

  .bottom-header nav .navbar-nav .nav-item .nav-link {
    font-size: 15px;
    padding: 6px 2px;
    margin: 0px 0;
    color: var(--s-white);
  }

  .header-scrolled .nav-link {
    color: var(--s-white) !important;
  }

  .site-btn {
    padding: 15px 30px 15px 30px;
    font-size: 14px;
  }

  .titleBar h3 {
    font-size: 25px;
  }

  .titleBar h6 {
    font-size: 13px;
  }

  p {
    font-size: 14px;
  }

  /* Banner */
  .bannerContent h1 {
    font-size: 35px;
  }

  .bannerContent p {
    font-size: 15px;
  }

  .video-banner {
    min-height: 430px;
    height: 430px;
  }

  .video-banner .container .row {
    min-height: 430px;
    height: 430px;
  }

  /* Hero Section */
  .HeroSection {
    padding-top: 0;
  }

  .hero-form {
    margin-top: 0;
  }

  /* Counter Section */
  .why-footer {
    text-align: center;
  }

  /* WHy CHoose Us */
  .why-image-box img {
    height: 350px;
  }

  /* ABout Page */
  .about_image img {
    height: 350px;
  }

  /* Inner Services Pages */
  .innerPagesBanner {
    height: 200px;
  }

  .innerpage-title {
    margin-top: 0;
  }

  .innerpage-title h2 {
    font-size: 25px;
    line-height: 25px;
  }

  .breadcrumb-content ul li {
    font-size: 13px;
  }

  .innerServicesImage img {
    height: 350px;
  }

  .accordion-header .accordion-button {
    font-size: 14px;
  }

  .contactUSPage {
    margin-top: 30px;
    padding: 30px 20px !important;
  }

  .innerservicescontent {
    padding: 0px 0;
  }
}