/* Icons */

@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css");

@import url("https://unpkg.com/boxicons@2.1.1/css/boxicons.min.css");

/* Fonts */

@import url("https://fonts.googleapis.com/css2?family=Arimo:wght@400;500;600;700&family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Outfit:wght@100;200;300;400;500;600;700;800;900&display=swap");



/* Root Styling */

:root {

  --color-primary: #FF6E07;

  --color-secondary: #f12a2d;

  --inter-font: "Inter", sans-serif;

  --outfit-font: "Outfit", sans-serif;

}



html {

  scroll-behavior: smooth;

  overflow-x: hidden;

}



/* General Styling */

* {

  padding: 0;

  margin: 0;

  box-sizing: border-box;

  text-decoration: none !important;

  list-style-type: none;

  font-family: "Arimo", sans-serif;

}



::selection {

  background-color: var(--color-primary);

  color: #fff;

}



a {

  display: inline-block;

  color: #000;

  transition: all 300ms ease-in-out;

}



ul,

ol,

dl {

  margin-bottom: 0;

}



.imgFluid {

  max-width: 100%;

  height: auto;

}



button {

  cursor: pointer;

  transition: all 300ms ease-in-out;

}



i.bx {

  vertical-align: middle;

}



.mar-y {

  margin: 4rem 0;

}


/* ThemeBtn */

.themeBtn {

  width: fit-content;

  display: block;

  background-color: var(--color-primary);

  color: #fff;

  font-size: 1rem;

  border: 1px solid transparent;

  outline: none;

  font-family: var(--outfit-font);

  font-weight: 500;

  text-transform: capitalize;

  text-align: center;

  padding: 0.75rem 2rem;

  position: relative;

  overflow: hidden;

  isolation: isolate;

}



.themeBtn::before {

  background: rgba(0, 0, 0, 0) linear-gradient(to right,

      rgba(255, 255, 255, 0) 0%,

      rgba(255, 255, 255, 0.3) 100%) repeat scroll 0 0;

  content: "";

  display: block;

  height: 100%;

  left: -100%;

  position: absolute;

  top: 0;

  transform: skewX(-25deg);

  width: 50%;

  z-index: 2;

}



.themeBtn:hover::before {

  animation: 2s ease 0s normal none 2 running shine;

}



.themeBtn.themeBtn--white::before {

  background: #FF6E0712 linear-gradient(to right, #FF6E0700 0%, #1414140d 30%) repeat scroll 0 0;

}



.themeBtn.themeBtn--outlineWhite::before {

  background: #FF6E0712 linear-gradient(to right, #FF6E0700 0%, #1414140d 30%) repeat scroll 0 0;

}



@keyframes shine {

  100% {

    left: 125%;

  }

}



@keyframes shine {

  100% {

    left: 125%;

  }

}



.themeBtn.themeBtn--outline {

  background: transparent;

  color: var(--color-primary);

  border-color: var(--color-primary);

}



.themeBtn.themeBtn--outlineWhite {

  color: #fff;

  border-color: #fff;

}



.themeBtn.themeBtn--secondary {

  background-color: var(--color-secondary);

}



.themeBtn.themeBtn--white {

  background: #fff;

  color: var(--color-primary);

}



.themeBtn.themeBtn--outlineWhite:hover {

  color: var(--color-primary) !important;

  background: #fff !important;

}



.themeBtn.themeBtn--outline:hover {

  color: #fff;

  background: var(--color-primary);

}



.themeBtn.themeBtn--white:hover {

  color: var(--color-primary);

}



.themeBtn.themeBtn--center {

  margin: 1rem auto;

}



.themeBtn.themeBtn--full {

  width: 100%;

}



.themeBtn:hover {

  color: #fff;

}



/* Card Hover */

.card-hover__img {

  width: 100%;

  height: 100%;

  overflow: hidden;

}



.card-hover__img>img {

  transition: all 300ms ease-in-out;

}



.card-hover:hover .card-hover__img>img {

  transform: scale(1.5);

}



.bubble-card {

  position: relative;

  overflow: hidden;

  z-index: 1;

}



.bubble-card::before {

  content: "";

  width: 40px;

  height: 40px;

  background: var(--color-primary);

  border-radius: 100px;

  position: absolute;

  left: -5rem;

  top: -5rem;

  transition: all 300ms ease-in-out;

  z-index: -1;

}



.bubble-card:hover::before {

  transform: scale(50);

}



.bubble-card:hover *:not(.themeBtn) {

  color: #fff;

}



.fancy-link {

  display: inline-block;

  padding: 0.15rem 0;

  color: var(--color-secondary) !important;

  position: relative;

  isolation: isolate;

  transition: all 300ms;

  margin-inline: 0.25rem;

}



.fancy-link::after {

  content: "";

  width: 100%;

  height: 2px;

  border: 1px dashed var(--color-secondary) !important;

  position: absolute;

  left: 0;

  bottom: 0;

  z-index: -1;

  transition: all 300ms;

}



.fancy-link:hover::after {

  border-style: solid !important;

}



/* Header */

.header-top {

  background: var(--color-primary);

  box-shadow: 0 0 0 100vmax var(--color-primary);

  clip-path: inset(0 -100vmax);

  padding: 0.5rem 0;

  text-align: center;

}



/* Section Heading */

.section-content {

  color: #000;

}



.section-content :is(.heading, .subHeading) {

  font-weight: 700;

  text-transform: capitalize;

  font-family: var(--inter-font);

}



.section-content .heading {

  font-size: 2.5rem;

  margin-bottom: 0.85rem;

  line-height: 1.15;

}



.section-content .heading--md {

  font-size: 3rem;

}



.section-content .heading--primary {

  color: var(--color-primary);

}



.section-content .heading.heading--purple {

  color: #FF6E07;

}



.section-content .heading.heading--sm {

  font-size: 1.75rem;

  line-height: 1.35;

}



.section-content .subHeading {

  font-size: 1.25rem;

}



.section-content p {

  color: #333333;

  font-size: 0.95rem;

  font-weight: 500;

  line-height: 1.65;

  margin-bottom: 1.5rem;

}

.section-content p a {
  color: #FF6E07;
  cursor: pointer;
}



.section-content ul {

  margin: 1rem 0 1rem 1.5rem;

}



.section-content ul li {

  color: #333333;

  font-size: 0.95rem;

  padding: 0.25rem 0;

  list-style-type: disc !important;

  font-weight: 500;

}



.section-content ul li::marker {

  color: var(--color-secondary);

}



/* Header */

header.header {

  position: relative;

  z-index: 10000;

}



.header-topWrapper {

    background: var(--color-primary);

    padding: 1rem 0;

    height: 83px;

}



:is(.socialLinksWrapper, .socialLinks) {

  display: flex;

  align-items: center;

  justify-content: center;

}



.socialLinksWrapper {

  gap: 1.25rem;

}



.socialLinksWrapper>.title {

  color: #fff;

  font-size: 1.05rem;

  font-weight: 600;

  text-transform: capitalize;

}



.socialLinks {

  gap: 1rem;

}



.socialLinks li a {

  width: 35px;

  aspect-ratio: 1/1;

  color: var(--color-primary);

  font-size: 1.1rem;

  border: 1px solid #fff;

  border-radius: 50%;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  position: relative;

  isolation: isolate;

  overflow: hidden;

}



.socialLinks li a:hover {

  border-radius: 0 10px;

  color: #fff;

}



.socialLinks li a::before {

  content: "";

  background-color: #fff;

  border-radius: 100px;

  width: 100%;

  height: 100%;

  position: absolute;

  left: 0;

  bottom: 0;

  z-index: -1;

  transition: all 300ms ease-in-out;

}



.socialLinks li a:hover::before {

  border-radius: 0;

  bottom: -100%;

}



.header-top__details {

  gap: 1.25rem;

}



.header-top__details li a {

  color: #fff;

  font-size: 0.9rem;

  font-weight: 500;

  display: flex;

  align-items: center;

  justify-content: flex-start;

  gap: 0.45rem;

}



.header-top__details li a:hover {

  color: var(--color-secondary);

}



.header-top__details li {

  color: #fff;

}



.header-top__details li a i {

  font-size: 1.35rem;

}



.header-main {

  padding: 6px 0;

}



:is(.header-top,

  .header-top__details,

  .header-main,

  .header-main__nav,

  .header-main__icons) {

  display: flex;

  align-items: center;

  justify-content: space-between;

}



.header-main__logo {

  width: 95px;
  max-width: 95px;
  display: inline-block;

}



.header-main__logo>img {

  width: 100%;

  height: auto;
  max-height: 85px;

  object-fit: contain;

}



.header-main__nav>li>a {

  color: #000;

  font-size: 0.85rem;

  font-weight: 600;

  text-transform: uppercase;

  padding-inline: 0.25rem;

  margin: 0 0.5rem;

  position: relative;

}



.header-main__nav>li>a>i {

  font-size: 1.5rem;

  padding: 0 0.15rem;

}



