:root {
  --paper: #f8efdf;
  --paper-light: #fff8ed;
  --paper-warm: #ecdcc2;
  --ink: #4f3452;
  --ink-soft: #67556e;
  --clay: #ad745e;
  --gold: #ba8d3a;
  --leaf: #73835b;
  --blue: #6f879d;
  --line: rgba(91, 61, 82, 0.18);
  --shadow: 0 1.5rem 4rem rgba(90, 58, 64, 0.12);
  --max: 72rem;
  --body: "Alegreya Sans", "Trebuchet MS", sans-serif;
  --hand: "Mali", "Segoe Print", "Comic Sans MS", cursive;
}

* {
  box-sizing: border-box;
}

html {
  background: var(--paper);
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  color: var(--ink);
  font-family: var(--body);
  background-color: var(--paper);
  background-image:
    radial-gradient(circle at 18% 12%, rgba(190, 146, 82, 0.15), transparent 15rem),
    radial-gradient(circle at 76% 22%, rgba(122, 142, 101, 0.13), transparent 17rem),
    radial-gradient(circle at 58% 72%, rgba(122, 132, 153, 0.12), transparent 18rem),
    radial-gradient(circle at 1px 1px, rgba(89, 58, 80, 0.12) 1px, transparent 1.4px);
  background-size: auto, auto, auto, 9px 9px;
  overflow-x: hidden;
}

body::before,
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

body::before {
  opacity: 0.45;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(255, 255, 255, 0.5), transparent 11rem),
    radial-gradient(circle at 88% 70%, rgba(172, 116, 96, 0.12), transparent 20rem),
    radial-gradient(circle at 36% 90%, rgba(115, 131, 91, 0.14), transparent 17rem);
}

body::after {
  opacity: 0.18;
  background-image:
    radial-gradient(circle at 8% 12%, rgba(80, 52, 82, 0.18) 0.05rem, transparent 0.11rem),
    radial-gradient(circle at 72% 48%, rgba(93, 62, 83, 0.14) 0.04rem, transparent 0.1rem);
  background-size: 2.8rem 2.8rem, 3.7rem 3.7rem;
}

a {
  color: inherit;
}

p,
li,
dd {
  margin: 0;
  color: var(--ink-soft);
  font-size: clamp(1.05rem, 1.35vw, 1.18rem);
  line-height: 1.78;
}

h1,
h2,
h3,
dl,
dd {
  margin: 0;
}

h1,
h2,
h3,
.brand {
  font-family: var(--hand);
  font-weight: 500;
  color: var(--ink);
  text-wrap: balance;
}

h1 {
  max-width: 12ch;
  font-size: clamp(3.15rem, 8.8vw, 7rem);
  line-height: 0.9;
  letter-spacing: -0.07em;
}

h2 {
  max-width: 13ch;
  font-size: clamp(2.2rem, 5.6vw, 4.7rem);
  line-height: 0.94;
  letter-spacing: -0.055em;
}

h3 {
  font-size: clamp(1.65rem, 3.1vw, 2.65rem);
  line-height: 1;
  letter-spacing: -0.04em;
}

.skip-link {
  position: fixed;
  top: 0.8rem;
  left: 0.8rem;
  z-index: 100;
  padding: 0.55rem 0.8rem;
  border-radius: 1rem;
  background: var(--paper-light);
  color: var(--ink);
  transform: translateY(-160%);
}

.skip-link:focus {
  transform: translateY(0);
}

.site-header {
  position: fixed;
  top: 1rem;
  left: 0;
  right: 0;
  z-index: 40;
  pointer-events: none;
}

.header-inner,
.section-inner {
  width: min(var(--max), calc(100% - 2rem));
  margin: 0 auto;
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.82rem 1rem;
  border: 1px solid rgba(116, 87, 72, 0.18);
  border-radius: 2.2rem 2.7rem 2.1rem 2.55rem;
  background-color: rgba(252, 244, 230, 0.78);
  background-image:
    radial-gradient(circle at 14% 12%, rgba(255, 255, 255, 0.64), transparent 8rem),
    radial-gradient(circle at 88% 35%, rgba(183, 139, 61, 0.11), transparent 8rem);
  box-shadow: 0 0.7rem 2.5rem rgba(77, 52, 58, 0.09);
  backdrop-filter: blur(14px);
  pointer-events: auto;
}

