/* =================== COMPLETED SWISS GROUP STYLE ===============  **/

/* MOBILE FIT SCREEN**/
    html, body {
  overflow-x: hidden;
  width: 100%;
}

/**ENDS**/


/* --- HOMES PAGE CAROUSE SLIDES  -----*/
.testimonial-slider .slick-slide {
    padding: 0 !important;   /* remove Slick default padding */
    margin: 0 !important;
    display: flex !important;
    justify-content: center;
}

.testimonial-slider .MuiPaper-root {
    margin: 0;               /* remove inner card margin if any */
}


/*****/

.slick-track {
    display: flex !important;
    gap: 20px; /* adjust gap between cards */
}

.testimonial-slider .slick-slide {
    width: auto !important;  /* let Slick calculate width per slide */
}


/*****/

.testimonial-slider .MuiPaper-root {
    height: 100%;
    max-width: 384px;
}


.testimonial-slider .slick-list {
    padding: 0 !important;
}


/* ====== NAVIGATIONS  STARTS======== */

/* ---------------- DESKTOP NAVIGATION ---------------- */
.desktop-menu {
  display: flex;
  gap: 12px;
  align-items: center;
}

/* Desktop submenu hidden by default */
.submenu {
  display: none;
  list-style: none;
  background: white;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  position: absolute;
  top: 100%;
  left: 0;
  padding: 10px 0;
  min-width: 180px;
  z-index: 1000;
}

.submenu li a {
  display: block;
  padding: 8px 15px;
  text-decoration: none;
  color: #333;
}

.submenu li a:hover {
  background: #f5f5f5;
}

/* Show submenu on hover for desktop */
@media (min-width: 769px) {
  .has-submenu:hover > .submenu {
    display: block;
  }
}

/* Desktop CTA */
.desktop-get-started {
  margin-left: auto;
}

/* ---------------- MOBILE NAVIGATION ---------------- */

/* mobile button hidden on desktop */
#mobileMenuBtn { display: none; }

/* show on small screens */
@media (max-width: 768px) {
  .desktop-menu, .desktop-get-started { display: none !important; }
  #mobileMenuBtn { display: block !important; }
}

/* ---------- MOBILE MODAL SLIDE LEFT ---------- */
.mobile-menu-modal {
  display: flex;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 9999;
  align-items: stretch;       /* full height */
  justify-content: flex-start; /* align left */
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

.mobile-menu-modal.open {
  opacity: 1;
  pointer-events: auto;
}

/* box sliding from left */
.mobile-menu-box {
  width: 80%;
  max-width: 260px;
  height: 100%;
  background: #fff;
  border-radius: 0 10px 10px 0;
  padding: 18px;
  box-shadow: 4px 0 24px rgba(0,0,0,0.25);
  transform: translateX(-100%);
  transition: transform 0.35s cubic-bezier(0.77, 0, 0.175, 1);
  overflow-y: auto;
}

/* slide in when open */
.mobile-menu-modal.open .mobile-menu-box {
  transform: translateX(0);
}

/* close button */
.mobile-menu-close {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 26px;
  border: none;
  background: none;
  cursor: pointer;
}

/* mobile menu list */
.mobile-menu-list {
  list-style: none;
  margin: 0;
  padding: 8px 0 18px 0;
}

.mobile-menu-list > li {
  margin-bottom: 8px;
}

/* links */
.mobile-link {
  display: block;
  padding: 12px 8px;
  color: inherit;
  text-decoration: none;
  border-radius: 6px;
}

.mobile-link:hover {
  background: #f3f3f3;
}

/* mobile CTA */
.mobile-cta {
  display: inline-block;
  margin-top: 8px;
  padding: 10px 14px;
  background: #0b72f5;
  color: #fff;
  border-radius: 6px;
  text-decoration: none;
}

/* ---------- MOBILE SUBMENU ---------- */
#mobileMenuModal .mobile-submenu {
  display: none;
  list-style: none;
  margin: 6px 0 0 0;
  padding-left: 14px;
}

#mobileMenuModal .mobile-submenu.open {
  display: block;
}

#mobileMenuModal .mobile-submenu li a {
  padding: 8px 6px;
  display: block;
  border-radius: 6px;
}

#mobileMenuModal .mobile-submenu li a:hover {
  background: #f7f7f7;
}

/* submenu toggle button */
.mobile-submenu-toggle {
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 12px 8px;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
  cursor: pointer;
}

/* ====== NAVIGATIONS  ENDS======== */








/*================-Hero Background mobile fix-================*/
/* Fix layout spacing for mobile */
/* Collapse the right column on mobile */
@media (max-width: 768px) {
  .css-p6sum0 {
    display: none !important;
  }

  /* Make sure left column fills the width */
  .css-1lheld5 {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/****Mobile Hero Section Fill up**/
/* Make container full width on small screens */
@media (max-width: 768px) {
  .MuiBox-root.css-cqmqwk {
    margin-top: 70px !important;  /* pushes it down from logo */
  }
}

/**Hero Animation**/
/* Define animation */
@keyframes fadeSlideUp {
  0% {
    opacity: 0;
    transform: translateY(50px); /* stronger slide up */
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Apply staggered, but faster */
.css-1qsxih2 .css-cqmqwk,        /* rocket + h6 */
.css-1qsxih2 h1,
.css-1qsxih2 .css-ddmltu,
.css-1qsxih2 .css-1kcd46o {
  opacity: 0;
  transform: translateY(50px);
  animation: fadeSlideUp 0.6s cubic-bezier(0.25, 1, 0.5, 1) forwards; 
  /* faster + spring-like easing */
}

/* Shorter stagger delays */
.css-1qsxih2 .css-cqmqwk { animation-delay: 0.1s; }
.css-1qsxih2 h1 { animation-delay: 0.2s; }
.css-1qsxih2 .css-ddmltu { animation-delay: 0.3s; }
.css-1qsxih2 .css-1kcd46o { animation-delay: 0.4s; }



/* ====== ANIMATIOS SCROLLING======== */

/* Styles for animation of sections scrolling * /
/* Hidden state */
.hidden-section {
  opacity: 0;
  transform: translateY(25px);
  transition: opacity 0.3s ease-out, transform 0.3s ease-out;
}

/* Visible state */
.visible-section {
  opacity: 1;
  transform: translateY(0);
}



/* ====== FAQ ======== */

.accordion {
  width: 100%;                
  margin: 1rem auto;
  background: #fff;            
  border-radius: 8px;          /* Rounded corners */
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); /* Subtle shadow */
  overflow: hidden;            /* Keep rounded edges clean */
}

.accordion-item {
  border-bottom: 1px solid #eee;
  background: #fff;            
}

.accordion-item:last-child {
  border-bottom: none; /* Remove border on last item */
}

.accordion-header {
  width: 100%;
  padding: 1rem;
  text-align: left;
  font-size: 1.1rem;
  font-weight: bold;
  background: #fff;            
  border: none;
  outline: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background 0.3s ease;
}

.accordion-header:hover {
  background: #f9f9f9;         
}

.accordion-header::after {
  content: "▼";
  font-size: 0.9rem;
  transition: transform 0.3s ease;
}

.accordion-item.active .accordion-header::after {
  transform: rotate(-180deg);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  background: #fff;            
  transition: max-height 0.3s ease, padding 0.3s ease;
  padding: 0 1rem;
}

.accordion-item.active .accordion-content {
  max-height: 300px; 
  padding: 1rem;
}