.header-main__actions>li>a {

  padding: 0 0.25rem;

  margin: 0;

}



.header-main__nav>li:not(.search-action)>a::after {

  content: "";

  width: 0;

  height: 3px;

  border-radius: 100%;

  background-color: var(--color-secondary);

  position: absolute;

  left: 0;

  bottom: -5px;

  transition: all 300ms ease-in-out;

}



.header-main__nav>li:not(.search-action)>a:is(:hover, .active)::after {

  width: 100%;

}



.header-main__nav>li>a:where(:hover, .active),

.header-main__nav .search-action a:hover {

  color: var(--color-secondary);

}



.header-main__nav .search-action>a {

  padding: 0 0.5rem;

  font-size: 1.35rem;

  margin-bottom: 0.25rem;

}



/* Banner */

.banner {

  width: 100%;

  height: 100%;

  min-height: 100vh;

  color: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  overflow: hidden;

  padding: 10rem 0;

}



.banner--inner {

  padding: 5rem 0 10rem;

}



.banner__rightimg {

  width: 73%;

  height: 100%;

  object-fit: cover;

  position: absolute;

  right: 0;

  bottom: 0;

  /* pointer-events: none; */

}



.bannerImgSlider.slick-initialized.slick-slider {

  position: absolute;

  right: 0;

  border: 0;

  width: 73%;

}



:is(.banner-auth, .banner-auth__single > a) {

  display: flex;

  align-items: center;

  justify-content: center;

}



.banner-auth {

  flex-direction: column;

  position: fixed;

  top: 50%;

  transform: translateY(-50%);

  right: 0;

  z-index: 8901;

}



.banner-auth__single {

  width: 100%;

}



.banner-auth__single>a {

  background: #fff;

  flex-direction: column;

  gap: 0.3rem;

  padding: 1.5rem 0.85rem 0.5rem;

  text-align: center;

  clip-path: polygon(0 20%, 100% 0, 100% 100%, 0% 100%);

}



.banner-auth__single:last-child>a {

  background: var(--color-primary);

  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 80%);

  padding: 0.75rem 0.85rem 1.5rem;

}



.banner-auth__single>a>.title {

  width: min-content;

  color: var(--color-primary);

  font-size: 0.9rem;

  font-weight: 500;

  text-transform: capitalize;

  font-family: var(--outfit-font);

  line-height: 1.25;

  transition: all 300ms ease-in-out;

}



.banner-auth__single:last-child>a>.title {

  color: #fff;

}



.banner-auth__single>a>img {

  width: 20px;

  aspect-ratio: 1/1;

  object-fit: cover;

  transition: all 300ms ease-in-out;

}



.banner-auth__single:last-child>a>img {

  filter: brightness(100);

}



.banner-auth__single>a:hover,

.banner-auth.scrolled .banner-auth__single>a {

  background: var(--color-primary);

}



.banner-auth__single>a:hover .title,

.banner-auth.scrolled .banner-auth__single>a .title {

  color: #fff;

}



.banner-auth__single>a:hover>img,

.banner-auth.scrolled .banner-auth__single>a img {

  filter: brightness(100);

}



.banner .quick-order {

  color: var(--color-primary);

  font-family: var(--outfit-font);

  font-size: 1rem;

  font-weight: 600;

  writing-mode: vertical-lr;

  position: fixed;

  top: 50%;

  transform: translateY(-50%);

  left: 0;

  padding: 1.5rem 0.75rem;

  background: #fff;

  z-index: 11111111111;

  display: none;

}



.banner .quick-order:where(:hover, .scrolled) {

  color: #ffff;

  background: var(--color-secondary);

}



.banner__bg {

  width: 100%;

  height: 100%;

  object-fit: cover;

  position: absolute;

  inset: 0;

  z-index: -1;

}



:is(.banner-content__heading, .banner-content__subHeading) {

  font-family: var(--inter-font);

}



.banner-content__heading {

  font-size: 4rem;

  font-weight: 800;

  line-height: 1.25;

}



.banner-content__heading span {

  font: inherit;

  color: var(--color-secondary);

}



.banner-content__subHeading {

  font-size: 1.1rem;

  text-transform: uppercase;

  font-weight: 700;

  margin-bottom: 0;

  line-height: 1;

}



.banner-content>p {

  font-size: 1rem;

  font-weight: 500;

  line-height: 1.75;

  margin-bottom: 1rem;

}



.banner__img {

  width: 100%;

  height: 100%;

}



.banner__img>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



/* Footer */

.footer {

  color: #222222;

  background-color: #e1e1e1;

  padding-top: 4rem;

}



.imgWrapper img {

  width: 50%;

}



.footer .title {

  font-size: 1.15rem;

  font-weight: 600;

  text-transform: capitalize;

  margin-bottom: 1rem;

  font-family: var(--inter-font);

}



.footer-info__logo {

  width: 130px;
  max-width: 130px;
  display: inline-block;

}



.footer-info__logo>img {

  width: 100%;

  height: auto;
  max-height: 120px;

  object-fit: contain;

}



.footer__quickLinks--cond ul {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 1rem;

}



.footer__quickLinks>ul>li :is(a, address) {

  color: #222222;

  font-size: 0.9rem;

  font-weight: 600;

  text-transform: capitalize;

  padding: 0.45rem 0;

  display: inline-flex;

  align-items: flex-start;

  justify-content: flex-start;

  gap: 0.45rem;

}



.footer__quickLinks>ul>li :is(a, address)>i {

  color: var(--color-primary);

  font-size: 1.25rem;

  transition: all 300ms ease-in-out;

}



.footer__quickLinks>ul>li>a:hover,

.footer__quickLinks>ul>li>a:hover i {

  color: var(--color-secondary);

}



.footer__copyright>p {

  font-size: 0.95rem;

  font-weight: 600;

  margin-bottom: 0;

}



.footer__copyright {

  margin-top: 1rem;

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 1rem;

  padding: 0.75rem 0;

}



/* About Us */

.about {

  position: relative;

  isolation: isolate;

}



.about--padd {

  padding: 5rem 0;

}



.about--alt {

  padding: 4rem 0;

}



.about--alt::after {

  content: "";

  width: 95%;

  height: 100%;

  position: absolute;

  top: 0;

  right: 0;

  background: #FFF0E6;

  border-radius: 500px 0 0 500px;

  z-index: -1;

}



.about--circle {

  border-radius: 500px 0 0 500px;

  padding: 3rem 0;

  padding-left: 15rem;

  padding-right: 5rem;

}



.about--lightBg {

  background: #e9e9ea;

}



.about--primary {

  background: var(--color-primary);

}



.about--primary :is(.heading, p) {

  color: #fff;

}



.about__img.about__img--radius {

  width: 95%;

  height: 600px;

  border-radius: 200px 0px 200px;

}

.about__img.about__img--normal{

    height: 800px;

}



.about__img.about__img--altRadius {

  border-radius: 0 20% 0 20%;

}



.about__img {

  width: 100%;

  height: 100%;

  overflow: hidden;

  animation: movement 8s infinite linear;

}



.about__img>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



/*Services*/



.services {

  position: relative;

  isolation: isolate;

}



.services--bg {

  position: relative;

  background: #FFF0E6;

  border-radius: 500px 0 0 500px;

  padding: 3rem 0;

  padding-left: 15rem;

  overflow: hidden;

}



.services-card {

  margin: 1rem 0;

  padding-right: 1.75rem;

  border-right: 1px solid #0000002b;

}



.services-card:hover .services-card__img {

  border-radius: 0 50px 0 50px;

}



.services-card__img {

  background: #fff;

  width: 100%;

  height: 250px;

  overflow: hidden;

  border-radius: 50px 0px 50px;

  transition: all 300ms ease-in-out;

  box-shadow: 0 0 25px 10px #00000020;

}



.services-card__img>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.services-card__content {

  padding: 1rem 0;

}



.services-card__content>.title {

  font-size: 1.5rem;

  font-weight: 300;

  text-transform: uppercase;

  font-family: var(--outfit-font);

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

}



.services-card__content>p {

  color: #171717;

  font-size: 0.85rem;

  font-weight: 600;

  line-height: 1.65;

  margin: 0.5rem 0;

  display: -webkit-box;

  -webkit-box-orient: vertical;

  -webkit-line-clamp: 4;

  overflow: hidden;

}



.services-card__content>.title {

  font-size: 1rem;

  font-weight: 500;

  text-transform: uppercase;

  margin-bottom: 0.25rem;

  line-height: 1;

  font-family: var(--outfit-font);

}



.services .slick-list.draggable {

  padding: 3rem 0 !important;

}



/* Order */

.order-card {

  margin: 1rem 0;

  box-shadow: 0 0 15px 5px #00000020;

  color: #171717;

  background: #fff;

  border-radius: 0.2rem;

  text-align: center;

  position: relative;

}



.order-card:hover .order-card__count {

  transform: translateX(-50%) rotateY(360deg);

}