.brand {
  flex: 0 0 auto;
  color: #55355a;
  font-size: clamp(1.28rem, 2.3vw, 1.9rem);
  letter-spacing: -0.04em;
  text-decoration: none;
}

.main-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.18rem 0.42rem;
}

.main-nav a {
  display: inline-flex;
  padding: 0.38rem 0.58rem;
  border-radius: 1.5rem 1.7rem 1.45rem 1.9rem;
  color: #68526d;
  font-family: var(--hand);
  font-size: 0.9rem;
  text-decoration: none;
  transition: color 700ms ease, background-color 700ms ease, transform 700ms ease;
}

.main-nav a:hover,
.main-nav a:focus-visible,
.main-nav a[aria-current="page"] {
  color: #4f3452;
  background-color: rgba(154, 109, 91, 0.12);
  transform: translateY(-0.08rem) rotate(-0.3deg);
}

.hero {
  position: relative;
  overflow: hidden;
}

.hero-home {
  min-height: 100svh;
  display: grid;
  align-items: center;
  padding: 8.8rem 0 4.5rem;
  background: var(--paper-light);
}

.hero-paper {
  position: absolute;
  inset: 0;
  overflow: hidden;
  isolation: isolate;
  background-color: #fbf1e2;
}

.hero-paper::before,
.hero-paper::after {
  content: "";
  position: absolute;
  inset: -12%;
  pointer-events: none;
}

.hero-paper::before {
  opacity: 0.38;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(107, 80, 74, 0.16) 1px, transparent 1.55px),
    radial-gradient(circle at 11% 31%, rgba(92, 64, 77, 0.14) 0.04rem, transparent 0.11rem),
    radial-gradient(circle at 64% 14%, rgba(92, 64, 77, 0.1) 0.04rem, transparent 0.12rem);
  background-size: 10px 10px, 2.9rem 2.9rem, 4.1rem 4.1rem;
}

.hero-paper::after {
  opacity: 0.2;
  background-image:
    radial-gradient(circle at 16% 20%, rgba(109, 77, 71, 0.16) 0.05rem, transparent 0.1rem),
    radial-gradient(circle at 78% 68%, rgba(97, 71, 87, 0.14) 0.05rem, transparent 0.11rem);
  background-size: 3rem 3rem, 4rem 4rem;
}

.wash-layer,
.paper-glow,
.pigment {
  position: absolute;
  display: block;
  pointer-events: none;
}

.wash-layer {
  width: 36rem;
  height: 30rem;
  border: 0.28rem solid var(--wash-edge);
  border-radius: 54% 46% 52% 48% / 44% 49% 51% 56%;
  background-color: var(--wash-base);
  mix-blend-mode: multiply;
  filter: blur(22px) saturate(1.28) contrast(1.08);
  opacity: 0;
  transform-origin: center;
  box-shadow:
    0 0 0 1.1rem var(--wash-ring),
    1.8rem -1.2rem 0 0 var(--wash-shadow),
    -1.4rem 1.6rem 0 0 var(--wash-shadow-alt),
    0 0 5rem 1rem var(--wash-haze),
    inset -2rem -1.4rem 0 var(--wash-pool);
  animation: deep-wash 54s ease-in-out infinite;
}

.wash-layer::before,
.wash-layer::after,
.pigment::before,
.pigment::after {
  content: "";
  position: absolute;
  display: block;
}

.wash-layer::before {
  inset: 14% 18% 24% 18%;
  border-radius: 61% 39% 58% 42% / 47% 53% 47% 53%;
  background-color: var(--wash-deep);
  opacity: 0.62;
  filter: blur(7px);
}

.wash-layer::after {
  inset: 60% 11% 10% 40%;
  border-radius: 48% 52% 58% 42% / 52% 48% 52% 48%;
  background-color: var(--wash-pool);
  opacity: 0.58;
  filter: blur(4px);
}

