/* =========================================================
   GLOBAL RESET
   ========================================================= */

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden;
}

body {
  background-color: #ffffff;
}

/* =========================================================
   CONTACT US PAGE
   ========================================================= */

.contact-us {
  background-color: #ffffff;
  overflow: hidden;
  width: 1440px;
  min-width: 0;
  min-height: 4766px;
  height: auto;
  position: relative;
}

/* =========================================================
   FIRST CONTENT GROUP
   ========================================================= */

.contact-us .group {
  top: 2448px;
  left: calc(50% - 572px);
  width: 1119px;
  height: 621px;
  gap: 71px;
  position: absolute;
  display: flex;
  flex-direction: column;
}

.contact-us .image-6 {
  width: 100%;
  height: 370px;
  flex: none;
  display: flex;
  justify-content: center;
  border-radius: 8px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.contact-us .feedback-reviews-2 {
  margin-top: 105px;
  width: 392px;
  height: 160px;
  margin-left: 1px;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  color: #000000;
  font-size: var(--heading-font-size);
  text-align: center;
  letter-spacing: var(--heading-letter-spacing);
  line-height: var(--heading-line-height);
  font-style: var(--heading-font-style);
}

.contact-us .your-experiences {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: -2px;
  height: 180px;
  width: 733px;
  align-self: center;
  font-family: "Inter", Helvetica, sans-serif;
  font-weight: 400;
  color: #000000bf;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0;
  line-height: 36px;
}

/* =========================================================
   SECOND CONTENT GROUP
   ========================================================= */

.contact-us .group-2 {
  top: 1643px;
  left: calc(50% - 559px);
  width: 1119px;
  height: 636px;
  gap: 50px;
  position: absolute;
  display: flex;
  flex-direction: column;
}

.contact-us .text-wrapper-49 {
  margin-top: 139px;
  width: 392px;
  height: 91px;
  margin-left: 1px;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  color: #000000;
  font-size: var(--heading-font-size);
  text-align: center;
  letter-spacing: var(--heading-letter-spacing);
  line-height: var(--heading-line-height);
  font-style: var(--heading-font-style);
}

.contact-us .whether-you-re {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: -28px;
  height: 216px;
  width: 733px;
  align-self: center;
  font-family: "Inter", Helvetica, sans-serif;
  font-weight: 400;
  color: #000000bf;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0;
  line-height: 36px;
}

/* =========================================================
   THIRD CONTENT GROUP
   ========================================================= */

.contact-us .group-3 {
  top: 756px;
  left: calc(50% - 559px);
  width: 1119px;
  height: 675px;
  gap: 53px;
  position: absolute;
  display: flex;
  flex-direction: column;
}

.contact-us .text-wrapper-50 {
  margin-top: 155px;
  width: 392px;
  height: 60px;
  margin-left: 1px;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  color: #000000;
  font-size: var(--heading-font-size);
  text-align: center;
  letter-spacing: var(--heading-letter-spacing);
  line-height: var(--heading-line-height);
  font-style: var(--heading-font-style);
}

.contact-us .from-intimate {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: -2px;
  height: 252px;
  width: 733px;
  align-self: center;
  font-family: "Inter", Helvetica, sans-serif;
  font-weight: 400;
  color: #000000bf;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0;
  line-height: 36px;
}

/* =========================================================
   ARTICLE TITLE
   ========================================================= */

.contact-us .article-title {
  display: flex;
  flex-direction: column;
  width: 1105px;
  height: 468px;
  align-items: flex-start;
  justify-content: center;
  gap: var(--variable-collection-spacing-s);
  position: absolute;
  top: 288px;
  left: calc(50% - 559px);
}

.contact-us .text-wrapper-51 {
  position: relative;
  align-self: stretch;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  color: #000000;
  font-size: var(--title-font-size);
  text-align: center;
  letter-spacing: var(--title-letter-spacing);
  line-height: var(--title-line-height);
  font-style: var(--title-font-style);
}

.contact-us .your-doorway-into {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  font-family: "Inter", Helvetica, sans-serif;
  font-weight: 400;
  color: #000000bf;
  font-size: 24px;
  text-align: center;
  letter-spacing: 0;
  line-height: 36px;
}

/* =========================================================
   NAVIGATION
   ========================================================= */

.contact-us .navigation-6 {
  position: absolute;
  width: calc(100% - 858px);
  top: 0;
  left: 870px;
  height: 164px;
  display: flex;
  justify-content: flex-end;
  background-color: #ffffff;
}

.contact-us .items-25 {
  display: inline-flex;
  margin-top: 56px;
  width: 465px;
  height: 52px;
  margin-right: 80px;
  position: relative;
  align-items: center;
  justify-content: flex-end;
  gap: var(--variable-collection-spacing-m);
}

.contact-us .text-wrapper-52 {
  position: relative;
  display: flex;
  align-items: center;
  width: fit-content;
  font-family: var(--body-text-font-family);
  font-weight: var(--body-text-font-weight);
  color: #000000;
  font-size: var(--body-text-font-size);
  letter-spacing: var(--body-text-letter-spacing);
  line-height: var(--body-text-line-height);
  white-space: nowrap;
  font-style: var(--body-text-font-style);
}

.contact-us .button-11 {
  all: unset;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 24px;
  position: relative;
  flex: 0 0 auto;
  background-color: #000000;
  border-radius: 8px;
  box-shadow: var(--button-shadow);
  cursor: pointer;
}

.contact-us .text-wrapper-53 {
  position: relative;
  display: flex;
  align-items: center;
  width: fit-content;
  margin-top: -1px;
  font-family: var(--small-text-font-family);
  font-weight: var(--small-text-font-weight);
  color: #ffffff;
  font-size: var(--small-text-font-size);
  letter-spacing: var(--small-text-letter-spacing);
  line-height: var(--small-text-line-height);
  white-space: nowrap;
  font-style: var(--small-text-font-style);
}

/* =========================================================
   CARD GROUP
   ========================================================= */

.contact-us .group-4 {
  top: 3916px;
  left: 61px;
  width: 1278px;
  height: 549px;
  gap: 71px;
  position: absolute;
  display: flex;
  flex-direction: column;
}

.contact-us .text-wrapper-54 {
  margin-left: 8px;
  width: 625px;
  height: 44px;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  color: #000000;
  font-size: var(--heading-font-size);
  letter-spacing: var(--heading-letter-spacing);
  line-height: var(--heading-line-height);
  font-style: var(--heading-font-style);
}

.contact-us .cards {
  display: inline-flex;
  width: 1276px;
  height: 434px;
  position: relative;
  align-items: flex-start;
  gap: var(--variable-collection-spacing-SM);
}

.contact-us .card {
  display: flex;
  flex-direction: column;
  width: 404px;
  align-items: flex-start;
  gap: 24px;
  position: relative;
}

.contact-us .img-2 {
  position: relative;
  width: 404px;
  height: 346px;
  object-fit: cover;
}

.contact-us .copy-6 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  position: relative;
  align-self: stretch;
  width: 100%;
  flex: 0 0 auto;
}

