@font-face {
  font-family: "Glovia";
  src:
    url("../fonts/glovia.woff2") format("woff2"),
    url("../fonts/glovia.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

::-webkit-scrollbar {
  display: none;
}

/**************-------------------------------------**************/
/*                           VARIABLES                           */
/**************-------------------------------------**************/
/* COLORS */
:root {
  --evergreen-100: #cddad4;
  --evergreen-200: #9bb5aa;
  --evergreen-300: #69917f;
  --evergreen-400: #376c55;
  --evergreen-500: #05472a;
  --evergreen-600: #043922;
  --evergreen-700: #032b19;
  --evergreen-800: #021c11;
  --evergreen-900: #010e08;

  --timber-100: #e3d9d4;
  --timber-200: #c7b4aa;
  --timber-300: #ac8e7f;
  --timber-400: #906955;
  --timber-500: #74432a;
  --timber-600: #5d3622;
  --timber-700: #462819;
  --timber-800: #2e1b11;
  --timber-900: #170d08;

  --sandstone-100: #f9f5ee;
  --sandstone-200: #f2ebde;
  --sandstone-300: #ece1cd;
  --sandstone-400: #e5d7bd;
  --sandstone-500: #dfcdac;
  --sandstone-600: #b2a48a;
  --sandstone-700: #867b67;
  --sandstone-800: #595245;
  --sandstone-900: #2d2922;

  --chasenut-100: #dbd2d0;
  --chasenut-200: #b7a6a1;
  --chasenut-300: #937971;
  --chasenut-400: #6f4d42;
  --chasenut-500: #4b2013;
  --chasenut-600: #3c1a0f;
  --chasenut-700: #2d130b;
  --chasenut-800: ;
  --chasenut-900: ;

  /* ===== SEMANTIC ALIASES ===== */
  --color-bg: var(--evergreen-800);
  --color-surface: var(--evergreen-700);
  --color-surface-2: var(--evergreen-600);

  --color-primary: var(--sandstone-500);
  --color-accent: var(--timber-400);

  --color-text: var(--sandstone-100);
  --color-text-muted: var(--sandstone-300);

  --color-border-1: rgba(223, 205, 172, 0.22);
  --color-border-2: rgba(223, 205, 172, 0.12);
}

/* SHADOWS */

:root {
  --shadow-xs: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
  --shadow-sm:
    rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  --shadow-md:
    rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
  --shadow-lg:
    rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
  --shadow-xl:
    rgba(0, 0, 0, 0.1) 0px 20px 25px -5px,
    rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}

/* FONTS */
:root {
  --heading-font: "Glovia", "Cormorant Garamond", serif;
  --body-font: "Plus Jakarta Sans", sans-serif;
}

/* FONT SIZE*/

:root {
  --font-size-xs: clamp(10px, calc(9.33px + 0.19vw), 12px);
  --font-size-sm: clamp(12px, calc(11.33px + 0.19vw), 14px);
  --font-size-md: clamp(14px, calc(13.33px + 0.19vw), 16px);
  --font-size-lg: clamp(16px, calc(15.33px + 0.19vw), 18px);
  --font-size-xl: clamp(18px, calc(17.33px + 0.19vw), 20px);

  --font-size-2xl: clamp(20px, calc(18.67px + 0.37vw), 24px);
  --font-size-3xl: clamp(22px, calc(20px + 0.56vw), 28px);
  --font-size-4xl: clamp(24px, calc(21.33px + 0.74vw), 32px);
  --font-size-5xl: clamp(26px, calc(21.33px + 1.3vw), 40px);
  --font-size-6xl: clamp(28px, calc(21.33px + 1.85vw), 48px);
  --font-size-7xl: clamp(36px, calc(23.79px + 3.21vw), 72px);
  --font-size-8xl: clamp(40px, calc(26.43px + 3.57vw), 80px);
  --font-size-9xl: clamp(44px, calc(25px + 5vw), 100px);

  --font-size-nav: clamp(40px, calc(30.67px + 2.59vw), 68px);
  --font-size-cta: clamp(32px, calc(25.33px + 1.85vw), 52px);
}

/* SPACING */
:root {
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-ms: 0.75rem;
  --spacing-md: 1rem;
  --spacing-ml: 1.5rem;
  --spacing-lg: 2rem;
  --spacing-xl: 3rem;
  --spacing-2xl: 4rem;
  --spacing-3xl: 5rem;
  --spacing-4xl: 6rem;
  --spacing-5xl: 7rem;
  --spacing-6xl: 10rem;
  --spacing-7xl: 13rem;
  --spacing-8xl: 16rem;
  --spacing-9xl: 19rem;
  --spacing-10xl: 22rem;
  --spacing-11xl: 25rem;
  --spacing-12xl: 28rem;
  --spacing-13xl: 31rem;
  --spacing-14xl: 34rem;
  --spacing-15xl: 37rem;
}

@media screen and (max-width: 1440px) {
  :root {
    --spacing-xs: calc(0.25rem * 0.9);
    --spacing-sm: calc(0.5rem * 0.9);
    --spacing-ms: calc(0.75rem * 0.9);
    --spacing-md: calc(1rem * 0.9);
    --spacing-ml: calc(1.5rem * 0.9);
    --spacing-lg: calc(2rem * 0.9);
    --spacing-xl: calc(3rem * 0.9);
    --spacing-2xl: calc(4rem * 0.9);
    --spacing-3xl: calc(5rem * 0.9);
    --spacing-4xl: calc(6rem * 0.9);
    --spacing-5xl: calc(7rem * 0.9);
    --spacing-6xl: calc(10rem * 0.9);
    --spacing-7xl: calc(13rem * 0.9);
    --spacing-8xl: calc(16rem * 0.9);
    --spacing-9xl: calc(19rem * 0.9);
    --spacing-10xl: calc(22rem * 0.9);
    --spacing-11xl: calc(25rem * 0.9);
    --spacing-12xl: calc(28rem * 0.9);
    --spacing-13xl: calc(31rem * 0.9);
    --spacing-14xl: calc(34rem * 0.9);
    --spacing-15xl: calc(37rem * 0.9);
  }
}

@media screen and (max-width: 1279px) {
  :root {
    --spacing-xs: calc(0.25rem * 0.8);
    --spacing-sm: calc(0.5rem * 0.8);
    --spacing-ms: calc(0.75rem * 0.8);
    --spacing-md: calc(1rem * 0.8);
    --spacing-ml: calc(1.5rem * 0.8);
    --spacing-lg: calc(2rem * 0.8);
    --spacing-xl: calc(3rem * 0.8);
    --spacing-2xl: calc(4rem * 0.8);
    --spacing-3xl: calc(5rem * 0.8);
    --spacing-4xl: calc(6rem * 0.8);
    --spacing-5xl: calc(7rem * 0.8);
    --spacing-6xl: calc(10rem * 0.8);
    --spacing-7xl: calc(13rem * 0.8);
    --spacing-8xl: calc(16rem * 0.8);
    --spacing-9xl: calc(19rem * 0.8);
    --spacing-10xl: calc(22rem * 0.8);
    --spacing-11xl: calc(25rem * 0.8);
    --spacing-12xl: calc(28rem * 0.8);
    --spacing-13xl: calc(31rem * 0.8);
    --spacing-14xl: calc(34rem * 0.8);
    --spacing-15xl: calc(37rem * 0.8);
  }
}

@media screen and (max-width: 1023px) {
  :root {
    --spacing-md: calc(1rem * 0.7);
    --spacing-ml: calc(1.5rem * 0.7);
    --spacing-lg: calc(2rem * 0.7);
    --spacing-xl: calc(3rem * 0.7);
    --spacing-2xl: calc(4rem * 0.7);
    --spacing-3xl: calc(5rem * 0.7);
    --spacing-4xl: calc(6rem * 0.7);
    --spacing-5xl: calc(7rem * 0.7);
    --spacing-6xl: calc(10rem * 0.7);
    --spacing-7xl: calc(13rem * 0.7);
    --spacing-8xl: calc(16rem * 0.7);
    --spacing-9xl: calc(19rem * 0.7);
    --spacing-10xl: calc(22rem * 0.7);
    --spacing-11xl: calc(25rem * 0.7);
    --spacing-12xl: calc(28rem * 0.7);
    --spacing-13xl: calc(31rem * 0.7);
    --spacing-14xl: calc(34rem * 0.7);
    --spacing-15xl: calc(37rem * 0.7);
  }
}

@media screen and (max-width: 767px) {
  :root {
    --spacing-lg: calc(2rem * 0.6);
    --spacing-xl: calc(3rem * 0.6);
    --spacing-2xl: calc(4rem * 0.6);
    --spacing-3xl: calc(5rem * 0.6);
    --spacing-4xl: calc(6rem * 0.6);
    --spacing-5xl: calc(7rem * 0.6);
    --spacing-6xl: calc(10rem * 0.6);
    --spacing-7xl: calc(13rem * 0.6);
    --spacing-8xl: calc(16rem * 0.6);
    --spacing-9xl: calc(19rem * 0.6);
    --spacing-10xl: calc(22rem * 0.6);
    --spacing-11xl: calc(25rem * 0.6);
    --spacing-12xl: calc(28rem * 0.6);
    --spacing-13xl: calc(31rem * 0.6);
    --spacing-14xl: calc(34rem * 0.6);
    --spacing-15xl: calc(37rem * 0.6);
  }
}

@media screen and (max-width: 639px) {
  :root {
    --spacing-xl: calc(3rem * 0.5);
    --spacing-2xl: calc(4rem * 0.5);
    --spacing-3xl: calc(5rem * 0.5);
    --spacing-4xl: calc(6rem * 0.5);
    --spacing-5xl: calc(7rem * 0.5);
    --spacing-6xl: calc(10rem * 0.5);
    --spacing-7xl: calc(13rem * 0.5);
    --spacing-8xl: calc(16rem * 0.5);
    --spacing-9xl: calc(19rem * 0.5);
    --spacing-10xl: calc(22rem * 0.5);
    --spacing-11xl: calc(25rem * 0.5);
    --spacing-12xl: calc(28rem * 0.5);
    --spacing-13xl: calc(31rem * 0.5);
    --spacing-14xl: calc(34rem * 0.5);
    --spacing-15xl: calc(37rem * 0.5);
  }
}

/* MAX WIDTH */
:root {
  --max-width-xs: 360px;
  --max-width-sm: 480px;
  --max-width-md: 640px;
  --max-width-lg: 760px;
  --max-width-xl: 920px;
  --max-width-2xl: 1024px;
  --max-width-3xl: 1440px;
  --max-width-4xl: 1680px;
}

/* CONTAINERS */
:root {
  --container-sm: 700px;
  --container-md: 900px;
  --container-lg: 1100px;
}

@media screen and (max-width: 1279px) {
  :root {
    --container-sm: 70vw;
    --container-md: 80vw;
    --container-lg: 80vw;
  }
}

@media screen and (max-width: 1023px) {
  :root {
    --container-sm: 80vw;
    --container-md: 80vw;
    --container-lg: 80vw;
  }
}

@media screen and (max-width: 639px) {
  :root {
    --container-sm: 85vw;
    --container-md: 85vw;
    --container-lg: 85vw;
  }
}

/* BORDER RADIUS */
:root {
  --rounded-xs: 2px;
  --rounded-sm: 4px;
  --rounded-md: 6px;
  --rounded-lg: 8px;
  --rounded-xl: 12px;
  --rounded-2xl: 16px;
  --rounded-3xl: 24px;
  --rounded-4xl: 28px;
  --rounded-5xl: 32px;
  --rounded-6xl: 40px;
  --rounded-full: 999px;
}

@media screen and (max-width: 1023px) {
  :root {
    --rounded-md: 4px;
    --rounded-lg: 6px;
    --rounded-xl: 10px;
    --rounded-2xl: 14px;
    --rounded-3xl: 22px;
    --rounded-4xl: 24px;
    --rounded-5xl: 28px;
    --rounded-6xl: 32px;
  }
}

@media screen and (max-width: 639px) {
  :root {
    --rounded-xl: 8px;
    --rounded-2xl: 12px;
    --rounded-3xl: 18px;
    --rounded-4xl: 20px;
    --rounded-5xl: 24px;
    --rounded-6xl: 28px;
  }
}

/**************-------------------------------------**************/
/*                           SMOOTH SCROLL                       */
/**************-------------------------------------**************/

html.lenis,
html.lenis body {
  height: auto;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: clip;
}
.lenis.lenis-smooth iframe {
  pointer-events: none;
}

/**************-------------------------------------**************/
/*                        PAGE TRANSITION                        */
/**************-------------------------------------**************/

@view-transition {
  navigation: auto;
}

::view-transition {
  background: var(--sandstone-100);
}

::view-transition-old(root),
::view-transition-new(root) {
  mix-blend-mode: normal;
}

::view-transition-old(root) {
  animation: page-fade-out 0.4s cubic-bezier(0.65, 0, 0.35, 1) both;
}

::view-transition-new(root) {
  animation: page-fade-in 0.6s var(--fade-ease) 0.2s both;
}

@keyframes page-fade-out {
  to {
    opacity: 0;
  }
}

@keyframes page-fade-in {
  from {
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  @view-transition {
    navigation: none;
  }
}

/**************-------------------------------------**************/
/*                         CUSTOM CURSOR                         */
/**************-------------------------------------**************/

html.has-custom-cursor,
html.has-custom-cursor * {
  cursor: none !important;
}

html.has-custom-cursor
  :is(
    input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not(
        [type="button"]
      ):not([type="range"]),
    textarea,
    [contenteditable="true"]
  ) {
  cursor: text !important;
}

.cursor {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1100;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.cursor.is-visible {
  opacity: 1;
}

.cursor.is-native {
  opacity: 0;
}

.cursor-ring,
.cursor-dot {
  position: absolute;
  top: 0;
  left: 0;
  will-change: transform;
}

.cursor-ring-shape {
  display: block;
}

.cursor-ring-inner {
  display: block;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(75, 32, 19, 0.45);
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(249, 245, 238, 0.35);
  transition:
    transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
    background-color 0.4s ease,
    border-color 0.4s ease;
}

.cursor-dot-inner {
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--chasenut-500);
  box-shadow: 0 0 0 1.5px rgba(249, 245, 238, 0.7);
  transition:
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.25s ease;
}

.cursor.is-hover .cursor-ring-inner {
  transform: scale(1.55);
  background-color: rgba(223, 205, 172, 0.22);
  border-color: rgba(75, 32, 19, 0.3);
}

.cursor.is-hover .cursor-dot-inner {
  transform: scale(0);
  opacity: 0;
}

.cursor.is-down .cursor-ring-inner {
  transform: scale(0.82);
}

.cursor.is-hover.is-down .cursor-ring-inner {
  transform: scale(1.35);
}

.cursor.is-label .cursor-ring-inner {
  transform: scale(2.3);
  background-color: var(--evergreen-700);
  border-color: rgba(223, 205, 172, 0.35);
}

.cursor.is-label .cursor-dot-inner {
  transform: scale(0);
  opacity: 0;
}

.cursor-label {
  position: absolute;
  top: 50%;
  left: 50%;
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--sandstone-500);
  font-family: var(--body-font);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.6);
  transition:
    opacity 0.3s ease,
    transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.cursor.is-label .cursor-label {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.cursor-label-arrow {
  display: none;
  width: 5px;
  height: 9px;
  transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.cursor.is-drag .cursor-label-arrow {
  display: block;
}

.cursor.is-label.is-down .cursor-ring-inner {
  transform: scale(2);
}

.cursor.is-drag.is-down .cursor-label-arrow--prev {
  transform: translateX(-4px);
}

.cursor.is-drag.is-down .cursor-label-arrow--next {
  transform: translateX(4px);
}

.cursor-ripple {
  position: absolute;
  top: -19px;
  left: -19px;
  width: 38px;
  height: 38px;
  border: 1px solid rgba(75, 32, 19, 0.45);
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(249, 245, 238, 0.3);
  animation: cursor-ripple 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes cursor-ripple {
  from {
    opacity: 0.8;
    transform: translate(var(--x), var(--y)) scale(0.4);
  }
  to {
    opacity: 0;
    transform: translate(var(--x), var(--y)) scale(2.2);
  }
}

@media print {
  .cursor {
    display: none;
  }
}

/**************-------------------------------------**************/
/*                           GLOBAL                              */
/**************-------------------------------------**************/

*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
  -webkit-tap-highlight-color: transparent;
}

a,
a:link {
  text-decoration: none;
  transition: all 0.3s ease-in-out;
  -webkit-tap-highlight-color: transparent;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

a:hover,
a:active,
a:visited {
}

html {
  font-size: var(--font-size-md);
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

html.lenis,
html.is-scroll-normalized {
  scroll-behavior: auto;
}

body {
  box-sizing: border-box;
  background-color: var(--evergreen-800);
  color: var(--color-text);
  font-size: var(--font-size-md);
  font-family: var(--body-font);
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  font-weight: 400;
}

img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

a:where(:not(.wp-element-button)) {
  color: var(--sandstone-500);
}

h1,
h2,
h3 {
  font-family: var(--heading-font);
}

.container {
  max-width: var(--max-width-4xl);
  margin-inline: auto;
  padding-inline: 60px;
}

@media screen and (max-width: 1679px) {
  .container {
    max-width: var(--max-width-3xl);
  }
}

@media screen and (max-width: 1439px) {
  .container {
    padding-inline: 20px;
  }
}

@media screen and (max-width: 639px) {
  .container {
    padding-inline: 15px;
  }
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
input:-internal-autofill-previewed,
input:-internal-autofill-selected {
  -webkit-text-fill-color: var(--chasenut-500) !important;
  -webkit-box-shadow: 0 0 0px 1000px #f9f5ee inset !important;
  -webkit-transition: background-color 5000s ease-in-out 0s !important;
  transition: background-color 5000s ease-in-out 0s !important;
  color: var(--chasenut-500) !important;
  background-clip: content-box !important;
}

/**************-------------------------------------**************/
/*                           TYPOGRAPHY                          */
/**************-------------------------------------**************/
.heading-xs {
  font-size: var(--font-size-xl);
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -2px;
}

.heading-sm {
  font-size: var(--font-size-2xl);
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -2px;
}

.heading-md {
  font-size: var(--font-size-4xl);
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -2px;
}

.heading-lg {
  font-size: var(--font-size-6xl);
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -2px;
}

.heading-xl {
  font-size: var(--font-size-8xl);
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -2px;
}

.heading-2xl {
  font-size: var(--font-size-9xl);
  font-family: var(--heading-font);
  font-weight: 500;
  line-height: 1.1;
  letter-spacing: -2px;
}

/**************-------------------------------------**************/
/*                       UTILITY CLASSES                         */
/**************-------------------------------------**************/

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.text-justify {
  text-align: justify;
}

.bg-cover {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.hidden {
  display: none !important;
}

/* RESPONSIVE SHOW */
.show-desktop {
  display: block;
}

.show-tablet,
.show-mobile {
  display: none;
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
  .show-desktop {
    display: none !important;
  }
  .show-tablet {
    display: block !important;
  }
  .show-mobile {
    display: none !important;
  }
}

@media screen and (max-width: 767px) {
  .show-desktop,
  .show-tablet {
    display: none !important;
  }
  .show-mobile {
    display: block !important;
  }
}

/**************-------------------------------------**************/
/*                           ANIMATIONS                          */
/**************-------------------------------------**************/

/**************-------------------------------------**************/
/* TEXT REVEAL */
/**************-------------------------------------**************/
:root {
  --tr-duration: 1s;
  --tr-ease: cubic-bezier(0.165, 0.84, 0.44, 1);
  --tr-blur: 20px;
  --tr-y: 40%;
}

.tr {
  --length: 1;
  --delay: 0s;
}

.tr .tr-line,
.tr .tr-word,
.tr .tr-char {
  display: inline-block;
  vertical-align: top;
  padding: 0.15em 0.1em;
}

.tr .tr-line {
  padding-inline: 0;
}

.tr .tr-wrap {
  display: inline-block;
  overflow: visible;
  vertical-align: top;
  margin: -0.15em -0.1em;
}

.tr .tr-wrap.block {
  display: block;
  margin: -0.15em 0;
}

/* ---- initial ---- */
.tr .tr-word,
.tr .tr-line,
.tr .tr-char {
  opacity: 0;
  filter: blur(var(--tr-blur));
  transform: translate3d(0, var(--tr-y), 0);
  transition:
    transform var(--tr-duration) var(--tr-ease),
    opacity var(--tr-duration) var(--tr-ease),
    filter var(--tr-duration) var(--tr-ease);
  will-change: transform, opacity, filter;
  backface-visibility: hidden;
}

/* ---- revealed state ---- */
.tr.is-inview .tr-word,
.tr.is-inview .tr-line,
.tr.is-inview .tr-char {
  opacity: 1;
  filter: blur(0px);
  transform: translate3d(0, 0%, 0);
}

/* ---- adaptive stagger per reveal type ---- */
.tr[data-reveal="hero"] .tr-word {
  transition-delay: calc(
    0.2s + (1.3s / var(--length) * var(--index)) + var(--delay)
  );
}

.tr[data-reveal="heading"] .tr-word {
  transition-delay: calc(0.08s * var(--index) + var(--delay));
}

.tr[data-reveal="paragraph"] .tr-word {
  transition-delay: calc(0.5s / var(--length) * var(--index) + var(--delay));
}

.tr[data-reveal="feature"] .tr-word {
  transition-delay: calc(
    0.2s + (1s / var(--length) * var(--index)) + var(--delay)
  );
}

.tr[data-split="chars"] .tr-char {
  transition-delay: calc(0.015s * var(--index) + var(--delay));
}

.tr[data-split="lines"] .tr-line {
  transition-delay: calc(0.12s * var(--index) + var(--delay));
}

/* ---- mobile ---- */
@media screen and (max-width: 767px) {
}

/* ---- accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .tr .tr-word,
  .tr .tr-line,
  .tr .tr-char {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
  }
}

/*-----------------------------------------------------------*/
/* SVG Draw Reveal */
/*-----------------------------------------------------------*/
:root {
  --draw-duration: 1.3s;
  --draw-ease: cubic-bezier(0.65, 0, 0.35, 1);
  --draw-stagger: 0.14s;
}

.js-draw :is(path, line, polyline, polygon, circle, ellipse, rect) {
  stroke-dashoffset: var(--draw-len, 0);
  fill-opacity: 0;
  transition:
    stroke-dashoffset var(--draw-duration) var(--draw-ease)
      calc(var(--draw-stagger) * var(--index, 0) + var(--delay, 0s)),
    fill-opacity calc(var(--draw-duration) * 0.6) ease
      calc(var(--draw-duration) * 0.85 + var(--delay, 0s));
}

.js-draw[data-draw="stroke"]
  :is(path, line, polyline, polygon, circle, ellipse, rect) {
  fill-opacity: 1;
}

.js-draw.is-inview :is(path, line, polyline, polygon, circle, ellipse, rect) {
  stroke-dashoffset: 0;
  fill-opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .js-draw :is(path, line, polyline, polygon, circle, ellipse, rect) {
    stroke-dashoffset: 0;
    fill-opacity: 1;
    transition: none;
  }
}

/*-----------------------------------------------------------*/
/* Clip Reveal*/
.js-clip {
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1.5s ease var(--delay, 0s);
  will-change: clip-path;
}
.js-clip[data-clip="up"] {
  clip-path: inset(100% 0 0 0);
}
.js-clip[data-clip="right"] {
  clip-path: inset(0 100% 0 0);
}
.js-clip[data-clip="left"] {
  clip-path: inset(0 0 0 100%);
}
.js-clip.is-inview {
  clip-path: inset(0 0 0 0);
}
@media (prefers-reduced-motion: reduce) {
  .js-clip {
    clip-path: none;
    transition: none;
  }
}

/*-----------------------------------------------------------*/
/* Block Reveal */
/*-----------------------------------------------------------*/
:root {
  --fade-duration: 1s;
  --fade-ease: cubic-bezier(0.165, 0.84, 0.44, 1);
  --fade-blur: 12px;
  --fade-dist: 40px;
  --fade-stagger: 0.2s;
}

.js-fade {
  opacity: 0;
  filter: blur(var(--fade-blur));
  transform: translate3d(0, var(--fade-dist), 0);
  transition:
    opacity var(--fade-duration) var(--fade-ease),
    filter var(--fade-duration) var(--fade-ease),
    transform var(--fade-duration) var(--fade-ease);
  transition-delay: var(--delay, 0s);
  will-change: transform, opacity, filter;
}

.js-fade[data-fade="down"] {
  transform: translate3d(0, calc(-1 * var(--fade-dist)), 0);
}
.js-fade[data-fade="left"] {
  transform: translate3d(var(--fade-dist), 0, 0);
}
.js-fade[data-fade="right"] {
  transform: translate3d(calc(-1 * var(--fade-dist)), 0, 0);
}
.js-fade[data-fade="in"] {
  transform: none;
}
.js-fade[data-fade="zoom"] {
  transform: scale(0.94);
}

.js-fade-stagger .js-fade {
  transition-delay: calc(
    var(--fade-stagger) * var(--index, 0) + var(--delay, 0s)
  );
}

.js-fade.is-inview,
.js-fade-stagger.is-inview .js-fade {
  opacity: 1;
  filter: blur(0);
  transform: none;
}

@media screen and (max-width: 767px) {
  :root {
    --fade-blur: 6px;
    --fade-dist: 28px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .js-fade {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    transition: none !important;
  }
}

/**************-------------------------------------**************/
/*                           COMMON                             */
/**************-------------------------------------**************/

.socials-wrapper {
}
.follow-label {
  display: block;
  font-size: var(--font-size-md);
  color: var(--evergreen-200);
  margin-bottom: var(--spacing-md);
}
.socials {
  display: flex;
  gap: 14px;
  justify-content: flex-end;
}

.socials a {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--sandstone-200);
}
.socials a svg {
  width: 28px;
  height: 28px;
  display: block;
}

.socials a svg path {
  stroke: currentColor;
  fill: none;
}

@media screen and (max-width: 639px) {
  .socials {
    display: flex;
    gap: 8px;
  }

  .socials a,
  .socials a svg {
    width: 20px;
    height: 20px;
  }
}

/* SCROLL DOWN 1 */

.scroll-down-1 svg {
  width: 38px;
  overflow: visible;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
  }
}

/* LINE */
.scroll-down-1 .line {
  stroke-dasharray: 98;
  stroke-dashoffset: 98;

  animation: lineDraw 2.8s ease-in-out infinite;
}

@keyframes lineDraw {
  0% {
    stroke-dashoffset: 98;
    opacity: 1;
  }

  45% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

  58% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

  78% {
    stroke-dashoffset: 0;
    opacity: 0;
  }

  100% {
    stroke-dashoffset: 98;
    opacity: 0;
  }
}

/* CHEVRONS */
.scroll-down-1 svg {
  width: 38px;
  overflow: visible;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
  }
}

/* LINE */
.scroll-down-1 .line {
  stroke-dasharray: 98;
  stroke-dashoffset: 98;

  animation: lineDraw 2.8s ease-in-out infinite;
}

@keyframes lineDraw {
  0% {
    stroke-dashoffset: 98;
    opacity: 1;
  }

  45% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

  60% {
    stroke-dashoffset: 0;
    opacity: 1;
  }

  80% {
    stroke-dashoffset: 0;
    opacity: 0;
  }

  100% {
    stroke-dashoffset: 98;
    opacity: 0;
  }
}

.scroll-down-1 .chev {
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation: chev 2.8s ease-in-out infinite;
}

.scroll-down-1 .chev-top {
  animation-delay: 0.55s;
}

.scroll-down-1 .chev-mid {
  animation-delay: 0.72s;
}

.scroll-down-1 .chev-bot {
  animation-delay: 0.89s;
}

@keyframes chev {
  0% {
    opacity: 0;
    transform: translateY(-5px);
  }

  20% {
    opacity: 1;
    transform: translateY(0);
  }

  55% {
    opacity: 1;
    transform: translateY(0);
  }

  80% {
    opacity: 0;
    transform: translateY(10px);
  }

  100% {
    opacity: 0;
    transform: translateY(10px);
  }
}

@media screen and (max-width: 1279px) {
  .scroll-down-1 svg {
    width: 32px;
    overflow: visible;
  }
}

@media screen and (max-width: 639px) {
  .scroll-down-1 svg {
    width: 26px;
    overflow: visible;
  }
}

/* SCROLL DOWN 2 */

.scroll-down-2 svg {
  width: 38px;
  overflow: visible;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
  }
}

/* CHEVRONS */
.scroll-down-2 svg {
  width: 36px;
  overflow: visible;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
  }
}

.scroll-down-2 .chev {
  opacity: 0;

  transform-box: fill-box;
  transform-origin: center;

  animation: chev 2.8s ease-in-out infinite;
}

.scroll-down-2 .chev-top {
  animation-delay: 0.55s;
}

.scroll-down-2 .chev-mid {
  animation-delay: 0.72s;
}

.scroll-down-2 .chev-bot {
  animation-delay: 0.89s;
}

@keyframes chev {
  0% {
    opacity: 0;
    transform: translateY(-5px);
  }

  20% {
    opacity: 1;
    transform: translateY(0);
  }

  55% {
    opacity: 1;
    transform: translateY(0);
  }

  80% {
    opacity: 0;
    transform: translateY(10px);
  }

  100% {
    opacity: 0;
    transform: translateY(10px);
  }
}

@media screen and (max-width: 1279px) {
  .scroll-down-2 svg {
    width: 30px;
    overflow: visible;
  }
}

@media screen and (max-width: 639px) {
  .scroll-down-2 svg {
    width: 24px;
    overflow: visible;
  }
}

/**************-------------------------------------**************/
/*                           BUTTONS                             */
/**************-------------------------------------**************/
.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--body-font);
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--sandstone-500);
  padding: 16px 18px;
  border: 0.5px solid var(--sandstone-500);
  border-radius: var(--rounded-full);
  white-space: nowrap;
  line-height: 1.2;
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}

.btn-primary:hover {
  background: var(--sandstone-500);
  color: var(--evergreen-600);
  border-color: var(--sandstone-500);
}

.btn-consult {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--body-font);
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--sandstone-500);
  padding: 12px 18px;
  border: 0.5px solid var(--sandstone-500);
  border-radius: var(--rounded-full);
  white-space: nowrap;
  line-height: 1.2;
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}

.btn-consult:hover {
  background: var(--sandstone-500);
  color: var(--evergreen-600);
  border-color: var(--sandstone-500);
}

.btn-double-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-ms);
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--sandstone-400);
  padding: 18px 18px;
  border: 1px solid var(--sandstone-400);
  border-radius: var(--rounded-full);
  white-space: nowrap;
  line-height: 1.2;
  transition:
    color 0.4s ease,
    border-color 0.4s ease;
}

.btn-double-arrow:hover {
}

.btn-double-arrow .btn-arrow {
  transition: all 0.4s ease;
}

.btn-double-arrow:hover .btn-arrow--left {
  transform: translateX(-3px);
}

.btn-double-arrow:hover .btn-arrow--right {
  transform: translateX(3px);
}

.btn-double-arrow .btn-label {
}

.btn-double-arrow .btn-arrow,
.btn-single-arrow .btn-arrow {
  height: 22px;
  width: auto;
}

.btn-double-arrow .btn-arrow svg,
.btn-single-arrow .btn-arrow svg {
  width: auto;
  height: 100%;
}

.btn-double-arrow .btn-arrow--right {
}

.btn-double-arrow .btn-arrow svg {
}

.heading-wrapper .btn-consult {
  gap: 10px;
  overflow: hidden;
}

.heading-wrapper .btn-arrow svg {
  display: block;
  transition: transform 0.3s ease;
}

.heading-wrapper .btn-consult:hover .btn-arrow svg {
  transform: translateX(4px);
}

.btn-single-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--sandstone-500);
  padding: 16px 18px;
  border: 0.5px solid var(--sandstone-500);
  border-radius: var(--rounded-full);
  white-space: nowrap;
  line-height: 1.2;
  cursor: pointer;
  text-decoration: none;
}

.btn-single-arrow:hover {
}

.btn-single-arrow .btn-arrow svg path {
  transform-box: fill-box;
  transform-origin: center;
}

.btn-single-arrow:hover .btn-arrow svg path {
  animation: arrow-chevron-wave 0.6s ease;
}

.btn-single-arrow:hover .btn-arrow svg path:nth-child(2) {
  animation-delay: 0s;
}

.btn-single-arrow:hover .btn-arrow svg path:nth-child(1) {
  animation-delay: 0.1s;
}

@keyframes arrow-chevron-wave {
  0%,
  100% {
    transform: translateX(0);
  }
  40% {
    transform: translateX(2px);
  }
}

.btn-wave .btn-label {
  display: inline-flex;
  line-height: 1.4;
}

.btn-wave .btn-label .char {
  display: inline-block;
  white-space: pre;
}

.btn-wave:hover .btn-label .char {
  animation: char-wave 0.5s ease;
  animation-delay: calc(var(--i) * 0.03s);
}
@keyframes char-wave {
  0%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-6px);
  }
}

.btn-arrow svg {
  display: block;
  transition: transform 0.4s ease;
}
.btn-consult:hover .btn-arrow svg {
  transform: translateX(4px);
}

@media (prefers-reduced-motion: reduce) {
  .btn-label .char,
  .btn-single-arrow:hover .btn-arrow svg path {
    animation: none !important;
  }
  .btn-label .label-line.is-second .char {
    transform: none;
    opacity: 1;
  }
  .btn-label .label-line.is-first {
    display: none;
  }
}

@media screen and (max-width: 1279px) {
  .btn-consult,
  .btn-primary {
    padding: 8px 16px;
  }

  .btn-double-arrow,
  .btn-single-arrow {
    padding: 14px 16px;
  }

  .btn-double-arrow .btn-arrow,
  .btn-single-arrow .btn-arrow {
    height: 20px;
    width: auto;
  }
}

@media screen and (max-width: 639px) {
  .btn-double-arrow,
  .btn-single-arrow {
    padding: 12px 16px;
  }

  .btn-double-arrow .btn-arrow {
    height: 18px;
    width: auto;
  }
}

/**************-------------------------------------**************/
/*                           CONTENT PROSE                       */
/**************-------------------------------------**************/

.rich-description p + p {
  margin-top: var(--spacing-sm);
}

.rich-description a {
  color: inherit;
  font-weight: 600;
}

.rich-description a:hover {
  opacity: 0.9;
}

.content-prose h1,
.content-prose h2,
.content-prose h3,
.content-prose h4,
.content-prose h5,
.content-prose h6 {
  margin-bottom: var(--spacing-ms);
  line-height: 1.2;
  color: var(--sandstone-500);
}

.content-prose h1 {
  font-size: var(--font-size-9xl);
  font-weight: 500;
  font-family: var(--heading-font);
}
.content-prose h2 {
  font-size: var(--font-size-7xl);
  font-weight: 400;
  font-family: var(--heading-font);
}
.content-prose h3 {
  font-size: var(--font-size-4xl);
  font-weight: 400;
}
.content-prose h4 {
  font-size: var(--font-size-2xl);
  font-weight: 400;
}
.content-prose h5 {
  font-size: var(--font-size-xl);
  font-weight: 400;
}
.content-prose h6 {
  font-size: var(--font-size-lg);
  font-weight: 400;
}

.content-prose p {
  margin: 0 0 var(--spacing-sm) 0;
  color: var(--evergreen-200);
  font-weight: 300 !important;
}

.content-prose p:empty {
  padding-bottom: var(--spacing-lg);
}

.content-prose strong {
  font-weight: 600;
}

.content-prose a {
  color: var(--color-primary);
  text-decoration: none;
}
.content-prose a:hover,
.content-prose a:focus {
  opacity: 0.8;
}

.content-prose ul,
.content-prose ol {
  margin: var(--spacing-md) 0 var(--spacing-md) var(--spacing-lg);
  padding: 0;
  color: var(--evergreen-200);
  font-weight: 300 !important;
}

.content-prose ol ol {
  list-style-type: lower-alpha;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: var(--spacing-xl);
}
.content-prose ol ol ol {
  list-style-type: lower-roman;
}

.content-prose ul {
  list-style-type: disc;
}

.content-prose ul ul {
  margin-top: 0;
  margin-bottom: 0;
  list-style-type: circle;
  margin-left: var(--spacing-xl);
}

.content-prose ul ul ul {
  list-style-type: square;
}
.content-prose li {
  margin-bottom: var(--spacing-md);
}

.content-prose ol ol li,
.content-prose ul ul li {
  margin-bottom: 0;
}

.content-prose blockquote {
  border-left: 4px solid var(--evergreen-200);
  padding-left: 1em;
  color: var(--evergreen-200);
  font-style: italic;
  margin: var(--spacing-lg) 0;
}

.content-prose img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: var(--spacing-md) 0;
}

.content-prose .clickup-table-view {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.content-prose table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 1.5em;
  min-width: 600px;
}

.content-prose table th,
.content-prose table td {
  border: 1px solid #ddd;
  padding: 0.75em;
  text-align: left;
}

.content-prose .content-prose table th {
  background: #f9f9f9;
  font-weight: bold;
}

.content-prose code,
.content-prose pre {
  font-family: "Courier New", Courier, monospace;
  background: #f5f5f5;
  padding: 0.2em 0.4em;
  font-size: 90%;
}

.content-prose pre {
  padding: 1em;
  overflow: auto;
}

.content-prose hr {
  border: 0;
  border-top: 1px solid #eee;
  margin: 2em 0;
}

.content-prose .wp-caption {
  text-align: center;
  margin: 1.5em 0;
}

.content-prose .wp-caption img {
  margin: 0 auto;
}

.content-prose .wp-caption-text {
  font-size: 0.9em;
  color: #666;
  margin-top: 0.5em;
}

@media screen and (max-width: 639px) {
  .content-prose .wp-block-columns.is-layout-flex {
    gap: 0.5em !important;
  }
}

/**************-------------------------------------**************/
/*                           HEADER                             */
/**************-------------------------------------**************/

#header .top-bar {
  position: fixed;
  top: 0;
  padding-top: var(--spacing-md);
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  z-index: 100;
}

#header .top-bar .wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-ml);
  padding: 16px 24px;
  border: 1px solid rgba(255, 255, 255, 0.24);
  border-radius: var(--rounded-xl);
  background: var(--evergreen-700);
  transition:
    background-color 0.5s ease,
    border-color 0.5s ease;
}

#header.menu-is-open .top-bar .wrapper {
  border-color: transparent;
  background: transparent;
}

#header .top-bar .wrapper.js-fade {
  transition:
    opacity var(--fade-duration) var(--fade-ease),
    filter var(--fade-duration) var(--fade-ease),
    transform var(--fade-duration) var(--fade-ease),
    background-color 0.5s ease,
    border-color 0.5s ease;
}

.logo {
  display: flex;
  align-items: center;
  gap: 8px;
  position: relative;
  z-index: 101;
  margin-right: auto;
  transition: none !important;
}
.logo-icon img {
  height: 48px;
  width: auto;
  display: block;
}
.logo-text img {
  height: 48px;
  width: auto;
  display: block;
}

.menu-toggle {
  position: relative;
  z-index: 101;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  color: var(--color-primary);
}
.toggle-svg {
  width: 48px;
  height: auto;
  display: block;
}

#header .top-bar .btn-double-arrow {
  padding: 12px 16px;
  color: var(--sandstone-500);
  border: 0.5px solid var(--sandstone-500);
  font-size: var(--font-size-sm);
  gap: var(--spacing-sm);
}

#header .top-bar .btn-double-arrow .btn-arrow {
  height: 16px;
}

.btn-consult {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--body-font);
  font-size: var(--font-size-sm);
  font-weight: 500;
  color: var(--sandstone-500);
  padding: 12px 18px;
  border: 0.5px solid var(--sandstone-500);
  border-radius: var(--rounded-full);
  white-space: nowrap;
  line-height: 1.2;
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}

/* ---------- FULL SCREEN MENU ---------- */
.full-menu {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: var(--evergreen-700);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  will-change: opacity;
  transition:
    opacity 0.5s ease,
    visibility 0s linear 0.5s;
}
.full-menu.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 0.5s ease,
    visibility 0s;
}

.full-menu .container {
  height: 100%;
}

.full-menu .leaf-asset {
  position: absolute;
  right: 0;
  top: 10%;
  pointer-events: none;
}
.full-menu .leaf-asset svg {
  display: block;
  height: auto;
}

.full-menu .menu-inner {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  padding-top: calc(var(--spacing-md) + 12px);
  padding-bottom: var(--spacing-lg);
  padding-inline: 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--spacing-lg);
}

.full-menu .menu-middle {
  display: grid;
  grid-template-columns: minmax(0, 800px) minmax(500px, max-content);
  gap: var(--spacing-4xl);
  flex: 1;
}

.full-menu .menu-bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: var(--spacing-lg);
}

.full-menu .menu-bottom .lorem p {
  max-width: 380px;
  font-size: var(--font-size-sm);
  color: var(--sandstone-300);
  line-height: 1.3;
}

.full-menu .full-menu__left {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}

.full-menu .media {
  position: relative;
  width: 100%;
  height: 100%;
  max-width: 768px;
  max-height: 700px;
  border-radius: var(--rounded-xl);
  overflow: hidden;
  background: var(--evergreen-700);
  will-change: transform;
}
.full-menu .media-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom left;
  transform: translateZ(0);
  min-height: 200px;
}

.full-menu .media-video--mobile {
  display: none;
}

/* ---- Right column ---- */
.full-menu .full-menu__right {
  display: flex;
  flex-direction: column;
}

.full-menu .full-menu__logo-icon img {
  height: 48px;
  width: auto;
  display: block;
}

/* ---- Nav list ---- */
.full-menu .links a {
  cursor: pointer;
}
.full-menu .links .menu {
  list-style: none;
  margin: 0;
  padding: 0;
  margin-top: var(--spacing-xl);
}

.full-menu .links .menu > li:not(:last-child) {
  margin-bottom: var(--spacing-sm);
}

.full-menu .links .menu > li > a {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--heading-font);
  font-size: var(--font-size-5xl);
  font-weight: 400;
  line-height: 1.18;
  color: var(--evergreen-100);
  transition: color 0.3s ease;
}
.full-menu .links .menu > li > a:hover,
.full-menu .links .menu > .current-menu-item a {
  color: var(--sandstone-500);
}
.full-menu .links .current-menu-item > a {
  color: var(--color-primary);
}

/* ---- Treatment chevron ---- */
.full-menu .submenu-toggle {
  display: inline-flex;
  width: 28px;
  transition: transform 0.35s ease;
  margin-top: -5px;
}
.full-menu .submenu-toggle svg {
  width: 100%;
  height: auto;
}
.full-menu .menu-item-has-children.is-open .submenu-toggle {
  transform: rotate(90deg);
}

.full-menu .sub-menu {
  list-style: none;
  margin: 0;
  padding-top: var(--spacing-xs);
  overflow: hidden;
  height: 0;
  opacity: 0;
}
.full-menu .sub-menu li:last-child {
  padding-bottom: var(--spacing-sm);
}
.full-menu .sub-menu li a {
  display: block;
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  font-weight: 300;
  color: var(--color-white);
  padding: 3px 0;
  transition: color 0.25s ease;
}
.full-menu .sub-menu li a:hover {
  color: var(--sandstone-500);
}
.logo-slot {
  position: absolute;
  top: var(--spacing-md);
  left: 0;
}

.full-menu .btn-double-arrow {
  display: none;
}

@media screen and (max-width: 1279px) {
  #header .top-bar .wrapper {
    padding: 14px 20px;
  }
  .logo-icon img,
  .logo-text img {
    height: 38px;
  }
  header .toggle-svg {
    width: 38px;
  }

  .full-menu .menu-inner {
    gap: var(--spacing-xl);
  }
  .full-menu .menu-middle {
    gap: var(--spacing-2xl);
    grid-template-columns: minmax(0, 800px) minmax(400px, max-content);
  }

  .full-menu .links .menu {
    margin-top: 10vh;
  }
}

@media screen and (max-width: 1023px) {
  .full-menu .menu-middle {
    grid-template-columns: minmax(0, 800px) minmax(300px, max-content);
  }
}

@media screen and (max-width: 900px) {
  #header .top-bar .wrapper {
    padding: 8px;
    gap: var(--spacing-sm);
  }

  .logo-icon img,
  .logo-text img {
    height: 36px;
  }
  .toggle-svg {
    width: 36px;
  }

  header .btn-double-arrow {
    display: none;
  }

  .full-menu {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .full-menu::-webkit-scrollbar {
    display: none;
  }

  .full-menu .leaf-asset {
    position: absolute;
    right: 0%;
    top: 15%;
  }

  .full-menu .leaf-asset svg {
    width: 100%;
    height: 100%;
  }

  .full-menu .container {
    height: auto;
    min-height: 100%;
  }

  .full-menu .menu-inner {
    padding-bottom: var(--spacing-xl);
    padding-inline: 9px;
    padding-top: calc(var(--spacing-md) + 9px);
    gap: var(--spacing-xl);
    height: auto;
    min-height: 100%;
    justify-content: flex-start;
  }

  .full-menu .menu-middle {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: var(--spacing-lg);
  }
  .full-menu .full-menu__right {
    order: 1;
    min-width: 0;
    min-height: auto;
  }
  .full-menu .full-menu__left {
    order: 2;
    min-height: 212px;
  }

  .full-menu .menu-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-xl);
  }

  .full-menu .full-menu__logo-icon img {
    height: 32px;
  }

  .full-menu .media-video {
    position: relative;
  }

  .full-menu .media-video--desktop {
    display: none;
  }

  .full-menu .media-video--mobile {
    display: block;
  }

  .full-menu .btn-double-arrow {
    display: flex;
    padding: 12px 16px;
    gap: 20px;
    margin-block: var(--spacing-lg) var(--spacing-sm);
  }

  .full-menu .links .menu > li > a {
    font-size: var(--font-size-8xl);
  }

  .full-menu .submenu-toggle {
    width: 22px;
    margin-top: -4px;
  }

  .full-menu .leaf-asset {
    top: 10%;
  }
}

@media screen and (max-width: 639px) {
  .logo-text {
    display: none;
  }

  .logo-icon img {
    height: 32px;
  }

  .toggle-svg {
    width: 32px;
  }

  .full-menu .links .menu {
    margin-top: 5dvh;
  }
}

/**************-------------------------------------**************/
/*                         FOOTER USPS CAROUSEL                  */
/**************-------------------------------------**************/
.site-footer {
  overflow: hidden;
}
.site-footer .footer-usps-carousel {
  overflow: hidden;
  margin-bottom: var(--spacing-2xl);
  margin-top: var(--spacing-xl);
}

.footer-usps-carousel .wrapper {
  overflow: hidden;
  white-space: nowrap;
  position: relative;
}

.footer-usps-carousel .wrapper .cards {
  display: inline-flex;
  gap: var(--spacing-md);
  padding-left: var(--spacing-md);
  margin-left: -2px;
  animation: 24s infinite-slides infinite linear;
}

.footer-usps-carousel .wrapper .card {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  flex-shrink: 0;
}

.footer-usps-carousel .wrapper .card::after {
  content: "•";
  display: inline-block;
  color: var(--evergreen-400);
  font-size: var(--font-size-2xl);
  line-height: 1;
}

.footer-usps-carousel .wrapper .card .text {
  font-size: var(--font-size-2xl);
  line-height: 1;
  text-transform: uppercase;
  color: var(--evergreen-400);
}

@keyframes infinite-slides {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-100%);
  }
}

@media screen and (max-width: 1279px) {
  .footer-usps-carousel .wrapper .card .text {
    font-size: var(--font-size-lg);
  }

  .footer-usps-carousel .wrapper .card::after {
    font-size: var(--font-size-lg);
  }
}

@media screen and (max-width: 639px) {
  .footer-usps-carousel .wrapper .cards {
    gap: var(--spacing-sm);
    padding-left: var(--spacing-sm);
  }

  .footer-usps-carousel .wrapper .card {
    gap: var(--spacing-sm);
  }

  .footer-usps-carousel .wrapper .card .text {
    font-size: var(--font-size-md);
  }

  .footer-usps-carousel .wrapper .card::after {
    font-size: var(--font-size-md);
  }
}

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

.site-footer {
  position: relative;
  overflow: hidden;
  background-color: var(--evergreen-700);
}

.site-footer .footer-top {
  padding-block: var(--spacing-2xl);
}

.site-footer .footer-image-asset {
  position: absolute;
  right: 0;
  bottom: 0;
  top: 20%;
  z-index: 0;
  pointer-events: none;
}

.site-footer .footer-image-asset svg {
  height: 100%;
  max-height: 800px;
  stroke-width: 1px;
  stroke: rgba(244, 238, 226, 0.04);
}

.site-footer .container {
  position: relative;
  z-index: 1;
}

.site-footer .footer-brand {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2xl);
}

.site-footer .footer-brand .footer-logo-mark {
  height: 220px;
}

.site-footer .footer-brand .footer-logo-mark svg {
  height: 100%;
  width: auto;
}

.site-footer .footer-brand .footer-intro {
  color: var(--evergreen-200);

  max-width: 400px;
}

.site-footer .footer-brand .socials {
  justify-content: flex-start;
}

.site-footer .footer-heading {
  margin-bottom: var(--spacing-md);
  font-weight: 500;
  color: var(--evergreen-200);
}

.site-footer .footer-list {
  list-style: none;
}

.site-footer .footer-list li:not(:last-child) {
  margin-bottom: var(--spacing-xs);
}

.site-footer .footer-list a,
.site-footer .footer-list p {
  font-weight: 500;
  line-height: 1.6;
  color: var(--sandstone-500);
}

.site-footer .footer-list a:hover {
  color: var(--sandstone-100);
}

.site-footer .footer-info .footer-col:not(:last-child) {
  margin-bottom: var(--spacing-xl);
}

.site-footer .footer-top .accordion-toggle .arrow {
  display: none;
}

.site-footer .line {
  width: 100%;
  height: 1px;
  background-color: var(--color-border-1);
}

.site-footer .footer-top .footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: var(--spacing-2xl);
}

.site-footer .footer-bottom {
  margin-top: var(--spacing-3xl);
  background-color: var(--evergreen-700);
  z-index: 1;
  position: relative;
}

.site-footer .footer-bottom .line {
}

.site-footer .footer-bottom .wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--spacing-lg) 0;
}

.site-footer .footer-bottom a,
.site-footer .footer-bottom p {
  opacity: 0.4;
  font-size: var(--font-size-sm);
  color: var(--color-white);
}

.site-footer .footer-bottom a:hover {
  opacity: 1;
}

.site-footer .footer-bottom .footer-legal.footer-legal-mobile {
  display: none;
}

.site-footer .footer-bottom .footer-legal {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  list-style: none;
}

.site-footer .footer-bottom .footer-legal li:not(:last-child) {
  padding-right: var(--spacing-md);
  border-right: 1px solid rgba(255, 255, 255, 0.4);
}

.site-footer .footer-bottom .footer-legal a,
.site-footer .footer-bottom .footer-legal li {
  line-height: 1;
}

.site-footer .footer-bottom-mobile {
  display: none;
}

@media screen and (max-width: 1279px) {
  .site-footer .footer-brand .footer-logo-mark {
    height: 160px;
  }
}

@media screen and (max-width: 1023px) {
  .site-footer .footer-brand .footer-logo-mark {
    height: 140px;
  }

  .site-footer .footer-top .footer-grid {
    gap: var(--spacing-xl);
    grid-template-columns: 1fr 1fr 1fr;
  }

  .site-footer .footer-brand {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: var(--spacing-2xl);

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--spacing-2xl);
  }

  .site-footer .footer-brand .footer-intro {
    grid-column: 1 / 2;
    grid-row: 2;
  }

  .site-footer .footer-brand .footer-socials {
    grid-column: 2 / 3;
    grid-row: 2;
    display: flex;
    justify-content: end;
  }

  .site-footer .footer-brand .footer-socials .socials-wrapper {
    justify-content: flex-end;
    max-width: 200px;
  }

  .site-footer .footer-bottom .footer-legal {
    display: none;
  }

  .site-footer .footer-bottom .footer-legal.footer-legal-mobile {
    display: flex;
    margin-bottom: var(--spacing-xl);
  }

  .site-footer .footer-top {
    padding-bottom: 0;
  }
}

@media screen and (max-width: 639px) {
  .site-footer {
  }

  .site-footer .footer-image-asset {
    position: absolute;
    right: -30%;
    bottom: 0;
    top: 6%;
    z-index: 0;
    pointer-events: none;
    height: 300px;
  }

  .site-footer .footer-top {
    padding-top: var(--spacing-md);
  }

  .site-footer .footer-top .footer-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
  }

  .site-footer .footer-info {
    margin-bottom: var(--spacing-2xl);
    grid-row: 1;
  }

  .site-footer .footer-brand {
    margin-block: var(--spacing-3xl) var(--spacing-lg);
    grid-row: 4;
    display: flex;
    align-items: center;
  }

  .site-footer .footer-brand .footer-intro {
    text-align: center;
    font-size: var(--font-size-sm);
  }

  .site-footer .footer-brand .footer-socials {
    justify-content: center;
  }

  .site-footer .footer-brand .footer-socials .follow-label {
    text-align: center;
  }

  .site-footer .footer-accordion {
    border-top: 1px solid var(--color-border-2);
    grid-row: 2;
  }

  .site-footer .footer-accordion:last-of-type {
    border-bottom: 1px solid var(--color-border-2);
    grid-row: 3;
  }

  .site-footer .footer-heading {
    margin-bottom: var(--spacing-sm);
  }

  .site-footer .footer-accordion .accordion-toggle {
    width: 100%;
    background: none;
    border: none;
    padding: var(--spacing-ml) 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font: inherit;
    color: inherit;
    cursor: pointer;
  }

  .site-footer .footer-accordion .accordion-toggle .footer-heading {
    margin-bottom: 0;
  }

  .site-footer .footer-accordion .accordion-toggle .arrow {
    display: block;
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
    margin-top: 6px;
  }

  .site-footer .footer-accordion.open .accordion-toggle .arrow {
    transform: rotate(180deg);
  }

  .site-footer .footer-accordion .footer-list {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
  }

  .site-footer .footer-accordion .footer-list a {
    font-size: var(--font-size-sm);
    color: #fff;
    font-weight: 300;
  }

  .site-footer .footer-accordion.open .footer-list {
    padding-bottom: var(--spacing-md);
  }

  .site-footer .footer-bottom-mobile {
    display: block;
  }

  .site-footer .footer-bottom-mobile .footer-legal {
    justify-content: space-between;
    max-width: var(--max-width-sm);
    margin: 0 auto var(--spacing-xl);
  }

  .site-footer .footer-bottom-mobile .footer-legal a {
    opacity: 0.4;
    font-size: var(--font-size-xs);
  }

  .site-footer .footer-bottom-mobile .footer-legal a:hover {
    opacity: 1;
  }

  .site-footer .footer-bottom .wrapper {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    gap: var(--spacing-xs);
    padding: var(--spacing-xl) 0;
  }

  .site-footer .footer-bottom .wrapper a,
  .site-footer .footer-bottom .wrapper p {
    font-size: var(--font-size-xs);
  }
}

/**************-------------------------------------**************/
/*                         BACK TO TOP                           */
/**************-------------------------------------**************/
.back-to-top {
  --btt-size: 56px;
  --btt-offset: 32px;
  --btt-icon: 18px;
  position: fixed;
  right: max(var(--btt-offset), env(safe-area-inset-right));
  bottom: max(var(--btt-offset), env(safe-area-inset-bottom));
  z-index: 80;
  display: grid;
  place-items: center;
  width: var(--btt-size);
  height: var(--btt-size);
  padding: 0;
  border: 0;
  border-radius: var(--rounded-full);
  background: var(--evergreen-700);
  color: var(--sandstone-500);
  box-shadow:
    0 14px 30px -14px rgba(3, 43, 25, 0.6),
    0 2px 8px rgba(3, 43, 25, 0.16);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  opacity: 0;
  visibility: hidden;
  transform: translate3d(0, 16px, 0) scale(0.92);
  translate: 0 calc(var(--btt-lift, 0px) * -1);
  transition:
    opacity 0.5s ease,
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.7s,
    background-color 0.4s ease,
    border-color 0.4s ease;
}

.back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition-delay: 0s;
}

.back-to-top:focus-visible {
  outline: 1px solid var(--evergreen-400);
  outline-offset: 2px;
}

.back-to-top:active {
  transform: scale(0.94);
}

.back-to-top-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
  pointer-events: none;
}

.back-to-top-ring circle {
  fill: none;
}

.back-to-top-track {
  stroke: rgba(223, 205, 172, 0.16);
  stroke-width: 1;
  transition: stroke 0.4s ease;
}

.back-to-top-progress {
  stroke: var(--sandstone-500);
  stroke-width: 1.25;
  stroke-dasharray: 1;
  stroke-dashoffset: calc(1 - var(--btt-progress, 0));
}

.back-to-top-icon {
  position: relative;
  width: var(--btt-icon);
  height: auto;
  overflow: visible;
  transform: scaleY(-1);
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}

.back-to-top-icon .chev {
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
  transition: opacity 0.4s ease;
}

.back-to-top-icon .chev-top {
  opacity: 1;
}

.back-to-top-icon .chev-mid {
  opacity: 0.6;
}

.back-to-top-icon .chev-bot {
  opacity: 0.3;
}

@media (hover: hover) {
  .back-to-top:hover {
    background: var(--evergreen-600);
    border-color: rgba(223, 205, 172, 0.4);
  }

  .back-to-top:hover .back-to-top-track {
    stroke: rgba(223, 205, 172, 0.28);
  }

  .back-to-top:hover .back-to-top-icon {
    transform: translateY(-2px) scaleY(-1);
  }

  .back-to-top:hover .back-to-top-icon .chev {
    animation: btt-chev 1.4s ease-in-out infinite;
  }

  .back-to-top:hover .back-to-top-icon .chev-mid {
    animation-delay: 0.15s;
  }

  .back-to-top:hover .back-to-top-icon .chev-top {
    animation-delay: 0.3s;
  }
}

@keyframes btt-chev {
  0%,
  100% {
    opacity: 0.25;
  }

  40% {
    opacity: 1;
  }
}

@media screen and (max-width: 1023px) {
  .back-to-top {
    --btt-size: 50px;
    --btt-offset: 10px;
    --btt-icon: 16px;
  }
}

@media screen and (max-width: 767px) {
  .back-to-top {
    --btt-size: 42px;
    --btt-offset: 5px;
    --btt-icon: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .back-to-top,
  .back-to-top.is-visible,
  .back-to-top:active {
    transform: none;
  }

  .back-to-top-icon,
  .back-to-top:hover .back-to-top-icon {
    transition: none;
    transform: scaleY(-1);
  }
}

@media print {
  .back-to-top {
    display: none;
  }
}

/**************-------------------------------------**************/
/*                        INTRO / REVEAL                         */
/**************-------------------------------------**************/
html.is-revealing:has(.hero-reveal),
html.is-revealing:has(.hero-reveal) body {
  overflow: hidden;
  overscroll-behavior: none;
}

html.reveal-seen .hero-reveal {
  display: none;
}

:root {
  --intro-handoff: 3s;
}

.hero-reveal {
  position: fixed;
  inset: 0;
  z-index: 200;
  overflow: hidden;
  overscroll-behavior: contain;
  touch-action: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  color: var(--color-primary);
  background: var(--evergreen-900);
  opacity: 1;
  transition: opacity var(--intro-handoff) cubic-bezier(0.45, 0, 0.55, 1);
}

.hero-reveal.is-hidden {
  opacity: 0;
  pointer-events: none;
}

.hero-reveal .intro__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  will-change: transform;
}

.hero-reveal .intro__media img,
.hero-reveal .intro__media video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.intro__video--mobile {
  display: none;
}

@media (max-width: 639px) {
  .intro__video--desktop {
    display: none;
  }

  .intro__video--mobile {
    display: block;
  }
}

.hero-reveal .intro__content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  gap: var(--spacing-md);
  padding: var(--spacing-lg);
  margin-bottom: 10vh;
}

.hero-reveal .intro__start {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 0;
  background: none;
  border: none;
  color: inherit;
  cursor: pointer;
}
.hero-reveal .intro__mark img {
  width: 80px;
  height: auto;
  display: block;
  transition: transform 0.6s ease;
  will-change: transform;
}
.hero-reveal .intro__start:hover .intro__mark img {
  transform: scale(1.05);
}
.hero-reveal .intro__mark svg {
  display: block;
  width: 80px;
  height: auto;
  transform-origin: center;
  animation: logo-spin 32s linear infinite;
  animation-play-state: paused;
}
.hero-reveal.is-logo-spin .intro__mark svg {
  animation-play-state: running;
}
@keyframes logo-spin {
  to {
    transform: rotate(360deg);
  }
}
.hero-reveal .intro__start-label {
  font-size: var(--font-size-md);
  color: var(--sandstone-500);
  transition: transform 0.6s ease;
  margin-bottom: var(--spacing-md);
}

.hero-reveal .intro__start:hover .intro__start-label {
  color: var(--sandstone-300);
  display: block;
}

.hero-reveal .intro__taglines {
  display: grid;
  place-items: center;
}
.hero-reveal .intro__taglines .intro__tagline {
  grid-area: 1 / 1;
}
.hero-reveal .intro__tagline {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-6xl);
  line-height: 1.2;
  max-width: 20ch;
  color: var(--sandstone-500);
}

.hero-reveal .intro__audio {
  position: absolute;
  right: var(--spacing-xl);
  bottom: var(--spacing-lg);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  font-size: var(--font-size-xs);
  color: var(--sandstone-200);
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.hero-reveal .audio-wave {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 34px;
}
.hero-reveal .audio-wave i {
  display: block;
  width: 1px;
  height: 100%;
  background: currentColor;
  border-radius: 3px;
  transform: scaleY(0.28);
  transform-origin: center;
  transition: transform 0.35s ease;
}
.hero-reveal .intro__audio.is-on .audio-wave i {
  animation: audio-bar 0.9s ease-in-out infinite;
}
.hero-reveal .intro__audio.is-on .audio-wave i:nth-child(1) {
  animation-delay: -0.7s;
}
.hero-reveal .intro__audio.is-on .audio-wave i:nth-child(2) {
  animation-delay: -0.2s;
}
.hero-reveal .intro__audio.is-on .audio-wave i:nth-child(3) {
  animation-delay: -0.5s;
}
.hero-reveal .intro__audio.is-on .audio-wave i:nth-child(4) {
  animation-delay: -0.1s;
}
.hero-reveal .intro__audio.is-on .audio-wave i:nth-child(5) {
  animation-delay: -0.4s;
}
@keyframes audio-bar {
  0%,
  100% {
    transform: scaleY(0.28);
  }
  50% {
    transform: scaleY(1);
  }
}

.hero-reveal .intro__tagline,
.hero-reveal .intro__mark,
.hero-reveal .intro__start-wrapper {
  opacity: 0;
  visibility: hidden;
}
.hero-reveal .intro__media,
.hero-reveal .intro__audio {
  opacity: 0;
}

.hero-reveal.is-done {
  display: none;
}

@media screen and (max-width: 767px) {
  .hero-reveal .intro__mark img {
    width: 52px;
  }
  .hero-reveal .intro__tagline {
    font-size: var(--font-size-5xl);
    max-width: 18ch;
  }
  .hero-reveal .intro__audio {
    right: var(--spacing-md);
    bottom: var(--spacing-md);
  }
}

/**************-------------------------------------**************/
/*                         HOME COMMON                           */
/**************-------------------------------------**************/
.hero-common {
  height: 100dvh;
  position: relative;
}

.hero-common .hero-bg-video {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.hero-common .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.hero-common .hero-bg-video picture {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  overflow: hidden;
  pointer-events: none;
}

.hero-common .hero-bg-video picture img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: bottom;
}

.hero-common .container {
  z-index: 3;
  padding-block: calc(var(--spacing-5xl) + 100px) var(--spacing-3xl);
  position: absolute;
  inset: 0;
  width: 100%;
}

.hero-common .wrapper {
  margin: 0 auto;
  max-width: var(--container-sm);
}

.hero-common .wrapper .heading {
  color: var(--sandstone-500);
}

.hero-common .wrapper .description {
  margin-top: var(--spacing-md);
  font-weight: 300;
  color: var(--chasenut-100);
}

.hero-common .scroll-to {
  margin-top: var(--spacing-lg);
  margin-inline: auto;
  max-width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  position: relative;
  z-index: 5;
}

.hero-common .scroll-to:hover {
  color: var(--sandstone-200);
}

@media screen and (max-width: 1023px) {
  .hero-common .scroll-to {
    font-size: var(--font-size-lg);
  }
}

@media screen and (max-width: 639px) {
}

/**************-------------------------------------**************/
/*                         HOME HERO                          */
/**************-------------------------------------**************/

.home-hero figure {
  margin: 0 !important;
}

.home-hero {
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.home-hero .hero-content {
  height: 120dvh;
  position: relative;
  overflow: hidden;
}

.home-hero .hero-content .bg-image {
  position: absolute;
  inset: 0;
  z-index: -1;
}
.home-hero .hero-content .hero-bg-video picture {
}

.home-hero .hero-content .hero-bg-video {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: var(--evergreen-900);
}
.home-hero .hero-content .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-hero .hero-content .hero-bg-video :is(video, picture) {
  transition: opacity calc(var(--intro-handoff) * 0.6)
    cubic-bezier(0.33, 1, 0.68, 1);
}
html.is-revealing:not(.is-hero-entering)
  .home-hero
  .hero-content
  .hero-bg-video
  :is(video, picture) {
  opacity: 0;
}
.home-hero .hero-content .hero-bg-video picture {
  position: absolute;
  inset: auto 0 0 0;
  width: 100%;
  height: auto;
}
.home-hero .hero-content .hero-bg-video picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.home-hero .hero-content {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
}
.home-hero .hero-content .container {
  width: 100%;
}
.home-hero .hero-content .wrapper {
  max-width: var(--container-md);
  margin-inline: auto;
  padding-bottom: var(--spacing-7xl);
}

.home-hero .hero-content .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.home-hero .hero-content .description {
  display: block;
  font-family: var(--body-font);
  font-size: var(--font-size-3xl);
  font-weight: 300;
  color: var(--sandstone-500);
}

.home-hero .hero-content .description::after {
  content: "";
  display: block;
  width: 50px;
  height: 2px;
  margin: clamp(14px, 2.2vh, 26px) auto;
  background: var(--sandstone-500);
  opacity: 0;
  transition: opacity 0.6s ease 0.2s;
}
.home-hero .hero-content .description.is-inview::after {
  opacity: 0.7;
}
.home-hero .hero-content .heading-2xl {
  color: var(--sandstone-500);
}

.home-hero .hero-content .action {
  position: absolute;
  left: 50%;
  bottom: clamp(20px, 4vh, 44px);
  transform: translateX(-50%);
  z-index: 2;
  opacity: 0;
  transition: opacity 0.7s ease;
}
.home-hero .hero-content .action.is-inview {
  opacity: 1;
}
.home-hero .hero-content .scroll-to {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  color: var(--sandstone-500);
  font-size: var(--font-size-lg);
  transition: color 0.3s ease;
}
.home-hero .hero-content .scroll-to p {
  margin: 0;
}
.home-hero .hero-content .scroll-to:hover {
  color: var(--sandstone-300);
}

.home-hero .hero-content .intro__audio {
  position: absolute;
  right: var(--spacing-xl);
  bottom: 25dvh;
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  font-size: var(--font-size-xs);
  color: var(--sandstone-200);
  text-align: center;
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.6s ease;
  -webkit-tap-highlight-color: transparent;
}
.home-hero .hero-content .intro__audio.is-inview {
  opacity: 1;
}
.home-hero .hero-content .audio-wave {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 34px;
}
.home-hero .hero-content .audio-wave i {
  display: block;
  width: 1px;
  height: 100%;
  background: currentColor;
  border-radius: 3px;
  transform: scaleY(0.28);
  transform-origin: center;
  transition: transform 0.35s ease;
}
.home-hero .hero-content .intro__audio.is-on .audio-wave i {
  animation: audio-bar 0.9s ease-in-out infinite;
}
.home-hero .hero-content .intro__audio.is-on .audio-wave i:nth-child(1) {
  animation-delay: -0.7s;
}
.home-hero .hero-content .intro__audio.is-on .audio-wave i:nth-child(2) {
  animation-delay: -0.2s;
}
.home-hero .hero-content .intro__audio.is-on .audio-wave i:nth-child(3) {
  animation-delay: -0.5s;
}
.home-hero .hero-content .intro__audio.is-on .audio-wave i:nth-child(4) {
  animation-delay: -0.1s;
}
.home-hero .hero-content .intro__audio.is-on .audio-wave i:nth-child(5) {
  animation-delay: -0.4s;
}

@media screen and (max-width: 1279px) {
  .home-hero .hero-content {
    height: 100dvh;
  }

  .home-hero .hero-content .intro__audio {
    bottom: var(--spacing-2xl);
  }
}

@media screen and (max-width: 767px) {
  .home-hero .hero-content .intro__audio {
    top: 80px;
    right: var(--spacing-md);
    bottom: auto;
  }

  .home-hero .hero-content .description {
    font-size: var(--font-size-xl);
  }

  .home-hero .hero-content .description.is-inview::after {
    width: 36px;
    height: 1px;
    margin-top: 16px;
  }

  .home-hero .hero-content .wrapper {
    padding-bottom: var(--spacing-9xl);
  }
}

/**************-------------------------------------**************/
/*                         DEFAULT HERO                          */
/**************-------------------------------------**************/
.default-hero {
  height: 600px;
  padding-block: calc(var(--spacing-xl) + 100px) var(--spacing-3xl);
  background-color: var(--evergreen-700);
  color: var(--sandstone-500);
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.default-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.default-hero .wrapper {
  margin: 0 auto;
  max-width: var(--container-md);
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.3s ease;
}

.default-hero .wrapper.is-visible {
  opacity: 1;
}

.faq-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}

.faq-hero.is-visible {
  opacity: 1;
}

.faq-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.pricemenu-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}
.pricemenu-hero.is-visible {
  opacity: 1;
}
.pricemenu-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.facility-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}
.facility-hero.is-visible {
  opacity: 1;
}
.facility-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.testimonials-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}
.testimonials-hero.is-visible {
  opacity: 1;
}
.testimonials-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

/**************-------------------------------------**************/
/*                         TESTIMONIALS HERO                     */
/**************-------------------------------------**************/
.testimonials-hero .wrapper {
  margin-left: 0;
  max-width: var(--container-sm);
}

.testimonials-hero .wrapper .heading {
  color: var(--chasenut-500);
}

.testimonials-hero .wrapper .description {
  color: var(--chasenut-400);
  max-width: var(--container-sm);
}

@media screen and (max-width: 639px) {
  .testimonials-hero .wrapper .heading,
  .testimonials-hero .wrapper .description {
    color: var(--chasenut-100);
  }
}

/**************-------------------------------------**************/
/*                       PACKAGES HERO                           */
/**************-------------------------------------**************/
.packages-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}

.packages-hero.is-visible {
  opacity: 1;
}
.packages-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.packages-hero {
  height: auto;
  overflow: hidden;
}

.packages-hero .container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.packages-hero .wrapper {
  flex: 0 0 auto;
  max-width: var(--container-lg);
  padding-bottom: var(--spacing-lg);
  min-height: auto;
}
.packages-hero .wrapper .heading {
  max-width: 10.2em;
  margin-inline: auto;
}
.packages-hero .wrapper .description {
  max-width: 580px;
  margin-inline: auto;
}

.packages-hero .packages-guide {
  --branch-w: clamp(240px, min(42vw, 72vh), 600px);
  --branch-stroke: 1.5;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--sandstone-400);
  margin-top: var(--spacing-xl);
}

.packages-hero .packages-branch {
  display: block;
  width: var(--branch-w);
  height: auto;
  overflow: visible;
}

.packages-hero .branch-line {
  stroke-width: var(--branch-stroke);
  stroke-dasharray: var(--len, 1000);
  stroke-dashoffset: var(--len, 1000);
}
.packages-hero .branch-stem {
  --draw-dur: 0.6s;
  --draw-ease: cubic-bezier(0.55, 0.05, 0.7, 0.3);
  --draw-delay: 0s;
}
.packages-hero .branch-path {
  --draw-dur: 1.3s;
  --draw-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --draw-delay: 0.55s;
}
.packages-hero .branch-head {
  --draw-dur: 0.35s;
  --draw-ease: ease-out;
  --draw-delay: 1.75s;
}

.packages-hero .packages-guide.is-drawn .branch-line {
  stroke-dashoffset: 0;
  transition:
    stroke-dashoffset var(--draw-dur) var(--draw-ease) var(--draw-delay),
    stroke 0.4s ease,
    stroke-width 0.4s ease;
}

.packages-hero .branch-pulse {
  stroke: var(--sandstone-200);
  stroke-width: calc(var(--branch-stroke) * 1.4);
  stroke-dasharray: 48 2000;
  stroke-dashoffset: 48;
  opacity: 0;
}
.packages-hero .packages-guide.is-drawn .branch-pulse {
  animation: pkg-branch-flow 5.5s cubic-bezier(0.45, 0, 0.55, 1) 2.3s infinite;
}
@keyframes pkg-branch-flow {
  0% {
    stroke-dashoffset: 48;
    opacity: 0;
  }
  8% {
    opacity: 0.9;
  }
  45% {
    opacity: 0.9;
  }
  55% {
    stroke-dashoffset: -480;
    opacity: 0;
  }
  100% {
    stroke-dashoffset: -480;
    opacity: 0;
  }
}

/* ---- options ---- */
.packages-hero .packages-options {
  width: 100%;
  margin-top: calc(var(--spacing-md) - var(--branch-w) * 0.2);
  display: grid;
  grid-template-columns: repeat(3, min(calc(var(--branch-w) * 0.72), 33.333%));
  justify-content: center;
  align-items: start;
}
.packages-hero .pkg-option {
  --reveal-delay: 1.55s;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: var(--sandstone-500);
  text-decoration: none;
  opacity: 0;
  filter: blur(var(--fade-blur));
  transform: translate3d(0, 24px, 0);
  transition:
    opacity var(--fade-duration) var(--fade-ease) var(--reveal-delay),
    filter var(--fade-duration) var(--fade-ease) var(--reveal-delay),
    transform var(--fade-duration) var(--fade-ease) var(--reveal-delay),
    color 0.4s ease;
}
.packages-hero .pkg-option--center {
  --reveal-delay: 1.8s;
  margin-top: calc(var(--branch-w) * 0.1917);
}
.packages-hero .packages-guide.is-drawn .pkg-option {
  opacity: 1;
  filter: blur(0);
  transform: none;
}
.packages-hero .pkg-option-title {
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-6xl);
  line-height: 1.1;
  color: var(--sandstone-400);
  white-space: nowrap;
  transition: color 0.4s ease;
}
.packages-hero .pkg-option-text {
  margin-top: var(--spacing-sm);
  max-width: 260px;
  font-family: var(--body-font);
  font-weight: 300;
  line-height: 1.4;
  color: var(--chasenut-100);
}
.packages-hero .pkg-option .scroll-down-2 {
  margin-top: clamp(0.75rem, 2vh, 1.25rem);
  color: var(--sandstone-500);
}

@media (hover: hover) and (pointer: fine) {
  .packages-hero .pkg-option:hover {
    color: var(--sandstone-300);
  }
  .packages-hero .pkg-option:hover .pkg-option-title {
    color: var(--sandstone-200);
  }
  .packages-hero .packages-guide:has(.pkg-option:hover) .branch-stem,
  .packages-hero
    .packages-guide:has([data-branch="left"]:hover)
    .branch[data-branch="left"]
    .branch-line,
  .packages-hero
    .packages-guide:has([data-branch="center"]:hover)
    .branch[data-branch="center"]
    .branch-line,
  .packages-hero
    .packages-guide:has([data-branch="right"]:hover)
    .branch[data-branch="right"]
    .branch-line {
    stroke: var(--sandstone-200);
    stroke-width: calc(var(--branch-stroke) * 1.5);
  }
}

@media (prefers-reduced-motion: reduce) {
  .packages-hero .branch-line {
    stroke-dasharray: none;
    stroke-dashoffset: 0;
    transition: stroke 0.4s ease;
  }
  .packages-hero .branch-pulses {
    display: none;
  }
  .packages-hero .pkg-option {
    opacity: 1;
    filter: none;
    transform: none;
    transition: color 0.4s ease;
  }
}

@media screen and (max-width: 1023px) {
  .packages-hero .packages-guide {
    --branch-stroke: 2;
  }
  .packages-hero .pkg-option-title {
    font-size: var(--font-size-5xl);
    white-space: normal;
  }
}

/* ---- responsive ---- */
@media screen and (max-width: 639px) {
  .packages-hero .packages-guide {
    --branch-w: clamp(200px, 62vw, 280px);
    --branch-stroke: 2.6;
  }
  .packages-hero .packages-options {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .packages-hero .pkg-option-title {
    font-size: var(--font-size-xl);
  }
  .packages-hero .pkg-option-text {
    font-size: var(--font-size-xs);
  }
  .packages-hero .scroll-down-2 svg {
    width: 20px;
  }
}

.default-hero .wrapper .description {
  margin-top: var(--spacing-md);
  font-weight: 300;
  color: #fff;
}

@media screen and (max-width: 1023px) {
  .default-hero {
    height: 480px;
  }
}

@media screen and (max-width: 639px) {
  .default-hero {
    height: 400px;
    padding-block: calc(var(--spacing-xl) + 60px) var(--spacing-3xl);
  }
}

/**************-------------------------------------**************/
/*                         CONTENT AREA                          */
/**************-------------------------------------**************/
.content-area {
  padding-top: var(--spacing-3xl);
  padding-bottom: var(--spacing-6xl);
  background-color: var(--color-white);
  position: relative;
}

.content-area .content-prose {
  max-width: var(--container-md);
  margin-inline: auto;
}

p:empty {
  display: none;
}

.content-area .image-asset {
  position: absolute;
  right: 0;
  bottom: var(--spacing-4xl);
}

/**************-------------------------------------**************/
/*                           FAQs With Hero                      */
/**************-------------------------------------**************/
.faqs-with-hero {
  background-color: var(--sandstone-100);
}
.faqs-with-hero .hero-common .heading {
  color: var(--sandstone-500);
}

.faqs-with-hero .faqs-area {
  position: relative;
  padding-bottom: var(--spacing-6xl);
  z-index: 2;
  background-color: transparent;
}

/**************-------------------------------------**************/
/*                           FAQs Area                           */
/**************-------------------------------------**************/
.faqs-area {
  padding-bottom: var(--spacing-6xl);
  background-color: var(--sandstone-100);
}

.faqs-area:has(+ .faqs-cta),
.faqs-with-hero:has(+ .faqs-cta) .faqs-area {
  padding-bottom: 0;
}

.faqs-area .wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: flex-start;
}

.faqs-area .heading-wrapper {
  display: flex;
  gap: var(--spacing-md);
  color: var(--chasenut-500);
  align-items: center;
  max-width: 460px;
  align-self: start;
}

.faqs-area .heading-wrapper .icon {
  width: 64px;
  height: 64px;
  flex-shrink: 0;
}

.faqs-area .heading-wrapper .heading {
  font-weight: 400;
  font-family: var(--body-font);
  font-size: var(--font-size-5xl);
}

.faqs-area .accordion .accordion-item {
  border-bottom: 1px solid var(--chasenut-200);
}

.faqs-area .accordion .accordion-item.open {
}

.faqs-area .accordion button {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-ml);
  text-align: left;
  width: 100%;
  padding-block: var(--spacing-ml) var(--spacing-ml);
  color: var(--chasenut-500);
  font-size: var(--font-size-xl);
  font-weight: 400;
  border: none;
  background: none;
  outline: none;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.faqs-area .accordion button .accordion-title {
  margin-right: auto;
  transition: color 0.3s ease-in-out;
}

.faqs-area .accordion-item.open .accordion-title {
}

.faqs-area .accordion button .icon {
  flex-shrink: 0;
  transition: transform 0.3s ease-in-out;
  margin-top: var(--spacing-sm);
}

.faqs-area .accordion-item.open button .icon {
  transform: rotate(180deg);
}

.faqs-area .accordion button .icon svg {
  width: 13px;
}

.faqs-area .accordion-item button .icon svg path {
  stroke: var(--chasenut-500);
  stroke-width: 1.5px;
}

.faqs-area .accordion-content {
  font-weight: 300;
  color: var(--chasenut-300) !important;
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition:
    height 0.3s linear,
    opacity 0.3s linear;
  will-change: height, opacity;
}

.faqs-area .accordion-content .content-prose {
  padding-bottom: var(--spacing-ml);
}

.faqs-area .accordion-content .content-prose p,
.faqs-area .accordion-content .content-prose li {
  color: var(--chasenut-300);
}

.faqs-area .accordion-item.open .accordion-content {
  opacity: 1;
}

@media screen and (max-width: 1023px) {
  .faqs-area .wrapper {
    display: block;
    max-width: var(--container-sm);
    margin-inline: auto;
  }

  .faqs-area .heading-wrapper {
    margin-bottom: var(--spacing-xl);
  }

  .faqs-area .heading-wrapper .icon {
    width: 48px;
    height: 48px;
  }
}

@media screen and (max-width: 640px) {
  .faqs-area .heading-wrapper .icon {
    width: 32px;
    height: 32px;
  }
}

/**************-------------------------------------**************/
/*                           CTA SECTION 1                       */
/**************-------------------------------------**************/

.cta-section-1 {
  height: 1000px;
  color: var(--sandstone-500);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  text-align: center;
  position: relative;
  overflow: hidden;
}

.cta-section-1 .bg-video {
  position: relative;
  z-index: 1;
  width: 100%;
  height: 100%;
}

.cta-section-1 .bg-video video {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.cta-section-1 .bg-video picture {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  width: 100%;
  height: auto;
  overflow: hidden;
}

.cta-section-1 .bg-video picture img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: top;
}

.cta-section-1 .container {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--spacing-7xl);
  width: 100%;
  z-index: 3;
}

.cta-section-1 .cta-inner {
  max-width: var(--container-md);
  margin-inline: auto;
}

.cta-section-1 .cta-icon {
  width: 72px;
  height: auto;
  margin-inline: auto;
}

.cta-section-1 .cta-icon svg,
.cta-section-1 .cta-icon img {
  width: 100%;
  height: auto;
}

.cta-section-1 .cta-title {
  padding-block: var(--spacing-lg);
  font-size: var(--font-size-8xl);
}

.cta-section-1 .cta-text {
  font-weight: 300;
  margin-bottom: var(--spacing-xl);
  max-width: var(--container-sm);
  margin-inline: auto;
}

.cta-section-1 .cta-action {
  margin-top: var(--spacing-lg);
}

@media screen and (max-width: 1279px) {
  .cta-section-1 {
    height: 620px;
  }
}

@media screen and (max-width: 1023px) {
  .cta-section-1 .cta-icon {
    width: 64px;
  }
}

@media screen and (max-width: 639px) {
  .cta-section-1 {
    height: 580px;
  }
  .cta-section-1 .cta-icon {
    width: 58px;
  }

  .cta-section-1 .bg-video picture img {
    object-fit: contain;
  }

  .cta-section-1 .bg-video picture {
    height: 400px;
  }
}

/**************-------------------------------------**************/
/*                           TESTIMONIALS CTA                    */
/**************-------------------------------------**************/
.testimonials-cta .bg-video picture {
  height: auto;
}

/**************-------------------------------------**************/
/*                            ERROR 404                          */
/**************-------------------------------------**************/

.error-404 {
  min-height: 100dvh;
  color: var(--sandstone-500);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  overflow: hidden;
  padding-block: var(--spacing-8xl) var(--spacing-6xl);
}

.error-404 .bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}

.error-404 .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.error-404 .bg-image .overlay {
  background: linear-gradient(
    90deg,
    rgba(37, 43, 9, 0.92) 0%,
    rgba(37, 43, 9, 0.82) 30%,
    transparent 80%
  );

  position: absolute;
  inset: 0;
}

.error-404 .container {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-xl);
  width: 100%;
}

.error-404 .content {
  max-width: var(--max-width-md);
  flex-shrink: 0;
}

.error-404 .content .title {
  font-size: var(--font-size-8xl);
  font-weight: 400;
  color: var(--sandstone-500);
  margin-bottom: var(--spacing-md);
  line-height: 1.2;
}

.error-404 .text {
  font-size: var(--font-size-md);
  font-weight: 300;
  color: var(--evergreen-100);
  margin-bottom: var(--spacing-lg);
}

.error-404 .action {
  display: flex;
}

.error-404 .error-code {
  font-family: var(--heading-font);
  font-size: 380px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -4px;
  color: var(--sandstone-500);
  flex-shrink: 0;
  margin-top: var(--spacing-2xl);
}

@media screen and (max-width: 1279px) {
  .error-404 .error-code {
    font-size: 280px;
  }
}

@media screen and (max-width: 1023px) {
  .error-404 .error-code {
    font-size: 200px;
  }
}
@media screen and (max-width: 767px) {
  .error-404 .container {
    flex-direction: column-reverse;
    text-align: center;
  }
  .error-404 .error-code {
    font-size: 180px;
  }

  .error-404 .action {
    justify-content: center;
  }
}

/**************-------------------------------------**************/
/*                         CONTACT WITH HERO                     */
/**************-------------------------------------**************/
.contact-with-hero {
  background-color: var(--sandstone-100);
}

.contact-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}

.contact-hero.is-visible {
  opacity: 1;
}

.contact-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.contact-with-hero .wrapper {
  margin-left: 0;
}

.contact-with-hero .contact-section .container {
  z-index: 3;
  position: relative;
}

.contact-with-hero .wrapper .heading {
  color: var(--sandstone-500);
}

.contact-with-hero .wrapper .description {
  color: var(--sandstone-200);
}

/**************-------------------------------------**************/
/*                         CONTACT SECTION                       */
/**************-------------------------------------**************/
.contact-section {
  background-color: var(--sandstone-100);
  padding-bottom: var(--spacing-6xl);
  color: var(--timber-600);
}

.contact-section .contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: auto auto;
  row-gap: var(--spacing-lg);
  column-gap: var(--spacing-ml);
}

.contact-section .contact-intro {
  grid-column: 1;
  grid-row: 1;
  display: flex;
  align-items: flex-start;
  padding-right: var(--spacing-ml);
  padding-bottom: var(--spacing-lg);
}

.contact-section .contact-heading {
  font-size: var(--font-size-7xl);
}

.contact-section .contact-card {
  border-radius: var(--rounded-2xl);
  background: var(--sandstone-200);
  padding: var(--spacing-lg) var(--spacing-ml);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--spacing-lg);
}

.contact-section .contact-card .icon {
  width: 40px;
  height: auto;
}

.contact-section .contact-card .icon img {
  width: 100%;
  height: auto;
}

.contact-section .contact-card .content {
  color: var(--timber-400);
  font-size: var(--font-size-lg);
}

.contact-section .contact-card-title {
  color: var(--chasenut-500);
  font-size: var(--font-size-3xl);
  font-weight: 500;
  margin-bottom: var(--spacing-md);
}

.contact-section .contact-hours {
  grid-column: 2;
  grid-row: 1;
}

.contact-section .contact-card a {
  color: var(--timber-400);
  font-size: var(--font-size-lg);
}

.contact-section .contact-card a:hover {
  color: var(--chasenut-500);
}

.contact-section .contact-location {
  grid-column: 1;
  grid-row: 2;
}

.contact-section .contact-details {
  grid-column: 2;
  grid-row: 2;
}

.contact-section .contact-list {
  list-style: none;
}

.contact-section .contact-list li:not(:last-child) {
  margin-bottom: var(--spacing-sm);
}

.contact-section .contact-list li a {
  display: flex;
  gap: var(--spacing-sm);
}

.contact-section .contact-list-icon {
}

.contact-section .contact-list li a svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  margin-top: 4px;
}

.contact-section .contact-media {
  grid-column: 3;
  grid-row: 1 / 3;
  padding: var(--spacing-lg) var(--spacing-md);
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: var(--rounded-2xl);
  display: flex;
  align-items: flex-end;
}

.contact-section .contact-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s ease;
  will-change: transform;
}

.contact-section .contact-media:hover .contact-image {
  transform: scale(1.06) rotate(1deg);
}

.contact-section .gradient-overlay {
  background: linear-gradient(
    0deg,
    rgba(75, 32, 13, 0.9) 0%,
    rgba(75, 32, 13, 0.7) 20%,
    transparent 70%
  );

  position: absolute;
  inset: 0;
}

.contact-section .socials-wrapper {
  position: relative;
  z-index: 3;
  text-align: center;
  width: 100%;
}

.contact-section .socials-wrapper .socials {
  justify-content: center;
}

.contact-section .socials-wrapper .follow-label {
  color: var(--sandstone-400);
  font-size: var(--font-size-md);
}

.contact-section .socials-wrapper .socials a {
  color: var(--sandstone-400);
  width: 28px;
  height: 28px;
}

.contact-section .socials-wrapper .socials a svg {
  width: 28px;
  height: 28px;
}

@media screen and (max-width: 1279px) {
  .contact-section .contact-grid {
    row-gap: var(--spacing-ml);
    column-gap: var(--spacing-md);
  }

  .contact-section .contact-heading {
    font-size: calc(var(--font-size-7xl) * 0.8);
  }

  .contact-section .contact-card a,
  .contact-section .contact-card .content {
    font-size: var(--font-size-lg);
  }

  .contact-section .contact-list li a svg {
    width: 16px;
    height: 16px;
  }
}

@media screen and (max-width: 1023px) {
  .contact-section .contact-grid {
    grid-template-columns: 1fr 1fr;
  }

  .contact-section .contact-media {
    grid-column: 1/3;
    grid-row: 3;
    min-height: 400px;
  }

  .contact-section .contact-heading {
    font-size: var(--font-size-7xl);
  }

  .contact-section .socials-wrapper .socials a,
  .contact-section .socials-wrapper .socials a svg {
    width: 32px;
    height: 32px;
  }
}

@media screen and (max-width: 639px) {
  .contact-section .contact-media {
    min-height: 340px;
  }
  .contact-section .contact-grid {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-md);
  }

  .contact-section .contact-card .icon {
    width: 36px;
    height: auto;
  }

  .contact-section .socials-wrapper .follow-label {
    font-size: var(--font-size-2xl);
  }

  .contact-section .socials-wrapper .socials a,
  .contact-section .socials-wrapper .socials a svg {
    width: 28px;
    height: 28px;
  }
}

/**************-------------------------------------**************/
/*                         CONTACT WITH CTA                      */
/**************-------------------------------------**************/
.contact-with-cta {
  background-color: var(--sandstone-100);
  padding-top: var(--spacing-4xl);
}

.contact-with-cta .contact-form .container {
  position: relative;
  z-index: 3;
}

.contact-with-cta .cta-section-1 {
  position: relative;
  z-index: 2;
}

/**************-------------------------------------**************/
/*                         CONTACT FORM                          */
/**************-------------------------------------**************/
.contact-form {
}

.contact-form .container {
  display: grid;
  grid-template-columns: 40% 1fr;
  gap: var(--spacing-3xl);
}

.contact-form .container .heading {
  color: var(--timber-600);
  font-size: var(--font-size-7xl);
  max-width: var(--container-lg);
}

.contact-form .container .text {
  color: var(--timber-400);
  margin-block: var(--spacing-ms) var(--spacing-ml);
  max-width: var(--container-lg);
}

.contact-form .container .image {
  aspect-ratio: 1/1;
  width: 100%;
  overflow: hidden;
  border-radius: var(--rounded-2xl);
}

.contact-form .container .image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s ease;
}

.contact-form .container .image:hover img {
  transform: scale(1.06) rotate(1deg);
}

.contact-form .container .form-wrapper {
  align-self: center;
}

:is(
  .contact-form #forminator-module-121,
  .consultation #forminator-module-195
) {
  background: transparent !important;
  margin: 0 !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  *:focus {
  outline: none !important;
  box-shadow: none !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(
    #name-1,
    #name-2,
    #email-1,
    #phone-1,
    #select-1,
    #select-2,
    #textarea-1,
    #date-1,
    #checkbox-1,
    #checkbox-2
  )
  .forminator-label {
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-xl) !important;
  font-weight: 400 !important;
  margin-bottom: 0 !important;
  display: block;
  pointer-events: none;
}

:is(.consultation #forminator-module-195)
  :is(#select-1, #date-1, )
  .forminator-label {
  color: var(--chasenut-400) !important;
  font-size: var(--font-size-md) !important;
  margin-top: -18px;
}

.consultation #forminator-module-195 #checkbox-1 .forminator-description,
.consultation #forminator-module-195 #checkbox-2 .forminator-description {
  color: var(--chasenut-400) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-xs) !important;
  margin-bottom: var(--spacing-ml) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-required {
  color: var(--chasenut-500) !important;
  font-size: var(--font-size-lg) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#name-1, #name-2, #email-1, #phone-1, #date-1)
  .forminator-input,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #textarea-1
  .forminator-textarea,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  select.forminator-select,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  .select2-selection {
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--chasenut-300) !important;
  border-radius: 0 !important;
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-md) !important;
  font-weight: 300 !important;
  padding: 0 !important;
  line-height: 1.4 !important;
  height: auto !important;
  min-height: calc(1.4em + (var(--spacing-ms) * 2)) !important;
  width: 100% !important;
  box-sizing: border-box !important;
  transition:
    border-color 0.4s ease,
    color 0.4s ease;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  .select2-selection {
  display: flex !important;
  align-items: center !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#name-1, #name-2, #email-1, #phone-1, #date-1)
  .forminator-input::placeholder,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #textarea-1
  .forminator-textarea::placeholder {
  color: var(--chasenut-200) !important;
  font-weight: 300 !important;
  opacity: 1;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#name-1, #name-2, #email-1, #phone-1, #date-1)
  .forminator-input:focus,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #textarea-1
  .forminator-textarea:focus,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  select.forminator-select:focus {
  border-bottom-color: var(--timber-600) !important;
  outline: none !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #textarea-1
  .forminator-textarea {
  min-height: 96px !important;
  resize: vertical;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  select.forminator-select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23B7A6A1' stroke-width='0.5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right center !important;
  padding-right: var(--spacing-ml) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  .select2-container--default
  .select2-selection__arrow {
  border-color: var(--chasenut-200) transparent transparent transparent !important;
  color: var(--chasenut-500) !important;
}

.forminator-ui#forminator-module-195.forminator-design--default
  .forminator-select2
  + .forminator-select
  .selection
  .select2-selection--single[role="combobox"]
  .select2-selection__arrow {
  color: var(--chasenut-300) !important;
}

.forminator-select.forminator-select-dropdown-container--open
  .forminator-select-dropdown.forminator-dropdown--default
  .select2-results
  .select2-results__options
  .select2-results__option {
  padding-block: 0 !important;
  font-size: var(--font-size-sm) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  .select2-selection__rendered {
  color: var(--timber-600) !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
  padding-left: 0 !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  .select2-selection__placeholder,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  select.forminator-select:has(option[value=""]:checked),
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  select.forminator-select
  option[value=""] {
  color: var(--chasenut-200) !important;
  font-weight: 300 !important;
}

.consultation
  #forminator-module-195
  :is(#checkbox-1, #checkbox-2)
  label:not(.forminator-label) {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  margin: 0 var(--spacing-lg) var(--spacing-md) 0;
  color: var(--chasenut-400) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-md) !important;
  font-weight: 300 !important;
  line-height: 1.4;
  cursor: pointer;
  padding: 10px !important;
  border: 1px solid var(--chasenut-300) !important;
  border-radius: var(--rounded-sm) !important;
}

.consultation
  #forminator-module-195
  :is(#checkbox-1, #checkbox-2)
  .forminator-checkbox-box {
  appearance: none;
  -webkit-appearance: none;
  flex: none;
  width: 16px !important;
  height: 16px !important;
  margin: 0;
  border: 1px solid var(--chasenut-400) !important;
  border-radius: var(--rounded-full) !important;
  background-color: transparent !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 10px 8px;
  cursor: pointer;
  transition:
    background-color 0.3s ease,
    border-color 0.3s ease;
}

.consultation
  #forminator-module-195
  :is(#checkbox-1, #checkbox-2)
  .forminator-checkbox
  .forminator-checkbox-box
  ~ span {
  margin-left: 0 !important;
}

.consultation
  #forminator-module-195
  :is(#checkbox-1, #checkbox-2)
  .forminator-checkbox-box:hover {
  border-color: var(--chasenut-500);
}

.consultation
  #forminator-module-195
  :is(#checkbox-1, #checkbox-2)
  .forminator-checkbox
  input:checked
  + .forminator-checkbox-box:before {
  color: var(--chasenut-500) !important;
  font-size: 10px;
}

.consultation
  #forminator-module-195
  :is(#checkbox-1, #checkbox-2)
  input[type="checkbox"]:focus-visible {
  outline: 1px solid var(--chasenut-500);
  outline-offset: 2px;
}

.consultation #forminator-module-195 #date-1 select.forminator-select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23B7A6A1' stroke-width='0.5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right center !important;
  padding-right: var(--spacing-ml) !important;
}

.consultation #forminator-module-195 #section-1 .forminator-title {
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-xl) !important;
  font-weight: 400 !important;
  line-height: 1.7em;
}

.consultation #forminator-module-195 #section-1 .forminator-subtitle {
  color: var(--chasenut-400) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-xs) !important;
  font-weight: 300 !important;
  padding-bottom: 2px !important;
}

.forminator-ui.forminator-custom-form[data-design="default"]
  .forminator-title
  + .forminator-subtitle {
  margin-top: 0 !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #phone-1 {
  position: relative;
  z-index: 1;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #phone-1
  .iti__country-container {
  padding-bottom: 2px !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #phone-1
  .forminator-input {
  padding-left: 88px !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .iti__selected-country {
  background-color: transparent !important;
  color: var(--chasenut-500) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .iti__selected-dial-code {
  color: var(--chasenut-500) !important;
  margin-left: var(--spacing-sm) !important;
  font-size: var(--font-size-md) !important;
  font-weight: 300 !important;
}

.forminator-iti-input.iti.iti--allow-dropdown
  .iti__country-container:not(:has(+ input[disabled])):not(
    :has(+ input[readonly])
  )
  .iti__selected-country-primary:hover,
.forminator-iti-input.iti.iti--allow-dropdown
  .iti__country-container:not(:has(+ input[disabled])):not(
    :has(+ input[readonly])
  )
  .iti__selected-country:has(+ .iti__dropdown-content:hover)
  .iti__selected-country-primary {
  background-color: var(--sandstone-100) !important;
}

.forminator-iti-input.iti .iti__selected-country-primary {
  padding-left: 0 !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#name-1, #name-2, #email-1, #phone-1, #date-1)
  .forminator-field.forminator-has_error
  .forminator-input,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #textarea-1
  .forminator-field.forminator-has_error
  .forminator-textarea,
:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  :is(#select-1, #select-2)
  .forminator-field.forminator-has_error
  select.forminator-select {
  border-bottom-color: #b3261e !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-error-message {
  color: #b3261e !important;
  background-color: transparent !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-xs) !important;
  font-weight: 300 !important;
  display: block !important;
  padding: var(--spacing-xs) 0 0 !important;
  margin-top: 0 !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-response-message {
  background-color: transparent !important;
  border: none !important;
  color: var(--chasenut-500) !important;
  font-size: var(--font-size-md) !important;
  padding: 0 0 var(--spacing-md) !important;
}

:is(
    .contact-form #forminator-module-121,
    .consultation #forminator-module-195
  )[data-grid="open"]
  .forminator-row,
:is(
    .contact-form #forminator-module-121,
    .consultation #forminator-module-195
  )[data-grid="open"]
  .forminator-row-inside {
  margin-bottom: var(--spacing-lg) !important;
}

.consultation
  #forminator-module-195[data-grid="open"]
  > .forminator-row:is(:nth-child(4), :nth-child(5)) {
  margin-bottom: calc(var(--spacing-lg) - var(--spacing-md)) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #html-1
  p {
  color: var(--chasenut-400) !important;
  font-size: var(--font-size-sm) !important;
  font-weight: 300 !important;
  line-height: 1.6;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #html-1
  a {
  color: var(--chasenut-400) !important;
  text-decoration: underline;
  transition: color 0.3s ease;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  #html-1
  a:hover {
  color: var(--chasenut-500) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-ms);
  width: max-content !important;
  flex-shrink: 0;
  background-color: transparent !important;
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-md) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.24px;
  white-space: nowrap !important;
  padding: 18px 24px !important;
  border: 1px solid var(--chasenut-500) !important;
  border-radius: var(--rounded-full) !important;
  cursor: pointer;
  transition:
    color 0.4s ease,
    border-color 0.4s ease,
    background-color 0.4s ease;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit.js-fade {
  transition:
    opacity var(--fade-duration) var(--fade-ease),
    filter var(--fade-duration) var(--fade-ease),
    transform var(--fade-duration) var(--fade-ease),
    color 0.4s ease,
    border-color 0.4s ease,
    background-color 0.4s ease;
  transition-delay: var(--delay, 0s);
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit
  .btn-label {
  display: inline-flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit
  .btn-label
  .char {
  display: inline-block !important;
  white-space: pre !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit::after {
  content: "";
  width: 26px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 23' fill='none'%3E%3Cpath d='M0.42 0.27L0.85 0.94C3.76 5.57 8.06 9.18 13.12 11.27C8.06 13.35 3.76 16.97 0.85 21.59L0.42 22.27' stroke='%23000' stroke-width='1.4'/%3E%3Cpath d='M11.42 0.27L11.85 0.94C14.76 5.57 19.06 9.18 24.12 11.27C19.06 13.35 14.76 16.97 11.85 21.59L11.42 22.27' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 23' fill='none'%3E%3Cpath d='M0.42 0.27L0.85 0.94C3.76 5.57 8.06 9.18 13.12 11.27C8.06 13.35 3.76 16.97 0.85 21.59L0.42 22.27' stroke='%23000' stroke-width='1.4'/%3E%3Cpath d='M11.42 0.27L11.85 0.94C14.76 5.57 19.06 9.18 24.12 11.27C19.06 13.35 14.76 16.97 11.85 21.59L11.42 22.27' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E");
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-position: center;
  mask-position: center;
  transition: transform 0.4s ease;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit:hover {
  color: var(--chasenut-500) !important;
  border-color: var(--chasenut-500) !important;
  box-shadow: none !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-button-submit:hover::after {
  transform: translateX(4px);
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-response-message {
  text-align: center;
  max-width: 500px;
  margin-inline: auto;
  box-shadow: none !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-response-message
  .heading {
  font-size: var(--font-size-6xl) !important;
  color: var(--timber-600) !important;
}

:is(.contact-form #forminator-module-121, .consultation #forminator-module-195)
  .forminator-response-message
  .description {
  font-size: var(--font-size-md) !important;
  color: var(--timber-400) !important;
  font-weight: 300 !important;
}

.forminator-ui:is(
    #forminator-module-121,
    #forminator-module-195
  ).forminator-design--default
  .forminator-response-message.forminator-loading,
.forminator-ui:is(
    #forminator-module-121,
    #forminator-module-195
  ).forminator-design--default
  .forminator-response-message.forminator-loading
  p {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )
    .forminator-button-submit:hover::after {
    transform: none;
  }
}

@media screen and (max-width: 1023px) {
  .contact-form .container {
    grid-template-columns: 1fr;
    gap: var(--spacing-xl);
  }

  :is(.consultation #forminator-module-195) :is(#select-1) .forminator-label {
    margin-top: 0;
  }

  :is(.consultation #forminator-module-195) :is(#date-1, ) .forminator-label {
    margin-top: -14px;
  }

  .contact-form .container .image {
    aspect-ratio: 5/3;
  }

  .contact-form .container .image img {
    object-position: top;
  }
}

@media screen and (max-width: 767px) {
  .consultation #forminator-module-195 #section-1 .forminator-subtitle {
    padding-bottom: 0 !important;
    margin-bottom: -10px !important;
  }
  .contact-form .container .image {
    aspect-ratio: 1/1;
  }
  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )
    :is(
      #name-1,
      #name-2,
      #email-1,
      #phone-1,
      #select-1,
      #select-2,
      #textarea-1,
      #date-1,
      #checkbox-1,
      #checkbox-2
    )
    .forminator-label,
  .consultation #forminator-module-195 #section-1 .forminator-title {
    font-size: var(--font-size-lg) !important;
  }

  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )
    #phone-1
    .forminator-input {
    padding-left: 78px !important;
  }

  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )
    #phone-1
    .iti__country-container {
    padding-bottom: 1px !important;
  }

  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )
    .forminator-button-submit {
    padding: 14px 20px !important;
  }

  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )[data-grid="open"]
    .forminator-row,
  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )[data-grid="open"]
    .forminator-row-inside {
    margin-bottom: var(--spacing-lg) !important;
  }

  :is(
      .contact-form #forminator-module-121,
      .consultation #forminator-module-195
    )
    .forminator-response-message
    .heading {
    font-size: var(--font-size-3xl);
    color: var(--timber-600);
  }

  :is(.consultation #forminator-module-195)
    :is(#select-1, #date-1, )
    .forminator-label {
    font-size: var(--font-size-md) !important;
    margin-top: 0;
  }

  .consultation
    #forminator-module-195
    :is(#checkbox-1, #checkbox-2)
    label:not(.forminator-label) {
    padding: 6px 8px !important;
  }
}

.forminator-iti-input .iti__dropdown-content {
  background-color: var(--sandstone-200) !important;
  border: 1px solid var(--chasenut-300) !important;
  box-shadow: var(--shadow-lg) !important;
  color: var(--chasenut-500) !important;
}

.forminator-iti-input .iti__search-input {
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--chasenut-300) !important;
  color: var(--chasenut-500) !important;
  padding: var(--spacing-sm) var(--spacing-ms) !important;
}

.forminator-iti-input .iti__country {
  padding: var(--spacing-sm) var(--spacing-ms) !important;
  transition: background 0.2s ease;
}

.forminator-iti-input .iti__country:hover,
.forminator-iti-input .iti__highlight {
  background-color: var(--sandstone-300) !important;
}

.forminator-iti-input .iti__country-name {
  color: var(--chasenut-500) !important;
  font-size: var(--font-size-md) !important;
}

.forminator-iti-input .iti__dial-code {
  color: var(--chasenut-300) !important;
}

.forminator-iti-input ul.iti__country-list::-webkit-scrollbar {
  width: 2px;
  background: transparent;
}

.forminator-iti-input ul.iti__country-list::-webkit-scrollbar-thumb {
  background: var(--sandstone-600);
  border-radius: var(--rounded-full);
}

.forminator-iti-input.iti--fullscreen-popup .iti__dropdown-content {
  border: none !important;
  border-radius: 0 !important;
}

.forminator-iti-input.iti--fullscreen-popup .iti__search-input {
  font-size: var(--font-size-lg) !important;
  padding: var(--spacing-ms) var(--spacing-md) !important;
}

.forminator-iti-input.iti--fullscreen-popup .iti__country {
  padding: var(--spacing-ms) var(--spacing-md) !important;
}

.forminator-select-dropdown:is(
  .forminator-custom-form-121,
  .forminator-custom-form-195
) {
  background-color: var(--sandstone-100) !important;
  border: 1px solid var(--sandstone-600) !important;
  border-radius: 0 !important;
  box-shadow: var(--shadow-lg) !important;
  overflow: hidden !important;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__options {
  max-height: 260px !important;
  overflow-y: auto !important;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__option {
  background-color: transparent !important;
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-md) !important;
  font-weight: 300 !important;
  padding: var(--spacing-sm) var(--spacing-ms) !important;
  transition: background 0.2s ease;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__option--selected {
  background-color: var(--sandstone-200) !important;
  font-weight: 400 !important;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__option--highlighted,
.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__option:hover {
  background-color: var(--sandstone-300) !important;
  color: var(--chasenut-500) !important;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-search__field {
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--sandstone-600) !important;
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-size: var(--font-size-md) !important;
  font-weight: 300 !important;
  padding: var(--spacing-sm) var(--spacing-ms) !important;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__options::-webkit-scrollbar {
  width: 2px;
  background: transparent;
}

.forminator-select-dropdown:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )
  .select2-results__options::-webkit-scrollbar-thumb {
  background: var(--sandstone-600);
  border-radius: var(--rounded-full);
}

.forminator-select-dropdown-container--open
  .forminator-custom-form-121.forminator-dropdown--default
  .select2-results
  .select2-results__options
  .select2-results__option.select2-results__option--highlighted,
.forminator-select-dropdown-container--open
  .forminator-custom-form-195.forminator-dropdown--default
  .select2-results
  .select2-results__options
  .select2-results__option.select2-results__option--highlighted {
  outline: none !important;
}

#ui-datepicker-div:is(
    .forminator-custom-form-121,
    .forminator-custom-form-195
  )::before {
  background-color: var(--sandstone-100) !important;
  border-color: var(--chasenut-300) !important;
  border-radius: 0 !important;
  box-shadow: var(--shadow-lg) !important;
}

#ui-datepicker-div:is(
  .forminator-custom-form-121,
  .forminator-custom-form-195
) {
  font-family: var(--body-font) !important;
  color: var(--chasenut-500) !important;
}

/* ---- header ---- */
#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-header {
  border-bottom: 1px solid var(--chasenut-200) !important;
  padding-bottom: var(--spacing-sm) !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-title
  select {
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='8' viewBox='0 0 14 8' fill='none'%3E%3Cpath d='M1 1L7 7L13 1' stroke='%23B7A6A1' stroke-width='0.5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 6px center !important;
  border: 1px solid var(--chasenut-200) !important;
  border-radius: 0 !important;
  padding: 0 22px 0 8px !important;
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-weight: 300 !important;
  transition: border-color 0.3s ease;
  outline: none !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-title
  select:focus {
  outline: none !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-title
  select:hover {
  border-color: var(--chasenut-500) !important;
}

/* ---- prev / next ---- */
#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-header
  :is(.ui-datepicker-prev, .ui-datepicker-next) {
  color: var(--chasenut-500) !important;
  background-color: transparent !important;
  border-radius: 0 !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-header
  :is(.ui-datepicker-prev, .ui-datepicker-next):hover {
  background-color: var(--sandstone-300) !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-header
  :is(.ui-datepicker-prev, .ui-datepicker-next)::before {
  content: "" !important;
  width: 7px;
  height: 11px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 23' fill='none'%3E%3Cpath d='M0.42 0.27L0.85 0.94C3.76 5.57 8.06 9.18 13.12 11.27C8.06 13.35 3.76 16.97 0.85 21.59L0.42 22.27' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E")
    no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 23' fill='none'%3E%3Cpath d='M0.42 0.27L0.85 0.94C3.76 5.57 8.06 9.18 13.12 11.27C8.06 13.35 3.76 16.97 0.85 21.59L0.42 22.27' stroke='%23000' stroke-width='1.6'/%3E%3C/svg%3E")
    no-repeat center / contain;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-header
  .ui-datepicker-prev::before {
  transform: scaleX(-1);
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-header
  :is(.ui-datepicker-prev, .ui-datepicker-next).ui-state-disabled {
  opacity: 0.3 !important;
  pointer-events: none;
}

/* ---- weekday row ---- */
#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  thead
  tr
  th {
  color: var(--chasenut-300) !important;
  font-family: var(--body-font) !important;
  font-weight: 400 !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ---- day cells ---- */
#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  tbody
  tr
  td
  :is(a, span) {
  background-color: transparent !important;
  border-color: transparent !important;
  border-radius: 2px !important;
  color: var(--chasenut-500) !important;
  font-family: var(--body-font) !important;
  font-weight: 300 !important;
  transition:
    background-color 0.25s ease,
    color 0.25s ease;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  tbody
  tr
  td
  a:is(:hover, :active, :focus) {
  background-color: var(--sandstone-300) !important;
  color: var(--chasenut-500) !important;
  font-weight: 300 !important;
  outline: none !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  tbody
  tr
  td.ui-datepicker-today
  a {
  border-color: var(--chasenut-300) !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  tbody
  tr
  td:is(.ui-datepicker-current-day, .ui-datepicker-days-cell-over)
  a,
#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  tbody
  tr
  td
  a.ui-state-active {
  background-color: var(--chasenut-500) !important;
  border-color: var(--chasenut-500) !important;
  color: var(--sandstone-100) !important;
  outline: none !important;
}

#ui-datepicker-div:is(.forminator-custom-form-121, .forminator-custom-form-195)
  .ui-datepicker-calendar
  tbody
  tr
  td:is(.ui-state-disabled, .ui-datepicker-unselectable)
  :is(a, span) {
  opacity: 1 !important;
  color: var(--chasenut-200) !important;
}

/**************-------------------------------------**************/
/*                      CONSULTATION                             */
/**************-------------------------------------**************/
.consultation {
  background-color: var(--sandstone-100);
}

.consultation-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}

.consultation-hero .wrapper {
  max-width: var(--container-md);
}

.consultation-hero.is-visible {
  opacity: 1;
}

.consultation-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.consultation-hero .description {
  color: var(--chasenut-200);
}
.consultation .consultation-form-wrapper {
  position: relative;
  padding-bottom: 280px;
  z-index: 2;
}

.consultation .consultation-form-wrapper .container {
  position: relative;
  z-index: 2;
  max-width: var(--container-md);
}

.consultation-hero .scroll-down-2 {
  margin-inline: auto;
  width: fit-content;
  margin-top: var(--spacing-xl);
}

/**************-------------------------------------**************/
/*                      CONSULTATION THANKYOU                    */
/**************-------------------------------------**************/
.consultation-thankyou {
  background-color: var(--sandstone-100);
}

.consultation-thankyou .thankyou-hero {
  background-color: var(--sandstone-100);
  color: var(--sandstone-500);
  text-align: center;
}

.thankyou-hero .container {
  padding-top: calc(var(--spacing-6xl) + 100px);
}

.thankyou-hero {
  opacity: 0;
  will-change: opacity;
  transition: opacity 0.6s ease;
}

.thankyou-hero.is-visible {
  opacity: 1;
}

.thankyou-hero .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.consultation-thankyou .thankyou-hero .wrapper {
  max-width: var(--container-md);
  z-index: 4;
}

.consultation-thankyou .thankyou-hero .heading {
  font-family: var(--body-font);
  font-size: calc(var(--font-size-7xl) * 0.84);
  margin-bottom: var(--spacing-lg);
  font-weight: 400;
}

.consultation-thankyou .thankyou-hero .scroll-down-1 {
  margin-inline: auto;
  width: fit-content;
}

.consultation-thankyou .thankyou-steps {
  position: relative;
  padding-bottom: var(--spacing-6xl);
  z-index: 2;
}

.consultation-thankyou .thankyou-steps .container {
  position: relative;
  z-index: 2;
}

.consultation-thankyou .thankyou-steps .heading-wrapper {
  max-width: var(--container-lg);
  margin-inline: auto;
  text-align: center;
}

.consultation-thankyou .thankyou-steps .heading-wrapper .heading {
  font-size: var(--font-size-9xl);
  margin-bottom: var(--spacing-lg);
  color: var(--chasenut-500);
}

.consultation-thankyou .thankyou-steps .heading-wrapper .description {
  color: var(--chasenut-500);
  max-width: var(--container-sm);
  margin-inline: auto;
}

.consultation-thankyou .thankyou-steps .steps-wrapper {
  color: var(--chasenut-500);
  max-width: var(--container-lg);
  margin-inline: auto;
  padding-top: var(--spacing-7xl);
}

.consultation-thankyou .thankyou-steps .steps-wrapper .steps {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  position: relative;
  gap: var(--spacing-2xl);
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step {
  position: relative;
  flex: 1;
  min-width: 0;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-num {
  display: block;
  margin-bottom: var(--spacing-sm);
  font-size: var(--font-size-5xl);
  line-height: 1;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-label {
  margin: 0;
  font-size: var(--font-size-lg);
  line-height: 1.1;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-connector {
  position: absolute;
  width: 240px;
  pointer-events: none;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-connector svg {
  display: block;
  width: 100%;
  height: auto;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-1 {
  top: calc(100% + 10px);
  left: 40%;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-2 {
  top: -80%;
  left: 40%;
}

.consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-3 {
  top: calc(100% + 10px);
  left: 40%;
}

@media screen and (max-width: 1279px) {
  .consultation-thankyou .thankyou-steps .steps-wrapper {
    max-width: 100%;
  }
}

@media screen and (max-width: 1023px) {
  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector {
    width: 180px;
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-1 {
    top: calc(100% + 28px);
  }
}

@media screen and (max-width: 767px) {
  .consultation-thankyou .thankyou-steps .steps-wrapper .steps {
    gap: var(--spacing-xl);
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-num {
    font-size: var(--font-size-4xl);
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-label {
    font-size: var(--font-size-sm);
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector {
    width: 140px;
  }
}

@media screen and (max-width: 639px) {
  .consultation-thankyou .thankyou-steps {
    padding-bottom: 0;
  }
  .consultation-thankyou .thankyou-steps .steps-wrapper {
    position: relative;
    padding-top: var(--spacing-6xl);
    padding-left: 50px;
  }
  .consultation-thankyou .thankyou-steps .steps-wrapper .steps {
    display: flex;
    flex-direction: column;
    max-width: 200px;
    margin-inline: auto;
    gap: var(--spacing-3xl);
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector {
    width: 110px;
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-num {
    font-size: var(--font-size-5xl);
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-label {
    font-size: var(--font-size-lg);
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-1 {
    top: 0;
    left: -30px;
    transform: rotate(90deg);
    transform-origin: left;
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-2 {
    top: 120%;
    left: auto;
    right: -30px;
    transform: rotate(90deg);
    transform-origin: right;
    display: none;
  }

  .consultation-thankyou .thankyou-steps .steps-wrapper .step-connector-3 {
    top: 0;
    left: -30px;
    transform: rotate(90deg);
    transform-origin: left;
  }
}

/**************-------------------------------------**************/
/*                         SECTION INSTAGRAM                     */
/**************-------------------------------------**************/

.section-instagram {
  position: relative;
  overflow: hidden;
  padding-block: var(--spacing-6xl);
}

.section-instagram .container .wrapper {
  max-width: var(--container-lg);
  margin-inline: auto;
}

.section-instagram .heading {
  color: var(--timber-600);
  font-size: var(--font-size-7xl);
  margin-bottom: var(--spacing-lg);
}

.section-instagram .gallery-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: var(--spacing-md);
}

.section-instagram .gallery-grid .gallery-item {
  width: 100%;
  height: 100%;
  aspect-ratio: 1/1;
  overflow: hidden;
  border-radius: var(--rounded-lg);
}

.section-instagram .gallery-grid .gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s ease;
  will-change: transform;
}

.section-instagram .gallery-grid .gallery-item a:hover img {
  transform: scale(1.06) skewX(-1deg);
}

.section-instagram #sb_instagram {
  width: 100% !important;
  padding: 0 !important;
}

.section-instagram #sb_instagram .sb_instagram_header,
.section-instagram #sb_instagram #sbi_load,
.section-instagram #sb_instagram .sbi_follow_btn {
  display: none !important;
}

.section-instagram #sb_instagram #sbi_images {
  display: grid;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: var(--spacing-md) !important;
  width: 100%;
  padding: 0 !important;
  float: none;
}

.section-instagram #sb_instagram #sbi_images .sbi_item {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.section-instagram #sb_instagram #sbi_images .sbi_item:nth-of-type(n + 6) {
  display: none !important;
}

.section-instagram #sb_instagram .sbi_photo_wrap {
  aspect-ratio: 3/4;
  overflow: hidden;
  border-radius: var(--rounded-lg);
}

.section-instagram #sb_instagram .sbi_photo {
  display: block;
  width: 100%;
  height: 100% !important;
}

.section-instagram #sb_instagram .sbi_photo img {
  display: block;
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  transition: transform 0.8s ease;
  will-change: transform;
}

.section-instagram #sb_instagram .sbi_photo:hover img {
  transform: scale(1.06) skewX(-1deg);
}

.section-instagram #sb_instagram .sbi_playbtn,
.section-instagram #sb_instagram .sbi_lightbox_carousel_icon {
  display: none !important;
}

.section-instagram .gallery-follow {
  text-align: center;
  color: var(--chasenut-500);
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: var(--spacing-lg);
  gap: var(--spacing-sm);
  margin-inline: auto;
  width: max-content;
  transition: transform 0.6s ease;
  will-change: transform;
}

.section-instagram .gallery-follow:hover {
  transform: scale(1.04) skewX(-1deg);
}

.section-instagram .gallery-follow svg {
  width: 20px;
  height: 20px;
}

@media screen and (max-width: 767px) {
  .section-instagram .gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-sm);
  }

  .section-instagram .gallery-grid .gallery-item:nth-of-type(n + 4) {
    display: none;
  }

  .section-instagram #sb_instagram #sbi_images {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: var(--spacing-sm) !important;
  }

  .section-instagram #sb_instagram #sbi_images .sbi_item:nth-of-type(n + 4) {
    display: none !important;
  }

  .section-instagram .gallery-follow svg {
    width: 16px;
    height: 16px;
  }
}

/**************-------------------------------------**************/
/*                       PRICE MENU WITH HERO                    */
/**************-------------------------------------**************/
.price-menu-with-hero {
  background-color: var(--sandstone-100);
}

.price-menu-with-hero .hero-common .wrapper {
  max-width: var(--container-lg);
}

.price-menu-with-hero .hero-common .description {
  max-width: var(--container-md);
  margin-inline: auto;
}

.price-menu-with-hero .treatment-prices .container {
  position: relative;
  z-index: 3;
}

/**************-------------------------------------**************/
/*                      TREATMENT PRICES — TABS                  */
/**************-------------------------------------**************/
.treatment-prices {
  scroll-margin-top: var(--spacing-4xl);
}

.treatment-prices .wrapper {
  max-width: calc(var(--container-lg) * 1.1);
  margin-inline: auto;
}

.treatment-prices .heading {
  color: var(--evergreen-600);
  text-align: center;
  margin-bottom: var(--spacing-lg);
}

.treatment-prices .tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xl);
}

.treatment-prices .tab-list {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.treatment-prices .tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-sm) var(--spacing-ml);
  color: var(--chasenut-400);
  font-size: var(--font-size-md);
  white-space: nowrap;
  transition: color 0.3s ease;
}

.treatment-prices .tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: var(--chasenut-300);
}

.treatment-prices .tab:first-child::before {
  display: none;
}

.treatment-prices .tab:hover {
  color: var(--chasenut-500);
}

.treatment-prices .tab.active {
  color: var(--chasenut-500);
}

.treatment-prices .tab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: 0.3s;
  will-change: transform;
}

.treatment-prices .tab.active .tab-icon {
  transform: translateY(-2px) scale(1.08);
  transform-origin: bottom;
}

.treatment-prices .tab-icon svg {
  width: 100%;
  height: 100%;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.25;
}

.treatment-prices .tab-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media screen and (min-width: 768px) {
  .treatment-prices .tab-list {
    min-width: 0;
    max-width: 100%;
    justify-content: flex-start;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
  }

  .treatment-prices .tab-list::-webkit-scrollbar {
    display: none;
  }

  .treatment-prices .tab:first-child {
    margin-left: auto;
  }

  .treatment-prices .tab:last-of-type {
    margin-right: auto;
  }

  .treatment-prices .tab-list.can-scroll-left {
    --tabs-fade-l: 48px;
  }

  .treatment-prices .tab-list.can-scroll-right {
    --tabs-fade-r: 48px;
  }

  .treatment-prices .tab-list.can-scroll-left,
  .treatment-prices .tab-list.can-scroll-right {
    -webkit-mask-image: linear-gradient(
      to right,
      transparent,
      #000 var(--tabs-fade-l, 0px),
      #000 calc(100% - var(--tabs-fade-r, 0px)),
      transparent
    );
    mask-image: linear-gradient(
      to right,
      transparent,
      #000 var(--tabs-fade-l, 0px),
      #000 calc(100% - var(--tabs-fade-r, 0px)),
      transparent
    );
  }
}

.treatment-prices .tab-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  width: 0;
  background: var(--chasenut-400);
  transform: translateX(0);
  transition:
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}

.treatment-prices .tab-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--sandstone-700);
  transition: color 0.3s ease;
}

.treatment-prices .tab-arrow:hover {
  color: var(--chasenut-400);
}

.treatment-prices .tab-arrow svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
}

.treatment-prices .panels {
  position: relative;
}

.treatment-prices .panel {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 220px;
  opacity: 1;
  transition: opacity 0.3s ease;
}

.treatment-prices .panel[hidden] {
  display: none;
}

.treatment-prices .panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  gap: var(--spacing-xl);
  align-items: start;
}

.treatment-prices .panel[hidden] {
  display: none;
}

/* ===== LEFT: CATEGORY CARD ===== */
.treatment-prices .panel-card {
  background: var(--sandstone-200);
  border-radius: var(--rounded-2xl);
  padding: var(--spacing-lg);
  display: flex;
  flex-direction: column;
  align-items: space-between;
  height: 100%;
}

.treatment-prices .panel-card-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  margin-bottom: var(--spacing-md);
  color: var(--chasenut-500);
}

.treatment-prices .panel-card-icon svg,
.treatment-prices .panel-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.treatment-prices .panel-card-title {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-sm);
  font-size: var(--font-size-3xl);
  font-family: var(--body-font);
}

.treatment-prices .panel-card-desc {
  color: var(--chasenut-400);
  margin-bottom: var(--spacing-ml);
}

.treatment-prices .panel-card-link a {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-lg);
  font-weight: 500;
  color: var(--chasenut-500);
  margin-top: auto;
}

.treatment-prices .panel-card-link svg {
  width: 18px;
  height: auto;
  transition: transform 0.3s ease;
  margin-top: 4px;
}

.treatment-prices .panel-card-link:hover svg {
  transform: translateX(3px);
}

/* ===== RIGHT: PRICE TABLE ===== */
.treatment-prices .price-table {
  width: 100%;
}

.treatment-prices .price-head {
  margin-bottom: var(--spacing-md);
}
.treatment-prices .price-head,
.treatment-prices .price-row-link {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr) auto minmax(130px, auto)
    40px;
  align-items: center;
  column-gap: var(--spacing-lg);
}

.treatment-prices .price-row-link {
  color: inherit;
  text-decoration: none;
  transition: color 0.3s ease;
}

.treatment-prices .price-row {
  border-top: 1px solid var(--chasenut-100);
  color: var(--chasenut-400);
  font-size: var(--font-size-lg);
  list-style: none;
}

.treatment-prices .price-row:last-child {
  border-bottom: 1px solid var(--chasenut-100);
}

.treatment-prices .price-row-link {
  padding-block: var(--spacing-md);
}

.treatment-prices .price-row .col-action {
  transition: 0.4s ease-in-out;
}

.treatment-prices .price-row:hover .col-action {
  transform: translateX(12px);
}

.treatment-prices .price-head .col-name,
.treatment-prices .price-head .col-duration,
.treatment-prices .price-head .col-price {
  color: var(--chasenut-500);
  font-weight: 500;
  font-size: var(--font-size-lg);
}

.treatment-prices .col-duration,
.treatment-prices .col-price {
  white-space: nowrap;
  transition: 0.4s ease-in-out;
}

.treatment-prices .col-name {
  transition: 0.4s ease-in-out;
}

.treatment-prices .price-row:hover .col-name,
.treatment-prices .price-row:hover .col-duration,
.treatment-prices .price-row:hover .col-price {
  color: var(--chasenut-500);
}

.treatment-prices .col-price {
  text-align: right;
}

.treatment-prices .price-head .col-price {
  justify-self: end;
}

.treatment-prices .col-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  border: 1px solid rgba(75, 32, 19, 0.5);
  border-radius: var(--rounded-full);
  color: var(--chasenut-500);
  justify-self: end;
}

.treatment-prices .col-action svg {
  width: 14px;
  height: 14px;
  stroke: currentColor;
  fill: none;
}

.treatment-prices .price-head .col-action {
  border: none;
  width: 30px;
  height: auto;
}

@media screen and (max-width: 1279px) {
  .treatment-prices .wrapper {
    max-width: 100%;
  }
}

@media screen and (max-width: 1023px) {
  .treatment-prices .wrapper {
    max-width: 100%;
  }
  .treatment-prices .price-head,
  .treatment-prices .price-row-link {
    grid-template-columns:
      minmax(0, 1fr) auto minmax(100px, auto)
      28px;

    column-gap: var(--spacing-ml);
  }

  .treatment-prices .tab::before {
    height: 24px;
  }

  .treatment-prices .panel-card-icon {
    width: 24px;
    height: 24px;
  }

  .treatment-prices .panel-card-title {
    font-size: var(--font-size-2xl);
  }

  .treatment-prices .panel-card-desc {
    font-size: var(--font-size-sm);
  }

  .treatment-prices .panel-card-link {
    font-size: var(--font-size-md);
  }

  .treatment-prices .panel-card-link svg {
    width: 14px;
    margin-top: 2px;
  }

  .treatment-prices .price-head .col-name,
  .treatment-prices .price-head .col-duration,
  .treatment-prices .price-head .col-price,
  .treatment-prices .price-row {
    font-size: var(--font-size-md);
  }

  .treatment-prices .col-action {
    width: 22px;
    height: 22px;
  }

  .treatment-prices .col-action svg {
    width: 10px;
    height: 10px;
  }
}

/* ===== MOBILE ===== */
@media screen and (max-width: 767px) {
  .treatment-prices .tabs {
    gap: var(--spacing-lg);
  }

  .treatment-prices .tab-arrow {
    display: inline-flex;
  }

  .treatment-prices .tab-list {
    flex: 0 1 auto;

    position: relative;
    min-height: 2.2em;
    align-items: center;
    width: 160px;
  }

  .treatment-prices .tab {
    position: absolute;
    inset: 0;
    margin: auto;
    width: max-content;
    height: max-content;
    display: inline-flex;
    gap: 8px;
    justify-content: center;
    padding: var(--spacing-sm) 0;
    opacity: 0;
    visibility: hidden;
    filter: blur(3px);
    pointer-events: none;
    transition:
      opacity 0.5s ease,
      filter 0.5s ease;
  }

  .treatment-prices .tab::before {
    display: none;
  }

  .treatment-prices .tab.active {
    opacity: 1;
    visibility: visible;
    filter: blur(0px);
    pointer-events: auto;
  }

  .treatment-prices .tab.active .tab-icon {
    transform: translateY(0) scale(1);
    transform-origin: bottom;
  }

  .treatment-prices .tab-underline {
    display: none;
  }

  .treatment-prices .panels {
    touch-action: pan-y;
    overflow: hidden;
  }

  .treatment-prices .panel {
    min-height: 180px;
    will-change: transform;
  }

  .treatment-prices .panel.dragging {
    transition: none;
  }

  .treatment-prices .price-head,
  .treatment-prices .price-row-link {
    grid-template-columns: minmax(0, 1fr) auto minmax(60px, auto) 30px;
    column-gap: var(--spacing-ml);
  }

  .treatment-prices .price-head .col-name,
  .treatment-prices .price-head .col-duration,
  .treatment-prices .price-head .col-price,
  .treatment-prices .price-row {
    font-size: var(--font-size-sm);
  }
}

@media screen and (max-width: 639px) {
  .treatment-prices .panel {
    grid-template-columns: 1fr;
    gap: var(--spacing-2xl);
  }

  .treatment-prices .price-head,
  .treatment-prices .price-row-link {
    grid-template-columns: minmax(0, 1fr) auto minmax(60px, auto) 18px;
    column-gap: var(--spacing-ml);
  }

  .treatment-prices .col-action {
    width: 18px;
    height: 18px;
  }

  .treatment-prices .col-action svg {
    width: 8px;
    height: 8px;
  }
}

/**************-------------------------------------**************/
/*                  TREATMENT PACKAGES WITH CTA                  */
/**************-------------------------------------**************/
.treatment-packages-with-cta {
}

.treatment-packages-with-cta .cta-section-1 {
  margin-top: -300px;
  height: auto;
  z-index: 1;
  position: relative;
}

.cta-section-1 .bg-video {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.treatment-packages-with-cta .cta-section-1 .container {
  position: relative;
  left: auto;
  right: auto;
  bottom: auto;
}

.treatment-packages-with-cta .cta-section-1 .container .cta-inner {
  padding-top: calc(400px + var(--spacing-8xl));
  padding-bottom: var(--spacing-7xl);
}

.treatment-packages-with-cta .treatment-packages {
  z-index: 2;
  padding-bottom: var(--spacing-4xl);
}

/**************-------------------------------------**************/
/*                  TREATMENT PACKAGES                           */
/**************-------------------------------------**************/
.treatment-packages {
  position: relative;
}

.treatment-packages .bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 1;
}

.treatment-packages .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: center;
}

.treatment-packages .intro {
  padding-top: var(--spacing-14xl);
  padding-bottom: var(--spacing-8xl);
  position: relative;
  z-index: 3;
}

.treatment-packages .intro .wrapper {
  max-width: var(--container-lg);
  margin-inline: auto;
  text-align: center;
}

.treatment-packages .intro .icon {
  width: 72px;
  height: auto;
  margin-inline: auto;
}

.treatment-packages .intro .icon svg,
.treatment-packages .intro .icon img {
  width: 100%;
  height: auto;
}

.treatment-packages .intro .title {
  padding-block: var(--spacing-lg);
  font-size: var(--font-size-8xl);
  color: var(--sandstone-500);
}

.treatment-packages .intro .scroll-to {
  margin-inline: auto;
  max-width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
  color: var(--sandstone-500);
  font-size: var(--font-size-lg);
  position: relative;
  z-index: 5;
}

.treatment-packages .intro .scroll-to:hover {
  color: var(--sandstone-200);
}

.treatment-packages-slider {
  position: relative;
  z-index: 2;
  scroll-margin-top: var(--spacing-4xl);
}

.treatment-packages-slider {
}

.treatment-packages-slider .heading-wrapper {
  display: grid;
  grid-template-columns: auto max-content;
  gap: var(--spacing-2xl);
  align-items: flex-end;
  margin-bottom: var(--spacing-2xl);
}

.treatment-packages-slider .heading-wrapper .wrapper-left {
  max-width: var(--max-width-md);
}

.treatment-packages-slider .heading-wrapper .heading {
  font-size: var(--font-size-7xl);
  color: var(--sandstone-500);
  margin-bottom: var(--spacing-md);
}

.treatment-packages-slider .heading-wrapper .description {
  font-weight: 300;
  color: var(--sandstone-300);
}

/* ---------------- slider ---------------- */
.treatment-packages-slider .slider {
  position: relative;
  width: 100%;
  aspect-ratio: 1180 / 560;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: var(--evergreen-900);
  cursor: grab;
  user-select: none;

  touch-action: pan-y;
}
.treatment-packages-slider .slider.dragging {
  cursor: grabbing;
}

.treatment-packages-slider .slider-images {
  position: absolute;
  inset: 0;
}
.treatment-packages-slider .slider-images .img {
  position: absolute;
  inset: 0;
  overflow: hidden;
  will-change: opacity;
}
.treatment-packages-slider .slider-images .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  will-change: transform, filter;
  pointer-events: none;
}
.treatment-packages-slider .slider .slider-shades {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.treatment-packages-slider .slider .slider-shades .shade-top {
  position: absolute;
  top: 0;
  left: 0;
  width: 30%;
}

.treatment-packages-slider .slider .slider-shades .shade-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 38%;
}

.treatment-packages-slider .slides-source {
  display: none;
}

/* ---------------- text overlay ---------------- */
.treatment-packages-slider .slide-content {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: var(--spacing-lg);
  pointer-events: none;
  max-width: var(--max-width-sm);
}
.treatment-packages-slider .clip {
  overflow: hidden;
}
.treatment-packages-slider .slide-top {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}
.treatment-packages-slider .slide-content .slide-title-track,
.treatment-packages-slider .slide-content .slide-duration-track,
.treatment-packages-slider .slide-content .price-label-track,
.treatment-packages-slider .slide-content .price-track,
.treatment-packages-slider .slide-content .desc-track,
.treatment-packages-slider .slide-content .learn-more {
  will-change: opacity;
}
.treatment-packages-slider .slide-content .slide-title-track p {
  font-size: var(--font-size-3xl);
  font-weight: 500;
  color: var(--sandstone-400);
  line-height: 1.2;
}
.treatment-packages-slider .slide-content .slide-duration-track p {
  color: var(--chasenut-200);
}
.treatment-packages-slider .slide-content .slide-duration-track span {
  color: var(--chasenut-100);
}

.treatment-packages-slider .slide-content .slide-bottom {
  max-width: 320px;
}

.treatment-packages-slider .slide-content .price-label {
  display: block;
  color: var(--chasenut-200);
  margin-bottom: 4px;
}
.treatment-packages-slider .slide-content .price-track p {
  font-size: var(--font-size-5xl);
  color: var(--sandstone-400);
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: -0.8px;
}
.treatment-packages-slider .slide-content .desc-track p {
  color: var(--chasenut-100);
  margin-block: var(--spacing-lg);
  line-height: 1.4;
}
.treatment-packages-slider .slide-content .learn-more {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  font-weight: 500;
  text-decoration: none;
  pointer-events: auto;
}
.treatment-packages-slider .slide-content .learn-more .chev {
  width: 20px;
  height: 20px;
  margin-top: 3px;
  transition: transform 0.3s ease;
}
.treatment-packages-slider .slide-content .learn-more:hover .chev {
  transform: translateX(4px);
}

/* ---------------- arrows ---------------- */
.treatment-packages-slider .nav {
  position: absolute;
  z-index: 5;
  bottom: var(--spacing-lg);
  right: var(--spacing-lg);
  display: flex;
  gap: var(--spacing-sm);
}
.treatment-packages-slider .nav-btn {
  width: 52px;
  height: 52px;
  border-radius: var(--rounded-full);
  border: 1px solid rgba(229, 215, 189, 0.8);
  background: transparent;
  backdrop-filter: blur(4px);
  color: var(--sandstone-500);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition:
    background 0.3s ease,
    color 0.3s ease;
}
.treatment-packages-slider .nav-btn:hover {
  background: var(--sandstone-500);
  color: var(--chasenut-500);
}
.treatment-packages-slider .nav-btn svg {
  width: 22px;
  height: 22px;
  display: block;
}

.treatment-packages-slider .nav-btn .dchev path {
  stroke: currentColor;
  fill: none;
}

.treatment-packages-slider .mobile-action {
  display: none;
}

@media screen and (max-width: 1279px) {
  .treatment-packages-slider .slide-content .desc-track p {
    margin-block: var(--spacing-ml);
  }
}

@media screen and (max-width: 1023px) {
  .treatment-packages .intro .icon {
    width: 64px;
  }

  .treatment-packages-slider .slider {
    aspect-ratio: 1180 / 700;
  }

  .treatment-packages .intro .scroll-to {
    font-size: var(--font-size-lg);
  }

  .treatment-packages-slider .slider .slider-shades .shade-top,
  .treatment-packages-slider .slider .slider-shades .shade-bottom {
    width: 40%;
  }

  .treatment-packages-slider .slide-content .slide-bottom {
    max-width: 240px;
  }

  .treatment-packages-slider .slide-content .slide-title-track p {
    font-size: var(--font-size-2xl);
  }
  .treatment-packages-slider .slide-content .slide-duration-track p,
  .treatment-packages-slider .slide-content .price-label,
  .treatment-packages-slider .slide-content .desc-track p {
    font-size: var(--font-size-sm);
  }

  .treatment-packages-slider .slide-content .price-track p {
    font-size: var(--font-size-4xl);
  }

  .treatment-packages-slider .slide-content .learn-more {
    gap: 8px;
    font-size: var(--font-size-md);
  }
  .treatment-packages-slider .slide-content .learn-more .chev {
    width: 16px;
    height: 16px;
    margin-top: 2px;
  }

  .treatment-packages-slider .nav-btn {
    width: 32px;
    height: 32px;
  }

  .treatment-packages-slider .nav-btn svg {
    width: 12px;
    height: 12px;
  }
}

@media screen and (max-width: 767px) {
  .treatment-packages-slider .heading-wrapper .wrapper-left {
    max-width: var(--container-sm);
  }
  .treatment-packages .heading-wrapper {
    grid-template-columns: 1fr;
    align-items: flex-start;
    gap: var(--spacing-ml);
  }

  .treatment-packages .heading-wrapper .wrapper-right {
    display: none;
  }

  .treatment-packages-slider .nav {
    top: var(--spacing-lg);
    right: var(--spacing-lg);
    bottom: auto;
  }

  .treatment-packages-slider .slider {
    aspect-ratio: 4/3;
  }
}

@media screen and (max-width: 639px) {
  .treatment-packages .intro {
    padding-top: calc(var(--spacing-15xl) * 1.5);
  }
  .treatment-packages .intro .icon {
    width: 58px;
  }

  .treatment-packages-slider .slider {
    aspect-ratio: 3/4;
  }

  .treatment-packages-slider .slider .slider-shades .shade-top,
  .treatment-packages-slider .slider .slider-shades .shade-bottom {
    width: 90%;
  }

  .treatment-packages-slider .mobile-action {
    margin-top: var(--spacing-xl);
    display: block;
    text-align: center;
  }
}

/**************-------------------------------------**************/
/*                        IMAGE MARQUEE                          */
/**************-------------------------------------**************/
.image-marquee {
  --gap: var(--spacing-ml);
  --card-w: 340px;
  --card-h: 520px;

  position: relative;
  width: 100%;
  overflow: hidden;
  z-index: 2;
}

.image-marquee .marquee-track {
  display: flex;
  gap: var(--gap);
  width: max-content;
  will-change: transform;
}

.image-marquee .marquee-group {
  display: contents;
}

.image-marquee .card {
  flex: 0 0 var(--card-w);
  width: var(--card-w);
  height: var(--card-h);
  position: relative;
  overflow: hidden;
  border-radius: var(--rounded-3xl);
  background: var(--sandstone-100);
}

.image-marquee .card-image {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.image-marquee .card-image img {
  position: absolute;
  top: 0;
  left: 50%;
  height: 100%;
  width: auto;
  max-width: none;
  transform: translateX(-50%);
  will-change: transform;
  user-select: none;
  -webkit-user-drag: none;
}

@media screen and (max-width: 639px) {
  .image-marquee {
    --card-w: 220px;
    --card-h: 320px;
  }
}

/**************-------------------------------------**************/
/*                        TREATMENT HERO                         */
/**************-------------------------------------**************/
.treatment-hero {
  position: relative;
  width: 100%;

  overflow: hidden;

  opacity: 0;
  transition: opacity 0.6s ease;
}
.treatment-hero.is-visible {
  opacity: 1;
}

.treatment-hero .hero-bg-video {
  width: 100%;
  height: 100%;
}

.treatment-hero .hero-bg-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.treatment-hero .intro__audio {
  position: absolute;
  right: var(--spacing-xl);
  bottom: 320px;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  font-size: var(--font-size-xs);
  color: var(--sandstone-200);
  text-align: center;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.treatment-hero.about-hero .intro__audio {
  bottom: 120px;
}

.treatment-hero .audio-wave {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 34px;
}
.treatment-hero .audio-wave i {
  display: block;
  width: 1px;
  height: 100%;
  background: currentColor;
  border-radius: 3px;
  transform: scaleY(0.28);
  transform-origin: center;
  transition: transform 0.35s ease;
}
.treatment-hero .intro__audio.is-on .audio-wave i {
  animation: audio-bar 0.9s ease-in-out infinite;
}
.treatment-hero .intro__audio.is-on .audio-wave i:nth-child(1) {
  animation-delay: -0.7s;
}
.treatment-hero .intro__audio.is-on .audio-wave i:nth-child(2) {
  animation-delay: -0.2s;
}
.treatment-hero .intro__audio.is-on .audio-wave i:nth-child(3) {
  animation-delay: -0.5s;
}
.treatment-hero .intro__audio.is-on .audio-wave i:nth-child(4) {
  animation-delay: -0.1s;
}
.treatment-hero .intro__audio.is-on .audio-wave i:nth-child(5) {
  animation-delay: -0.4s;
}

@media screen and (max-width: 767px) {
  .treatment-hero .intro__audio,
  .treatment-hero.about-hero .intro__audio {
    right: var(--spacing-md);
    bottom: 220px;
  }
}

/**************-------------------------------------**************/
/*                        TREATMENT INTRO                        */
/**************-------------------------------------**************/
.treatment-intro {
  position: relative;
  overflow: hidden;
  padding-block: var(--spacing-8xl) var(--spacing-10xl);
  text-align: center;
  color: var(--sandstone-100, #f9f5ee);
}

.treatment-intro .bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}

.treatment-intro .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: center;
}

.treatment-intro .wrapper {
  position: relative;
  z-index: 1;
  max-width: var(--container-lg);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
}

.treatment-intro .icon {
  display: block;
  width: 80px;
  height: 80px;
}
.treatment-intro .icon svg {
  width: 100%;
  height: 100%;
}

.treatment-intro .heading {
  color: var(--sandstone-500);
}

.treatment-intro .quote {
  font-size: var(--font-size-6xl);
  color: var(--sandstone-500);
  line-height: 1.2;
}

.treatment-intro .description {
  color: var(--sandstone-200);
  max-width: var(--container-sm);
  margin-inline: auto;
  font-weight: 300;
}

.treatment-intro .scroll-to {
  margin-top: var(--spacing-lg);
  margin-inline: auto;
  max-width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  position: relative;
  z-index: 5;
}

.treatment-intro .scroll-to:hover {
  color: var(--sandstone-200);
}

@media screen and (max-width: 1023px) {
  .treatment-intro .scroll-to {
    font-size: var(--font-size-lg);
  }

  .treatment-intro .icon {
    width: 60px;
    height: 60px;
    margin-bottom: var(--spacing-md);
  }
}

@media screen and (max-width: 639px) {
  .treatment-intro .icon {
    width: 42px;
    height: 42px;
  }

  .treatment-intro .quote {
    font-size: var(--font-size-4xl);
  }
}

/**************-------------------------------------**************/
/*                        TREATMENT 3 CARDS                      */
/**************-------------------------------------**************/

.treatment-3cards {
  position: relative;
  overflow: hidden;
}

.treatment-3cards .bg-image {
  position: absolute;
  inset: 0;
  z-index: 1;
}
.treatment-3cards .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: top;
  opacity: 0.5;
}

.treatment-3cards .container {
  padding-block: var(--spacing-3xl) var(--spacing-6xl);
}

.treatment-3cards .wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-xl);
  max-width: var(--container-lg);
  margin-inline: auto;
  position: relative;
  z-index: 2;
}
.treatment-3cards .heading {
  color: var(--evergreen-700);
  max-width: var(--container-md);
}

.treatment-3cards .cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-ml);
  width: 100%;
}

.treatment-3cards .card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--spacing-xl) var(--spacing-lg);
  border: 1px solid rgba(3, 43, 25, 0.4);
  border-radius: var(--rounded-xl);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
}

.treatment-3cards .card-icon {
  width: 50px;
  height: 50px;
  color: var(--evergreen-700);
  margin-bottom: var(--spacing-ml);
  animation: floating 2.6s ease-in-out infinite alternate;
}

.treatment-3cards .card-icon svg,
.treatment-3cards .card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.treatment-3cards .card-title {
  font-family: var(--body-font);
  font-size: var(--font-size-3xl);
  color: var(--evergreen-700);
  font-weight: 400;
  margin-bottom: var(--spacing-sm);
  animation: floating 2.6s ease-in-out infinite alternate;
}

.treatment-3cards .card-text {
  font-weight: 300;
  font-size: var(--font-size-lg);
  color: var(--evergreen-400);
  line-height: 1.4;
  animation: floating 2.6s ease-in-out infinite alternate;
}

.treatment-3cards .statement {
  font-size: var(--font-size-6xl);
  color: var(--evergreen-700);
  font-weight: 400;
  max-width: var(--container-md);
  font-family: var(--body-font);
}

@media (max-width: 1279px) {
  .treatment-3cards .wrapper {
    max-width: 100%;
  }

  .treatment-3cards .card-icon {
    width: 48px;
    height: 48px;
  }
}

@media (max-width: 1023px) {
  .treatment-3cards .card-icon {
    width: 38px;
    height: 38px;
  }

  .treatment-3cards .cards {
    gap: var(--spacing-md);
  }

  .treatment-3cards .card-title {
    font-size: var(--font-size-2xl);
  }

  .treatment-3cards .card-text {
    font-size: var(--font-size-md);
  }
}

@media (max-width: 767px) {
  .treatment-3cards .cards {
    grid-template-columns: 1fr;
    max-width: 360px;
  }
}

/**************-------------------------------------**************/
/*                        TREATMENT 3 CARDS                      */
/**************-------------------------------------**************/
.treatment-intro-2 {
  position: relative;
  overflow: hidden;
}

.treatment-intro-2 .top,
.treatment-intro-2 .bottom {
  position: relative;
  z-index: 2;
}

.treatment-intro-2 .top .bg-image {
  position: absolute;
  inset: 0;
}

.treatment-intro-2 .top .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.treatment-intro-2 .bottom .bg-image {
  position: absolute;
  inset: auto 0 0 0;
}

.treatment-intro-2 .bottom .bg-image img {
  width: 100%;
  height: auto;
}

.treatment-intro-2 .middle {
  position: absolute;
  inset: 30% 0 0%;
  z-index: 1;
}

.treatment-intro-2 .middle .bg-image {
  width: 100%;
  height: 100%;
}

.treatment-intro-2 .middle .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.treatment-intro-2 .top .wrapper {
  position: relative;
  z-index: 3;
  max-width: var(--container-md);
  margin-inline: auto;
}

.treatment-intro-2 .top .heading {
  color: var(--sandstone-500);
  margin-bottom: var(--spacing-xl);
}

.treatment-intro-2 .lead {
  width: 49%;
  color: var(--sandstone-100);
  font-weight: 300;
  font-size: var(--font-size-md);
}

.treatment-intro-2 .lead-left {
  text-align: right;
}

.treatment-intro-2 .lead-right {
  margin-left: auto;
}

.treatment-intro-2 .bottom .wrapper {
  padding-top: 200px;
  padding-bottom: 20px;
  position: relative;
  z-index: 3;
  max-width: var(--container-md);
  margin-inline: auto;
}

.treatment-intro-2 .bottom .statement {
  font-size: var(--font-size-6xl);
  font-family: var(--heading-font);
  color: var(--sandstone-500);
  font-weight: 400;
  max-width: var(--container-md);
  line-height: 1.1;
}

@media (max-width: 1679px) {
  .treatment-intro-2 .middle {
    inset: 32% 0 0%;
  }
}

@media (max-width: 1279px) {
  .treatment-intro-2 .top .wrapper {
    padding-top: 380px;
  }
}

@media (max-width: 1023px) {
  .treatment-intro-2 .lead {
    width: 80%;
    color: var(--evergreen-100);
    font-weight: 300;
    font-size: var(--font-size-xl);
  }
  .treatment-intro-2 .lead-left {
    margin-bottom: var(--spacing-xl);
    text-align: left;
  }

  .treatment-intro-2 .lead-right {
    text-align: right;
  }

  .treatment-template .treatment-intro-2 {
    margin-top: -400px;
  }

  .treatment-intro-2 .top .wrapper {
    padding-top: 400px;
  }
}

@media (max-width: 639px) {
  .treatment-intro-2 .lead {
    font-size: var(--font-size-md);
    width: 100%;
  }

  .treatment-intro-2 .lead-left {
    margin-bottom: var(--spacing-lg);
  }

  .treatment-intro-2 .lead-right {
    text-align: left;
  }

  .treatment-intro-2 .top .wrapper {
    padding-top: 260px;
    padding-bottom: 260px;
  }

  .treatment-intro-2 .bottom .wrapper {
    padding-bottom: 20px;
  }

  .treatment-intro-2 .bottom .statement {
    font-size: var(--font-size-2xl);
    line-height: 1.1;
  }

  .treatment-intro-2 .bottom .bg-image {
    inset: 0;
  }

  .treatment-intro-2 .bottom .bg-image img {
    width: 100%;
    height: 100%;
    object-fit: fill;
  }
}

/**************-------------------------------------**************/
/*                 MARQUEE WITH TRANSFORM SHIFT                  */
/**************-------------------------------------**************/
.marquee-with-transform-shift {
  position: relative;
  overflow: hidden;
}

.marquee-with-transform-shift .bg-video {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  object-fit: fill;
  pointer-events: none;
  user-select: none;
}

.marquee-with-transform-shift .top-shade {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: auto;
  z-index: 2;
  width: 100%;
  pointer-events: none;
  user-select: none;
}

.marquee-with-transform-shift .bottom-shade {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  z-index: 2;
  width: 100%;
  height: var(--spacing-12xl);
  pointer-events: none;
  user-select: none;
}

.marquee-with-transform-shift .top-shade img,
.marquee-with-transform-shift .bottom-shade img {
  width: 100%;
  height: 100%;
}

/**************-------------------------------------**************/
/*                        TRANSFORM SHIFT                        */
/**************-------------------------------------**************/

.transform-shift {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  z-index: 1;
  padding-block: var(--spacing-10xl) var(--spacing-12xl);
}

.transform-shift .container {
}

.transform-shift .wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: var(--container-lg);
  margin-inline: auto;
}

.transform-shift .heading-wrapper {
  margin-bottom: var(--spacing-2xl);
  max-width: var(--container-md);
}

.transform-shift .heading {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}
.transform-shift .description {
  font-weight: 300;
  color: var(--chasenut-400);
}

.transform-shift .shift-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto repeat(4, auto);
  width: 100%;
  max-width: var(--container-md);
  --line: rgb(183, 166, 161, 0.5);
}

.transform-shift .shift-col {
  display: grid;
  grid-template-rows: subgrid;
  grid-row: 1 / -1;
  text-align: center;
}

.transform-shift .shift-col:first-child {
  position: relative;
}
.transform-shift .shift-col:first-child::after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  bottom: -5%;
  width: 1px;
  height: 105%;
  background-color: var(--line);
}
.transform-shift .col-head {
  grid-row: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-sm);
  padding-bottom: var(--spacing-md);
  width: 100%;
}
.transform-shift .col-title {
  font-weight: 500;
  font-size: var(--font-size-3xl);
  color: var(--chasenut-500);
  font-family: var(--body-font);
}
.transform-shift .col-chev {
  width: 50px;
  height: auto;
  color: var(--chasenut-500);
}
.transform-shift .col-chev svg {
  width: 100%;
  height: 100%;
}

.transform-shift .col-list {
  list-style: none;
  display: grid;
  grid-template-rows: subgrid;
  grid-row: 2 / -1;
  width: 100%;
}
.transform-shift .col-list li {
  font-weight: 400;
  font-size: var(--font-size-xl);
  color: var(--chasenut-500);
  padding: var(--spacing-ml);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.transform-shift .col-list li:after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 90%;
  height: 1px;
  background-color: var(--line);
  pointer-events: none;
  user-select: none;
}

.transform-shift .shift-col:first-child .col-list li:after {
  left: auto;
  right: 0;
}

.transform-shift .shift-col:first-child .col-head,
.transform-shift .shift-col:first-child .col-list li {
  padding-right: var(--spacing-lg);
  padding-left: 0;
}
.transform-shift .shift-col:last-child .col-head,
.transform-shift .shift-col:last-child .col-list li {
  padding-left: var(--spacing-lg);
  padding-right: 0;
}

@media (max-width: 1279px) {
  .transform-shift .col-title,
  .transform-shift .col-list li {
    font-size: var(--font-size-xl);
  }

  .transform-shift .col-chev {
    width: 32px;
  }

  .transform-shift .shift-compare {
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .transform-shift .wrapper {
    max-width: 100%;
  }
}

@media (max-width: 639px) {
  .transform-shift .shift-compare {
    grid-template-columns: 1fr;
    grid-template-rows: none;
  }

  .transform-shift .shift-col {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
  .transform-shift .col-list {
    display: flex;
    flex-direction: column;
    grid-row: auto;
  }
  .transform-shift .shift-col:first-child {
    border-right: 0;
    margin-bottom: var(--spacing-4xl);
  }

  .transform-shift .shift-col:first-child::after {
    display: none;
  }

  .transform-shift .col-list li:after {
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    width: 80%;
  }

  .transform-shift .col-title,
  .transform-shift .col-list li {
    font-size: var(--font-size-lg);
  }

  .transform-shift .col-title {
    font-weight: 600;
  }
  .transform-shift .col-head {
    padding: 0;
  }
}

/**************-------------------------------------**************/
/*                  TREATMENT TAB — RITUALS                      */
/**************-------------------------------------**************/
.treatment-tab {
  padding-block: 0 var(--spacing-8xl);
}

.treatment-tab .heading-wrapper {
  display: grid;
  grid-template-columns: auto max-content;
  gap: var(--spacing-2xl);
  align-items: flex-end;
  margin-bottom: var(--spacing-2xl);
}

.treatment-tab .heading-wrapper .wrapper-left {
  max-width: var(--container-sm);
}

.treatment-tab .heading-wrapper .heading {
  font-size: var(--font-size-7xl);
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}
.treatment-tab .heading-wrapper .description {
  font-weight: 300;
  color: var(--chasenut-400);
}

.treatment-tab .btn-double-arrow {
  color: var(--chasenut-500);
  border-color: var(--chasenut-500);
}

.treatment-tab .btn-double-arrow:hover {
  background-color: transparent;
}

.treatment-tab .tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xl);
}

.treatment-tab .tab-list {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.treatment-tab .tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-sm) var(--spacing-ml);
  color: var(--chasenut-400);
  font-size: var(--font-size-md);
  white-space: nowrap;
  transition: color 0.3s ease;
}

.treatment-tab .tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: var(--chasenut-300);
}

.treatment-tab .tab:first-child::before {
  display: none;
}

.treatment-tab .tab:hover {
  color: var(--chasenut-500);
}

.treatment-tab .tab.active {
  color: var(--chasenut-500);
}

.treatment-tab .tab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: 0.3s;
  will-change: transform;
}

.treatment-tab .tab.active .tab-icon {
  transform: translateY(-2px) scale(1.08);
  transform-origin: bottom;
}

.treatment-tab .tab-icon img,
.treatment-tab .tab-icon svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.treatment-tab .tab-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  width: 0;
  background: var(--chasenut-400);
  transform: translateX(0);
  transition:
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}

.treatment-tab .tab-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--sandstone-700);
  transition: color 0.3s ease;
}

.treatment-tab .tab-arrow:hover {
  color: var(--chasenut-400);
}

.treatment-tab .tab-arrow svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
}

/* ---------------- panels ---------------- */
.treatment-tab .panels {
  position: relative;
  display: grid;
}

.treatment-tab .panel {
  grid-area: 1 / 1;
  min-width: 0;
}

.treatment-tab .panel[hidden] {
  display: none;
}

/* ---------------- ritual card ---------------- */
.treatment-tab .ritual {
  position: relative;
  width: 100%;
  aspect-ratio: 1180 / 620;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: var(--sandstone-300);
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.treatment-tab .ritual.dragging {
  cursor: grabbing;
  transition: none;
}

.treatment-tab .ritual.expanded {
  cursor: default;
}

.treatment-tab .ritual-media {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -20%;
  z-index: 0;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.treatment-tab .ritual-media picture {
  display: block;
  width: 100%;
  height: 100%;
}

.treatment-tab .ritual-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
}

.treatment-tab .ritual.expanded .ritual-media {
  transform: translateX(calc(-20% / 1.2));
}

.treatment-tab .chev {
  display: inline-flex;
  align-items: center;
  width: 12px;
  flex-shrink: 0;
}

.treatment-tab .chev svg {
  width: 100%;
  height: auto;
  fill: none;
}

.treatment-tab .ritual-intro {
  position: absolute;
  z-index: 3;
  top: var(--spacing-xl);
  left: var(--spacing-xl);
  max-width: 40%;
}

.treatment-tab .ritual-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-7xl);
  font-weight: 400;
  line-height: 1.1;
  color: var(--sandstone-400);
}

.treatment-tab .ritual-wave {
  display: block;
  width: 50px;
  margin-top: var(--spacing-sm);
  color: var(--sandstone-200);
}

.treatment-tab .ritual-wave svg {
  width: 100%;
  height: auto;
  fill: none;
}

.treatment-tab .ritual-desc {
  position: absolute;
  z-index: 3;
  bottom: var(--spacing-xl);
  left: var(--spacing-xl);
  max-width: 40%;
  font-size: var(--font-size-sm);
  font-weight: 300;
  line-height: 1.3;
  color: var(--sandstone-300);
}

.treatment-tab .ritual-toggle {
  position: absolute;
  z-index: 4;
  bottom: var(--spacing-xl);
  right: var(--spacing-xl);
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  border: none;
  background: none;
  cursor: pointer;
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  font-weight: 500;
  transition:
    opacity 0.4s ease,
    color 0.3s ease;
}

.treatment-tab .ritual-toggle:hover {
  color: var(--sandstone-200);
}

.treatment-tab .ritual-toggle .chev {
  transition: transform 0.35s ease;
}

.treatment-tab .ritual-toggle:hover .chev {
  transform: translateX(-4px);
}

.treatment-tab .ritual.expanded .ritual-toggle {
  opacity: 0;
  pointer-events: none;
}

/* ---------------- detail drawer ---------------- */
.treatment-tab .ritual-detail {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  background: var(--sandstone-300);
  border-radius: var(--rounded-2xl);
  overflow: visible;
  opacity: 0;
  visibility: hidden;
  transform: translateX(30%);
  transition:
    opacity 1s ease,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 1.2s;
}

.treatment-tab .ritual.expanded .ritual-detail {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition:
    opacity 0.6s,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.6s;
}

.treatment-tab .ritual-detail .bg-icon {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  background: transparent;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
}

.treatment-tab .ritual-detail .bg-icon svg,
.treatment-tab .ritual-detail .bg-icon img {
  position: absolute;
  top: 0;
  right: 0;
  width: 180px;
  height: 180px;
  object-fit: contain;
  object-position: top right;
  opacity: 0.1;
  pointer-events: none;
  user-select: none;
}

.treatment-tab .ritual-detail-inner {
  height: 100%;
  overflow-y: auto;
  padding: var(--spacing-lg);
  padding-left: var(--spacing-xl);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-ms);
}

.treatment-tab .ritual.expanded .ritual-detail-inner > * {
  animation: ritual-rise 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}

@keyframes ritual-rise {
  from {
    opacity: 0;
    filter: blur(10px);
    transform: translateY(14px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: none;
  }
}

.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(1) {
  animation-delay: 0.18s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(2) {
  animation-delay: 0.24s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(3) {
  animation-delay: 0.3s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(4) {
  animation-delay: 0.36s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(5) {
  animation-delay: 0.42s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(6) {
  animation-delay: 0.48s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(7) {
  animation-delay: 0.54s;
}
.treatment-tab .ritual.expanded .ritual-detail-inner > *:nth-child(8) {
  animation-delay: 0.6s;
}

.treatment-tab .ritual-handle {
  position: absolute;
  z-index: 4;
  top: 70%;
  left: 0;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--chasenut-500);
  border-radius: var(--rounded-full);
  background: var(--sandstone-500);
  cursor: pointer;
  color: var(--chasenut-500);
  transition:
    background-color 0.3s ease,
    color 0.3s ease;
}

.treatment-tab .ritual-handle:hover {
  background: var(--sandstone-400);
  color: var(--sandstone-100);
}

.treatment-tab .ritual-handle .chev {
  width: 10px;
  transition: transform 0.3s ease;
}

.treatment-tab .ritual-handle:hover .chev {
  transform: translateX(2px);
}

.treatment-tab .ritual-handle .ritual-close {
  display: none;
  width: 10px;
}

.treatment-tab .ritual-handle .ritual-close svg {
  display: block;
  width: 100%;
  height: auto;
}

.treatment-tab .ritual-headline {
  font-size: var(--font-size-xl);
  font-weight: 600;
  line-height: 1.4;
  color: var(--chasenut-500);
}

.treatment-tab .ritual-duration {
  color: var(--chasenut-400);
  padding-bottom: var(--spacing-ms);
  border-bottom: 1px solid var(--chasenut-200);
}

.treatment-tab .ritual-duration span {
  color: var(--chasenut-400);
  font-weight: 500;
}

.treatment-tab .ritual-subhead {
  font-size: var(--font-size-xl);
  font-weight: 600;
  color: var(--chasenut-500);
  margin-block: var(--spacing-sm) var(--spacing-sm);
}

.treatment-tab .ritual-tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm) var(--spacing-md);
}

.treatment-tab .ritual-tags li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  color: var(--chasenut-400);
}

.treatment-tab .tag-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  color: var(--chasenut-300);
}

.treatment-tab .tag-icon svg,
.treatment-tab .tag-icon img {
  width: 100%;
  height: 100%;
  fill: none;
}

.treatment-tab .ritual-options {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.treatment-tab .ritual-options li {
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-sm);
  font-size: var(--font-size-sm);
  line-height: 1.5;
  color: var(--chasenut-400);
}

.treatment-tab .ritual-options .tag-icon {
  margin-top: calc((1.5em - 16px) / 2);
}

.treatment-tab .ritual-outcome {
  color: var(--chasenut-400);
  line-height: 1.5;
}

.treatment-tab .ritual-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-lg);
  margin-top: auto;
}

.treatment-tab .ritual-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
}

.treatment-tab .ritual-btn .chev {
  transition: transform 0.3s ease;
}

.treatment-tab .ritual-btn:hover {
  color: var(--chasenut-400);
}

.treatment-tab .ritual-btn:hover .chev-left {
  transform: translateX(-3px);
}

.treatment-tab .ritual-btn:hover .chev-right {
  transform: translateX(3px);
}

@media screen and (max-width: 1279px) {
  .treatment-tab .ritual {
    aspect-ratio: 1180 / 700;
  }

  .treatment-tab .ritual-handle {
    width: 40px;
    height: 40px;
  }

  .treatment-tab .ritual-detail {
    width: 53%;
  }
}

@media screen and (max-width: 1023px) {
  .treatment-tab .ritual {
    aspect-ratio: 1180 / 860;
    max-height: 580px;
  }

  .treatment-tab .ritual-title {
    font-size: var(--font-size-6xl);
  }

  .treatment-tab .ritual-wave {
    width: 40px;
  }

  .treatment-tab .ritual-desc {
    font-size: var(--font-size-sm);
  }

  .treatment-tab .ritual-detail {
    width: 80%;
  }

  .treatment-tab .ritual-detail .bg-icon svg,
  .treatment-tab .ritual-detail .bg-icon img {
    width: 150px;
    height: 150px;
  }

  .treatment-tab .ritual-detail-inner {
    padding: var(--spacing-lg);

    padding-left: var(--spacing-xl);
    gap: var(--spacing-md);
  }
  .treatment-tab .ritual-headline {
    font-size: var(--font-size-lg);
  }
  .treatment-tab .ritual-subhead {
    font-size: var(--font-size-lg);
  }
  .treatment-tab .ritual-options li {
    font-size: var(--font-size-sm);
  }
}

/* ===== MOBILE ===== */
@media screen and (max-width: 767px) {
  .treatment-tab .heading-wrapper {
    grid-template-columns: 1fr;
    align-items: flex-start;
    gap: var(--spacing-ml);
  }

  .treatment-tab .heading-wrapper .wrapper-right {
    display: none;
  }

  .treatment-tab .tabs {
    gap: var(--spacing-lg);
  }

  .treatment-tab .tab-arrow {
    display: inline-flex;
  }

  .treatment-tab .tab-list {
    flex: 0 1 auto;
    position: relative;
    min-height: 2.2em;
    align-items: center;
    width: 160px;
  }

  .treatment-tab .tab {
    position: absolute;
    inset: 0;
    margin: auto;
    width: max-content;
    height: max-content;
    display: inline-flex;
    gap: 8px;
    justify-content: center;
    padding: var(--spacing-sm) 0;
    opacity: 0;
    visibility: hidden;
    filter: blur(3px);
    pointer-events: none;
    transition:
      opacity 0.5s ease,
      filter 0.5s ease;
  }

  .treatment-tab .tab::before {
    display: none;
  }

  .treatment-tab .tab.active {
    opacity: 1;
    visibility: visible;
    filter: blur(0px);
    pointer-events: auto;
  }

  .treatment-tab .tab.active .tab-icon {
    transform: translateY(0) scale(1);
    transform-origin: bottom;
  }

  .treatment-tab .tab-underline {
    display: none;
  }

  .treatment-tab .panels {
    touch-action: pan-y;
  }

  .treatment-tab .ritual {
    aspect-ratio: 30 / 45;
  }

  .treatment-tab .ritual-detail {
    width: fit-content;
    inset: 0;
  }
  .treatment-tab .ritual-media::after {
    background:
      linear-gradient(180deg, rgba(1, 14, 8, 0.5) 0%, rgba(1, 14, 8, 0) 30%),
      linear-gradient(0deg, rgba(1, 14, 8, 0.55) 0%, rgba(1, 14, 8, 0) 45%);
  }
  .treatment-tab .ritual-intro {
  }
  .treatment-tab .ritual-intro,
  .treatment-tab .ritual-desc {
    max-width: 80%;
    left: var(--spacing-lg);
  }

  .treatment-tab .ritual-desc {
    bottom: var(--spacing-4xl);
  }

  .treatment-tab .ritual-detail-inner {
    padding: var(--spacing-ml);
    gap: var(--spacing-sm);
  }

  .treatment-tab .ritual-headline {
    max-width: calc(100% - 32px);
    font-size: var(--font-size-xl);
  }

  .treatment-tab .ritual-detail .bg-icon svg,
  .treatment-tab .ritual-detail .bg-icon img {
    width: 120px;
    height: 120px;
  }

  .treatment-tab .ritual-duration {
    font-size: var(--font-size-sm);
  }

  .treatment-tab .ritual-subhead {
    font-size: var(--font-size-md);
  }

  .treatment-tab .ritual-toggle,
  .treatment-tab .ritual-tags li,
  .treatment-tab .ritual-outcome {
    font-size: var(--font-size-sm);
  }

  .treatment-tab .ritual-outcome {
    margin-bottom: var(--spacing-md);
  }

  .treatment-tab .tag-icon {
    width: 12px;
    height: 12px;
  }

  .treatment-tab .chev {
    width: 10px;
  }
  .treatment-tab .ritual-handle {
    top: var(--spacing-md);
    left: auto;
    right: var(--spacing-md);
    transform: none;
    width: 28px;
    height: 28px;
  }

  .treatment-tab .ritual-handle .chev {
    display: none;
  }
  .treatment-tab .ritual-handle .ritual-close {
    display: inline-flex;
  }
  .treatment-tab .ritual-options .tag-icon {
    margin-top: calc((1.5em - 12px) / 2);
  }

  .treatment-tab .ritual-btn {
    font-size: var(--font-size-sm);
  }

  .treatment-tab .ritual-btn .chev {
    width: 8px;
  }
}

/**************-------------------------------------**************/
/*                     EXPERIENCE JOURNEY                        */
/**************-------------------------------------**************/
.treatment-experience {
  --dot: 22px;
  --gap: clamp(16px, 2vw, 26px);
  --content-w: clamp(138px, 15.5vw, 210px);
  --float-lift: 5px;

  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.treatment-experience .container,
.treatment-experience .wrapper {
  position: relative;
  z-index: 2;
}

.treatment-experience .wrapper {
  margin-inline: auto;
}

/* ---- editorial heading, top-right ---- */
.treatment-experience .heading-wrapper {
  text-align: right;
  margin-left: auto;
  max-width: var(--max-width-lg);
}

.treatment-experience .heading-wrapper .heading {
  color: var(--evergreen-600);
}

/* ---- journey / curve ---- */
.treatment-experience .journey {
  position: relative;
  padding-block: 200px;
}

.treatment-experience .journey-viz {
  position: relative;
  width: 100%;
  margin-inline: auto;
  aspect-ratio: 1155 / 292;
}

.treatment-experience .journey-path {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.treatment-experience .journey-fill {
  fill: var(--evergreen-200);
  filter: drop-shadow(0 0 6px rgba(155, 181, 170, 0.4));
}

.treatment-experience .journey-guide {
  fill: none;
  stroke: none;
}

.treatment-experience .journey-rail {
  display: none;
}

.treatment-experience .journey-points {
  position: absolute;
  inset: 0;
  list-style: none;
  margin: 0;
  padding: 0;
}

.treatment-experience .point {
  position: absolute;
}

.treatment-experience .point-dot {
  position: absolute;
  left: 0;
  top: 0;
  width: var(--dot);
  height: var(--dot);
  margin-left: calc(var(--dot) / -2);
  margin-top: calc(var(--dot) / -2);
  border-radius: var(--rounded-full);
  background: var(--sandstone-100);
  border: 5px solid var(--evergreen-700);
  display: grid;
  place-items: center;
  cursor: pointer;
  transition:
    box-shadow 0.4s ease,
    border-color 0.4s ease;
}

.treatment-experience .point-dot::after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: var(--rounded-full);
  background: var(--sandstone-500);
  transition: transform 0.4s ease;
}

.treatment-experience .point-dot:hover {
  box-shadow: 0 0 0 7px rgba(55, 108, 85, 0.12);
}
.treatment-experience .point-dot:hover::after {
  transform: scale(1.2);
}

.treatment-experience .point-content {
  position: absolute;
  left: 0;
  width: var(--content-w);
  text-align: center;
}

.treatment-experience .point.is-above .point-content {
  bottom: 0;
  transform: translate(-50%, calc((var(--dot) / 2 + var(--gap)) * -1));
}

.treatment-experience .point.is-below .point-content {
  top: 0;
  transform: translate(
    -50%,
    calc(var(--dot) / 2 + var(--gap) + var(--float-lift))
  );
}

.treatment-experience
  .journey-points
  .point.is-above:nth-child(3)
  .point-content {
  transform: translate(0, calc((var(--dot) / 2 + var(--gap)) * -0.7));
}

.treatment-experience .point-icon {
  display: inline-flex;
  width: 32px;
  height: 32px;
  color: var(--evergreen-600);
  animation: floating 2.6s ease-in-out infinite alternate;
}

@keyframes floating {
  from {
    transform: translateY(0);
  }

  to {
    transform: translateY(-5px);
  }
}

.treatment-experience .point-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
}

.treatment-experience .point-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.treatment-experience .point-title {
  font-family: var(--body-font);
  font-size: var(--font-size-3xl);
  font-weight: 400;
  color: var(--evergreen-600);
  margin-bottom: var(--spacing-sm);
  animation: floating 2.6s ease-in-out infinite alternate;
}

.treatment-experience .point-desc {
  font-size: var(--font-size-md);
  font-weight: 300;
  line-height: 1.4;
  color: var(--evergreen-400);
  animation: floating 2.6s ease-in-out infinite alternate;
}

.treatment-experience .point-icon:nth-child(1),
.treatment-experience .point-title:nth-child(1),
.treatment-experience .point-desc:nth-child(1) {
  animation-delay: 0s;
}

.treatment-experience .point-icon:nth-child(2),
.treatment-experience .point-title:nth-child(2),
.treatment-experience .point-desc:nth-child(2) {
  animation-delay: 0.15s;
}

.treatment-experience .point-icon:nth-child(3),
.treatment-experience .point-title:nth-child(3),
.treatment-experience .point-desc:nth-child(3) {
  animation-delay: 0.3s;
}

.treatment-experience .point-icon:nth-child(4),
.treatment-experience .point-title:nth-child(4),
.treatment-experience .point-desc:nth-child(4) {
  animation-delay: 0.45s;
}

.treatment-experience .point-icon:nth-child(5),
.treatment-experience .point-title:nth-child(5),
.treatment-experience .point-desc:nth-child(5) {
  animation-delay: 0.6s;
}

.treatment-experience .point-icon:nth-child(6),
.treatment-experience .point-title:nth-child(6),
.treatment-experience .point-desc:nth-child(6) {
  animation-delay: 0.75s;
}

@media screen and (max-width: 1279px) {
  .treatment-experience .wrapper {
    max-width: 100%;
  }
}

/* ===== TABLET ===== */
@media screen and (max-width: 1023px) {
  .treatment-experience {
    --gap: clamp(22px, 2.8vw, 28px);
  }

  .treatment-experience .point-title {
    font-size: var(--font-size-xl);
  }
  .treatment-experience .point-icon {
    width: 28px;
    height: 28px;
  }

  .treatment-experience .point-desc {
    font-size: var(--font-size-sm);
  }

  .treatment-experience
    .journey-points
    .point.is-above:nth-child(3)
    .point-content {
    transform: translate(0, calc((var(--dot) / 2 + var(--gap)) * -1));
  }
}

/* ===== MOBILE ===== */
@media screen and (max-width: 767px) {
  .treatment-experience .heading-wrapper .heading {
    text-align: left;
    max-width: var(--container-sm);
  }
  .treatment-experience .journey {
    padding-block: var(--spacing-2xl);
  }

  .treatment-experience .journey-viz {
    aspect-ratio: auto;
    max-width: 460px;
  }

  .treatment-experience .journey-path {
    display: none;
  }

  .treatment-experience .journey-rail {
    display: block;
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 13px;
    width: 2px;
    background: var(--evergreen-200);
    transform: scaleY(0);
    transform-origin: top center;
  }

  .treatment-experience .journey-points {
    position: static;
    display: flex;
    flex-direction: column;
    gap: clamp(2.5rem, 9vw, 3.75rem);
  }

  .treatment-experience .point {
    position: relative;
    left: auto !important;
    top: auto !important;
    display: grid;
    grid-template-columns: 28px 1fr;
    column-gap: clamp(1rem, 5vw, 1.5rem);
    align-items: start;
  }

  .treatment-experience .point-dot {
    position: relative;
    margin: 4px 0 0;
    justify-self: center;
  }

  .treatment-experience .point-content,
  .treatment-experience .point.is-above .point-content,
  .treatment-experience .point.is-below .point-content {
    position: relative;
    left: auto;
    top: auto;
    bottom: auto;
    width: auto;
    text-align: left;
    transform: none;
  }

  .treatment-experience .point-icon {
    margin-bottom: var(--spacing-xs);
  }

  .treatment-experience
    .journey-points
    .point.is-above:nth-child(3)
    .point-content {
    transform: inherit;
  }
}

/**************-------------------------------------**************/
/*                    TESTIMONIAL EXPERIENCE                     */
/**************-------------------------------------**************/
.treatment-testimonials {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: var(--spacing-8xl);
}

.treatment-testimonials .container,
.treatment-testimonials .wrapper {
  position: relative;
  z-index: 2;
}

.treatment-testimonials .wrapper {
  max-width: 1360px;
  margin-inline: auto;
}

.treatment-testimonials .heading-wrapper {
  display: grid;
  grid-template-columns: auto max-content;
  gap: var(--spacing-2xl);
  align-items: flex-end;
  margin-bottom: var(--spacing-2xl);
}

.treatment-testimonials .heading-wrapper .wrapper-left {
  max-width: var(--max-width-md);
}

.treatment-testimonials .heading-wrapper .heading {
  font-size: var(--font-size-7xl);
  color: var(--evergreen-700);
}

.treatment-testimonials .action .btn-single-arrow {
  color: var(--evergreen-700);
  border-color: var(--evergreen-700);
}

.treatment-testimonials .mobile-action {
  display: none;
}

/* ---------------- stage grid ---------------- */
.treatment-testimonials .tst-stage {
  display: grid;
  grid-template-columns:
    minmax(0, 1fr)
    minmax(300px, 460px)
    minmax(0, 1fr)
    minmax(0, 1fr);
  grid-template-rows: auto auto;
  grid-template-areas:
    ".     active content content"
    "prevL active prevR1 prevR2";
  gap: var(--spacing-ml);
  align-items: end;
}

/* ---------------- large active card ---------------- */
.treatment-testimonials .tst-active {
  grid-area: active;
  align-self: stretch;
  position: relative;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: var(--sandstone-100);
  cursor: pointer;
}

.treatment-testimonials .tst-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.treatment-testimonials .tst-media video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  will-change: transform, opacity;
}

.treatment-testimonials .tst-play {
  position: absolute;
  z-index: 3;
  top: var(--spacing-xl);
  left: var(--spacing-ml);
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: var(--rounded-full);
  border: none;
  cursor: pointer;
  animation: tst-breathe 3.2s ease-in-out infinite;
  transition:
    opacity 0.4s ease,
    background-color 0.4s ease;
  background: transparent;
  color: var(--sandstone-300);
}

.treatment-testimonials .tst-play svg {
  width: 100%;
  height: 100%;
}

.treatment-testimonials .tst-active.is-playing .tst-play {
  opacity: 0;
  pointer-events: none;
  animation: none;
}

@keyframes tst-breathe {
  0%,
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }
  50% {
    box-shadow: 0 0 0 12px rgba(255, 255, 255, 0);
  }
}

/* ---------------- content ---------------- */
.treatment-testimonials .tst-content {
  grid-area: content;
  align-self: start;
  position: relative;
  padding-top: var(--spacing-lg);
  max-width: 100%;
  min-height: clamp(200px, 24vw, 260px);
}

.treatment-testimonials .tst-quote-mark {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  width: clamp(120px, 13vw, 220px);
  color: var(--evergreen-200);
  opacity: 0.45;
}

.treatment-testimonials .tst-quote-mark svg {
  width: 100%;
  height: auto;
}

.treatment-testimonials .tst-copy {
  position: relative;
  z-index: 1;
  max-width: var(--max-width-xs);
}

.treatment-testimonials .tst-quote {
  font-size: var(--font-size-2xl);
  font-weight: 400;
  line-height: 1.3;
  color: var(--evergreen-700);
  margin-bottom: var(--spacing-md);
}

.treatment-testimonials .tst-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-sm) var(--spacing-md);
  color: var(--evergreen-300);
  font-size: var(--font-size-md);
  margin-bottom: var(--spacing-md);
}

.treatment-testimonials .tst-meta-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.treatment-testimonials .tst-meta-icon {
  display: inline-flex;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.treatment-testimonials .tst-meta-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: var(--evergreen-700);
}

.treatment-testimonials .tst-meta-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.treatment-testimonials .tst-name {
  font-size: var(--font-size-3xl);
  font-weight: 500;
  color: var(--evergreen-700);
}

/* ---------------- preview cards ---------------- */
.treatment-testimonials .tst-previews {
  display: contents;
}

.treatment-testimonials .tst-preview {
  position: relative;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  aspect-ratio: 3 / 4;
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.treatment-testimonials .tst-preview.is-ready {
  transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}

.treatment-testimonials .tst-preview:nth-child(1) {
  grid-area: prevL;
  align-self: end;
}
.treatment-testimonials .tst-preview:nth-child(2) {
  grid-area: prevR1;
  align-self: end;
}
.treatment-testimonials .tst-preview:nth-child(3) {
  grid-area: prevR2;
  align-self: end;
}

.treatment-testimonials .tst-preview-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.treatment-testimonials .tst-preview-media :is(img, video) {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition:
    transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.5s ease;
}

.treatment-testimonials .tst-preview-play {
  position: absolute;
  z-index: 2;
  top: var(--spacing-md);
  left: var(--spacing-md);
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: var(--rounded-full);
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
  color: #fff;
}

.treatment-testimonials .tst-preview-play svg {
  width: 100%;
  height: 100%;
  color: var(--sandstone-300);
}

.treatment-testimonials .tst-preview:hover {
  transform: translateY(-4px);
}

.treatment-testimonials .tst-preview:hover .tst-preview-media :is(img, video) {
}

@media screen and (max-width: 1279px) {
  .treatment-testimonials .tst-quote,
  .treatment-testimonials .tst-name {
    font-size: var(--font-size-2xl);
  }
}

@media screen and (max-width: 1023px) {
  .treatment-testimonials .tst-stage {
    grid-template-columns:
      minmax(0, 1fr)
      minmax(260px, 1fr)
      minmax(0, 1fr)
      minmax(0, 1fr);
  }

  .treatment-testimonials .tst-quote,
  .treatment-testimonials .tst-name {
    font-size: var(--font-size-xl);
  }
}

/* ===== MOBILE ===== */
@media screen and (max-width: 767px) {
  .treatment-testimonials .heading-wrapper {
    grid-template-columns: 1fr;
    align-items: flex-start;
    gap: var(--spacing-ml);
    max-width: var(--container-sm);
  }

  .treatment-testimonials .heading-wrapper .wrapper-right {
    display: none;
  }

  .treatment-testimonials .mobile-action {
    display: block;
    margin-top: var(--spacing-2xl);
  }

  .treatment-testimonials .tst-stage {
    display: flex;
    flex-direction: column;
    gap: clamp(1.5rem, 6vw, 2.25rem);
    height: auto;
  }

  .treatment-testimonials .tst-active {
    order: 1;
    min-height: 0;
    aspect-ratio: 3 / 4;
    width: 100%;
  }

  .treatment-testimonials .tst-play {
    width: 36px;
    height: 36px;
  }

  .treatment-testimonials .tst-content {
    order: 2;
    padding-top: 0;
    max-width: none;
    min-height: 0;
  }

  .treatment-testimonials .tst-quote-mark {
    width: 90px;
    top: -0.8em;
  }

  .treatment-testimonials .tst-previews {
    order: 3;
    display: flex;
    gap: var(--spacing-md);
    overflow-x: auto;
    width: 100%;
  }

  .treatment-testimonials .tst-previews::-webkit-scrollbar {
    display: none;
  }

  .treatment-testimonials .tst-preview {
    grid-area: auto;
    flex: 0 0 20%;
  }

  .treatment-testimonials .tst-meta-icon {
    width: 16px;
    height: 16px;
  }
  .treatment-testimonials .tst-meta {
    font-size: var(--font-size-sm);
  }
}

@media screen and (max-width: 479px) {
  .treatment-testimonials .tst-preview {
  }
}

/**************-------------------------------------**************/
/* WELLNESS JOURNEY */
/**************-------------------------------------**************/

.treatment-journey {
  position: relative;
  height: 300vh;
}

.treatment-journey .tj-inner {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}

.treatment-journey .tj-title {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  text-align: center;
  padding-inline: var(--spacing-lg);
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-7xl);
  line-height: 1;
  color: #000;
  will-change: transform, opacity, filter;
}

.treatment-journey .tj-top {
  top: 25%;
}

.treatment-journey .tj-bottom {
  bottom: 24%;
}

.treatment-journey .tj-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
  --p: 0;

  clip-path: inset(
    calc(35% * (1 - var(--p))) calc(38% * (1 - var(--p)))
      calc(35% * (1 - var(--p))) calc(38% * (1 - var(--p))) round
      calc(20px * (1 - var(--p)))
  );
  will-change: clip-path;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.treatment-journey .tj-media-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;

  transform: scale(calc(0.82 + (0.28 * var(--p))));
  transform-origin: center center;
  will-change: transform;
}

.treatment-journey .tj-content {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-xl);
  padding: var(--spacing-2xl);
  text-align: center;
  height: 100%;
}

.treatment-journey .tj-copy {
  max-width: var(--container-md);
  font-size: var(--font-size-5xl);
  font-weight: 400;
  line-height: 1.4;
  color: var(--sandstone-100);
  will-change: transform, opacity, filter;
}

.treatment-journey .btn-double-arrow {
  color: var(--sandstone-100);
  border-color: var(--sandstone-100);
}

/* ===== MOBILE ===== */
@media screen and (max-width: 767px) {
  .treatment-journey {
    height: 210vh;
  }

  .treatment-journey .tj-top {
    top: 25%;
  }

  .treatment-journey .tj-bottom {
    bottom: 25%;
  }

  .treatment-journey .tj-media {
    clip-path: inset(
      calc(38% * (1 - var(--p))) calc(28% * (1 - var(--p)))
        calc(38% * (1 - var(--p))) calc(28% * (1 - var(--p))) round
        calc(24px * (1 - var(--p)))
    );
  }

  .treatment-journey .tj-media-img {
    transform: scale(calc(0.9 + (0.1 * var(--p))));
  }

  .treatment-journey .tj-content {
    padding: var(--spacing-lg);
    gap: var(--spacing-2xl);
  }

  .treatment-journey .tj-copy {
    font-size: var(--font-size-3xl);
  }
}

/*-----------------------------------------------------------*/
/* THE SCIENCE BEHIND THE EXPERIENCE                          */
/*-----------------------------------------------------------*/
/**************-------------------------------------**************/
/*                        TREATMENT SCIENCE                      */
/**************-------------------------------------**************/
.treatment-science {
  --cards: 3;
  --science-scroll: 150svh;
  --ring-base: clamp(200px, 28vw, 420px);
  --ring-gap: clamp(78px, 8.5vw, 120px);
  --ring-color: 147, 121, 113;

  position: relative;
  background: var(--sandstone-100);
  height: calc(100svh + var(--cards) * var(--science-scroll));
  padding-block: var(--spacing-10xl);
}

.treatment-science .science-inner {
  position: sticky;
  top: 0;
  height: 100svh;
  isolation: isolate;
  background: var(--sandstone-100);
}

/* ---- ambient bloom + concentric ripple rings ---- */
.treatment-science .science-atmos {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.treatment-science .science-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  width: calc(var(--ring-base) + var(--i) * var(--ring-gap));
  aspect-ratio: 1;
  border: 1px solid rgba(var(--ring-color), calc(0.28 - var(--i) * 0.035));
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(1);
  animation: science-ring-breathe 9s ease-in-out infinite;
  animation-delay: calc(var(--i) * -1.4s);
  will-change: transform, opacity;
}

/* ---- sticky editorial heading ---- */
.treatment-science .science-heading {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  margin: 0;
  width: max-content;
  max-width: 600px;
  text-align: center;
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.2;
  color: var(--chasenut-500);
  font-size: var(--font-size-7xl);
}

/* ---- floating card layer ---- */
.treatment-science .science-cards {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-items: center;
  transform: translateY(4vh);
  pointer-events: none;
}

.treatment-science .science-card {
  grid-area: 1 / 1;
  width: min(92vw, clamp(460px, 38vw, 600px));
  pointer-events: auto;
  opacity: 0;
  visibility: hidden;
  border-radius: var(--rounded-2xl);
  background: var(--sandstone-200);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  will-change: transform, opacity, filter;
}

.treatment-science .science-card-inner {
  position: relative;
  padding: var(--spacing-lg);
}

.treatment-science .science-card-icon {
  position: absolute;
  top: 0;
  right: 0;
  width: 100px;
  height: 100px;
  color: var(--chasenut-300);

  opacity: 0.1;
}
.treatment-science .science-card-icon svg,
.treatment-science .science-card-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.treatment-science .science-card-title {
  margin-bottom: var(--spacing-sm);
  padding-right: clamp(44px, 5vw, 60px);
  font-family: var(--body-font);
  font-weight: 600;
  font-size: var(--font-size-3xl);
  color: var(--chasenut-500);
}

.treatment-science .science-card-lead {
  margin: 0;
  font-family: var(--body-font);
  color: var(--chasenut-300);
}

.treatment-science .science-card-block {
  margin-top: clamp(16px, 1.6vw, 22px);
  padding-top: clamp(14px, 1.4vw, 20px);
}

.treatment-science .science-card-block:first-of-type {
  border-top: 1px solid var(--chasenut-200);
}

.treatment-science .science-card-block h4 {
  margin: 0 0 0.5em;
  font-family: var(--body-font);
  font-weight: 600;
  font-size: var(--font-size-xl);
  color: var(--chasenut-500);
}

.treatment-science .science-card-block p {
  margin: 0;
  font-family: var(--body-font);
  color: var(--chasenut-300);
}

.treatment-science .science-card-cta {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--spacing-lg);
}

.treatment-science .science-card-cta .btn-single-arrow {
  color: var(--chasenut-500);
  border: 0;
  padding: 0;
}

.treatment-science .science-card-cta .btn-single-arrow .btn-arrow {
  height: 18px;
}

/* ---- bottom shade ---- */

@keyframes science-ring-breathe {
  0%,
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.55;
  }
  50% {
    transform: translate(-50%, -50%) scale(1.045);
    opacity: 1;
  }
}

@keyframes science-bloom-breathe {
  0%,
  100% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.5;
  }
  50% {
    transform: translate(-50%, -50%) scale(1.08);
    opacity: 0.8;
  }
}

@keyframes science-card-float {
  0%,
  100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-7px);
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .treatment-science {
    --science-scroll: 64svh;
  }

  .treatment-science .science-heading {
    max-width: 420px;
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 767px) {
  .treatment-science {
    --science-scroll: 56svh;
    --ring-base: clamp(160px, 46vw, 260px);
    --ring-gap: clamp(60px, 15vw, 96px);
  }
  .treatment-science .science-cards {
    transform: translateY(3vh);
  }
  .treatment-science .science-card {
    width: min(90vw, 420px);
  }
  .treatment-science .science-heading {
    max-width: 300px;
  }
}

@media screen and (max-width: 639px) {
  .treatment-science .science-inner {
    overflow: hidden;
  }
}

/* ---- accessibility ---- */
@media (prefers-reduced-motion: reduce) {
  .treatment-science {
    height: auto;
  }
  .treatment-science .science-inner {
    position: static;
    height: auto;
    overflow: visible;
    padding: 12vh 0;
  }
  .treatment-science .science-atmos {
    display: none;
  }
  .treatment-science .science-heading {
    position: static;
    transform: none;
    margin: 0 auto;
  }
  .treatment-science .science-cards {
    position: static;
    transform: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5vh;
    margin-top: 7vh;
  }
  .treatment-science .science-card {
    position: static;
  }
  .treatment-science .science-card,
  .treatment-science .science-card-inner {
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    visibility: visible !important;
    animation: none !important;
  }
}

/**************-------------------------------------**************/
/*                    RETURNING TO YOUR CENTER                   */
/**************-------------------------------------**************/
.return-center {
  --rc-ink: var(--chasenut-500);
  position: relative;
  background: var(--sandstone-100);
  height: 900svh;
}

.return-center .rc-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.return-center .rc-inner {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  isolation: isolate;
  background: var(--sandstone-100);
  display: flex;
  align-items: center;
  justify-content: center;
}

.return-center .rc-bg-img {
  position: absolute;
  z-index: 0;
  top: -400px;
  left: 0;
  width: 100%;
  height: calc(100svh + 400px);
  object-fit: cover;
  object-position: center bottom;
  pointer-events: none;
}

.return-center .rc-bg-img img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}
.return-center .rc-bg-shade {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  pointer-events: none;
}

.return-center .rc-frame {
  position: relative;
  z-index: 2;
  isolation: isolate;
  flex: none;
}
@media (orientation: landscape) {
  .return-center .rc-frame {
    aspect-ratio: 4 / 3;
    width: min(94vw, calc(94svh * 4 / 3));
    height: auto;
  }
}
@media (orientation: portrait) {
  .return-center .rc-frame {
    aspect-ratio: 3 / 4;
    height: min(94svh, calc(94vw * 4 / 3));
    width: auto;
  }
}

.return-center .rc-leaves {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
}

.return-center .rc-leaf {
  position: absolute;
  width: 152px;
  color: var(--rc-ink);
  opacity: 0;
  will-change: transform, opacity;
}
.return-center .rc-leaf svg {
  display: block;
  width: 100%;
  height: auto;
}

.return-center .rc-leaf--tr svg {
  transform: scaleX(-1);
}
.return-center .rc-leaf--bl svg {
  transform: scaleY(-1);
}
.return-center .rc-leaf--br svg {
  transform: scale(-1, -1);
}
.return-center .rc-leaf--tl {
  top: 0;
  left: 0;
}
.return-center .rc-leaf--tr {
  top: 0;
  right: 0;
}
.return-center .rc-leaf--bl {
  bottom: 0;
  left: 0;
}
.return-center .rc-leaf--br {
  bottom: 0;
  right: 0;
}

.return-center .rc-ring {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 49px;
  height: 49px;
  z-index: 2;
  color: var(--rc-ink);
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity;
}
.return-center .rc-ring svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* ---- centred text stack ---- */
.return-center .rc-stage {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-items: center;
  padding: 0 5vw;
  pointer-events: none;
}
.return-center .rc-stage > * {
  grid-area: 1 / 1;
  margin: 0;
  text-align: center;
  will-change: transform, opacity, filter;
}

.return-center .rc-heading {
  font-family: var(--heading-font);
  font-weight: 400;
  line-height: 1.08;
  color: var(--rc-ink);
  font-size: var(--font-size-7xl);
  max-width: var(--max-width-sm);
}
.return-center .rc-heading .rc-word {
  display: inline-block;
  will-change: transform, opacity, filter;
}

.return-center .rc-copy {
  display: flex;
  flex-direction: column;
  gap: 1.1em;
  max-width: 800px;
  opacity: 0;
  visibility: hidden;
}
.return-center .rc-copy p {
  margin: 0;
  font-family: var(--body-font);
  font-size: var(--font-size-xl);
  color: var(--chasenut-500);
}

.return-center .rc-message {
  max-width: 800px;
  font-weight: 400;
  font-size: var(--font-size-5xl);
  line-height: 1.28;
  color: var(--rc-ink);
  opacity: 0;
  visibility: hidden;
}

/* ---- feature grid ---- */
.return-center .rc-features {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  padding: 140px;
  pointer-events: none;
}

.return-center .rc-feature {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 0.55em;
  max-width: 300px;
  pointer-events: auto;
  opacity: 0;
  visibility: hidden;
  will-change: transform, opacity, filter;
}
.return-center .rc-feature--tl {
  align-self: start;
  justify-self: start;
}
.return-center .rc-feature--tr {
  align-self: start;
  justify-self: end;
}
.return-center .rc-feature--bl {
  align-self: end;
  justify-self: start;
}
.return-center .rc-feature--br {
  align-self: end;
  justify-self: end;
}

.return-center .rc-feature-head {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: var(--spacing-sm);
}
.return-center .rc-feature-icon {
  flex: none;
  width: 40px;
  height: 40px;
  color: var(--rc-ink);
}
.return-center .rc-feature-icon svg,
.return-center .rc-feature-icon img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.return-center .rc-feature-head h3 {
  margin: 0;
  font-weight: 400;
  font-size: var(--font-size-3xl);
  color: var(--rc-ink);
}
.return-center .rc-feature ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.35em;
}
.return-center .rc-feature li {
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  color: var(--chasenut-400);
}
.return-center .rc-feature li::before {
  content: "\274A\00A0";
  color: var(--chasenut-400);
  font-size: var(--font-size-md);
}

@keyframes rc-ring-pulse {
  0%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.05);
  }
}

@media screen and (max-width: 1679px) {
  .return-center .rc-leaf {
    width: 117px;
  }

  .return-center .rc-ring {
    width: 38px;
    height: 38px;
  }

  .return-center .rc-features {
    padding: 100px;
  }

  .return-center .rc-stage {
    padding: 0 3vw;
  }
}

/* ---- tablet / mobile ---- */
@media screen and (max-width: 1023px) {
  .return-center {
    height: 620svh;
  }

  .return-center .rc-leaf {
    width: 121px;
  }

  .return-center .rc-features {
    padding: 120px 60px;
  }

  .return-center .rc-feature {
    max-width: 260px;
  }
}

@media screen and (max-width: 767px) {
  .return-center {
    height: 560svh;
  }

  .return-center .rc-copy,
  .return-center .rc-message {
    max-width: 90%;
  }

  .return-center .rc-copy p {
    font-size: var(--font-size-md);
  }
  .return-center .rc-message {
    font-size: var(--font-size-xl);
  }

  .return-center .rc-leaf {
    width: 60px;
  }

  .return-center .rc-ring {
    width: 24px;
    height: 24px;
  }

  .return-center .rc-features {
    padding: 64px;
  }

  .return-center .rc-feature {
    max-width: 220px;
  }

  .return-center .rc-feature-icon {
    width: 28px;
    height: 28px;
  }

  .return-center .rc-feature-head h3 {
    font-size: var(--font-size-xl);
  }
}

@media screen and (max-width: 639px) {
  .return-center .rc-features {
    padding: 60px 0px 72px 0px;
    column-gap: 20px;
  }

  .return-center .rc-feature-icon {
    width: 16px;
    height: 16px;
  }

  .return-center .rc-feature {
    gap: 5px;
  }

  .return-center .rc-feature-head h3 {
    font-size: var(--font-size-lg);
  }

  .return-center .rc-feature li,
  .return-center .rc-feature li::before {
    font-size: var(--font-size-xs);
  }
}

/* ---- static fallback ---- */
.return-center.rc-static {
  height: auto;
}
.return-center.rc-static .rc-inner {
  position: static;
  display: block;
  height: auto;
  overflow: visible;
  padding: 14vh 6vw;
}
.return-center.rc-static .rc-frame {
  position: static;
  width: auto;
  height: auto;
}
.return-center.rc-static .rc-leaves,
.return-center.rc-static .rc-ring,
.return-center.rc-static .rc-bg-img,
.return-center.rc-static .rc-bg-shade,
.return-center.rc-static .rc-inner::before {
  display: none;
}
.return-center.rc-static .rc-stage {
  position: static;
  display: block;
}
.return-center.rc-static .rc-stage > * {
  margin: 0 auto 6vh;
}
.return-center.rc-static .rc-features {
  position: static;
  padding: 0;
  margin-top: 4vh;
  gap: 5vh 8vw;
}
.return-center.rc-static
  :is(.rc-heading, .rc-copy, .rc-message, .rc-features, .rc-feature) {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}
.return-center.rc-static
  :is(.rc-feature--tl, .rc-feature--tr, .rc-feature--bl, .rc-feature--br) {
  align-self: center;
  justify-self: center;
}

/**************-------------------------------------**************/
/*                           FACILITY HERO                       */
/**************-------------------------------------**************/

.facility-template {
  background-color: var(--sandstone-100);
}

.facility-hero .wrapper {
  max-width: var(--container-md);
}

.facility-hero .description {
  color: var(--evergreen-100);
}

/**************-------------------------------------**************/
/*                           FACILITY CTA                        */
/**************-------------------------------------**************/
.facility-cta .action-wrapper,
.home-cta .action-wrapper,
.about-cta .action-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-lg);
}

.facility-cta .cta-action,
.home-cta .cta-action,
.about-cta .cta-action {
  margin-top: 0;
}

/**************-------------------------------------**************/
/*                           CORE VALUES                         */
/**************-------------------------------------**************/
.core-values {
  color: var(--chasenut-500);
  padding-bottom: var(--spacing-8xl);
  text-align: center;
  position: relative;
  overflow: hidden;
  scroll-margin-top: var(--spacing-4xl);
}

.core-values .cv-inner {
  max-width: var(--container-lg);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.core-values .cv-heading {
  margin-inline: auto;
  font-weight: 400;
  font-size: calc(var(--font-size-7xl) * 0.83);
  line-height: 1.12;
  color: var(--chasenut-500);
  font-family: var(--body-font);
}

.core-values .cv-guide {
  margin-block: var(--spacing-lg) var(--spacing-2xl);
}

.core-values .cv-guide svg line,
.core-values .cv-guide svg path {
  stroke: var(--chasenut-300);
}

/* ---- STEP 3 & 4 ---- */
.core-values .cv-list {
  list-style: none;
  padding: 0;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: var(--spacing-xl);
}

.core-values .cv-item {
  flex: 1 1 0;
  max-width: 280px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  opacity: 0;
}

.core-values .cv-item--left {
  order: 1;
}
.core-values .cv-item--center {
  order: 2;
}
.core-values .cv-item--right {
  order: 3;
}

.core-values .cv-icon {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-ml);
  display: inline-flex;
}
.core-values .cv-icon img {
  width: clamp(40px, 5vw, 56px);
  height: auto;
}

.core-values .cv-item-title {
  font-weight: 400;
  font-size: var(--font-size-2xl);
  color: var(--chasenut-400);
  font-family: var(--body-font);
}

/* ---- static fallback ---- */
.core-values.is-static .cv-item,
.core-values .cv-item.is-shown {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .core-values .cv-item {
    opacity: 1;
  }
}

/* ---- responsive ---- */
@media screen and (max-width: 900px) {
  .core-values .cv-list {
  }
  .core-values .cv-item {
  }
}

@media screen and (max-width: 639px) {
  .core-values .cv-list {
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-2xl);
  }
  .core-values .cv-item--left,
  .core-values .cv-item--center,
  .core-values .cv-item--right {
    order: 0;
    max-width: 320px;
  }
}

/**************-------------------------------------**************/
/*                       EXPERIENCE CARDS                        */
/**************-------------------------------------**************/
.experience-cards {
  background-color: var(--sandstone-100);
}

.experience-cards .exp-track {
  position: relative;
}

.experience-cards .exp-slot {
  position: relative;
  width: 100%;
  height: min(100dvh, 900px);
}

.experience-cards .exp-slot:not(:last-child) {
  margin-bottom: var(--spacing-xl);
}

.experience-cards .exp-card {
  position: absolute;
  inset: 0;
  overflow: hidden;
  transform-origin: 50% 50%;
  backface-visibility: hidden;
}
.experience-cards.is-inview .exp-card {
  will-change: transform, opacity;
}

/* ---- media ---- */
.experience-cards .exp-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.experience-cards .exp-media picture,
.experience-cards .exp-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.experience-cards .exp-content {
  position: absolute;
  inset: 0;
  padding: var(--spacing-2xl);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.experience-cards .exp-top {
  align-self: flex-start;
  text-align: left;
  max-width: min(60%, 40ch);
}

.experience-cards .exp-heading {
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-7xl);
  color: var(--sandstone-400);
  line-height: 1.2;
}
.experience-cards .exp-text {
  align-self: flex-end;
  max-width: min(46ch, 56%);
  font-weight: 300;
  color: var(--sandstone-200);
  margin-bottom: var(--spacing-lg);
}

.experience-cards .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

@media screen and (max-width: 639px) {
  .experience-cards .exp-slot {
    height: min(80dvh, 620px);
  }
  .experience-cards .exp-content {
    justify-content: flex-end;
    gap: 1.25rem;
    padding-inline: var(--spacing-lg);
  }
  .experience-cards .exp-top {
    max-width: 100%;
  }
  .experience-cards .exp-text {
    align-self: flex-start;
    text-align: left;
    max-width: 100%;
  }
}

/* ---- accessible / no-GSAP fallback ---- */
.experience-cards.exp-static .exp-slot {
  position: static;
  height: auto;
  margin-bottom: clamp(2rem, 5vh, 4rem);
}
.experience-cards.exp-static .exp-card {
  position: relative;
  height: min(78vh, 620px);
}
@media (prefers-reduced-motion: reduce) {
  .experience-cards .exp-slot {
    position: static;
    height: auto;
    margin-bottom: clamp(2rem, 5vh, 4rem);
  }
  .experience-cards .exp-card {
    position: relative;
    height: min(78vh, 620px);
  }
  .experience-cards .exp-card.is-active .exp-media img,
  .experience-cards .exp-glow {
    animation: none;
  }
}

/**************-------------------------------------**************/
/*                   RITUAL COLLECTIONS TAB                      */
/**************-------------------------------------**************/
.ritual-collections-tab {
  padding-bottom: var(--spacing-8xl);
  scroll-margin-top: var(--spacing-2xl);
}

.ritual-collections-tab .rc-heading-wrapper {
  max-width: var(--container-lg);
  margin: 0 auto var(--spacing-2xl);
  text-align: center;
}
.ritual-collections-tab .rc-heading-wrapper .heading {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}
.ritual-collections-tab .rc-heading-wrapper .description {
  max-width: var(--container-sm);
  font-weight: 300;
  color: var(--chasenut-400);
  margin-inline: auto;
}

.ritual-collections-tab .tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xl);
}
.ritual-collections-tab .tab-list {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
.ritual-collections-tab .tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-sm) var(--spacing-ml);
  color: var(--chasenut-500);
  font-size: var(--font-size-md);
  white-space: nowrap;
  transition:
    color 0.3s ease,
    opacity 0.3s ease;
  opacity: 0.8;
}
.ritual-collections-tab .tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: var(--chasenut-400);
}
.ritual-collections-tab .tab:first-child::before {
  display: none;
}
.ritual-collections-tab .tab:hover,
.ritual-collections-tab .tab.active {
  color: var(--chasenut-500);
  opacity: 1;
}
.ritual-collections-tab .tab-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: 0.3s;
  will-change: transform;
}
.ritual-collections-tab .tab.active .tab-icon {
  transform: translateY(-2px) scale(1.08);
  transform-origin: bottom;
}
.ritual-collections-tab .tab-icon img,
.ritual-collections-tab .tab-icon svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.ritual-collections-tab .tab-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  width: 0;
  background: var(--chasenut-400);
  transform: translateX(0);
  transition:
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}
.ritual-collections-tab .tab-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: none;
  border: none;
  cursor: pointer;
  color: var(--sandstone-700);
  transition: color 0.3s ease;
}
.ritual-collections-tab .tab-arrow:hover {
  color: var(--chasenut-400);
}
.ritual-collections-tab .tab-arrow svg {
  width: 16px;
  height: 16px;
}

.ritual-collections-tab .panels {
  position: relative;
  display: grid;
}
.ritual-collections-tab .panel {
  grid-area: 1 / 1;
  min-width: 0;
}
.ritual-collections-tab .panel[hidden] {
  display: none;
}

/* ---- collection card ---- */
.ritual-collections-tab .ritual {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-sm);
  width: 100%;
  aspect-ratio: 1180 / 560;
  padding: var(--spacing-xl);
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: var(--sandstone-300);
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.ritual-collections-tab .ritual.dragging {
  cursor: grabbing;
  transition: none;
}
.ritual-collections-tab .ritual.expanded {
  cursor: default;
}

.ritual-collections-tab .ritual-media {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -20%;
  z-index: 0;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.ritual-collections-tab .ritual-media picture {
  display: block;
  width: 100%;
  height: 100%;
}
.ritual-collections-tab .ritual-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
}

.ritual-collections-tab .ritual.expanded .ritual-media {
  transform: translateX(calc(-20% / 1.2));
}

.ritual-collections-tab .ritual-intro {
  position: relative;
  z-index: 3;
  max-width: 48%;
}
.ritual-collections-tab .ritual-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-7xl);
  font-weight: 400;
  line-height: 1.1;
  color: var(--sandstone-400);
}
.ritual-collections-tab .ritual-wave {
  position: relative;
  z-index: 3;
  display: block;
  width: 50px;
  height: auto;
  margin-top: var(--spacing-sm);
  color: var(--sandstone-500);
}
.ritual-collections-tab .ritual-wave svg {
  width: 100%;
  height: auto;
}
.ritual-collections-tab .ritual-desc {
  position: relative;
  z-index: 3;
  max-width: 44%;
  font-size: var(--font-size-md);
  font-weight: 400;
  line-height: 1.4;
  color: var(--chasenut-100);
}
.ritual-collections-tab .ritual-experiences {
  position: relative;
  z-index: 3;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: var(--spacing-lg);
}
.ritual-collections-tab .ritual-experiences li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  color: var(--sandstone-300);
  font-weight: 400;
  font-size: var(--font-size-md);
}
.ritual-collections-tab .exp-icon {
  display: inline-flex;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.ritual-collections-tab .exp-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ritual-collections-tab .ritual-meta {
  position: absolute;
  z-index: 3;
  left: var(--spacing-xl);
  bottom: var(--spacing-xl);
  display: flex;
  align-items: stretch;
}
.ritual-collections-tab .meta-item {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  padding-inline: var(--spacing-ml);
}
.ritual-collections-tab .meta-item:first-child {
  padding-left: 0;
}
.ritual-collections-tab .meta-item + .meta-item {
  border-left: 1px solid rgba(242, 235, 222, 0.6);
}
.ritual-collections-tab .meta-item dt {
  font-size: var(--font-size-xl);
  color: var(--sandstone-300);
}
.ritual-collections-tab .meta-item dd {
  font-size: var(--font-size-3xl);
  font-weight: 600;
  line-height: 1.2;
  color: var(--sandstone-100);
}

.ritual-collections-tab .ritual-toggle {
  position: absolute;
  z-index: 4;
  bottom: var(--spacing-xl);
  right: var(--spacing-xl);
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  border: none;
  background: none;
  cursor: pointer;
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  font-weight: 500;
  transition:
    opacity 0.4s ease,
    color 0.3s ease;
}
.ritual-collections-tab .ritual-toggle:hover {
  color: var(--sandstone-200);
}
.ritual-collections-tab .ritual-toggle .chev {
  transition: transform 0.35s ease;
}
.ritual-collections-tab .ritual-toggle:hover .chev {
  transform: translateX(-4px);
}
.ritual-collections-tab .ritual.expanded .ritual-toggle {
  opacity: 0;
  pointer-events: none;
}

.ritual-collections-tab .chev {
  display: inline-flex;
  align-items: center;
  width: 12px;
  flex-shrink: 0;
}
.ritual-collections-tab .chev svg {
  width: 100%;
  height: auto;
}

/* ---- detail drawer ---- */
.ritual-collections-tab .ritual-detail {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50%;
  background: var(--sandstone-200);
  border-radius: var(--rounded-2xl);
  overflow: visible;
  opacity: 0;
  visibility: hidden;
  transform: translateX(30%);
  transition:
    opacity 1s ease,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 1.2s;
}
.ritual-collections-tab .ritual.expanded .ritual-detail {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition:
    opacity 0.6s,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.6s;
}
.ritual-collections-tab .ritual-detail-inner {
  position: relative;
  z-index: 1;
  height: 100%;
  overflow-y: auto;
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
}
.ritual-collections-tab .ritual.expanded .ritual-detail-inner > * {
  animation: ritual-rise 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.ritual-collections-tab .ritual.expanded .ritual-detail-inner > *:nth-child(1) {
  animation-delay: 0.18s;
}
.ritual-collections-tab .ritual.expanded .ritual-detail-inner > *:nth-child(2) {
  animation-delay: 0.26s;
}
.ritual-collections-tab .ritual.expanded .ritual-detail-inner > *:nth-child(3) {
  animation-delay: 0.34s;
}
.ritual-collections-tab .ritual.expanded .ritual-detail-inner > *:nth-child(4) {
  animation-delay: 0.42s;
}

.ritual-collections-tab .ritual-handle {
  position: absolute;
  z-index: 4;
  top: 70%;
  left: 0;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--chasenut-500);
  border-radius: var(--rounded-full);
  background: var(--sandstone-400);
  cursor: pointer;
  color: var(--chasenut-500);
  transition:
    background-color 0.3s ease,
    color 0.3s ease;
}
.ritual-collections-tab .ritual-handle:hover {
  background: var(--sandstone-500);
}
.ritual-collections-tab .ritual-handle .chev {
  width: 10px;
  transition: transform 0.3s ease;
}
.ritual-collections-tab .ritual-handle:hover .chev {
  transform: translateX(2px);
}
.ritual-collections-tab .ritual-handle .ritual-close {
  display: none;
  width: 10px;
}
.ritual-collections-tab .ritual-handle .ritual-close svg {
  display: block;
  width: 100%;
  height: auto;
}

.ritual-collections-tab .ritual-subhead {
  font-size: var(--font-size-xl);
  font-weight: 600;
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}

.ritual-collections-tab .combo-list {
  --combo-gap: var(--spacing-md);
  list-style: none;
  display: flex;
  gap: var(--combo-gap);
}
.ritual-collections-tab .combo-item {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  min-height: 90px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-sm);
  border: 1px solid rgba(111, 77, 66, 0.3);
  border-radius: var(--rounded-xl);
  text-align: center;
  font-size: var(--font-size-md);
  line-height: 1.25;
  color: var(--chasenut-500);
}
.ritual-collections-tab .combo-item span {
  display: block;
}
.ritual-collections-tab .combo-item + .combo-item::before {
  content: "+";
  position: absolute;
  top: 50%;
  left: calc(var(--combo-gap) / -2);
  transform: translate(-50%, -50%);
  font-size: var(--font-size-sm);
  line-height: 1;
  color: var(--chasenut-300);
}
.ritual-collections-tab .benefit-grid {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm) var(--spacing-ml);
}
.ritual-collections-tab .benefit-grid li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}
.ritual-collections-tab .tag-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.ritual-collections-tab .tag-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ritual-collections-tab .ritual-note {
  max-width: 540px;
  font-size: var(--font-size-md);
  line-height: 1.5;
  color: var(--chasenut-300);
}

.ritual-collections-tab .ritual-actions {
  display: flex;
  justify-content: center;
  margin-top: auto;
}
.ritual-collections-tab .ritual-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
}
.ritual-collections-tab .ritual-btn:hover {
  color: var(--chasenut-400);
}
.ritual-collections-tab .ritual-btn .chev {
  transition: transform 0.3s ease;
}
.ritual-collections-tab .ritual-btn:hover .chev-right {
  transform: translateX(3px);
}

@media screen and (max-width: 1279px) {
  .ritual-collections-tab .ritual {
    aspect-ratio: 1180 / 720;
  }
  .ritual-collections-tab .ritual-detail {
    width: 54%;
  }
  .ritual-collections-tab .ritual-detail-inner {
    padding: var(--spacing-lg);
  }
  .ritual-collections-tab .combo-list {
    --combo-gap: var(--spacing-ms);
  }
  .ritual-collections-tab .combo-item {
    font-size: var(--font-size-sm);
  }
}
@media screen and (max-width: 1023px) {
  .ritual-collections-tab .ritual {
    aspect-ratio: 1180 / 900;
    max-height: 640px;
  }
  .ritual-collections-tab .ritual-title {
    font-size: var(--font-size-6xl);
  }
  .ritual-collections-tab .ritual-intro,
  .ritual-collections-tab .ritual-desc {
    max-width: 56%;
  }
  .ritual-collections-tab .ritual-detail {
    width: 78%;
  }
  .ritual-collections-tab .ritual-subhead {
    font-size: var(--font-size-lg);
  }
  .ritual-collections-tab .meta-item dd {
    font-size: var(--font-size-2xl);
  }
}

@media screen and (max-width: 767px) {
  .ritual-collections-tab .tabs {
    gap: var(--spacing-lg);
  }
  .ritual-collections-tab .tab-arrow {
    display: inline-flex;
  }
  .ritual-collections-tab .tab-list {
    flex: 0 1 auto;
    position: relative;
    min-height: 2.2em;
    align-items: center;
    width: 170px;
  }
  .ritual-collections-tab .tab {
    position: absolute;
    inset: 0;
    margin: auto;
    width: max-content;
    height: max-content;
    justify-content: center;
    padding: var(--spacing-sm) 0;
    opacity: 0;
    visibility: hidden;
    filter: blur(3px);
    pointer-events: none;
    transition:
      opacity 0.5s ease,
      filter 0.5s ease;
  }
  .ritual-collections-tab .tab::before {
    display: none;
  }
  .ritual-collections-tab .tab.active {
    opacity: 1;
    visibility: visible;
    filter: blur(0px);
    pointer-events: auto;
  }
  .ritual-collections-tab .tab.active .tab-icon {
    transform: none;
  }
  .ritual-collections-tab .tab-underline {
    display: none;
  }
  .ritual-collections-tab .panels {
    touch-action: pan-y;
  }
  .ritual-collections-tab .ritual {
    aspect-ratio: 6 / 9;
    max-height: none;
    padding: var(--spacing-4xl) var(--spacing-lg) var(--spacing-xl);
  }
  .ritual-collections-tab .ritual-intro,
  .ritual-collections-tab .ritual-desc {
    max-width: 100%;
  }
  .ritual-collections-tab .ritual-title {
    font-size: var(--font-size-5xl);
  }

  .ritual-collections-tab .ritual-desc {
    font-size: var(--font-size-sm);
  }
  .ritual-collections-tab .ritual-meta {
    left: var(--spacing-lg);
    bottom: calc(var(--spacing-lg) + 44px);
  }
  .ritual-collections-tab .ritual-toggle {
    left: var(--spacing-lg);
    right: auto;
    bottom: var(--spacing-lg);
  }
  .ritual-collections-tab .ritual-detail {
    width: auto;
    inset: 0;
  }
  .ritual-collections-tab .ritual-detail-inner {
    padding: var(--spacing-xl) var(--spacing-ml) var(--spacing-ml);
    gap: var(--spacing-ml);
  }
  .ritual-collections-tab .ritual-handle {
    top: var(--spacing-md);
    left: auto;
    right: var(--spacing-md);
    transform: none;
    width: 28px;
    height: 28px;
  }
  .ritual-collections-tab .ritual-handle .chev {
    display: none;
  }
  .ritual-collections-tab .ritual-handle .ritual-close {
    display: inline-flex;
  }
  .ritual-collections-tab .combo-list {
    flex-wrap: wrap;
  }
  .ritual-collections-tab .combo-item {
    flex: 1 1 calc(50% - var(--combo-gap));
    min-height: 62px;
  }
  .ritual-collections-tab .combo-item:nth-child(odd)::before {
    display: none;
  }
}

@media screen and (max-width: 639px) {
  .ritual-collections-tab .benefit-grid li,
  .ritual-collections-tab .ritual-note {
    font-size: var(--font-size-sm);
  }
  .ritual-collections-tab .meta-item dt {
    font-size: var(--font-size-md);
  }
  .ritual-collections-tab .meta-item dd {
    font-size: var(--font-size-xl);
  }
}

/**************-------------------------------------**************/
/*                     WELLNESS JOURNEY                          */
/**************-------------------------------------**************/
.wellness-journey-tab {
}

.wellness-journey-tab .wj-head {
  max-width: var(--container-md);
  margin: 0 auto var(--spacing-xl);
  text-align: center;
}
.wellness-journey-tab .wj-head .heading {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}
.wellness-journey-tab .wj-head .description {
  font-weight: 300;
  color: var(--chasenut-400);
  margin-inline: auto;
}

/* ---- treatment tabs ---- */
.wellness-journey-tab .wj-tabs {
  display: flex;
  justify-content: center;
  margin-bottom: var(--spacing-xl);
}
.wellness-journey-tab .wj-tab-list {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
  flex-wrap: wrap;
}
.wellness-journey-tab .wj-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  padding: var(--spacing-sm) var(--spacing-ml);
  color: var(--chasenut-400);
  font-size: var(--font-size-md);
  white-space: nowrap;
  transition: color 0.3s ease;
}
.wellness-journey-tab .wj-tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 26px;
  background: var(--chasenut-300);
}
.wellness-journey-tab .wj-tab:first-child::before {
  display: none;
}
.wellness-journey-tab .wj-tab:hover,
.wellness-journey-tab .wj-tab.active {
  color: var(--chasenut-500);
}
.wellness-journey-tab .wj-tab-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.wellness-journey-tab .wj-tab.active .wj-tab-icon {
  transform: translateY(-2px) scale(1.08);
  transform-origin: bottom;
}
.wellness-journey-tab .wj-tab-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.wellness-journey-tab .wj-tab-count {
  font-size: 8px;
  color: var(--chasenut-500);
  align-self: flex-start;
  border-radius: var(--rounded-full);
  background-color: var(--chasenut-100);
  padding: 4px;
  margin-top: -10px;
  margin-left: -3px;
}
.wellness-journey-tab .wj-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 1px;
  width: 0;
  background: var(--chasenut-400);
  transition:
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
}

.wellness-journey-tab .wj-slider-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xl);
  color: var(--chasenut-500);
}
.wellness-journey-tab .wj-nav {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--chasenut-500);
  font-size: var(--font-size-md);
  transition: color 0.3s ease;
}
.wellness-journey-tab .wj-nav:hover {
  color: var(--chasenut-500);
}
.wellness-journey-tab .wj-nav:disabled {
  opacity: 0.4;
  cursor: default;
}
.wellness-journey-tab .wj-dchev {
  display: inline-flex;
  width: 18px;
}
.wellness-journey-tab .wj-dchev svg {
  width: 100%;
  height: auto;
}
.wellness-journey-tab .wj-nav-sep {
  width: 1px;
  height: 15px;
  background: var(--chasenut-300);
}

.wellness-journey-tab .wj-panels {
  display: grid;
}
.wellness-journey-tab .wj-panel {
  grid-area: 1 / 1;
  min-width: 0;
}
.wellness-journey-tab .wj-panel[hidden] {
  display: none;
}
.wellness-journey-tab .wj-viewport {
  position: relative;
}
.wellness-journey-tab .wj-track {
  display: grid;
}
.wellness-journey-tab .wj-card[hidden] {
  display: none;
}

/* ---- journey card ---- */
.wellness-journey-tab .wj-card {
  grid-area: 1 / 1;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-sm);
  width: 100%;
  aspect-ratio: 1180 / 600;
  padding: var(--spacing-xl);
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: #12241a;
}
.wellness-journey-tab .wj-card-media {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -20%;
  z-index: 0;
  margin-bottom: 0;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.wellness-journey-tab .wj-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wellness-journey-tab .wj-card.expanded .wj-card-media {
  transform: translateX(calc(-20% / 1.2));
}

.wellness-journey-tab .wj-card-lead {
  position: relative;
  z-index: 3;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
  max-width: 46%;
  height: 100%;
}
.wellness-journey-tab .wj-card-icon {
  width: 72px;
  margin-bottom: var(--spacing-sm);
}
.wellness-journey-tab .wj-card-icon img {
  width: 100%;
  height: auto;
}
.wellness-journey-tab .wj-card-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-7xl);
  font-weight: 400;
  line-height: 1.05;
  color: var(--sandstone-400);
}
.wellness-journey-tab .wj-card-desc {
  font-size: var(--font-size-md);
  font-weight: 300;
  line-height: 1.4;
  color: var(--chasenut-100);
}
.wellness-journey-tab .wj-card-wave {
  display: block;
  width: 50px;
  color: var(--sandstone-500);
}
.wellness-journey-tab .wj-card-wave svg {
  width: 100%;
  height: auto;
}
.wellness-journey-tab .wj-benefits {
  margin-top: auto;
}
.wellness-journey-tab .wj-benefits-title {
  font-size: var(--font-size-xl);
  font-weight: 500;
  color: var(--sandstone-400);
  margin-bottom: var(--spacing-sm);
}
.wellness-journey-tab .wj-benefits ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.wellness-journey-tab .wj-benefits li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  color: var(--sandstone-300);
}

.wellness-journey-tab .wj-glyph {
  display: inline-block;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.wellness-journey-tab .wj-glyph img {
}

.wellness-journey-tab .ritual-toggle {
  position: absolute;
  z-index: 4;
  bottom: var(--spacing-xl);
  right: var(--spacing-xl);
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  border: none;
  background: none;
  cursor: pointer;
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  font-weight: 500;
  transition:
    opacity 0.4s ease,
    color 0.3s ease;
}
.wellness-journey-tab .ritual-toggle:hover {
  color: var(--sandstone-200);
}
.wellness-journey-tab .ritual-toggle .chev {
  transition: transform 0.35s ease;
}
.wellness-journey-tab .ritual-toggle:hover .chev {
  transform: translateX(-4px);
}
.wellness-journey-tab .wj-card.expanded .ritual-toggle {
  opacity: 0;
  pointer-events: none;
}

.wellness-journey-tab .chev {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
}
.wellness-journey-tab .ritual-toggle .chev {
  width: 12px;
}
.wellness-journey-tab .ritual-handle .chev {
  width: 9px;
  transition: transform 0.3s ease;
}
.wellness-journey-tab .ritual-btn .chev {
  width: 11px;
}
.wellness-journey-tab .chev svg {
  width: 100%;
  height: auto;
}

/* ---- detail drawer ---- */
.wellness-journey-tab .wj-detail {
  position: absolute;
  z-index: 4;
  top: var(--spacing-ml);
  right: var(--spacing-ml);
  bottom: var(--spacing-ml);
  width: 46%;
  background: var(--sandstone-200);
  border-radius: var(--rounded-2xl);
  overflow: visible;
  opacity: 0;
  visibility: hidden;
  transform: translateX(30%);
  transition:
    opacity 1s ease,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 1.2s;
}
.wellness-journey-tab .wj-card.expanded .wj-detail {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
  transition:
    opacity 0.6s,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.6s;
}
.wellness-journey-tab .wj-detail-inner {
  height: 100%;
  overflow-y: auto;
  padding: var(--spacing-lg);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-md);
}
.wellness-journey-tab .wj-card.expanded .wj-detail-inner > * {
  animation: ritual-rise 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.wellness-journey-tab .wj-card.expanded .wj-detail-inner > *:nth-child(1) {
  animation-delay: 0.16s;
}
.wellness-journey-tab .wj-card.expanded .wj-detail-inner > *:nth-child(2) {
  animation-delay: 0.24s;
}
.wellness-journey-tab .wj-card.expanded .wj-detail-inner > *:nth-child(3) {
  animation-delay: 0.32s;
}
.wellness-journey-tab .wj-card.expanded .wj-detail-inner > *:nth-child(4) {
  animation-delay: 0.4s;
}
.wellness-journey-tab .wj-card.expanded .wj-detail-inner > *:nth-child(5) {
  animation-delay: 0.48s;
}

.wellness-journey-tab .ritual-handle {
  position: absolute;
  z-index: 4;
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 1px solid var(--chasenut-500);
  border-radius: var(--rounded-full);
  background: var(--sandstone-400);
  cursor: pointer;
  color: var(--chasenut-500);
  transition: background-color 0.3s ease;
}
.wellness-journey-tab .ritual-handle:hover {
  background: var(--sandstone-500);
}
.wellness-journey-tab .ritual-handle:hover .chev {
  transform: translateX(2px);
}

.wellness-journey-tab .wj-subhead {
  font-size: var(--font-size-3xl);
  font-weight: 600;
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-sm);
}
.wellness-journey-tab .wj-tags {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm) var(--spacing-md);
}
.wellness-journey-tab .wj-tags li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-sm);
  color: var(--chasenut-300);
}

.wellness-journey-tab .wj-sessions {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wellness-journey-tab .wj-sessions li {
  position: relative;
  padding-left: 26px;
  font-size: var(--font-size-xl);
  color: var(--chasenut-300);
  line-height: 1.3;
}
.wellness-journey-tab .wj-sessions li::before {
  content: "";
  position: absolute;
  left: 1px;
  top: 0.25em;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 5px solid var(--chasenut-500);
  background: var(--sandstone-200);
  z-index: 1;
}
.wellness-journey-tab .wj-sessions li:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 10px;
  top: 0.25em;
  width: 1px;
  height: calc(100% + 10px);
  background: var(--chasenut-300);
}
.wellness-journey-tab .wj-session-name {
  color: var(--chasenut-400);
  font-weight: 500;
}

.wellness-journey-tab .wj-stats {
  display: flex;
  align-items: center;
  padding-top: var(--spacing-lg);
  border-top: 1px solid var(--chasenut-200);
  margin-top: var(--spacing-sm);
}
.wellness-journey-tab .wj-stat {
  position: relative;
  flex: 1;
  text-align: center;
  font-size: var(--font-size-xl);
  font-weight: 600;
  color: var(--chasenut-400);
}
.wellness-journey-tab .wj-stat:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 3px;
  height: 1.4em;
  background: var(--chasenut-500);
}

.wellness-journey-tab .wj-actions {
  display: flex;
  justify-content: center;
  margin-top: auto;
}
.wellness-journey-tab .ritual-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-md);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
}
.wellness-journey-tab .ritual-btn .chev {
  transition: transform 0.3s ease;
}
.wellness-journey-tab .ritual-btn:hover .chev-left {
  transform: translateX(-3px);
}
.wellness-journey-tab .ritual-btn:hover .chev-right {
  transform: translateX(3px);
}
.wellness-journey-tab .ritual-btn:hover {
  color: var(--chasenut-400);
}

/* ---- responsive ---- */
@media screen and (max-width: 1279px) {
  .wellness-journey-tab .wj-card {
    aspect-ratio: 1180 / 720;
  }
  .wellness-journey-tab .wj-detail {
    width: 52%;
  }
}
@media screen and (max-width: 1023px) {
  .wellness-journey-tab .wj-card {
    aspect-ratio: 1180 / 900;
    max-height: 620px;
  }
  .wellness-journey-tab .wj-card-lead {
    max-width: 58%;
  }
  .wellness-journey-tab .wj-card-title {
    font-size: var(--font-size-6xl);
  }
  .wellness-journey-tab .wj-detail {
    width: 78%;
  }
  .wellness-journey-tab .wj-subhead {
    font-size: var(--font-size-md);
  }
}

/* ===== MOBILE ===== */
@media screen and (max-width: 767px) {
  .wellness-journey-tab .wj-tab-list {
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: auto;
    justify-content: flex-start;
    scrollbar-width: none;
  }
  .wellness-journey-tab .wj-tab-list::-webkit-scrollbar {
    display: none;
  }
  .wellness-journey-tab .wj-underline {
    display: none;
  }
  .wellness-journey-tab .wj-card {
    aspect-ratio: 3 / 5;
    padding: var(--spacing-lg);
  }
  .wellness-journey-tab .wj-card-lead {
    max-width: 82%;
  }
  .wellness-journey-tab .wj-card-title {
    font-size: var(--font-size-5xl);
  }
  .wellness-journey-tab .wj-detail {
    width: auto;
    inset: 0;
  }
  .wellness-journey-tab .wj-detail-inner {
    padding: var(--spacing-ml);
    gap: var(--spacing-lg);
  }
  .wellness-journey-tab .ritual-handle {
    top: var(--spacing-md);
    left: auto;
    right: var(--spacing-md);
    transform: none;
    width: 30px;
    height: 30px;
  }
  .wellness-journey-tab .wj-stats {
    font-size: var(--font-size-md);
  }

  .wellness-journey-tab .wj-benefits {
    margin-top: var(--spacing-lg);
  }

  .wellness-journey-tab .wj-card-icon {
    width: 40px;
  }

  .wellness-journey-tab .wj-benefits-title {
    font-size: var(--font-size-lg);
  }

  .wellness-journey-tab .wj-benefits li {
    font-size: var(--font-size-sm);
  }

  .wellness-journey-tab .wj-glyph {
    width: 12px;
    height: 12px;
  }

  .wellness-journey-tab .wj-tab-count {
    margin-top: -6px;
  }

  .wellness-journey-tab .wj-sessions li {
    font-size: var(--font-size-md);
  }

  .wellness-journey-tab .wj-sessions li::before {
    width: 14px;
    height: 14px;
    border: 3px solid var(--chasenut-500);
  }

  .wellness-journey-tab .wj-sessions li:not(:last-child)::after {
    left: 7px;
  }

  .wellness-journey-tab .wj-stat {
    font-size: var(--font-size-md);
  }

  .wellness-journey-tab .wj-stat:nth-child(2) {
    padding-inline: 8px;
  }

  .wellness-journey-tab .wj-stat:not(:last-child)::after {
    width: 1px;
  }
}

/**************-------------------------------------**************/
/*                  HOUSE WELLNESS JOURNEY                       */
/**************-------------------------------------**************/
.house-journey {
  scroll-margin-top: var(--spacing-2xl);
}

.house-journey .hj-heading-wrapper {
  max-width: var(--container-lg);
  margin: 0 auto var(--spacing-2xl);
  text-align: center;
}
.house-journey .hj-heading-wrapper .heading {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}
.house-journey .hj-heading-wrapper .description {
  max-width: var(--container-sm);
  margin-inline: auto;
  font-weight: 300;
  color: var(--chasenut-400);
}

/* ---- tabs ---- */
.house-journey .hj-tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xl);
}
.house-journey .hj-tab-list {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
.house-journey .hj-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding: var(--spacing-sm) var(--spacing-ml);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--chasenut-500);
  font-size: var(--font-size-md);
  white-space: nowrap;
  opacity: 0.8;
  transition:
    color 0.3s ease,
    opacity 0.3s ease;
}
.house-journey .hj-tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: var(--chasenut-400);
}

.house-journey .hj-tab.active,
.house-journey .hj-tab:hover {
  opacity: 1;
}
.house-journey .hj-tab:first-of-type::before {
  display: none;
}
.house-journey .hj-tab-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.house-journey .hj-tab.active .hj-tab-icon {
  transform: translateY(-2px) scale(1.08);
  transform-origin: bottom;
}
.house-journey .hj-tab-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.house-journey .hj-tab-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--chasenut-400);
  pointer-events: none;
  transition:
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
.house-journey .hj-tab-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: none;
  border: none;
  cursor: pointer;
}
.house-journey .hj-tab-arrow svg {
  width: 16px;
  height: 16px;
}

/* ---- panels ---- */
.house-journey .hj-panels {
  position: relative;
  display: grid;
}
.house-journey .hj-panel {
  grid-area: 1 / 1;
  min-width: 0;
}
.house-journey .hj-panel[hidden] {
  display: none;
}

/* ---- card ---- */
.house-journey .hj-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  aspect-ratio: 1180 / 600;
  padding: var(--spacing-xl);
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: var(--sandstone-300);
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.house-journey .hj-card.dragging {
  cursor: grabbing;
  transition: none;
}
.house-journey .hj-card.expanded {
  cursor: default;
}

.house-journey .hj-media {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -20%;
  z-index: 0;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.house-journey .hj-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(75, 32, 19, 0.55) 0%,
    rgba(75, 32, 19, 0.2) 45%,
    transparent 75%
  );
}
.house-journey .hj-media picture {
  display: block;
  width: 100%;
  height: 100%;
}
.house-journey .hj-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
}
.house-journey .hj-card.expanded .hj-media {
  transform: translateX(calc(-20% / 1.2));
}

.house-journey .hj-lead,
.house-journey .hj-benefits {
  position: relative;
  z-index: 3;
}
.house-journey .hj-lead {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-md);
  max-width: 38%;
}
.house-journey .hj-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  margin-bottom: var(--spacing-sm);
}
.house-journey .hj-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.house-journey .hj-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-7xl);
  font-weight: 400;
  line-height: 1.05;
  color: var(--sandstone-400);
}
.house-journey .hj-desc {
  font-size: var(--font-size-md);
  line-height: 1.4;
  color: var(--chasenut-100);
}
.house-journey .hj-wave {
  display: block;
  width: 50px;
  color: var(--sandstone-500);
}
.house-journey .hj-wave svg {
  width: 100%;
  height: auto;
}

.house-journey .hj-benefits {
  margin-top: auto;
}
.house-journey .hj-benefits-title {
  margin-bottom: var(--spacing-sm);
  font-size: var(--font-size-xl);
  font-weight: 500;
  color: var(--sandstone-300);
}
.house-journey .hj-benefits ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.house-journey .hj-benefits li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  color: var(--sandstone-300);
  font-size: var(--font-size-md);
  font-weight: 400;
}
.house-journey .hj-glyph {
  display: inline-flex;
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}
.house-journey .hj-glyph img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.house-journey .hj-chev {
  display: inline-flex;
  align-items: center;
  width: 12px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.house-journey .hj-chev svg {
  width: 100%;
  height: auto;
}

.house-journey .hj-toggle {
  position: absolute;
  z-index: 4;
  right: var(--spacing-xl);
  bottom: var(--spacing-xl);
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  font-weight: 500;
  transition:
    opacity 0.4s ease,
    color 0.3s ease;
}
.house-journey .hj-toggle:hover {
  color: var(--sandstone-200);
}
.house-journey .hj-toggle:hover .hj-chev {
  transform: translateX(-4px);
}
.house-journey .hj-card.expanded .hj-toggle {
  opacity: 0;
  pointer-events: none;
}

/* ---- detail drawer ---- */
.house-journey .hj-detail {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0;
  width: 55%;
  background: var(--sandstone-200);
  border-radius: var(--rounded-2xl);
  opacity: 0;
  visibility: hidden;
  transform: translateX(30%);
  transition:
    opacity 1s ease,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 1.2s;
}
.house-journey .hj-card.expanded .hj-detail {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition:
    opacity 0.6s,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.6s;
}
.house-journey .hj-detail-inner {
  height: 100%;
  overflow-y: auto;
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
}
@keyframes hj-rise {
  from {
    opacity: 0;
    filter: blur(8px);
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: none;
  }
}
.house-journey .hj-card.expanded .hj-detail-inner > * {
  animation: hj-rise 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.house-journey .hj-card.expanded .hj-detail-inner > :nth-child(1) {
  animation-delay: 0.18s;
}
.house-journey .hj-card.expanded .hj-detail-inner > :nth-child(2) {
  animation-delay: 0.26s;
}
.house-journey .hj-card.expanded .hj-detail-inner > :nth-child(3) {
  animation-delay: 0.34s;
}
.house-journey .hj-card.expanded .hj-detail-inner > :nth-child(4) {
  animation-delay: 0.42s;
}

.house-journey .hj-handle {
  position: absolute;
  z-index: 5;
  top: 70%;
  left: 0;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--chasenut-500);
  border-radius: var(--rounded-full);
  background: var(--sandstone-400);
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.house-journey .hj-handle:hover {
  background: var(--sandstone-500);
}
.house-journey .hj-handle .hj-chev {
  width: 10px;
}
.house-journey .hj-handle:hover .hj-chev {
  transform: translateX(2px);
}
.house-journey .hj-handle .hj-close {
  display: none;
  width: 10px;
}
.house-journey .hj-handle .hj-close svg {
  display: block;
  width: 100%;
  height: auto;
}

.house-journey .hj-subhead {
  margin-bottom: var(--spacing-md);
  font-size: var(--font-size-xl);
  font-weight: 600;
  color: var(--chasenut-500);
}

.house-journey .hj-outcomes {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm) var(--spacing-ml);
}
.house-journey .hj-outcomes li {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}

.house-journey .hj-phases {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-md);
  max-width: 480px;
}
.house-journey .hj-phase {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.house-journey .hj-phase-box {
  width: 100%;
  min-height: 100px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: var(--spacing-sm);
  border: 1px solid rgba(111, 77, 66, 0.3);
  border-radius: var(--rounded-xl);
  text-align: center;
}
.house-journey .hj-phase-name {
  font-size: var(--font-size-md);
  color: var(--chasenut-500);
  font-weight: 500;
}
.house-journey .hj-phase-desc {
  font-size: var(--font-size-xs);
  line-height: 1.25;
  color: var(--chasenut-300);
}
.house-journey .hj-phase-weeks {
  position: relative;
  margin-top: var(--spacing-lg);
  padding: var(--spacing-sm);
  border-radius: 4px;
  background: var(--chasenut-600);
  font-size: var(--font-size-xs);
  color: var(--sandstone-100);
  white-space: nowrap;
  line-height: 1;
}
.house-journey .hj-phase-weeks::before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  width: 1px;
  height: var(--spacing-lg);
  background: rgba(111, 77, 66, 0.4);
}

.house-journey .hj-included {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm) 0;
}
.house-journey .hj-included li {
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}
.house-journey .hj-included li:not(:last-child)::after {
  content: "/";
  margin-inline: var(--spacing-ml);
  color: var(--chasenut-500);
}

.house-journey .hj-summary {
  margin-top: var(--spacing-md);
  padding-top: var(--spacing-lg);
  border-top: 1px solid var(--chasenut-200);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
  margin-top: auto;
}
.house-journey .hj-stats {
  display: flex;
  align-items: center;
}
.house-journey .hj-stat {
  padding-inline: var(--spacing-ml);
  font-size: var(--font-size-3xl);
  font-weight: 600;
  line-height: 1.2;
  color: var(--chasenut-400);
}
.house-journey .hj-stat + .hj-stat {
  border-left: 3px solid var(--chasenut-500);
}
.house-journey .hj-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-sm) var(--spacing-lg);
  margin-top: auto;
}
.house-journey .hj-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
}
.house-journey .hj-btn:hover {
  color: var(--chasenut-400);
}
.house-journey .hj-btn:hover .hj-chev-right {
  transform: translateX(3px);
}

@media screen and (max-width: 1279px) {
  .house-journey .hj-card {
    aspect-ratio: 1180 / 780;
  }
  .house-journey .hj-detail {
    width: 58%;
  }
  .house-journey .hj-detail-inner {
    padding: var(--spacing-lg);
  }
}

@media screen and (max-width: 1023px) {
  .house-journey .hj-card {
    aspect-ratio: auto;
    min-height: 640px;
  }
  .house-journey .hj-title {
    font-size: var(--font-size-6xl);
  }
  .house-journey .hj-lead {
    max-width: 50%;
  }
  .house-journey .hj-detail {
    width: 78%;
  }
  .house-journey .hj-subhead {
    font-size: var(--font-size-lg);
  }
  .house-journey .hj-stat {
    font-size: var(--font-size-3xl);
  }
}

@media screen and (max-width: 767px) {
  .house-journey .hj-tabs {
    gap: var(--spacing-lg);
  }
  .house-journey .hj-tab-arrow {
    display: inline-flex;
  }
  .house-journey .hj-tab-list {
    flex: 0 1 auto;
    align-items: center;
    width: 170px;
    min-height: 2.2em;
  }
  .house-journey .hj-tab {
    position: absolute;
    inset: 0;
    margin: auto;
    width: max-content;
    height: max-content;
    justify-content: center;
    padding: var(--spacing-sm) 0;
    opacity: 0;
    visibility: hidden;
    filter: blur(3px);
    pointer-events: none;
    transition:
      opacity 0.5s ease,
      filter 0.5s ease;
  }
  .house-journey .hj-tab::before,
  .house-journey .hj-tab-underline {
    display: none;
  }
  .house-journey .hj-tab.active {
    opacity: 1;
    visibility: visible;
    filter: none;
    pointer-events: auto;
  }
  .house-journey .hj-tab.active .hj-tab-icon {
    transform: none;
  }

  .house-journey .hj-card {
    min-height: 0;
    aspect-ratio: 6 /9;
    padding: var(--spacing-lg);
  }
  .house-journey .hj-lead {
    max-width: 100%;
  }
  .house-journey .hj-title {
    font-size: var(--font-size-5xl);
  }
  .house-journey .hj-media::after {
    background: linear-gradient(
      180deg,
      rgba(75, 32, 19, 0.55) 0%,
      rgba(75, 32, 19, 0.15) 50%,
      rgba(75, 32, 19, 0.55) 100%
    );
  }
  .house-journey .hj-benefits {
    margin-bottom: 44px;
  }
  .house-journey .hj-toggle {
    left: var(--spacing-lg);
    right: auto;
    bottom: var(--spacing-lg);
  }

  .house-journey .hj-detail {
    inset: 0;
    width: auto;
  }
  .house-journey .hj-detail-inner {
    padding: var(--spacing-xl) var(--spacing-ml) var(--spacing-ml);
    gap: var(--spacing-ml);
  }
  .house-journey .hj-handle {
    top: var(--spacing-md);
    left: auto;
    right: var(--spacing-md);
    transform: none;
    width: 28px;
    height: 28px;
  }
  .house-journey .hj-handle .hj-chev {
    display: none;
  }
  .house-journey .hj-handle .hj-close {
    display: inline-flex;
  }
  .house-journey .hj-phases {
    --tether: 12px;
    gap: var(--spacing-sm);
  }
  .house-journey .hj-phase-box {
    min-height: 88px;
    padding: var(--spacing-xs);
  }
  .house-journey .hj-phase-name {
    font-size: var(--font-size-md);
  }
  .house-journey .hj-phase-desc {
    font-size: var(--font-size-xs);
  }
  .house-journey .hj-included li:not(:last-child)::after {
    margin-inline: var(--spacing-sm);
  }
}

@media screen and (max-width: 639px) {
  .house-journey .hj-outcomes li,
  .house-journey .hj-included li,
  .house-journey .hj-btn {
    font-size: var(--font-size-sm);
  }
  .house-journey .hj-stat {
    font-size: var(--font-size-2xl);
  }
}

/**************-------------------------------------**************/
/*                 HOUSE WELLNESS EXPERIENCE                     */
/**************-------------------------------------**************/
.house-experience {
  padding-bottom: var(--spacing-8xl);
  scroll-margin-top: var(--spacing-2xl);
}

.house-experience .hx-heading-wrapper {
  max-width: var(--container-lg);
  margin: 0 auto var(--spacing-2xl);
  text-align: center;
}
.house-experience .hx-heading-wrapper .heading {
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-md);
}
.house-experience .hx-heading-wrapper .description {
  margin-inline: auto;
  font-weight: 300;
  color: var(--chasenut-400);
  max-width: var(--container-sm);
}

/* ---- tabs ---- */
.house-experience .hx-tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-xl);
}
.house-experience .hx-tab-list {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
.house-experience .hx-tab {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding: var(--spacing-sm) var(--spacing-ml);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--chasenut-500);
  font-size: var(--font-size-md);
  white-space: nowrap;
  opacity: 0.8;
  transition:
    color 0.3s ease,
    opacity 0.3s ease;
}

.house-experience .hx-tab.active,
.house-experience .hx-tab:hover {
  opacity: 1;
}
.house-experience .hx-tab::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 30px;
  background: var(--chasenut-400);
}
.house-experience .hx-tab:first-of-type::before {
  display: none;
}
.house-experience .hx-tab-icon {
  display: inline-flex;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.house-experience .hx-tab.active .hx-tab-icon {
  transform: translateY(-2px) scale(1.08);
  transform-origin: bottom;
}
.house-experience .hx-tab-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.house-experience .hx-tab-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--chasenut-400);
  pointer-events: none;
  transition:
    transform 0.45s cubic-bezier(0.4, 0, 0.2, 1),
    width 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}
.house-experience .hx-tab-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: none;
  border: none;
  cursor: pointer;
}
.house-experience .hx-tab-arrow svg {
  width: 16px;
  height: 16px;
}

/* ---- panels ---- */
.house-experience .hx-panels {
  position: relative;
  display: grid;
}
.house-experience .hx-panel {
  grid-area: 1 / 1;
  min-width: 0;
}
.house-experience .hx-panel[hidden] {
  display: none;
}

/* ---- card ---- */
.house-experience .hx-card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  aspect-ratio: 1180 / 600;
  padding: var(--spacing-xl);
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  background: var(--sandstone-300);
  cursor: grab;
  user-select: none;
  touch-action: pan-y;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.house-experience .hx-card.dragging {
  cursor: grabbing;
  transition: none;
}
.house-experience .hx-card.expanded {
  cursor: default;
}

.house-experience .hx-media {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: -20%;
  z-index: 0;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.house-experience .hx-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(75, 32, 19, 0.6) 0%,
    rgba(75, 32, 19, 0.25) 45%,
    transparent 75%
  );
}
.house-experience .hx-media picture {
  display: block;
  width: 100%;
  height: 100%;
}
.house-experience .hx-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  -webkit-user-drag: none;
}
.house-experience .hx-card.expanded .hx-media {
  transform: translateX(calc(-20% / 1.2));
}

.house-experience .hx-lead,
.house-experience .hx-duration {
  position: relative;
  z-index: 3;
}
.house-experience .hx-lead {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-md);
  max-width: 40%;
}
.house-experience .hx-icon {
  display: inline-flex;
  width: 40px;
  height: 40px;
  margin-bottom: var(--spacing-sm);
}
.house-experience .hx-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.house-experience .hx-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-7xl);
  font-weight: 400;
  line-height: 1.05;
  color: var(--sandstone-400);
}
.house-experience .hx-desc {
  font-size: var(--font-size-md);
  line-height: 1.45;
  color: var(--chasenut-100);
}
.house-experience .hx-wave {
  display: block;
  width: 50px;
  color: var(--sandstone-500);
}
.house-experience .hx-wave svg {
  width: 100%;
  height: auto;
}

.house-experience .hx-duration {
  margin-top: auto;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}
.house-experience .hx-duration-label {
  font-size: var(--font-size-xl);
  color: var(--sandstone-300);
}
.house-experience .hx-duration-value {
  font-size: var(--font-size-3xl);
  font-weight: 600;
  line-height: 1.2;
  color: var(--sandstone-100);
}

.house-experience .hx-chev {
  display: inline-flex;
  align-items: center;
  width: 12px;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}
.house-experience .hx-chev svg {
  width: 100%;
  height: auto;
}

.house-experience .hx-toggle {
  position: absolute;
  z-index: 4;
  right: var(--spacing-xl);
  bottom: var(--spacing-xl);
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--sandstone-400);
  font-size: var(--font-size-lg);
  font-weight: 500;
  transition:
    opacity 0.4s ease,
    color 0.3s ease;
}
.house-experience .hx-toggle:hover {
  color: var(--sandstone-200);
}
.house-experience .hx-toggle:hover .hx-chev {
  transform: translateX(-4px);
}
.house-experience .hx-card.expanded .hx-toggle {
  opacity: 0;
  pointer-events: none;
}

/* ---- detail drawer ---- */
.house-experience .hx-detail {
  position: absolute;
  z-index: 4;
  top: 0;
  right: 0;
  bottom: 0;
  width: 55%;
  background: var(--sandstone-200);
  border-radius: var(--rounded-2xl);
  opacity: 0;
  visibility: hidden;
  transform: translateX(30%);
  transition:
    opacity 1s ease,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 1.2s;
}
.house-experience .hx-card.expanded .hx-detail {
  opacity: 1;
  visibility: visible;
  transform: none;
  transition:
    opacity 0.6s,
    transform 1.5s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0.6s;
}
.house-experience .hx-detail-inner {
  height: 100%;
  overflow-y: auto;
  padding: var(--spacing-xl) var(--spacing-xl) var(--spacing-lg);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-ml);
}
@keyframes hx-rise {
  from {
    opacity: 0;
    filter: blur(8px);
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    filter: blur(0);
    transform: none;
  }
}
.house-experience .hx-card.expanded .hx-detail-inner > * {
  animation: hx-rise 0.6s cubic-bezier(0.165, 0.84, 0.44, 1) both;
}
.house-experience .hx-card.expanded .hx-detail-inner > :nth-child(1) {
  animation-delay: 0.18s;
}
.house-experience .hx-card.expanded .hx-detail-inner > :nth-child(2) {
  animation-delay: 0.26s;
}
.house-experience .hx-card.expanded .hx-detail-inner > :nth-child(3) {
  animation-delay: 0.34s;
}
.house-experience .hx-card.expanded .hx-detail-inner > :nth-child(4) {
  animation-delay: 0.42s;
}

.house-experience .hx-handle {
  position: absolute;
  z-index: 5;
  top: 70%;
  left: 0;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 1px solid var(--chasenut-500);
  border-radius: var(--rounded-full);
  background: var(--sandstone-400);
  cursor: pointer;
  transition: background-color 0.3s ease;
}
.house-experience .hx-handle:hover {
  background: var(--sandstone-500);
}
.house-experience .hx-handle .hx-chev {
  width: 10px;
}
.house-experience .hx-handle:hover .hx-chev {
  transform: translateX(2px);
}
.house-experience .hx-handle .hx-close {
  display: none;
  width: 10px;
}
.house-experience .hx-handle .hx-close svg {
  display: block;
  width: 100%;
  height: auto;
}

.house-experience .hx-subhead {
  margin-bottom: var(--spacing-md);
  font-size: var(--font-size-xl);
  font-weight: 600;
  color: var(--chasenut-500);
}

.house-experience .hx-goal {
  max-width: 560px;
  font-size: var(--font-size-md);
  line-height: 1.4;
  color: var(--chasenut-300);
}

.house-experience .hx-timeline {
  --dot: 20px;
  --dot-gap: var(--spacing-sm);
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--dot-gap);
}
.house-experience .hx-timeline li {
  position: relative;
  padding-left: calc(var(--dot) + var(--spacing-sm));
  font-size: var(--font-size-md);
  line-height: var(--dot);
  color: var(--chasenut-300);
}
.house-experience .hx-timeline li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: var(--dot);
  height: var(--dot);
  box-sizing: border-box;
  border: 5px solid var(--chasenut-300);
  border-radius: var(--rounded-full);
  background: var(--sandstone-500);
}
.house-experience .hx-timeline li:first-child::before {
  border-color: var(--chasenut-500);
}
.house-experience .hx-timeline li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: var(--dot);
  bottom: calc(-1 * var(--dot-gap));
  left: calc(var(--dot) / 2 - 0.5px);
  border-left: 1px dotted var(--chasenut-300);
}
.house-experience .hx-timeline li:first-child::after {
  border-left: 1px solid var(--chasenut-500);
}
.house-experience .hx-week {
  font-weight: 600;
  color: var(--chasenut-400);
}

.house-experience .hx-group--included {
  margin-top: auto;
}
.house-experience .hx-included {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm) 0;
}
.house-experience .hx-included li {
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}
.house-experience .hx-included li:not(:last-child)::after {
  content: "/";
  margin-inline: var(--spacing-ml);
  color: var(--chasenut-500);
}

.house-experience .hx-summary {
  padding-top: var(--spacing-md);
  border-top: 1px solid rgba(111, 77, 66, 0.3);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-ml);
}
.house-experience .hx-stats {
  display: flex;
  align-items: center;
}
.house-experience .hx-stat {
  padding-inline: var(--spacing-ml);
  font-size: var(--font-size-3xl);
  font-weight: 600;
  line-height: 1.2;
  color: var(--chasenut-400);
}
.house-experience .hx-stat + .hx-stat {
  border-left: 2px solid var(--chasenut-500);
}
.house-experience .hx-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-sm) var(--spacing-lg);
}
.house-experience .hx-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
}
.house-experience .hx-btn:hover {
  color: var(--chasenut-400);
}
.house-experience .hx-btn:hover .hx-chev-right {
  transform: translateX(3px);
}

@media screen and (max-width: 1279px) {
  .house-experience .hx-card {
    aspect-ratio: 1180 / 760;
  }
  .house-experience .hx-detail {
    width: 58%;
  }
  .house-experience .hx-detail-inner {
    padding: var(--spacing-lg) var(--spacing-lg) var(--spacing-lg) 44px;
  }
}

@media screen and (max-width: 1023px) {
  .house-experience .hx-card {
    aspect-ratio: auto;
    min-height: 640px;
  }
  .house-experience .hx-title {
    font-size: var(--font-size-6xl);
  }
  .house-experience .hx-lead {
    max-width: 50%;
  }
  .house-experience .hx-detail {
    width: 78%;
  }
  .house-experience .hx-subhead {
    font-size: var(--font-size-lg);
  }
  .house-experience .hx-stat,
  .house-experience .hx-duration-value {
    font-size: var(--font-size-2xl);
  }
}

@media screen and (max-width: 767px) {
  .house-experience .hx-tabs {
    gap: var(--spacing-lg);
  }
  .house-experience .hx-tab-arrow {
    display: inline-flex;
  }
  .house-experience .hx-tab-list {
    flex: 0 1 auto;
    align-items: center;
    width: 190px;
    min-height: 2.2em;
  }
  .house-experience .hx-tab {
    position: absolute;
    inset: 0;
    margin: auto;
    width: max-content;
    height: max-content;
    justify-content: center;
    padding: var(--spacing-sm) 0;
    opacity: 0;
    visibility: hidden;
    filter: blur(3px);
    pointer-events: none;
    transition:
      opacity 0.5s ease,
      filter 0.5s ease;
  }
  .house-experience .hx-tab::before,
  .house-experience .hx-tab-underline {
    display: none;
  }
  .house-experience .hx-tab.active {
    opacity: 1;
    visibility: visible;
    filter: none;
    pointer-events: auto;
  }
  .house-experience .hx-tab.active .hx-tab-icon {
    transform: none;
  }

  .house-experience .hx-card {
    min-height: 0;
    aspect-ratio: 6 / 9;
    padding: var(--spacing-lg);
  }
  .house-experience .hx-lead {
    max-width: 100%;
  }
  .house-experience .hx-title {
    font-size: var(--font-size-5xl);
  }
  .house-experience .hx-media::after {
    background: linear-gradient(
      180deg,
      rgba(75, 32, 19, 0.6) 0%,
      rgba(75, 32, 19, 0.15) 50%,
      rgba(75, 32, 19, 0.6) 100%
    );
  }
  .house-experience .hx-duration {
    margin-bottom: 44px;
  }
  .house-experience .hx-toggle {
    left: var(--spacing-lg);
    right: auto;
    bottom: var(--spacing-lg);
  }

  .house-experience .hx-detail {
    inset: 0;
    width: auto;
  }
  .house-experience .hx-detail-inner {
    padding: var(--spacing-xl) var(--spacing-ml) var(--spacing-ml);
    gap: var(--spacing-ml);
  }
  .house-experience .hx-handle {
    top: var(--spacing-md);
    left: auto;
    right: var(--spacing-md);
    transform: none;
    width: 28px;
    height: 28px;
  }
  .house-experience .hx-handle .hx-chev {
    display: none;
  }
  .house-experience .hx-handle .hx-close {
    display: inline-flex;
  }
  .house-experience .hx-timeline {
    --dot: 14px;
  }
  .house-experience .hx-timeline li {
    line-height: 1.35;
  }
  .house-experience .hx-included li:not(:last-child)::after {
    margin-inline: var(--spacing-sm);
  }
}

@media screen and (max-width: 639px) {
  .house-experience .hx-goal,
  .house-experience .hx-timeline li,
  .house-experience .hx-included li,
  .house-experience .hx-btn {
    font-size: var(--font-size-sm);
  }
}

/**************-------------------------------------**************/
/*                     PACKAGES BACKGROUND IMAGE                 */
/**************-------------------------------------**************/
.packages-bg-image {
  position: relative;
}

.packages-bg-image .bg-image {
  position: absolute;
  inset: 200px 0 0 0;
  pointer-events: none;
  user-select: none;
  display: none;
}

.packages-bg-image .bg-image img {
  width: 100%;
  height: 100%;
}

/**************-------------------------------------**************/
/*                     TESTIMONIALS STATISTICS                   */
/**************-------------------------------------**************/

.testimonials-statistics {
}
.testimonials-statistics .stats-row {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: center;
}
.testimonials-statistics .stat {
  position: relative;
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-xs, 6px);
  padding-inline: var(--spacing-md);
  text-align: center;
}
.testimonials-statistics .stat:not(:last-child)::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 100px;
  background: var(--chasenut-400);
}
.testimonials-statistics .stat-value {
  font-family: var(--body-font);
  font-weight: 400;
  font-size: calc(var(--font-size-6xl) * 1.3);
  line-height: 1.2;
  color: var(--chasenut-500);
}

.testimonials-statistics .stat-value.odo {
  display: inline-flex;
  align-items: flex-end;
  line-height: 1;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.testimonials-statistics .odo-digit {
  display: inline-block;
  height: 1em;
  overflow: hidden;
}
.testimonials-statistics .odo-strip {
  display: block;
  transform: translateY(0);
  will-change: transform;
}
.testimonials-statistics .odo-strip > span {
  display: block;
  height: 1em;
  line-height: 1;
  text-align: center;
}
.testimonials-statistics .odo-sep {
  display: inline-block;
  line-height: 1;
}
.testimonials-statistics .stat-label {
  font-family: var(--body-font);
  font-weight: 400;
  font-size: var(--font-size-2xl);
  color: var(--chasenut-500);
  margin-top: var(--spacing-sm);
}

@media screen and (max-width: 1279px) {
  .testimonials-statistics .stat-value {
    font-size: calc(var(--font-size-6xl) * 1.2);
  }

  .testimonials-statistics .stat-label {
    font-size: var(--font-size-xl);
  }
}

@media screen and (max-width: 1023px) {
  .testimonials-statistics .stat-value {
    font-size: var(--font-size-6xl);
  }

  .testimonials-statistics .stat-label {
    font-size: var(--font-size-md);
  }

  .testimonials-statistics .stat:not(:last-child)::after {
    height: 64px;
  }
}

@media screen and (max-width: 639px) {
  .testimonials-statistics .stats-row {
    flex-wrap: wrap;
  }
  .testimonials-statistics .stat {
    flex: 0 0 50%;
    padding-block: var(--spacing-lg);
  }
  .testimonials-statistics .stat:not(:last-child)::after {
    display: none;
  }
  .testimonials-statistics .stat:nth-child(odd)::after {
    display: block;
  }

  .testimonials-statistics .stat-label {
    font-size: var(--font-size-sm);
  }
}

/**************-------------------------------------**************/
/* FEATURED GUEST STORIES */
/**************-------------------------------------**************/
.testimonials-video-carousel {
  overflow: hidden;
  position: relative;
}

.testimonials-video-carousel .bg-image {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: auto;
  width: 100%;
}

.testimonials-video-carousel .bg-image picture {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: bottom;
}
.testimonials-video-carousel .stories-head,
.testimonials-review .stories-head {
  display: grid;
  grid-template-columns: auto max-content;
  gap: var(--spacing-2xl);
  align-items: flex-end;
  margin-bottom: var(--spacing-2xl);
}

.testimonials-video-carousel .stories-intro,
.testimonials-review .stories-intro {
  max-width: var(--max-width-md);
}
.testimonials-video-carousel .stories-title,
.testimonials-review .stories-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-8xl);
  line-height: 1.1;
  color: var(--timber-600);
}
.testimonials-video-carousel .stories-desc {
  margin-top: var(--spacing-md);
  font-weight: 300;
  color: var(--chasenut-400);
}
.testimonials-video-carousel .stories-nav,
.testimonials-review .stories-nav {
  display: flex;
  gap: var(--spacing-md);
  flex-shrink: 0;
}
.testimonials-video-carousel .stories-arrow,
.testimonials-review .stories-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  border: 1px solid var(--chasenut-500);
  border-radius: var(--rounded-full);
  background: none;
  cursor: pointer;
  color: var(--chasenut-500);
  transition:
    background-color 0.3s ease,
    color 0.3s ease,
    opacity 0.3s ease;
}
.testimonials-video-carousel .stories-arrow svg,
.testimonials-review .stories-arrow svg {
  width: 30px;
  height: auto;
}
.testimonials-video-carousel .stories-arrow.next svg,
.testimonials-review .stories-arrow.next svg {
  transform: scaleX(-1);
}
.testimonials-video-carousel .stories-arrow:hover:not(:disabled),
.testimonials-review .stories-arrow:hover:not(:disabled) {
  background: var(--chasenut-500);
  color: var(--sandstone-100);
}
.testimonials-video-carousel .stories-arrow:disabled,
.testimonials-review .stories-arrow:disabled {
  opacity: 0.3;
  cursor: default;
}

.testimonials-video-carousel .stories-viewport {
  overflow: hidden;
}
.testimonials-video-carousel .stories-track {
  display: flex;
  gap: var(--spacing-lg);
  list-style: none;
  touch-action: pan-y;
  cursor: grab;
}
.testimonials-video-carousel .stories-track:active {
  cursor: grabbing;
}
.testimonials-video-carousel .story-card {
  position: relative;
  flex: 0 0 calc((100% - 2 * var(--spacing-lg)) / 3);
  aspect-ratio: 3 / 4.1;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  cursor: pointer;
}
.testimonials-video-carousel .stories-track.is-inview .story-card.js-fade {
  filter: none;
  will-change: auto;
}

.testimonials-video-carousel .story-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.testimonials-video-carousel .story-overlay {
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse at left bottom,
    rgba(0, 0, 0, 0.67) 0%,
    rgba(0, 0, 0, 0.55) 20%,
    rgba(0, 0, 0, 0.35) 45%,
    rgba(0, 0, 0, 0.1) 60%,
    transparent 100%
  );
  transition: opacity 0.4s ease;
  pointer-events: none;
}
.testimonials-video-carousel .story-play {
  position: absolute;
  top: var(--spacing-md);
  left: var(--spacing-md);
  z-index: 3;
  width: 46px;
  height: 46px;
  border: none;
  background: none;
  cursor: pointer;
  color: rgba(249, 245, 238, 0.9);
  transition:
    opacity 0.4s ease,
    transform 0.3s ease,
    color 0.3s ease;
}
.testimonials-video-carousel .story-play svg {
  display: block;
  width: 100%;
  height: 100%;
}
.testimonials-video-carousel .story-play:hover {
  transform: scale(1.06);
  color: #fff;
}
.testimonials-video-carousel .story-content {
  position: absolute;
  inset: auto 0 0 0;
  z-index: 2;
  padding: var(--spacing-lg) var(--spacing-md);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  color: var(--sandstone-400);
  transition: opacity 0.4s ease;
  max-width: 80%;
}
.testimonials-video-carousel .story-quote {
  font-size: var(--font-size-xl);
  line-height: 1.4;
  color: var(--sandstone-400);
}
.testimonials-video-carousel .story-tag {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  color: var(--chasenut-200);
  margin-block: var(--spacing-sm) var(--spacing-ms);
}
.testimonials-video-carousel .story-tag-icon {
  display: inline-flex;
  width: 24px;
  height: 24px;
  flex-shrink: 0;
}
.testimonials-video-carousel .story-tag-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.testimonials-video-carousel .story-name {
  font-family: var(--body-font);
  font-size: var(--font-size-2xl);
  font-weight: 500;
  color: var(--sandstone-400);
}

.testimonials-video-carousel .story-card.is-playing .story-content,
.testimonials-video-carousel .story-card.is-playing .story-play,
.testimonials-video-carousel .story-card.is-playing .story-overlay {
  opacity: 0;
  pointer-events: none;
}

@media screen and (max-width: 1279px) {
  .testimonials-video-carousel .stories-arrow,
  .testimonials-review .stories-arrow {
    width: 60px;
    height: 60px;
  }
  .testimonials-video-carousel .stories-arrow svg,
  .testimonials-review .stories-arrow svg {
    width: 24px;
    height: auto;
  }

  .testimonials-video-carousel .story-tag-icon {
    width: 16px;
    height: 16px;
  }
}

@media screen and (max-width: 1023px) {
  .testimonials-video-carousel .story-card {
    flex: 0 0 calc((100% - var(--spacing-lg)) / 2);
  }

  .testimonials-video-carousel .stories-arrow,
  .testimonials-review .stories-arrow {
    width: 56px;
    height: 56px;
  }
  .testimonials-video-carousel .stories-arrow svg,
  .testimonials-review .stories-arrow svg {
    width: 20px;
  }
}

@media screen and (max-width: 767px) {
  .testimonials-video-carousel .stories-head,
  .testimonials-review .stories-head {
    grid-template-columns: 1fr;
  }

  .testimonials-video-carousel .stories-head .stories-nav,
  .testimonials-review .stories-head .stories-nav {
    display: none;
  }
}

@media screen and (max-width: 639px) {
  .testimonials-video-carousel .stories-head,
  .testimonials-review .stories-head {
    flex-direction: column;
    align-items: flex-start;
    gap: var(--spacing-lg);
  }
  .testimonials-video-carousel .story-card {
    flex: 0 0 86%;
  }
  .testimonials-video-carousel .stories-arrow,
  .testimonials-review .stories-arrow {
    width: 48px;
    height: 48px;
  }
}

/**************-------------------------------------**************/
/*              Testimonials — Featured list                     */
/**************-------------------------------------**************/

.testimonials-featured-list {
  --ft-gap: var(--spacing-lg);
  padding-block: var(--spacing-10xl) var(--spacing-12xl);
  position: relative;
  overflow: hidden;
}

.testimonials-featured-list .bg-image {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
}

.testimonials-featured-list .bg-image picture,
.testimonials-featured-list .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  object-position: top;
}
.testimonials-featured-list .ft-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.testimonials-featured-list .ft-head {
  text-align: center;
  margin-bottom: var(--spacing-xl);
  max-width: var(--container-md);
  margin-inline: auto;
}
.testimonials-featured-list .ft-title {
  font-family: var(--heading-font);
  font-size: var(--font-size-8xl);
  color: var(--sandstone-500);
}

.testimonials-featured-list .ft-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-md);
  margin-bottom: var(--spacing-2xl);
}
.testimonials-featured-list .ft-filter {
  display: inline-flex;
  align-items: center;
  flex-shrink: 0;
  gap: var(--spacing-sm);
  padding: 0.6em 1.15em;
  border: 1px solid var(--sandstone-400);
  border-radius: var(--rounded-full, 999px);
  background: transparent;
  color: var(--sandstone-300);
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  transition:
    background 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease;
}
.testimonials-featured-list .ft-filter-icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask: var(--icon) center / contain no-repeat;
  mask: var(--icon) center / contain no-repeat;
}

.testimonials-featured-list .ft-filter-icon svg,
.testimonials-featured-list .ft-filter-icon path {
  stroke-width: 1px !important;
}
.testimonials-featured-list .ft-filter:hover {
  border-color: var(--sandstone-100);
}
.testimonials-featured-list .ft-filter.is-active {
  background: var(--sandstone-400);
  border-color: var(--sandstone-400);
  color: var(--chasenut-500);
}

.testimonials-featured-list .ft-viewport {
  container-type: inline-size;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -ms-overflow-style: none;
  cursor: grab;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}
.testimonials-featured-list .ft-viewport::-webkit-scrollbar {
  display: none;
}
.testimonials-featured-list .ft-viewport.is-dragging {
  cursor: grabbing;
  scroll-snap-type: none;
}

.testimonials-featured-list .ft-track {
  display: grid;
  grid-template-rows: repeat(2, 1fr);
  grid-auto-flow: column;
  grid-auto-columns: calc((100cqi - 2 * var(--ft-gap)) / 2);
  gap: var(--ft-gap);
  align-items: stretch;
  list-style: none;
  margin: 0;
  padding: 0;
}

.testimonials-featured-list .ft-card {
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  padding: var(--spacing-xl) var(--spacing-lg);
  background: var(--sandstone-200);
  border-radius: var(--rounded-2xl);
}
.testimonials-featured-list .ft-card[hidden] {
  display: none;
}
.testimonials-featured-list .ft-quote-open,
.testimonials-featured-list .ft-quote-close {
  width: 36px;
  height: auto;
  flex-shrink: 0;
  color: var(--chasenut-500);
}
.testimonials-featured-list .ft-quote-close {
  align-self: flex-end;
}
.testimonials-featured-list .ft-quote {
  margin: 0;
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  line-height: 1.4;
  color: var(--chasenut-500);
}
.testimonials-featured-list .ft-tags {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-top: var(--spacing-sm);
}
.testimonials-featured-list .ft-tag {
  display: inline-flex;
  align-items: flex-end;
  gap: var(--spacing-sm);
  font-size: var(--font-size-sm);
  color: var(--chasenut-500);
}
.testimonials-featured-list .ft-tag-icon {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  object-fit: contain;
}
.testimonials-featured-list .ft-person {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  margin-top: auto;
  padding-top: var(--spacing-md);
}
.testimonials-featured-list .ft-avatar {
  width: 40px;
  height: 40px;
  border-radius: var(--rounded-md);
  object-fit: cover;
  flex-shrink: 0;
}
.testimonials-featured-list .ft-name {
  font-family: var(--body-font);
  font-weight: 500;
  font-size: var(--font-size-xl);
  color: var(--chasenut-500);
}

@media (max-width: 1023px) {
  .testimonials-featured-list .ft-track {
    grid-auto-columns: calc((100cqi - var(--ft-gap)) / 2);
  }
}

@media (max-width: 639px) {
  .testimonials-featured-list .ft-track {
    grid-auto-columns: calc(100cqi - 44px);
  }

  .testimonials-featured-list .ft-filters {
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    padding-inline: 15px;
    gap: var(--spacing-sm);
  }
  .testimonials-featured-list .ft-filters::-webkit-scrollbar {
    display: none;
  }
  .testimonials-featured-list .ft-filter {
    scroll-snap-align: start;
    padding: 6px 10px;
    font-size: var(--font-size-sm);
  }

  .testimonials-featured-list .ft-filter-icon {
    width: 14px;
    height: 14px;
  }

  .testimonials-featured-list .ft-tag-icon {
    width: 16px;
    height: 16px;
  }

  .testimonials-featured-list .ft-tag {
    font-size: var(--font-size-sm);
  }

  .testimonials-featured-list .ft-name {
    font-size: var(--font-size-lg);
  }
}

/**************-------------------------------------**************/
/*              Testimonials — Google reviews                    */
/**************-------------------------------------**************/

.testimonials-review {
  position: relative;
  display: none;
}

.testimonials-review .stories-title {
  max-width: var(--container-md);
}
.testimonials-review .stories-nav {
  grid-column: 2;
}
.testimonials-review .stories-nav[hidden] {
  display: none;
}

/* ---- layout ---- */
.testimonials-review .ti-widget.ti-goog .ti-widget-container {
  align-items: center !important;
  margin-bottom: 0;
}
.testimonials-review .ti-widget.ti-goog .ti-reviews-container {
  order: 1;
}
.testimonials-review .ti-widget.ti-goog .ti-footer {
  order: 2;
  margin-top: 0 !important;
}

.testimonials-review .ti-widget.ti-goog .ti-reviews-container-wrapper {
  margin: 0 -8px !important;
}

.testimonials-review .ti-widget.ti-goog .ti-controls,
.testimonials-review .ti-widget.ti-goog .ti-controls-line {
  display: none !important;
}

/* ---- card ---- */
.testimonials-review .ti-widget.ti-goog .ti-review-item > .ti-inner {
  height: 100%;
  background-color: transparent !important;
  border-width: 1px !important;
  border-color: var(--sandstone-400) !important;
  border-radius: var(--rounded-lg) !important;
  padding: var(--spacing-ml) var(--spacing-md) !important;
}
.testimonials-review .ti-widget.ti-goog .ti-platform-icon {
  display: none !important;
}
.testimonials-review .ti-widget.ti-goog .ti-profile-img {
  margin: 0 var(--spacing-sm) 0 0 !important;
}
.testimonials-review .ti-widget.ti-goog .ti-profile-img img {
  width: 28px !important;
  height: 28px !important;
}
.testimonials-review .ti-widget.ti-goog .ti-widget-container .ti-name {
  padding-right: 0;
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--chasenut-500);
}
.testimonials-review .ti-widget.ti-goog .ti-widget-container .ti-date {
  font-size: 12px;
  color: var(--chasenut-200);
}

.testimonials-review .ti-widget.ti-goog .ti-stars .ti-star {
  background-image: none !important;
  background-color: var(--evergreen-300) !important;
  -webkit-mask: url("https://cdn.trustindex.io/assets/platform/Trustindex/star/s.svg")
    center / contain no-repeat;
  mask: url("https://cdn.trustindex.io/assets/platform/Trustindex/star/s.svg")
    center / contain no-repeat;
}
.testimonials-review .ti-widget.ti-goog .ti-stars .ti-star.e {
  background-color: var(--sandstone-400) !important;
}
.testimonials-review .ti-widget.ti-goog .ti-stars .ti-star.h {
  background: linear-gradient(
    90deg,
    var(--evergreen-300) 50%,
    var(--sandstone-400) 50%
  ) !important;
}
.testimonials-review .ti-widget.ti-goog .ti-review-item .ti-stars .ti-star {
  width: 18px !important;
  height: 18px !important;
  margin-right: 2px !important;
}
.testimonials-review
  .ti-widget.ti-goog
  .ti-reviews-container-wrapper
  .ti-inner
  > .ti-stars {
  margin-top: var(--spacing-sm);
  margin-bottom: var(--spacing-md);
}

.testimonials-review .ti-widget.ti-goog .ti-stars .ti-verified-review {
  width: 16px;
  height: 16px;
  background: url("https://cdn.trustindex.io/assets/icon/ti-verified.svg")
    center / contain no-repeat;
}

.testimonials-review .ti-widget.ti-goog .ti-review-content {
  font-size: 14px;
  line-height: 22px;
  height: 132px !important;
  -webkit-line-clamp: 6;
  color: var(--chasenut-400);
}
.testimonials-review .ti-widget.ti-goog .ti-read-more span {
  font-size: 13px;
  color: var(--chasenut-500);
  opacity: 0.7;
}
.testimonials-review .ti-widget.ti-goog .ti-read-more span:hover {
  opacity: 1;
}
.testimonials-review .ti-widget.ti-goog .ti-read-more::after {
  display: none;
}

/* ---- rating panel ---- */
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-fade-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  row-gap: var(--spacing-sm) !important;
  column-gap: 8px !important;
}

.testimonials-review
  .ti-widget.ti-goog
  .ti-footer
  .ti-rating-text:has(.ti-rating-large),
.testimonials-review.has-score .ti-widget.ti-goog .ti-footer .ti-rating-text {
  display: none;
}

.testimonials-review .ti-widget.ti-goog .ti-footer .ti-large-logo {
  order: 1;
  flex-basis: 100%;
  justify-content: center;
  margin-bottom: var(--spacing-sm) !important;
}

.testimonials-review .ti-widget.ti-goog .ti-footer .ti-large-logo .ti-v-center {
  flex: 0 0 auto;
  width: 140px;
  aspect-ratio: 255.2 / 80.3;
  background-color: var(--evergreen-500);
  -webkit-mask: url("https://cdn.trustindex.io/assets/platform/Google/logo.svg")
    center / contain no-repeat;
  mask: url("https://cdn.trustindex.io/assets/platform/Google/logo.svg")
    center / contain no-repeat;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-large-logo img {
  opacity: 0;
}

.testimonials-review .ti-widget.ti-goog .ti-footer .reviews-score {
  order: 2;
  font-size: var(--font-size-md) !important;
  line-height: 1 !important;
  color: var(--chasenut-400) !important;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-stars {
  order: 3;
  margin: 0;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-stars .ti-star {
  width: 18px !important;
  height: 18px !important;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-rating-text {
  order: 4;
  flex-basis: 100%;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-rating-text,
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-rating-text span,
.testimonials-review .ti-widget.ti-goog .ti-footer .ti-rating-text strong {
  color: var(--chasenut-400);
}
.testimonials-review .ti-widget.ti-goog .ti-footer .reviews-all {
  order: 5;
  flex-basis: 100%;
  margin-top: 4px;
  font-size: var(--font-size-sm) !important;
  color: var(--chasenut-400) !important;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .reviews-all span {
  font-size: inherit !important;
  color: var(--chasenut-500) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.testimonials-review .ti-widget.ti-goog .ti-footer .reviews-all:hover span {
  text-decoration-thickness: 2px;
}

/**************-------------------------------------**************/
/*                          HOME INTRO                           */
/**************-------------------------------------**************/
.home-intro {
  position: relative;
  overflow: hidden;
  padding-block: var(--spacing-8xl) var(--spacing-lg);
  background-color: var(--chasenut-500);
  color: var(--sandstone-500);
  text-align: center;
}

.home-intro .bg-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
}
.home-intro .bg-video video {
  width: 100%;
  height: 100%;
  object-fit: fill;
}
.home-intro .hi-shade {
  position: absolute;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
.home-intro .hi-shade img {
  display: block;
  width: 100%;
  height: auto;
}
.home-intro .hi-shade--top {
  top: 0;
}
.home-intro .hi-shade--bottom {
  bottom: 0;
}
.home-intro .container {
  position: relative;
  z-index: 2;
}
.home-intro .hi-sprite {
  position: absolute;
  width: 0;
  height: 0;
}

/* ---- WELCOME ---- */
.home-intro .hi-welcome {
  max-width: var(--container-lg);
  margin-inline: auto;
}
.home-intro .hi-welcome-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 400;
  color: var(--sandstone-500);
  font-size: var(--font-size-9xl);
  line-height: 1.3;
}
.home-intro .hi-welcome-eyebrow {
  display: block;
  font-size: var(--font-size-7xl);
  font-weight: 400;
}
.home-intro .hi-welcome-title em {
  font-style: italic;
  font-weight: 400;
}
.home-intro .hi-welcome-desc {
  max-width: var(--container-sm);
  margin: var(--spacing-sm) auto 0;
  color: var(--sandtone-100);
  font-size: var(--font-size-md);
  font-weight: 300;
}

/* ---- AWARD BADGES ---- */
.home-intro .hi-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-xl);
  margin: var(--spacing-xl) auto 0;
  padding: 0;
  list-style: none;
}
.home-intro .hi-badge {
  width: 120px;
}

/* ---- STATES ---- */
.home-intro .hi-states {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: end;
  gap: var(--spacing-2xl);
  margin-top: var(--spacing-8xl);
  text-align: left;
}
.home-intro .hi-states-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 500;
  color: var(--sandstone-500);
  font-size: calc(var(--font-size-6xl) * 1.3);
  line-height: 1.1;
  max-width: 800px;
}
.home-intro .hi-states-desc {
  margin: 0;
  justify-self: end;
  color: var(--sandstone-100);
  font-size: var(--font-size-md);
  font-weight: 300;
  text-align: right;
  max-width: 360px;
}

.home-intro .hi-pillars {
  --hi-wave-h: clamp(80px, 8vw, 140px);
  position: relative;
  margin-top: var(--spacing-6xl);
}
.home-intro .hi-wave {
  position: relative;
  height: var(--hi-wave-h);
}
.home-intro .hi-wave-line {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.home-intro .hi-wave-line--v {
  display: none;
}
.home-intro .hi-wave-icons {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: var(--hi-wave-h);
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-items: center;
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-intro .hi-pillar-glyph {
  justify-self: center;
  width: 38px;
  height: 38px;
  color: var(--sandstone-500);
}
.home-intro .hi-pillar-glyph svg,
.home-intro .hi-pillar-glyph img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.home-intro .hi-pillar-list {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: var(--spacing-3xl) 0 0;
  padding: 0;
  list-style: none;
}
.home-intro .hi-pillar {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  text-align: center;
  padding-inline: clamp(6px, 1.4vw, 18px);
}
.home-intro .hi-pillar-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 500;
  color: var(--sandstone-500);
  font-size: var(--font-size-5xl);
  line-height: 1.1;
}
.home-intro .hi-pillar-tags {
  margin: 0;
  color: var(--sandstone-100);
  font-size: var(--font-size-md);
  font-weight: 300;
}

.home-intro .hi-pillar-glyph,
.home-intro .hi-pillar-title,
.home-intro .hi-pillar-tags {
  opacity: 0;
}
.home-intro.hi-shown .hi-pillar-glyph,
.home-intro.hi-shown .hi-pillar-title,
.home-intro.hi-shown .hi-pillar-tags {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .home-intro .hi-pillar-glyph,
  .home-intro .hi-pillar-title,
  .home-intro .hi-pillar-tags {
    opacity: 1;
  }
}

@media screen and (max-width: 1279px) {
  .home-intro .hi-pillar-title {
    font-size: var(--font-size-3xl);
  }

  .home-intro .hi-pillar-tags {
    font-size: var(--font-size-sm);
  }
}

@media screen and (max-width: 1023px) {
  .home-intro .hi-welcome {
    max-width: 100%;
  }

  .home-intro .hi-badge {
    width: 100px;
  }

  .home-intro .hi-states {
    grid-template-columns: 1fr;
    align-items: start;
    gap: clamp(16px, 3vh, 28px);
  }
  .home-intro .hi-states-title {
    max-width: 80%;
  }
  .home-intro .hi-states-desc {
    max-width: 40%;
    margin-top: var(--spacing-xl);
  }

  .home-intro .hi-shade img {
    height: 700px;
  }
}

@media screen and (max-width: 767px) {
  .home-intro .hi-states {
    max-width: var(--container-sm);
  }
  .home-intro .hi-pillars {
    position: relative;
  }
  .home-intro .hi-wave {
    position: absolute;
    inset: 0 auto 0 0;
    height: auto;
    width: clamp(58px, 16vw, 92px);
  }

  .home-intro .hi-wave-line--h {
    display: none;
  }
  .home-intro .hi-wave-line--v {
    display: block;
  }
  .home-intro .hi-wave-icons {
    inset: 0 auto 0 0;
    height: auto;
    width: clamp(58px, 16vw, 92px);
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, 1fr);
    justify-items: center;
  }

  .home-intro .hi-pillar-glyph {
    width: 20px;
    height: 20px;
  }
  .home-intro .hi-pillar-list {
    grid-template-columns: 1fr;
    grid-template-rows: repeat(4, 1fr);
    margin-left: clamp(58px, 16vw, 92px);
    padding-left: clamp(14px, 4vw, 26px);
    gap: var(--spacing-4xl);
    padding-block: var(--spacing-xl);
  }
  .home-intro .hi-pillar {
    justify-content: center;
    text-align: left;
    padding-inline: 0;
  }
  .home-intro .hi-pillar-title {
    font-size: clamp(26px, 6vw, 40px);
    font-size: var(--font-size-3xl);
  }
  .home-intro .hi-pillar-tags {
    font-size: clamp(12px, 3.4vw, 15px);
  }
}

/* ---- MOBILE ---- */
@media screen and (max-width: 639px) {
  .home-intro .hi-badges {
  }

  .home-intro .bg-video {
    /* bottom: 20%; */
  }

  .home-intro .hi-badge {
    width: 64px;
  }
  .home-intro .hi-states-title {
    max-width: 100%;
  }
  .home-intro .hi-states-desc {
    max-width: 100%;
    text-align: left;
    margin-top: 0;
  }

  .home-intro .hi-pillar-title {
    font-size: var(--font-size-2xl);
  }

  .home-intro .hi-shade img {
    height: auto;
  }
}

/*============================================================
  HOME CIRCLE TAGS
============================================================*/
.home-circle-tags {
  position: relative;
  overflow: hidden;
  padding-block: var(--spacing-8xl) 900px;
  background-color: var(--sandstone-100);
  color: var(--chasenut-500);
}
.home-circle-tags .hc-bg-image {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.home-circle-tags .hc-bg-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
}
.home-circle-tags .hc-shade {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
.home-circle-tags .hc-shade img {
  display: block;
  width: 100%;
  height: auto;
}
.home-circle-tags .container {
  position: relative;
  z-index: 2;
}

.home-circle-tags .top-statement,
.home-circle-tags .bottom-statement {
  margin-inline: auto;
  text-align: center;
  font-family: var(--body-font);
  text-wrap: balance;
}
.home-circle-tags .top-statement {
  max-width: var(--container-md);
  margin-bottom: var(--spacing-10xl);
  font-size: var(--font-size-5xl);
  color: var(--sandstone-500);
}
.home-circle-tags .bottom-statement {
  max-width: var(--container-lg);
  margin-top: var(--spacing-8xl);
  font-size: calc(var(--font-size-6xl) * 1.3);
  font-weight: 400;
  line-height: 1.25;
  color: var(--chasenut-500);
}

/* ---- the circle ---- */
.home-circle-tags .circle-tags-wrapper {
  display: flex;
  justify-content: center;
}
.home-circle-tags .circle-tags {
  position: relative;
  width: min(100%, 720px);
  aspect-ratio: 1;
}
.home-circle-tags .ct-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.home-circle-tags .ct-ring circle {
  fill: none;
  stroke: var(--chasenut-200);
  stroke-width: 1;
}

.home-circle-tags .ct-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(70%, 460px);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-sm);
  text-align: center;
}
.home-circle-tags .ct-glyph {
  width: 64px;
  color: var(--chasenut-500);
  margin-bottom: var(--spacing-ml);
}
.home-circle-tags .ct-glyph svg {
  width: 100%;
  height: auto;
  display: block;
}
.home-circle-tags .ct-heading {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 500;
  font-size: var(--font-size-6xl);
  line-height: 1.12;
  color: var(--chasenut-500);
}
.home-circle-tags .ct-desc {
  margin: 0;
  max-width: 400px;
  font-size: var(--font-size-md);
  line-height: 1.6;
  color: var(--chasenut-300);
}

.home-circle-tags .ct-nodes {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}
.home-circle-tags .ct-node {
  position: absolute;
  left: var(--x);
  top: var(--y);
  transform: translate(-50%, -50%);
  width: 28px;
  height: 28px;
}
.home-circle-tags .ct-dot {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 6px solid var(--chasenut-500);
  background: var(--sandstone-200);
  animation: ct-pulse 6s ease-in-out infinite;
  animation-delay: calc(var(--i) * 1s);
  will-change: transform;
}
@keyframes ct-pulse {
  0% {
    transform: scale(1);
  }
  6% {
    transform: scale(1.25);
  }
  13% {
    transform: scale(1);
  }
  100% {
    transform: scale(1);
  }
}
.home-circle-tags .ct-label {
  position: absolute;
  left: 50%;
  top: calc(100% + clamp(6px, 1vw, 14px));
  transform: translateX(-50%);
  white-space: nowrap;
  font-size: var(--font-size-3xl);
  color: var(--chasenut-400);
}
.home-circle-tags .ct-node--top .ct-label {
  top: auto;
  bottom: calc(100% + clamp(8px, 1vw, 14px));
}

@media screen and (max-width: 1279px) {
  .home-circle-tags {
    padding-bottom: 800px;
  }
}

/* ---- responsive ---- */
@media screen and (max-width: 1023px) {
  .home-circle-tags {
    padding-bottom: 700px;
  }

  .home-circle-tags .top-statement,
  .home-circle-tags .bottom-statement {
    max-width: 100%;
  }

  .home-circle-tags .ct-node {
    width: 24px;
    height: 24px;
  }

  .home-circle-tags .ct-dot {
    border-width: 5px;
  }

  .home-circle-tags .circle-tags {
    width: 84%;
  }
}
@media screen and (max-width: 639px) {
  .home-circle-tags {
    padding-bottom: 460px;
  }

  .home-circle-tags .circle-tags {
    width: 85%;
  }

  .home-circle-tags .top-statement {
    font-size: var(--font-size-lg);
    max-width: var(--container-sm);
  }

  .home-circle-tags .bottom-statement {
    font-size: var(--font-size-2xl);
  }

  .home-circle-tags .ct-node {
    width: 14px;
    height: 14px;
  }

  .home-circle-tags .ct-dot {
    border-width: 3px;
  }

  .home-circle-tags .ct-label {
    font-size: var(--font-size-sm);
  }

  .home-circle-tags .ct-glyph {
    width: 32px;
    margin-bottom: var(--spacing-sm);
  }

  .home-circle-tags .ct-heading {
    font-size: var(--font-size-xl);
  }

  .home-circle-tags .ct-desc {
    font-size: var(--font-size-xs);
  }

  .home-circle-tags .ct-center {
    width: 60%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-circle-tags .ct-dot {
    animation: none;
    transform: scale(1);
  }
}

/*============================================================
  HOME WELLNESS JOURNEY
============================================================*/
.home-wellness-journey {
  --total: 5;
  --hwj-scroll: 90svh;
  position: relative;
  height: calc(100svh + (var(--total) - 1) * var(--hwj-scroll));
}

.home-wellness-journey-heading-wrapper {
  position: relative;
  z-index: 2;
}

.home-wellness-journey-heading-wrapper .container {
  width: 100%;
  display: flex;
  flex-direction: column;
}

.home-wellness-journey-heading-wrapper .wrapper {
  display: grid;
  grid-template-columns: 2fr 1fr;
  align-items: end;
  gap: var(--spacing-2xl);
  margin-top: auto;
  margin-bottom: var(--spacing-3xl);
}

.home-wellness-journey-heading-wrapper .heading {
  font-size: var(--font-size-7xl);
  color: var(--sandstone-500);
}

.home-wellness-journey-heading-wrapper .description {
  color: var(--sandstone-300);
}

.home-wellness-journey-heading-wrapper .left {
  max-width: 720px;
}

.home-wellness-journey-heading-wrapper .right {
  max-width: 360px;
}

.home-wellness-journey.hwj-static {
  height: auto;
}

.home-wellness-journey .hwj-sticky {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
}
.home-wellness-journey.hwj-static .hwj-sticky {
  position: static;
  height: auto;
}

.home-wellness-journey .hwj-stage {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--evergreen-800);
}

/* ---- image crossfade stack ---- */
.home-wellness-journey .hwj-media {
  position: absolute;
  inset: 0;
  display: grid;
  z-index: 0;
}
.home-wellness-journey .hwj-media-layer {
  grid-area: 1 / 1;
  overflow: hidden;
}
.home-wellness-journey .hwj-media-layer picture {
  display: block;
  width: 100%;
  height: 100%;
}

.home-wellness-journey .hwj-media-layer img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom;
  display: block;
}

/* ---- bottom shade image ---- */
.home-wellness-journey .hwj-shade {
  position: absolute;
  top: 36%;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: auto;
  z-index: 2;
  pointer-events: none;
  object-fit: cover;
  display: none;
}

.home-wellness-journey .hwj-shade img {
  height: auto;
  width: 100%;
}

.home-wellness-journey .hwj-wheel {
  --wheel-d: clamp(1400px, 240vw, 2850px);
  position: absolute;
  left: 50%;
  top: 60%;
  width: var(--wheel-d);
  height: var(--wheel-d);
  transform: translateX(-50%);
  border-radius: 50%;
  border: 2px solid var(--sandstone-500);
  z-index: 3;
  pointer-events: none;
}
.home-wellness-journey .hwj-icon-marker {
  position: absolute;
  left: 50%;
  top: 50%;
  width: clamp(50px, 6vw, 70px);
  aspect-ratio: 1;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--sandstone-500);
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  will-change: transform, opacity;
}
.home-wellness-journey .hwj-icon-marker.is-active {
  border-color: rgba(247, 242, 232, 1);
}
@keyframes hwj-glow {
  0%,
  100% {
    box-shadow:
      0 6px 24px rgba(0, 0, 0, 0.18),
      0 0 18px rgba(247, 242, 232, 0.2);
  }
  50% {
    box-shadow:
      0 6px 24px rgba(0, 0, 0, 0.18),
      0 0 36px rgba(247, 242, 232, 0.45);
  }
}
.home-wellness-journey .hwj-icon {
  display: block;
  width: 48%;
  height: 48%;
  object-fit: contain;
  filter: brightness(0) invert(1);
  opacity: 0.92;
}

/* ---- content crossfade stack ---- */
.home-wellness-journey .hwj-content {
  position: absolute;
  left: 50%;
  bottom: var(--spacing-xl);
  transform: translateX(-50%);
  width: min(90%, 500px);
  display: grid;
  text-align: center;
  z-index: 4;
}
.home-wellness-journey .hwj-content-layer {
  grid-area: 1 / 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: var(--spacing-md);
  margin: 0;
  list-style: none;
}
.home-wellness-journey .ji-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: calc(var(--font-size-6xl) * 1.3);
  line-height: 1.08;
  color: var(--chasenut-500);
}
.home-wellness-journey .ji-desc {
  margin: 0;
  font-size: var(--font-size-md);
  line-height: 1.6;
  color: var(--chasenut-400);
}

.home-wellness-journey .ji-cta {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
}

.home-wellness-journey .ji-cta svg {
  width: 20px;
  height: 20px;
  color: var(--chasenut-500);
}

.home-wellness-journey .ji-cta svg path {
  stroke: var(--chasenut-400);
}

.home-wellness-journey .ji-cta .chev {
  transition: transform 0.3s ease;
}

.home-wellness-journey .ji-cta:hover {
}

.home-wellness-journey .ji-cta:hover .chev-left {
  transform: translateX(-3px);
}

.home-wellness-journey .ji-cta:hover .chev-right {
  transform: translateX(3px);
}
.home-wellness-journey .ji-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

@media screen and (max-width: 1689px) {
  .home-wellness-journey .hwj-wheel {
    --wheel-d: clamp(1400px, 240vw, 2240px);
    top: 58%;
  }

  .home-wellness-journey .hwj-shade {
    top: 32%;
  }
}

@media screen and (max-width: 1279px) {
  .home-wellness-journey .hwj-wheel {
    --wheel-d: clamp(1400px, 240vw, 2000px);
    top: 66%;
  }

  .home-wellness-journey .hwj-shade {
    top: 60%;
  }

  .home-wellness-journey .hwj-content {
    bottom: var(--spacing-2xl);
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .home-wellness-journey {
    --hwj-scroll: 72svh;
  }
  .home-wellness-journey .hwj-wheel {
    --wheel-d: clamp(1100px, 320vw, 1200px);
    top: 65%;
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 639px) {
  .home-wellness-journey-heading-wrapper .wrapper {
    grid-template-columns: 1fr;
    gap: var(--spacing-lg);
    max-width: var(--container-sm);
  }

  .home-wellness-journey .hwj-wheel {
    --wheel-d: clamp(360px, 360vw, 500px);
    top: 60%;
  }

  .home-wellness-journey .hwj-shade {
    top: 56%;
  }

  .home-wellness-journey .hwj-content {
    bottom: var(--spacing-3xl);
  }
  .home-wellness-journey .hwj-icon-marker {
    width: 52px;
  }

  .home-wellness-journey .hwj-icon-marker {
    width: 48px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .home-wellness-journey {
    height: auto;
  }
  .home-wellness-journey .hwj-sticky {
    position: static;
    height: auto;
  }
  .home-wellness-journey .hwj-icon-marker,
  .home-wellness-journey .hwj-media-layer.is-active img {
    animation: none;
  }
}

/*============================================================
  HOME FOUNDATIONS
============================================================*/
.home-foundations {
  background-color: var(--sandstone-100);
  color: var(--evergreen-700);
  padding-block: var(--spacing-8xl);
  text-align: center;
  position: relative;
}

.home-foundations .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.home-foundations .bg-image {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  user-select: none;
}

.home-foundations .bg-image img {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

/* ---- heading + intro ---- */
.home-foundations .hf-head {
  max-width: var(--container-md);
  margin-inline: auto;
}
.home-foundations .hf-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 500;
  color: var(--evergreen-700);
  font-size: var(--font-size-8xl);
  line-height: 1.06;
}
.home-foundations .hf-intro {
  margin: var(--spacing-lg) auto 0;
  font-size: var(--font-size-md);
  color: var(--evergreen-300);
}

/* ---- 2×2 grid + centre lines ---- */
.home-foundations .hf-grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: clamp(48px, 8vw, 130px) clamp(40px, 8vw, 120px);
  max-width: 1000px;
  margin: var(--spacing-6xl) auto 0;
}
.home-foundations .hf-item {
  justify-self: center;
  max-width: 34ch;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(10px, 1.4vh, 16px);
}
.home-foundations .hf-item:nth-of-type(1),
.home-foundations .hf-item:nth-of-type(2) {
  align-self: start;
}
.home-foundations .hf-item:nth-of-type(3),
.home-foundations .hf-item:nth-of-type(4) {
  align-self: start;
}
.home-foundations .hf-icon {
  width: 36px;
  height: 36px;
  color: var(--evergreen-700);
}
.home-foundations .hf-icon svg,
.home-foundations .hf-icon img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
}
.home-foundations .hf-item-title {
  margin: 0;
  font-family: var(--body-font);
  font-weight: 600;
  color: var(--evergreen-500);
  font-size: var(--font-size-3xl);
}
.home-foundations .hf-item-desc {
  margin: 0;
  font-size: var(--font-size-md);
  line-height: 1.6;
  color: var(--evergreen-300);
  font-weight: 300;
}

/* ---- middle connecting lines ---- */
.home-foundations .hf-lines {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: clamp(150px, 19vw, 250px);
  aspect-ratio: 1;
  z-index: 1;
  pointer-events: none;
}
.home-foundations .hf-lines-svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}
.home-foundations .hf-line {
  fill: none;
  stroke: var(--evergreen-700);
  stroke-width: 1;
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .home-foundations .hf-grid {
    gap: clamp(36px, 7vw, 80px);
  }
  .home-foundations .hf-item {
    max-width: 30ch;
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 639px) {
  .home-foundations .hf-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: clamp(40px, 10vw, 56px);
    max-width: 34ch;
  }
  .home-foundations .hf-item,
  .home-foundations .hf-item:nth-of-type(1),
  .home-foundations .hf-item:nth-of-type(2),
  .home-foundations .hf-item:nth-of-type(3),
  .home-foundations .hf-item:nth-of-type(4) {
    align-self: auto;
    justify-self: center;
    max-width: none;
  }
  .home-foundations .hf-lines {
    display: none;
  }

  .home-foundations .hf-icon {
    width: 32px;
    height: 32px;
    color: var(--evergreen-700);
  }
}

/*============================================================
  HOME ENVIRONMENTS
============================================================*/
.home-environments {
  position: relative;
  display: grid;
  overflow: clip;
  background: var(--evergreen-800);
  color: var(--sandstone-100);
}

.home-environments .he-bg {
  grid-area: 1 / 1;
  position: sticky;
  top: 0;
  height: 100vh;
  margin: 0;
  z-index: 0;
}
.home-environments .he-bg video {
  width: 100%;
  height: 100%;
  object-fit: fill;
}

.home-environments .container {
  grid-area: 1 / 1;
  position: relative;
  z-index: 1;
}
.home-environments .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.home-environments .he-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.35fr);
  gap: var(--spacing-xl);
  align-items: start;
}

/* ---- LEFT ---- */
.home-environments .he-left {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--spacing-lg);
}
.home-environments .he-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 500;
  font-size: calc(var(--font-size-6xl) * 1.3);
  line-height: 1.08;
  color: var(--sandstone-500);
}
.home-environments .btn-double-arrow {
  align-self: start;
}

/* ---- RIGHT ---- */
.home-environments .he-right {
  display: flex;
  flex-direction: column;
}

.home-environments .he-env {
  display: flex;
  align-items: center;
  min-height: 100vh;
}
.home-environments .he-env-wrapper {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.8fr);
  align-items: flex-end;
  gap: var(--spacing-lg);
  padding-bottom: var(--spacing-xl);
}
.home-environments .he-env-media {
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  aspect-ratio: 3 / 4;
}
.home-environments .he-env-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.home-environments .he-env-text {
  align-self: end;
  text-align: right;
  margin-bottom: var(--spacing-6xl);
}
.home-environments .he-env-title {
  margin: 0 0 var(--spacing-md);
  font-family: var(--body-font);
  font-weight: 500;
  font-size: var(--font-size-3xl);
  color: var(--sandstone-400);
}
.home-environments .he-env-desc {
  margin: 0;
  font-size: var(--font-size-md);
  color: var(--sandstone-400);
  font-weight: 300;
}

@media screen and (max-width: 1279px) {
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .home-environments .he-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .home-environments .btn-desktop {
    display: none;
  }
  .home-environments .he-left {
    height: auto;
    position: static;
    padding-block: 320px var(--spacing-2xl);
    align-items: center;
    text-align: center;
  }
  .home-environments .he-title {
    max-width: var(--container-lg);
  }
  .home-environments .btn-double-arrow {
    align-self: center;
  }
  .home-environments .he-env {
    min-height: auto;
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.7fr);
    padding-bottom: var(--spacing-2xl);
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 639px) {
  .home-environments .he-left {
    padding-top: 200px;
  }
  .home-environments .he-env {
    padding-bottom: var(--spacing-3xl);
  }
  .home-environments .he-env-wrapper {
    grid-template-columns: 1fr;
    gap: var(--spacing-ml);
  }
  .home-environments .he-env-media {
    aspect-ratio: 4 / 5;
  }
  .home-environments .he-env-text {
    align-self: auto;
    padding-bottom: 0;
    text-align: center;
    margin-bottom: 0;
  }
}

/**************-------------------------------------**************/
/*                           ABOUT HERO                         */
/**************-------------------------------------**************/
.about-hero {
  position: relative;
}
.about-hero .bg-image {
  position: absolute;
  inset: auto 0 0 0;
  width: 100%;
  height: auto;
  overflow: hidden;
  z-index: 1;
  pointer-events: none;
  user-select: none;
}

.about-hero .bg-image img {
  width: 100%;
  height: auto;
}

/**************-------------------------------------**************/
/*                           ABOUT INTRO                         */
/**************-------------------------------------**************/
.about-intro {
  position: relative;
  overflow: hidden;
  padding-bottom: var(--spacing-8xl);
  text-align: center;
  background: var(--evergreen-700);
}

.about-intro .wrapper {
  position: relative;
  z-index: 1;
  max-width: var(--container-lg);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
}

.about-intro .heading {
  color: var(--sandstone-500);
}

.about-intro .description {
  color: var(--evergreen-100);
  max-width: var(--container-sm);
  margin-inline: auto;
  font-weight: 300;
}

.about-intro .scroll-to {
  margin-top: var(--spacing-lg);
  margin-inline: auto;
  max-width: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-lg);
  color: var(--sandstone-300);
  font-size: var(--font-size-lg);
  position: relative;
  z-index: 5;
}

.about-intro .scroll-to:hover {
  color: var(--sandstone-100);
}

@media screen and (max-width: 1023px) {
  .about-intro .scroll-to {
    font-size: var(--font-size-lg);
  }
}

@media screen and (max-width: 639px) {
}

/*============================================================
  ABOUT — FOUNDER STORY
============================================================*/
.about-founder {
  position: relative;
  overflow: clip;
  background: var(--evergreen-700);
  color: var(--sandstone-200);
  padding-block: var(--spacing-lg) var(--spacing-8xl);
  scroll-margin-top: var(--spacing-4xl);
}
.about-founder .af-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  margin: 0;
}
.about-founder .af-bg video {
  width: 100%;
  height: 100%;
  object-fit: fill;
}
.about-founder .af-shade--top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1;
  pointer-events: none;
}
.about-founder .af-shade--top img {
  width: 100%;
  height: auto;
  display: block;
}
.about-founder .container {
  position: relative;
  z-index: 2;
}
.about-founder .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.about-founder .af-intro {
  display: flex;
  flex-direction: column;
}
.about-founder .af-lead {
  align-self: flex-start;
  max-width: var(--container-md);
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-7xl);
  color: var(--sandstone-500);
  line-height: 1.1;
}
.about-founder .af-portrait {
  align-self: center;
  width: min(100%, 600px);
  margin: var(--spacing-2xl) 0;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  aspect-ratio: 3 / 4;
}
.about-founder .af-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s ease;
  will-change: transform;
}

.about-founder .af-portrait:hover img {
  transform: scale(1.06) rotate(1deg);
}
.about-founder .af-lead-2 {
  align-self: flex-end;
  max-width: var(--container-sm);
  margin: 0 0 0 auto;
  text-align: right;
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-6xl);
  line-height: 1.15;
  color: var(--sandstone-500);
}

/* ---- story block ---- */

.about-founder .af-story-shade {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}
.about-founder .af-story-shade img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  display: block;
}
.about-founder .af-story-inner {
  position: relative;
  z-index: 1;
  margin-top: -60px;
}
.about-founder .af-quote {
  display: block;
  width: 200px;
  color: var(--evergreen-400);
}
.about-founder .af-quote svg {
  width: 100%;
  height: auto;
  display: block;
}
.about-founder .af-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--spacing-2xl);
  margin-top: var(--spacing-xl);
}
.about-founder .af-col {
  display: flex;
  flex-direction: column;
}

.about-founder .af-question {
  margin: 0 0 var(--spacing-lg);
  font-weight: 400;
  font-family: var(--body-font);
  font-size: var(--font-size-6xl);
  line-height: 1.2;
  color: var(--evergreen-100);
}
.about-founder .af-text {
  margin: 0;
  font-size: var(--font-size-md);
  color: var(--evergreen-200);
}

.about-founder .af-col--right .af-text {
  padding-top: var(--spacing-6xl);
}
.about-founder .af-signature {
  width: clamp(170px, 20vw, 250px);
  height: auto;
  margin-top: auto;
  margin-right: auto;
  padding-top: clamp(28px, 5vh, 64px);
  display: block;
}

@media screen and (max-width: 1279px) {
  .about-founder .af-portrait {
    align-self: center;
    width: min(100%, 500px);
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .about-founder .af-portrait {
    align-self: center;
    width: min(100%, 420px);
  }

  .about-founder .af-lead {
  }
  .about-founder .af-cols {
    gap: clamp(20px, 4vw, 40px);
  }

  .about-founder .af-lead-2 {
    max-width: 70%;
  }

  .about-founder .af-story-inner {
    margin-top: -60px;
    max-width: var(--container-sm);
  }

  .about-founder .af-quote {
    width: 160px;
  }

  .about-founder .af-cols {
    grid-template-columns: 1fr;
  }

  .about-founder .af-col--right .af-text {
    padding-top: 0;
  }

  .about-founder .af-cols {
    gap: var(--spacing-lg);
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 639px) {
  .about-founder .af-lead,
  .about-founder .af-lead-2 {
    align-self: stretch;
    max-width: none;
  }

  .about-founder .af-quote {
    width: 100px;
  }

  .about-founder .af-story-inner {
    margin-top: var(--spacing-lg);
    max-width: 100%;
  }

  .about-founder .af-story-inner {
    max-width: var(--container-sm);
    padding-top: var(--spacing-3xl);
  }
}

/*============================================================
  ABOUT — MY STORY AS A PATH
============================================================*/
.my-story {
  position: relative;
  padding-block: 400px var(--spacing-8xl);
}

.my-story .bg-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.my-story .bg-image img {
  object-fit: fill;
  width: 100%;
  height: 100%;
}

.my-story .container {
  position: relative;
}
.my-story .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.my-story .ms-head {
  position: absolute;
  top: -260px;
  right: 60px;
  left: 0;
  z-index: 3;
  max-width: var(--max-width-sm);
  margin-left: auto;
  pointer-events: none;
}
.my-story .ms-title {
  margin: 0;
  text-align: right;
  font-family: var(--heading-font);
  font-weight: 500;
  font-size: var(--font-size-7xl);
  line-height: 1.12;
  color: var(--evergreen-600);
}

.my-story .ms-journey {
  position: relative;
  width: 100%;
  aspect-ratio: 1440 / 783;
}
.my-story .ms-svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.my-story .ms-track {
  display: none;
}

.my-story .ms-points {
  position: absolute;
  inset: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  z-index: 2;
}
.my-story .ms-node {
  position: absolute;
  transform: translate(-50%, -50%);
}
.my-story .ms-node-dot {
  position: relative;
  width: clamp(18px, 1.7vw, 24px);
  height: clamp(18px, 1.7vw, 24px);
  box-sizing: border-box;
  border-radius: 50%;
  border: 5px solid var(--evergreen-600);
  background: var(--sandstone-200);
  display: block;
}
.my-story .ms-node-body {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
  max-width: 240px;
  text-align: center;
}
.my-story .ms-node.ms-above .ms-node-body {
  bottom: calc(100% + 28px);
}
.my-story .ms-node.ms-below .ms-node-body {
  top: calc(100% + clamp(10px, 1.4vw, 18px));
}

.my-story .ms-points .ms-node:nth-child(3) .ms-node-body {
  bottom: calc(100% + 40px);
}

.my-story .ms-points .ms-node:nth-child(4) .ms-node-body {
  transform: translateX(-75%);
}

.my-story .ms-points .ms-node:nth-child(5) .ms-node-body {
  transform: translateX(20%);
  right: 0;
  top: -300%;
}
.my-story .ms-node-icon {
  display: block;
  width: 32px;
  height: 32px;
  margin-bottom: var(--spacing-sm);
  margin-inline: auto;
  color: var(--evergreen-700);
}
.my-story .ms-node-icon svg,
.my-story .ms-node-icon img {
  width: 100%;
  height: auto;
  display: block;
}
.my-story .ms-node-title {
  font-family: var(--body-font);
  font-size: var(--font-size-3xl);
  font-weight: 500;
  color: var(--evergreen-500);
  margin-bottom: var(--spacing-sm);
}
.my-story .ms-node-desc {
  margin: 0;
  font-size: var(--font-size-md);
  font-weight: 300;
  line-height: 1.5;
  color: var(--evergreen-400);
}

/* ---- brief text ---- */
.my-story .ms-node--has-brief {
  cursor: pointer;
}
.my-story .ms-node.ms-pending {
  pointer-events: none;
}
.my-story .ms-node--has-brief:hover,
.my-story .ms-node--has-brief:focus-within,
.my-story .ms-node--has-brief.is-open {
  z-index: 3;
}
.my-story .ms-node--has-brief:focus-visible {
  outline: 2px solid var(--evergreen-400);
  outline-offset: 10px;
  border-radius: var(--rounded-sm);
}

.my-story .ms-node--has-brief .ms-node-dot::after {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 1px solid var(--evergreen-400);
  opacity: 0;
  pointer-events: none;
}
.my-story .ms-node--has-brief:hover .ms-node-dot::after,
.my-story .ms-node--has-brief:focus-within .ms-node-dot::after,
.my-story .ms-node--has-brief.is-open .ms-node-dot::after {
  animation: ms-ring 1.6s cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes ms-ring {
  from {
    opacity: 0.5;
    transform: scale(1);
  }
  to {
    opacity: 0;
    transform: scale(3.2);
  }
}

.my-story .ms-node-spot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: clamp(260px, 26vw, 420px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(
    circle closest-side,
    rgba(55, 108, 85, 0.14),
    rgba(55, 108, 85, 0) 72%
  );
  transform: translate(-50%, -50%) scale(0.7);
  opacity: 0;
  pointer-events: none;
  transition:
    transform 0.8s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.6s ease;
}
.my-story .ms-node--has-brief:hover .ms-node-spot,
.my-story .ms-node--has-brief:focus-within .ms-node-spot,
.my-story .ms-node--has-brief.is-open .ms-node-spot {
  transform: translate(-50%, -50%) scale(1);
  opacity: 1;
}

.my-story .ms-node--has-brief .ms-node-title {
  position: relative;
}
.my-story .ms-node--has-brief .ms-node-title::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -2px;
  width: 42px;
  height: 1px;
  margin-left: -21px;
  background: var(--evergreen-400);
  transform: scaleX(0);
  transform-origin: 50% 50%;
  transition: transform 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.my-story .ms-node--has-brief:hover .ms-node-title::after,
.my-story .ms-node--has-brief:focus-within .ms-node-title::after,
.my-story .ms-node--has-brief.is-open .ms-node-title::after {
  transform: scaleX(1);
}

.my-story .ms-node-head,
.my-story .ms-node-short,
.my-story .ms-node-brief {
  display: grid;
  transition: grid-template-rows 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.my-story .ms-node-clip {
  overflow: hidden;
  transition: opacity 0.4s ease;
}
.my-story .ms-node-head,
.my-story .ms-node-short {
  grid-template-rows: 1fr;
}
.my-story .ms-node-brief {
  grid-template-rows: 0fr;
}
.my-story .ms-node-brief > .ms-node-clip {
  opacity: 0;
}
.my-story .ms-node-brief p {
  margin: 0;
  font-size: var(--font-size-sm);
  font-weight: 300;
  line-height: 1.6;
  color: var(--evergreen-400);
}
.my-story .ms-node--has-brief:hover .ms-node-head,
.my-story .ms-node--has-brief:focus-within .ms-node-head,
.my-story .ms-node--has-brief.is-open .ms-node-head,
.my-story .ms-node--has-brief:hover .ms-node-short,
.my-story .ms-node--has-brief:focus-within .ms-node-short,
.my-story .ms-node--has-brief.is-open .ms-node-short {
  grid-template-rows: 0fr;
}
.my-story .ms-node--has-brief:hover .ms-node-head > .ms-node-clip,
.my-story .ms-node--has-brief:focus-within .ms-node-head > .ms-node-clip,
.my-story .ms-node--has-brief.is-open .ms-node-head > .ms-node-clip,
.my-story .ms-node--has-brief:hover .ms-node-short > .ms-node-clip,
.my-story .ms-node--has-brief:focus-within .ms-node-short > .ms-node-clip,
.my-story .ms-node--has-brief.is-open .ms-node-short > .ms-node-clip {
  opacity: 0;
}
.my-story .ms-node--has-brief:hover .ms-node-brief,
.my-story .ms-node--has-brief:focus-within .ms-node-brief,
.my-story .ms-node--has-brief.is-open .ms-node-brief {
  grid-template-rows: 1fr;
}
.my-story .ms-node--has-brief:hover .ms-node-brief > .ms-node-clip,
.my-story .ms-node--has-brief:focus-within .ms-node-brief > .ms-node-clip,
.my-story .ms-node--has-brief.is-open .ms-node-brief > .ms-node-clip {
  opacity: 1;
}

.my-story .ms-node-w {
  display: inline-block;
  opacity: 0;
  transform: translateY(0.5em);
  filter: blur(8px);
  transition:
    opacity 0.5s ease,
    transform 0.5s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.5s ease;
}
.my-story .ms-node--has-brief:hover .ms-node-w,
.my-story .ms-node--has-brief:focus-within .ms-node-w,
.my-story .ms-node--has-brief.is-open .ms-node-w {
  opacity: 1;
  transform: translateY(0);
  filter: blur(0px);
  transition-delay: calc(140ms + var(--i) * 22ms);
}

.my-story .ms-node--logo .ms-node-body {
  max-width: 240px;
}
.my-story .ms-node-logo {
  width: clamp(120px, 14vw, 200px);
  height: auto;
  display: block;
  margin-inline: auto;
  margin-bottom: var(--spacing-sm);
}

@media screen and (max-width: 1279px) {
  .my-story {
    padding-bottom: var(--spacing-10xl);
  }

  .my-story .ms-head {
    right: 20px;
  }
}

@media screen and (min-width: 768px) and (max-width: 1023px) {
  .my-story .ms-node-icon {
    width: 24px;
    height: 24px;
  }

  .my-story .ms-node-dot {
    border-width: 3px;
  }

  .my-story .ms-node-body {
    max-width: 180px;
  }

  .my-story .ms-node-title {
    font-size: var(--font-size-xl);
  }

  .my-story .ms-node-desc {
    font-size: var(--font-size-sm);
  }

  .my-story .ms-node-brief p {
    font-size: var(--font-size-xs);
  }

  .my-story .ms-node-spot {
    width: clamp(220px, 30vw, 300px);
  }

  .my-story .ms-points .ms-node:nth-child(1) .ms-node-body {
    transform: translateX(-40%);
  }

  .my-story .ms-points .ms-node:nth-child(3) .ms-node-body {
    bottom: calc(100% + 30px);
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 767px) {
  .my-story {
    padding-inline: 15px;
  }
  .my-story .ms-head {
    position: static;
    margin-bottom: clamp(24px, 5vh, 44px);
  }
  .my-story .ms-title {
    text-align: center;
    font-size: clamp(30px, 9vw, 46px);
  }
  .my-story .ms-journey {
    aspect-ratio: auto;
  }
  .my-story .ms-svg {
    display: none;
  }
  .my-story .ms-points {
    position: static;
    display: flex;
    flex-direction: column;
    gap: clamp(28px, 6vh, 44px);
  }
  .my-story .ms-track {
    display: block;
    position: absolute;
    width: 3px;
    transform: translateX(-50%);
    border-radius: var(--rounded-full);
    background: rgba(3, 43, 25, 0.09);
    z-index: 0;
  }
  .my-story .ms-track-fill {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: inherit;
    background: #376c55;
    transform: scaleY(0);
    transform-origin: top center;
  }
  .my-story .ms-node {
    position: static !important;
    transform: none !important;
    left: auto !important;
    top: auto !important;
    display: flex;
    align-items: flex-start;
    gap: 16px;
  }
  .my-story .ms-node-dot {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    margin-top: 4px;
    width: 22px;
    height: 22px;
  }
  .my-story .ms-node-body,
  .my-story .ms-node.ms-above .ms-node-body,
  .my-story .ms-node.ms-below .ms-node-body {
    position: static !important;
    transform: none !important;
    inset: auto !important;
    max-width: none;
    text-align: left;
  }
  .my-story .ms-node-icon {
    margin-inline: 0;
  }
  .my-story .ms-node-logo {
    margin-inline: 0;
  }

  .my-story .ms-node--has-brief {
    cursor: auto;
  }
  .my-story .ms-node-spot {
    display: none;
  }
  .my-story .ms-node--has-brief .ms-node-title::after {
    left: 0;
    margin-left: 0;
    transform: scaleX(1);
    display: none;
  }
  .my-story .ms-node-head,
  .my-story .ms-node-short,
  .my-story .ms-node-brief {
    display: block !important;
  }
  .my-story .ms-node-clip {
    overflow: visible;
    opacity: 1 !important;
  }
  .my-story .ms-node-brief {
    margin-top: var(--spacing-sm);
  }

  .my-story .ms-node-brief p {
    font-size: var(--font-size-md);
  }
  .my-story .ms-node-w {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .my-story .ms-node-head,
  .my-story .ms-node-short,
  .my-story .ms-node-brief,
  .my-story .ms-node-clip,
  .my-story .ms-node-spot,
  .my-story .ms-node-w,
  .my-story .ms-node--has-brief .ms-node-title::after {
    transition: none;
  }
  .my-story .ms-node-w {
    opacity: 1;
    transform: none;
    filter: none;
  }
}

/*==================================================================
  WHY HOUSE OF EXPERIENCE
==================================================================*/
.home-experience {
  --hx-ivory: var(--sandstone-100);
  --hx-ink: var(--chasenut-500);
  --hx-line: var(--chasenut-200);
  --hx-muted: rgba(75, 32, 19, 0.55);
  --hx-d: 460px;
  position: relative;
  height: 600svh;
  background: var(--hx-ivory);
}

.home-experience .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

/* ---- heading lead-in ---- */
.home-experience .hx-lead {
  padding-bottom: var(--spacing-lg);
}
.home-experience .hx-heading {
  margin: 0 auto;
  max-width: var(--container-lg);
  text-align: center;
  color: var(--chasenut-500);
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-7xl);
  line-height: 1.1;
}

.home-experience .hx-stage {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  isolation: isolate;
  display: grid;
  place-items: center;
}

/* ---- concepts ---- */
.home-experience .hx-concept {
  position: absolute;
  inset: 10% 0 0 0;
  margin: auto;
  width: var(--hx-d);
  height: var(--hx-d);
  z-index: 2;
  color: var(--hx-line);
}
.home-experience .hx-concept--left {
  transform: translate(-50%, -16%);
}
.home-experience .hx-concept--right {
  transform: translate(50%, 16%);
}

.home-experience .hx-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.home-experience .hx-concept-inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 12%;
}
.home-experience .hx-concept-icon {
  display: block;
  width: 60px;
  color: var(--hx-ink);
  margin-bottom: var(--spacing-xs);
}
.home-experience .hx-concept-icon svg,
.home-experience .hx-concept-icon img {
  display: block;
  width: 100%;
  height: auto;
}
.home-experience .hx-concept-title {
  margin: 0;
  font-family: var(--body-font);
  font-weight: 400;
  font-size: var(--font-size-3xl);
  color: var(--chasenut-500);
}
.home-experience .hx-concept-desc {
  margin: var(--spacing-sm) 0 0;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: var(--font-size-lg);
  color: var(--chasenut-300);
}

/* ---- core ---- */
.home-experience .hx-core {
  position: absolute;
  inset: 22% 0 0 0;
  margin: auto;
  width: var(--hx-d);
  height: var(--hx-d);
  z-index: 3;
  pointer-events: none;
}
.home-experience .hx-emblem {
  position: absolute;
  inset: 0 0 20% 0;
  margin: auto;
  width: 78px;
  height: 78px;
  background-color: var(--hx-ink);
  -webkit-mask: url("../images/logo-icon.svg") center / contain no-repeat;
  mask: url("../images/logo-icon.svg") center / contain no-repeat;
}

.home-experience .hx-core-text {
  position: absolute;
  inset: 49% 0 auto 0;
  margin-inline: auto;
  width: 88%;
  max-width: var(--hx-d);
}
.home-experience .hx-core-text > * {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin-inline: auto;
}
.home-experience .hx-wordmark {
  margin-top: var(--spacing-md);
  width: 250px;
  aspect-ratio: 470 / 164;
  background-color: var(--hx-ink);
  -webkit-mask: url("../images/home-experience-logo.png") center / contain
    no-repeat;
  mask: url("../images/home-experience-logo.png") center / contain no-repeat;
}
.home-experience .hx-philosophy {
  width: 100%;
  text-align: center;
}
.home-experience .hx-phil-title {
  margin-top: var(--spacing-md);
  color: var(--chasenut-500);
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-5xl);
  line-height: 1.12;
}
.home-experience .hx-phil-body {
  margin: var(--spacing-sm) auto 0;
  max-width: 30ch;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}

.home-experience.hx-static {
  height: auto;
  padding: clamp(64px, 12vh, 140px) 20px;
}
.home-experience.hx-static .hx-stage {
  position: static;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(28px, 5vh, 56px);
}
.home-experience.hx-static .hx-lead {
  min-height: 0;
  padding: 0 0 clamp(24px, 5vh, 48px);
}
.home-experience.hx-static .tr.js-reveal {
  visibility: visible !important;
}
.home-experience.hx-static .hx-concept {
  position: relative;
  inset: auto;
  transform: none;
  margin: 0;
}
.home-experience.hx-static .hx-core {
  position: relative;
  inset: auto;
  margin: 0;
  height: auto;
}
.home-experience.hx-static .hx-emblem,
.home-experience.hx-static .hx-core-text,
.home-experience.hx-static .hx-wordmark,
.home-experience.hx-static .hx-philosophy {
  position: static;
  transform: none;
}
.home-experience.hx-static .hx-core-text {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 20px;
}

@media screen and (max-width: 1279px) {
  .home-experience .hx-emblem {
    bottom: 35%;
  }

  .home-experience .hx-wordmark,
  .home-experience .hx-phil-title {
    margin-top: 0;
  }

  .home-experience .hx-emblem {
    width: 60px;
    height: 60px;
  }

  .home-experience .hx-wordmark {
    width: 200px;
  }

  .home-experience .hx-phil-title {
    font-size: var(--font-size-4xl);
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .home-experience {
    --hx-d: 360px;
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 767px) {
  .home-experience {
    --hx-d: clamp(190px, 66vmin, 330px);
    height: 420svh;
  }
  .home-experience .hx-concept--left {
    transform: translate(-0%, -58%);
  }
  .home-experience .hx-concept--right {
    transform: translate(0%, 58%);
  }
  .home-experience .hx-concept-desc {
    font-size: 12px;
  }

  .home-experience .hx-concept {
    top: 5%;
  }

  .home-experience .hx-emblem {
    bottom: 52%;
  }

  .home-experience .hx-concept-icon {
    width: 32px;
  }

  .home-experience .hx-concept-inner {
    padding: 0 6%;
  }

  .home-experience .hx-concept-title {
    font-size: var(--font-size-2xl);
  }

  .home-experience .hx-emblem {
    width: 40px;
    height: 40px;
  }

  .home-experience .hx-core-text {
    inset: 44% 0 auto 0;
  }

  .home-experience .hx-wordmark {
    width: 160px;
  }

  .home-experience .hx-phil-title {
    font-size: var(--font-size-lg);
  }

  .home-experience .hx-phil-body {
    font-size: var(--font-size-xs);
  }
}

/*==================================================================
  FOUR ELEMENTS
==================================================================*/
.about-four-elements {
  --fe-cream: var(--sandstone-100);
  --fe-ink: var(--evergreen-900);
  --fe-d: clamp(300px, 52vmin, 600px);
  --fe-node: clamp(50px, 7vmin, 80px);
  position: relative;
  background: #2a140c;
}

.about-four-elements .fe-stage {
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: clamp(20px, 4vh, 40px);
  color: var(--fe-cream);
}

/* ---- backgrounds ---- */
.about-four-elements .fe-bgs {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.about-four-elements .fe-bg {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.1s ease;
}
.about-four-elements .fe-bg.is-active {
  opacity: 1;
}

/* ---- continuity shades over the background ---- */
.about-four-elements .bg-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  margin: 0;
  pointer-events: none;
}
.about-four-elements .top-shade,
.about-four-elements .bottom-shade {
  position: absolute;
  left: 0;
  width: 100%;
  line-height: 0;
}
.about-four-elements .top-shade {
  top: 0;
}
.about-four-elements .bottom-shade {
  bottom: 0;
}
.about-four-elements .bg-shade img {
  display: block;
  width: 100%;
  height: auto;
}

/* ---- the wheel ---- */
.about-four-elements .fe-wheel {
  position: relative;
  z-index: 2;
  width: var(--fe-d);
  height: var(--fe-d);
  flex: none;
}
.about-four-elements .fe-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  color: rgba(249, 245, 238, 0.55);
  overflow: visible;
}
.about-four-elements .fe-emblem {
  position: absolute;
  inset: 0;
  margin: auto;
  width: clamp(118px, 26vmin, 260px);
  height: clamp(118px, 26vmin, 260px);
}
.about-four-elements .fe-emblem svg {
  display: block;
  width: 100%;
  height: 100%;
}

.about-four-elements .fe-el {
  position: absolute;
  width: var(--fe-node);
  height: var(--fe-node);
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.about-four-elements .fe-el--earth {
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
}
.about-four-elements .fe-el--water {
  top: 50%;
  left: 100%;
  transform: translate(-50%, -50%);
}
.about-four-elements .fe-el--air {
  top: 100%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.about-four-elements .fe-el--fire {
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
}

.about-four-elements .fe-node {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1.5px solid rgba(249, 245, 238, 0.7);
  background: rgba(0, 0, 0, 0.02);
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  backdrop-filter: blur(10px) saturate(120%);
  color: var(--sandstone-500);
  transition:
    background 0.45s ease,
    border-color 0.45s ease,
    color 0.45s ease,
    transform 0.45s ease;
}

.about-four-elements .fe-icon {
  display: block;
  width: 50%;
}
.about-four-elements .fe-icon svg {
  display: block;
  width: 100%;
  height: auto;
  fill: var(--sandstone-500);
  transition: fill 0.45s ease;
}

.about-four-elements .fe-icon .fe-icon-img {
  display: block;
  width: 100%;
  aspect-ratio: 1;
  background-color: var(--sandstone-500);
  -webkit-mask: var(--fe-icon) center / contain no-repeat;
  mask: var(--fe-icon) center / contain no-repeat;
  transition: background-color 0.45s ease;
}
.about-four-elements .fe-el.is-active .fe-node {
  background: var(--fe-cream);
  border-color: var(--fe-cream);
  color: var(--fe-ink);
  transform: scale(1.07);
}

.about-four-elements .fe-el.is-active .fe-icon svg {
  fill: var(--chasenut-500);
}
.about-four-elements .fe-el.is-active .fe-icon .fe-icon-img {
  background-color: var(--chasenut-500);
}
.about-four-elements .fe-el:focus-visible .fe-node {
  outline: 2px solid var(--sandstone-500);
  outline-offset: 4px;
}

.about-four-elements .fe-label {
  position: absolute;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  width: max-content;
  max-width: 240px;
  opacity: 0.55;
  transition: opacity 0.45s ease;
}
.about-four-elements .fe-el.is-active .fe-label {
  opacity: 1;
}
.about-four-elements .fe-el--earth .fe-label {
  bottom: 100%;
  left: 50%;
  transform: translate(-50%, -18px);
  align-items: center;
  text-align: center;
}
.about-four-elements .fe-el--air .fe-label {
  top: 100%;
  left: 50%;
  transform: translate(-50%, 18px);
  align-items: center;
  text-align: center;
}
.about-four-elements .fe-el--water .fe-label {
  left: 100%;
  top: 50%;
  transform: translate(18px, -50%);
  align-items: flex-start;
  text-align: left;
}
.about-four-elements .fe-el--fire .fe-label {
  right: 100%;
  top: 50%;
  transform: translate(-18px, -50%);
  align-items: flex-end;
  text-align: right;
}
.about-four-elements .fe-name {
  font-weight: 400;
  font-size: var(--font-size-3xl);
  line-height: 1;
  color: var(--sandstone-500);
  margin: 0 auto var(--spacing-sm);
}
.about-four-elements .fe-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.15em 0.7em;
  max-width: 22ch;
  font-weight: 300;
  font-size: var(--font-size-md);
  color: var(--chasenut-100);
  justify-content: center;
}
.about-four-elements .fe-el--earth .fe-tags,
.about-four-elements .fe-el--air .fe-tags {
  justify-content: center;
}
.about-four-elements .fe-el--water .fe-tags {
}
.about-four-elements .fe-el--fire .fe-tags {
}
.about-four-elements .fe-tag {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
}
.about-four-elements .fe-tag::before,
.about-four-elements .fe-caption-tags span::before {
  content: "";
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background: currentColor;
  opacity: 0.85;
  -webkit-mask: url("../images/bullet-icon.svg") center / contain no-repeat;
  mask: url("../images/bullet-icon.svg") center / contain no-repeat;
}

/* ---- mobile caption ---- */
.about-four-elements .fe-caption {
  display: none;
  z-index: 2;
  margin: 0;
  text-align: center;
  color: var(--sandstone-500);
}
.about-four-elements .fe-caption .fe-caption-name {
  display: block;
  font-size: var(--font-size-3xl);
  line-height: 1.05;
}
.about-four-elements .fe-caption .fe-caption-tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.2em 0.8em;
  margin-top: 0.5em;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: var(--font-size-md);
  color: var(--chasenut-100);
}
.about-four-elements .fe-caption .fe-caption-tags span {
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  opacity: 1;
}
.about-four-elements .fe-caption .fe-caption-tags span::before {
  width: 13px;
  height: 13px;
  margin-right: 4px;
}

@media screen and (max-width: 1279px) {
  .about-four-elements .fe-wheel {
    width: 400px;
    height: 400px;
  }

  .about-four-elements .fe-emblem {
    width: 160px;
    height: 160px;
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .about-four-elements {
    --fe-d: clamp(240px, 58vmin, 460px);
  }
  .about-four-elements .fe-tags {
    max-width: 18ch;
  }

  .about-four-elements .fe-wheel {
    width: 300px;
    height: 300px;
  }

  .about-four-elements .fe-emblem {
    width: 120px;
    height: 120px;
  }

  .about-four-elements .fe-tag::before {
    width: 16px;
    height: 16px;
  }
}

@media screen and (max-width: 767px) {
  .about-four-elements {
    --fe-d: 300px;
    --fe-node: 40px;
  }
  .about-four-elements .fe-label {
    display: none;
  }
  .about-four-elements .fe-caption {
    display: block;
    min-height: 4.5em;
    margin-top: var(--spacing-xl);
  }
}

/*==================================================================
  ABOUT PURPOSE
==================================================================*/
.about-purpose {
  --ap-d: clamp(240px, 30vw, 400px);
  --ap-overlap: calc(var(--ap-d) * 0.12);
  background: var(--sandstone-100);
  padding-bottom: var(--spacing-8xl);
  color: var(--chasenut-500);
}
.about-purpose .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.about-purpose .ap-head {
  max-width: var(--container-lg);
  margin: 0 auto var(--spacing-2xl);
  text-align: center;
}
.about-purpose .ap-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-7xl);
  color: var(--chasenut-500);
  line-height: 1.1;
}
.about-purpose .ap-intro {
  margin: var(--spacing-md) auto 0;
  max-width: 62ch;
  font-family: var(--body-font);
  font-weight: 300;
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}

.about-purpose .ap-grid {
  position: relative;
  width: calc(2 * var(--ap-d) - var(--ap-overlap));
  height: calc(2 * var(--ap-d) - var(--ap-overlap));
  max-width: 100%;
  margin: 0 auto;
}
.about-purpose .ap-item {
  position: absolute;
  width: var(--ap-d);
  height: var(--ap-d);
  color: var(--chasenut-400);
}
.about-purpose .ap-item--restore {
  top: 0;
  left: 0;
}
.about-purpose .ap-item--reset {
  top: 0;
  right: 0;
}
.about-purpose .ap-item--rhythm {
  bottom: 0;
  left: 0;
}
.about-purpose .ap-item--release {
  bottom: 0;
  right: 0;
}
.about-purpose .ap-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  overflow: visible;
}

.about-purpose .ap-inner {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 18%;
  color: var(--ap-ink);
}
.about-purpose .ap-icon {
  display: block;
  width: 40px;
  margin-bottom: var(--spacing-md);
  color: var(--chasenut-500);
}
.about-purpose .ap-icon svg,
.about-purpose .ap-icon img {
  display: block;
  width: 100%;
  height: auto;
}
.about-purpose .ap-item-title {
  margin: 0;
  font-family: var(--heading-font);
  font-weight: 400;
  font-size: var(--font-size-4xl);
  white-space: nowrap;
  color: var(--chasenut-500);
}
.about-purpose .ap-item-sub {
  margin: var(--spacing-xs) 0 0;
  font-family: var(--body-font);
  font-size: var(--font-size-md);
  color: var(--chasenut-300);
}

.about-purpose .ap-cta {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: 500;
  color: var(--chasenut-500);
  transition: color 0.3s ease;
  margin-top: var(--spacing-md);
}

.about-purpose .ap-cta .chev {
  transition: transform 0.3s ease;
}

.about-purpose .ap-cta:hover {
  color: var(--chasenut-400);
}

.about-purpose .ap-cta:hover .chev-left {
  transform: translateX(-3px);
}

.about-purpose .ap-cta:hover .chev-right {
  transform: translateX(3px);
}

.about-purpose .ap-emblem {
  position: absolute;
  inset: 0;
  margin: auto;
  z-index: 2;
  width: clamp(40px, 4.6vw, 56px);
  height: clamp(40px, 4.6vw, 56px);
  opacity: 0;
  transition: opacity 0.7s ease 0.5s;
}
.about-purpose .ap-emblem svg {
  display: block;
  width: 100%;
  height: 100%;
}
.about-purpose .ap-grid.is-inview .ap-emblem {
  opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .about-purpose .ap-emblem {
    opacity: 1;
    transition: none;
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .about-purpose {
    --ap-d: clamp(230px, 40vw, 340px);
    padding-top: var(--spacing-3xl);
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 767px) {
  .about-purpose {
    --ap-d: min(86vw, 400px);
  }
  .about-purpose .ap-grid {
    width: auto;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .about-purpose .ap-item {
    position: relative;
    inset: auto;
  }
  .about-purpose .ap-item + .ap-item {
    margin-top: calc(var(--ap-d) * -0.1);
  }
  .about-purpose .ap-emblem {
    display: none;
  }

  .about-purpose .ap-cta {
    font-size: var(--font-size-sm);
  }

  .about-purpose .ap-icon {
    width: 32px;
  }
}

/*==================================================================
  ABOUT VIDEO
==================================================================*/
.about-video {
}
.about-video .av-player {
  position: relative;
  max-width: 100%;
  margin: 0 auto;
  aspect-ratio: 16 / 9;
  border-radius: var(--rounded-2xl);
  overflow: hidden;
  isolation: isolate;
}
.about-video .av-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  cursor: pointer;
}
.about-video .av-video:focus-visible {
  outline: 3px solid var(--sandstone-100);
  outline-offset: -3px;
}

/* ---- thumbnail ---- */
.about-video .av-poster {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  transition:
    opacity 0.5s ease,
    visibility 0s linear 0s;
}
.about-video .av-poster img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.about-video .av-player.is-started .av-poster {
  opacity: 0;
  visibility: hidden;
  transition:
    opacity 0.5s ease,
    visibility 0s linear 0.5s;
}

/* ---- big centre play ---- */
.about-video .av-bigplay {
  position: absolute;
  inset: 0;
  margin: auto;
  z-index: 3;
  width: 82px;
  height: 82px;
  padding: 0;
  border: 0;
  background: none;
  color: var(--sandstone-100);
  cursor: pointer;
  display: grid;
  place-items: center;
  filter: drop-shadow(0 6px 20px rgba(0, 0, 0, 0.4));
  transition:
    transform 0.35s ease,
    opacity 0.35s ease,
    color 0.35s ease;
}
.about-video .av-bigplay svg {
  width: 100%;
  height: 100%;
  display: block;
}
.about-video .av-bigplay:hover {
  transform: scale(1.06);
  color: #fff;
}
.about-video .av-player.is-playing .av-bigplay {
  opacity: 0;
  transform: scale(0.8);
  pointer-events: none;
}

/* ---- controls bar ---- */
.about-video .av-controls {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  gap: clamp(10px, 1.4vw, 18px);
  padding: clamp(14px, 1.8vw, 22px) clamp(14px, 1.9vw, 24px)
    clamp(10px, 1.5vw, 18px);
  color: var(--sandstone-100);
  background: linear-gradient(to top, rgba(10, 5, 2, 0.62), rgba(10, 5, 2, 0));
  opacity: 0;
  transform: translateY(6px);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}
.about-video .av-player:hover .av-controls,
.about-video .av-player:focus-within .av-controls,
.about-video .av-player.is-playing .av-controls,
.about-video .av-player.is-started .av-controls {
  opacity: 1;
  transform: none;
}

.about-video .av-btn {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  cursor: pointer;
  transition: opacity 0.3s ease;
}
.about-video .av-btn:hover {
  opacity: 0.75;
}
.about-video .av-btn:focus-visible {
  outline: 2px solid var(--sandstone-100);
  outline-offset: 2px;
  border-radius: 50%;
}
.about-video .av-ico {
  width: 24px;
  height: 24px;
  display: block;
}
.about-video .av-ico--pause,
.about-video .av-ico--muted {
  display: none;
}
.about-video .av-player.is-playing .av-toggle .av-ico--play {
  display: none;
}
.about-video .av-player.is-playing .av-toggle .av-ico--pause {
  display: block;
}
.about-video .av-player.is-muted .av-mute .av-ico--vol {
  display: none;
}
.about-video .av-player.is-muted .av-mute .av-ico--muted {
  display: block;
}

/* ---- seek ---- */
.about-video .av-seek {
  flex: 1 1 auto;
  height: 2px;
  margin: 0;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 999px;
  cursor: pointer;
  background-color: rgba(249, 245, 238, 0.3);
  background-image: linear-gradient(var(--sandstone-100), var(--sandstone-100));
  background-repeat: no-repeat;
  background-size: var(--seek, 0%) 100%;
}
.about-video .av-seek::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 10px;
  height: 10px;
  border: 0;
  border-radius: 50%;
  background: var(--sandstone-100);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
}
.about-video .av-seek::-moz-range-thumb {
  width: 13px;
  height: 13px;
  border: 0;
  border-radius: 50%;
  background: var(--sandstone-100);
}
.about-video .av-seek:focus-visible {
  outline: 2px solid var(--sandstone-100);
  outline-offset: 4px;
}

.about-video .av-time {
  flex: none;
  font-family: var(--body-font);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  color: rgba(249, 245, 238, 0.9);
  white-space: nowrap;
}
.about-video .av-sep {
  opacity: 0.5;
}

@media (prefers-reduced-motion: reduce) {
  .about-video .av-bigplay,
  .about-video .av-controls {
    transition: opacity 0.2s ease;
  }
  .about-video .av-bigplay:hover {
    transform: none;
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 639px) {
  .about-video .av-time {
    display: none;
  }
  .about-video .av-controls {
    gap: 8px;
  }

  .about-video .av-bigplay {
    width: 48px;
    height: 48px;
  }

  .about-video .av-player {
    position: relative;
    max-width: 100%;
    margin: 0 auto;
    aspect-ratio: 3 / 4;
  }
}

/*==================================================================
  ABOUT ENVIRONMENT
==================================================================*/
.about-enviorement {
  color: var(--sandstone-500);
  padding-block: var(--spacing-8xl);
  overflow: hidden;
}
.about-enviorement .tr.js-reveal:not([data-tr-ready]) {
  visibility: hidden;
}

.about-enviorement .heading {
  max-width: var(--container-sm);
  margin-inline: auto 0;
  text-align: right;
  margin-bottom: var(--spacing-2xl);
}

.about-enviorement .env-inner {
  position: relative;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr max-content 1fr;
  width: max-content;
  gap: var(--spacing-3xl);
}

.about-enviorement .env-note {
  margin: 0;
  font-family: var(--body-font);
  font-weight: 300;
  line-height: 1.35;
  color: var(--chasenut-100);
  max-width: 400px;
  font-size: var(--font-size-5xl);
}
.about-enviorement .env-note--top {
  text-align: right;
}
.about-enviorement .env-note--bottom {
  align-self: flex-end;
}

.about-enviorement .env-pills {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
}
.about-enviorement .env-pill {
  transform: translateX(var(--x, 0));
}
.about-enviorement .env-pill:nth-child(1) {
  --x: 10px;
}
.about-enviorement .env-pill:nth-child(2) {
  --x: -40px;
}
.about-enviorement .env-pill:nth-child(3) {
  --x: 20px;
}
.about-enviorement .env-pill:nth-child(4) {
  --x: -60px;
}
.about-enviorement .env-pill:nth-child(5) {
  --x: 30px;
}

.about-enviorement .env-chip {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: var(--spacing-ml) var(--spacing-xl);
  border: 1px solid var(--sandstone-500);
  border-radius: var(--rounded-full);
  white-space: nowrap;
}
.about-enviorement .env-ico {
  display: block;
  flex: none;
  width: 32px;
  color: var(--sandstone-500);
}
.about-enviorement .env-ico svg,
.about-enviorement .env-ico img {
  display: block;
  width: 100%;
  height: auto;
}
.about-enviorement .env-label {
  font-family: var(--body-font);
  font-weight: 400;
  font-size: var(--font-size-3xl);
  color: var(--sandstone-500);
}

@media screen and (max-width: 1279px) {
  .about-enviorement .env-inner {
    width: 100%;
  }

  .about-enviorement .env-note {
    max-width: 400px;
    font-size: var(--font-size-4xl);
  }

  .about-enviorement .env-label {
    font-size: var(--font-size-2xl);
  }
}

/* ---- tablet ---- */
@media screen and (max-width: 1023px) {
  .about-enviorement .env-note {
    max-width: 360px;
    font-size: var(--font-size-2xl);
  }

  .about-enviorement .env-label {
    font-size: var(--font-size-xl);
  }

  .about-enviorement .env-chip {
    padding: var(--spacing-md) var(--spacing-xl);
  }
  .about-enviorement .env-ico {
    width: 24px;
  }
}

/* ---- mobile ---- */
@media screen and (max-width: 767px) {
  .about-enviorement .env-inner {
    position: static;
    min-height: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-2xl);
    text-align: center;
  }
}

/*==================================================================
  ABOUT MARQUEE
==================================================================*/
.about-template .image-marquee {
  padding-bottom: var(--spacing-4xl);
}
.about-template .image-marquee .action {
  margin: var(--spacing-3xl) auto 0;
  text-align: center;
}

.about-template .image-marquee .action .btn-double-arrow {
  color: var(--chasenut-500);
  border-color: var(--chasenut-500);
}