.wash-violet {
  --wash-base: rgba(89, 49, 105, 0.44);
  --wash-edge: rgba(133, 88, 156, 0.36);
  --wash-ring: rgba(93, 51, 117, 0.16);
  --wash-shadow: rgba(140, 95, 165, 0.22);
  --wash-shadow-alt: rgba(57, 30, 74, 0.18);
  --wash-haze: rgba(92, 54, 109, 0.24);
  --wash-deep: rgba(75, 39, 91, 0.58);
  --wash-pool: rgba(55, 27, 69, 0.36);
  top: 12%;
  left: 43%;
  animation-delay: 0.8s;
}

.wash-indigo {
  --wash-base: rgba(45, 63, 110, 0.42);
  --wash-edge: rgba(84, 113, 172, 0.34);
  --wash-ring: rgba(55, 78, 138, 0.16);
  --wash-shadow: rgba(62, 96, 168, 0.2);
  --wash-shadow-alt: rgba(28, 43, 82, 0.18);
  --wash-haze: rgba(39, 63, 112, 0.24);
  --wash-deep: rgba(34, 53, 96, 0.54);
  --wash-pool: rgba(24, 39, 77, 0.34);
  top: 39%;
  left: 21%;
  width: 33rem;
  height: 26rem;
  animation-delay: 4.8s;
}

.wash-burnt {
  --wash-base: rgba(138, 61, 46, 0.38);
  --wash-edge: rgba(173, 93, 73, 0.32);
  --wash-ring: rgba(132, 59, 46, 0.15);
  --wash-shadow: rgba(169, 86, 61, 0.22);
  --wash-shadow-alt: rgba(90, 38, 32, 0.18);
  --wash-haze: rgba(132, 60, 46, 0.22);
  --wash-deep: rgba(112, 47, 36, 0.52);
  --wash-pool: rgba(79, 31, 24, 0.34);
  top: 47%;
  left: 47%;
  width: 31rem;
  height: 25rem;
  animation-delay: 8.2s;
}

.wash-forest {
  --wash-base: rgba(53, 85, 58, 0.36);
  --wash-edge: rgba(85, 121, 89, 0.3);
  --wash-ring: rgba(52, 88, 57, 0.15);
  --wash-shadow: rgba(72, 112, 77, 0.2);
  --wash-shadow-alt: rgba(33, 58, 36, 0.18);
  --wash-haze: rgba(50, 84, 55, 0.22);
  --wash-deep: rgba(40, 66, 44, 0.48);
  --wash-pool: rgba(27, 48, 30, 0.32);
  top: 58%;
  left: 63%;
  width: 28rem;
  height: 22rem;
  animation-delay: 11.4s;
}

.paper-glow {
  border-radius: 50%;
  background-color: rgba(255, 247, 235, 0.86);
  filter: blur(40px);
  opacity: 0;
  animation: paper-glow 58s ease-in-out infinite;
}

.glow-one {
  top: 10%;
  left: -3%;
  width: 29rem;
  height: 22rem;
  animation-delay: 3.8s;
}

.glow-two {
  top: 18%;
  left: 67%;
  width: 18rem;
  height: 16rem;
  animation-delay: 12.5s;
}

.pigment {
  width: 27rem;
  height: 24rem;
  border-radius: 52% 48% 47% 53% / 42% 48% 52% 58%;
  border: 0.22rem solid var(--pigment-edge);
  background-color: var(--pigment-base);
  filter: blur(15px) saturate(1.35) contrast(1.12);
  opacity: 0;
  mix-blend-mode: multiply;
  transform-origin: center;
  box-shadow:
    0 0 0 0.9rem var(--pigment-ring),
    1.2rem -0.8rem 0 0 var(--pigment-shadow),
    -1rem 1.4rem 0 0 var(--pigment-shadow-alt),
    0 0 3.8rem 0.8rem var(--pigment-haze);
  animation: pigment-bloom 46s ease-in-out infinite;
}

