.homepage,
.homepage * {
  box-sizing: border-box;
}
.homepage {
  background: #ffffff;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  overflow: hidden;
}
.navbar {
  background: var(--color-primary-50, #f7f6f4);
  padding: 16px var(--main-padding, 120px) 16px var(--main-padding, 120px);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  align-self: stretch;
  flex-shrink: 0;
  height: 72px;
  position: relative;
  box-shadow: var(
    --shadow-elevation-1-box-shadow,
    0px 1px 4px 0px rgba(0, 0, 0, 0.14)
  );
  overflow: hidden;
}
.header {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  flex: 1;
  max-width: 1600px;
  position: relative;
}
.logo {
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.logo-new-1 {
  flex-shrink: 0;
  width: 178px;
  height: 40px;
  position: relative;
  overflow: hidden;
  aspect-ratio: 178/40;
}
.layer-1 {
  height: auto;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: visible;
}
.navmenu {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.navlink {
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-4px, 4px);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.label {
  color: var(--text-base-secondary, #59554f);
  text-align: left;
  font-family: var(
    --body-md-medium-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-md-medium-font-size, 14px);
  line-height: var(--body-md-medium-line-height, 20px);
  font-weight: var(--body-md-medium-font-weight, 600);
  position: relative;
}
.login {
  background: var(--bg-brand-primary, #24221f);
  border-radius: var(--radius-component-button, 8px);
  padding: var(--space-inset-4px, 4px) var(--space-inset-16px, 16px)
    var(--space-inset-4px, 4px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-8px, 8px);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.button {
  color: var(--text-base-inverse-primary, #fcfcfc);
  text-align: left;
  font-family: var(
    --component-web-button-small-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--component-web-button-small-font-size, 14px);
  line-height: var(--component-web-button-small-line-height, 24px);
  font-weight: var(--component-web-button-small-font-weight, 600);
  position: relative;
}
.hero-banner {
  padding: 0px var(--main-padding, 120px) 0px var(--main-padding, 120px);
  display: flex;
  flex-direction: column;
  gap: var(--number-20px, 20px);
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  height: var(--full-height, 952px);
  position: relative;
}
.hero-banner-content {
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.hero-banner-headline {
  display: flex;
  flex-direction: column;
  gap: var(--number-10px, 10px);
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.a-lantern-for-the-sky {
  color: var(--color-white-100, #f5f5f5);
  text-align: left;
  font-family: var(
    --display-1-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--display-1-regular-font-size, 80px);
  line-height: var(--display-1-regular-line-height, 88px);
  font-weight: var(--display-1-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.an-intention-for-the-soul {
  color: var(--color-white-100, #f5f5f5);
  text-align: left;
  font-family: var(--font-type-heading, "CrimsonText-Italic", sans-serif);
  font-size: var(--font-size-web-heading-h2, 40px);
  line-height: var(--font-line-height-web-heading-h2, 48px);
  font-weight: 400;
  font-style: italic;
  position: relative;
  align-self: stretch;
}
.a-signature-serenity-ritual-of-chiang-mai {
  color: var(--color-white-100, #f5f5f5);
  text-align: left;
  font-family: var(--font-type-body, "CrimsonText-Regular", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: 1px;
  font-weight: var(--font-weight-regular, 400);
  position: relative;
  align-self: stretch;
}
.line-1 {
  margin-top: -1px;
  border-style: solid;
  border-color: var(--color-gold-100, #e6e3d8);
  border-width: 1px 0 0 0;
  flex-shrink: 0;
  width: 132px;
  height: 0px;
  position: relative;
}
.hero-banner-subheading {
  display: flex;
  flex-direction: column;
  gap: 2px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.phor-khom-mae-taeng {
  color: var(--color-white-100, #f5f5f5);
  text-align: left;
  font-family: var(--h4-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h4-regular-font-size, 24px);
  line-height: var(--h4-regular-line-height, 32px);
  font-weight: var(--h4-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
._24-25-november-2026 {
  color: var(--color-white-100, #f5f5f5);
  text-align: left;
  font-family: var(--h4-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h4-regular-font-size, 24px);
  line-height: var(--h4-regular-line-height, 32px);
  font-weight: var(--h4-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.mae-taeng-chiang-mai-thailand {
  color: var(--color-white-100, #f5f5f5);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.button-brand-inverse {
  border-radius: var(--radius-component-button, 8px);
  border-style: solid;
  border-color: var(--border-brand-inverse-primary, #ffffff);
  border-width: 1px;
  padding: var(--space-inset-12px, 12px) var(--space-inset-24px, 24px)
    var(--space-inset-12px, 12px) var(--space-inset-24px, 24px);
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-8px, 8px);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.button2 {
  color: var(--text-base-inverse-primary, #fcfcfc);
  text-align: left;
  font-family: var(
    --component-web-button-base-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--component-web-button-base-font-size, 16px);
  line-height: var(--component-web-button-base-line-height, 24px);
  font-weight: var(--component-web-button-base-font-weight, 600);
  position: relative;
}
.story {
  background: var(--color-white-500, #ffffff);
  padding: var(--big-padding-top-bottom, 64px) var(--main-padding, 120px)
    var(--number-64px, 64px) var(--main-padding, 120px);
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.story-headline {
  display: flex;
  flex-direction: column;
  gap: var(--number-20px, 20px);
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  flex-shrink: 0;
  min-width: 358px;
  max-width: 900px;
  position: relative;
}
.story-headline-category {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.the-story {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-Regular", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: var(--number-2px, 2px);
  font-weight: var(--font-weight-regular, 400);
  position: relative;
  align-self: stretch;
}
.line-12 {
  margin-top: -1px;
  border-style: solid;
  border-color: var(--divide, #e6e3d8);
  border-width: 1px 0 0 0;
  flex-shrink: 0;
  width: 132px;
  height: 0px;
  position: relative;
}
.not-just-a-festival {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --display-2-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--display-2-regular-font-size, 64px);
  line-height: var(--display-2-regular-line-height, 72px);
  font-weight: var(--display-2-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.story-subheadline {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.phor-khom-mae-taeng-is-more-than-a-festival-it-is-an-invitation-to-slow-down-to-look-closer-and-to-experience-mae-taeng-through-the-people-who-call-it-home {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.here-a-lantern-is-not-simply-something-we-release-into-the-sky-it-carries-an-intention-a-story-and-a-moment-of-reflection-around-it-unfolds-a-living-landscape-of-lanna-culture-local-craft-northern-food-traditional-knowledge-nature-and-the-warmth-of-community {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.we-believe-meaningful-travel-is-not-about-seeing-more-it-is-about-feeling-more {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.so-come-not-only-to-watch-the-lights-but-to-meet-the-hands-that-make-them-taste-the-food-that-carries-generations-of-memory-walk-through-the-landscape-and-share-an-evening-with-the-people-of-mae-taeng {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.this-is-a-journey-into-the-spirit-of-lanna-one-that-begins-with-a-lantern-but-stays-with-you-long-after-the-light-has-disappeared {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.phor-khom-mae-taeng-was-born-from-this-spirit {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-semibold-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-xl-semibold-font-size, 18px);
  line-height: var(--body-xl-semibold-line-height, 26px);
  font-weight: var(--body-xl-semibold-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.a-celebration-of-light-but-also-of-place-a-moment-to-honour-what-has-been-passed-down-to-appreciate-what-is-still-alive-today-and-to-imagine-what-we-can-carry-forward-together {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.come-for-the-lantern-stay-for-the-story-of-mae-taeng {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --h4-semibold-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--h4-semibold-font-size, 24px);
  line-height: var(--h4-semibold-line-height, 32px);
  font-weight: var(--h4-semibold-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.story2 {
  background: var(--color-primary-50, #f7f6f4);
  padding: var(--big-padding-top-bottom, 64px) var(--main-padding, 120px)
    var(--number-64px, 64px) var(--main-padding, 120px);
  display: flex;
  flex-direction: column;
  gap: 64px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.three-experiences-one-ceremony-a-memory-that-stays-with-you-forever {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h2-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h2-regular-font-size, 40px);
  line-height: var(--h2-regular-line-height, 48px);
  font-weight: var(--h2-regular-font-weight, 400);
  position: relative;
  width: 838px;
  max-width: 900px;
}
.frame-34 {
  display: flex;
  flex-direction: row;
  gap: 32px;
  align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
  align-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.lantern-journey-vdo {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  min-width: 358px;
  position: relative;
}
.frame-35 {
  background: var(--color-gold-100, #e6e3d8);
  border-radius: 8px;
  padding: 4px 16px 4px 16px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.lantern-journey-package {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h5-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h5-medium-font-size, 20px);
  line-height: var(--h5-medium-line-height, 28px);
  font-weight: var(--h5-medium-font-weight, 600);
  position: relative;
}
.video-player {
  background: #030303;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-end;
  flex-shrink: 0;
  width: 358px;
  height: 636px;
  position: relative;
  overflow: hidden;
  aspect-ratio: 358/636;
}
.player {
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.function {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.play-time {
  display: flex;
  flex-direction: row;
  gap: 21px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.play {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
._0-00-0-43 {
  color: #ffffff;
  text-align: left;
  font-family: "Inter-Medium", sans-serif;
  font-size: 16px;
  line-height: 150%;
  font-weight: 500;
  position: relative;
}
.actions {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.speaker {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.corners-out {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.dots-three-vertical {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.track {
  background: #4d4d4d;
  border-radius: 99px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  height: 6px;
  position: relative;
}
.time {
  background: #ffffff;
  border-radius: 99px;
  flex: 1;
  width: 75px;
  position: relative;
  overflow: hidden;
}
.serenity-journey-vdo {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  min-width: 358px;
  position: relative;
}
.frame-36 {
  background: var(--pink, #c7877e);
  border-radius: 8px;
  padding: 4px 16px 4px 16px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.serenity-journey-package {
  color: var(--color-white-500, #ffffff);
  text-align: center;
  font-family: var(--h5-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h5-medium-font-size, 20px);
  line-height: var(--h5-medium-line-height, 28px);
  font-weight: var(--h5-medium-font-weight, 600);
  position: relative;
}
.play2 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.speaker2 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.corners-out2 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.dots-three-vertical2 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.signature-journey-vdo {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  min-width: 358px;
  position: relative;
}
.frame-37 {
  background: var(--purple, #8c74a4);
  border-radius: 8px;
  padding: 4px 16px 4px 16px;
  display: flex;
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.signature-journey-package {
  color: var(--color-white-500, #ffffff);
  text-align: center;
  font-family: var(--h5-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h5-medium-font-size, 20px);
  line-height: var(--h5-medium-line-height, 28px);
  font-weight: var(--h5-medium-font-weight, 600);
  position: relative;
}
.play3 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.speaker3 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.corners-out3 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.dots-three-vertical3 {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.frame-38 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.service-table {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h2-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h2-regular-font-size, 40px);
  line-height: var(--h2-regular-line-height, 48px);
  font-weight: var(--h2-regular-font-weight, 400);
  position: relative;
  width: 838px;
}
.sample-table {
  background: var(--color-white-500, #ffffff);
  border-radius: var(--table-radiuscorner, 12px);
  border-style: solid;
  border-color: var(--color-grey-100, #dfe0e5);
  border-width: 1px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}
.row {
  background: var(--color-primary-950, #24221f);
  padding: 8px 0px 8px 0px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.table-cell-header {
  padding: var(--space-inset-8px, 8px) var(--space-inset-16px, 16px)
    var(--space-inset-8px, 8px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  position: relative;
}
.title {
  color: var(--color-white-500, #ffffff);
  text-align: center;
  font-family: var(
    --body-md-semibold-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-md-semibold-font-size, 14px);
  line-height: var(--body-md-semibold-line-height, 20px);
  font-weight: var(--body-md-semibold-font-weight, 600);
  position: relative;
}
.table-cell-header2 {
  padding: var(--space-inset-8px, 8px) var(--space-inset-16px, 16px)
    var(--space-inset-8px, 8px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: center;
  flex: 1;
  position: relative;
}
.row2 {
  border-style: solid;
  border-color: var(--border-base-primary, #dfe0e5);
  border-width: 0px 0px 1px 0px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.table-cell-content {
  padding: var(--space-inset-8px, 8px) var(--space-inset-16px, 16px)
    var(--space-inset-8px, 8px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  position: relative;
}
.text {
  color: var(--text-base-primary, #24221f);
  text-align: left;
  font-family: var(
    --body-md-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-md-regular-font-size, 14px);
  line-height: var(--body-md-regular-line-height, 20px);
  font-weight: var(--body-md-regular-font-weight, 400);
  position: relative;
}
.table-cell-content2 {
  padding: var(--space-inset-8px, 8px) var(--space-inset-16px, 16px)
    var(--space-inset-8px, 8px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: center;
  flex: 1;
  position: relative;
}
.icon-check {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check2 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check3 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.text2 {
  color: var(--text-base-primary, #24221f);
  text-align: left;
  font-family: var(
    --body-md-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-md-regular-font-size, 14px);
  line-height: var(--body-md-regular-line-height, 20px);
  font-weight: var(--body-md-regular-font-weight, 400);
  position: relative;
  flex: 1;
}
.icon-check4 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check5 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check6 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check7 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check8 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-x {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check9 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.table-cell-content3 {
  padding: var(--space-inset-8px, 8px) var(--space-inset-16px, 16px)
    var(--space-inset-8px, 8px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: flex-start;
  justify-content: center;
  flex: 1;
  position: relative;
}
.icon-x2 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-x3 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check10 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check11 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-x4 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check12 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-x5 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-x6 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.table-cell-content4 {
  padding: var(--space-inset-8px, 8px) var(--space-inset-16px, 16px)
    var(--space-inset-8px, 8px) var(--space-inset-16px, 16px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex: 1;
  position: relative;
}
.text3 {
  color: var(--text-base-primary, #24221f);
  text-align: center;
  font-family: var(
    --body-md-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-md-regular-font-size, 14px);
  line-height: var(--body-md-regular-line-height, 20px);
  font-weight: var(--body-md-regular-font-weight, 400);
  position: relative;
  flex: 1;
}
.icon-check13 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check14 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check15 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check16 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check17 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check18 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check19 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check20 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.icon-check21 {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  position: relative;
  overflow: visible;
}
.package {
  background: var(--color-primary-50, #f7f6f4);
  padding: 0px var(--main-padding, 120px) var(--big-padding-top-bottom, 64px)
    var(--main-padding, 120px);
  display: flex;
  flex-direction: column;
  gap: var(--space-gap-24px, 24px);
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.experience-headline-category {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.book-your-ticket {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-Regular", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: var(--number-2px, 2px);
  font-weight: var(--font-weight-regular, 400);
  position: relative;
  align-self: stretch;
}
.package-headline {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.choose-you-journey {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h1-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h1-regular-font-size, 48px);
  line-height: var(--h1-regular-line-height, 56px);
  font-weight: var(--h1-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.three-experiences-one-ceremony-a-memory-that-stays-with-you-forever2 {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.package-content {
  display: flex;
  flex-direction: row;
  gap: var(--gap, 24px);
  align-items: flex-start;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.package-card {
  background: var(--light-purple, #faf2ff);
  border-radius: var(--radius-base-rounded-16, 16px);
  border-style: solid;
  border-color: var(--color-gold-10, #9b7f4c);
  border-width: 1px;
  padding: var(--space-inset-24px, 24px) var(--number-null, 0px)
    var(--space-inset-24px, 24px) var(--number-null, 0px);
  display: flex;
  flex-direction: column;
  gap: var(--number-8px, 8px);
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  min-width: 282px;
  position: relative;
}
.package-card-header {
  padding: 0px var(--space-inset-20px, 20px) 0px var(--space-inset-20px, 20px);
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.package-card-header-headline {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.signature-journey {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: 2px;
  font-weight: var(--font-weight-medium, 600);
  text-transform: uppercase;
  position: relative;
}
.thb-9-500-person {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  text-transform: uppercase;
  position: relative;
}
.thb-9-500-person-span {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 32px;
  line-height: 28px;
  font-weight: 600;
}
.thb-9-500-person-span2 {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
}
.thb-9-500-person-span3 {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 16px;
  line-height: 28px;
  font-weight: 600;
}
.package-card-header-subheadline {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.the-finest-lanna-experience {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-Italic", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  font-weight: 400;
  font-style: italic;
  position: relative;
}
.suitable-for-complete-luxury-experience {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
}
.rectangle-1 {
  align-self: stretch;
  flex-shrink: 0;
  height: 200px;
  position: relative;
  object-fit: cover;
}
.package-card-detail {
  padding: 0px var(--space-inset-20px, 20px) 0px var(--space-inset-20px, 20px);
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.inclusions {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--font-size-web-body-lg, 16px);
  line-height: var(--font-line-height-web-body-body-lg, 24px);
  letter-spacing: 2px;
  font-weight: var(--font-weight-medium, 600);
  text-transform: uppercase;
  position: relative;
}
.table {
  border-style: solid;
  border-color: var(--color-yellow-alpha-10, rgba(209, 162, 0, 0.1));
  border-width: 0px 0px 1px 0px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.table-cell-support {
  padding: var(--space-inset-2px, 2px) 0px var(--space-inset-2px, 2px) 0px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.rectangle-2 {
  background: var(--color-gold-50, #b8995e);
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  position: relative;
  transform-origin: 0 0;
  transform: rotate(45deg) scale(1, 1);
  aspect-ratio: 1;
}
.table-cell-content5 {
  padding: var(--space-inset-2px, 2px) var(--space-inset-8px, 8px)
    var(--space-inset-2px, 2px) var(--space-inset-8px, 8px);
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  position: relative;
}
.signature-welcome-drink {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.photo-experience {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.banana-leaf-krathong-workshop {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.premium-workshops-collection {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.ethical-elephant-experience {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.afternoon-tea-refreshment-lounge {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.signature-cocktail-at-sunset {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.chef-s-table-lanna-experience {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.lanna-cultural-performances {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.lantern-ceremony {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.signature-gift {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.round-trip-shuttle-service {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.package-card-button {
  padding: var(--number-10px, 10px) var(--space-inset-20px, 20px)
    var(--number-10px, 10px) var(--space-inset-20px, 20px);
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.button-brand {
  background: var(--purple, #8c74a4);
  border-radius: var(--radius-component-button, 8px);
  padding: var(--space-inset-12px, 12px) var(--space-inset-24px, 24px)
    var(--space-inset-12px, 12px) var(--space-inset-24px, 24px);
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-8px, 8px);
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.package-card2 {
  background: var(--light-pink, #ffecec);
  border-radius: var(--radius-base-rounded-16, 16px);
  border-style: solid;
  border-color: var(--color-gold-50, #b8995e);
  border-width: 1px;
  padding: var(--space-inset-24px, 24px) var(--number-null, 0px)
    var(--space-inset-24px, 24px) var(--number-null, 0px);
  display: flex;
  flex-direction: column;
  gap: var(--number-8px, 8px);
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  min-width: 282px;
  position: relative;
}
.serenity-journey {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: 2px;
  font-weight: var(--font-weight-medium, 600);
  text-transform: uppercase;
  position: relative;
}
.thb-6-500-person {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  text-transform: uppercase;
  position: relative;
}
.thb-6-500-person-span {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 32px;
  line-height: 28px;
  font-weight: 600;
}
.thb-6-500-person-span2 {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
}
.thb-6-500-person-span3 {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 16px;
  line-height: 28px;
  font-weight: 600;
}
.connect-with-lanna-culture {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-Italic", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  font-weight: 400;
  font-style: italic;
  position: relative;
}
.suitable-for-culture-craft-lovers {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
}
.welcome-drink {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.premium-northern-thai-dinner {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.premium-gift {
  color: var(--color-gold-10, #9b7f4c);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.table2 {
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.button-brand2 {
  background: var(--pink, #c7877e);
  border-radius: var(--radius-component-button, 8px);
  padding: var(--space-inset-12px, 12px) var(--space-inset-24px, 24px)
    var(--space-inset-12px, 12px) var(--space-inset-24px, 24px);
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-8px, 8px);
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.package-card3 {
  background: var(--color-white-500, #ffffff);
  border-radius: var(--radius-base-rounded-16, 16px);
  border-style: solid;
  border-color: var(--color-gold-50, #b8995e);
  border-width: 1px;
  padding: 24px var(--number-null, 0px) 24px var(--number-null, 0px);
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  min-width: 282px;
  position: relative;
}
.lantern-journey {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: 2px;
  font-weight: var(--font-weight-medium, 600);
  text-transform: uppercase;
  position: relative;
}
.thb-4-500-person {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  text-transform: uppercase;
  position: relative;
}
.thb-4-500-person-span {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 32px;
  line-height: 28px;
  font-weight: 600;
}
.thb-4-500-person-span2 {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 20px;
  line-height: 28px;
  font-weight: 600;
}
.thb-4-500-person-span3 {
  font-family: "CrimsonText-SemiBold", sans-serif;
  font-size: 16px;
  line-height: 28px;
  font-weight: 600;
}
.experience-the-light {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-Italic", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  font-weight: 400;
  font-style: italic;
  position: relative;
}
.suitable-for-first-time-visitors {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
}
.table3 {
  border-style: solid;
  border-color: var(--color-primary-50, #f7f6f4);
  border-width: 0px 0px 1px 0px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.traditional-northern-thai-dinner {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.souvenir-gift {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-lg-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-lg-regular-font-size, 16px);
  line-height: var(--body-lg-regular-line-height, 24px);
  font-weight: var(--body-lg-regular-font-weight, 400);
  position: relative;
}
.button-brand3 {
  background: var(--color-gold-50, #b8995e);
  border-radius: var(--radius-component-button, 8px);
  padding: var(--space-inset-12px, 12px) var(--space-inset-24px, 24px)
    var(--space-inset-12px, 12px) var(--space-inset-24px, 24px);
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-8px, 8px);
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.frame-39 {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
  align-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.frame-41 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  min-width: 358px;
  position: relative;
}
.rectangle-4 {
  background: #d9d9d9;
  align-self: stretch;
  flex-shrink: 0;
  height: 400px;
  position: relative;
}
.pick-up-point {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h4-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h4-medium-font-size, 24px);
  line-height: var(--h4-medium-line-height, 32px);
  font-weight: var(--h4-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.frame-40 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  flex: 1;
  min-width: 358px;
  position: relative;
}
.event-location {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h4-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h4-medium-font-size, 24px);
  line-height: var(--h4-medium-line-height, 32px);
  font-weight: var(--h4-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.experience {
  background: var(--color-white-500, #ffffff);
  padding: var(--big-padding-top-bottom, 64px) var(--main-padding, 120px)
    var(--big-padding-top-bottom, 64px) var(--main-padding, 120px);
  display: flex;
  flex-direction: column;
  gap: var(--number-24px, 24px);
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.experience2 {
  color: var(--color-gold-10, #9b7f4c);
  text-align: center;
  font-family: var(--font-type-body, "CrimsonText-Regular", sans-serif);
  font-size: var(--font-size-web-body-xl, 18px);
  line-height: var(--font-line-height-web-body-body-xl, 26px);
  letter-spacing: var(--number-2px, 2px);
  font-weight: var(--font-weight-regular, 400);
  position: relative;
  align-self: stretch;
}
.a-journey-more-meaningful {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h1-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h1-regular-font-size, 48px);
  line-height: var(--h1-regular-line-height, 56px);
  font-weight: var(--h1-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.frame-13 {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  flex-shrink: 0;
  max-width: 900px;
  position: relative;
}
.a-journey-becomes-meaningful-when-we-move-beyond-being-visitors-and-become-part-of-a-place-even-for-a-little-while {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.at-phor-khom-mae-taeng-every-experience-is-designed-as-a-gentle-invitation-to-connect-with-craft-with-food-with-nature-with-local-people-and-with-traditions-that-continue-to-live-today {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.you-may-make-something-with-your-own-hands-sit-down-to-a-meal-prepared-with-local-ingredients-listen-to-stories-from-the-community-or-simply-pause-beneath-the-evening-sky {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.there-is-no-need-to-rush {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.this-is-mae-taeng-at-its-own-pace-intimate-thoughtful-and-deeply-rooted-in-place {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --h5-semibold-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--h5-semibold-font-size, 20px);
  line-height: var(--h5-semibold-line-height, 28px);
  font-weight: var(--h5-semibold-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.frame-33 {
  display: flex;
  flex-direction: column;
  gap: 32px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.experience-hightlight {
  display: flex;
  flex-direction: row;
  gap: var(--number-32px, 32px);
  row-gap: var(--gap, 24px);
  align-items: flex-start;
  justify-content: center;
  flex-wrap: wrap;
  align-content: flex-start;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.frame-29 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  min-width: 324px;
  position: relative;
}
.experience-hightlight-workshop {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: center;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: 392px;
  min-width: 282px;
  position: relative;
  object-fit: cover;
}
.experience-detail-section-content-1 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.craft-with-care {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(--h3-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h3-medium-font-size, 32px);
  line-height: var(--h3-medium-line-height, 40px);
  font-weight: var(--h3-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.experience-detail-section-content-1-info {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.in-mae-taeng-craft-is-more-than-an-object-it-is-knowledge-passed-from-one-generation-to-another-shaped-by-hands-materials-patience-and-place {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.meet-local-makers-and-discover-the-quiet-beauty-behind-lanna-craftsmanship-from-natural-materials-to-traditional-techniques-each-piece-carries-the-character-of-the-landscape-and-the-story-of-the-person-who-made-it {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.here-you-are-not-simply-buying-a-souvenir {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.you-are-meeting-the-maker-learning-the-story-and-experiencing-the-value-of-something-made-slowly-and-with-care {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.frame-30 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: center;
  flex: 1;
  min-width: 324px;
  position: relative;
}
.experience-hightlight-dining {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: center;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: 392px;
  min-width: 282px;
  position: relative;
  object-fit: cover;
}
.experience-detail-section-content-2 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.cook-with-love {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(--h3-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h3-medium-font-size, 32px);
  line-height: var(--h3-medium-line-height, 40px);
  font-weight: var(--h3-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.experience-detail-section-content-2-info {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.food-is-one-of-the-most-intimate-ways-to-understand-a-place {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.at-mae-taeng-northern-thai-cuisine-is-rooted-in-the-land-the-seasons-and-the-wisdom-of-generations-local-ingredients-become-dishes-that-are-both-familiar-and-deeply-connected-to-the-community {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.sit-at-the-table-taste-the-herbs-spices-and-flavours-of-the-north-share-food-the-way-families-and-communities-have-always-done-generously-slowly-and-together {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.because-a-meal-is-never-only-about-what-is-on-the-plate {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.it-is-about-the-people-who-grow-it-prepare-it-serve-it-and-share-it-with-you {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.experience-hightlight2 {
  display: flex;
  flex-direction: row;
  gap: var(--number-32px, 32px);
  row-gap: var(--gap, 24px);
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  align-content: center;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.frame-31 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  min-width: 324px;
  position: relative;
}
.experience-hightlight-performance {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: center;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: 392px;
  min-width: 282px;
  position: relative;
  object-fit: cover;
}
.experience-detail-section-content-3 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.rooted-in-community {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(--h3-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h3-medium-font-size, 32px);
  line-height: var(--h3-medium-line-height, 40px);
  font-weight: var(--h3-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.experience-detail-section-content-3-info {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.mae-taeng-is-not-a-destination-created-for-visitors-it-is-a-living-community-with-its-own-rhythm-traditions-relationships-and-stories {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.phor-khom-is-created-with-the-community-not-simply-for-the-community {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.through-local-makers-cooks-farmers-performers-guides-and-hosts-the-experience-creates-a-space-where-visitors-can-connect-with-the-people-behind-the-place-and-where-local-knowledge-can-be-valued-shared-and-carried-forward {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.we-believe-tourism-can-give-something-back-to-the-places-we-visit {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.when-you-come-to-mae-taeng-you-are-not-only-experiencing-the-destination {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.you-are-becoming-part-of-its-story {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.frame-32 {
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: flex-start;
  justify-content: center;
  flex: 1;
  min-width: 324px;
  position: relative;
}
.experience-hightlight-loykrathong {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: center;
  justify-content: flex-end;
  align-self: stretch;
  flex-shrink: 0;
  height: 392px;
  min-width: 282px;
  position: relative;
  object-fit: cover;
}
.experience-detail-section-content-4 {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.shared-with-heart {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(--h3-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h3-medium-font-size, 32px);
  line-height: var(--h3-medium-line-height, 40px);
  font-weight: var(--h3-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.experience-detail-section-content-4-info {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.at-the-heart-of-phor-khom-is-something-simple-sharing {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.sharing-food-around-a-table-sharing-knowledge-between-generations-sharing-craft-between-maker-and-visitor-sharing-stories-between-strangers-and-at-the-end-of-the-evening-sharing-a-moment-beneath-a-sky-filled-with-light {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.these-are-the-moments-that-cannot-be-bought-as-a-product-or-captured-completely-in-a-photograph {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.they-are-felt {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.and-perhaps-this-is-what-makes-a-journey-memorable-not-what-we-collected-along-the-way-but-what-we-shared-with-one-another {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.story-content-1 {
  background: var(--color-white-500, #ffffff);
  padding: var(--big-padding-top-bottom, 64px) var(--main-padding, 120px)
    var(--big-padding-top-bottom, 64px) var(--main-padding, 120px);
  display: flex;
  flex-direction: column;
  gap: 30px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.story-about-mae-taengheadline {
  display: flex;
  flex-direction: column;
  gap: var(--number-20px, 20px);
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.why-mae-taeng {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h1-regular-font-family, "CrimsonText-Regular", sans-serif);
  font-size: var(--h1-regular-font-size, 48px);
  line-height: var(--h1-regular-line-height, 56px);
  font-weight: var(--h1-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.a-place-where-nature-culture-and-community-live-together {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(--h4-medium-font-family, "CrimsonText-SemiBold", sans-serif);
  font-size: var(--h4-medium-font-size, 24px);
  line-height: var(--h4-medium-line-height, 32px);
  font-weight: var(--h4-medium-font-weight, 600);
  position: relative;
  align-self: stretch;
  min-width: 358px;
}
.story-about-mae-taeng-body {
  display: flex;
  flex-direction: row;
  gap: var(--gap, 24px);
  row-gap: 24px;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: center;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.frame-14 {
  display: flex;
  flex-direction: column;
  gap: var(--number-12px, 12px);
  align-items: flex-start;
  justify-content: center;
  flex: 1;
  position: relative;
}
.nestled-among-the-mountains-and-valleys-of-chiang-mai-mae-taeng-is-a-place-where-the-landscape-and-the-way-of-life-remain-closely-connected {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.rice-fields-forests-rivers-and-villages-form-a-living-landscape-shaped-by-generations-of-local-knowledge-here-lanna-traditions-are-not-simply-preserved-as-heritage-they-continue-through-everyday-life-in-food-craft-ceremonies-stories-and-the-relationships-between-people-and-their-land {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.mae-taeng-invites-you-to-experience-chiang-mai-beyond-the-familiar {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-semibold-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-xl-semibold-font-size, 18px);
  line-height: var(--body-xl-semibold-line-height, 26px);
  font-weight: var(--body-xl-semibold-font-weight, 600);
  position: relative;
  align-self: stretch;
}
.to-travel-more-slowly-to-meet-the-people-behind-the-place-to-discover-the-beauty-of-things-made-by-hand-and-food-prepared-with-care-and-to-find-a-quieter-connection-with-northern-thailand {
  color: var(--color-primary-950, #24221f);
  text-align: left;
  font-family: var(
    --body-xl-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-xl-regular-font-size, 18px);
  line-height: var(--body-xl-regular-line-height, 26px);
  font-weight: var(--body-xl-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.why-mae-taeng-content {
  display: flex;
  flex-direction: row;
  gap: var(--gap, 24px);
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: center;
  width: 100%;
  flex-shrink: 0;
  max-width: 1600px;
  position: relative;
}
.why-mae-taeng-card {
  display: flex;
  flex-direction: column;
  gap: var(--number-6px, 6px);
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  min-width: 171px;
  position: relative;
}
.photo {
  align-self: stretch;
  flex-shrink: 0;
  height: 220px;
  position: relative;
  object-fit: cover;
}
.nature {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-medium-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-xl-medium-font-size, 18px);
  line-height: var(--body-xl-medium-line-height, 26px);
  font-weight: var(--body-xl-medium-font-weight, 600);
  position: relative;
}
.wildlife {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-medium-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-xl-medium-font-size, 18px);
  line-height: var(--body-xl-medium-line-height, 26px);
  font-weight: var(--body-xl-medium-font-weight, 600);
  position: relative;
}
.why-mae-taeng-card2 {
  display: flex;
  flex-direction: column;
  gap: var(--number-6px, 6px);
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  position: relative;
}
.traditional-village {
  color: var(--color-primary-950, #24221f);
  text-align: center;
  font-family: var(
    --body-xl-medium-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-xl-medium-font-size, 18px);
  line-height: var(--body-xl-medium-line-height, 26px);
  font-weight: var(--body-xl-medium-font-weight, 600);
  position: relative;
}
.footer {
  background: linear-gradient(to left, rgba(6, 6, 6, 0.2), rgba(6, 6, 6, 0.2));
  padding: 24px 64px 16px 64px;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.logo-email {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.layer-12 {
  height: auto;
  position: absolute;
  left: 0px;
  top: 0px;
  overflow: visible;
}
.email-input {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 365px;
  position: relative;
}
.header2 {
  display: flex;
  flex-direction: column;
  gap: 4px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.live-the-spirit-of-lanna-connect-with-people-feel-thr-serenity-of-mae-tang {
  color: var(--color-white-500, #ffffff);
  text-align: center;
  font-family: var(
    --body-sm-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-sm-regular-font-size, 12px);
  line-height: var(--body-sm-regular-line-height, 16px);
  font-weight: var(--body-sm-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.company-co-ltd {
  color: var(--color-white-500, #ffffff);
  text-align: center;
  font-family: var(--body-md-bold-font-family, "CrimsonText-Bold", sans-serif);
  font-size: var(--body-md-bold-font-size, 14px);
  line-height: var(--body-md-bold-line-height, 20px);
  font-weight: var(--body-md-bold-font-weight, 700);
  position: relative;
  align-self: stretch;
}
.company-address-company-address-company-address-company-address-50000 {
  color: var(--color-white-500, #ffffff);
  text-align: center;
  font-family: var(
    --body-sm-regular-font-family,
    "CrimsonText-Regular",
    sans-serif
  );
  font-size: var(--body-sm-regular-font-size, 12px);
  line-height: var(--body-sm-regular-line-height, 16px);
  font-weight: var(--body-sm-regular-font-weight, 400);
  position: relative;
  align-self: stretch;
}
.social {
  display: flex;
  flex-direction: row;
  gap: 16px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  height: 20px;
  position: relative;
}
.instagram-logo {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  position: relative;
  overflow: visible;
  aspect-ratio: 1;
}
.facebook-logo {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  position: relative;
  overflow: visible;
  aspect-ratio: 1;
}
.youtube-logo {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  position: relative;
  overflow: visible;
  aspect-ratio: 1;
}
.footer-bottom {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.sublink {
  display: flex;
  flex-direction: row;
  gap: 40px;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.footer-link {
  display: flex;
  flex-direction: row;
  gap: var(--space-gap-4px, 4px);
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.label2 {
  color: var(--color-white-500, #ffffff);
  text-align: left;
  font-family: var(
    --body-md-medium-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-md-medium-font-size, 14px);
  line-height: var(--body-md-medium-line-height, 20px);
  font-weight: var(--body-md-medium-font-weight, 600);
  position: relative;
}
._2026-website-all-right-reserved {
  color: var(--color-white-500, #ffffff);
  text-align: left;
  font-family: var(
    --body-md-medium-font-family,
    "CrimsonText-SemiBold",
    sans-serif
  );
  font-size: var(--body-md-medium-font-size, 14px);
  line-height: var(--body-md-medium-line-height, 20px);
  font-weight: var(--body-md-medium-font-weight, 600);
  position: relative;
}