   .section-faq-container {
      margin: auto;
      background: #fff;
      border-radius: 6px;
      border: 1.4px solid #b7b5b582;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
      font-family:'Proxima Nova';
    }

    .section-faq .sections {
      display: flex;
      margin-bottom: 15px;
      border-bottom: 1.4px solid #ddd;
      padding-bottom: 8px;
      overflow-x: auto;
      white-space: nowrap;
      scroll-behavior: smooth;
      -webkit-overflow-scrolling: touch;
    }

    .section-faq .sections::-webkit-scrollbar {
      display: none;
    }

    .section-faq .section {
      background: #fff;
      border: none;
      padding: 8px 12px;
      font-size: 18px;
      font-weight:600;
      cursor: pointer;
      transition: all 0.3s ease;
      flex: 0 0 auto;
    }

    

    .section-faq .arrow-controls {
      display: flex;
      justify-content: center;
      gap: 20px;
      margin: 20px 0;
    }

    .section-faq .arrow-btn {
      font-size: 20px;
      padding: 10px 20px;
      background: #000;
      color: #fff;
      border: none;
      border-radius: 6px;
      cursor: pointer;
      transition: background 0.3s;
    }

    .section-faq .arrow-btn:hover {
      background: #333;
    }

    .section-faq .faq-section {
      display: flex;
      flex-direction: column;
      gap: 15px;
      padding: 0px 1rem;
      padding-top:2rem;
      margin: 0 auto;
    }

    .section-faq .faq-item {
      border: 1px solid #ddd;
      border-radius: 4px;
      background: #fff;
      overflow: hidden;
      box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    }

    .section-faq .faq-question {
      width: 100%;
      padding: 15px 20px;
      font-size: 17px;
      font-weight: bold;
      text-align: left;
      background: #fff;
      border: none;
      cursor: pointer;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .section-faq .faq-question i {
      transition: transform 0.3s ease;
    }

    .section-faq .faq-question.open i {
      transform: rotate(180deg);
    }

    .section-faq .faq-answer {
      display: none;
      padding: 0 20px 15px 20px;
      font-size: 16px;
      line-height: 1.6;
    }

    .section-faq .faq-answer.show {
      display: block;
    }
    
    /* Desktop: default single-line */
.mobile-break,.mobile-break-ordering,.mobile-break-about {
  white-space: nowrap;
}

/* Mobile: break into two lines and hide original */
@media (max-width: 576px) {
  .mobile-break,.mobile-break-ordering,.mobile-break-about {
    position: relative;
    display: inline-block;
    white-space: normal;
    line-height: 1.2; /* ✅ tighter line spacing */
  }

  .mobile-break::before,
  .mobile-break::after,
  .mobile-break-ordering::before,
  .mobile-break-ordering::after,
  .mobile-break-about::before,
  .mobile-break-about::after{
    display: block;
    color: inherit;
    position: relative;
    margin: 0;           /* ✅ remove default margin */
    padding: 0;          /* ✅ remove default padding */
    line-height: 1.2;    /* ✅ consistent spacing */
  }

  .mobile-break::before {
    content: "Health";
  }
  
  .mobile-break-ordering::before{
  	 content:"Ordering"
  }

  .mobile-break::after {
    content: "& Nutrition";
  }
  
  .mobile-break-ordering::after{
  	 content:"& Delivery"
  }
  .mobile-break-about::before{
  	content:"About"
  }
  .mobile-break-about::after{
  	content:"Meals"
  }
  
  .section-faq .section.active {
      border-bottom: 2px solid;
    }
   .section-faq .sections {
   		gap:6px;
   		padding:0 10px;
   }
}

    
    @media (min-width:577px){
    	
    	.section-faq .section {
    		padding: 8px 12px;
    	}
    	.section-faq .sections {
    		padding: 12px;
    	}
    	.section-faq .faq-section {
    		padding: 0px 2rem;
    		padding-top:2rem;
    	}
    	.mobile-break::after {
		    content: "Health & Nutrition";
		  }
		.mobile-break-ordering::after{
		  	 content:"Ordering & Delivery"; 
		  }
		  .mobile-break-about::after{
		  	content:"About Meals"
		  }
		  .section-faq .section.active {
	      text-decoration: underline #000;
	      text-underline-offset: 20px;
	      text-decoration-thickness: 2px;
	    }
    }