.pigment::before {
  inset: 14% 16% 22% 18%;
  border-radius: 61% 39% 58% 42% / 47% 53% 47% 53%;
  background-color: var(--pigment-core);
  opacity: 0.74;
  filter: blur(6px);
}

.pigment::after {
  inset: 64% 10% 8% 42%;
  border-radius: 48% 52% 58% 42% / 52% 48% 52% 48%;
  background-color: var(--pigment-pool);
  opacity: 0.6;
  filter: blur(3px);
}

.pigment-gold {
  --pigment-base: rgba(201, 145, 36, 0.54);
  --pigment-edge: rgba(165, 115, 25, 0.32);
  --pigment-ring: rgba(203, 146, 39, 0.14);
  --pigment-shadow: rgba(224, 178, 64, 0.24);
  --pigment-shadow-alt: rgba(148, 96, 19, 0.18);
  --pigment-haze: rgba(200, 146, 39, 0.24);
  --pigment-core: rgba(182, 122, 26, 0.6);
  --pigment-pool: rgba(135, 85, 14, 0.42);
  top: 18%;
  left: 47%;
  animation-delay: 1.4s;
}

.pigment-green {
  --pigment-base: rgba(71, 114, 66, 0.5);
  --pigment-edge: rgba(53, 88, 49, 0.3);
  --pigment-ring: rgba(72, 117, 62, 0.14);
  --pigment-shadow: rgba(102, 143, 96, 0.22);
  --pigment-shadow-alt: rgba(45, 72, 40, 0.18);
  --pigment-haze: rgba(72, 117, 62, 0.22);
  --pigment-core: rgba(61, 99, 57, 0.56);
  --pigment-pool: rgba(39, 64, 35, 0.38);
  top: 28%;
  left: 58%;
  width: 26rem;
  height: 28rem;
  border-radius: 47% 53% 58% 42% / 49% 54% 46% 51%;
  animation-delay: 4.8s;
}

.pigment-blue {
  --pigment-base: rgba(63, 89, 142, 0.54);
  --pigment-edge: rgba(47, 68, 115, 0.32);
  --pigment-ring: rgba(63, 89, 142, 0.14);
  --pigment-shadow: rgba(94, 122, 180, 0.22);
  --pigment-shadow-alt: rgba(38, 53, 92, 0.18);
  --pigment-haze: rgba(63, 89, 142, 0.22);
  --pigment-core: rgba(52, 74, 124, 0.6);
  --pigment-pool: rgba(32, 47, 83, 0.4);
  top: 46%;
  left: 22%;
  width: 25rem;
  height: 22rem;
  border-radius: 58% 42% 49% 51% / 43% 55% 45% 57%;
  animation-delay: 7.2s;
}

.pigment-rose {
  --pigment-base: rgba(154, 69, 54, 0.54);
  --pigment-edge: rgba(123, 52, 40, 0.32);
  --pigment-ring: rgba(154, 69, 54, 0.14);
  --pigment-shadow: rgba(182, 89, 73, 0.22);
  --pigment-shadow-alt: rgba(99, 39, 30, 0.18);
  --pigment-haze: rgba(154, 69, 54, 0.22);
  --pigment-core: rgba(134, 56, 43, 0.6);
  --pigment-pool: rgba(92, 34, 26, 0.4);
  top: 62%;
  left: 53%;
  width: 23rem;
  height: 22rem;
  border-radius: 46% 54% 42% 58% / 55% 45% 55% 45%;
  animation-delay: 10.2s;
}

.pigment-purple {
  --pigment-base: rgba(102, 56, 124, 0.56);
  --pigment-edge: rgba(78, 38, 97, 0.32);
  --pigment-ring: rgba(102, 56, 124, 0.14);
  --pigment-shadow: rgba(132, 84, 156, 0.22);
  --pigment-shadow-alt: rgba(61, 28, 77, 0.18);
  --pigment-haze: rgba(102, 56, 124, 0.24);
  --pigment-core: rgba(85, 45, 107, 0.62);
  --pigment-pool: rgba(57, 27, 72, 0.4);
  top: 13%;
  left: 8%;
  width: 24rem;
  height: 23rem;
  border-radius: 49% 51% 61% 39% / 45% 48% 52% 55%;
  animation-delay: 12.8s;
}