.contact-us .copy-6 > a {
  display: block;
  width: 100%;
  text-align: center;
}

.contact-us .text-wrapper-55 {
  position: relative;
  width: 100%;
  align-self: stretch;
  margin-top: -1px;
  font-family: var(--body-text-font-family);
  font-weight: var(--body-text-font-weight);
  color: #000000;
  font-size: var(--body-text-font-size);
  text-align: center;
  letter-spacing: var(--body-text-letter-spacing);
  line-height: var(--body-text-line-height);
  text-decoration: underline;
  font-style: var(--body-text-font-style);
}

.contact-us .card-2 {
  display: flex;
  flex-direction: column;
  width: 404px;
  height: 434px;
  align-items: flex-start;
  gap: 24px;
  position: relative;
}


/* =========================================================
   CENTER CARD LABELS
   Keep the clickable label centered under each image.
   ========================================================= */

.contact-us .cards .copy-6 > a,
.contact-us .cards-2 .copy-6 > a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  text-align: center;
}

.contact-us .cards .copy-6 .text-wrapper-55,
.contact-us .cards-2 .copy-6 .text-wrapper-55 {
  width: auto;
  min-width: 0;
  text-align: center;
}

/* =========================================================
   SECOND CARD SECTION
   ========================================================= */

.contact-us .text-wrapper-56 {
  position: absolute;
  top: 3274px;
  left: 60px;
  width: 625px;
  font-family: var(--heading-font-family);
  font-weight: var(--heading-font-weight);
  color: #000000;
  font-size: var(--heading-font-size);
  letter-spacing: var(--heading-letter-spacing);
  line-height: var(--heading-line-height);
  font-style: var(--heading-font-style);
}

