:root {

  --primary: #EC6038;

  --secondary: #34AD54;

  --light: #EEF9FF;

  --dark: #091E3E;

  --dark-text: #333;

}



/*** Core Styles ***/

* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

}



body {

  font-family: 'Open Sans', sans-serif;

  color: var(--dark-text);

  line-height: 1.6;

  background-color: #EFEFEF;

}



/*** Spinner ***/

.spinner {

  width: 40px;

  height: 40px;

  background: var(--primary);

  margin: 100px auto;

  animation: sk-rotateplane 1.2s infinite ease-in-out;

}



@keyframes sk-rotateplane {

  0% {

    transform: perspective(120px) rotateX(0deg) rotateY(0deg);

  }

  50% {

    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);

  }

  100% {

    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);

  }

}



#spinner {

  opacity: 0;

  visibility: hidden;

  transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;

  z-index: 99999;

}



#spinner.show {

  visibility: visible;

  opacity: 1;

  transition: opacity 0.5s ease-out, visibility 0s linear 0s;

}



/*** Typography ***/

h1,
h2,
.fw-bold {

  font-weight: 800 !important;

}



h3,
h4,
.fw-semi-bold {

  font-weight: 700 !important;

}



h5,
h6,
.fw-medium {

  font-weight: 600 !important;

}



.section-title {

  max-width: 700px;

  margin: 0 auto;

  position: relative;

}



.section-title h2 {

  font-size: 32px;

  color: var(--dark-text);

  margin-bottom: 20px;

}



.section-title::before {

  content: '';

  position: absolute;

  width: 150px;

  height: 5px;

  left: 0;

  bottom: 0;

  background: var(--primary);

  border-radius: 2px;

}



.section-title.text-center::before {

  left: 50%;

  margin-left: -75px;

}



.section-title.section-title-sm::before {

  width: 90px;

  height: 3px;

}



.section-title::after {

  content: '';

  position: absolute;

  width: 6px;

  height: 5px;

  bottom: 0;

  background: #353535;

  animation: section-title-run 5s infinite linear;

}



.section-title.section-title-sm::after {

  width: 4px;

  height: 3px;

  animation: section-title-run-sm 5s infinite linear;

}



.section-title.text-center::after {

  animation: section-title-run-center 5s infinite linear;

}



@keyframes section-title-run {

  0% {
    left: 0;
  }

  50% {
    left: 145px;
  }

  100% {
    left: 0;
  }

}



@keyframes section-title-run-center {

  0% {
    left: 50%;
    margin-left: -75px;
  }

  50% {
    left: 50%;
    margin-left: 45px;
  }

  100% {
    left: 50%;
    margin-left: -75px;
  }

}



@keyframes section-title-run-sm {

  0% {
    left: 0;
  }

  50% {
    left: 85px;
  }

  100% {
    left: 0;
  }

}



.font-medium {

  font-size: 20px;

  color: #444;

  margin-top: 30px;

}



.highlight {

  color: #08915e;

}



.text-start {

  justify-content: left;

  margin-left: 10px;

  text-align: left;

}



/*** Buttons ***/

.btn {

  font-family: 'Nunito', sans-serif;

  font-weight: 600;

  transition: all 0.5s ease;

}



.btn-primary,
.btn-secondary {

  color: #FFF;

  box-shadow: inset 0 0 0 50px transparent;

}



.btn-primary:hover {

  box-shadow: inset 0 0 0 0 var(--primary);

}



.btn-secondary:hover {

  box-shadow: inset 0 0 0 0 var(--secondary);

}



.btn-square {

  width: 36px;

  height: 36px;

  padding: 0;

  text-align: center;

  border-color: #000;

}



.btn-sm-square {

  width: 30px;

  height: 30px;

}



.btn-lg-square {

  width: 48px;

  height: 48px;

}



.view-all-btn {

  background-color: #353535;

  border: none;

  color: #FFF;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: 1px;

  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);

  transition: all 0.3s ease;

}



.view-all-btn:hover {

  background-color: var(--primary);

  transform: scale(1.05) translateY(-2px);

  box-shadow: 0 8px 20px rgba(236, 96, 56, 0.4);

}



.it-btn.clicked {

  background-color: rgba(191, 113, 91, 0.59) !important;

  transform: scale(1.05);

  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);

}



.it-btn.clicked .arrow-icon {

  color: #000 !important;

  cursor: pointer;

}



.pro1 {

  width: 100%;

}



.pro1:hover {

  transform: translateY(-3px) scale(1.03);

}



