* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }
  
  #navbar {
    height: 10%;
    width: 100%;
    padding: 0% 17% 0% 0%;
  }
  
  .logo {
    height: 8vh;
    width: 14vw;
    Top: 30px;
    left: 80px;
    display: block;
  }
  
  @import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Zain:ital,wght@0,200;0,300;0,400;0,700;0,800;0,900;1,300;1,400&display=swap");
  
  .zain-extralight {
    font-family: "Zain", sans-serif !important;
    font-weight: 200 !important;
    font-style: normal !important;
  }
  
  .zain-light {
    font-family: "Zain", sans-serif !important;
    font-weight: 300 !important;
    font-style: normal !important;
  }
  
  .zain-regular {
    font-family: "Zain", sans-serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
  }
  
  .zain-bold {
    font-family: "Zain", sans-serif !important;
    font-weight: 700 !important;
    font-style: normal !important;
  }
  
  .zain-extrabold {
    font-family: "Zain", sans-serif !important;
    font-weight: 800 !important;
    font-style: normal !important;
  }
  
  .zain-black {
    font-family: "Zain", sans-serif !important;
    font-weight: 900 !important;
    font-style: normal !important;
  }
  
  .zain-light-italic {
    font-family: "Zain", sans-serif !important;
    font-weight: 300 !important;
    font-style: italic !important;
  }
  
  .zain-regular-italic {
    font-family: "Zain", sans-serif !important;
    font-weight: 400 !important;
    font-style: italic !important;
  }
  
  .dm-serif-display-regular {
    font-family: "DM Serif Display", serif !important;
    font-weight: 400 !important;
    font-style: normal !important;
  }
  
  .dm-serif-display-regular-italic {
    font-family: "DM Serif Display", serif !important;
    font-weight: 400 !important;
    font-style: italic !important;
  }
  
  /* ESSENTIALS ABOVE---------------------------------------------------------------------- */
  
  /* SECTION 1 */
  /* Section Styles */
  .section1-hero {
    position: relative;
    width: 100%;
    min-height: 100vh;
    font-family: "Lato", sans-serif;
    color: #333333;
    overflow-x: hidden;
    margin-top: 74px;
  }
  
  .section1-background-image-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("img/updated/section1-bg.png");
    /* background-image: url("https://images.pexels.com/photos/4056535/pexels-photo-4056535.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1"); */
    background-size: cover;
    background-position: center center;
    z-index: -2;
  }
  
  .section1-background-image-container::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.45);
    z-index: -1;
  }
  
  .section1-content-wrapper {
    position: relative;
    z-index: 1;
    width: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 20px 0;
  }
  
  .section1-text-overlay {
    padding: 40px 20px 30px 20px;
    text-align: center;
    color: #ffffff;
  }
  
  .section1-main-heading {
    font-family: "Playfair Display", serif;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 15px;
  }
  
  .section1-sub-heading {
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.6;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }
  
  /* Form Container Wrapper - Mobile (this is the element that gets the margins) */
  .section1-form-container-wrapper {
    scale: 0.9;
    background-color: #ffffff;
    padding: 25px;
    border-radius: 16px;
    width: calc(100% - 30px);
    max-width: 480px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    margin: -10px 15px 20px 15px;
    align-self: center;
  }
  
  /* Form Styles (inside the wrapper) */
  .section1-form-main {
    display: flex;
    flex-direction: column;
    gap: 9px;
  }
  
  .section1-form-title {
    font-size: 1.4rem;
    font-weight: 700;
    color: #2c2c2c;
    text-align: center;
    margin-bottom: 10px;
  }
  
  .section1-form-group {
    display: flex;
    flex-direction: column;
  }
  
  .section1-form-label {
    font-size: 0.85rem;
    font-weight: 600;
    color: #4a4a4a;
    margin-bottom: 6px;
  }
  
  .section1-form-input,
  .section1-form-select {
    width: 100%;
    padding: 11px 14px;
    font-size: 0.95rem;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background-color: #f4f4f4;
    color: #333333;
    line-height: 1.5;
  }
  
  .section1-form-input::placeholder {
    color: #888888;
  }
  
  .section1-form-input:focus,
  .section1-form-select:focus {
    outline: none;
    border-color: #a34a62;
    box-shadow: 0 0 0 1.5px rgba(163, 74, 98, 0.25);
  }
  
  .section1-form-phone-input-group {
    display: flex;
    align-items: center;
  }
  
  .section1-form-country-code {
    padding: 12.5px 10px;
    font-size: 0.95rem;
    border: 1px solid #e0e0e0;
    border-right: none;
    border-radius: 8px 0 0 8px;
    background-color: #f4f4f4;
    color: #333333;
    height: auto;
    line-height: 1.5;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.6rem center;
    background-size: 0.8em;
    padding-right: 1.8rem;
    min-width: 70px;
  }
  
  .section1-form-phone-number {
    flex-grow: 1;
    border-radius: 0 8px 8px 0;
  }
  
  .section1-form-mode-options button {
    width: 100px;
    border-radius: 99px;
  }
  
  .section1-form-mode-btn {
    flex-grow: 1;
    padding: 10px 15px;
    font-size: 0.9rem;
    font-weight: 600;
    border: 1px solid #dcdcdc;
    border-radius: 20px;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease,
      border-color 0.2s ease;
    background-color: #f0f0f0;
    color: #4a4a4a;
  }
  
  .section1-form-mode-btn.section1-active {
    background-color: #3d3d3d;
    color: #ffffff;
    border-color: #3d3d3d;
  }
  
  .section1-form-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.8rem center;
    background-size: 0.9em;
    padding-right: 2.5rem;
  }
  
  .section1-form-submit-btn {
    width: 100%;
    padding: 12px 20px;
    font-size: 1rem;
    font-weight: 700;
    color: #ffffff;
    background-color: #a34a62;
    border: none;
    border-radius: 20px;
    cursor: pointer;
    transition: background-color 0.2s ease;
  }
  
  .section1-form-submit-btn:hover {
    background-color: #8a3f54;
  }
  
  /* Desktop Styles - min-width: 992px */
  @media (min-width: 992px) {
    .section1-hero {
      display: flex;
      align-items: center;
    }
  
    .section1-content-wrapper {
      flex-direction: row;
      align-items: center;
      justify-content: center;
      width: 100%;
      max-width: 1280px;
      margin: 0 auto;
      padding: 40px 9px;
      gap: 5%;
    }
  
    .section1-text-overlay {
      flex: 1 1 55%;
      max-width: 650px;
      text-align: left;
      padding: 20px;
      margin-right: 20px;
      margin-top: -136px;
      scale: 1.43;
    }
  
    .section1-main-heading {
      font-family: "Georgia", "Times New Roman", serif; /* Adjust to match serif in image */
      font-size: 4.2rem; /* More in line with the image */
      font-weight: 700;
      line-height: 1.1;
      margin-bottom: 12px; /* Changed from -4px */
      color: #fff; /* Or #f9f9f9 depending on overlay */
    }
  
    .section1-sub-heading {
      font-family: "Arial", sans-serif; /* Clear sans-serif */
      font-size: 1.1rem;
      font-weight: 400;
      line-height: 1.6;
      color: #f0f0f0; /* Light gray for contrast */
      max-width: 480px;
      margin-top: 8px;
    }
  
    /* Form Container Wrapper - Desktop */
    .section1-form-container-wrapper {
      flex: 0 0 auto;
      width: 100%;
      max-width: 505px;
      padding: 35px;
      border-radius: 24px;
      box-shadow: 0 15px 40px rgba(0, 0, 0, 0.18);
      margin: 0; /* Reset mobile margins */
      align-self: center;
    }
  
    .section1-form-title {
      font-size: 32px;
      text-align: center;
      margin-bottom: 20px;
    }
  
    .section1-form-group {
      /* No change needed from mobile if gap in form-main is sufficient */
    }
  
    .section1-form-label {
      font-size: 1.4rem;
      margin-bottom: 0px;
    }
  
    .section1-form-input,
    .section1-form-select {
      padding: 12px 15px;
      font-size: 1rem;
    }
  
    .section1-form-select {
      font-size: 1.3rem;
    }
    .section1-form-mode-btn {
      font-size: 0.95rem;
      padding: 11px 15px;
    }
    .section1-form-submit-btn {
      font-size: 1.05rem;
      padding: 13px 20px;
    }
  }
  
  @media (min-width: 1200px) {
    .section1-main-heading {
      font-size: 5.8rem;
    }
    .section1-form-container-wrapper {
      /* Apply to the wrapper */
      max-width: 487px;
      margin-left: 16rem;
    }
    .section1-content-wrapper {
      gap: 0%;
    }
  
    .section1-main-heading {
      font-family: "Georgia", "Times New Roman", serif; /* Adjust to match serif in image */
      font-size: 52px;
      font-weight: 700;
      line-height: 1.1;
      margin-bottom: 12px; /* Changed from -4px */
      color: #fff; /* Or #f9f9f9 depending on overlay */
    }
  
    .section1-sub-heading {
      font-family: "Arial", sans-serif;
      font-size: 18px;
      font-weight: 400;
      line-height: .1;
      color: #f0f0f0;
      max-width: 480px;
      margin-top: 8px;
    }
  }
  
  /* SECTION 2 CSS */
  /* CSS for the section */
  .section2-container {
    display: flex;
    width: 100%;
    padding-top: 40px;
    box-sizing: border-box;
    font-family: Arial, sans-serif; /* Default sans-serif font */
    background-color: #ffffff; /* Assuming white background */
    align-items: center;
  }
  
  .section2-image-col {
    flex: 0 0 40%; /* Image column takes 40% of space on desktop */
    box-sizing: border-box;
    /* padding-right: 20px; /* Optional desktop space */
  }
  
  .section2-image-col img {
    max-width: 100%;
    height: auto;
    display: block;
  }
  
  .section2-content-col {
    flex: 1; /* Content column takes remaining space on desktop */
    padding-left: 40px; /* Space between image and text on desktop */
    box-sizing: border-box;
  }
  
  .section2-subheading {
    font-size: 16px;
    color: #6c757d; /* Grayish color */
    margin-bottom: 10px;
    font-weight: normal;
  }
  
  .section2-main-heading {
    font-family: "Georgia", serif;
    font-size: 38px;
    color: #a13d51; /* Maroon color */
    margin-top: 0;
    margin-bottom: 25px;
    font-weight: bold;
    line-height: 1.3;
  }
  
  .section2-intro-paragraph {
    font-size: 24px;
    color: #333333;
    line-height: 1.6;
    margin-top: 0;
    margin-bottom: 35px;
  }
  
  .section2-services-grid {
    display: grid;
    grid-template-columns: repeat(
      2,
      1fr
    ); /* Two columns for services on desktop */
    gap: 25px 30px; /* Row gap and column gap */
  }
  
  .section2-service-item {
    display: flex;
    align-items: flex-start;
  }
  
  .section2-service-number {
    font-size: 30px;
    color: #a13d51;
    font-weight: bold;
    margin-right: 12px;
    line-height: 1;
    min-width: 40px;
  }
  
  .section2-service-details {
    display: flex;
    flex-direction: column;
  }
  
  .section2-service-title {
    font-size: 30px;
    color: #212529;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 6px;
    line-height: 1.2;
  }
  
  .section2-service-description {
    font-size: 20px;
    color: #555555;
    line-height: 1.4;
    margin: 0;
  }
  
  /* Responsive adjustments */
  @media (max-width: 992px) {
    /* Tablet adjustments */
    .section2-image-col {
      flex: 0 0 45%;
    }
    .section2-content-col {
      padding-left: 30px;
    }
    .section2-main-heading {
      font-size: 32px;
    }
    .section2-service-number {
      font-size: 26px;
    }
    .section2-service-title {
      font-size: 17px;
    }
  }
  
  @media (max-width: 768px) {
    /* Mobile adjustments for the new layout */
    .section2-container {
      flex-direction: column; /* Stack elements vertically */
      padding: 40px 20px; /* Vertical and horizontal padding for mobile */
      align-items: stretch; /* Allow children to take full width */
    }
  
    .section2-content-col {
      order: 1; /* Display text content first */
      padding-left: 0;
      text-align: left; /* All text content left-aligned */
      width: 100%;
      margin-bottom: 30px; /* Space between text content and image */
    }
  
    .section2-image-col {
      order: 2; /* Display image second */
      flex-basis: auto;
      width: 100%; /* Image takes full available width */
      max-width: none; /* Remove any desktop max-width restriction */
      margin: 0; /* Reset margins */
      padding-right: 0;
    }
  
    .section2-image-col img {
      width: 100%; /* Make image responsive within its container */
      height: auto;
      display: block;
    }
  
    .section2-services-grid {
      grid-template-columns: 1fr; /* Single column for services */
      gap: 25px; /* Gap between service items in the single column */
      max-width: none;
      margin-left: 0;
      margin-right: 0;
    }
  
    .section2-service-item {
      text-align: left;
      padding-left: 0; /* Remove specific padding if container handles it */
      padding-right: 0;
    }
  
    /* Mobile font size adjustments (can be fine-tuned) */
    .section2-main-heading {
      font-size: 30px; /* Slightly adjusted for mobile */
    }
    .section2-intro-paragraph {
      font-size: 15px;
    }
    .section2-service-number {
      font-size: 28px; /* Made numbers a bit more prominent for mobile */
    }
    .section2-service-title {
      font-size: 17px;
    }
    .section2-service-description {
      font-size: 14px;
    }
  }
  
  @media (max-width: 480px) {
    /* Further adjustments for very small screens */
    .section2-container {
      padding: 30px 15px 0px; /* Slightly less padding for very small screens */
    }
    .section2-main-heading {
      font-size: 26px;
    }
    .section2-service-number {
      font-size: 24px;
    }
    .section2-service-title {
      font-size: 16px;
    }
    .section2-service-description {
      font-size: 13px;
    }
  }
  
  /* END OF SECTION 2 CSS */
  /* Basic Reset */
  *,
  *::before,
  *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  }
  
  /* Section Styling */
  #about {
    background-color: #2c2c2c;
    color: #e0e0e0;
    padding: 4rem 0;
    font-family: "Roboto", sans-serif;
    line-height: 1.6;
  }
  
  .section3-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    gap: 3rem;
  }
  
  /* Left Column: Text Content */
  .section3-text-content {
    flex: 1;
    display: flex;
    flex-direction: column;
  }
  
  .section3-breadcrumb {
    font-size: 0.9rem;
    color: #b0b0b0; /* Direct value for --section3-subtle-text-color */
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
  }
  
  .section3-main-heading {
    font-family: "Lora", serif; /* Direct value for --section3-font-primary */
    font-size: clamp(2.2rem, 5vw, 3rem);
    color: #ffffff; /* Direct value for --section3-heading-color */
    margin-bottom: 1.5rem;
    line-height: 1.2;
    font-weight: 700;
  }
  
  .section3-description,
  .section3-details {
    font-size: 1rem;
    margin-bottom: 1rem;
    color: #e0e0e0; /* Direct value for --section3-text-color */
  }
  
  .section3-details {
    margin-bottom: 1.5rem;
    font-weight: 300 !important;
  }
  
  .section3-founded-by {
    font-size: 0.85rem;
    color: #b0b0b0; /* Direct value for --section3-subtle-text-color */
    font-style: italic !important;
    margin-bottom: 2.5rem;
  }
  
  /* Stats Grid */
  .section3-stats-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    margin-top: auto;
  }
  
  .section3-stat-item {
    padding: 1.5rem 0;
    display: flex;
    flex-direction: column;
  }
  
  .section3-stat-item:nth-child(odd) {
    padding-right: 1rem;
    border-right: 1px solid rgba(255, 255, 255, 0.15); /* Direct value for --section3-divider-color */
  }
  .section3-stat-item:nth-child(even) {
    padding-left: 1rem;
  }
  
  .section3-stat-item:nth-child(1),
  .section3-stat-item:nth-child(2) {
    padding-bottom: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15); /* Direct value for --section3-divider-color */
  }
  .section3-stat-item:nth-child(3),
  .section3-stat-item:nth-child(4) {
    padding-top: 1.5rem;
  }
  
  .section3-stat-number {
    font-size: 43px;
    font-weight: 700;
    color: #ffffff; /* Direct value for --section3-heading-color */
    line-height: 1;
    font-family: "Lora", serif; /* Direct value for --section3-font-primary */
    text-align: center;
  }
  
  .section3-stat-label {
    font-size: 22px;
    color: #E0BABA;
    margin-top: 0.5rem;
    text-align: center;
  }
  
  /* Right Column: Image Gallery */
  .section3-image-gallery {
    flex: 1.2;
    display: flex;
    flex-direction: column;
    gap: 1rem; /* Direct value for --section3-image-gap */
  }
  
  .section3-main-image-grid {
    display: grid;
    grid-template-columns: 1fr 0.9fr;
    grid-template-rows: 1fr 1fr;
    gap: 1rem; /* Direct value for --section3-image-gap */
    flex-grow: 1;
  }
  
  .section3-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px; /* Direct value for --section3-border-radius */
    display: block;
  }
  
  .section3-img-top-left {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    aspect-ratio: 3/2;
  }
  
  .section3-img-bottom-left {
    grid-column: 1 / 2;
    grid-row: 2 / 3;
    aspect-ratio: 3/2;
  }
  
  .section3-img-right-tall {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
  }
  
  .section3-img-bottom-wide {
    width: 100%;
    aspect-ratio: 1116 / 400;
  }
  
  /* Responsive Adjustments */
  @media (max-width: 992px) {
    /* Tablet and below */
    .section3-container {
      flex-direction: column;
      gap: 2.5rem;
    }
  
    .section3-text-content,
    .section3-image-gallery {
      flex-basis: auto;
      width: 100%;
    }
  
    .section3-main-heading {
      font-size: clamp(2rem, 6vw, 2.5rem);
    }
  
    .section3-stats-grid {
      margin-top: 2rem;
    }
  }
  
  @media (max-width: 768px) {
    /* Mobile */
    #about {
      padding: 3rem 0;
    }
    .section3-container {
      padding: 0 1rem;
    }
  
    .section3-breadcrumb,
    .section3-main-heading,
    .section3-description,
    .section3-details,
    .section3-founded-by {
      text-align: left;
    }
  
    .section3-stat-item {
      text-align: left;
      padding: 1rem 0.5rem;
    }
    .section3-stat-item:nth-child(even) {
      padding-left: 0.5rem;
    }
    .section3-stat-item:nth-child(odd) {
      padding-right: 0.5rem;
    }
  
    /* === MODIFIED SECTION START === */
    .section3-main-image-grid {
      /* Re-establish two-column layout for mobile */
      grid-template-columns: 1fr 0.9fr; /* Left column slightly wider, similar to desktop */
      grid-template-rows: auto auto;    /* Allow rows to size based on content */
      /* gap: 1rem; is inherited from desktop and is appropriate */
    }
  
    .section3-img-top-left {
      grid-column: 1 / 2;    /* First column */
      grid-row: 1 / 2;       /* First row */
      aspect-ratio: 4/3;     /* Adjusted for a slightly less wide look, matching target image */
      /* border-radius: 58px 0 0 58px; Top-left and bottom-left corners rounded */
    }
  
    .section3-img-right-tall { /* This is sec3_massage.png */
      grid-column: 2 / 3;    /* Second column */
      grid-row: 1 / 3;       /* Span both rows */
      aspect-ratio: unset;   /* Allow height to be determined by spanned rows */
      /* Note: The inline style for sec3_massage.png (border-radius: 0px 58px 0px 0px;) will apply for top-right.
         To match target image (top-right and bottom-right 58px), this CSS rule will achieve it. */
      border-radius: 0 20px 0px 0 !important;
    }
  
    .section3-img-bottom-left { /* This is sec3_consultation.png */
      grid-column: 1 / 2;    /* First column */
      grid-row: 2 / 3;       /* Second row */
      aspect-ratio: 4/3;     /* Match aspect ratio of top-left image */
      /* Note: The inline style for sec3_consultation.png (border-radius: 0px 58px 0px 0px;)
         needs to be overridden to match target image (top-left and bottom-left 58px). */
      border-radius: 0px 21px 0px 0px !important;
    }
  
    .section3-img-bottom-wide {
      aspect-ratio: 1116 / 400;
      border-radius: 20px 0px 0px 0px !important;
    }
    /* === MODIFIED SECTION END === */
  }
  
  @media (max-width: 480px) {
    .section3-main-heading {
      font-size: 1.8rem;
    }
    .section3-description,
    .section3-details {
      font-size: 0.95rem;
    }
    .section3-stat-number {
      font-size: 2rem;
    }
    .section3-stat-label {
      font-size: 0.8rem;
    }
    /* You might want to adjust image gallery gap or column proportions for very small screens if needed */
    /* .section3-main-image-grid {
      gap: 0.5rem;
      grid-template-columns: 1fr 0.8fr; /* Example adjustment for smaller screens */
    /* } */
  }
  /* General Section Setup SECTION4*/
  /* General Section Setup */
  .section4 {
    width: 100%;
    background-color: #fcfafb;
    padding: 60px 0;
    font-family: Arial, sans-serif;
    box-sizing: border-box;
    overflow-x: hidden;
  }
  
  .section4-content-wrapper {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
  }
  
  /* Typography */
  .section4-eyebrow {
    font-size: 16px;
    color: #333333;
    margin-bottom: 8px;
    font-weight: normal;
  }
  
  .section4-main-heading {
    font-size: 36px;
    color: #a03e5a;
    font-family: "Times New Roman", Times, serif;
    margin-bottom: 16px;
  }
  
  .section4-subtext {
    font-size: 16px;
    color: #666666;
    line-height: 1.6;
    max-width: 700px;
    margin: 0 auto 40px auto;
  }
  
  /* Carousel Container */
  .section4-carousel-container {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-bottom: 30px;
  }
  
  /* Carousel Navigation Arrows */
  .section4-carousel-nav {
    background-color: #efefef;
    border: none;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transition: background-color 0.3s ease;
    flex-shrink: 0;
  }
  
  .section4-carousel-nav:hover {
    background-color: #e0e0e0;
  }
  
  .section4-carousel-nav svg {
    width: 8px;
    height: 14px;
  }
  .section4-carousel-nav svg path {
    stroke: #757575;
  }
  
  .section4-prev-btn {
    margin-right: 20px;
  }
  
  .section4-next-btn {
    margin-left: 20px;
  }
  
  /* Carousel viewport */
  .section4-carousel {
    width: 100%;
    max-width: 750px;
    overflow: hidden;
    position: relative;
  }
  
  /* Carousel track that holds all slides */
  .section4-carousel-track {
    display: flex;
    align-items: center;
    transition: transform 0.5s ease-in-out;
  }
  
  /* Individual slide Styling */
  .section4-slide {
    flex: 0 0 auto;
    margin: 0px -26px;
    transition: transform 0.4s ease, opacity 0.4s ease;
    transform: scale(0.85);
    opacity: 0.7;
    transform-origin: center center;
    background-color: transparent;
    box-shadow: none;
    border-radius: 0;
    overflow: visible; /* Allow peeking of scaled items if needed, but content inside is clipped */
  }
  
  .section4-slide-active {
    transform: scale(1);
    opacity: 1;
    z-index: 5;
  }
  
  /* Wrapper for stacked cards and main content */
  .section4-slide-outer-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    overflow: visible; /* Allows stacked cards to peek if transforms make them go outside */
  }
  
  /* Wrapper for the actual image content, sits on top of stacked cards */
  .section4-slide-content-wrapper {
    position: relative;
    z-index: 2;
    background-color: #fff;
    border-radius: 20px;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Clip images */
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
  }
  .section4-slide-active .section4-slide-content-wrapper {
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
  }
  
  /* Stacked cards (behind the main content) - HIDDEN BY DEFAULT ON DESKTOP */
  .section4-stacked-card {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 20px;
    z-index: 1;
    top: 0;
    left: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
    opacity: 0; /* Hidden by default */
    transform: scale(0); /* Also ensure they don't affect layout when hidden */
  }
  
  .section4-stacked-card-bg1 {
    background-color: #f5a66f;
  }
  .section4-stacked-card-bg2 {
    background-color: #67c5b7;
  }
  .section4-stacked-card-bg3 {
    background-color: #ace2e1;
  }
  
  /* Content within a slide - NOW ALWAYS SINGLE IMAGE */
  .section4-slide-content {
    position: relative;
    width: 302px; /* Default width for a single image slide content */
    height: 330px; /* Default height */
  }
  
  /* Paired image styles are no longer needed */
  /* .section4-slide-content-pair ... */
  /* .section4-image-half ... */
  
  .section4-testimonial-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  
  .section4-weight-tag {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #7c67d5;
    color: white;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 14px;
    font-weight: bold;
    white-space: nowrap;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  }
  
  /* Pagination Dots */
  .section4-pagination-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
  }
  
  .section4-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #d8d8d8;
    margin: 0 5px;
    cursor: pointer;
    transition: background-color 0.3s ease, width 0.3s ease, height 0.3s ease;
  }
  
  .section4-dot-active {
    background-color: #a03e5a;
    width: 12px;
    height: 12px;
  }
  
  /* Responsive adjustments */
  @media (max-width: 900px) {
    .section4-carousel {
      max-width: calc(100vw - 100px);
    }
  }
  
  @media (max-width: 768px) {
    .section4-main-heading {
      font-size: 30px;
    }
    .section4-subtext {
      font-size: 15px;
    }
    .section4-carousel {
      max-width: calc(100vw - 60px);
    }
  
    /* MOBILE: Show stacked cards ONLY for the active slide */
    .section4-slide-active .section4-stacked-card {
      opacity: 1; /* Make them visible */
      /* Apply transforms only on mobile for the active slide */
    }
    .section4-slide-active .section4-stacked-card-bg1 {
      transform: rotate(-5deg) translate(-6px, 6px) scale(1.02);
    }
    .section4-slide-active .section4-stacked-card-bg2 {
      transform: rotate(4deg) translate(4px, 9px) scale(1.03);
    }
    .section4-slide-active .section4-stacked-card-bg3 {
      transform: rotate(-2deg) translate(7px, 13px) scale(1.01);
    }
  
    /* Removed mobile stacking for paired images as they no longer exist */
  }
  
  @media (max-width: 480px) {
    .section4-main-heading {
      font-size: 26px;
    }
    .section4-prev-btn {
      margin-right: 5px;
    }
    .section4-next-btn {
      margin-left: 5px;
    }
    .section4-carousel-nav {
      width: 30px;
      height: 30px;
    }
    .section4-carousel-nav svg {
      width: 6px;
      height: 10px;
    }
    .section4-slide {
      transform: scale(0.8);
      margin: 0 5px;
    }
    .section4-slide-active {
      transform: scale(0.95); /* Can adjust active scale on mobile */
    }
    .section4-slide-content {
      /* Adjust single image content size for small mobile */
      width: 240px;
      height: 270px;
    }
    .section4-carousel {
      max-width: calc(100vw - 40px);
    }
  }
  
  /* General settings for the section - No body styles */
  .section5-how-it-works-section {
    background-color: #f9f5f2;
    padding: 60px 20px;
    width: 100%;
    box-sizing: border-box;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #333333;
  }
  
  .section5-content-container {
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
  }
  
  .section5-eyebrow-text {
    font-size: 19px;
    font-weight: 600;
    color: #555555;
    margin-bottom: 15px;
  }
  
  .section5-main-title {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 30px;
    color: #333333;
    margin-bottom: 20px;
    line-height: 1.3;
  }
  
  .section5-description-text {
    font-size: 21px;
    color: #555555;
    max-width: 700px;
    margin: 0 auto 50px auto;
    line-height: 1.6;
  }
  
  .section5-step-card:nth-child(even) {
    top: 36px !important;
  }
  .section5-steps-grid {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
  }
  
  .section5-step-card {
    background-color: #ffffff;
    border-radius: 16px;
    padding: 30px;
    width: 260px; /* Default width for desktop */
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.07);
    text-align: left;
    position: relative;
    min-height: 280px; /* For desktop visual consistency */
    display: flex;
    flex-direction: column;
  }
  
  .section5-icon-placeholder {
    margin-bottom: 20px;
    height: 40px;
  }
  
  .section5-card-icon {
    width: 40px;
    height: 40px;
    /* For SVG icons, uncomment and set fill: #8C525C; */
  }
  
  .section5-card-heading {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 2em;
    color: #8c525c; /* Maroon */
    margin-bottom: 15px;
  }
  
  .section5-card-subtext {
    font-size: 16px;
    color: #555555;
    line-height: 1.2;
    flex-grow: 1;
  }
  
  /* Faint step number for DESKTOP */
  .section5-faint-step-number {
    position: absolute;
    bottom: 20px;
    right: 25px;
    font-size: 30px;
    font-weight: bold;
    color: #eeeeee;
    line-height: 1;
    display: block; /* Visible on desktop */
  }
  
  /* Maroon number bubble for MOBILE */
  .section5-step-number-bubble {
    width: 30px;
    height: 30px;
    background-color: #8c525c; /* Maroon */
    color: white;
    border-radius: 50%;
    display: none; /* Hidden on desktop, shown on mobile */
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 0.9em;
    position: absolute;
    z-index: 2;
    /* Mobile positioning will be handled in @media query */
  }
  
  /* Responsive visibility classes for section5 */
  .section5-desktop-only {
    /* display: block; */
  }
  
  .section5-mobile-only {
    display: none;
  }
  
  .section5-mobile-svg {
    text-align: center;
    margin-top: 30px;
  }
  
  .section5-steps-svg {
    max-width: 100%;
    height: auto;
    scale: 1.17;
    margin: 26px 0 61px -12px;
  }
  
  /* --- MOBILE STYLES (as per the second image) --- */
  @media (max-width: 768px) {
    /* Show mobile version, hide desktop version */
    .section5-desktop-only {
      display: none !important;
    }
    
    .section5-mobile-only {
      display: block;
    }
  
    .section5-how-it-works-section {
      padding: 40px 10px; /* Reduced padding for mobile */
    }
  
    .section5-content-container {
      padding-left: 20px; /* Overall container padding for mobile */
      padding-right: 20px;
    }
  
    .section5-main-title {
      font-size: 1.8em; /* Smaller title for mobile */
      margin-bottom: 15px;
    }
  
    .section5-description-text {
      font-size: 0.9em;
      max-width: 100%;
      margin-bottom: 40px;
    }
  
    .section5-steps-grid {
      display: flex; /* Using flex for easier alignment */
      flex-direction: column;
      gap: 0; /* Remove desktop gap, handled by card margin */
      align-items: center; /* Center cards if not full width */
    }
  
    .section5-step-card {
      width: 85%; /* Cards take up most of the width */
      max-width: 350px; /* Max card width on mobile */
      min-height: auto; /* Let content define height */
      margin-bottom: 60px; /* Space between cards for numbers and lines */
      padding: 25px;
      padding-top: 20px;
      box-shadow: 0 3px 15px rgba(0, 0, 0, 0.05);
    }
    .section5-step-card:last-child {
      margin-bottom: 0;
    }
  
    .section5-faint-step-number {
      display: none !important; /* Hide faint numbers on mobile */
    }
  
    .section5-step-number-bubble {
      display: flex; /* Show maroon bubbles on mobile */
      top: 25px; /* Vertical position of the bubble relative to card top */
    }
  
    .section5-content-container {
      text-align: left;
    }
  
    /* Alternating card alignment and bubble position */
    .section5-step-card:nth-child(odd) {
      align-self: flex-end; /* Card pushed to the right */
      margin-right: 0; 
    }
    .section5-step-card:nth-child(odd) .section5-step-number-bubble {
      left: -45px; /* Bubble to the left of the card */
    }
  
    .section5-step-card:nth-child(even) {
      align-self: flex-start; /* Card pushed to the left */
      margin-left: 0;
    }
    .section5-step-card:nth-child(even) .section5-step-number-bubble {
      right: -45px; /* Bubble to the right of the card */
    }
  
    /* Connector Lines (L-shape approximation) */
    .section5-step-card:not(:last-child)::after {
      content: "";
      position: absolute;
      z-index: 0; /* Behind card content, above section background */
      border-color: #d3bdb0; /* Light brownish-pink line color */
      border-style: solid;
      border-width: 0; /* Base reset */
      /* Dimensions define the L-shape */
      width: 50px; /* Horizontal extent of the L's bottom leg */
      height: 90px; /* Vertical extent of the L's side leg */
    }
  
    /* Odd items (1, 3): bubble on left. Line drops down, then L-curves to the RIGHT. */
    .section5-step-card:nth-child(odd):not(:last-child)::after {
      top: calc(
        25px + 15px
      ); /* Bubble's vertical center (bubble.top + bubble.height/2) */
      left: calc(
        -45px + 15px - 1px
      ); /* Bubble's horizontal center (bubble.left + bubble.width/2 - line_thickness/2) */
      border-left-width: 2px; /* Vertical leg of the L */
      border-bottom-width: 2px; /* Horizontal leg of the L */
      border-bottom-left-radius: 25px; /* Curves the corner between left and bottom border */
    }
  
    /* Even items (2): bubble on right. Line drops down, then L-curves to the LEFT. */
    .section5-step-card:nth-child(even):not(:last-child)::after {
      top: calc(25px + 15px);
      right: calc(
        -45px + 15px - 1px
      ); /* Bubble's horizontal center for the right border */
      border-right-width: 2px; /* Vertical leg of the L */
      border-bottom-width: 2px; /* Horizontal leg of the L */
      border-bottom-right-radius: 25px; /* Curves the corner between right and bottom border */
    }
  }
  
  @media (max-width: 480px) {
    .section5-main-title {
      font-size: 1.6em;
    }
    .section5-card-heading {
      font-size: 50px;
    }
    .section5-step-card {
      width: 90%; /* Cards take up more width on very small screens */
      padding: 20px;
    }
    .section5-step-card:nth-child(odd) .section5-step-number-bubble {
      left: -40px;
    }
    .section5-step-card:nth-child(even) .section5-step-number-bubble {
      right: -40px;
    }
  
    .section5-step-card:nth-child(odd) {
      margin-bottom: 0px !important;
    }
    
    .section5-step-card:last-child {
      margin-bottom: 50px !important;
    }
  
    /* Adjust line positioning if bubble position changed */
    .section5-step-card:nth-child(odd):not(:last-child)::after {
      left: calc(-40px + 15px - 1px);
    }
    .section5-step-card:nth-child(even):not(:last-child)::after {
      right: calc(-40px + 15px - 1px);
    }
  }
  
  /* SECTION 6 */
  /* Ensure to include any font imports if using custom web fonts, e.g., @import url('https://fonts.googleapis.com/css2?family=Georgia&family=Helvetica+Neue&display=swap'); */
  
  #section6-team-container,
  .section6-team-container-main {
    background-color: #ffffff; /* Section background color */
    padding: 80px 0 100px 0; /* More vertical padding */
    width: 100%; /* Full width */
    box-sizing: border-box;
  }
  
  .section6-main-content {
    /* max-width: 1200px; Max width of the content area */
    margin: 0 auto; /* Center the content */
    padding: 0 20px; /* Horizontal padding for smaller screens */
    box-sizing: border-box;
    text-align: center; /* Center the title and button */
  }
  
  .section6-title {
    font-family: Georgia, "Times New Roman", Times, serif; /* Serif font for the title */
    font-size: 34px; /* Title font size */
    color: #3a3a3a; /* Dark greyish color for title */
    margin-bottom: 25px;
    font-weight: 600; /* Semi-bold weight */
  }

  .section6-team-tabs {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
  }

  .section6-tab-btn {
    background-color: #f5f5f5;
    border: 2px solid #e0e0e0;
    border-radius: 25px;
    padding: 6px 17px;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    transition: all 0.3s ease;
    min-width: 120px;
  }

  .section6-tab-btn:hover {
    background-color: #e8dfe0;
    border-color: #a94e5d;
    color: #5a5a5a;
  }

  .section6-tab-btn.section6-tab-active {
    background-color: #a94e5d;
    border-color: #a94e5d;
    color: white;
  }

  .section6-no-members {
    text-align: center;
    color: #888;
    font-size: 16px;
    padding: 40px 20px;
  }
  
  .section6-team-carousel {
    width: 100%; /* Take full width of its parent (.section6-main-content) */
    overflow-x: auto; /* Enable horizontal scrolling */
    margin-bottom: 40px;
    /* Hide scrollbar styling */
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }
  .section6-team-carousel::-webkit-scrollbar {
    display: none; /* Safari and Chrome */
  }
  
  .section6-team-members {
    display: flex; /* Arrange cards in a row */
    flex-direction: row;
    gap: 25px; /* Spacing between cards */
    padding: 10px 2px 20px 2px; /* Padding for shadow and to ensure cards don't get cut off abruptly by scroll container edges */
    /* The width of this container will be determined by its content (the cards) */
  }
  
  .section6-member-card {
    flex: 0 0 260px; /* Fixed width for cards: don't grow, don't shrink, base width 260px */
    background-color: #fff; /* Card background */
    border-radius: 25px; /* Rounded corners for the card */
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08); /* Subtle shadow for depth */
    overflow: hidden; /* Ensures content (like image) respects border-radius */
    display: flex;
    flex-direction: column;
    text-align: left; /* Text inside card is left-aligned */
  }
  
  .section6-member-image {
    width: 100%;
    height: 220px; /* Fixed height for images */
    object-fit: cover; /* Cover the area, crop if necessary to maintain aspect ratio */
    display: block; /* Remove extra space below image if it's an inline element */
  }
  
  .section6-member-image.section6-grayscale {
    filter: grayscale(100%); /* Apply grayscale filter */
  }
  
  .section6-member-info {
    background-color: #f5e6e8; /* Light pink background for the text area */
    padding: 11px;
    flex-grow: 1; /* Allow info section to take remaining space if needed */
  }
  
  .section6-member-name {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; /* Clean sans-serif font */
    font-size: 17px; /* Name font size */
    font-weight: bold; /* Bold name */
    color: #333333; /* Dark color for name */
    margin: 0; /* Margin below name */
  }
  
  .section6-member-consultation {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px; /* Smaller font size for consultation type */
    color: #5a5a5a; /* Subtler color for consultation text */
    margin: 0;
    display: flex;
    align-items: center; /* Vertically align icon and text */
    padding-bottom: 0px;
    margin-top: -4px;
  }
  
  .section6-icon {
    margin-right: 4px;
    font-size: 12px; /* Icon size */
    color: #5a5a5a; /* Icon color same as text */
    line-height: 1; /* Helps with vertical alignment */
  }
  
  .section6-cta-button {
    height: 47px;
    background-color: #a94e5d; /* Maroon/dark pink color for button */
    color: white; /* White text color */
    border: none; /* No border */
    padding: 15px 30px; /* Padding inside button */
    border-radius: 30px; /* Fully rounded ends for the button */
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer;
    margin-top: 40px; /* Space above the button */
    display: inline-flex; /* To align text and arrow nicely */
    align-items: center;
    transition: background-color 0.3s ease; /* Smooth transition for hover effect */
  }
  
  .section6-cta-button:hover {
    background-color: #934450; /* Darker shade on hover */
  }
  
  .section6-arrow {
    margin-left: 10px;
    font-size: 1.1em; /* Make arrow slightly larger or more prominent */
    font-weight: normal; /* Can adjust if needed */
  }
  
  /* Responsive styles for section6 tabs */
  @media (max-width: 768px) {
    .section6-team-tabs {
      flex-direction: column;
      align-items: center;
      gap: 8px;
      margin-bottom: 30px;
    }

    .section6-tab-btn {
      width: 200px;
      font-size: 14px;
      padding: 10px 20px;
    }

    .section6-title {
      font-size: 28px;
      margin-bottom: 20px;
    }
  }

  @media (max-width: 480px) {
    .section6-team-tabs {
      gap: 6px;
      margin-bottom: 25px;
    }

    .section6-tab-btn {
      width: 180px;
      font-size: 13px;
      padding: 8px 16px;
      min-width: 100px;
    }

    .section6-title {
      font-size: 24px;
    }
  }

  /* SECTION 7 */
  .section7-container {
    background-color: #2d2d2d;
    color: #e0e0e0;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 60px 20px;
    width: 100%;
    box-sizing: border-box;
  }
  
  .section7-content-wrapper {
    max-width: 880px;
    margin: 0 auto;
    text-align: center;
  }
  
  .section7-faq-subtitle {
    font-size: 20px;
    text-transform: uppercase;
    color: #909090;
    margin-bottom: 8px;
    letter-spacing: 1.5px;
    font-weight: 500;
  }
  
  .section7-main-title {
    font-family: "DM Serif Display", serif;
    font-size: 2.25rem;
    color: #ffffff;
    margin-top: 0;
    margin-bottom: 15px;
    font-weight: 400;
  }

  .section7-contact-info {
    font-size: 1rem;
    color: #b0b0b0;
    margin-bottom: 5px;
    line-height: 1.6;
  }
  
  .section7-contact-detail {
    color: #ffffff;
    font-weight: bold;
  }
  
  .section7-accordion {
    text-align: left;
  }
  
  .section7-accordion-item {
    /* This is the <details> tag */
    border-bottom: 1px solid #454545;
    padding: 22px 0; /* Padding around the summary and content within the details tag */
  }
  
  .section7-accordion-item:last-child {
    border-bottom: none;
  }
  
  .section7-accordion-header {
    /* This is the <summary> tag */
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    list-style: none; /* Remove default marker (arrow) */
    width: 100%; /* Ensure summary takes full width */
  }
  .section7-accordion-header::-webkit-details-marker {
    display: none; /* Remove default marker for WebKit browsers */
  }
  .section7-accordion-header:focus {
    outline: none; /* Optional: remove focus outline if not desired, or style it */
  }
  
  .section7-question {
    font-size: 1.125rem;
    color: #f0f0f0;
    margin: 0;
    font-weight: 600;
    flex-grow: 1;
    padding-right: 20px;
    line-height: 1.5;
  }
  
  .section7-icon-wrapper {
    width: 26px;
    height: 26px;
    border: 1px solid #666666;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  
  .section7-icon {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
  }
  
  /* Common style for both lines of the plus/minus icon */
  .section7-accordion-item summary .section7-icon::before,
  .section7-accordion-item summary .section7-icon::after {
    content: "";
    position: absolute;
    background-color: #d0d0d0;
    top: 50%;
    left: 50%;
    transform-origin: center;
    transition: transform 0.2s ease-out, opacity 0.2s ease-out; /* Smooth transition */
  }
  
  /* Horizontal line (always present) */
  .section7-accordion-item summary .section7-icon::before {
    width: 10px;
    height: 1.5px;
    transform: translate(-50%, -50%);
  }
  
  /* Vertical line (present for plus, hidden/rotated for minus) */
  .section7-accordion-item summary .section7-icon::after {
    width: 1.5px;
    height: 10px;
    transform: translate(-50%, -50%);
  }
  
  /* When details is open, transform the plus to a minus */
  /* Hide the vertical line for the minus state */
  .section7-accordion-item[open] summary .section7-icon::after {
    transform: translate(-50%, -50%) rotate(90deg); /* Rotate to align with horizontal */
    opacity: 0; /* Or, simply hide it: display: none; if no transition is desired */
    /* If using display: none, transition won't work for opacity.
         For a smooth transition, rotating it and making it transparent or scaling to 0 is better.
         The image shows the vertical line disappearing, so opacity: 0 or scaling is good.
         Let's use scale for a cleaner hide effect with transition */
    transform: translate(-50%, -50%) scaleY(0);
  }
  
  .section7-accordion-content {
    padding-top: 15px;
  }

  .section7-accordion-content p {
    font-size: 1rem;
    color: #b0b0b0;
    line-height: 1.7;
    margin: 0;
  }
  
  
  @media (max-width: 768px) {
    .section6-cta-button {
      margin-top: 2px;
    }
    .section7-content-wrapper {
      text-align: left;
    }
    .section7-faq-subtitle {
      font-size: 1rem;
    }

    .section7-main-title {
      font-size: 1.75rem;
    }

    .section7-contact-info {
      font-size: 0.9375rem;
    }

    .section7-question {
      font-size: 1rem;
    }

    .section7-accordion-content p {
      font-size: 0.9375rem;
    }
  }
  
  /* SECTION 8 */
  .section8-container {
    width: 100%;
    background-color: #A04A57; /* --section8-primary-bg */
    color: #ffffff; /* --section8-text-light */
    padding: 40px 20px;
    box-sizing: border-box;
    font-family: var(--section8-font-main);
  }
  
  .section8-content-wrapper {
    display: flex;
    flex-direction: column; /* Mobile first: items stack in source order */
    gap: 30px;
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .section8-main-heading {
    font-size: 30px;
    font-weight: 600;
    line-height: 1.3;
    margin-bottom: 0; /* Gap handled by flex-wrapper */
    color: #ffffff; /* --section8-text-light */
  }
  
  .section8-main-heading img {
    width: 184px;
  }
  
  /* Text swapping for mobile/desktop */
  .section8-desktop-text {
    display: inline;
  }
  .section8-mobile-text {
    display: none;
  }
  
  .section8-form-wrapper {
    /* This wrapper helps in grid placement on desktop */
  }
  
  .section8-form-container {
    background-color: #cc717e; /* --section8-form-bg */
    padding: 25px;
    border-radius: 15px;
  }
  
  .section8-form-heading {
    font-weight: 600;
    color: #ffffff; /* --section8-text-light */
    margin-bottom: 25px;
    text-align: center; /* Default for mobile */
    font-size: 1.4rem; /* Mobile heading size for form */
  }
  .section8-form-heading .section8-desktop-text {
    display: none;
  }
  .section8-form-heading .section8-mobile-text {
    display: inline;
  }
  
  .section8-form-group {
    margin-bottom: 12px;
  }
  
  .section8-label {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: #e0e0e0;
    /* margin-bottom: 8px; */
  }
  
  /* Name label text swap */
  .section8-label .section8-desktop-text {
    display: none;
  }
  .section8-label .section8-mobile-text {
    display: inline;
  }
  
  .section8-input,
  .section8-select {
    width: 100%;
    padding: 8px 15px;
    border: 1px solid transparent;
    border-radius: 8px;
    background-color:rgba(255, 255, 255, 0.2);
    color: #ffffff;
    font-size: 11px;
    box-sizing: border-box;
    font-family: var(--section8-font-main);
    height: 31px;
  }
  
  .section8-input::placeholder {
    color:rgba(255, 250, 250, 0.69); /* --section8-input-placeholder */
    opacity: 0.8;
  }
  
  .section8-input:focus,
  .section8-select:focus {
    outline: none;
    border-color: white; /* --section8-primary-bg */
    box-shadow: 0 0 0 2px rgba(93, 58, 58, 0.3);
  }
  
  .section8-phone-input-group {
    display: flex;
  }
  
  .section8-country-code-select {
    width: auto;
    flex-basis: 44px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right: 1px solid #b0a0a0;
    appearance: none;
    padding-right: 25px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23614d4d'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); /* Placeholder color from var */
    background-repeat: no-repeat;
    background-position: right 8px center;
    background-size: 16px;
  }
  
  .section8-phone-number-input {
    flex-grow: 1;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
  
  .section8-radio-group {
    display: flex;
    gap: 10px;
  }
  
  .section8-radio-btn {
    width: 70px;
    /* padding: 12px 15px; */
    border: 1px solid transparent;
    border-radius: 17px;
    background-color:#ffffff40;
    color: #ffffff;
    font-size: 10px;
    box-sizing: border-box;
    font-family: var(--section8-font-main);
    /* height: 37px; */
    height: 28px;
  }
  
  .section8-radio-btn.section8-active {
    background-color: #3e2723; /* --section8-active-radio-bg */
    font-weight: 600;
  }
  
  .section8-radio-btn:not(.section8-active):hover {
    background-color: #8c736a;
  }
  
  .section8-select-wrapper {
    position: relative;
  }
  
  .section8-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23614d4d'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E"); /* Placeholder color from var */
    background-repeat: no-repeat;
    background-position: right 15px center;
    background-size: 16px;
    padding-right: 40px;
  }
  
  .section8-submit-btn {
    width: 100%;
    padding: 14px 20px;
    background-color: #ffffff;
    color: #5d3a3a;
    border: none;
    border-radius: 25px;
    font-size: 9px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.3s, transform 0.2s;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    height: 37px;
  }
  
  .section8-submit-btn:hover {
    background-color: #f0f0f0;
    transform: translateY(-1px);
  }
  
  .section8-location-block {
    display: flex;
    align-items: flex-start;
    gap: 15px;
  }
  
  .section8-location-icon-wrapper {
    margin-top: 5px;
  }
  
  .section8-location-pin-icon {
    width: 28px;
    height: 28px;
    fill: #e0e0e0; /* --section8-text-subtle */
  }
  
  .section8-address-content {
    flex: 1;
  }
  
  .section8-brand-name {
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #ffffff; /* --section8-text-light */
  }
  
  .section8-tagline {
    font-size: 1rem;
    font-weight: 400;
    color: #e0e0e0; /* --section8-text-subtle */
  }
  
  .section8-address {
    font-size: 16px;
    line-height: 1.6;
    color: #e0e0e0; /* --section8-text-subtle */
    margin: 0;
    opacity: 0.6;
  }
  
  .section8-google-maps-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 25px;
    border: 1.5px solid #f5e5e5; /* --section8-maps-btn-border */
    color: #f5e5e5; /* --section8-maps-btn-text */
    text-decoration: none;
    border-radius: 25px;
    font-weight: 500;
    font-size: 0.9rem;
    transition: background-color 0.3s, color 0.3s;
    width: 15rem;
  }
  
  .section8-gmaps-icon {
    width: 20px;
    height: 20px;
  }
  
  .section8-google-maps-btn:hover {
    background-color: #f5e5e5; /* --section8-maps-btn-border */
    color: #5d3a3a; /* --section8-primary-bg */
  }
  
  .section8-contact-us {
    /* margin-bottom: 20px; /* Gap handled by flex wrapper */
  }
  
  .section8-contact-heading {
    font-size: 1.2rem;
    font-weight: 600;
    margin-bottom: 15px;
    color: #ffffff; /* --section8-text-light */
  }
  
  .section8-contact-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  
  .section8-contact-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #e0e0e0; /* --section8-text-subtle */
    margin-bottom: 0;
  }
  .section8-contact-item:last-child {
    margin-bottom: 0;
  }
  
  .section8-contact-svg-icon {
    margin-right: 4px;
    width: 18px;
    height: 18px;
    fill: #e0e0e0; /* --section8-text-subtle */
    flex-shrink: 0;
  }
  
  .section8-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-align: center;
    gap: 10px;
    padding-top: 30px;
    margin-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    font-size: 10px;
    color: #e0e0e0;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -32px;
  }
  
  .section8-footer-links {
    display: flex;
    gap: 20px;
  }
  
  .section8-copyright {
    margin-bottom: 0;
  }
  
  .section8-footer-link {
    color: #e0e0e0; /* --section8-text-subtle */
    text-decoration: none;
    transition: color 0.3s;
  }
  
  .section8-footer-link:hover {
    color: #ffffff; /* --section8-text-light */
    text-decoration: underline;
  }
  
  /* Desktop Styles */
  @media (min-width: 769px) {
    .section8-container {
      padding: 60px 40px;
    }
  
    .section8-content-wrapper {
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
      grid-template-areas:
        "heading form"
        "location form"
        "maps form"
        "contact form";
      gap: 0 50px;
      align-items: start;
    }
  
    .section8-main-heading {
      grid-area: heading;
      margin-bottom: 30px;
      font-size: 3.5rem;
    }
  
    .section8-main-heading img {
      width: 171px;
    }
  
    .section8-form-wrapper {
      grid-area: form;
    }
    .section8-location-block {
      grid-area: location;
      margin-bottom: 30px;
    }
    .section8-google-maps-btn {
      grid-area: maps;
      margin-bottom: 30px;
    }
    .section8-contact-us {
      grid-area: contact;
    }
  
    .section8-contact-item {
      font-size: 20px;
    }
  
    .section8-form-container {
      padding: 19px;
      height: 445px;
      /* width: 300px; */
    }
  
    .section8-form-heading {
      text-align: center;
      font-size: 17px;
    }
    .section8-form-heading .section8-desktop-text {
      display: inline;
    }
    .section8-form-heading .section8-mobile-text {
      display: none;
    }
  
    .section8-label .section8-desktop-text {
      display: inline;
    }
    .section8-label .section8-mobile-text {
      display: none;
    }
  
    .section8-footer {
      flex-direction: row;
      justify-content: space-between;
      text-align: left;
      padding-top: 15px;
      margin-top: 40px;
      margin-bottom: -45px;
    }
  
    .section8-highlight-text {
      width: 13rem;
    }
  }
  
  @media (min-width: 1024px) {
    .section8-main-heading {
      font-size: 3rem;
    }
  
    .section8-highlight-text {
      width: 13rem;
    }
  }