.order-card__count {

  width: 70px;

  aspect-ratio: 1/1;

  border-radius: 100%;

  background: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  position: absolute;

  top: -40px;

  left: 50%;

  transform: translateX(-50%);

  font-size: 1.65rem;

  font-weight: 800;

  color: #000;

  font-family: var(--inter-font);

  border: 1px dashed var(--color-primary);

  box-shadow: 0 0 0 5px #fff;

  z-index: 10;

  transition: all 300ms ease-in-out;

}



.order-card__img {

  width: 100%;

  height: 235px;

}



.order-card__img>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.order-card__content {

  padding: 1.25rem;

}



.order-card__content>.title {

  font-size: 1.15rem;

  font-weight: 500;

  text-transform: uppercase;

  font-family: var(--outfit-font);

  display: -webkit-box;

  -webkit-line-clamp: 2;

  -webkit-box-orient: vertical;

  overflow: hidden;

  margin-bottom: 0.35rem;

}



.order-card__content>p {

  font-size: 0.8rem;

  font-weight: 600;

  line-height: 1.7;

  margin: 0;

  height: 90px;

  overflow-y: auto;

  padding-inline: 0.5rem;

}



.order-card__content>p::-webkit-scrollbar {

  width: 3px;

}



.order-card__content>p::-webkit-scrollbar-track {

  background: #FF6E072e;

  border-radius: 100px;

}



.order-card__content>p::-webkit-scrollbar-thumb {

  border-radius: 100px;

  background: var(--color-secondary);

}



.orderSlider .slick-list.draggable {

  padding-top: 2rem !important;

}



.orderSlider .slick-arrow {

  top: 50%;

  transform: translateY(-50%);

}





.orderSlider .slick-prev {

  left: -3rem;

}



.orderSlider .slick-next {

  left: auto;

  right: -3rem;

}



/* Newsletter */

.newsletter {

  background: #fff;

  box-shadow: 0 0 15px 5px #00000020;

  border-radius: 0.25rem;

  padding: 2rem 1.75rem;

  margin: 3rem 0;

}



.newsletter-content>p {

  font-size: 0.9rem;

  font-weight: 600;

  letter-spacing: 3px;

}



.newsletter-content__form {

  display: flex;

  align-items: center;

  justify-content: center;

}



.newsletter-content__form>input {

  background: #ebebeb;

  color: #000;

  font-size: 0.95rem;

  border: 1px solid #99a2a5;

  border-radius: 0.25rem 0 0 0.25rem;

  outline: none;

  overflow: hidden;

  width: 100%;

  padding: 12px 2rem;

  align-self: center;

  flex: 1;

}



.newsletter-content__form>input:focus {

  background: #fff;

  border-color: #000;

}



.newsletter-content__form>input::placeholder {

  color: #99a2a5 !important;

  font: inherit;

}



.newsletter-content__form>input,

.newsletter-content__form>input::placeholder {

  color: #000;

  font-size: 0.9rem;

  font-weight: 500;

}



/* Pricing */

.pricing-card {

  background: #fff;

  box-shadow: 0 0 15px 5px #00000020;

  border-radius: 0.25rem;

  overflow: hidden;

  padding: 1.5rem 1rem 0.5rem;

  position: relative;

  isolation: isolate;

  margin: 1rem 0;

}



.pricing-card::before {

  content: "";

  width: 100%;

  height: 0;

  background: var(--color-primary);

  position: absolute;

  top: 0;

  left: 0;

  z-index: -1;

  transition: all 300ms ease-in-out;

}



.pricing-card:hover::before {

  height: 100%;

}



.pricing-card * {

  transition: all 300ms ease-in-out;

}



.pricing-card:hover *:not(.themeBtn) {

  color: #fff !important;

}



.pricing-card:hover .themeBtn {

  color: var(--color-primary);

  background: #fff;

}



.pricing-card:hover .packages-card__perks>li::before {

  color: #fff;

}



.pricing-card__title {

  color: var(--color-primary);

  font-size: 1.5rem;

  font-weight: 700;

  font-family: var(--inter-font);

  text-transform: capitalize;

  margin-bottom: 0.5rem;

  text-align: center;

}



.pricing-card__offer {

  color: #222222;

  font-size: 1.15rem;

  font-weight: 600;

  text-transform: capitalize;

  text-align: center;

}



.pricing-card__amount {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 0.15rem;

  margin: 4rem 0 0.5rem;

  font-size: 0.85rem;

  font-weight: 500;

  color: #969699;

  text-transform: capitalize;

  line-height: 1;

}



.pricing-card .themeBtn {

  border-radius: 0.5rem;

}



.pricing-card__amount>span {

  color: var(--color-primary);

  font-size: 3rem;

  font-weight: 700;

  font-family: var(--inter-font);

  top: -0.75rem;

  position: relative;

}



.packages-card__perks {

  margin: 2rem 0 1.75rem;

  height: 208px;

  overflow-y: auto;

  padding-left: 2rem;

}



.packages-card__perks::-webkit-scrollbar {

  width: 5px;

}



.packages-card__perks::-webkit-scrollbar-track {

  background: #FF6E0749;

  border-radius: 100px;

}



.packages-card__perks::-webkit-scrollbar-thumb {

  border-radius: 100px;

  background: var(--color-primary);

}



.pricing-card:hover .packages-card__perks::-webkit-scrollbar-track {

  background: #FF6E0749;

}



.pricing-card:hover .packages-card__perks::-webkit-scrollbar-thumb {

  background: #fff;

}



.packages-card__perks>li {

  font-size: 13px;

  font-weight: 600;

  position: relative;

  line-height: 22px;

  margin: 6px 30px 0 0;

}



.packages-card__perks>li::before {

  content: "\ed31";

  width: 20px;

  aspect-ratio: 1/1;

  color: var(--color-primary);

  font-family: boxicons !important;

  font-size: 1.1rem;

  position: absolute;

  left: -1.5rem;

  top: 0;

  color: var(--color-primary);

}



/* Portfolio */

.portfolio__single {

  width: 100%;

  height: 600px;

  overflow: hidden;

  border-radius: 0 200px 0 200px;

  box-shadow: 0 0 15px 5px #00000020;

}



.fancyBox-hover {

  position: relative;

}



.fancyBox-hover::after {

  content: "\ebc0";

  font-family: boxicons !important;

  background: #0000005f;

  position: absolute;

  inset: 0;

  color: #fff;

  font-size: 4rem;

  display: flex;

  align-items: center;

  justify-content: center;

  opacity: 0;

  visibility: hidden;

  transition: all 300ms ease-in-out;

}



.fancyBox-hover:hover::after {

  opacity: 1;

  visibility: visible;

}



.portfolio__single>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.portfolio-list {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  height: 100%;

}



.portfolio-list__single {

  width: 100%;

  height: 260px;

  overflow: hidden;

  border-radius: 80px 0px;

  box-shadow: 0 0 15px 5px #00000020;

  margin-top: 1rem;

}



.portfolio-list__single>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



body.fancybox-active.compensate-for-scrollbar {

  padding: 0 !important;

  margin: 0 !important;

  overflow: inherit !important;

}



.portfolio-tabs {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 1.5rem;

  flex-wrap: wrap;

}



.portfolio-tabs>li>a {

  border-radius: 0.35rem;

}



.portfolio-tabs>li>a:where(.active, :hover) {

  background: var(--color-secondary);

}



/* Slick Styling */

.slick-slide {

  margin-right: 0;

}



.slick-arrow::before {

  color: #230f0f;

  opacity: 1;

  font-size: 1.35rem;

  font-family: boxicons !important;

  transition: all 300ms ease-in-out;

}



.slick-arrow {

  position: absolute;

  top: -15%;

  transform: translateY(-50%);

  background: transparent;

  display: inline-flex;

  align-items: center;

  border: 2px solid #230f0f;

  justify-content: center;

  width: 40px;

  height: 40px;

  transition: all 300ms ease-in-out;

}



.slick-next {

  left: 5.75rem;

}



.slick-prev {

  left: 2.25rem;

}



.slick-next::before {

  content: "\ebe6";

}



.slick-prev::before {

  content: "\eb33";

}



.slick-arrow:hover {

  background: var(--color-primary);

  border-color: var(--color-primary);

}



/* Page-title */

.page-title {

  width: 100%;

  height: 100%;

  min-height: 35vh;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

  overflow: hidden;

  padding: 1rem;

  text-align: center;

}



.page-title__img {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  z-index: -1;

  height: 100%;

}



.page-title__img>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.page-title__content>.heading {

  color: #fff;

  font-size: 4.5rem;

  font-weight: 600;

  text-transform: capitalize;

}



/* Accordion */

.accordion {

  background: #fff;

  border-bottom: 1px solid #777777;

  overflow: hidden;

  transition: all 300ms ease-in-out;

}



.accordion.accordion--alt {

  border: none;

}



.accordion:not(.accordion--alt):has(.accordion-header.active) {

  border-radius: 0.5rem;

  background-color: var(--color-primary);

  border-color: var(--color-primary);

}