.pro:focus {

  border: 1px solid var(--primary);

  cursor: pointer;

}



.apply-btn {

  color: var(--primary);

  text-decoration: none;

  font-weight: 600;

  position: relative;

  transition: color 0.3s ease;

}



.apply-btn::after {

  content: '';

  position: absolute;

  left: 0;

  bottom: -2px;

  width: 0;

  height: 2px;

  background-color: var(--primary);

  transition: width 0.3s ease;

}



.apply-btn:hover {

  color: #D04527;

}



.apply-btn:hover::after {

  width: 100%;

}



.hover-underline-animation {

  position: relative;

  display: inline-block;

}



.hover-underline-animation::after {

  content: '';

  position: absolute;

  width: 100%;

  height: 2px;

  bottom: -3px;

  left: 0;

  background-color: var(--primary);

  transform: scaleX(0);

  transform-origin: bottom right;

  transition: transform 0.25s ease-out;

}



.hover-underline-animation:hover::after {

  transform: scaleX(1);

  transform-origin: bottom left;

}



/*** Navbar ***/

/* Header Base */
.header {
  /* background: #00000091; */
  /* Transparent by default */
  padding: 12px 0;
  transition: all 0.4s;
  z-index: 9999;
  width: 100%;
  top: 0;
  border-top: 1px solid #fff;

}

.header.scrolled {
  background: #1E222D;
}

.header .logo img {
  max-height: 50px;
}

.codizious-logo-image:hover{
  transform: translateY(-3px) scale(1.03);
}



.navmenu ul {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 0;
}

.navmenu ul li {
  position: relative;
}

.navmenu ul li a {
  padding: 10px 20px;
  font-weight: 600;
  font-size: 16px;
  color: #fff;
  transition: color 0.3s;
  line-height: 3;
}

.navmenu ul li a:hover,
.navmenu ul li a.active {
  color: #EE5B39;
}



/* Mobile Nav */
.mobile-nav-toggle {
  font-size: 28px;
  cursor: pointer;
  color: #fff;
  display: none;
}

@media (max-width: 1199px) {
  .navmenu ul {
    display: none;
    flex-direction: column;
    background: #fff;
    position: absolute;
    top: 70px;
    right: 0;
    width: 100%;
    padding: 20px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  }

  .navmenu ul li a {
    color: #1E222D;
    padding: 12px 0;
  }

  .mobile-nav-toggle {
    display: block;
  }

  .navmenu.navmenu-active ul {
    display: flex;
  }
}

/* Hide ribbon on small screens (mobile & tablet) */
  @media (max-width: 991px) {
    .codizious_rajkot_it_academy {
      display: none !important;
    }
  }


/*** Carousel ***/

.carousel-caption {

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  background: rgba(9, 30, 62, 0.7);

  z-index: 1;

  position: relative;

  width: 100%;

  margin-left: 0;

  height: 100%;

}



.carousel-caption h1,

.carousel-caption p {

  color: #FFF;

  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);

}



.carousel-control-prev,

.carousel-control-next {

  width: 10%;

}



.carousel-control-prev-icon,

.carousel-control-next-icon {

  width: 3rem;

  height: 3rem;

}



.carousel-item {

  position: relative;

  height: 100vh;

  overflow: hidden;

}



.video-background,

.video {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  z-index: 0;

}



.video {

  background: rgba(0, 0, 0, 0.3);

  z-index: 1;

}



@media (max-width: 576px) {

  .carousel-caption h5 {

    font-size: 14px;

    font-weight: 500 !important;

  }



  .carousel-caption h1 {

    font-size: 30px;

    font-weight: 600 !important;

  }

}



/*** Service ***/

.service-item {

  position: relative;

  height: 300px;

  padding: 0 30px;

  transition: transform 0.5s;

}



.service-item .service-icon {

  margin-bottom: 30px;

  width: 60px;

  height: 60px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: var(--primary);

  border-radius: 2px;

  transform: rotate(-45deg);

}



.service-item .service-icon i {

  transform: rotate(45deg);

}



.service-item a.btn {

  position: absolute;

  width: 60px;

  bottom: -48px;

  left: 50%;

  margin-left: -30px;

  opacity: 0;

  transition: all 0.3s ease;

}



.service-item:hover a.btn {

  bottom: -24px;

  opacity: 1;

}



/*** Testimonial ***/

.testimonial-carousel .owl-dots {

  margin-top: 15px;

  display: flex;

  align-items: flex-end;

  justify-content: center;

}