.contact-us .cards-2 {
  display: inline-flex;
  align-items: flex-start;
  gap: var(--variable-collection-spacing-SM);
  position: absolute;
  top: 3366px;
  left: 61px;
}

/* =========================================================
   BRAND IMAGE AND BLACK BAR
   ========================================================= */

.contact-us .engraved-company-7 {
  position: absolute;
  top: 0;
  left: 0;
  width: 486px;
  height: 434px;
  aspect-ratio: 1;
  object-fit: cover;
}

.contact-us .rectangle-7 {
  position: absolute;
  top: 159px;
  left: 467px;
  width: 938px;
  height: 10px;
  background-color: #000000;
}

/* =========================================================
   DESKTOP VIEWPORT FIT
   Preserves the original Figma layout on desktop.
   ========================================================= */

@media (max-width: 1440px) and (min-width: 769px) {
  .contact-us {
    width: 1440px;
    min-width: 0;
    max-width: none;
    zoom: calc(100vw / 1440);
  }
}

/* =========================================================
   TABLET RESPONSIVE STYLES
   ========================================================= */

@media (max-width: 768px) {

  .contact-us {
    width: 100%;
    min-width: 0;
    min-height: 0;
    height: auto;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 50px;
  }

  /* ---------------------------------------------------------
     BRAND IMAGE
     --------------------------------------------------------- */

  .contact-us .engraved-company-7 {
    position: relative;
    top: auto;
    left: auto;
    width: min(100%, 360px);
    height: auto;
    margin: 0 auto;
    object-fit: contain;
  }

  /* ---------------------------------------------------------
     NAVIGATION
     --------------------------------------------------------- */

  .contact-us .navigation-6 {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    overflow: visible;
  }

  .contact-us .items-25 {
    width: 100%;
    height: auto;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 16px;
  }

  .contact-us .text-wrapper-52 {
    font-size: 15px;
    line-height: 24px;
    white-space: normal;
  }

  .contact-us .button-11 {
    padding: 11px 18px;
  }

  .contact-us .text-wrapper-53 {
    font-size: 14px;
    line-height: 20px;
  }

  /* ---------------------------------------------------------
     BLACK DIVIDER
     --------------------------------------------------------- */

  .contact-us .rectangle-7 {
    position: relative;
    top: auto;
    left: auto;
    width: 92%;
    height: 6px;
    margin: 12px auto 22px;
  }

  /* ---------------------------------------------------------
     ARTICLE TITLE
     --------------------------------------------------------- */

  .contact-us .article-title {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 55px 20px 30px;
  }

  .contact-us .text-wrapper-51 {
    width: 100%;
    font-size: clamp(32px, 8vw, 54px);
    line-height: 1.15;
    text-align: center;
  }

  .contact-us .your-doorway-into {
    width: 100%;
    font-size: 18px;
    line-height: 28px;
    text-align: center;
  }

  /* ---------------------------------------------------------
     INQUIRY GROUPS
     --------------------------------------------------------- */

  .contact-us .group,
  .contact-us .group-2,
  .contact-us .group-3 {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 25px;
    margin: 35px 0 0;
    padding: 0 20px;
  }

  .contact-us .group-3 {
    margin-top: 30px;
  }

  .contact-us .group-2 {
    margin-top: 30px;
  }

  .contact-us .group {
    margin-top: 30px;
  }

  /*
     Apply the inquiry-image treatment to ALL THREE images.
     This is the correction to the CSS you originally pasted.
  */

  .contact-us .group .image-6,
  .contact-us .group-2 .image-6,
  .contact-us .group-3 .image-6 {
    order: 1;
    width: 100%;
    max-width: 560px;
    height: 280px;
    min-height: 0;
    flex: none;
    border-radius: 8px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
  }

  .contact-us .feedback-reviews-2,
  .contact-us .text-wrapper-49,
  .contact-us .text-wrapper-50 {
    order: 2;
    width: 100%;
    height: auto;
    margin: 0;
    font-size: clamp(28px, 7vw, 42px);
    line-height: 1.2;
    text-align: center;
  }

  .contact-us .your-experiences,
  .contact-us .whether-you-re,
  .contact-us .from-intimate {
    order: 3;
    width: 100%;
    height: auto;
    min-height: 0;
    margin: 0;
    font-size: 17px;
    line-height: 28px;
    text-align: center;
  }

  /* ---------------------------------------------------------
     CARDS / SHOPS / SOCIAL
     --------------------------------------------------------- */

  .contact-us .group-4 {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    gap: 30px;
    margin: 70px 0 0;
    padding: 0 20px;
  }

  .contact-us .text-wrapper-54,
  .contact-us .text-wrapper-56 {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    margin: 0;
    font-size: clamp(28px, 7vw, 40px);
    line-height: 1.2;
    text-align: center;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
  }

  .contact-us .cards,
  .contact-us .cards-2 {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 35px;
  }

  .contact-us .card,
  .contact-us .card-2 {
    width: 100%;
    max-width: 404px;
    height: auto;
    align-items: center;
    gap: 18px;
  }

  .contact-us .img-2 {
    width: 100%;
    max-width: 404px;
    height: auto;
    aspect-ratio: 404 / 346;
    object-fit: cover;
  }

  .contact-us .copy-6 {
    width: 100%;
    align-items: center;
  }

  .contact-us .text-wrapper-55 {
    font-size: 16px;
    line-height: 24px;
    text-align: center;
  }

  /* ---------------------------------------------------------
     MOBILE FOOTER
     --------------------------------------------------------- */

  .contact-us .navigation-footer-contact.site-footer {
    position: relative;
    left: auto;
    bottom: auto;
    width: 100%;
    height: auto;
    min-height: 0;
    margin-top: 70px;
  }
}