.accordion:not(.accordion--alt):has(.accordion-header.active) * {

  color: #fff;

}



.accordion--alt .accordion-header {

  font-size: 1.1rem;

  text-transform: uppercase;

  font-weight: 700;

  padding: 0.75rem 0.25rem;

}



.accordion--alt:has(.accordion-header.active) .accordion-header {

  padding-left: 4.75rem;

  padding-bottom: 1.75rem;

}



.accordion-header.active .circle-icon {

  transform: translate(0, -50%);

}



.accordion-header .circle-icon {

  color: #fff;

  font-size: 1.5rem;

  background: var(--color-primary);

  width: 45px;

  aspect-ratio: 1/1;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 100%;

  position: absolute;

  top: 50%;

  transform: translate(-200%, -50%);

  left: 1rem;

  transition: all 300ms ease-in-out;

}



.accordion-header {

  width: 100%;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 1rem;

  color: #000;

  font-weight: 600;

  text-align: left;

  cursor: pointer;

  background: transparent;

  border: none;

  border-radius: 0.25rem;

  outline: none !important;

  overflow: hidden;

  padding: 1.25rem 1rem;

  transition: all 300ms ease-in-out;

}



.accordion-header>.wrapper {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  gap: 1rem;

}



.accordion-header>.icon {

  color: #222222;

  opacity: 0.85;

  font-size: 0.75rem;

  transition: all 300ms ease-in-out;

}



.accordion-header.active>.icon {

  transform: rotate(180deg);

}



.accordion-content {

  width: 100%;

  color: #666666;

  max-height: 0;

  border-radius: 0 0 0.25rem 0.25rem;

  overflow: hidden;

  transition: max-height 300ms ease-in-out;

}



.accordion-content p {

  font-size: 0.9rem;

  font-weight: 500;

  padding: 0 1rem 1rem;

  line-height: 1.75;

  margin-bottom: 0;

}



.accordion--alt .accordion-content {

  margin: 0;

}



/* Contact Us */

.contact {

  color: #000;

}



.contact__img {

  width: 100%;

  height: 100%;

  border-radius: 0 150px 0 150px;

  overflow: hidden;

}



.contact__img>img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.contactFormWrapper :is(.heading, .subheading) {

  font-weight: 800;

  line-height: 1.35;

  margin-bottom: 0;

  font-family: var(--inter-font);

}



.contactFormWrapper>.heading {

  font-size: 2.25rem;

  text-transform: uppercase;

}



.contactFormWrapper>.subHeading {

  font-size: 0.85rem;

  text-transform: uppercase;

  letter-spacing: 2px;

}



.contact-form {

  margin: 2rem 0;

}



.contact-form__fields {

  margin: 0 0 1rem 0;

}



.contact-form__fields :is(input, textarea) {

  width: calc(100% - 0.85rem);

  color: #000;

  font-size: 0.9rem;

  background: transparent;

  border: 2px solid #78787845;

  outline: none;

  padding: 0.65rem 1.25rem;

  resize: none;

  transition: all 300ms ease-in;

}



.contact-form__fields :is(input, textarea):focus {

  background: #fff;

  border-color: var(--color-primary);

}



.contact-form__fields :is(input, textarea)::placeholder {

  font: inherit;

}



.contact-details {

  display: flex;

  flex-direction: column;

  gap: 0.75rem;

}



.contact-details__single {

  width: 100%;

}



.contact-details__single :is(a, address) {

  display: flex;

  align-items: flex-start;

  justify-content: flex-start;

  font-size: 0.9rem;

  color: #000;

  background: #fff;

  border: 2px solid transparent;

  font-weight: 600;

  border-radius: 0.5rem;

  margin-bottom: 0;

  gap: 0.75rem;

  transition: all 300ms ease-in-out;

}



.contact-details__single :is(a, address) i {

  font-size: 1.25rem;

  width: 30px;

  aspect-ratio: 1/1;

  border-radius: 100%;

  background: var(--color-primary);

  color: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

}



.contact-details__single :is(a, address):hover {

  color: var(--color-primary);

}



.contact-details__single .content {

  width: 100%;

}



.primary-scroll {

  height: 300px;

  overflow-y: auto;

  padding-right: 1rem;

}



.primary-scroll::-webkit-scrollbar {

  width: 5px;

}



.primary-scroll::-webkit-scrollbar-track {

  background: #aaa3a350;

  border-radius: 100px;

}



.primary-scroll::-webkit-scrollbar-thumb {

  border-radius: 100px;

  background: var(--color-primary);

}



.btnsWrapper {

  display: flex;

  align-items: center;

  justify-content: flex-start;

  gap: 1rem;

}



.primary-radius {

  overflow: hidden;

  border-radius: 100px 0 100px 0;

  background: #fff;

}



/* Quote */

.quote {

  background: #fff;

  box-shadow: 0 0 15px 5px #00000020;

  padding: 4rem 2rem;

  border-radius: 0.25rem;

}



.quote-form__fields {

  margin: 0.85rem 0;

}



.quote-form__fields .title {

  color: var(--color-primary);

  font-size: 1rem;

  font-weight: 600;

  text-transform: capitalize;

  margin-bottom: 0.5rem;

}



.quote-form__fields :is(input:not([type="file"]), select, .upload-file) {

  width: 100%;

  background: #e9e9e9;

  border: 1px solid transparent;

  outline: none;

  padding: 0.65rem 1.25rem;

  color: #000;

}



.quote-form__fields :is(input:not([type="file"]), select, .upload-file),

.quote-form__fields .upload-file {

  font-size: 0.95rem;

  font-weight: 500;

}



.quote-form__fields .upload-file {

  color: #33333396 !important;

  display: flex;

  align-items: center;

  justify-content: space-between;

  cursor: pointer;

}



.quote-form__fields .upload-file i {

  font-size: 1.35rem;

}



.quote-form__fields input[type="file"] {

  display: none;

}



.quote-form__fields :is(input:not([type="file"]), select, .upload-file)::placeholder {

  color: #33333396;

  font: inherit;

}



.quote-form__fields :is(input:not([type="file"]), select, .upload-file):focus {

  background: #fff;

  border-color: var(--color-primary);

}



.quote-form__fields p {

  color: #333333;

  font-size: 0.95rem;

  font-weight: 500;

}



/*Auth*/

.auth__form {

  background: #fff;

  padding: 4rem 2rem;

  border-radius: 1rem;

  box-shadow: 0 0 20px 5px #00000020;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

}



.auth__form .inputField {

  position: relative;

  margin-bottom: 1.25rem;

}



.auth__form .inputField :is(input, select) {

  width: 100%;

  font-size: 14px;

  font-weight: 500;

  color: #000;

  background: #fff;

  border: 1px solid #c4c4c4;

  border-radius: 0.15rem;

  outline: none;

  padding: 0.75rem 1.5rem;

}



.auth__form .inputField select {

  color: #c4c4c4;

  font: inherit;

}



.auth__form .inputField input::placeholder {

  color: #c4c4c4;

  font: inherit;

}



.auth__form .inputField input:focus {

  box-shadow: 0px 0px 10px 1px #00000020;

}



.auth__form .inputField .icon {

  color: #717171;

  font-size: 1rem;

  position: absolute;

  right: 15px;

  top: 50%;

  transform: translateY(-50%);

}



.auth__form .inputField .title {

  font-size: 0.95rem;

  font-weight: 600;

  text-transform: capitalize;

}



.auth__form .inputField .showPassword {

  cursor: pointer;

}



.auth__form .inputField .showPassword.show i.fa-solid.fa-eye::before {

  content: "\f070";

  font-family: "Font Awesome 6 Free";

}



.auth__bottom {

  margin-top: 1rem;

}



.auth__bottom>p {

  color: #a3a3a3;

  font-size: 0.9rem;

  font-weight: 500;

  margin-bottom: 0;

  text-align: center;

}



.auth__bottom>p>a {

  color: #000;

  font-size: 1rem;

  font-weight: 700;

}



.auth__bottom>p>a:hover {

  color: var(--color-primary);

}



.primary-bg {

  background: var(--color-primary);

}



.primary-bg *:not(.themeBtn) {

  color: #fff;

}



/* Banner Wave Effect */

.ocean {

  height: 100%;

  width: 100%;

  position: absolute;

  top: 100%;

  left: 0;

  pointer-events: none;

}



.ocean--static .wave {

  display: none;

}



header.header .ocean {

  top: 344px;

  z-index: -1;

}



.wave {

  background: url("../images/wave.png") repeat-x;

  position: absolute;

  top: -198px;

  width: 6400px;

  height: 198px;

  animation: wave 15s cubic-bezier(0.36, 0.45, 0.63, 0.53) infinite;

  transform: translate3d(0, 0, 0);

  z-index: 111;

  filter: brightness(100);

  pointer-events: none;

}



.wave--alt {

  background-image: url("../images/wave-alt.png");

}