.testimonial-carousel .owl-dot {

  position: relative;

  display: inline-block;

  margin: 0 5px;

  width: 15px;

  height: 15px;

  background: #DDD;

  border-radius: 2px;

  transition: all 0.5s;

}



.testimonial-carousel .owl-dot.active {

  width: 30px;

  background: var(--primary);

}



.testimonial-carousel .owl-item.center {

  position: relative;

  z-index: 1;

}



.testimonial-carousel .owl-item .testimonial-item {

  transition: all 0.5s;

}



.testimonial-carousel .owl-item.center .testimonial-item {

  background: #FFF !important;

  box-shadow: 0 0 30px #DDD;

}



/*** Team ***/

.team-item {

  transition: all 0.5s;

}



.team-item:hover {

  box-shadow: 0 0 30px #DDD;

}



.team-social {

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: all 0.5s;

}



.team-social a.btn {

  position: relative;

  margin: 0 3px;

  margin-top: 100px;

  opacity: 0;

}



.team-item:hover .team-social {

  background: rgba(9, 30, 62, 0.7);

}



.team-item:hover .team-social a.btn {

  opacity: 1;

  margin-top: 0;

}



.team-item:hover .team-social a.btn:first-child {

  transition: all 0.3s 0s;

}



.team-item:hover .team-social a.btn:nth-child(2) {

  transition: all 0.3s 0.05s;

}



.team-item:hover .team-social a.btn:nth-child(3) {

  transition: all 0.3s 0.1s;

}



.team-item:hover .team-social a.btn:nth-child(4) {

  transition: all 0.3s 0.15s;

}



.team-item .team-img img,

.blog-item .blog-img img {

  transition: transform 0.5s;

}



.team-item:hover .team-img img,

.blog-item:hover .blog-img img {

  transform: scale(1.15);

}



/*** Portfolio ***/

.section-padding {

  padding: 80px 0;

}



.custom-container {

  max-width: 1200px;

  margin: 0 auto;

  padding: 60px 15px;

}



#portfolio-categories h2 {

  font-weight: 700;

  font-size: 36px;

  color: #222;

  margin-bottom: 15px;

}



#portfolio-categories p {

  font-size: 18px;

  color: #555;

}



#portfolio-filters {

  margin: 30px 0 50px;

}



#portfolio-filters .btn {

  margin: 10px 8px;

  padding: 10px 22px;

  border-radius: 30px;

  border: 2px solid var(--primary);

  background-color: transparent;

  color: var(--primary);

  font-weight: 500;

  text-transform: uppercase;

  transition: all 0.4s ease;

}



#portfolio-filters .btn:hover,

#portfolio-filters .btn.active {

  background-color: var(--primary);

  color: #FFF;

  box-shadow: 0 5px 15px rgba(236, 96, 56, 0.4);

}



#portfolio-items-container {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  gap: 30px;

  transition: all 0.3s ease;

}



.portfolio-item {

  position: relative;

  width: 100%;

  max-width: 370px;

  min-height: 350px;

  background-color: #FFF;

  border-radius: 16px;

  overflow: hidden;

  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.06);

  transition: all 0.4s ease;

}



.portfolio-item.hidden {

  opacity: 0;

  transform: scale(0.95);

  display: none;

}



.portfolio-item.visible {

  opacity: 1;

  transform: scale(1);

  display: block;

}



.portfolio-item:hover {

  transform: translateY(-8px);

  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);

}



.portfolio-item img {

  width: 100%;

  height: 250px;

  object-fit: cover;

  transition: transform 0.4s ease;

}



.portfolio-item:hover img {

  transform: scale(1.05);

}



.portfolio-info {

  padding: 20px 15px;

  text-align: center;

  background: #FFF;

}



.portfolio-info h4 {

  margin-bottom: 8px;

  font-size: 20px;

  font-weight: 600;

  color: #111;

}



.portfolio-info span {

  font-size: 14px;

  color: var(--primary);

}



.overlay {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(0, 0, 0, 0.65);

  opacity: 0;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 10px;

  transition: opacity 0.4s ease;

}



.portfolio-item:hover .overlay {

  opacity: 1;

}



.overlay-content {

  text-align: center;

}



.overlay-content h5 {

  color: #FFF;

  margin-bottom: 10px;

  font-size: 20px;

  font-weight: 600;

}



.overlay-content a {

  display: inline-block;

  color: #FFF;

  background: var(--primary);

  border-radius: 50%;

  padding: 10px 12px;

  margin: 0 5px;

  font-size: 18px;

  transition: all 0.3s ease;

}