.pigment-forest {
  --pigment-base: rgba(54, 88, 57, 0.48);
  --pigment-edge: rgba(39, 66, 42, 0.28);
  --pigment-ring: rgba(54, 88, 57, 0.13);
  --pigment-shadow: rgba(76, 114, 79, 0.2);
  --pigment-shadow-alt: rgba(31, 50, 34, 0.17);
  --pigment-haze: rgba(54, 88, 57, 0.2);
  --pigment-core: rgba(44, 72, 47, 0.54);
  --pigment-pool: rgba(26, 43, 28, 0.36);
  top: 66%;
  left: 67%;
  width: 22rem;
  height: 19rem;
  border-radius: 55% 45% 58% 42% / 48% 52% 48% 52%;
  animation-delay: 15.7s;
}

.hero-layout,
.page-hero-layout,
.two-column,
.meet-layout,
.details-layout {
  display: grid;
  gap: clamp(2rem, 7vw, 7rem);
}

.hero-layout {
  position: relative;
  z-index: 2;
  grid-template-columns: minmax(0, 0.95fr) minmax(16rem, 0.76fr);
  align-items: center;
}

.hero-copy {
  max-width: 42rem;
}

.lead {
  max-width: 38rem;
  margin-top: 1rem;
  font-size: clamp(1.12rem, 2vw, 1.35rem);
}

.eyebrow {
  display: inline-block;
  margin-bottom: 0.78rem;
  color: #8e676d;
  font-family: var(--hand);
  font-size: 0.82rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: lowercase;
}

.symbol-seat {
  justify-self: center;
  width: min(22rem, 78vw);
  min-height: 21rem;
  display: grid;
  place-items: center;
  padding: 2rem;
  text-align: center;
  border: 1px dashed rgba(135, 107, 63, 0.36);
  border-radius: 55% 45% 48% 52% / 44% 54% 46% 56%;
  color: #6b5e4f;
  background-color: rgba(255, 249, 235, 0.36);
  background-image:
    radial-gradient(circle at 44% 38%, rgba(193, 148, 66, 0.18), transparent 5rem),
    radial-gradient(circle at 55% 62%, rgba(114, 131, 91, 0.15), transparent 6rem);
  box-shadow: var(--shadow);
  transform: rotate(1.8deg);
}

.symbol-seat span {
  max-width: 13rem;
  font-family: var(--hand);
  font-size: 1.2rem;
  line-height: 1.45;
}

.section {
  position: relative;
  padding: clamp(4.5rem, 8vw, 8rem) 0;
}

.section::before {
  content: "";
  position: absolute;
  top: 0;
  left: 14%;
  right: 18%;
  height: 1px;
  background-image: radial-gradient(circle, rgba(93, 62, 83, 0.28) 0.02rem, transparent 0.06rem);
  background-size: 0.65rem 1px;
}

.practice-threads {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.92fr);
  gap: clamp(2rem, 7vw, 7rem);
  margin-top: clamp(2.4rem, 5vw, 4.5rem);
}

.practice-threads article {
  position: relative;
  padding: clamp(1.1rem, 3vw, 2rem);
  border-radius: 2.5rem 3.2rem 2.4rem 3rem;
}

.practice-threads article::before {
  content: "";
  position: absolute;
  inset: -0.8rem -0.5rem;
  z-index: -1;
  border-radius: inherit;
  opacity: 0.62;
  background-image:
    radial-gradient(circle at 24% 18%, rgba(108, 132, 153, 0.13), transparent 10rem),
    radial-gradient(circle at 80% 78%, rgba(148, 102, 127, 0.12), transparent 9rem);
}

.practice-threads article:nth-child(2) {
  margin-top: 3rem;
}

.practice-threads article:nth-child(2)::before {
  background-image:
    radial-gradient(circle at 20% 78%, rgba(114, 131, 91, 0.16), transparent 10rem),
    radial-gradient(circle at 86% 20%, rgba(184, 139, 61, 0.13), transparent 9rem);
}