@keyframes wave {

  0% {

    margin-left: 0;

  }



  100% {

    margin-left: -1600px;

  }

}



@keyframes swell {



  0%,

  100% {

    transform: translate3d(0, -25px, 0);

  }



  50% {

    transform: translate3d(0, 5px, 0);

  }

}



/* Icons RainFall*/

.icons {

  position: absolute;

  z-index: 1;

  pointer-events: none;

  animation: rainfall 10s linear forwards infinite;

}



.icons:nth-child(1) {

  left: 5%;

  top: -8rem;

  animation-duration: 10s;

}



.icons:nth-child(2) {

  left: 70px;

  top: 50px;

  animation-duration: 11s;

}



.icons:nth-child(3) {

  left: 600px;

  top: 100px;

  animation-duration: 12s;

}



.icons:nth-child(4) {

  left: 355px;

  top: 400px;

  animation-duration: 13s;

}



.icons:nth-child(5) {

  left: 900px;

  top: 100px;

  animation-duration: 14s;

}



.icons:nth-child(6) {

  right: 3%;

  top: 10rem;

  animation-duration: 15s;

}



.icons:nth-child(6) {

  left: 800px;

  top: 400px;

  animation-duration: 11s;

}



.icons:nth-child(7) {

  left: 600px;

  top: 400px;

  animation-duration: 12s;

}



.icons:nth-child(8) {

  right: 6%;

  top: 7rem;

  animation-duration: 13s;

}



.icons:nth-child(9) {

  right: 4%;

  top: 20rem;

  animation-duration: 14s;

}



@keyframes rainfall {

  25% {

    transform: translateY(200px);

  }



  50% {

    transform: translateY(300px);

  }



  75% {

    transform: translateY(400px);

  }



  100% {

    transform: translateY(600px);

  }

}



.rectangles {}



.rectangles img {

  position: absolute;

  pointer-events: none;

  animation: rotation 50s infinite linear;

}



.rectangles img:first-child {

  left: -60px;

  bottom: 0;

}



.rectangles img:last-child {

  right: -60px;

  top: 0rem;

}



/* Typing Effect */

.typed-text-wrapper {

  display: flex;

  align-items: center;

}



.typed-text-heading {

  padding: 0.5rem;

  overflow: hidden;

}



.typed-text-heading span.cursor {

  display: inline-block;

  background-color: var(--color-secondary);

  margin-left: 0.1rem;

  width: 3px;

  animation: blink 1s infinite;

}



.typed-text-heading span.cursor.typing {

  animation: none;

}



@keyframes blink {

  0% {

    background-color: #ccc;

  }



  49% {

    background-color: #ccc;

  }



  50% {

    background-color: transparent;

  }



  99% {

    background-color: transparent;

  }



  100% {

    background-color: #ccc;

  }

}



/* Particles */

#particles-js {

  position: absolute;

  inset: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

}



/* Search */

.searchMenuWrapper {

  position: relative;

  isolation: isolate;

}



.searchMenuWrapper::after {

  content: "";

  width: 45px;

  aspect-ratio: 1/1;

  position: fixed;

  top: -5rem;

  right: -5rem;

  transform: translate(-50%, -50%);

  background: #FF6E07;

  border-radius: 100%;

  transition: all 300ms ease-in-out;

  z-index: -1;

  opacity: 0.9;

}



.searchMenuWrapper.open::after {

  transform: translate(-50%, -50%) scale(280);

}



.searchMenuWrapper.open {

  pointer-events: inherit;

}



.searchMenuWrapper {

  color: #fff;

  width: 100%;

  height: 100%;

  position: fixed;

  inset: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 5rem;

  z-index: 10000;

  z-index: 1111111;

  pointer-events: none;

}



.search-menu .wrapper {

  transition: all 300ms ease;

  display: none;

}



.searchMenuWrapper.open .search-menu .wrapper {

  display: block;

}



.search-menu__close {

  color: #fff;

  position: absolute;

  top: 0;

  right: 20px;

  font-size: 3.75rem;

  transform: rotate(180deg);

  transition: all 300ms ease;

}



.searchMenuWrapper.open .search-menu__close {

  transform: rotate(360deg);

}



.search-menu__close:hover {

  color: #fff;

}



.search-menu__form {

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  border-bottom: 3px solid #fff;

  padding: 0.5rem 0;

}



.search-menu__form :is(input, button) {

  border: none;

  outline: none;

  background: none;

}



.search-menu__form>input {

  width: 100%;

  color: #fff;

  font-size: 2rem;

  font-family: var(--inter-font);

  font-weight: 500;

  line-height: 1;

}



.search-menu__form>input::placeholder {

  color: inherit;

  font: inherit;

}



.search-menu__form>button {

  color: #fff;

  font-size: 2rem;

  line-height: 1;

}



.bubbles-img {

  position: absolute;

}



.circle-img {

  width: 300px;

  aspect-ratio: 1/1;

  position: absolute;

  right: -2rem;

  top: -2rem;

  animation: rotation 50s infinite linear;

}



.circle-img--right {

  right: -8rem;

  top: -10rem;

}



@keyframes rotation {

  0% {

    transform: rotate(0deg);

  }



  100% {

    transform: rotate(360deg);

  }

}



@keyframes movement {

  25% {

    transform: rotate(1deg) translateY(5px);

  }



  50% {

    transform: rotate(-1deg) translateY(-5px);

  }



  75% {

    transform: rotate(1deg) translateY(5px);

  }

}



/* Dropdomn */

.header-main__nav>li {

  position: relative;

}



.header-main__nav>li:hover .drop-down:not(.drop-down--sub) {

  transform: scaleY(1);

  opacity: 1;

  visibility: visible;

}



.header-main__nav li a.themeBtn {

  margin-left: 2rem;

}



.drop-down {

  width: 300px;

  background: #000000;

  position: absolute;

  left: 10%;

  top: 179%;

  transform-origin: center top;

  transform: scaleY(0);

  opacity: 0;

  visibility: hidden;

  z-index: 111;

  transition: all 500ms ease-in-out;

}



.drop-down--sub {

  top: 0;

  left: 105%;

  transform: scaleX(0);

  transform-origin: left;

}



.drop-down__list>li>a {

  width: 100%;

  color: #fff;

  font-size: 0.8rem;

  font-weight: 600;

  text-transform: capitalize;

  padding: 0.75rem 1.5rem;

  border-bottom: 1px solid #ffffff21;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: space-between;

}



.drop-down__list>li>a>i {

  font-size: 1.25rem;

}



.drop-down__list>li>a::before {

  content: "";

  width: 100%;

  height: 1px;

  background: linear-gradient(90deg,

      transparent,

      var(--color-secondary),

      transparent);

  position: absolute;

  left: 0;

  bottom: 0;

  transform: scaleX(0);

  transform-origin: left;

  transition: all 300ms ease-in-out;

}



.drop-down__list>li>a:hover::before,

.drop-down__list>li:hover .drop-down--sub {

  transform: scaleX(1);

  opacity: 1;

  visibility: visible;

}



/* Cta */

.cta {

  display: flex;

  align-items: end;

  flex-direction: column;

  gap: 0.75rem;

  position: fixed;

  top: 55%;

  right: 0;

  transform: translate(80%, -50%);

  z-index: 11111;

}



.cta-formWrapper .heading {

  font-weight: 800;

}



.cta-formWrapper .heading span {

  display: block;

  font-size: 1.75rem !important;

  font-weight: 300;

}



.cta-single__icon>span>i {

  font-size: 1.75rem;

}



:is(.cta-single__icon, .cta-single__icon > span) {

  display: flex;

  align-items: center;

}



.cta-single__icon {

  width: 280px;

  color: #ffff;

  background: var(--color-secondary);

  background-size: 200%;

  font-size: 1rem;

  font-weight: 600;

  justify-content: flex-start;

  gap: 0.75rem;

  box-shadow: 0 0 10px 5px #00000020;

  border-radius: 100px 0 0 100px;

  position: relative;

}



.cta-single__icon>span {

  width: 60px;

  height: 50px;

  font-size: 1.25rem;

  justify-content: center;

  position: relative;

}



.cta-single__icon>span::after {

  content: "";

  width: 1px;

  height: 100%;

  background: #fff;

  position: absolute;

  right: 0;

  top: 0;

}



.cta-single__icon:hover {

  color: #fff;

}



.cta-single__icon--link:hover {

  transform: translateX(-70%);

}



.cta-single {

  position: relative;

}



.cta-formWrapper {

  background: #fff;

  width: 375px;

  padding: 2rem;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-20%, -50%);

  transition: all 300ms ease-in-out;

  color: #fff;

}



.cta-formWrapper.show {

  transform: translate(-122%, -50%);

}



.cta-single__icon--form.show {

  transform: translateX(-134%);

}



.cta-single__icon--form span {

  writing-mode: vertical-lr;

  transform: rotate(180deg);

  height: fit-content;

  padding: 2.75rem 0;

}



.cta-single__icon--form {

  border-radius: 20px 0 0 20px;

}



