/* Mobile text (visible by default, hidden on desktop) */
  .text-mobile {
      display: inline;
  }
  
  .text-desktop {
      display: none;
  }
  
  /* Desktop text (hidden by default, visible on desktop) */
  @media (min-width: 641px) {
      .text-mobile {
          display: none;
      }
      
      .text-desktop {
          display: inline;
      }
  }
.fourth-card__overlay-text {
  position: absolute;
  left: 50%;
  top: 17%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 100%;
  text-align: center;
  padding: 1rem;
  box-sizing: border-box;
}
@media (min-width: 1600px) {
  .fourth-card__overlay-text {
    top: 12% !important;
  }
}
@media (max-width: 1366px) {
  .fourth-card__overlay-text {
    top: 18% !important;
    font-size: 11px !important;
  } 
}

@media (max-width: 480px) {
  .fourth-card__overlay-text {
    width: 95%;
    padding: 0.5rem;
  }
}
.page h1, .page h2, .page h3 {
    font-family: "Google Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
.pixel-color-black {
  color: var(--color-body-text) !important;
}
.pixel-pdp-lower-case {
    text-transform: math-auto !important;
}
.left-align{
    text-align: left !important;
}
/* defaults.css */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* Font definitions */
@font-face {
  font-family: "Google Sans";
  src: url("/content/dam/static-library/google/2026/google-fonts/GoogleSans-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Google Sans";
  src: url("/content/dam/static-library/google/2026/google-fonts/GoogleSans-Italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Google Sans";
  src: url("/content/dam/static-library/google/2026/google-fonts/GoogleSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Google Sans";
  src: url("/content/dam/static-library/google/2026/google-fonts/GoogleSans-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Google Sans";
  src: url("/content/dam/static-library/google/2026/google-fonts/GoogleSans-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Google Sans";
  src: url("/content/dam/static-library/google/2026/google-fonts/GoogleSans-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

/* desktop.css */
@media (min-width: 641px) {
  /* Hero section */

  /* Feature grid section */

  .feature-grid__items {
    width: 100%;
    grid-template-columns:
      minmax(0, 1fr)
      minmax(0, 1fr)
      clamp(120px, 31.25vw, 450px)
      minmax(0, 1fr)
      minmax(0, 1fr);    
  }

  .feature-card:nth-child(2) {
    margin-top: clamp(30px, 19.93vw, 287px);
  }
  
  .feature-card:nth-child(5) {
    margin-top: clamp(50px, 8.764vw, 126px);
  }

  /* Secondary section */

  .secondary-section__cards--first {
    justify-content: center;
    max-width: 1157px;
    margin: 0 auto;
    width: 100%;
  }

  .secondary-section__cards--second {
    max-width: 1157px;
    margin: 0 auto;
    width: 100%;
    justify-content: center;
  }
}

/* CSS Variables - Desktop defaults (grouped by section) global.css*/
:root {
  /* Global colors */
  --color-hero-text: rgba(217, 208, 255, 1);
  --color-body-text: rgba(25, 28, 29, 1);
  --color-page-bg: #ffffff;

  /* Secondary section colors */
  --color-bg-dark: rgba(35, 35, 41, 1);
  --color-primary-blue: rgba(28, 48, 180, 1);
  --color-card-bg: rgba(34, 56, 202, 1);
  --color-text-mint: rgba(208, 237, 213, 1);

  /* Tertiary section colors */
  --color-tertiary-title: rgba(18, 81, 46, 1);

  /* Fourth section colors */
  --color-fourth-bg: rgba(224, 235, 254, 1);
  --color-fourth-title: rgba(33, 51, 191, 1);

  /* Tertiary section background */
  --soft-green-to-white: linear-gradient(
    to top,
    rgba(214, 234, 209, 1) 2%,
    rgba(255, 255, 255, 1) 100%
  );

  /* Hero section font sizes */
  /* Original 1440px design based on vw */
  --font-size-hero-title: clamp(24px, 5.625vw, 81px);        /* 5.625vw at 1440px → 81px */
  --font-size-hero-subtitle: clamp(12px, 2.778vw, 40px);     /* 40px at 1440px screen (2.778vw) */

  /* Feature grid font sizes */
  --font-size-feature-grid-title: clamp(18.88px, 4.167vw, 60px); /* 60px at 1440px screen (4.167vw) */
  --font-size-card-title: clamp(16px, 1.597vw, 23px); /* 23px at 1440px screen */

  /* Secondary section font sizes */
  --font-size-secondary-section-title: clamp(18.88px, 4.167vw, 60px); /* 60px at 1440px screen (4.167vw) */
  /* These clamps were already vw-based; max now matches 1440px value */
  --font-size-secondary-section-text-first: clamp(12.48px, 1.597vw, 23px);  /* 1.597vw → 23px at 1440px screen */
  --font-size-secondary-section-text-second: clamp(12.48px, 1.55vw, 22.32px);
  /* Card text followed max(0.875rem, 1.75vw) originally */
  --font-size-secondary-card-text: clamp(12px, 1.597vw, 23px);              /* 1.597vw → 23px */
  --font-size-secondary-overlay: clamp(18.88px, 4.25vw, 61.2px);
  --font-size-secondary-number: clamp(24px, 5.5vw, 79.2px);                  /* 5.5vw → 79.2px */
  --font-size-secondary-number-large: clamp(28px, 6.2vw, 89.28px);           /* 6.2vw → 89.28px */
  --font-size-secondary-number-large-stat: clamp(28px, 6.2vw, 89.28px);
  --font-size-secondary-unit: clamp(16px, 4.8vw, 69.12px);                   /* 4.8vw → 69.12px */
  --font-size-secondary-stat-unit: clamp(16px, 2.22vw, 32px);

  /* Tertiary section font sizes (shares scales but has its own vars) */
  --font-size-tertiary-title: clamp(20px, 4.167vw, 60px); /* 60px at 1440px screen */
  --font-size-tertiary-subtitle: clamp(14px, 1.597vw, 23px); /* 23px at 1440px screen */
  --font-size-tertiary-grid-title: clamp(14px, 1.597vw, 23px); /* 23px at 1440px screen */
  --font-size-tertiary-grid-text: clamp(14px, 1.597vw, 23px);  /* 23px at 1440px screen */
  --font-size-tertiary-overlay-text: clamp(10px, 1.5vw, 22px); /* 1.5vw at 1440px → 22px, larger than before */

  /* Fourth section font sizes (desktop, 1440px base) */
  --font-size-fourth-title: clamp(24px, 4.167vw, 60px); /* 60px at 1440px screen (4.167vw) */
  --font-size-fourth-subtitle: clamp(13px, 1.597vw, 23px); /* 23px at 1440px screen */
  --font-size-fourth-grid-text: clamp(13px, 1.597vw, 23px);
  --font-size-fourth-overlay-text: clamp(8px, 1.25vw, 18px); /* 1.25vw at 1440px → 18px */

  /* Fifth section colors */
  --color-fifth-card-bg: rgba(243, 244, 255, 1);

  /* Fifth section font sizes (desktop, 1440px base) */
  --font-size-fifth-title: clamp(24px, 4.167vw, 60px);
  --font-size-fifth-card-text: clamp(14px, 1.597vw, 23px);

  /* Sixth section font sizes (desktop, 1440px base) */
  --font-size-sixth-title: clamp(24px, 4.167vw, 60px);
  --font-size-sixth-text: clamp(14px, 1.597vw, 23px);

  /* Seventh section font sizes (desktop, 1440px base) */
  --font-size-seventh-title: clamp(24px, 4.167vw, 60px);
  --font-size-seventh-text: clamp(14px, 1.597vw, 23px);

  /* Eighth section font sizes (desktop, 1440px base) */
  --font-size-eighth-title: clamp(24px, 4.167vw, 60px);
  --font-size-eighth-card-text: clamp(12px, 1.319vw, 19px); /* 19px at 1440px screen */

  /* Final section font sizes (desktop, 1440px base) */
  --font-size-final-text: clamp(12px, 1.111vw, 16px);
}

.google-body {
  margin: 0;
  font-family: "Google Sans", system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", sans-serif !important;
  font-weight: 300;
  color: var(--color-body-text);
  background-color: var(--color-page-bg);
}

img {
  width: 100%;
  display: block;
}

.page {
  margin: 0 auto;
  max-width: 1440px;
  width: 100%;
  padding-block: 23px 100px;
  gap: 0;
  display:flex;
  flex-direction: column;
}

/* Give every top-level section inside .page the same top padding */
.page > section {
  /* 60px at 1440px screen */
  padding-top: clamp(32px, 4.167vw, 60px);
}

/* Hero section */

.hero {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: var(--color-hero-text) !important;
  position: relative;
  aspect-ratio: 1392 / 800;
  margin: 0 clamp(0px, 1.6vw, 24px);
  width: calc(100% - (2 * clamp(0px, 1.6vw, 24px)));
  /* 70px at 1440px screen */
  padding-bottom: clamp(32px, 4.861vw, 70px);
}

.hero__background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.hero__background img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.hero__content {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hero__title-group {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  column-gap: clamp(86.4px, 21vw, 302.4px);
  margin-right: clamp(30px, 2.083vw, 90px);
}

.hero__title {
  margin: 0;
  font-size: var(--font-size-hero-title) !important;
  font-weight: 500 !important;
  color: var(--color-hero-text) !important;
  text-transform: math-auto !important;
}

.hero__title-block {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.hero__subtitle {
  position: absolute;
  top: 100%;
  margin: 0px auto 0px;
  text-align: right;
  font-size: var(--font-size-hero-subtitle);
  font-weight: 500;
}

/* Feature grid section */

.feature-grid {
  padding-inline: clamp(23px, 1.667vw, 24px);
  /* Match previous vertical gap between sections */
  padding-bottom: clamp(32px, 4.861vw, 70px); 
}

.feature-grid__title {
  font-size: var(--font-size-feature-grid-title) !important;
  font-weight: 500 !important;
  text-align: center;
}

.feature-grid__items {
  display: grid;
  margin-top: clamp(40px, 6.944vw, 100px);
  gap: clamp(10px, 1.597vw, 23px); /* 23px at 1440px screen */
}

.feature-card {
  padding: 8px 0;
}

.feature-card__image {
  border-radius: clamp(10px, 1.736vw, 25px); /* 25px at 1440px screen */
  overflow: hidden;
}

.feature-card__image img {
  border-radius: clamp(10px, 1.736vw, 25px);
}

.feature-card__title {
  margin-top: 20px !important;
  font-size: var(--font-size-card-title);
  font-weight: 500;
  line-height: 1.2;
  font-size: 23px !important;
}

/* Secondary section */

.secondary-section {
  background-color: var(--color-primary-blue);
  width: 100%;
  padding-top: clamp(30px, 4.063vw, 58px);
  /* Add bottom spacing within the blue background instead of using page gap */
  padding-bottom: clamp(32px, 4.861vw, 70px);
}

.secondary-section__block {
  display: flex;
  flex-direction: column;
}

.secondary-section__block--first {
  margin-bottom: clamp(60px, 6.944vw, 100px);
}

.secondary-section__title {
  font-size: var(--font-size-secondary-section-title) !important;
  font-weight: 500 !important;
  text-align: center;
  color: var(--color-text-mint) !important;
  margin: 0 !important;
}

.secondary-section__block--first .secondary-section__title {
  margin-bottom: clamp(60px, 6.944vw, 100px);
}

.secondary-section__block--second{
  max-width: 1157px;
  margin: 0 auto;
  width: 100%;
}

.secondary-section__block--second .secondary-section__title {
  margin-bottom: clamp(40px, 4.861vw, 70px);
}

.secondary-section__image {
  width: 100%;
  display: block;
}

.secondary-section__block--first .secondary-section__image {
  margin-bottom: clamp(40px, 5.903vw, 85px);
}

.secondary-section__text {
  font-size: 23px !important;
  font-weight: 400 !important;
  color: var(--color-text-mint);
  margin: 0 auto !important;
  width: 47.5%;
  text-align: center;
}

.secondary-section__block--first .secondary-section__text {
  margin-bottom: clamp(60px, 6.944vw, 100px) !important;
  font-size: 22px !important;
}

.secondary-section__cards {
  display: flex;
  gap: 25px;
  max-width: 1440px;
  margin: 0 auto;
  width: 100%;
}

.secondary-section__cards--first {
  justify-content: center;
  flex-wrap: wrap;
}

.secondary-section__cards--second {
  display: grid;
  grid-template-columns: repeat(3, clamp(0px, 25.625vw, 369px));
  column-gap: 25px;
  row-gap: 25px;
  justify-content: center;
  align-items: start;

}

.secondary-section__cards--second .secondary-card--no-bg {
  width: 100%;
  max-width: 369px;
  justify-self: center;
}

.secondary-section__cards--second .secondary-card__text {
  text-align: left;
  padding-left: 0;
  padding-right: 0;
}

.secondary-card {
  background-color: var(--color-card-bg);
  width: clamp(0px, 25.556vw, 368px);
  min-height: clamp(0px, 28.194vw, 406px);
  height: auto;
  display: flex;
  flex-direction: column;
  padding: 0;
  border-radius: clamp(10px, 1.736vw, 25px);
  overflow: hidden;
}

.secondary-card--no-bg {
  background-color: transparent;
  height: auto;
  width: 100%;
}

/* "Smooth by design" cards should NOT be rounded */
.secondary-section__cards--second .secondary-card--no-bg {
  border-radius: 0;
  overflow: visible;
}

.secondary-section__cards--second .secondary-card--no-bg .secondary-card__image,
.secondary-section__cards--second .secondary-card--no-bg .secondary-card__image img {
  border-radius: 0;
}

.secondary-card__content {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  padding: clamp(5px, 0.75vw, 10px);
  flex-shrink: 0;
}

.secondary-card--second .secondary-card__content {
  position: relative;
  flex-direction: column;
  padding-bottom: clamp(5px, 0.75vw, 10.8px); /* 10.8px at 1440px screen */
}

.secondary-card--first .secondary-card__content {
  padding: clamp(20px, 2.778vw, 40px);
}



.secondary-card__content--centered {
  align-items: center;
  justify-content: center;
}

.secondary-card__text-overlay {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: var(--font-size-secondary-overlay);
  font-weight: 500;
  color: var(--color-text-mint);
  z-index: 2;
}

.secondary-card--second .secondary-card__text-overlay {
  flex-direction: row;
  align-items: baseline;
}  

.secondary-card__number {
  line-height: 1;
  display: block;
  position: relative;
  font-size: 0;
}

.secondary-card--second .secondary-card__number {
  display: inline-block;
}

.secondary-card__digit {
  display: inline-block;
  position: relative;
  font-size: var(--font-size-secondary-number);
}

.secondary-card--second .secondary-card__digit {
  font-size: var(--font-size-secondary-number-large);
}

.secondary-card__digit--zero {
  position: relative;
}

.secondary-card__unit {
  line-height: 1;
  display: block;
  font-size: var(--font-size-secondary-unit);
}

.secondary-card__unit--inline {
  display: inline-block;
  margin-left: 0.2em;
}

.secondary-card__image {
  width: 100%;
  display: block;
}

.secondary-card__image--stat {
  border-radius: clamp(10px, 1.736vw, 25px);
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(96px, 10vw, 140px);
}

.secondary-card__stat {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--color-text-mint);
  font-weight: 500;
  line-height: 1;
  text-align: center;
  position: relative;
}

.secondary-card__stat-number {
  font-size: var(--font-size-secondary-number-large-stat);
  line-height: 1;
}

.secondary-card__stat-unit {
  font-size: var(--font-size-secondary-stat-unit);
  line-height: 1;
  margin-top: clamp(-14px, -0.97vw, 0px);
  padding: clamp(2px, 0.139vw, 3px) clamp(0px, 0.694vw, 10px);
  border: clamp(2px, 0.139vw, 3px) solid var(--color-text-mint);
  border-radius: clamp(6px, 0.521vw, 10px);
  position: static;
}

.secondary-card__image--overlay {
  position: absolute;
  height: 30%;
  width: auto;
  z-index: -1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

.secondary-card__image--overlay img {
  height: 100%;
  width: auto;
  object-fit: contain;
  display: block;
}

.secondary-card__images-container {
  z-index: 2;
  position: absolute;
  top: clamp(-95px, calc(-45px - (50 * (100vw - 641px) / 799)), -45px);
  left: clamp(0px, 5.625vw, 81px);
}

.secondary-card__image--absolute {
  position: absolute;
  width: auto;
  height: auto;
  z-index: 1;
  top: clamp(0px, 2.639vw, 38px);
  pointer-events: none;
  display: block;
  line-height: 0;
  margin: 0;
  padding: 0;
}

.secondary-card__image--absolute img {
  width: 100%;
  height: auto;
  display: block;
}

.secondary-card__image--right {
  margin-top: clamp(0px, 1.319vw, 19px);
  margin-left: clamp(0px, 5.625vw, 81px);
  width: clamp(0px, 8.264vw, 119px);
  z-index: 0;
}

.secondary-card__image--left {
  width: clamp(0px, 7.5vw, 108px); /* 108px at 1440px, minimum 0 */
  z-index: 1;
}

.secondary-section__cards--second .secondary-card--no-bg .secondary-card__image {
  margin-bottom: clamp(20px, 2.083vw, 30px);
}

.secondary-card--no-bg .secondary-card__image {
  margin-bottom: 0;
}

.secondary-card__text {
  font-size: var(--font-size-secondary-card-text) !important;
  font-weight: 400 !important;
  color: var(--color-text-mint);
  margin: 0 !important;
  padding: 0 32px !important;
  text-align: center;
}
.secondary-section__cards--first .secondary-card__text:nth-child(2) {
  padding: 0 clamp(10px, 1.563vw, 24px);
}

.secondary-card.secondary-card--first .secondary-card__text:nth-child(2){
  padding-bottom: clamp(10px, 2.778vw, 40px);
}

.secondary-card--second {
  position: relative;
  justify-content: center;

}

.secondary-card--third {
  justify-content: center;
  gap: clamp(0px, 3.681vw, 53px); /* 53px gap at 1440px */
}

/* Tertiary section */

.tertiary-section {
  width: 100%;
  background: var(--soft-green-to-white);
  padding-bottom: clamp(32px, 4.861vw, 70px);
}

.tertiary-section__inner {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.tertiary-section__header {
  text-align: center;

}

.tertiary-section__title {
  font-size: var(--font-size-tertiary-title) !important;
  font-weight: 500 !important;
  margin: 0 !important;
  color: var(--color-tertiary-title) !important;
}

.tertiary-section__subtitle {
  margin: 0 auto !important;
  margin-top: max(16px, 1.111vw) !important;
  font-size: var(--font-size-tertiary-subtitle) !important;
  font-weight: 500 !important;
  color: var(--color-tertiary-title);
  max-width: clamp(320px, 56.25vw, 810px);
  
}

.tertiary-section__image {
  width: 100%;
  display: block;
}

.tertiary-section__image img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: clamp(10px, 1.736vw, 25px);
}

.tertiary-section__image--1 {
  overflow: hidden;
}

.tertiary-section__image--1 img {
  width: 100%;
  border-radius: 0;
  object-position: left center;
}

/* 96px vertical space between first and second image at 1440px */
.tertiary-section__image--2 {
  margin-top: clamp(40px, 6.667vw, 96px); /* 6.667vw of 1440px → 96px */
}

.tertiary-section__content {
  /* 142px margins on a 1440px design → ~9.861vw */
  margin-inline: clamp(32px, 9.861vw, 142px);
}

.tertiary-section__title-secondary {
  /* 30px between second image and this title at 1440px */
  margin-top: clamp(16px, 2.083vw, 30px) !important; /* 2.083vw of 1440px → 30px */
  margin-bottom: 0 !important;
  text-align: center;
  font-size: var(--font-size-tertiary-grid-title) !important;
  font-weight: 500;
  text-align: center;
}

.tertiary-section__grid {
  /* 98px between title-secondary and grid at 1440px */
  margin-top: clamp(40px, 6.806vw, 98px); /* 6.806vw of 1440px → 98px */
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* 121.8px row gap & 24px column gap at 1440px */
  row-gap: clamp(48px, 6.944vw, 100px);           /* 6.944vw of 1440px → 100px */
  column-gap: clamp(16px, 1.667vw, 24px);           /* 1.667vw of 1440px → 24px */
}

.tertiary-card {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.736vw, 25px); /* 25px at 1440px screen */
}

.tertiary-card__image {
  border-radius: clamp(10px, 1.736vw, 25px);
  overflow: hidden;
  position: relative;
}

.tertiary-card__image img {
  width: 100%;
  height: auto;
  display: block;
}

.tertiary-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.tertiary-card__overlay-text {
  font-size: var(--font-size-tertiary-overlay-text);
  font-weight: 400;
  color: rgba(255, 255, 255, 0.85);
  text-align: center;
  max-width: 95%;
  margin: 0;
  background-color: rgba(34, 34, 34, 0.86);
  border-radius: clamp(10px, 1.042vw, 15px); /* 15px at 1440px screen */
  padding: 12.5px clamp(12px, 1.5vw, 20px);
}

/* Second card in the 2x2 grid: 215px top margin at 1440px (≈14.93vw) */
.tertiary-section__grid .tertiary-card:nth-child(2) {
  margin-top: clamp(80px, 14.93vw, 215px);
}

.tertiary-card__text {
  margin: 0 !important;
  font-size: 22px !important;
  font-weight: 500 !important;
  text-align: left;
}

/* Fourth section */

.fourth-section {
  width: 100%;
  background-color: var(--color-fourth-bg);
  padding-top: max(80px, 5.556vw);
  padding-bottom: clamp(60px, 6.944vw, 100px);
}

.fourth-section__inner {
  margin: 0 auto;
  /* 142px at 1440px screen */
  padding-inline: clamp(24px, 9.861vw, 142px);
  display: flex;
  flex-direction: column;
}

.fourth-section__header {
  max-width: 1110px;
  margin: 0 auto;
  text-align: center;
}

.fourth-section__title {
  font-size: var(--font-size-fourth-title) !important;
  font-weight: 500 !important;
  margin: 0 !important;
  color: var(--color-fourth-title) !important;
}

.fourth-section__subtitle {
  /* 40.5px between title and subtitle at 1440px */
  margin-top: clamp(20px, 2.8125vw, 40.5px) !important; /* 2.8125vw of 1440px → 40.5px */
  font-size: var(--font-size-fourth-subtitle) !important;
  font-weight: 500 !important;
  color: var(--color-fourth-title);
}

.fourth-section__hero {
  /* 70.5px below subtitle at 1440px */
  margin-top: clamp(32px, 4.8958vw, 70.5px); /* 4.8958vw of 1440px → 70.5px */
  position: relative;
}

.fourth-section__image {
  width: 100%;
  display: block;
}

.fourth-section__image img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: clamp(10px, 1.736vw, 25px);
}

.fourth-section__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: clamp(16px, 2.222vw, 32px);
  pointer-events: none;
}

.fourth-section__label {
  font-size: var(--font-size-fourth-grid-text) !important;
  font-weight: 400 !important;
  color: #ffffff;
  max-width: clamp(120px, 21.25vw, 306px);
}

.fourth-section__overlay-right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(8px, 0.833vw, 12px);
  max-width: clamp(120px, 17.08vw, 246px);
  margin-right: clamp(32px, 4.17vw, 60px);
  margin-top: clamp(80px, 23.04vw, 375px); 
}
.fourth-section__label--left {
  margin-top: clamp(32px, 8.402vw, 121px) !important;
  margin-left: clamp(16px, 4.652vw, 67px) !important;

}

.fourth-section__badge-image {
  width: clamp(20px, 1.944vw, 28px);
  height: clamp(20px, 1.944vw, 28px);
  display: block;
}

.fourth-section__badge-image img {
  width: 100%;
  height: auto;
  display: block;
}

.fourth-section__body {
  /* 30px between hero image and this text at 1440px */
  margin-top: clamp(16px, 2.083vw, 30px) !important; /* 2.083vw of 1440px → 30px */
  font-size: var(--font-size-fourth-grid-text) !important;
  font-weight: 500 !important;
  color: var(--color-body-text);
  text-align: center;
}

.fourth-section__grid {
  /* 80.5px between body text and grid at 1440px */
  margin-top: clamp(32px, 5.5903vw, 80.5px); /* 5.5903vw of 1440px → 80.5px */
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* 81.8px row gap & 27px column gap at 1440px */
  row-gap: clamp(32px, 5.6806vw, 81.8px);  /* 5.6806vw → 81.8px */
  column-gap: clamp(16px, 1.875vw, 27px);  /* 1.875vw → 27px */
}

.fourth-card {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 2.083vw, 30px);
}

.fourth-card__image {
  border-radius: clamp(10px, 1.736vw, 25px);
  overflow: hidden;
  position: relative;
}

/* First card in grid has centered text overlay */
.fourth-card:first-child .fourth-card__image {
  position: relative;
}

.fourth-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: start;
  justify-content: center;
  padding: clamp(16px, 2.222vw, 32px);
  pointer-events: none;
}

.fourth-card__overlay-text {
  font-size: 16px;
  font-weight: 500 !important;
  color: #ffffff;
  text-align: left;
  max-width: clamp(50px, 17.778vw, 256px) !important; /* 256px at 1440px screen */
  margin-top: clamp(48px, 18.181vw, 305px) !important; /* 305px at 1440px screen */
  margin-left: clamp(0px, 0.694vw, 10px) !important; /* 10px at 1440px screen */
  height: clamp(0px, 10.208vw, 147px) !important; /* 147px at 1440px screen */
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

/* First card overlay text should be black instead of white */
.fourth-card:first-child .fourth-card__overlay-text {
  color: var(--color-body-text);
}

.fourth-card__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* Third card image with background color */
.fourth-card:nth-child(3) .fourth-card__image {
  background-color: rgba(209, 223, 244, 1);
}

.fourth-card__text {
  margin: 0 !important;
  font-size: 21px !important;
  font-weight: 500 !important;
  color: var(--color-body-text);
  text-align: left;
}

/* Fifth section */

.fifth-section {
  width: 100%;
  padding-top: max(80px, 5.556vw);
  padding-bottom: clamp(32px, 4.861vw, 70px);
}

.fifth-section__inner {
  margin: 0 auto;
  padding-inline: clamp(24px, 9.375vw, 135px);
  display: flex;
  flex-direction: column;
}

.fifth-section__title {
  font-size: var(--font-size-fifth-title) !important;
  font-weight: 500;
  margin: 0 !important;
  text-align: center;
  color: var(--color-body-text);
}

.fifth-section__cards {
  /* 74.5px between title and cards at 1440px */
  margin-top: clamp(32px, 5.1736vw, 74.5px); /* 5.1736vw of 1440px → 74.5px */
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(20px, 3.0556vw, 44px); /* 3.0556vw of 1440px → 44px */
}

.fifth-card {
  background-color: var(--color-fifth-card-bg);
  /* 562px × 304px at 1440px */
  width: clamp(240px, 39.0278vw, 562px);  /* 39.0278vw → 562px */
  min-height: clamp(200px, 21.111vw, 304px);  /* 21.111vw → 304px */
  height: auto;
  /* 20px margin top at 1440px */
  padding: 0;
  border-radius: clamp(10px, 1.736vw, 25px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: clamp(12px, 1.389vw, 20px) clamp(24px, 4.444vw, 64px) clamp(24px, 4.444vw, 64px);
}

.fifth-card__image {
  /* 61px wide at 1440px */
  aspect-ratio: 61 / 67;  
  width: clamp(30px, 4.2361vw, 61px); /* 4.2361vw of 1440px → 61px */
  height: clamp(33px, 4.6528vw, 67px); /* 4.6528vw of 1440px → 67px */
  /* Ensure image keeps aspect ratio — do not crop or stretch */
  display: flex;
  justify-content: center;
  align-items: center;
}

.fifth-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;  /* changed from cover to contain to avoid cropping */
  display: block;
}

.fifth-card__text {
  /* 14px gap between image and text at 1440px */
  margin-top: clamp(8px, 0.9722vw, 14px) !important; /* 0.9722vw → 14px */
  font-size: var(--font-size-fifth-card-text) !important;
  font-weight: 500 !important;
  color: var(--color-body-text);
  text-align: left;
  flex: 1;
}

/* Sixth section */

.sixth-section {
  width: 100%;
  padding-top: clamp(20px, 2.083vw, 30px);
  padding-bottom: clamp(40px, 3.4722vw, 50px);
}

.sixth-section__inner {
  margin: 0 auto;
  /* 142px margins left/right at 1440px */
  margin-inline: clamp(24px, 9.8611vw, 142px); /* 9.8611vw of 1440px → 142px */
  display: flex;
  flex-direction: column;
}

.sixth-section__title {
  font-size: var(--font-size-sixth-title) !important;
  font-weight: 500;
  margin: 0 auto !important;
  text-align: center;
  color: var(--color-body-text);
  width: fit-content;
}

.sixth-section__image {
  display: flex;
  align-items: center;
  justify-content: center;
  /* 50px between title and image at 1440px */
  margin-top: clamp(20px, 3.4722vw, 50px); /* 3.4722vw of 1440px → 50px */
  /* 1156px × 638px container at 1440px */
  width: clamp(280px, 80.2778vw, 1156px); /* 80.2778vw of 1440px → 1156px */
  height: clamp(200px, 44.3056vw, 638px); /* 44.3056vw of 1440px → 638px */
  background-color: rgba(236, 237, 255, 1);
  border-radius: clamp(10px, 1.736vw, 25px);
}

.sixth-section__image img {
  /* 802px × 640px image at 1440px */
  width: clamp(200px, 55.6944vw, 802px); /* 55.6944vw of 1440px → 802px */
  height: clamp(160px, 44.4444vw, 640px); /* 44.4444vw of 1440px → 640px */
  object-fit: contain;
  display: block;
}

.sixth-section__text {
  /* 30px between image and text at 1440px */
  margin-top: clamp(16px, 2.2vw, 30px) !important; /* 2.0833vw of 1440px → 30px */
  font-size: 21px !important;
  font-weight: 500 !important;
  color: var(--color-body-text);
  text-align: center;
}

/* Seventh section */

.seventh-section {
  width: 100%;
  padding-top: clamp(20px, 2.083vw, 30px);
  padding-bottom: clamp(40px, 3.4722vw, 50px);
}

.seventh-section__inner {
  margin: 0 auto;
  /* 142px margins left/right at 1440px */
  margin-inline: clamp(24px, 9.8611vw, 142px); /* 9.8611vw of 1440px → 142px */
  display: flex;
  flex-direction: column;
}

.seventh-section__title {
  font-size: var(--font-size-seventh-title) !important;
  font-weight: 500 !important;
  margin: 0 auto !important;
  text-align: center;
  color: var(--color-body-text);
  width: fit-content;
}

.seventh-section__images {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(12px, 1.1111vw, 16px);
  /* 50px between title and images at 1440px */
  margin-top: clamp(20px, 3.4722vw, 50px); /* 3.4722vw of 1440px → 50px */
}

.seventh-section__image {
  display: block;
  border-radius: clamp(10px, 1.736vw, 25px);
  overflow: hidden;
}

.seventh-section__image--first {
  /* 466px × 578px at 1440px */
  width: clamp(200px, 32.3611vw, 466px); /* 32.3611vw of 1440px → 466px */
  height: clamp(200px, 40.1389vw, 578px); /* 40.1389vw of 1440px → 578px */
}

.seventh-section__image--second,
.seventh-section__image--third {
  /* 321px × 578px at 1440px */
  width: clamp(150px, 22.2917vw, 321px); /* 22.2917vw of 1440px → 321px */
  height: clamp(200px, 40.1389vw, 578px); /* 40.1389vw of 1440px → 578px */
}

.seventh-section__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.seventh-section__text {
  /* 30px between images and text at 1440px */
  margin-top: clamp(16px, 2.2vw, 30px) !important; /* 2.2vw of 1440px → 30px */
  font-size: 22px !important;
  font-weight: 500 !important;
  color: var(--color-body-text);
  text-align: center;
}

/* Eighth section */

.eighth-section {
  width: 100%;
  padding-top: clamp(20px, 2.083vw, 30px);
  padding-bottom: clamp(40px, 3.4722vw, 50px);
}

.eighth-section__inner {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.eighth-section__title {
  font-size: var(--font-size-eighth-title) !important;
  font-weight: 500;
  margin: 0 auto !important;
  text-align: center;
  color: var(--color-body-text);
  width: fit-content;
  max-width: clamp(0px, 80.28vw, 1156px);
}

.eighth-section__cards {
  display: flex;
  gap: clamp(12px, 1.7361vw, 25px); /* 1.7361vw of 1440px → 25px */
  /* 50px between title and cards at 1440px */
  margin-top: clamp(20px, 3.4722vw, 50px); /* 3.4722vw of 1440px → 50px */
}

.eighth-card {
  /* 564px × 228px at 1440px */
  width: clamp(280px, 39.1667vw, 564px); /* 39.1667vw of 1440px → 564px */
  height: clamp(180px, 15.8333vw, 228px); /* 15.8333vw of 1440px → 228px */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(16px, 2.222vw, 32px);
  background-color: rgba(236, 237, 255, 1);
  border-radius: clamp(10px, 1.736vw, 25px);
}

.eighth-card__image {
  display: block;
  flex-shrink: 0;
}

.eighth-card--left .eighth-card__image {
  /* 270px × 39px at 1440px */
  width: clamp(150px, 18.75vw, 270px); /* 18.75vw of 1440px → 270px */
  height: clamp(20px, 2.7083vw, 39px); /* 2.7083vw of 1440px → 39px */
}

.eighth-card--right .eighth-card__image {
  /* 223px × 30px at 1440px */
  width: clamp(120px, 15.4861vw, 223px); /* 15.4861vw of 1440px → 223px */
  height: clamp(15px, 2.0833vw, 30px); /* 2.0833vw of 1440px → 30px */
}

.eighth-card__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.eighth-card__text {
  /* Content max width: 328px at 1440px */
  max-width: clamp(200px, 22.7778vw, 328px); /* 22.7778vw of 1440px → 328px */
  margin-top: clamp(12px, 1.5vw, 22px) !important;
  font-size: var(--font-size-eighth-card-text) !important;
  font-weight: 400 !important;
  color: var(--color-body-text);
  text-align: center;
}

.eighth-card--right .eighth-card__text {
  /* Content max width: 380px at 1440px */
  max-width: clamp(220px, 26.3889vw, 380px); /* 26.3889vw of 1440px → 380px */
}

/* Final section */

.final-section {
  width: 100%;
  padding-top: clamp(20px, 2.083vw, 30px);
  padding-bottom: clamp(40px, 3.4722vw, 50px);
}

.final-section__inner {
  margin: 0 auto;
  /* 1320px text width at 1440px = 60px margin on each side */
  margin-inline: clamp(24px, 4.1667vw, 60px); /* 4.1667vw of 1440px → 60px */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.final-section__text {
  font-size: 15px !important;
  font-weight: 400 !important;
  color: #9aa0a6;
  text-align: center;
  margin: 0;
}
/* Mobile layout: 2-1-2 grid for 5 cards (only below 640px) mobile.css*/

@media (max-width: 640px) {
  /* Mobile font size overrides (grouped by section) */
  :root {
    /* Hero section font sizes */
    --font-size-hero-title: clamp(18px, 6.875vw, 44px);
    --font-size-hero-subtitle: clamp(11px, 4.0625vw, 26px);

    /* Feature grid font sizes */
    --font-size-feature-grid-title: clamp(18px, 8.90625vw, 57px);
    --font-size-card-title: clamp(14px, 5vw, 32px);

    /* Secondary section font sizes */
    --font-size-secondary-section-title: clamp(18px, 8.90625vw, 57px);
    --font-size-secondary-section-text-first: clamp(13px, 6.09375vw, 39px);
    --font-size-secondary-section-text-second: clamp(10px, 4.6875vw, 30px);
    --font-size-secondary-card-text: clamp(10px, 4.6875vw, 30px); /* 30px at 640px screen */
    --font-size-secondary-overlay: clamp(20px, 7vw, 44.8px);
    /* 150px at 640px screen width */
    --font-size-secondary-number: clamp(10px, 23.4375vw, 150px);
    --font-size-secondary-number-large: clamp(18px, 6.5vw, 104px);
    --font-size-secondary-number-large-stat: clamp(18px, 6.5vw, 104px);
    /* 140px at 640px screen width */
    --font-size-secondary-unit: clamp(9px, 20vw, 128px); /* 128px at 640px screen */
    --font-size-secondary-stat-unit: clamp(8px, 9.8vw, 62px);

    /* Tertiary section font sizes (60px / 42px at 640px) */
    --font-size-tertiary-title: clamp(18px, 8.90625vw, 57px);
    --font-size-tertiary-subtitle: clamp(13px, 6.09375vw, 39px); /* 39px at 640px screen */
    --font-size-tertiary-grid-title: clamp(10px, 6.09vw, 39px);
    --font-size-tertiary-grid-text: clamp(10px, 6.09vw, 39px);
    --font-size-tertiary-overlay-text: clamp(11px, 3.5vw, 22px);

    /* Fourth section font sizes (mobile, 1440px → 640px scaling) */
    --font-size-fourth-title: clamp(18px, 8.90625vw, 57px);
    --font-size-fourth-subtitle: clamp(12px, 6.09375vw, 39px); /* 39px at 640px screen */
    --font-size-fourth-grid-text: clamp(12px, 6.09375vw, 39px); /* 39px at 640px screen */
    --font-size-fourth-overlay-text: clamp(10px, 3.75vw, 24px);
    --font-size-fourth-overlay-text-chat-box: clamp(9px, 2.8125vw, 18px);

    /* Fifth section font sizes (mobile, 1440px → 640px scaling) */
    --font-size-fifth-title: clamp(18px, 8.90625vw, 57px);
    --font-size-fifth-card-text: clamp(13px, 6.3vw, 34px); /* 34px at 640px screen */

    /* Sixth section font sizes (mobile, 640px base) */
    --font-size-sixth-title: clamp(18px, 8.90625vw, 57px);
    --font-size-sixth-text: clamp(12px, 6.09375vw, 39px); /* 39px at 640px screen */

    /* Seventh section font sizes (mobile, 640px base) */
    --font-size-seventh-title: clamp(18px, 8.90625vw, 57px);
    --font-size-seventh-text: clamp(12px, 6.09375vw, 39px); /* 39px at 640px screen */

    /* Eighth section font sizes (mobile, 640px base) */
    --font-size-eighth-title: clamp(18px, 8.90625vw, 57px);
    --font-size-eighth-card-text: clamp(10px, 4.84375vw, 31px);

    /* Final section font sizes (mobile, 640px base) */
    --font-size-final-text: clamp(9px, 3.59375vw, 23px);
  }

  .page > section {
    /* 80px at 640px screen */
    padding-top: clamp(16px, 12.5vw, 80px);
    /* 92px at 640px screen */
    padding-bottom: clamp(24px, 14.375vw, 92px);
  }

  .page {
    padding-block: clamp(18px, 5vw, 32px) 0px;
  }

  .hero {
    margin-left: clamp(16px, 5.38vw, 31px);
    margin-right: clamp(16px, 5.38vw, 31px);
    width: clamp(220px, 90vw, 576px);
  }

  .feature-grid {
    padding-inline: clamp(18px, 5vw, 32px);;
  }

  /* Hero section */

  .hero {
    background-image: url("../feedImages/mobile_4.png");
    aspect-ratio: 576 / 721;
    background-size: cover;
  }

  .hero__title-group {
    column-gap: clamp(0px, 29.14vw, 186.5px);
    margin-right: clamp(10px, 2.8125vw, 18px);
  }

  .hero__subtitle {
    margin-top: clamp(0px, 0.9375vw, 6px);
  }

  /* Feature grid section */

  .feature-grid__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-rows: min-content;
    /* 48px at 640px screen */
    column-gap: clamp(12px, 7.5vw, 48px);
    /* 40px at 640px screen */
    /* 85px at 640px screen */
    margin-top: clamp(16px, 13.28125vw, 85px);
  }

  .feature-card {
    min-height: 0;
    overflow: visible;
  }

  .feature-card--center {
    grid-column: 1 / -1;
  }

  .feature-card__image {
    width: 100%;
  }
  
  .feature-card:nth-child(1) .feature-card__image,
  .feature-card:nth-child(2) .feature-card__image,
  .feature-card:nth-child(4) .feature-card__image,
  .feature-card:nth-child(5) .feature-card__image {
    height: clamp(0px, 52.8125vw, 338px);
  }
  
  .feature-card:nth-child(1) .feature-card__image,
  .feature-card:nth-child(2) .feature-card__image img,
  .feature-card:nth-child(4) .feature-card__image img,
  .feature-card:nth-child(5) .feature-card__image img {
    height: clamp(0px, 52.8125vw, 338px);
    aspect-ratio: 263 / 338;
    object-fit: cover;
    display: block;
  }

  .feature-card:nth-child(1) .feature-card__image, .feature-card:nth-child(1) .feature-card__image img {
    background-color: rgba(225, 218, 255, 1);
    object-fit: unset;
    vertical-align: bottom;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-end;
  }

  .feature-card__image, .feature-card__image img {
    border-radius: 50px;
  }
  
  .feature-card__title {
    margin-top: clamp(12px, 4.219vw, 27px); /* 27px at 640px screen */
    word-wrap: break-word;
    overflow-wrap: break-word;
    hyphens: auto;
  }

  /* Secondary section */
  .secondary-section {
    padding-bottom: clamp(23px, 10.9375vw, 70px); /* 70px at 640px */
  }
  .secondary-section__block--first {
    margin-bottom: clamp(0px, 9.375vw, 60px); /* 60px at 640px */
  }

  .secondary-section__block--first .secondary-section__title {
    margin-bottom: clamp(0px, 7.8125vw, 50px) !important; /* 50px at 640px */
  }

  .secondary-section__block--second .secondary-section__title {
    margin-bottom: clamp(0px, 6.25vw, 40px) !important; /* 40px in 640px screen */
  }

  .secondary-section__block--first .secondary-section__image {
    margin-bottom: clamp(0px, 6.25vw, 40px); /* 40px in 640px screen */
  }

  .secondary-section__title {
    width: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
    margin-right: auto;
    margin-left: auto;
  }

  /* Secondary section lead text on mobile */
  .secondary-section__text {
    width: auto;
    max-width: 100%;
    margin: 0 auto;
    padding-inline: max(22px, 6vw);
    font-size: clamp(30px, 6.09375vw, 39px); /* 39px at 640px screen */
  }

  .secondary-section__block--first .secondary-section__text {
    margin-bottom: clamp(0px, 7.813vw, 50px); /* 50px max at 640px screen */
  }

  .secondary-section__cards {
    flex-direction: column;
    align-items: center;
    gap: clamp(20px, 15.625vw, 100px); /* 100px at 640px screen */
  }

  .secondary-section .secondary-section__cards {
    padding-inline: clamp(0px, 5vw, 32px);
  }

  /* First set of cards in second section (mobile) */
  .secondary-section__cards--first {
    gap: 32px;
  }

  .secondary-section__cards--first .secondary-card {
    padding: clamp(12px, 4.6875vw, 32px) clamp(12px, 4.6875vw, 32px) clamp(10px, 9.375vw, 60px);
    min-height: clamp(200px, 65.3125vw, 418px); /* 418px out of 640px screen wide (418/640 = 65.3125vw) */
    border-radius: clamp(0px, 7.8125vw, 50px);
  }
  .secondary-section__cards--first .secondary-card {
    justify-content: center;
  }

  /* Stack and align the second set of 3 cards correctly on mobile */
  .secondary-section__cards--second {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-inline: clamp(0px, 5vw, 32px);
    width: 100%;
  }

  .secondary-section__cards--second .secondary-card__text {
    font-size: clamp(10px, 6.09vw, 39px);
  }

  .secondary-card {
    width: 100%;
    max-width: 100%;
    height: auto;
    padding-top: 0px;
  }

  .secondary-card--no-bg {
    width: 100%;
    max-width: 100%;
  }

  /* Second set of 3 cards: full-width images with rounded corners on mobile */
  .secondary-section__cards--second .secondary-card--no-bg {
    max-width: 100%;
  }
  .secondary-section__cards--second .secondary-card--no-bg .secondary-card__image {
    width: 100%;
    overflow: hidden;
    border-radius: clamp(0px, 7.8125vw, 50px);
    margin-bottom: 0px;
  }

  .secondary-section__cards--second .secondary-card--no-bg .secondary-card__image img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: clamp(0px, 7.8125vw, 50px);
    margin-bottom: clamp(16px, 6.875vw, 44px); /* 44px at 640px screen */
  }

  .secondary-card--first .secondary-card__content {
    padding: 0px
  }

  /* Images container for proper positioning */
  .secondary-card__images-container {
    top: 0px;
    position: absolute;
    /* margin-top: 60px at 320px, 25px at 640px */
    margin-top: 0px;
    /* left: 35px at 320px, 165px at 640px */
    left: clamp(35px, calc((165 - 35) * ((100vw - 320px) / (640 - 320)) + 35px), 165px);
  }

  .secondary-card__image--right {
    width: 119px;
    margin-top: 30px;
    margin-left: 95px
  }
  .secondary-card--second {
    justify-content: start;
  }
  .secondary-card--second .secondary-card__text-overlay {
    padding-top: 75px;
  }
  .secondary-card__image--left {
    width: 113px;
  }
  .secondary-card__text-overlay,
  .secondary-card--second .secondary-card__digit,
  .secondary-card__stat-number {
    font-size: var(--font-size-secondary-unit);
  }
  .secondary-card__stat-unit {
    margin-top: clamp(-21px, -3.28vw, 0px);
    border: 4px solid var(--color-text-mint);
    border-radius: 10px;
  }

  /* Tertiary section */

  .tertiary-section {
    padding-top: max(30px, 4.6875vw);
    padding-bottom: max(80px, 20vw);
  }

  .tertiary-section__inner {
    gap: max(28px, 7vw);
    align-items: center;
  }

  /* Center title + subtitle on mobile */
  .tertiary-section__header {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    width: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
  }
  .tertiary-section__image--1 img {
    width: 102%;
  }

  .tertiary-section__title {
    font-size: var(--font-size-tertiary-title);
    font-weight: 500;
    margin-bottom: max(20px, 5vw);
  }

  .tertiary-section__subtitle {
    margin-top: max(12px, 3vw);
    font-size: var(--font-size-tertiary-subtitle);
    font-weight: 500;
    max-width: clamp(0px, 80vw, 511px);
    margin: 0 auto;
    
  }

  .tertiary-section__title-secondary {
    margin-top: max(28px, 7vw);
    text-align: left;
    margin-left: 0;
    margin-right: 0;
    font-size: var(--font-size-tertiary-grid-title);
  }
  .tertiary-section__image:not(.tertiary-section__image--1) img {
    border-radius: 50px
  }

  /* Content after the second image should be inset 32px from the sides */
  .tertiary-section__content {
    /* 32px at 640px screen width */
    margin-inline: max(16px, 5vw);
  }
  
  /* Stack grid items as single-column rows on mobile */
  .tertiary-section__grid {
    grid-template-columns: minmax(0, 1fr);
    row-gap: clamp(20px, 18.75vw, 120px);
    column-gap: 0;
    margin-top: clamp(20px, 18.906vw, 121px);
  }
  .tertiary-card {
    gap: clamp(12px, 6.875vw, 44px); /* 44px at 640px screen */
  }
  .tertiary-section__grid .tertiary-card:nth-child(2) {
    margin-top: 0px;
  }
  .tertiary-card__text {
    text-align: left;
    font-weight: 500;
  }
  .tertiary-card__image {
    border-radius: clamp(0px, 7.8125vw, 50px);
  }


  .tertiary-card__overlay-text {
    font-size: var(--font-size-tertiary-overlay-text);
    max-width: 95%;
    background-color: rgba(34, 34, 34, 0.9);
    border-radius: 10px;
    padding: 12.5px max(12px, 3vw);
    color: rgba(255, 255, 255, 0.85);
    margin-top: clamp(18px, 7.03125vw, 45px);
  }

  /* Fourth section (mobile layout) */

  .fourth-section {
    padding-top: max(30px, 4.6875vw);
    padding-bottom: max(80px, 20vw);
  }

  .fourth-section__inner {
    padding-inline: clamp(18px, 5vw, 32px);
    gap: max(28px, 7vw);
  }

  /* Center title + subtitle on mobile */
  .fourth-section__header {
    text-align: center;
    margin-left: max(16px, 5vw);
    margin-right: max(16px, 5vw);
  }

  .fourth-section__title {
    font-size: var(--font-size-fourth-title);
    font-weight: 500;
    margin-bottom: max(20px, 5vw);
  }

  .fourth-section__subtitle {
    margin-top: max(12px, 3vw);
    font-size: var(--font-size-fourth-subtitle);
    font-weight: 500;
  }

  .fourth-section__hero {
    margin-top: 0px;
  }

  /* Overlay adjustments for mobile */
  .fourth-section__overlay {
    padding: max(16px, 4vw);
    flex-direction: column;
    align-items: center;
    gap: max(16px, 4vw);
  }

  .fourth-section__label {
    max-width: 375px;
    width: 100%;
    text-align: center;
    font-size: var(--font-size-fourth-overlay-text) !important;
    align-items: center;
  }

  .fourth-section__label--left {
    margin-top: 0;
    margin-left: 0;
  }

  .fourth-section__overlay-right {
    align-items: center;
    max-width: 100%;
    margin-right: 0;
    margin-top: 0;
  }

  .fourth-section__badge-image {
    width: clamp(24px, 7.03vw, 45px);   /* 45px at 640px */
    height: clamp(28px, 7.5vw, 48px);   /* 48px at 640px */
  }

  /* Content after hero image should be inset */
  .fourth-section__body {
    font-size: var(--font-size-fourth-grid-text);
    font-weight: 500;
    text-align: unset;
    margin-top: 0px
  }

  /* Stack grid items as single-column rows on mobile */
  .fourth-section__grid {
    margin-top: clamp(36px, 185vw, 90px);
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: clamp(24px, 18.9vw, 121px); /* 121px at 640px screen width */
    column-gap: 0;
  }
  .fourth-card {
    gap: clamp(12px, 6.875vw, 44px); /* 44px at 640px screen */
  }

  .fourth-card__text {
    font-size: var(--font-size-fourth-grid-text);
    font-weight: 500;
    text-align: left;
  }

  .fourth-card__image {
    border-radius: clamp(0px, 7.8125vw, 50px);
  }

  /* First card overlay text adjustments for mobile */
  .fourth-card__overlay {
    padding: max(16px, 4vw);
    align-items: start;
    justify-content: center;
  }

  .fourth-card__overlay-text {
    font-size: 11px !important;
    max-width: clamp(40px, 37.8125vw, 242px) !important;   /* 242px at 640px */
    margin-top: clamp(60px, 50vw, 320px) !important; /* 320px at 640px screen */
    height: clamp(60px, 22.65625vw, 145px);
    padding: 0.50rem;
    top: 11% !important;
  }
  .fourth-section__label--left {
    margin-top: clamp(24px, 3.90625vw, 25px);
    margin-left: 0px;
  
  }
  .fourth-section__label--right {
    padding-bottom: clamp(0px, calc((100vw - 320px) * 0.171875), 55px);
    margin-right: 0px
  }
  .fourth-section__image img {
    border-radius: clamp(0px, 7.8125vw, 50px);
  }

  /* Fifth section (mobile layout) */

  .fifth-section {
    padding-top: max(30px, 4.6875vw);
    padding-bottom: max(80px, 20vw);
  }

  .fifth-section__inner {
    padding-inline: clamp(18px, 5vw, 32px);;
  }

  .fifth-section__title {
    font-size: var(--font-size-fifth-title);
    font-weight: 500 !important;
    text-align: center;
    margin-right: clamp(16px, 6vw, 38px);
    margin-left: clamp(16px, 6vw, 38px);
  }

  .fifth-section__cards {
    margin-top: clamp(16px, 12.734375vw, 81.5px); /* 81.5px at 640px screen */
    margin-inline: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: clamp(20px, 7.1875vw, 46px); /* 46px at 640px screen */
    column-gap: 0;
  }

  .fifth-card {
    width: 100%;
    height: auto;
    padding: clamp(18px, 7.813vw, 50px); /* 50px max at 640px */
    border-radius: clamp(28px, 7.813vw, 50px); /* 50px at 640px screen width */
    gap: clamp(10px, 3vw, 18px);
  }

  .fifth-card__text {
    font-size: var(--font-size-fifth-card-text);
    text-align: left;
    margin-right: clamp(10px, 9.6875vw, 62px); /* 62px max at 640px */
  }
  .fifth-card__image {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .fifth-card__image img {
    width: unset;
  }

  /* First fifth-card image: 91 by 64px, aligned to the left */
  .fifth-card:first-child .fifth-card__image {
    aspect-ratio: 91 / 64;
    width: 91px;
    height: 64px;
    justify-content: flex-start;
  }

  /* Second fifth-card image: 81 by 83px, aligned to the left */
  .fifth-card:nth-child(2) .fifth-card__image {
    aspect-ratio: 81 / 83;
    width: 81px;
    height: 83px;
    justify-content: flex-start;
  }

  /* Sixth section (mobile layout) */

  .sixth-section__inner {
    margin-inline: clamp(18px, 5vw, 32px);;
  }

  .sixth-section__title {
    font-size: var(--font-size-sixth-title);
    font-weight: 500;
    text-align: center;    
    line-height: 1.1;

  }

  .sixth-section__image {
    /* 576px × 576px container at 640px */
    width: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
    height: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
    /* 97px between title and image at 640px */
    margin-top: clamp(20px, 15.15625vw, 97px); /* 15.15625vw of 640px → 97px */
    border-radius: clamp(0px, 7.8125vw, 50px);
  }

  .sixth-section__image img {
    /* 576px × 576px image at 640px */
    width: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
    height: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
  }

  .sixth-section__text {
    font-size: var(--font-size-sixth-text);
    text-align: center;
    /* 44px between image and text at 640px */
    margin-top: clamp(16px, 6.875vw, 44px); /* 6.875vw of 640px → 44px */
    text-align: unset;
  }

  /* Seventh section (mobile layout) */

  .seventh-section__inner {
    margin-inline: clamp(18px, 5vw, 32px);;
  }

  .seventh-section__title {
    font-size: var(--font-size-seventh-title);
    font-weight: 500;
    text-align: center;
    line-height: 1.1;
  }

  .seventh-section__images {
    display: block;
    /* 97px between title and image at 640px */
    margin-top: clamp(20px, 15.15625vw, 97px); /* 15.15625vw of 640px → 97px */
  }

  .seventh-section__image--second,
  .seventh-section__image--third {
    display: none;
  }

  .seventh-section__image--first {
    /* 576px × 778px at 640px */
    width: clamp(280px, 90vw, 576px); /* 90vw of 640px → 576px */
    height: clamp(350px, 121.5625vw, 778px); /* 121.5625vw of 640px → 778px */
    border-radius: clamp(0px, 7.8125vw, 50px);
    display: block;
  }

  .seventh-section__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .seventh-section__text {
    font-size: var(--font-size-seventh-text);
    text-align: center;
    /* 44px between images and text at 640px */
    margin-top: clamp(16px, 6.875vw, 44px); /* 6.875vw of 640px → 44px */
    text-align: unset;
  }

  /* Eighth section (mobile layout) */

  .eighth-section__inner {
    padding-inline: clamp(18px, 5vw, 32px);;
  }

  .eighth-section__title {
    font-size: var(--font-size-eighth-title);
    font-weight: 500;
    text-align: center;
    line-height: 1.1;
  }

  .eighth-section__cards {
    flex-direction: column;
    width: 100%;
    gap: clamp(16px, 7.03125vw, 45px); /* 45px at 640px screen */
    /* 97px between title and cards at 640px */
    margin-top: clamp(20px, 15.15625vw, 97px); /* 15.15625vw of 640px → 97px */
  }

  .eighth-card {
    width: 100%;
    /* 337px height at 640px */
    min-height: clamp(200px, 52.65625vw, 337px); /* 52.65625vw of 640px → 337px */
    height: auto;
    padding-left: clamp(8px, 2.5vw, 16px);
    padding-right: clamp(8px, 2.5vw, 16px);
    padding-top: clamp(18px, 6vw, 38.5px);
    border-radius: clamp(0px, 7.8125vw, 50px);
  }

  .eighth-card--left .eighth-card__image {
    width: auto;
    height: auto;
    max-width: 100%;
  }

  .eighth-card--right .eighth-card__image {
    /* 298px × 62px at 640px */
    width: clamp(200px, 46.5625vw, 298px); /* 46.5625vw of 640px → 298px */
    height: clamp(40px, 9.6875vw, 62px); /* 9.6875vw of 640px → 62px */
  }
  .eighth-card__image img {
    width: clamp(100px, 46.5625vw, 298px); /* 298px at 640px wide screen */
    margin: 0 auto;
    height: 100%;
    object-fit: contain;
  }

  .eighth-card__text {
    max-width: none;
    /* 19px between image and text at 640px */
    margin-top: clamp(12px, 2.96875vw, 19px); /* 2.96875vw of 640px → 19px */
    font-size: var(--font-size-eighth-card-text);
    text-align: center;
  }

  .eighth-card--right .eighth-card__text {
    max-width: clamp(200px, 83.90625vw, 537px); /* 537px at 640px screen */
  }

  /* Final section (mobile layout) */
  .final-section__inner {
    margin-inline: clamp(18px, 4.0625vw, 26px);
  }
  .final-section__text {
    font-size: var(--font-size-final-text);
    color: #9aa0a6;
    text-align: center;
  }
  .hero__title {
    font-size:  var(--font-size-hero-title) !important;
  }
}