.overlay-content a:hover {

  background: #FFF;

  color: var(--primary);

  transform: scale(1.15);

}



/*** Technologies ***/

.technologie-section {

  position: relative;

  text-align: center;

}



.block-section {

  position: relative;

  padding: 65px 0;

  border-bottom: 1px solid #EEE;

}



.block-section:last-child {

  border-bottom: none;

}



.technologies {

  margin-top: 30px;

}



.technologies ul {

  list-style: none;

  margin: 0 auto;

  padding: 0;

  display: grid;

  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));

  gap: 25px;

  max-width: 1000px;

}



.technologies li {

  background: #FFF;

  border-radius: 10px;

  padding: 20px 10px;

  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);

  display: flex;

  flex-direction: column;

  align-items: center;

  transition: all 0.3s ease;

}



.technologies li:hover {

  transform: translateY(-5px);

}



.tech-image img {

  max-width: 50px;

  height: auto;

  margin-bottom: 12px;

}



.tech-name {

  font-size: 14px;

  font-weight: 500;

  color: #222;

}



/*** Discussion Section ***/

.fdiscuss {

  width: 100%;

  min-height: 435px;

  background: var(--dark);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  position: relative;

  overflow: hidden;

  transition: height 0.4s ease;

}



.fdiscuss img {

  position: absolute;

  top: 50%;

  left: 50%;

  width: 100%;

  transform: translate(-50%, -50%);

  opacity: 0.08;

  transition: all 0.4s ease;

}



.fdiscuss:hover img {

  opacity: 0.22;

  transform: translate(-50%, -50%) scale(1.2);

}



.fdiscuss p {

  font-weight: 400;

  color: #FFF;

  font-size: 30px;

  margin-bottom: 38px;

  z-index: 999;

  text-transform: uppercase;

  text-align: center;

}



.fdiscuss a {

  font-weight: 400;

  color: #FFF;

  font-size: 22px;

  z-index: 999;

  border: 2px solid #FFF;

  background: none;

  padding: 5px 35px;

  text-decoration: none;

  transition: all 0.5s ease;

}



.fdiscuss a:hover {

  color: #FF8800;

  background: #FFF;

}



/*** Codizious Rajkot IT Academy ***/

.codizious_rajkot_it_academy {

  position: fixed;

  right: 0;

  top: 0;

  width: 200px;

  height: 150px;

  font-family: 'Lato', sans-serif;

  text-decoration: none;

}



.codizious_rajkot_it_academy .tag {

  display: block;

  height: 30px;

  width: 200px;

  color: #FFF;

  background: rgb(219, 93, 16);

  text-align: center;

  font-size: 13px;

  font-weight: bold;

  line-height: 30px;

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);

  transform-origin: 15px 0;

}



.codizious_rajkot_it_academy .tag::after {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 196px;

  height: 26px;

  margin: 1px;

  border: 1px solid rgba(255, 255, 255, 0.4);

}



.codizious_rajkot_it_academy .string {

  display: block;

  height: 1px;

  width: 0;

  position: absolute;

  background: rgba(255, 255, 255, 0.7);

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.4);

  transform-origin: 0 0;

}



.codizious_rajkot_it_academy-curtain {

  position: fixed;

  left: 0;

  top: -100%;

  width: 100%;

  height: 100%;

  text-align: center;

  background: rgba(0, 0, 0, 0.95);

  display: flex;

  align-items: center;

  justify-content: center;

  background-size: cover;

  background-position: center;

  padding: 70px;

}



.codizious_rajkot_it_academy-curtain .close-button {

  position: absolute;

  width: 32px;

  height: 32px;

  right: 94px;

  top: 6px;

  cursor: pointer;

  background: url(data:image/gif;base64,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);

}



/*** Animation Container ***/

#animation_container,

#animation_container #canvas {

  width: 100% !important;

  padding-bottom: 15px;

}



#canvas-wrapper {

  pointer-events: none;

}



/*** Card and Hover Effects ***/

.feature-card:hover,

.team-card:hover {

  transform: translateY(-5px);

  transition: all 0.3s ease;

}



.counter-hover {

  transform: translateY(0);

}



.group:hover .counter-hover {

  transform: translateY(-10px);

  background-color: rgba(8, 145, 94, 0.9);

  color: #FFF;

}



/*** CTA Section ***/

.cta-section {

  background-color: #222;

  color: #FFF;

  text-align: center;

}