.cta-single__icon--form span::after {

  right: 100%;

}



.cta .contact-form__fields :is(input:not([type="file"], [type="checkbox"]),

  textarea,

  select,

  .contact-form__fields--file > label) {

  border: 2px solid var(--color-secondary);

}



.about__content--scroll {

  height: 400px;

  overflow-y: auto;

  padding-right: 1rem;

}



.about__content--scroll::-webkit-scrollbar {

  width: 5px;

}



.about__content--scroll::-webkit-scrollbar-track {

  background: #fff;

  border-radius: 100px;

}



.about__content--scroll::-webkit-scrollbar-thumb {

  border-radius: 100px;

  background: var(--color-secondary);

}









/* Responsive */

.header-main__menu {

  display: none;

}



.header-main__menu a>i {

  color: var(--color-primary);

  font-size: 2.5rem;

  position: relative;

  text-align: right;

  display: block;

}



.sideBar {

  position: fixed;

  overflow-y: auto;

  top: 0;

  background: #fff;

  padding: 4rem 0;

  transform: translateX(-100%);

  z-index: 100000000;

  width: 300px;

  height: 100vh;

  transition: all 300ms;

  box-shadow: 0 0 25px 10px #00000020;

}



.sideBar.show {

  transform: translateX(0)

}



.sideBar__logo {

  width: 200px;

  display: block;

  margin: 1rem auto;

}





.sideBar__close {

  display: flex;

  right: 0

}



.sideBar__logo {

  width: 130px;

  display: block;

  margin: 1rem auto;

}

.sideBar__logo img {

  width: 100%;

  height: auto;

  object-fit: contain

}



.sideBar__close {

  position: absolute;

  top: 0.5rem;

  right: 1rem;

  font-size: 1.6rem;

  background: var(--color-primary);

  background-size: 200%;

  color: #fff;

  width: 40px;

  aspect-ratio: 1/1;

  border-radius: 100%;

  align-items: center;

  justify-content: center;



}



.sideBar__close:hover {

  color: #fff

}



:is(.sideBar__nav, .sideBar__nav > li > a:not(.themeBtn)) {

  display: flex;

  justify-content: flex-start

}



.sideBar__nav {

  margin-top: 2.5rem;

  flex-direction: column;

  align-items: flex-start;

}



.sideBar__nav>li {

  position: relative;

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-bottom: 1px solid #77777782;

  padding: 0.65rem 2rem;

}



.sideBar__nav>li>a:not(.themeBtn) {

  color: #000;

  font-size: .9rem;

  font-weight: 500;

  text-transform: capitalize;

  width: 100%;

}



.sideBar__nav .dropDownToggle {

  background: var(--color-primary);

  color: #fff;

  width: 25px;

  aspect-ratio: 1/1;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 1rem;

  cursor: pointer;

}



.sideBar__nav>li:where(:hover, .active) {

  border-color: var(--color-secondary) !important;

}



.sideBar__nav>li:where(:hover, .active)>a {

  color: var(--color-secondary) !important;

}



.drop-down.drop-down--sidebar {

  top: 100%;

  left: 0;

  width: 100%;

}



.drop-down--sidebar.open {

  transform: scaleY(1);

  opacity: 1;

  visibility: visible

}



.sideBar-btns {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 0.65rem;

  width: 85%;

  margin: 2rem auto;

}



.sideBar-btns .themeBtn {

  width: 100%;

  padding: 0.65rem 0;

  font-size: 0.7rem;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 0.25rem;

  border-radius: 100px;

}



.sideBar-btns .themeBtn i {

  font-size: 1rem;

}



.socialLinks.socialLinks--sideBar li a {

  color: #fff;

  background: var(--color-secondary);

  font-size: 0.95rem;

}



.socialLinks.socialLinks--sideBar li a::before {

  background: var(--color-primary);

}









.preloader {}

.preloader img {position: relative; z-index: 1;}

/* spinner */

.spinner.spinner-3 {

    position: relative;

    top: -63px;

    left: -82px;

    z-index: -2;

}



.spinner:after,

.spinner:before {

  content: "";

  display: block;

  width: 100px;

  height: 100px;

  border-radius: 50%;

}



.spinner-3:before,

.spinner-3:after {

  position: absolute;

  top: 50%;

  left: 50%;

  margin-top: -50px;

  margin-left: -50px;

  background: #FF6E07;

  -webkit-animation: pulse 3s linear infinite;

  animation: pulse 3s linear infinite;

  opacity: 0;

}

.preloader {

    width: 100%;

    height: 100%;

    display: flex;

    flex-wrap: wrap;

    align-items: center;

    justify-content: center;

    position: fixed;

    z-index: 999999999999999999;

    right: 0;

    background-color: #fff;

    top: 0;

    transition-duration: 1s;

    -webkit-transition-duration: 1s;

    transition-timing-function: cubic-bezier(0.86, 0, 0.09, 1);

    -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.09, 1);

}

.preloader {

    top: 0%;

}

.page-loaded .preloader {

    top: -100%;

}

.spinner-3:after {

  -webkit-animation: pulse 2s linear 2.3s infinite;

  animation: pulse 2s linear 2.3s infinite;

}



@keyframes pulse {

  0% {

    -webkit-transform: scale(0);

    transform: scale(0);

    opacity: 1;

  }

  100% {

    -webkit-transform: scale(1.3);

    transform: scale(1.3);

    opacity: 0;

  }

}

.loaderClass {

    width: 370px;

    height: 90px;

    object-fit: cover;

    /* top: 56%; */

    position: absolute!important;

    left: 0;

    right: 0;

    margin: 0px auto;

}

.fixed-header {

    position: fixed;

    top: 0;

    left: 0;

    width: 100%;

    box-shadow: 0 0 10px rgba(0,0,0,0.1);

}

nav.headerNav {

    background: #fff;



}

.Headerbg {

    width: 100%;

    height: 150px;

}





header.header {

    position: absolute;

    z-index: 10000;

    top: 0;

    width: 100%;

}









/*======================

    404 page

=======================*/





.page_404{padding: 100px 0;background:#fff;text-align: center;}



.page_404  img{ width:100%;}



.four_zero_four_bg{

 background-image: url(https://cdn.dribbble.com/users/285475/screenshots/2083086/dribbble_1.gif);

 height: 450px;

 background-position: center -10%;

 background-repeat: no-repeat;

 margin-bottom: 30px;

 }





 .four_zero_four_bg h1{

 font-size: 130px;

 font-family: "Arimo", sans-serif;

 font-weight: 800;

 display: block;

 }



  .four_zero_four_bg h3{

			 font-size:80px;

			 }



			 .link_404{

	color: #fff!important;

    padding: 10px 20px;

    background: #39ac31;

    margin: 20px 0;

    display: inline-block;}

	.contant_box_404{text-align: center;margin: 0px auto;display: table;}



.contant_box_404 .themeBtn {

    margin: 0px auto;

}



a.forgetPssAnk {

    margin: 0px auto;

    display: table;

    font-weight: 600;

    padding: 10px 0 0;

}







/* Upload Button */



.GetAQuoteForm {}



.quote-form__fields p {

    color: #777;

    font-size: 0.95rem;

    font-weight: 500;

    text-align: center;

    width: 50%;

    margin: 30px auto 0;

    display: table;

    line-height: 24px;

}



.GetAQuoteForm :is(input, textarea) {

    width: 100%;

    color: #000;

    font-size: 0.9rem;

    background: transparent;

    border: 2px solid #78787845;

    outline: none;

    padding: 0.65rem 1.25rem;

    resize: none;

    transition: all 300ms ease-in;

}





.upload-card {

    width: 100%;

    padding: 30px;

    margin: 0 auto;

    border: 2px dashed #ccc;

    position: relative;

}

.upload-card .headingIcon {

    margin: 0px auto;

    display: table;

    font-size: 44px;

    color: #FF6E07;

}

.upload-card h6 {

    text-align: center;

    font-size: 24px;

    line-height: 32px;

    color: #555;

}

.upload-card h6 span {

    display: block;

    font-size: 17px;

}

.upload-card h6 span b {

    font-weight: 800;

    color: #FF6E07;

}



.upload-card .text-right {

    text-align: right!important;

    position: absolute;

    right: 0;

    top: 0;

}

.upload-card .AddMoreBtn {

    width: 120px;

    height: 40px;

    border-radius: 0 0 0 20px;

    border: 0;

    color: #FF6E07;

    outline: none;

    font-size: 13px;

    font-weight: 600;

    box-shadow: 0px 3px 0px rgb(217 217 217);

}

.imagePreview {

    width: 60px;

    height: 50px;

    border-radius: 4px;

    background-size: cover;

    /* background-position: center; */

    /* background-repeat: no-repeat; */

    margin-right: 15px;

    position: absolute;

    right: 30px;

   /* border: 1px solid #ccc;*/

    border-radius: 5px;

}

.file-upload{

    display: flex;

    align-items: center;

    padding: 15px;

    box-shadow: 0px 2px 10px rgba(0,0,0,0.12);

    margin-bottom: 15px;

    position: relative;

    border-radius: 4px;

    background-color: #fff;

}

.file-select {

    position: relative;

    /* overflow: hidden; */

    display: flex;

    align-items: center;

    width: 100%;

}





.file-select-name{

    margin-left: 55px;

}



.file-select input[type=file] {

  position: absolute;

  left: 0;

  top: 0;

  opacity: 0;

  width: 100%;

  height: 100%;

}



.file-remove {

    margin-left: 15px;

    position: absolute;

    right: 21px;

    top: 21px;

    background: transparent;

    outline: none;

    border: 0;

    font-size: 22px;

    line-height: 29px;

    color: #999;

}

.uploadBtnsCustom {

    position: absolute;

    left: 0;

    border: 0;

    font-size: 24px;

    width: 60px;

    height: 60px;

    border-radius: 100%;

    color: #898888;

    background: transparent;

}

/* Upload Button */


/* ============================================
   Patch Type Sections - Custom Patches Page
   ============================================ */

.patch-type-section {
    padding: 60px 0;
}

.patch-type-section .heading.heading--purple {
    font-size: 2rem;
    margin-bottom: 20px;
    position: relative;
    display: inline-block;
    padding-bottom: 12px;
}

.patch-type-section .heading.heading--purple::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 70px;
    height: 3px;
    background: var(--color-primary);
    border-radius: 2px;
}

.patch-type-section .col-lg-10.text-center p {
    font-size: 1rem;
    line-height: 1.8;
    color: #555;
    max-width: 900px;
    margin: 0 auto 20px;
}

/* Gallery image squares */
.patch-type-section .portfolio-list__single {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 8px;
    border: 2px solid #eee;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.patch-type-section .portfolio-list__single:hover {
    transform: scale(1.04);
    box-shadow: 0 8px 25px rgba(0,0,0,0.18);
    border-color: var(--color-primary);
}

.patch-type-section .portfolio-list__single img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Alt background variant */
.patch-type-section--alt .portfolio-list__single {
    border-color: #ddd;
}
/* ========================================================
   GLOBAL UNIFIED SQUARE CARDS FOR ALL GALLERIES & SPORTS
   ======================================================== */
/* ========================================================
   GLOBAL UNIFIED SQUARE CARDS FOR ALL GALLERIES & SERVICES
   (Seamless, Borderless, Pure Transparent Integration)
   ======================================================== */
.portfolio-list__single,
.patch-type-section .portfolio-list__single {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    max-height: none !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), filter 0.3s ease !important;
    padding: 6px !important;
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
}