.practice-threads p,
.prose p,
.details-garden,
.quiet-note {
  max-width: 42rem;
  margin-top: 1rem;
}

.prose p + p {
  margin-top: 1rem;
}

.text-link {
  display: inline-flex;
  margin-top: 1.2rem;
  color: #785e2d;
  font-family: var(--hand);
  font-weight: 600;
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.22em;
  transition: transform 700ms ease, color 700ms ease;
}

.text-link:hover,
.text-link:focus-visible {
  color: #5f723f;
  transform: translateY(-0.08rem) rotate(-0.25deg);
}

.soft-wash {
  background-image:
    radial-gradient(circle at 18% 34%, rgba(255, 255, 255, 0.5), transparent 17rem),
    radial-gradient(circle at 82% 55%, rgba(115, 131, 91, 0.12), transparent 20rem);
}

.meet-layout {
  grid-template-columns: minmax(13rem, 0.55fr) minmax(0, 0.8fr) minmax(0, 1fr);
  align-items: center;
}

.garden-wash {
  min-height: clamp(16rem, 32vw, 28rem);
  border-radius: 61% 39% 57% 43% / 50% 55% 45% 50%;
  background-color: rgba(247, 235, 212, 0.42);
  background-image:
    radial-gradient(circle at 36% 28%, rgba(113, 131, 91, 0.34), transparent 8rem),
    radial-gradient(circle at 58% 58%, rgba(181, 132, 61, 0.2), transparent 10rem),
    radial-gradient(circle at 40% 76%, rgba(107, 131, 153, 0.15), transparent 11rem);
  box-shadow: inset 0 0 4rem rgba(255, 255, 255, 0.5), var(--shadow);
  transform: rotate(-3deg);
}

.page-hero {
  min-height: 72svh;
  display: grid;
  align-items: end;
  padding: 10rem 0 clamp(4rem, 8vw, 7rem);
}

.page-hero-wash {
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle at 18% 22%, rgba(130, 96, 132, 0.18), transparent 18rem),
    radial-gradient(circle at 72% 28%, rgba(181, 132, 61, 0.17), transparent 22rem),
    radial-gradient(circle at 78% 78%, rgba(111, 131, 91, 0.13), transparent 24rem);
  animation: page-wash-breathe 28s ease-in-out infinite;
}

.page-hero-wash.green {
  background-image:
    radial-gradient(circle at 18% 22%, rgba(111, 131, 91, 0.17), transparent 18rem),
    radial-gradient(circle at 78% 26%, rgba(181, 132, 61, 0.14), transparent 22rem),
    radial-gradient(circle at 72% 78%, rgba(107, 131, 153, 0.13), transparent 24rem);
}

.page-hero-wash.rose {
  background-image:
    radial-gradient(circle at 18% 22%, rgba(107, 131, 153, 0.16), transparent 18rem),
    radial-gradient(circle at 75% 30%, rgba(172, 116, 96, 0.15), transparent 22rem),
    radial-gradient(circle at 74% 78%, rgba(111, 131, 91, 0.14), transparent 24rem);
}

.page-hero-layout {
  position: relative;
  z-index: 1;
  grid-template-columns: minmax(0, 0.9fr) minmax(17rem, 0.7fr);
  align-items: end;
}

.two-column,
.details-layout {
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1fr);
  align-items: start;
}

.soft-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.8rem 2rem;
  margin-top: 1.5rem;
}

.soft-list p {
  position: relative;
  padding-left: 1.6rem;
}

.soft-list p::before {
  content: "";
  position: absolute;
  top: 0.68rem;
  left: 0;
  width: 0.62rem;
  height: 0.62rem;
  border-radius: 50%;
  background-color: rgba(115, 131, 91, 0.5);
  box-shadow: 0.2rem 0.08rem 0 rgba(184, 139, 61, 0.24);
}

.research-note {
  padding-bottom: clamp(4rem, 7vw, 6rem);
}