.cta-section .btn {

  background: var(--primary);

  border: none;

  padding: 12px 30px;

  font-size: 18px;

  border-radius: 30px;

  transition: background 0.3s;

}



.cta-section .btn:hover {

  background: #C84F2D;

}



/*** Page Header ***/

.page-header-text {

  color: #FFF;

  padding: 50px 0;

  margin-bottom: 30px;

}



.page-title {

  font-size: 3em;

  margin-bottom: 10px;

}



.title-subtext span {

  color: #F1C40F;

  font-weight: bold;

}



.title-open-position {

  font-size: 2em;

  color: #2C3E50;

  margin-bottom: 20px;

}



.title-open-position a {

  text-decoration: none;

  color: inherit;

}



.open-sub-title {

  font-weight: bold;

  font-size: 1.2em;

  margin: 20px 0 10px;

  color: #34495E;

}



.list-unstyled li {

  margin-bottom: 5px;

}



.description-open-position p {

  margin-top: 15px;

}



.description-open-position a {

  color: var(--primary) !important;

  font-weight: bold;

}

.navbar-nav .nav-link {
  color: #fff !important;
}

/* Active link highlight */
.navbar-nav .nav-link.active {
  color: #f58632ff !important;
  font-weight: bold;
}

/* Mobile menu background */
@media (max-width: 991px) {
  .navbar-collapse {
    background-color: #111;
    padding: 1rem;
  }
}

@media (max-width: 991px) {
  .navbar-nav .nav-link {
    color: #000000 !important;
  }
}

/*** Expert Images and Carousel ***/

.expertimages img {

  max-width: 100%;

  height: auto;

  display: block;

  margin: 0 auto;

}



.owl-carousel .owl-stage-outer {

  margin: 0 -15px;

}



.owl-carousel .owl-item {

  display: flex;

  justify-content: center;

  align-items: center;

}



.nopadding {

  padding: 0 !important;

}



/*** Form Overlay ***/

.form-overlay {

  position: fixed;

  top: 0;

  left: 0;

  background: rgba(10, 10, 10, 0.85);

  width: 100%;

  height: 100%;

  z-index: 1050;

  display: flex;

  align-items: center;

  justify-content: center;

  backdrop-filter: blur(5px);

}



.form-container {

  background-color: #1F1F1F;

  padding: 40px;

  border-radius: 16px;

  width: 90%;

  max-width: 500px;

  position: relative;

  box-shadow: 0 0 30px rgba(255, 255, 255, 0.1);

  border: 1px solid #555;

  animation-duration: 0.5s;

}



/*** Animation (AOS) ***/

[data-aos] {

  opacity: 1;

  transition: all 0.6s ease;

}



[data-aos].aos-animate {

  opacity: 1;

}



/*** Miscellaneous ***/

/*--------------------------------------------------------------
# Scroll Top Button
--------------------------------------------------------------*/
.scroll-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 99999;
  background-color: var(--accent-color);
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}

.scroll-top i {
  font-size: 24px;
  color: var(--contrast-color);
  line-height: 0;
}

.scroll-top:hover {
  background-color: color-mix(in srgb, var(--accent-color), transparent 20%);
  color: var(--contrast-color);
}

.scroll-top.active {
  visibility: visible;
  opacity: 1;
  background-color: coral;
  color: white;
}

.scroll-top.active:hover{
  background-color: #D04527;
  cursor: pointer;
}


.bg-header {

  background: linear-gradient(rgba(9, 30, 62, 0.7), rgba(9, 30, 62, 0.7)), url(../img/breadcrumb_bg.png) center center no-repeat;

  background-size: cover;

}



.link-animated a {

  transition: padding-left 0.5s;

}



.link-animated a:hover {

  padding-left: 10px;

}



.sharing {

  position: absolute;

  bottom: 16px;

  left: 20px;

}

.footer2_bg {

    background: #333333;
    color: #ffffff;
    font-weight: 600;

}

/*** Media Queries ***/

@media (min-width: 991.98px) {

  .facts {

    position: relative;

    margin-top: -75px;

    z-index: 1;

  }

}



@media (min-width: 767.98px) {

  .footer-about {

    margin-bottom: -75px;

  }

}



@media (max-width: 992px) {

  #portfolio-items-container {

    gap: 25px;

  }

}



@media (max-width: 832px) {

  .fdiscuss {

    min-height: 400px;

  }

}



