/* ========================================
   MOBILE RESPONSIVE FIXES
   This file ONLY contains mobile fixes WITHOUT changing existing styles
   ======================================== */

/* Mobile responsive fixes for screens 768px and below */
@media (max-width: 768px) {  /*768*/
  /* Force box-sizing for all elements */
  *,
  *::before,
  *::after {
    box-sizing: border-box !important;
  }

  /* Prevent horizontal overflow */
  body,
  html {
    overflow-x: hidden !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  /* Force all text elements to wrap properly */
  p,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  span,
  div {
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* Make all containers responsive */
  .container,
  .header-container,
  .video-container,
  .who-we-are-container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    overflow: hidden !important;
  }

  /* Force all sections to be responsive */
  section,
  div,
  article {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* Fix footer logo and layout issues */
  .custom-footer {
    padding: 30px 15px 20px !important;
    overflow: hidden !important;
  }

  .footer-content {
    flex-direction: column !important;
    gap: 20px !important;
    max-width: 100% !important;
  }

  .footer-left,
  .footer-right {
    min-width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .footer-logo {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .footer-logo img {
    width: 100% !important;
    max-width: 120px !important;    /* Date 11/09*/
    height: auto !important;
    margin-left: 0 !important;
  }

  .footer-right {
    padding-left: 0 !important;
  }

  .footer-right::before {
    display: none !important;
  }

  .footer-bottom {
    flex-direction: column !important;
    gap: 10px !important;
    text-align: center !important;
    margin-left: 0 !important;
    max-width: 100% !important;
  }

  /* Fix office blocks */
  .office-block {
    flex-direction: column !important;
    gap: 20px !important;
    margin-bottom: 20px !important;
    max-width: 100% !important;
  }

  .ft-icons {
    flex-direction: row !important;   /* date 11/09*/
    gap: 10px !important;
    max-width: 100% !important;
  }

  .ft-icons img {
    width: 20px !important;
    height: 20px !important;
  }

  /* Fix scroll to top button */
  #backToTop {
    bottom: 20px !important;
    right: 20px !important;
    padding: 12px !important;
    z-index: 1000 !important;
  }

  #backToTop img {
    width: 20px !important;
    height: 20px !important;
  }

  /* Fix text overflow in "Our Vision" section */
  .who-we-are-right {
    max-width: 100% !important;
    width: 100% !important;
    flex: none !important;
    overflow: hidden !important;
  }

  .inner-content-who-we-are-right {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 15px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .who-we-are-right p {
    max-width: 100% !important;
    width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    hyphens: auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  /* Stack sections vertically on mobile */
  .who-we-are-container {
    flex-direction: column !important;
  }

  .who-we-are-left,
  .who-we-are-right {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Make images responsive */
  .who-we-are-left img {
    width: 100% !important;
    height: auto !important;
  }

  /* Adjust font sizes for mobile */
  .icon-title h3 {
    font-size: 1.4rem !important;
  }

  .who-we-are-right p {
    font-size: 0.95rem !important;
    line-height: 1.4 !important;
  }

  /* Fix hero banner on mobile */
  .hero-banner {
    padding: 80px 15px !important;
    background-size: cover !important;
    background-position: center !important;
  }

  .hero-content {
    max-width: 100% !important;
    padding: 0 10px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .hero-content h1 {
    font-size: 2.2em !important;
    line-height: 1.2 !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .hero-content p {
    font-size: 1.2em !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* Fix navigation on mobile */
  .main-nav {
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    width: 100% !important;
    background: #fff !important;
    z-index: 999 !important;
    display: none !important;
    flex-direction: column !important;
    padding: 20px !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
  }

  .main-nav.active {
    display: flex !important;
  }

  .main-nav ul {
    flex-direction: column !important;
    gap: 15px !important;
  }

  .menu-toggle {
    display: block !important;
  }

  /* Fix partner logos on mobile */
  

  /* Fix video section on mobile */
  .impact-section {
    padding: 40px 15px !important;
    overflow: hidden !important;
  }

  .video-container {
    flex-direction: column !important;
    gap: 30px !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .impact-content {
    text-align: center !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .impact-content h2 {
    font-size: 2.5rem !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .impact-content p {
    margin-right: 0 !important;
    max-width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    overflow: hidden !important;
  }

  .impact-video {
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  .video-thumbnail {
    height: 250px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* Fix testimonial slider on mobile */
  .slider-container-first {
    max-width: 100% !important;
    padding: 0 15px !important;
    margin: 20px auto !important;
  }

  .div-slide-first {
    padding: 20px 15px 0px !important;  /* Date 11/09*/
    border-radius: 20px !important;
  }

  .div-slide-first.active {
    flex-direction: column !important;
    text-align: center !important;
  }

  .testimonial-text {
    padding: 20px 0 10px 0 !important;
    max-width: 100% !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
  }

  .testimonial-image {
    position: relative !important;
    width: 120px !important;
    right: auto !important;
    top: auto !important;
    margin: 15px auto 0 !important;
  }

  .quote-icon {
    font-size: 60px !important;
    margin-top: -30px !important;  /* Date 11/09*/
    margin-left: 10px !important;
  }

  /* Fix other sections on mobile */
  .section {
    height: auto !important;
    padding: 40px 15px !important;
  }

  .shell {
    grid-template-columns: 1fr !important;
  }

  .hand {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 300px !important;
    margin: 0 auto !important;
  }

  .copy {
    width: 100% !important;
    padding-top: 20px !important;
    text-align: center !important;
  }

  .copy h1 {
    font-size: 2rem !important;
  }

  /* Fix building circularity section */
  .building-circularity {
    flex-direction: column !important;
    margin-top: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .building-circularity-left,
  .building-circularity-right {
    width: 100% !important;
    padding: 30px 20px !important;
    max-width: 100% !important;
    overflow: hidden !important;
    text-align: center !important;
  }

  .building-circularity-left h1 {
    font-size: 28px !important;
    text-align: center !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  .building-circularity-right p {
    width: 100% !important;
    text-align: center !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    margin: 0 auto !important;
  }

  /* Fix covers section */

  .covers-container {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .text-image-container {
    margin-left: 0 !important;
    flex-direction: column !important;
  }

  .cover-item-7 {
    width: 100% !important;
  }

  /* Fix approach section */
  .approach-section {
    padding: 30px 15px !important;
    overflow: hidden !important;
  }

  .approach-container {
    flex-direction: column !important;
    gap: 30px !important;
    max-width: 100% !important;
  }

  .approach-text {
    max-width: 100% !important;
    text-align: center !important;
    overflow: hidden !important;
  }

  .green-title {
    font-size: 28px !important;
    word-wrap: break-word !important;
  }

  .approach-text h3 {
    font-size: 24px !important;
    word-wrap: break-word !important;
  }

  .approach-text p {
    font-size: 14px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }

  .approach-image {
    padding-left: 0 !important;
    max-width: 100% !important;
  }

  .approach-image img {
    width: 280px !important;
    max-width: 100% !important;
    height: auto !important;
  }

  /* Fix slider container */
  .slider-container-top {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .div-slider {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .approach-box {
    max-width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  .approach-box h4 {
    font-size: 16px !important;
    word-wrap: break-word !important;
  }

  .approach-box p {
    font-size: 14px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* Fix slider section */
  .slider-section {
    padding: 30px 15px !important;
  }

  .slider-section h2 {
    font-size: 24px !important;
  }

  .slider-subtext {
    width: 100% !important;
  }

  /* Fix FAQ section */
  .faq-section {
    width: 90% !important;
    margin: 30px auto !important;
    overflow: hidden !important;
  }

  .faq-section h2 {
    font-size: 40px !important;
    word-wrap: break-word !important;
    text-align: center !important;
  }

  .faq-container {
    grid-template-columns: 1fr !important;
    gap: 15px !important;
    max-width: 100% !important;
  }

  .faq-item {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .faq-question {
    font-size: 16px !important;
    padding: 15px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }

  .faq-answer {
    font-size: 14px !important;
    padding: 15px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
  }

  .faq-question span {
    font-size: 40px !important;
    line-height: 30px !important;
    flex-shrink: 0 !important;
    margin-left: auto !important;
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
  }

  .faq-question {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  /* Fix knowledge section */
  .knowledge-section {
    overflow: hidden !important;
  }

  .knowledge-container {
    flex-direction: column !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .knowledge-image {
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .knowledge-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  .knowledge-content {
    padding: 30px 20px !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  .knowledge-content h2 {
    font-size: 28px !important;
    word-wrap: break-word !important;
  }

  .knowledge-content h3 {
    font-size: 20px !important;
    word-wrap: break-word !important;
  }

  .knowledge-content p {
    width: 100% !important;
    max-width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  .download-list {
    max-width: 40% !important;                 /* Date 11/09*/
    overflow: hidden !important;
  }

  .download-list li {
    max-width: 100% !important;
    margin-bottom: 10px !important;
  }

  .download-list li a {
    font-size: 14px !important;
    padding: 8px 12px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    display: block !important;
  }

  /* Fix achievements section - Override all carousel behavior on mobile */
  .achievements {
    padding: 30px 15px !important;
    overflow: visible !important;
    display: block !important;
  }

  .achievements__title {
    font-size: 1.4rem !important;
    margin-bottom: 40px !important;   /* Date 11/09*/
    margin-top: 20px !important;
    text-align: center !important;
    display: block !important;
  }

  /* Completely override carousel to be a simple container */
  .achievements__carousel {
    max-width: 100% !important;
    overflow: visible !important;
    position: relative !important;
    display: block !important;
    grid: none !important;
    align-items: unset !important;
    margin: 0 !important;
  }

  /* Make viewport a slider container with overflow hidden */
  .achievements__viewport {
    max-width: 100% !important;
    overflow: hidden !important;
    width: 100% !important;
    height: auto !important;
    position: relative !important;
    margin: 0 !important;
  }

  /* Make track a vertical stack container */
  .achievements__track {
    max-width: 100% !important;
    overflow: visible !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    height: auto !important;
    gap: 40px !important;      /*Date 11/09*/
    transition: none !important;
    will-change: auto !important;
    transform: none !important;
    margin-top: 30px;     /*Date 11/09*/
  }

  /* Override all card properties for vertical stack */
  .achievements__card {
    flex: none !important;
    margin: 0 !important;
    padding: 40px 20px 20px !important;
    min-width: calc(100% - 40px) !important;
    max-width: calc(100% - 40px) !important;
    width: calc(100% - 40px) !important;
    overflow: visible !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    background: #fff !important;
    border: 2px solid #48c472 !important;
    border-radius: 4px !important;
    text-align: center !important;
    min-height: auto !important;
    scroll-snap-align: none !important;
  }

  .achievements__card p {
    font-size: 0.9rem !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    max-width: 100% !important;
    margin: 0 !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    display: block !important;
  }

  .achievements__badge {
    position: absolute !important;
    top: -32px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 56px !important;
    height: 56px !important;
    border-radius: 999px !important;
    background: #6fb865 !important;
    display: grid !important;
    place-items: center !important;
    border: 3px solid #fff !important;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.04) !important;
    z-index: 5 !important;
  }

  .achievements__badge img {
    width: 35px !important;
    height: 35px !important;
    object-fit: contain !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 1 !important;
    filter: brightness(0) invert(1) !important;
  }

  /* Ensure all achievement icons are properly displayed and centered */
  .achievements__card:nth-child(2) .achievements__badge img,
  .achievements__card:nth-child(3) .achievements__badge img {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: brightness(0) invert(1) !important;
    width: 35px !important;
    height: 35px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
  }

  /* Fix first card to match desktop behavior */
  .achievements__card:nth-child(1) .achievements__badge {
    background-image: none !important;
  }

  .achievements__card:nth-child(1) .achievements__badge img {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: brightness(12) saturate(0) !important;
    width: 35px !important;
    height: 35px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
  }

  /* Hide navigation arrows for vertical stack */
  .achievements__nav--prev,
  .achievements__nav--next {
    display: none !important;
  }

  /* Hide all cards except first 3 on mobile */
  .achievements__card:nth-child(n + 4) {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    height: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  /* Ensure first 3 cards are visible for vertical stack */
  .achievements__card:nth-child(1),
  .achievements__card:nth-child(2),
  .achievements__card:nth-child(3) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
  }


  

  /* Fix Who We Are section overflow */
  .who-we-are-section {
    overflow: hidden !important;
  }

  .who-we-are-container {
    flex-direction: column !important;
    width: 100% !important;
  }

  .who-we-are-left {
    max-width: 100% !important;
    min-width: auto !important;
    flex: none !important;
  }

  .who-we-are-right {
    max-width: 100% !important;
    width: 100% !important;
    flex: none !important;
    padding: 20px !important;
  }

  .inner-content-who-we-are-right {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 15px !important;
  }
  .who-we-are-right p {
    max-width: 100% !important;
    width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    font-size: 1rem !important;
    line-height: 1.4 !important;
    margin: 15px 0 !important;
  }

  .icon-title {
    display: flex !important;
    align-items: center !important;
    margin-bottom: 15px !important;
  }

  .icon-title img {
    width: 30px !important;
    height: 30px !important;
    margin-right: 10px !important;
  }

  .icon-title h3 {
    font-size: 1.3rem !important;
    margin: 0 !important;
  }

  /* Fix Circularity Innovation Challenge section */
  .section {
    height: auto !important;
    min-height: auto !important;
    padding: 20px 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .shell {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    align-items: center !important;
    justify-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .panel {
    min-height: auto !important;
    height: auto !important;
    overflow: hidden !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .hand {
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 300px !important;
    height: auto !important;
    transform: none !important;
    display: block !important;
    margin: 0 auto !important;
  }

  .copy {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 15px !important;
    padding-top: 20px !important;
    text-align: center !important;
  }

  .copy h1 {
    font-size: 1.8rem !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
  }

  .copy .sub {
    font-size: 1.1rem !important;
    margin-bottom: 15px !important;
  }

  .copy .kicker {
    font-size: 1.2rem !important;
    margin: 20px 0 15px !important;
  }

  .copy p {
    max-width: 100% !important;
    width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    line-height: 1.4 !important;
    font-size: 1rem !important;
    margin-bottom: 15px !important;
  }

  /* Fix covers section layout */
  .covers-section {
    width: 90% !important;
    margin: 30px auto 0px !important;     /*Date 11/09*/
    overflow: hidden !important;
  }

  .covers-container {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
    max-width: 100% !important;
  }

  .text-image-container {
    margin-left: 0 !important;
    flex-direction: column !important;
    max-width: 100% !important;
  }

  .cover-item-7 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 40px !important;    /* Date 11/09*/
    margin: 0 !important;
    overflow: hidden !important;
  }

  .cover-item-7 .content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .cover-item-7 .content h3 {
    font-size: 1.2rem !important;
    line-height: 1.3 !important;
    margin-bottom: 10px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
  }

  .cover-item-7 .content p {
    font-size: 0.9rem !important;
    line-height: 1.4 !important;
    margin-bottom: 15px !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
  }

  .cover-item-image {
    min-height: 100px !important;
    margin-top: 20px !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
  }

  .cover-item-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .cover-item-image img {
    height: 100px !important;
    position: relative !important;
    left: auto !important;
    bottom: auto !important;
    max-width: 100% !important;
  }

  .content h3 {
    font-size: 15px !important;
    word-wrap: break-word !important;
  }

  .content p {
    font-size: 14px !important;
    max-width: 100% !important;
    width: 100% !important;
    word-wrap: break-word !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    hyphens: auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  /* fixed partners logo */
  .partner-logos{
    gap: 0px;
  }

  /* Fix the specific cover-item layout */
  .cover-item {
    max-width: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .cover-item .content {
    max-width: calc(100% - 50px) !important;
    width: calc(100% - 50px) !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  /* Fix footer on mobile */
  .footer-content {
    flex-direction: column !important;
    gap: 20px !important;
  }

  .footer-left,
  .footer-right {
    min-width: 100% !important;
  }

  .footer-right {
    padding-left: 0 !important;
  }

  .footer-right::before {
    display: none !important;
  }

  .footer-bottom {
    flex-direction: column !important;
    gap: 10px !important;
    text-align: center !important;
    margin-left: 0 !important;
  }
}

/* Extra small devices */
@media (max-width: 480px) {
  .hero-content h1 {
    font-size: 1.8em !important;
  }

  .hero-content p {
    font-size: 1em !important;
  }

  .who-we-are-right p {
    font-size: 0.9rem !important;
  }

  .icon-title h3 {
    font-size: 1.2rem !important;
  }

  .inner-content-who-we-are-right {
    padding: 15px 10px !important;
  }

  .logo-container {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    margin-bottom: 10px !important;
  }

  .testimonial-text {
    font-size: 14px !important;
  }

  .quote-icon {
    font-size: 50px !important;
    margin-top: -30px !important;
  }
  .download-list {                              /*Date 11/09*/
    max-width: 70% !important;
    overflow: hidden !important;
  }
  .cover-item-7 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 20px 25px !important;    /* Date 11/09*/
    margin: 0 !important;
    overflow: hidden !important;
  }

  /* date 11/09 */
  /* Convert partner logos to slider on mobile */
  .partner-logos {
    overflow: hidden !important;
    position: relative !important;
    padding: 20px 0 !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
    max-width: 100% !important;
    margin: 0 auto 30px auto !important;
  }

  .partner-logos .logo-container {
    flex: 0 0 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    min-height: 120px !important;
    height: 80px !important;
    transition: transform 0.3s ease !important;
  }

  .partner-logos .logo-container img {
    max-width: 200px !important;
    max-height: 80px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
  }

  .partner-logos .divider {
    display: none !important;
  }

  /* Add navigation arrows for partner logos slider */
  .partner-logos::before,
  .partner-logos::after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 40px !important;
    height: 40px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 18px !important;
    color: #48c472 !important;
    cursor: pointer !important;
  }

  .partner-logos::before {
    left: 40px !important;
    content: "‹" !important;
  }

  .partner-logos::after {
    right: 40px !important;
    content: "›" !important;
  }
}

/* Very small devices */
@media (max-width: 360px) {
  .hero-content h1 {
    font-size: 1.5em !important;
  }

  .hero-content p {
    font-size: 0.9em !important;
  }

  .container,
  .header-container {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .partner-logos {
    padding: 20px 10px !important;
  }

  .logo-container {
    height: 50px !important;
  }
}

.our-vision-mobile{                    /* Date 11/09*/
  display: block !important;
}
.our-vision-desktop{
  display: none !important;
}