.session-steps {
  display: grid;
  gap: 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.session-steps li {
  display: grid;
  gap: 0.2rem;
  padding: 0 0 1.05rem;
  border-bottom: 1px solid var(--line);
}

.session-steps strong {
  color: #5b3d5c;
  font-family: var(--hand);
  font-weight: 600;
}

.session-steps span {
  color: var(--ink-soft);
  font-size: clamp(1.02rem, 1.3vw, 1.12rem);
  line-height: 1.68;
}

.details-garden {
  padding: clamp(1.5rem, 4vw, 3rem);
  border: 1px solid rgba(116, 87, 72, 0.2);
  border-radius: 3rem 4.2rem 2.9rem 3.5rem;
  background-color: rgba(255, 249, 236, 0.4);
  background-image:
    radial-gradient(circle at 14% 18%, rgba(255, 255, 255, 0.55), transparent 10rem),
    radial-gradient(circle at 88% 74%, rgba(115, 131, 91, 0.14), transparent 15rem);
  box-shadow: var(--shadow);
}

.details-garden dl {
  display: grid;
  gap: 0.85rem;
}

.details-garden div {
  padding-bottom: 0.78rem;
  border-bottom: 1px dotted rgba(93, 62, 83, 0.22);
}

.details-garden dt {
  color: #5e405f;
  font-family: var(--hand);
  font-weight: 600;
}

.details-garden dd {
  margin-top: 0.14rem;
}

.contact-section {
  padding-top: clamp(3rem, 7vw, 6rem);
}

.contact-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.75fr) minmax(0, 1fr);
  gap: clamp(2rem, 6vw, 6rem);
  padding: clamp(2rem, 5vw, 4.5rem);
  border: 1px solid rgba(116, 87, 72, 0.22);
  border-radius: 3.4rem 4.5rem 3rem 4rem;
  background-color: rgba(255, 249, 236, 0.48);
  background-image:
    radial-gradient(circle at 18% 20%, rgba(255, 255, 255, 0.55), transparent 11rem),
    radial-gradient(circle at 86% 72%, rgba(115, 131, 91, 0.15), transparent 16rem),
    radial-gradient(circle at 70% 18%, rgba(181, 132, 61, 0.14), transparent 13rem);
  box-shadow: var(--shadow);
}

.booking-line {
  color: #4f3452;
  font-family: var(--hand);
  font-size: clamp(1.25rem, 2.2vw, 1.75rem);
  line-height: 1.45;
}

.phone-line {
  margin-top: 1.2rem;
}

.phone-line span {
  font-weight: 700;
}

.site-footer {
  padding: 1.5rem 0 3rem;
}

.footer-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.8rem 2rem;
  padding-top: 1.4rem;
  border-top: 1px solid var(--line);
}

.footer-inner p,
.footer-inner a {
  color: #735f74;
  font-size: 0.95rem;
}

.footer-inner nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 1rem;
}

.footer-inner a {
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.2em;
}

.js .reveal-item {
  opacity: 0;
  transform: translateY(1.15rem);
  transition: opacity 1200ms ease, transform 1200ms ease;
}

.js .reveal-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes deep-wash {
  0%,
  6% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(0.28) rotate(-4deg);
  }

  18% {
    opacity: 0.5;
    transform: translate3d(0.8rem, -0.5rem, 0) scale(0.94) rotate(1deg);
  }

  52% {
    opacity: 0.56;
    transform: translate3d(-0.6rem, 0.7rem, 0) scale(1.18) rotate(3deg);
  }

  82% {
    opacity: 0.34;
    transform: translate3d(0.5rem, -0.3rem, 0) scale(1.36) rotate(-2deg);
  }

  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(1.48) rotate(-3deg);
  }
}

@keyframes pigment-bloom {
  0%,
  4% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(0.12) rotate(-3deg);
  }

  16% {
    opacity: 0.82;
    transform: translate3d(0.8rem, -0.4rem, 0) scale(0.96) rotate(0.8deg);
  }

  44% {
    opacity: 0.74;
    transform: translate3d(-0.5rem, 0.6rem, 0) scale(1.18) rotate(2.4deg);
  }

  76% {
    opacity: 0.48;
    transform: translate3d(0.6rem, -0.2rem, 0) scale(1.34) rotate(-1deg);
  }

  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(1.54) rotate(-2deg);
  }
}

