body {
        margin: 0;
        padding: 0;
        font-size: 1rem;
      }


      .parallax-container {
          min-height: 100vh;
          overflow: hidden;
          position: relative;
          background: transparent;
      }

    
      .parallax-video img {
        object-position: 80% center;
      }
      /* .parallax-container {
        height: 100vh;
        overflow: hidden;
        position: relative;
        background: transparent;
        pointer-events: none;
      }
      .parallax-video {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        z-index: -1;
        pointer-events: none;
        overflow: hidden;
      }
      .parallax-video img {
        width: 100%;
        object-fit: cover;
        position: absolute;
        top: 0;
        left: 0;
        will-change: transform;
      } */
      .main-section,
      .secondary-color,
      .about-us-section,
      .values-section,
      #gallery,
      .how-started-section,
      .quote-section,
      .copyright-section,
      footer {
        position: relative;
        z-index: 1;
        background-color: inherit;
      }
      .main-section,
      .about-us-section,
      #gallery {
        background-color: #fff;
      }
      .secondary-color,
      .how-started-section,
      .concept-vertical,
      .philosophy-vertical,
      .mobile-concept-text,
      .mobile-concept-image,
      .mobile-philosophy-text,
      .mobile-philosophy-image {
        background-color: #efe3d5;
      }
      .values-section {
        background-color: #a5523a;
      }
      .quote-section {
        background-color: transparent;
        z-index: 1;
      }
      footer {
        background-color: #a5523a;
      }
      .copyright-section {
        background-color: #efe3d5;
      }
      .main-section,
      .about-us-section,
      .values-section {
        padding: 160px 40px;
      }
      .concept-text,
      .philosophy-text {
        padding: 140px 90px;
        text-align: center;
        margin: auto;
      }


      .how-started-section {
        padding: 140px 40px;
      }
      .concept-vertical,
      .philosophy-vertical {
        padding: 140px 40px;
      }
      .philosophy-vertical {
        padding-bottom: 0;
      }
      .philosophy-image-container {
        margin-bottom: -100px;
        position: relative;
        z-index: 0;
      }
      .mobile-concept-text,
      .mobile-concept-image,
      .mobile-philosophy-text,
      .mobile-philosophy-image {
        display: none;
      }
      .main-section {
        text-align: center;
      }
      .main-section h1 {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-size: 3.875rem;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: #000;
        margin: 0;
        line-height: 65px;
      }
      .main-section h2 {
        font-family: "Cormorant Infant", serif;
        font-weight: 500;
        font-size: 2.625rem;
        line-height: 35px;
        color: #000;
        margin: 0;
      }
      .separator {
        width: 50px;
        height: 2px;
        background-color: #a5523a;
        margin: 36.8px auto ;
      }
      .main-content {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 1rem;
        line-height: 1.7;
        color: #000000b3;
        max-width: 1170px;
        margin: 0 auto;
        text-align: justify;
        padding: 0 20px;
      }
      .main-content p {
        margin-bottom: 1em;
      }
      .main-content p:last-child {
        margin-bottom: 0;
      }
      .concept-grid,
      .philosophy-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        height: auto;
        align-items: stretch;
        position: relative;
        overflow: hidden;
      }
      .concept-image {
        grid-column: 2 / 3;
      }
      .philosophy-image {
        height: 100%;
        position: relative;
        width: 100%;
        z-index: 1;
      }
      .concept-image img,
      .philosophy-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
      }
      .section-heading {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-size: 3.875rem;
        text-transform: uppercase;
        color: #000;
        margin: 0;
        text-align: center;
        line-height: 52px;
        letter-spacing: 2px;
      }
      .section-text {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 1rem;
        line-height: 1.7;
        color: #000000b3;
        margin: 0 auto;
        text-align: justify;
        width: 100%;
      }
      .section-text p {
        margin-bottom: 1em;
      }
      .section-text p:last-child {
        margin-bottom: 0;
      }
      .concept-vertical,
      .philosophy-vertical {
        display: none;
        text-align: center;
      }
      .concept-vertical h2,
      .philosophy-vertical h2,
      .mobile-concept-text h2,
      .mobile-philosophy-text h2 {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-size: 3.875rem;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: black;
        margin: 0;
        text-align: center;
        line-height: 65px;
      }

       /* rgb to hex converter - https://openreplay.com/tools/rgb-to-hex/ */
      .concept-vertical .section-text,
      .philosophy-vertical .section-text,
      .mobile-concept-text .section-text,
      .mobile-philosophy-text .section-text {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 16px;
        line-height: 1.7;
        color: #000000b3;
        text-align: justify;
        margin: 0 auto;
        max-width: 90%;
      }
      .concept-vertical .section-text p,
      .philosophy-vertical .section-text p,
      .mobile-concept-text .section-text p,
      .mobile-philosophy-text .section-text p {
        margin-bottom: 1em;
      }
      .concept-vertical .section-text p:last-child,
      .philosophy-vertical .section-text p:last-child,
      .mobile-concept-text .section-text p:last-child,
      .mobile-philosophy-text .section-text p:last-child {
        margin-bottom: 0;
      }
      .concept-image-container,
      .philosophy-image-container {
        margin-left: -30px;
        margin-right: -30px;
        width: calc(100% + 60px);
        margin-top: 40px;
      }
      .concept-vertical img,
      .philosophy-vertical img {
        width: 100%;
        height: auto;
        object-fit: cover;
        display: block;
      }
      .mobile-concept-image img,
      .mobile-philosophy-image img {
        width: 100%;
        height: auto;
        object-fit: cover;
        display: block;
      }
      .concept-image img,
      .philosophy-image img {
        aspect-ratio: 2.3;
        width:100%
      }
      .about-us-section {
        text-align: center;
      }
      .about-us-content {
        max-width: 668px;
        margin: 0 auto;
        text-align: justify;
        padding: 0 20px;
      }
      .about-us-content p {
        font-size: 1rem;
        line-height: 1.7;
        margin: 0;
      }
      .about-us-title {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-size: 3.875rem;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: #000;
        margin: 0;
        line-height: 52px;
      }
      .values-section {
        color: white;
        text-align: center;
      }
      .values-title {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-size: 3.875rem;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: white;
        margin: 0;
        line-height: 52px;
      }
      .values-container {
        display: flex;
        justify-items: center;
        justify-content: space-around;
        padding-top: 90px;
      }
      .value-item {
        max-width: 24%;
        text-align: center;
      }
      .value-icon {
        margin-bottom: 20px;
        height: 45px;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .value-icon i {
        font-size: 2.375rem;
        color: white;
        opacity: 0.95;
      }
      .value-title {
        font-family: "Cormorant Infant", serif;
        font-weight: 500;
        font-size:  2rem;
        margin-bottom: 18px;
        margin-top: 18px;
        color: white;
        line-height: 1.2;
      }
      .value-description {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 1rem;
        line-height: 1.65;
        color: #ffffffe6;
        text-align: center;
      }

      .value-description p {
        margin-block-end: unset !important;
        margin-block-start: unset !important;
      }
      .uk-dotnav > * > a {
        width: 13px;
        height: 13px;
        border-radius: 50%;
        color: none;
        background-color: #a5523a;
        display: inline-block;
        opacity: 0.502;
      }
      .values-mobile {
        display: none;
        margin-top: 50px;
      }
      .value-mobile-item {
        margin-bottom: 60px;
        padding: 0 15px;
        text-align: center;
      }
      .value-mobile-item:last-child {
        margin-bottom: 0;
      }
      #gallery {
        padding-top: 0;
        padding-bottom: 0;
        background-color: #fff;
      }
      #gallery .uk-visible\@s .image-container {
        line-height: 0;
        overflow: hidden;
        height: 450px;
      }
      #gallery .uk-visible\@s .image-container img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
      }
      .how-started-section {
        text-align: center;
      }
      .how-started-title {
        font-family: "Cormorant Infant", serif;
        font-weight: 600;
        font-size: 3.875rem;
        letter-spacing: 2px;
        text-transform: uppercase;
        color: #000;
        margin: 0;
        line-height: 52px;
      }
      .how-started-content {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 1rem;
        line-height: 1.7;
        color:  #000000b3;
        max-width: 1177px;
        margin: 0 auto;
        text-align: justify;
        padding: 0 20px;
      }
      .how-started-content p {
        margin-bottom: 1em;
      }
      .how-started-content p:last-child {
        margin-bottom: 0;
      }
      .quote-section {
        position: relative;
        height: 600px;
        overflow: hidden;
        display: flex;
        color: white;
        line-height: 1.2;
      }

      .value-description {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 1rem;
        line-height: 1.65;
        color: #ffffffe6;
        text-align: center;
        margin: 0 auto;
      }

      .uk-dotnav>*>a {
        width: 13px;
        height: 13px;
        border-radius: 50%;
        color: none;
        background-color: #a5523a;
        display: inline-block;
        opacity: 0.502;
    }

      .values-mobile {
        display: none;
        margin-top: 50px;
      }

      .value-mobile-item {
        margin-bottom: 60px;
        padding: 0 15px;
        text-align: center;
      }

      .value-mobile-item:last-child {
        margin-bottom: 0;
      }

      #gallery {
        padding-top: 0;
        padding-bottom: 0;
        background-color: #fff;
      }
      #gallery .uk-visible\@s .image-container {
        line-height: 0;
        overflow: hidden;
        height: auto;
        aspect-ratio: 12 / 8;
      }

      #gallery .uk-visible\@s .image-container img {
        width: 100%;
        height: 100%;
        /* inset: -1px; */
        /* margin-top: -1px; */
        object-fit: cover;
        display: block;
      }

      

      .image-container .overlay-04 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #a5523a;
        opacity: 0.4;
        pointer-events: none;
        transition: opacity 0.3s ease;
      }

      .image-container .overlay-05 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #a5523a;
        opacity: 0.5;
        pointer-events: none;
        /* transition: opacity 0.3s ease; */
      }

      .image-container:hover .overlay-04,
      .image-container:hover .overlay-05 {
        opacity: 0;
      }

      .how-started-section {
        text-align: center;
      }

      .how-started-content {
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 1rem;
        line-height: 1.7;
        color: #000000b3;
        max-width: 1177px;
        margin: 0 auto;
        text-align: justify;
        padding: 0 20px;
      }
      .how-started-content p {
        margin-bottom: 1em;
      }
      .how-started-content p:last-child {
        margin-bottom: 0;
      }

      footer {
        padding: 45px 20px;
      }
      .copyright-section {
        padding: 15px 20px;
        text-align: center;
      }
      .copyright-section p {
        margin: 0;
        font-size: 0.8125rem;
        line-height: 25px;
        color: #a5523a;
        font-weight: 400;
        font-family: "Montserrat", sans-serif;
      }

      .value-icon svg,
      .value-icon i {
        display: inline-block;
        vertical-align: middle;
      }

      .uk-slideshow-items {
        min-height: 300px; 
      }

      .color-overlay {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          background-color: #efe3d5;
          z-index: 2;
          pointer-events: none;
          transition: transform 1s ease-in-out;
      }

      /* Initially full overlay */
      .concept-overlay {
        transform: translateX(0%);
      }
      .philosophy-overlay {
        transform: translateX(0%);
      }

      /* Animation to hide overlay */
      .concept-overlay.slide-out {
        transform: translateX(-100%);
      }
      .philosophy-overlay.slide-out {
        transform: translateX(100%);
      }

      /* Ensure image container is positioned */
      .concept-image,
      .philosophy-image {
        position: relative;
        overflow: hidden;
      }

      @media (max-width: 1400px) {
        .concept-text,
        .philosophy-text {
          padding: 140px 40px;
        }
      }

      /* @media only screen and (max-width: 1089px) {
         .parallax-container {
            height: 50vh !important;
            min-height: 50vh;
        }

      } */

      @media (min-width: 640px) and (max-width: 1029px) {
        .concept-grid,
        .philosophy-grid {
          display: grid;
          grid-template-columns: 1fr;
        }
        .concept-text,
        .philosophy-text {
          order: 1;
        }
        .concept-image,
        .philosophy-image {
          order: 2;
          grid-column: auto;
        }
        .parallax-container {
            height: 40vh;
            min-height: 50vh !important;
            position: relative;
            overflow: hidden;
            background: transparent;
        }
        .parallax-video img {
            width: 100%;
            height: 40vh;
            object-fit: cover;
            position: fixed !important;
            top: 91px;
            left: 0;
            will-change: transform;
        }

         .parallax-video {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 40vh; /* Match container */
            z-index: -1;
            
        }
      }

      @media (min-width: 767px) and (max-width: 959px) {
        .parallax-video img {
          object-position: 30% center;
        }
        .main-section,
        .about-us-section,
        .values-section {
          padding: 140px 30px;
        }
        .concept-vertical,
        .philosophy-vertical {
          display: block;
          padding: 140px 30px; 
        }
        .how-started-section {
          padding: 140px 30px;
        }

        .mobile-concept-text,
        .mobile-concept-image,
        .mobile-philosophy-text,
        .mobile-philosophy-image {
          display: none;
        }

        .philosophy-vertical {
          padding-bottom: 0;
        }
        .philosophy-image-container {
          margin-bottom: -100px;
          margin-left: -30px; 
          margin-right: -30px; 
          width: calc(100% + 60px); 
        }
        .concept-image-container {
          margin-left: -30px; 
          margin-right: -30px;
          width: calc(100% + 60px); 
        }

        .main-content {
          padding: 0 10px;
        }

        .values-container {
          display: none;
        }

        .values-mobile {
          display: block;
          margin-top: 40px;
        }

        .main-section h1,
        .how-started-title,
        .about-us-title,
        #concept-header, 
        #philosophy-header
        {
          font-size: 2.625rem;
        }

        .main-section h2 {
          font-size: 2 rem;
        }

        .values-title {
          font-size: 2.625rem;
        }

        .main-content,
        .about-us-content p,
        .how-started-content {
          font-size: 1rem;
          line-height: 1.7;
          padding: 0 10px;
        }
        .about-us-content {
          padding: 0 10px;
        }
        .how-started-content {
          padding: 0 10px;
        }

        .value-mobile-item {
          margin-bottom: 50px;
        }
        .value-icon i {
          font-size: 2rem;
        }
        .value-title {

          margin-bottom: 15px;
        }
        .value-description {
          font-size: 1rem;
          line-height: 1.6;
        }

        .quote-section {
          height: 450px;
          padding: 30px 20px;
        }

        .concept-vertical h2,
        .philosophy-vertical h2 {
          font-size: 2.25rem;
          margin: 0 0 20px 0;
        }
        .concept-vertical .section-text,
        .philosophy-vertical .section-text {
          font-size: 1rem;
          line-height: 1.7;
          margin: 0 auto 40px auto; 
        }

      }

      /* Mobile */
      @media (max-width: 639px) {

      .philosophy-grid, .concept-grid {
          display: none;
        }

        .parallax-container {
            /* min-height: 50vh !important; */
            /* overflow: hidden; */
            /* position: fixed; */
            /* background: transparent; */
        }
        .parallax-container {
            height: 40vh;
            min-height: 50vh !important;
            position:relative;
            overflow: hidden;
            background: transparent;
        }

        .parallax-video img {
            width: 100%;
            height: 40vh;
            object-fit: cover;
            position: fixed !important;
            top: 91px;
            left: 0;
            will-change: transform;
        }

        .parallax-video img {
          object-position: 40% center !important;
        }

        .parallax-video {
          position: fixed;
          top: 0;
          left: 0;
          width: 100%;
          height: 40vh; 
          z-index: -1;
         
        }

        .main-section,
        .about-us-section,
        .values-section {
          padding: 80px 20px;
        }
        .mobile-concept-text,
        .mobile-philosophy-text {
          display: block;
          padding: 80px 20px;
        }

        .mobile-concept-image,
        .mobile-philosophy-image {
          display: block;
          padding: 0;
          position: relative;
          overflow: hidden;
          aspect-ratio: 1/1;
          width: 100%;
          height: 100%;
        }
        .how-started-section {
          padding: 80px 20px;
        }

        .concept-vertical,
        .philosophy-vertical {
          display: none;
        }


        .mobile-concept-image img,
        .mobile-philosophy-image img {
          width: 100%;
          height: auto;
          object-fit: cover;
          display: block;
          aspect-ratio: 1/1;
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          transition: transform 0.3s ease;
        }


        .mobile-concept-image img:hover,
        .mobile-philosophy-image img:hover {
          transform: translate(-50%, -50%) scale(1.2);
        }


        .main-content {
          padding: 0 5px;
        }

        .main-section h1 {
          font-size: 2.625rem;
          letter-spacing: 1px;
          line-height: 45px;
        }
        
        .how-started-title,
        .about-us-title {
          font-size: 2.625rem;
          letter-spacing: 1px;
          line-height: 40px;
        }

        .main-section h2 {
          font-size: 2.25rem;
          line-height: 36px;
        }

        .values-title {
          font-size: 2.625rem;
          letter-spacing: 1px;
          line-height: 40px;
        }

        .values-mobile {
          display: block;
          margin-top: 40px;
        }
        .values-container {
          display: none;
        }

        .mobile-concept-text h2,
        .mobile-philosophy-text h2 {
          font-size: 2.625rem;
          margin: 0;
          letter-spacing: 1px;
          line-height: 40px;
        }

        .mobile-concept-text .section-text,
        .mobile-philosophy-text .section-text {
          font-size: 1rem;
          line-height: 1.6;
          margin: 0 auto;
          max-width: 95%;
          text-align: justify;
        }

        .main-content,
        .about-us-content p,
        .how-started-content {
          font-size: 1rem;
          line-height: 1.6;
          padding: 0 5px;
        }
        .about-us-content {
          padding: 0 5px;
        }
        .how-started-content {
          padding: 0 5px;
        }

        .quote-section {
          height: 400px;
          padding: 20px 15px;
        }

        .uk-slideshow-items {
          min-height: 350px; 
        }
      }