.portfolio-list__single:hover,
.patch-type-section .portfolio-list__single:hover {
    transform: translateY(-4px) scale(1.04) !important;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.15)) !important;
}

.portfolio-list__single img,
.portfolio-list__single > img,
.patch-type-section .portfolio-list__single img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Sports Pages (Divi / Knockout Sports modules) */
.et_pb_module.et_pb_image,
.et_pb_image {
    width: 100% !important;
    margin-bottom: 20px !important;
    text-align: center !important;
}

.et_pb_image_wrap {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
    height: auto !important;
    max-height: none !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 6px !important;
    transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), filter 0.3s ease !important;
}

.et_pb_image_wrap:hover {
    transform: translateY(-4px) scale(1.04) !important;
    filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.15)) !important;
}

.et_pb_image_wrap a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    background: transparent !important;
    border: none !important;
}

.et_pb_image img,
.et_pb_image_wrap img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

@media (max-width: 767px) {
    .portfolio-list__single,
    .patch-type-section .portfolio-list__single,
    .et_pb_image_wrap {
        padding: 4px !important;
    }
}

/* ========================================================
   HOME BANNER SLIDER & ABOUT IMAGE ENHANCEMENTS
   ======================================================== */
.banner {
    position: relative !important;
    overflow: hidden !important;
}

/* ========================================================
   BANNER IMAGE CAROUSEL — Pure CSS, no Slick needed
   5 slides, each visible 3s, total cycle = 15s
   ======================================================== */
.bannerImgSlider {
    position: absolute !important;
    right: 3% !important;
    bottom: 0 !important;
    top: 0 !important;
    width: 45% !important;
    max-width: 580px !important;
    height: 100% !important;
    z-index: 10 !important;
    pointer-events: none !important;
}

.banner-slide {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: flex-end !important;
    justify-content: flex-end !important;
    opacity: 0 !important;
    animation: bannerFade 15s infinite !important;
    animation-timing-function: ease-in-out !important;
}

.banner-slide--1 { animation-delay: 0s !important; }
.banner-slide--2 { animation-delay: 3s !important; }
.banner-slide--3 { animation-delay: 6s !important; }
.banner-slide--4 { animation-delay: 9s !important; }
.banner-slide--5 { animation-delay: 12s !important; }

@keyframes bannerFade {
    0%   { opacity: 0; transform: scale(1); }
    5%   { opacity: 1; transform: scale(1.02); }
    18%  { opacity: 1; transform: scale(1); }
    22%  { opacity: 0; transform: scale(0.98); }
    100% { opacity: 0; }
}

.bannerImgSlider .banner__rightimg {
    max-height: 88% !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    object-position: bottom right !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    filter: drop-shadow(0 15px 30px rgba(0, 0, 0, 0.35)) !important;
    display: block !important;
}

@media (max-width: 991px) {
    .bannerImgSlider {
        width: 48% !important;
        right: 1% !important;
    }
}

@media (max-width: 575px) {
    .bannerImgSlider {
        position: relative !important;
        width: 100% !important;
        right: auto !important;
        bottom: auto !important;
        top: auto !important;
        height: 280px !important;
        margin: 16px auto 0 !important;
    }
    .banner-slide {
        justify-content: center !important;
    }
    .bannerImgSlider .banner__rightimg {
        max-height: 260px !important;
        object-position: center !important;
        margin: 0 auto !important;
    }
}


.about__img img {
    border-radius: 16px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1) !important;
    object-fit: cover !important;
    width: 100% !important;
}

.services-card__img {
    height: 200px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
    padding: 10px !important;
}

.services-card:hover .services-card__img {
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.services-card__img img {
    max-height: 100% !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.08)) !important;
    transition: transform 0.3s ease !important;
}

.services-card:hover .services-card__img img {
    transform: translateY(-4px) scale(1.04) !important;
}

/* ========================================================
   TOP NAVBAR / ANNOUNCEMENT BAR REFINED LAYOUT
   ======================================================== */