@media (max-width: 768px) {

  #portfolio-filters .btn {

    padding: 8px 18px;

    font-size: 13px;

  }



  .portfolio-info h4,

  .overlay-content h5 {

    font-size: 18px;

  }



  .fdiscuss {

    min-height: 333px;

  }



  .fdiscuss img {

    min-height: 333px;

  }



  .fdiscuss p {

    text-align: center;

  }



  .my-section {

    position: relative;

  }

}



@media (max-width: 600px) {

  .section-title h2 {

    font-size: 26px;

  }



  .font-medium {

    font-size: 18px;

  }

}



@media (max-width: 360px) {

  .fdiscuss {

    height: 336px;

  }

}





/* Responsive Adjustments */



@media (max-width: 1200px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {

    max-width: 100%;

    padding: 0 15px;

  }

}



@media (max-width: 992px) {

  .navbar-collapse {

    background: #e1e1e1;
    /* fallback for mobile nav */
    margin-top: 40px;
    padding: 10px;

  }

  .navbar-nav {

    text-align: center;

  }

  .carousel-caption {

    font-size: 14px;

  }

  .section-title h2 {

    font-size: 28px;

  }

}



@media (max-width: 768px) {

  .hero-section,

  .services-section,

  .about-section,

  .portfolio-section,

  .contact-section {

    padding: 30px 15px;

  }

  .section-title h2 {

    font-size: 24px;

  }

  .footer-contact {

    text-align: center;

  }

  .navbar-brand img {

    max-width: 150px;

  }

}



@media (max-width: 576px) {

  .carousel-caption h5,

  .carousel-caption p {

    font-size: 14px;

  }

  .navbar-toggler {

    margin-right: 10px;

  }

  .contact-info-box,

  .feature-box,

  .portfolio-item {

    margin-bottom: 20px;

  }

}



#codizious_loader_container {

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(255, 255, 255);
  /* Light overlay to ensure content is hidden */

  z-index: 9999;
  /* Highest z-index to overlay everything */

  display: flex;

  align-items: center;

  justify-content: center;

}

.codizious_loader {

  text-align: center;

  font-family: 'Montserrat', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

  padding: 25px;

  border-radius: 15px;

  background: rgba(255, 255, 255, 0.95);

  width: 90%;

  max-width: 550px;

}

.codizious_loader img {

  width: 100%;

  height: auto;

  opacity: 0;

  animation: fadeInLoad 2s ease-in-out infinite;

  filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.1));

}

.codizious_loader .tagline {

  font-size: 1.1rem;

  color: #444;

  margin-top: 12px;

  font-weight: 500;

  opacity: 0;

  animation: fadeIn 2s ease-in-out 0.5s forwards;

}

.progress-bar {

  margin-top: 15px;

  width: 100%;

  height: 6px;

  background: #f0f0f0;

  border-radius: 3px;

  overflow: hidden;

  position: relative;

}

.progress {

  height: 100%;

  width: 0;

  background: linear-gradient(to right, #ff6b6b, #4ecdc4, #45b7d1, #96c93d);

  animation: progressAnimation 4s linear infinite;

  border-radius: 3px;

}

.codizious_loader .status {

  font-size: 1.8rem;

  color: #ff6b6b;

  margin-top: 20px;

  font-weight: 600;

  opacity: 0;

  animation: fadeIn 2s ease-in-out 0.5s forwards;

}

.codizious_loader .progress-text {

  font-size: 1rem;

  color: #666;

  margin-top: 8px;

  font-weight: 400;

  opacity: 0;

  animation: slideUp 2s ease-in-out 1s forwards;

}

@keyframes fadeInLoad {

  0% {
    opacity: 0.3;
  }

  50% {
    opacity: 1;
  }

  100% {
    opacity: 0.3;
  }

}

@keyframes fadeIn {

  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }

}

@keyframes slideUp {

  0% {
    opacity: 0;
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    transform: translateY(0);
  }

}

@keyframes progressAnimation {

  0% {
    width: 0;
  }

  100% {
    width: 100%;
  }

}

@media (max-width: 480px) {

  .codizious_loader {
    padding: 15px;
  }

  .codizious_loader .status {
    font-size: 1.4rem;
  }

  .codizious_loader .tagline {
    font-size: 0.9rem;
  }

  .codizious_loader .progress-text {
    font-size: 0.85rem;
  }

}

@media (min-width: 481px) and (max-width: 768px) {

  .codizious_loader .status {
    font-size: 1.6rem;
  }

  .codizious_loader .tagline {
    font-size: 1rem;
  }

}


/* ================================= */
/*  */
/* ================================= */