/* =========================================================
   SMALL PHONE STYLES
   ========================================================= */

@media (max-width: 480px) {

  .contact-us .navigation-6 {
    padding: 16px 12px;
  }

  .contact-us .items-25 {
    gap: 12px;
  }

  .contact-us .text-wrapper-52 {
    font-size: 14px;
    line-height: 20px;
  }

  .contact-us .button-11 {
    padding: 10px 15px;
  }

  .contact-us .text-wrapper-53 {
    font-size: 13px;
  }

  .contact-us .engraved-company-7 {
    width: min(100%, 300px);
  }

  .contact-us .article-title {
    padding: 45px 16px 25px;
  }

  .contact-us .text-wrapper-51 {
    font-size: clamp(28px, 9vw, 42px);
  }

  .contact-us .your-doorway-into {
    font-size: 16px;
    line-height: 25px;
  }

  .contact-us .group,
  .contact-us .group-2,
  .contact-us .group-3 {
    padding: 0 16px;
    gap: 20px;
  }

  .contact-us .group .image-6,
  .contact-us .group-2 .image-6,
  .contact-us .group-3 .image-6 {
    height: 220px;
  }

  .contact-us .feedback-reviews-2,
  .contact-us .text-wrapper-49,
  .contact-us .text-wrapper-50 {
    font-size: clamp(25px, 8vw, 34px);
  }

  .contact-us .your-experiences,
  .contact-us .whether-you-re,
  .contact-us .from-intimate {
    font-size: 15px;
    line-height: 25px;
  }

  .contact-us .group-4 {
    margin-top: 55px;
    padding: 0 16px;
  }

  .contact-us .text-wrapper-54,
  .contact-us .text-wrapper-56 {
    font-size: clamp(25px, 8vw, 34px);
  }

  .contact-us .cards,
  .contact-us .cards-2 {
    gap: 28px;
  }

  .contact-us .card,
  .contact-us .card-2 {
    gap: 14px;
  }

  .contact-us .text-wrapper-55 {
    font-size: 15px;
    line-height: 22px;
  }
}