@keyframes paper-glow {
  0%,
  10% {
    opacity: 0;
    transform: translate3d(0, 0, 0) scale(0.85);
  }

  32% {
    opacity: 0.42;
    transform: translate3d(0, 0, 0) scale(1);
  }

  64% {
    opacity: 0.58;
    transform: translate3d(1rem, -0.8rem, 0) scale(1.14);
  }

  100% {
    opacity: 0.18;
    transform: translate3d(-0.6rem, 0.6rem, 0) scale(1.24);
  }
}

@keyframes page-wash-breathe {
  0%,
  100% {
    opacity: 0.8;
    transform: scale(1);
  }

  50% {
    opacity: 0.95;
    transform: scale(1.035);
  }
}

@media (max-width: 900px) {
  .header-inner {
    align-items: flex-start;
    flex-direction: column;
    border-radius: 1.8rem 2.3rem 2rem 2.15rem;
  }

  .main-nav {
    justify-content: flex-start;
  }

  .hero-layout,
  .page-hero-layout,
  .two-column,
  .meet-layout,
  .details-layout,
  .contact-panel,
  .practice-threads,
  .soft-list {
    grid-template-columns: 1fr;
  }

  .hero-home {
    align-items: end;
    padding-top: 10.5rem;
  }

  .symbol-seat {
    justify-self: start;
    width: min(19rem, 100%);
    min-height: 17rem;
  }

  .wash-violet {
    left: 34%;
    top: 12%;
  }

  .wash-indigo {
    left: 4%;
    top: 45%;
  }

  .wash-burnt {
    left: 36%;
    top: 52%;
  }

  .wash-forest {
    left: 50%;
    top: 64%;
  }

  .practice-threads article:nth-child(2) {
    margin-top: 0;
  }

  .garden-wash {
    min-height: 16rem;
  }
}

@media (max-width: 560px) {
  .header-inner,
  .section-inner {
    width: min(var(--max), calc(100% - 1.1rem));
  }

  .site-header {
    top: 0.55rem;
  }

  .header-inner {
    padding: 0.78rem;
  }

  .main-nav a {
    padding: 0.34rem 0.46rem;
    font-size: 0.82rem;
  }

  h1 {
    font-size: clamp(2.85rem, 17vw, 4.75rem);
  }

  h2 {
    font-size: clamp(2rem, 12vw, 3.2rem);
  }

  .page-hero {
    min-height: 64svh;
    padding-top: 11rem;
  }

  .wash-layer {
    width: 24rem;
    height: 20rem;
    filter: blur(18px) saturate(1.24) contrast(1.05);
  }

  .paper-glow {
    filter: blur(30px);
  }

  .glow-one {
    left: -10%;
    top: 12%;
    width: 22rem;
    height: 18rem;
  }

  .glow-two {
    left: 48%;
    top: 18%;
    width: 17rem;
    height: 14rem;
  }

  .wash-violet {
    left: 26%;
    top: 14%;
  }

  .wash-indigo {
    left: -8%;
    top: 46%;
  }

  .wash-burnt {
    left: 28%;
    top: 56%;
  }

  .wash-forest {
    left: 42%;
    top: 70%;
  }

  .pigment {
    width: 18rem;
    height: 16rem;
    filter: blur(12px) saturate(1.3) contrast(1.08);
  }

  .pigment-gold {
    left: 44%;
    top: 20%;
  }

  .pigment-green {
    left: 54%;
    top: 34%;
  }

  .pigment-blue {
    left: 0;
    top: 58%;
  }

  .pigment-rose {
    left: 34%;
    top: 64%;
  }

  .pigment-purple {
    left: -6%;
    top: 18%;
  }

  .pigment-forest {
    left: 48%;
    top: 72%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }

  .js .reveal-item {
    opacity: 1;
    transform: none;
  }
}