.header-topWrapper {
    background: var(--color-primary, #FF6E07) !important;
    padding: 0.4rem 0 !important;
    height: auto !important;
    min-height: 48px !important;
    display: flex !important;
    align-items: center !important;
}

.header-top {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    clip-path: none !important;
}

/* Left Social Links: Compact & Leftmost */
.socialLinksWrapper {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    flex-shrink: 0 !important;
}

.socialLinksWrapper .socialLinks {
    display: flex !important;
    align-items: center !important;
    gap: 0.35rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.socialLinksWrapper .socialLinks li a {
    width: 26px !important;
    height: 26px !important;
    aspect-ratio: 1/1 !important;
    font-size: 0.8rem !important;
    color: var(--color-primary, #FF6E07) !important;
    background: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.9) !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease !important;
}

.socialLinksWrapper .socialLinks li a:hover {
    transform: scale(1.15) !important;
    background: #222222 !important;
    color: #ffffff !important;
    border-color: #222222 !important;
}

/* Center Highlighted Rush Text */
.header-top__center-banner {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.6rem !important;
    flex-grow: 1 !important;
    text-align: center !important;
    padding: 0 1rem !important;
    color: #ffffff !important;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    letter-spacing: 0.2px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.header-top__center-banner .rush-badge {
    background: #ffffff !important;
    color: #e65100 !important;
    padding: 2px 8px !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
    font-size: 0.8rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
    text-transform: uppercase !important;
}

.header-top__center-banner .rush-badge i {
    font-size: 0.95rem !important;
    color: #ff9800 !important;
}

.header-top__center-banner .rush-tag {
    font-weight: 700 !important;
    color: #fff9c4 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.header-top__center-banner .rush-sep {
    opacity: 0.65 !important;
    font-size: 0.85rem !important;
}

.header-top__center-banner .rush-countries {
    font-weight: 500 !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.header-top__center-banner .rush-countries i {
    font-size: 0.95rem !important;
}

/* Right Details: Email & Phone to the Right Corner */
.header-top__details {
    display: flex !important;
    align-items: center !important;
    gap: 0.8rem !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    flex-shrink: 0 !important;
}

.header-top__details li {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 0.82rem !important;
}

.header-top__details li a {
    color: #ffffff !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.35rem !important;
    transition: color 0.2s ease, opacity 0.2s ease !important;
}

.header-top__details li a:hover {
    color: #fff9c4 !important;
    text-decoration: underline !important;
}

.header-top__details li a i {
    font-size: 1rem !important;
}

@media (max-width: 1199px) {
    .header-top__center-banner .rush-countries {
        display: none !important;
    }
    .header-top__center-banner .rush-sep:last-of-type {
        display: none !important;
    }
}

@media (max-width: 991px) {
    .header-top__center-banner {
        display: none !important;
    }
}

/* ========================================================
   INFINITE SMOOTH MARQUEE TICKER FOR TOP NAVBAR
   ======================================================== */
.header-top__center-ticker {
    flex: 1 1 auto !important;
    overflow: hidden !important;
    position: relative !important;
    margin: 0 1.25rem !important;
    white-space: nowrap !important;
    mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent) !important;
    -webkit-mask-image: linear-gradient(to right, transparent, black 5%, black 95%, transparent) !important;
}

.ticker-track {
    display: flex !important;
    width: max-content !important;
    animation: topTickerScroll 22s linear infinite !important;
}

.header-top__center-ticker:hover .ticker-track {
    animation-play-state: paused !important;
}

.ticker-content {
    display: inline-flex !important;
    align-items: center !important;
    gap: 1.5rem !important;
    padding-right: 1.5rem !important;
}

.ticker-content .rush-badge {
    background: #ffffff !important;
    color: #e65100 !important;
    padding: 2px 9px !important;
    border-radius: 4px !important;
    font-weight: 700 !important;
    font-size: 0.78rem !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    text-transform: uppercase !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15) !important;
}

.ticker-content .rush-badge i {
    color: #ff9800 !important;
    font-size: 0.95rem !important;
}

.ticker-content .rush-tag {
    color: #fff9c4 !important;
    font-weight: 700 !important;
    font-size: 0.82rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.4px !important;
}

.ticker-content .rush-countries {
    color: #ffffff !important;
    font-size: 0.82rem !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
}

@keyframes topTickerScroll {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

/* Mobile & Tablet Responsiveness for Orange Top Header */
@media (max-width: 991px) {
    .header-topWrapper {
        display: block !important;
        padding: 0.35rem 0.5rem !important;
        overflow: hidden !important;
        width: 100% !important;
    }

    .header-top {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0.4rem !important;
        width: 100% !important;
        max-width: 100vw !important;
        overflow: hidden !important;
    }

    .header-top .socialLinksWrapper {
        display: none !important;
    }

    .header-top__center-ticker {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    .header-top__details {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 0.5rem !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .header-top__details li a {
        font-size: 0.72rem !important;
    }
}

@media (max-width: 575px) {
    .header-topWrapper {
        padding: 0.25rem 0.25rem !important;
    }

    .ticker-content {
        gap: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    .ticker-content .rush-badge {
        font-size: 0.7rem !important;
        padding: 2px 6px !important;
    }

    .ticker-content .rush-tag,
    .ticker-content .rush-countries {
        font-size: 0.72rem !important;
    }

    .header-top__details li a {
        font-size: 0.68rem !important;
    }
}

/* ========================================================
   SERVICES PAGES INNER BANNER REDESIGN (COMPACT & BEAUTIFUL)
   ======================================================== */
.banner.banner--resp,
.banner.banner--inner {
    min-height: auto !important;
    height: auto !important;
    padding: 4.5rem 0 4rem !important;
    background: linear-gradient(135deg, #FF6E07 0%, #ff512f 50%, #dd2476 100%) !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(255, 110, 7, 0.2) !important;
}

/* Add a subtle modern patterned radial glow to the background */
.banner.banner--resp::before,
.banner.banner--inner::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background: radial-gradient(circle at 80% 50%, rgba(255, 255, 255, 0.18) 0%, transparent 60%) !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

.banner.banner--resp .banner__bg,
.banner.banner--inner .banner__bg {
    opacity: 0.15 !important;
    mix-blend-mode: overlay !important;
    filter: saturate(1.2) contrast(1.1) !important;
}

.banner.banner--resp .container-fluid,
.banner.banner--inner .container-fluid {
    position: relative !important;
    z-index: 3 !important;
}

/* Inner Banner Heading Typography — Ultra-Stylish Modern Display */
.banner.banner--resp .banner-content__heading,
.banner.banner--inner .banner-content__heading {
    font-family: 'Outfit', 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
    font-size: 3.2rem !important;
    font-weight: 900 !important;
    text-transform: capitalize !important;
    letter-spacing: -0.02em !important;
    color: #ffffff !important;
    background: linear-gradient(180deg, #ffffff 30%, #fff2e6 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    filter: drop-shadow(0 4px 16px rgba(0, 0, 0, 0.35)) drop-shadow(0 1px 3px rgba(0, 0, 0, 0.4)) !important;
    margin: 0 !important;
    line-height: 1.15 !important;
    position: relative !important;
    display: inline-block !important;
}

/* Decorative subtle underline bar */
.banner.banner--resp .banner-content__heading::after,
.banner.banner--inner .banner-content__heading::after {
    content: "" !important;
    display: block !important;
    width: 70px !important;
    height: 5px !important;
    background: linear-gradient(90deg, #ffffff 0%, rgba(255, 255, 255, 0.3) 100%) !important;
    border-radius: 999px !important;
    margin-top: 14px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
}

/* Right Image Styling & Floating Soft Animation */
.banner.banner--resp .banner__img,
.banner.banner--inner .banner__img {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    max-height: 270px !important;
    margin: 0 auto !important;
}

.banner.banner--resp .banner__img > img,
.banner.banner--resp .banner__img img,
.banner.banner--inner .banner__img > img,
.banner.banner--inner .banner__img img {
    max-height: 250px !important;
    max-width: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    background: transparent !important;
    filter: drop-shadow(0 14px 25px rgba(0, 0, 0, 0.35)) !important;
    animation: gentleFloatBanner 4.5s ease-in-out infinite alternate !important;
    transition: transform 0.3s ease !important;
}

.banner.banner--resp .banner__img img:hover,
.banner.banner--inner .banner__img img:hover {
    transform: scale(1.05) !important;
}

/* Gentle Soft Floating Animation */
@keyframes gentleFloatBanner {
    0% {
        transform: translateY(0px) rotate(0deg);
    }
    50% {
        transform: translateY(-8px) rotate(0.8deg);
    }
    100% {
        transform: translateY(4px) rotate(-0.8deg);
    }
}

/* Responsive adjustment for Mobile and Tablets */
@media (max-width: 991px) {
    .banner.banner--resp,
    .banner.banner--inner {
        padding: 3.5rem 0 3rem !important;
    }
    .banner.banner--resp .banner-content__heading,
    .banner.banner--inner .banner-content__heading {
        font-size: 2.2rem !important;
        text-align: center !important;
        display: block !important;
    }
    .banner.banner--resp .banner-content__heading::after,
    .banner.banner--inner .banner-content__heading::after {
        margin: 8px auto 0 !important;
    }
    .banner.banner--resp .banner__img,
    .banner.banner--inner .banner__img {
        margin-top: 1.5rem !important;
        max-height: 200px !important;
    }
    .banner.banner--resp .banner__img img,
    .banner.banner--inner .banner__img img {
        max-height: 190px !important;
    }
}

@media (max-width: 575px) {
    .banner.banner--resp,
    .banner.banner--inner {
        padding: 2.8rem 0 2.4rem !important;
    }
    .banner.banner--resp .banner-content__heading,
    .banner.banner--inner .banner-content__heading {
        font-size: 1.75rem !important;
    }
    .banner.banner--resp .banner__img img,
    .banner.banner--inner .banner__img img {
        max-height: 160px !important;
    }
}

/* ========================================================
   HOME PAGE ENHANCEMENTS & LANYARDS IMAGE SIZE FIX
   ======================================================== */
/* Fix oversized lanyard image on home page */
.about--alt .about__img.about__img--radius {
    height: auto !important;
    max-height: 420px !important;
    width: 90% !important;
    max-width: 500px !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    background: transparent !important;
}

.about--alt .about__img.about__img--radius img {
    max-height: 380px !important;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
    filter: drop-shadow(0 15px 30px rgba(0, 0, 0, 0.15)) !important;
}

/* General clean up for other about section illustrations on homepage */
.about .about__img,
.about .about__img--radius,
.about .about__img--altRadius,
.about .about__img--normal {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

.about .about__img img {
    max-height: 420px !important;
    width: auto !important;
    max-width: 100% !important;
    object-fit: contain !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.12)) !important;
    transition: transform 0.3s ease !important;
}

.about .about__img:hover img {
    transform: scale(1.03) !important;
}

@media (max-width: 767px) {
    .about--alt .about__img.about__img--radius {
        max-height: 280px !important;
    }
    .about--alt .about__img.about__img--radius img {
        max-height: 260px !important;
    }
    .about .about__img img {
        max-height: 300px !important;
    }
}

.sideBar__nav .dropDownToggle {
    transition: transform 0.3s ease !important;
}

.sideBar__nav .dropDownToggle.active {
    transform: rotate(180deg) !important;
}