/* =========================================================
   LINK STYLING
   ========================================================= */

a[href="index.html"] {
  color: inherit;
  text-decoration: inherit;
}

/* =========================================================
   SHARED FOOTER
   ========================================================= */

.contact-us .navigation-footer-contact.site-footer {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 264px;
  background-color: #ffffff;
}

@media (max-width: 768px) {

  .contact-us .navigation-footer-contact.site-footer {
    position: relative;
    left: auto;
    bottom: auto;
    width: 100%;
    height: auto;
    min-height: 0;
    margin-top: 70px;
  }

}
/* =========================================================
   CONTACT US — DESKTOP RESTORATION
   ---------------------------------------------------------
   Desktop only.
   Does not affect the existing mobile corrections.
   ========================================================= */

@media (min-width: 769px) {

  /* -------------------------------------------------------
     CONTACT PAGE BASE
     ------------------------------------------------------- */

  .contact-us {
    position: relative;
    overflow: hidden;
  }


  /* -------------------------------------------------------
     LOGO
     ------------------------------------------------------- */

  .contact-us > a:has(.engraved-company-7) {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 486px;
    height: 434px;
    z-index: 10;
  }

  .contact-us .engraved-company-7 {
    position: absolute;
    top: 0;
    left: 0;
    width: 486px;
    height: 434px;
    object-fit: cover;
    display: block;
  }


  /* -------------------------------------------------------
     NAVIGATION
     ------------------------------------------------------- */

  .contact-us > .navigation-6 {
    position: absolute;
    top: 0;
    left: 870px;
    width: calc(100% - 858px);
    height: 164px;

    display: flex;
    justify-content: flex-end;
    align-items: flex-start;

    background-color: #ffffff;

    z-index: 20;
  }

  .contact-us .items-25 {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;

    width: 465px;
    height: 52px;

    margin-top: 56px;
    margin-right: 80px;

    gap: var(--variable-collection-spacing-m);

    white-space: nowrap;
  }

  .contact-us .items-25 > a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .contact-us .text-wrapper-52 {
    white-space: nowrap;
  }


  /* -------------------------------------------------------
     BLACK DIVIDER
     ------------------------------------------------------- */

  .contact-us > .rectangle-7 {
    position: absolute;

    top: 159px;
    left: 467px;

    width: 938px;
    height: 10px;

    margin: 0;
    padding: 0;

    background-color: #000000;

    z-index: 30;
  }


  /* -------------------------------------------------------
     LET'S CONNECT
     ------------------------------------------------------- */

  .contact-us > .article-title {
    position: absolute;

    top: 288px;
    left: calc(50% - 559px);

    width: 1105px;
    height: 468px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: var(--variable-collection-spacing-s);

    z-index: 5;
  }

  .contact-us > .article-title .text-wrapper-51 {
    width: 100%;
    text-align: center;
  }

  .contact-us > .article-title .your-doorway-into {
    width: 100%;
    text-align: center;
  }


  /* =======================================================
     EVENT / CUSTOM / FEEDBACK GROUPS
     =======================================================

     Each group has this structure:

       image
       title
       paragraph

     The title is visually placed over the image while
     the paragraph remains underneath it.
     ======================================================= */


  /* -------------------------------------------------------
     EVENT INQUIRIES
     ------------------------------------------------------- */

  .contact-us > .group-3 {
    position: absolute;

    top: 756px;
    left: calc(50% - 559px);

    width: 1119px;
    height: 675px;

    display: flex;
    flex-direction: column;

    gap: 53px;

    z-index: 4;
  }

  .contact-us > .group-3 .image-6 {
    position: relative;

    width: 100%;
    height: 370px;

    flex: 0 0 370px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;
    overflow: hidden;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .contact-us > .group-3 .text-wrapper-50 {
    position: absolute;

    top: 50%;
    left: 50%;

    width: 90%;
    height: auto;

    margin: 0;

    transform: translate(-50%, -50%);

    display: block;

    text-align: center;

    z-index: 2;
  }

  .contact-us > .group-3 .from-intimate {
    width: 733px;
    height: 252px;

    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    align-self: center;

    text-align: center;
  }


  /* -------------------------------------------------------
     CUSTOM PROJECT INQUIRIES
     ------------------------------------------------------- */

  .contact-us > .group-2 {
    position: absolute;

    top: 1643px;
    left: calc(50% - 559px);

    width: 1119px;
    height: 636px;

    display: flex;
    flex-direction: column;

    gap: 50px;

    z-index: 4;
  }

  .contact-us > .group-2 .image-6 {
    position: relative;

    width: 100%;
    height: 370px;

    flex: 0 0 370px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;
    overflow: hidden;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .contact-us > .group-2 .text-wrapper-49 {
    position: absolute;

    top: 50%;
    left: 50%;

    width: 90%;
    height: auto;

    margin: 0;

    transform: translate(-50%, -50%);

    display: block;

    text-align: center;

    z-index: 2;
  }

  .contact-us > .group-2 .whether-you-re {
    width: 733px;
    height: 216px;

    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    align-self: center;

    text-align: center;
  }


  /* -------------------------------------------------------
     FEEDBACK & REVIEWS
     ------------------------------------------------------- */

  .contact-us > .group {
    position: absolute;

    top: 2448px;
    left: calc(50% - 572px);

    width: 1119px;
    height: 621px;

    display: flex;
    flex-direction: column;

    gap: 71px;

    z-index: 4;
  }

  .contact-us > .group .image-6 {
    position: relative;

    width: 100%;
    height: 370px;

    flex: 0 0 370px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 8px;
    overflow: hidden;

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  }

  .contact-us > .group .feedback-reviews-2 {
    position: absolute;

    top: 50%;
    left: 50%;

    width: 90%;
    height: auto;

    margin: 0;

    transform: translate(-50%, -50%);

    display: block;

    text-align: center;

    z-index: 2;
  }

  .contact-us > .group .your-experiences {
    width: 733px;
    height: 180px;

    margin: 0 auto;

    display: flex;
    align-items: center;
    justify-content: center;

    align-self: center;

    text-align: center;
  }


  /* -------------------------------------------------------
     SOCIAL MEDIA TITLE
     ------------------------------------------------------- */

  .contact-us > .text-wrapper-56 {
    position: absolute;

    top: 3274px;
    left: 60px;

    width: 625px;

    margin: 0;

    font-size: 36px;
    line-height: 1.2;
    font-weight: 700;

    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
  }


  /* -------------------------------------------------------
     SOCIAL MEDIA CARDS
     ------------------------------------------------------- */

  .contact-us > .cards-2 {
    position: absolute;

    top: 3366px;
    left: 61px;

    display: inline-flex;
    align-items: flex-start;

    gap: var(--variable-collection-spacing-SM);
  }


  /* -------------------------------------------------------
     SHOPS TITLE
     ------------------------------------------------------- */

  .contact-us > .group-4 {
    position: absolute;

    top: 3916px;
    left: 61px;

    width: 1278px;
    height: 549px;

    display: flex;
    flex-direction: column;

    gap: 71px;
  }

  .contact-us > .group-4 > .text-wrapper-54 {
    width: 625px;
    height: auto;

    margin: 0 0 0 8px;

    font-size: 36px;
    line-height: 1.2;
    font-weight: 700;

    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
  }


  /* -------------------------------------------------------
     SHOP CARDS
     ------------------------------------------------------- */

  .contact-us > .group-4 > .cards {
    display: inline-flex;

    width: 1276px;
    height: 434px;

    align-items: flex-start;

    gap: var(--variable-collection-spacing-SM);
  }


  /* -------------------------------------------------------
     CARD LABELS
     ------------------------------------------------------- */

  .contact-us .cards .copy-6 > a,
  .contact-us .cards-2 .copy-6 > a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 100%;

    text-align: center;
  }

  .contact-us .cards .copy-6 .text-wrapper-55,
  .contact-us .cards-2 .copy-6 .text-wrapper-55 {
    width: auto;
    min-width: 0;

    text-align: center;
  }

}