/* ============================================
   Dwell Dance Co. — "Sanctuary"
   Refined editorial luxury · classic · organic
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;1,9..144,300;1,9..144,400;1,9..144,500&family=Mulish:wght@300;400;500;600;700&family=Sacramento&family=Cormorant+Garamond:ital,wght@1,400;1,500;1,600&display=swap');

/* Handsome Pro Thin — the brand cursive. Drop the licensed web-font file(s) into
   /fonts named handsome-pro-thin.woff2 (or .woff/.otf/.ttf) and it activates here.
   Until the file exists, the wordmark falls back to Sacramento. */
@font-face {
  font-family: 'Handsome Pro';
  src: url('../fonts/handsome-pro-thin.woff2') format('woff2'),
       url('../fonts/handsome-pro-thin.woff') format('woff'),
       url('../fonts/handsome-pro-thin.otf') format('opentype'),
       url('../fonts/handsome-pro-thin.ttf') format('truetype');
  font-weight: 300 400;
  font-style: normal;
  font-display: swap;
}

:root {
  /* ---- Brand palette: golden sunflower + wine script on warm cream ---- */
  --bone:        #ece1ca;   /* warm sand-cream canvas (moodier than pale) */
  --paper:       #f5eedc;   /* warm ivory, raised / cards */
  --oat:         #ddcba8;   /* deeper alternating section */
  --stone:       #cbb88c;   /* deeper ground / fills */
  --ink:         #4a1528;   /* deep magenta (moody dark sections) */
  --espresso:    #6b2240;   /* deep magenta, headings (the strength color) */
  --text:        #4a3b2e;   /* warm body */
  --text-soft:   #8a7053;   /* muted warm */
  --brass:       #b3862f;   /* legible gold accent on cream */
  --brass-deep:  #8f6a1f;
  --line:        #cfb787;   /* hairline on warm grounds */
  --line-soft:   #dfceaa;
  --cream:       #f5ecd4;   /* text on dark */

  /* brand hues from the logo */
  --wine:        #8c2d4e;   /* the handwritten script color (magenta-wine) */
  --wine-deep:   #5e1c36;   /* flower center / deepest */
  --gold:        #d4ac56;   /* golden petals */
  --gold-soft:   #e6cf86;
  --forest:        #283c2e;  /* second deep color (deepened) */
  --forest-deep:   #1f2f23;
  --forest-accent: #36503f;
  --terracotta:  #c48b6c;
  --rose:        #8a2f4c;
  --blush:       #cf9a93;

  /* ---- Legacy token names repointed to the luxury system
         (so every existing component inherits the new look) ---- */
  --color-primary:        var(--brass);
  --color-primary-dark:   var(--brass-deep);
  --color-primary-light:  #b89a6d;
  --color-accent:         var(--brass);
  --color-accent-dark:    var(--brass-deep);
  --color-rose:           var(--rose);
  --color-rose-light:     #d49b9d;
  --color-sage:           #9a9a6f;   /* muted olive, used sparingly */
  --color-sage-light:     #b4b298;
  --color-gold:           var(--gold);
  --color-blush:          var(--blush);
  --color-plum:           #6b5550;

  --color-cream:          var(--cream);
  --color-sand:           var(--oat);
  --color-linen:          var(--oat);
  --color-warm-dark:      var(--ink);
  --color-warm-dark-surface: #2f2620;
  --color-warm-dark-lighter: #3a2f27;

  --color-white:          var(--paper);
  --color-off-white:      var(--bone);
  --color-light-gray:     var(--line);
  --color-mid-gray:       var(--text-soft);
  --color-text:           var(--text);
  --color-text-light:     var(--text-soft);
  --color-ink:            var(--espresso);
  --color-plum-deep:      #3a2c2a;
  --color-wine:           #5e3b3a;

  /* gradients neutralised to flat, refined tones */
  --gradient-primary: var(--ink);
  --gradient-warm:    var(--brass);
  --gradient-soft:    var(--stone);
  --gradient-sage:    var(--color-sage);
  --gradient-subtle:  transparent;

  /* whisper shadows (luxury = light, not heavy) */
  --shadow-sm: 0 1px 2px rgba(36,28,24,0.04);
  --shadow-md: 0 10px 34px rgba(36,28,24,0.06);
  --shadow-lg: 0 24px 60px rgba(36,28,24,0.07);
  --shadow-xl: 0 36px 90px rgba(36,28,24,0.09);
  --shadow-card-hover: 0 22px 55px rgba(36,28,24,0.09);

  /* typography */
  --font-heading: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-script: 'Handsome Pro', 'Sacramento', 'Segoe Script', cursive;
  --font-hand: 'Cormorant Garamond', Georgia, serif;

  /* radius (architectural, restrained) */
  --radius-sm: 2px;
  --radius-md: 3px;
  --radius-lg: 4px;
  --radius-xl: 6px;
  --radius-full: 100px;

  --container-max: 1200px;
  --measure: 680px;
  --section-padding: 140px 0;
}

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.85;
  color: var(--text);
  background: var(--bone);
  overflow-x: hidden;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--brass-deep); text-decoration: none; transition: color 0.4s ease; }
a:hover { color: var(--ink); }

::selection { background: var(--brass); color: var(--cream); }

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 300;
  line-height: 1.08;
  color: var(--espresso);
  letter-spacing: -0.02em;
}
h1 { font-size: clamp(2.8rem, 6vw, 5rem); }
h2 { font-size: clamp(2rem, 4vw, 3.2rem); }
h3 { font-size: clamp(1.4rem, 2.4vw, 1.9rem); font-weight: 400; letter-spacing: -0.01em; }
h4 { font-size: 1.1rem; font-weight: 400; }

/* organic hand-script for section subject headings (warmer, less businessy) */
h2, h3 { font-family: var(--font-script); font-weight: 400; letter-spacing: 0; line-height: 1.22; }
/* opt-in heading uses the hero serif, not the script */
.optin h2 { font-family: var(--font-display); font-weight: 400; letter-spacing: -0.01em; line-height: 1.2; font-size: clamp(1.6rem, 2.8vw, 2.1rem); }
h2 { font-size: clamp(2.6rem, 5vw, 4rem); }
h3 { font-size: clamp(1.9rem, 2.9vw, 2.5rem); }

em { font-style: italic; }

/* ---- Accessibility ---- */
.skip-link {
  position: absolute; top: -100%; left: 16px;
  background: var(--ink); color: var(--cream);
  padding: 10px 18px; border-radius: var(--radius-sm);
  z-index: 9999; font-size: 0.8rem; letter-spacing: 0.05em;
  transition: top 0.3s ease;
}
.skip-link:focus { top: 16px; }
:focus-visible { outline: 1px solid var(--brass); outline-offset: 4px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---- Layout ---- */
.container { max-width: var(--container-max); margin: 0 auto; padding: 0 32px; }
.section { padding: var(--section-padding); position: relative; }
.section--sand  { background: var(--oat); }
.section--linen { background: var(--oat); }
.section--cream { background: var(--bone); }
.section--ivory { background: var(--paper); }
.visit-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 22px; max-width: 760px; margin: 0 auto; }

.section--dark {
  background: var(--ink);
  color: var(--cream);
}
.section--dark h1, .section--dark h2, .section--dark h3, .section--dark h4 { color: var(--cream); }
.section--dark p { color: rgba(244,239,229,0.72); }

.section--forest { background: linear-gradient(150deg, var(--forest) 0%, var(--forest) 50%, var(--wine-deep) 100%); color: var(--cream); }
.section--forest h1, .section--forest h2, .section--forest h3, .section--forest h4 { color: var(--cream); }
.section--forest p { color: rgba(244,239,229,0.74); }
.section--forest .section__label { color: #cdbb86; }

.section__header { text-align: center; max-width: var(--measure); margin: 0 auto 72px; }
.section__header p {
  font-size: 1.1rem; color: var(--text-soft); margin-top: 18px;
  font-weight: 300; line-height: 1.8;
}
/* soft banner panel behind select section headers — delicate green double-frame */
.soft-banner {
  position: relative;
  max-width: none;
  width: 100vw;
  margin: 0 0 60px;
  margin-left: calc(50% - 50vw);
  background: var(--paper);
  border-top: 1.5px solid #3a5440;
  border-bottom: 1.5px solid #3a5440;
  padding: 62px 24px 56px;
}
.soft-banner p { max-width: 620px; margin-left: auto; margin-right: auto; }
/* full-bleed banner sits flush to the top of its section */
.section:has(> .container > .soft-banner) { padding-top: 0; }
/* magenta variant (Three Ways banner) */
.soft-banner--magenta { background: var(--ink); border-top-color: #7a9e7e; border-bottom-color: #7a9e7e; }
.soft-banner--magenta h2 { color: var(--cream); }
.soft-banner--magenta p { color: rgba(244,239,229,0.86); }
.soft-banner--magenta .section__label { color: var(--gold); }
.soft-banner--magenta .eyebrow-mark::before, .soft-banner--magenta .eyebrow-mark::after { background: var(--gold); }

/* ---- Eyebrow label ---- */
.section__label {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass); margin-bottom: 22px;
}
.section--dark .section__label { color: #c4a572; }
.eyebrow-mark { display: inline-flex; align-items: center; gap: 14px; }
.eyebrow-mark::before, .eyebrow-mark::after {
  content: ''; width: 28px; height: 1px; background: var(--brass); opacity: 0.55;
}

/* ---- Announcement bar ---- */
.announce {
  background: var(--ink);
  color: var(--cream);
  text-align: center;
  font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.16em; text-transform: uppercase;
  padding: 11px 16px;
}
.announce a { color: #d7bd92; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(215,189,146,0.4); padding-bottom: 1px; }
.announce a:hover { color: var(--cream); border-color: var(--cream); }

/* ---- Header & Nav ---- */
.header {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(246,241,232,0.85);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border-bottom: 1px solid transparent;
  transition: box-shadow 0.4s ease, border-color 0.4s ease, background 0.4s ease;
}
.header--scrolled { border-bottom-color: var(--line); background: rgba(246,241,232,0.94); }

.nav {
  display: flex; align-items: center; justify-content: space-between;
  max-width: var(--container-max); margin: 0 auto; padding: 22px 32px;
  gap: 28px;                 /* keeps the wordmark clear of the first link */
}
.nav__logo {
  font-family: var(--font-script); font-size: 2rem; font-weight: 400;
  color: var(--wine); letter-spacing: 0.01em; line-height: 1;
  display: flex; align-items: center; gap: 12px;
}
.nav__logo img { width: 46px; height: 46px; object-fit: contain; }
.nav__logo span { font-style: normal; color: var(--wine); }
/* The extra header button tightened the bar: keep the wordmark and the
   button labels on one line so nothing collides at mid widths. */
.nav__logo { white-space: nowrap; flex: 0 0 auto; }
.nav__links .btn { white-space: nowrap; }

.nav__links { display: flex; align-items: center; gap: 38px; list-style: none; }
/* Two buttons now sit in the bar, so the link gap tightens before the
   burger takes over rather than letting items collide. */
@media (max-width: 1460px) { .nav__links { gap: 24px; } }
@media (max-width: 1300px) { .nav__links { gap: 18px; } }
@media (max-width: 1200px) { .nav__links { gap: 13px; }
  .nav__links a { font-size: 0.68rem; letter-spacing: 0.11em; } }
.nav__links a {
  font-family: var(--font-body); font-size: 0.74rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--text); position: relative; transition: color 0.4s ease;
}
.nav__links a::after {
  content: ''; position: absolute; bottom: -6px; left: 0; width: 0; height: 1px;
  background: var(--brass); transition: width 0.4s ease;
}
.nav__links a:hover, .nav__links a.active { color: var(--ink); }
.nav__links a:hover::after, .nav__links a.active::after { width: 100%; }
.nav__links a.btn { letter-spacing: 0.16em; }
.nav__links a.btn--primary, .nav__links a.btn--primary:hover { color: var(--cream); }
.nav__links a.btn::after { display: none; }

.nav__toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; color: var(--ink); }
.nav__toggle svg { width: 24px; height: 24px; }

/* ---- Buttons (flat, tracked, luxury) ---- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--font-body); font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.18em; text-transform: uppercase;
  padding: 17px 38px; border-radius: 0; border: 1px solid transparent;
  cursor: pointer; transition: background 0.45s ease, color 0.45s ease, border-color 0.45s ease;
  text-decoration: none; line-height: 1;
}
.btn--primary { background: var(--ink); color: var(--cream); }
.btn--primary:hover { background: var(--brass-deep); color: var(--cream); }
.btn--outline { background: transparent; color: var(--ink); border-color: var(--ink); }
.btn--outline:hover { background: var(--ink); color: var(--cream); }
.btn--small { padding: 12px 26px; font-size: 0.66rem; }
.btn--dark { background: var(--brass); color: var(--cream); }
.btn--dark:hover { background: var(--cream); color: var(--ink); }
.btn--ghost { background: transparent; color: var(--text-soft); border: 1px solid var(--line); }
.btn--ghost:hover { border-color: var(--ink); color: var(--ink); }

/* outline on dark grounds */
.section--dark .btn--outline, .hero .btn--outline, .showcase-band .btn--outline {
  border-color: rgba(244,239,229,0.55); color: var(--cream);
}
.section--dark .btn--outline:hover, .hero .btn--outline:hover, .showcase-band .btn--outline:hover {
  background: var(--cream); color: var(--ink); border-color: var(--cream);
}

/* ---- Hero ---- */
.hero { position: relative; min-height: 92vh; display: flex; align-items: flex-end; overflow: hidden; }
.hero__bg { position: absolute; inset: 0; z-index: 0; }
.hero__bg picture { display: block; position: absolute; inset: 0; }
.hero__bg img, .hero__video {
  width: 100%; height: 100%; object-fit: cover; object-position: center 28%;
}
/* On a phone the hero swaps to a portrait crop framed on the dancer, so
   she is never cropped out into empty field. Less zoom too, so it stays sharp. */
@media (max-width: 760px) {
  .hero__bg img { object-position: center 30%; }
}
.hero__video { position: absolute; inset: 0; z-index: 0; }
.hero__overlay {
  position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to top, rgba(40,26,18,0.88) 0%, rgba(40,26,18,0.45) 48%, rgba(40,26,18,0.52) 100%);
}
.hero__content { position: relative; z-index: 2; max-width: 760px; padding: 0 0 110px; }
.hero .section__label { color: #e0c79e; margin-bottom: 26px; }
.hero h1 { color: #fdfaf3; margin-bottom: 26px; font-weight: 300; }
.hero h1 em { font-style: italic; color: #e7cda3; }
.hero__tagline {
  font-size: 1.2rem; font-weight: 300; color: rgba(253,250,243,0.9);
  margin-bottom: 42px; line-height: 1.75; max-width: 540px;
}
.hero__buttons { display: flex; gap: 18px; flex-wrap: wrap; align-items: center; }
.hero__meadow {
  position: absolute; left: 0; right: 0; bottom: 0; height: 120px; z-index: 3; pointer-events: none;
  background: url("../images/decor/footer-meadow.png") bottom center / auto 104px repeat-x,
              linear-gradient(to top, rgba(40,26,18,0.9) 28%, rgba(40,26,18,0) 100%);
}

/* ---- Hairline ornament divider ---- */
.rule-divider {
  display: flex; align-items: center; justify-content: center; gap: 20px;
  max-width: 360px; margin: 0 auto; color: var(--brass);
}
.rule-divider::before, .rule-divider::after {
  content: ''; height: 1px; flex: 1; background: var(--line);
}
.rule-divider span { font-size: 0.9rem; letter-spacing: 0.3em; }

/* ---- Section number (editorial) ---- */
.sec-num {
  font-family: var(--font-display); font-style: italic; font-weight: 300;
  font-size: 1.1rem; color: var(--forest-accent); letter-spacing: 0.05em; display: block; margin-bottom: 10px;
}

/* ---- Two-column editorial ---- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.split--reverse { direction: rtl; }
.split--reverse > * { direction: ltr; }
.split__image { border-radius: var(--radius-sm); overflow: hidden; position: relative; }
.split__image img, .split__image video {
  width: 100%; height: 100%; object-fit: cover; object-position: center 22%; aspect-ratio: 4 / 5;
}
.split__text .section__label { margin-bottom: 18px; }
.split__text h2 { margin-bottom: 24px; }
.split__text h3 { margin-bottom: 16px; line-height: 1.18; }
.split__text p { color: var(--text); font-weight: 300; margin-bottom: 28px; }

.text-link {
  font-family: var(--font-body); font-size: 0.74rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink);
  display: inline-flex; align-items: center; gap: 10px; position: relative; padding-bottom: 4px;
}
.text-link::after { content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 1px; background: var(--brass); transform: scaleX(1); transform-origin: left; transition: transform 0.4s ease; }
.text-link:hover { color: var(--brass-deep); gap: 14px; }

/* ---- Card grid (refined, hairline, no chrome) ---- */
.card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 4px; }
.card-grid--gap { gap: 36px; }
.card {
  background: var(--paper); border: 1px solid var(--line-soft);
  border-radius: var(--radius-sm); overflow: hidden; position: relative;
  transition: border-color 0.5s ease, transform 0.6s cubic-bezier(0.22,1,0.36,1);
}
.card:hover { border-color: var(--brass); }
.card__image { width: 100%; aspect-ratio: 3 / 4; overflow: hidden; }
.card__image img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; transition: transform 1.2s cubic-bezier(0.22,1,0.36,1); }
.card:hover .card__image img { transform: scale(1.05); }
.card__body { padding: 34px 30px 38px; }
.card__body h3 { margin-bottom: 14px; }
.card__body p { font-size: 0.96rem; font-weight: 300; color: var(--text-soft); margin-bottom: 18px; }
.card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-bottom: 12px; }
.card__head h3 { margin: 0; }
.card__tag {
  display: inline-block; font-size: 0.66rem; font-weight: 600; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--text-soft);
}
/* colored accents neutralised to a single quiet top hairline on hover */
.card__accent--rose, .card__accent--terracotta, .card__accent--sage, .card__accent--gold { border-top: none; }

.card__ribbon {
  position: absolute; top: 18px; left: 18px; z-index: 2;
  font-size: 0.62rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  padding: 7px 14px; background: rgba(28,21,17,0.78); color: var(--cream); backdrop-filter: blur(4px);
}
.card__meta { display: flex; flex-wrap: wrap; gap: 16px; margin: 0 0 16px; }
.card__meta span {
  font-size: 0.68rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--text-soft); position: relative;
}
.card__meta span + span::before { content: '·'; position: absolute; left: -10px; color: var(--line); }

/* ---- Availability (whisper-quiet) ---- */
.avail-badge {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--font-body); font-size: 0.64rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-soft);
}
.avail-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.avail-badge--open { color: #6f7a4e; }
.avail-badge--few  { color: var(--brass-deep); }
.avail-badge--full { color: var(--text-soft); }

/* ---- Photo break ---- */
.photo-break { position: relative; height: 64vh; min-height: 420px; overflow: hidden; }
.photo-break img { width: 100%; height: 116%; object-fit: cover; object-position: center 30%; position: absolute; top: -8%; }
.photo-break__overlay {
  position: absolute; inset: 0;
  /* Base tint plus a soft pool of shade behind the copy, so the quote still
     reads when the photo underneath is bright. */
  background:
    radial-gradient(ellipse 62% 58% at 50% 50%, rgba(40,26,18,0.52), rgba(40,26,18,0) 78%),
    rgba(40,26,18,0.42);
  display: flex; align-items: center; justify-content: center; text-align: center; padding: 32px;
}
.photo-break__quote {
  font-family: var(--font-hand); font-style: italic; font-weight: 400;
  font-size: clamp(2.2rem, 4.4vw, 3.4rem); color: #fdfaf3;
  max-width: 860px; line-height: 1.4; letter-spacing: 0;
}

/* ---- Testimonials ---- */
.testimonial-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 4px; }
.testimonial { background: var(--paper); border: 1px solid var(--line-soft); padding: 48px 40px; position: relative; }
.testimonial__quote-mark { display: none; }
.testimonial__stars { display: flex; gap: 4px; margin-bottom: 22px; color: var(--brass); font-size: 0.8rem; letter-spacing: 2px; }
.testimonial__text {
  font-family: var(--font-display); font-size: 1.2rem; font-weight: 300; font-style: italic;
  color: var(--espresso); margin-bottom: 26px; line-height: 1.55; letter-spacing: -0.01em;
}
.testimonial__author { font-family: var(--font-body); font-weight: 600; font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); }
.testimonial__role { font-size: 0.78rem; color: var(--text-soft); margin-top: 3px; letter-spacing: 0.04em; }
.testimonial:nth-child(1), .testimonial:nth-child(2), .testimonial:nth-child(3) { border-left: 1px solid var(--line-soft); }

/* big single pull testimonial */
.quote-feature { max-width: 820px; margin: 0 auto; text-align: center; }
.quote-feature p {
  font-family: var(--font-hand); font-weight: 400; font-style: italic;
  font-size: clamp(1.9rem, 3.6vw, 2.9rem); line-height: 1.3; color: var(--espresso); letter-spacing: 0;
}
.quote-feature cite { display: block; margin-top: 18px; font-family: var(--font-body); font-style: normal; font-size: 0.74rem; letter-spacing: 0.18em; text-transform: uppercase; color: #3a5440; }

/* ---- Stats ---- */
.stats-bar { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 48px; text-align: center; }
.stat__number {
  font-family: var(--font-display); font-weight: 300; font-size: clamp(2.8rem, 5vw, 4rem);
  color: var(--cream); line-height: 1; margin-bottom: 14px; letter-spacing: -0.02em;
}
.section:not(.section--dark) .stat__number { color: var(--espresso); }
.stat__label { font-size: 0.72rem; font-weight: 600; color: rgba(244,239,229,0.55); text-transform: uppercase; letter-spacing: 0.2em; }
.section:not(.section--dark) .stat__label { color: var(--text-soft); }

/* ---- CTA ---- */
.cta-section { text-align: center; padding: 40px 0; position: relative; }
.cta-section > * { position: relative; z-index: 1; }
.cta-section::before {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 420px; height: 420px; z-index: 0;
  background: url("../images/dwell-sunflower.png") no-repeat center / contain; opacity: 0.06; pointer-events: none;
}
.cta-section h2 { color: var(--cream); margin-bottom: 22px; }
.cta-section p { color: rgba(244,239,229,0.72); max-width: 540px; margin: 0 auto 38px; font-weight: 300; }
.cta-section .cta-tagline { font-family: var(--font-script); font-style: normal; font-weight: 400; font-size: 2rem; color: var(--gold-soft); margin-top: 28px; }

/* ---- Page header ---- */
.page-header { background: var(--oat); padding: 130px 0 90px; text-align: center; position: relative; }
.page-header h1 { margin-bottom: 18px; }
.page-header p { font-size: 1.15rem; color: var(--text-soft); max-width: var(--measure); margin: 0 auto; font-weight: 300; }

/* ---- Values ---- */
.values-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 4px; }
.value-card { text-align: center; padding: 56px 32px; background: var(--paper); border: 1px solid var(--line-soft); transition: border-color 0.5s ease; }
.value-card:hover { border-color: var(--brass); }
.value-card__icon {
  width: 54px; height: 54px; border-radius: 50%; border: 1px solid var(--brass);
  display: flex; align-items: center; justify-content: center; margin: 0 auto 26px;
  font-size: 1.1rem; color: var(--brass-deep); background: transparent;
}
.value-card__icon--rose, .value-card__icon--terracotta, .value-card__icon--sage, .value-card__icon--gold { background: transparent; color: var(--brass-deep); }
.value-card h3 { margin-bottom: 14px; }
.value-card p { font-size: 0.96rem; font-weight: 300; color: var(--text-soft); }

/* ---- Gallery ---- */
.gallery-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.gallery-grid__item { overflow: hidden; aspect-ratio: 1; position: relative; }
.gallery-grid__item img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; transition: transform 1.2s cubic-bezier(0.22,1,0.36,1); }
.gallery-grid__item:hover img { transform: scale(1.06); }
.gallery-grid__item--wide { grid-column: span 2; aspect-ratio: 2 / 1; }
.gallery-grid__item--tall { grid-row: span 2; aspect-ratio: auto; }

/* ---- Lightbox ---- */
.lightbox {
  position: fixed; inset: 0; z-index: 9999; background: rgba(20,15,12,0.94);
  display: flex; align-items: center; justify-content: center; padding: 24px;
  opacity: 0; visibility: hidden; transition: opacity 0.4s ease, visibility 0.4s ease;
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.lightbox.active { opacity: 1; visibility: visible; }
.lightbox__img { max-width: 90vw; max-height: 88vh; object-fit: contain; transform: scale(0.94); transition: transform 0.5s cubic-bezier(0.22,1,0.36,1); }
.lightbox.active .lightbox__img { transform: scale(1); }
.lightbox__close { position: absolute; top: 24px; right: 28px; background: none; border: none; color: var(--cream); font-size: 2rem; cursor: pointer; width: 48px; height: 48px; line-height: 1; }

/* ---- Class detail ---- */
.class-detail { padding: 110px 0; border-bottom: 1px solid var(--line-soft); }
.class-detail:last-of-type { border-bottom: none; }
.class-detail:nth-child(odd) { background: var(--oat); }
.class-detail__info h3 { font-size: clamp(1.8rem, 3vw, 2.4rem); margin-bottom: 20px; }
.class-detail__info p { color: var(--text); font-weight: 300; margin-bottom: 26px; }
.class-detail__meta { display: flex; flex-wrap: wrap; gap: 28px; align-items: center; }
.class-detail__meta-item {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 0.7rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-soft);
}

/* ---- Pricing ---- */
.pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 4px; max-width: 960px; margin: 0 auto; }
.pricing-card { background: var(--paper); border: 1px solid var(--line-soft); padding: 56px 40px; text-align: center; position: relative; transition: border-color 0.5s ease; }
.pricing-card:hover { border-color: var(--brass); }
.pricing-card--featured { border-color: var(--ink); }
.pricing-card__badge {
  position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%);
  background: var(--ink); color: var(--cream); font-size: 0.6rem; font-weight: 600;
  letter-spacing: 0.2em; text-transform: uppercase; padding: 7px 18px;
}
.pricing-card h3 { font-size: 1.3rem; margin-bottom: 18px; }
.pricing-card__price { font-family: var(--font-display); font-size: 3.4rem; font-weight: 300; color: var(--espresso); line-height: 1; margin-bottom: 6px; letter-spacing: -0.02em; }
.pricing-card__price span { font-size: 0.9rem; color: var(--text-soft); letter-spacing: 0; }
.pricing-card__desc { font-size: 0.82rem; color: var(--text-soft); margin-bottom: 32px; letter-spacing: 0.04em; }
.pricing-card__features { list-style: none; margin-bottom: 36px; text-align: left; }
.pricing-card__features li { padding: 12px 0; font-size: 0.92rem; font-weight: 300; color: var(--text); border-bottom: 1px solid var(--line-soft); display: flex; align-items: flex-start; gap: 12px; }
.pricing-card__features li::before { content: ''; width: 16px; height: 1px; background: var(--brass); margin-top: 14px; flex-shrink: 0; }

/* ---- Check list ---- */
.check-list { list-style: none; max-width: var(--measure); }
.check-list li { padding: 18px 0; font-size: 1rem; font-weight: 300; color: var(--text); display: flex; align-items: flex-start; gap: 18px; border-bottom: 1px solid var(--line-soft); }
.check-list li::before { content: ''; width: 8px; height: 8px; background: var(--brass); transform: rotate(45deg); margin-top: 11px; flex-shrink: 0; }
/* centered 2-up variant (events "Invite Us In") */
.check-list--center { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 44px; max-width: 600px; margin: 0 auto 36px; }
.check-list--center li { justify-content: flex-start; align-items: center; border-bottom: none; padding: 13px 0; }
.check-list--center li::before { margin-top: 0; }

/* compact "Next Up" featured event (homepage) */
.next-up {
  display: grid; grid-template-columns: 0.9fr 1.1fr;
  max-width: 920px; margin: 0 auto;
  background: var(--paper); border: 1px solid var(--line-soft);
  border-radius: 8px; overflow: hidden;
  box-shadow: 0 34px 80px -46px rgba(74,21,40,0.5);
}
.next-up__media { position: relative; min-height: 290px; }
.next-up__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.next-up__tag {
  position: absolute; top: 20px; left: 0;
  background: var(--wine); color: var(--cream);
  font-family: var(--font-script); font-size: 1.75rem; line-height: 1;
  padding: 8px 24px 11px; border-radius: 0 4px 4px 0;
  box-shadow: 0 10px 22px -10px rgba(0,0,0,0.45);
}
.next-up__body { padding: 42px 46px; align-self: center; }
.next-up__body .section__label { color: var(--brass-deep); display: block; margin-bottom: 12px; }
.next-up__body h3 { margin-bottom: 14px; }
.next-up__body p { color: var(--text-soft); font-weight: 300; margin-bottom: 22px; }
@media (max-width: 768px) {
  .next-up { grid-template-columns: 1fr; max-width: 440px; }
  .next-up__media { min-height: 220px; }
  .next-up__body { padding: 30px 28px; }
}

/* ---- Contact ---- */
.contact-grid { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 64px; align-items: start; }

/* ---- Forms ---- */
.form-group { margin-bottom: 24px; }
.form-group label { display: block; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); margin-bottom: 10px; }
.form-group label .required { color: var(--brass-deep); }
/* standalone labels outside a .form-group still follow the label convention */
.wizard__label { display: block; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); margin: 8px 0 12px; }
.wizard__label .required { color: var(--brass-deep); }
.form-group input, .form-group select, .form-group textarea {
  width: 100%; padding: 15px 18px; border: 1px solid var(--line);
  border-radius: var(--radius-sm); font-family: var(--font-body); font-size: 0.98rem; font-weight: 400;
  color: var(--text); background: var(--paper); transition: border-color 0.4s ease, box-shadow 0.4s ease;
}
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  outline: none; border-color: var(--brass); box-shadow: 0 0 0 3px rgba(156,124,79,0.1);
}
.form-group textarea { min-height: 130px; resize: vertical; }
.form-group select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%237a6e62' d='M1.41 0L6 4.58 10.59 0 12 1.41l-6 6-6-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center; padding-right: 42px;
}
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-hint { font-size: 0.84rem; color: var(--text-soft); margin-top: 14px; font-weight: 300; }

/* ---- Contact info cards ---- */
.contact-info-card { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--radius-sm); padding: 32px 28px; margin-bottom: 4px; }
.contact-info-card h3 { font-size: 0.78rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brass-deep); margin-bottom: 14px; font-family: var(--font-body); display: flex; align-items: center; gap: 10px; }
.contact-info-card p, .contact-info-card address { font-size: 1rem; font-weight: 300; color: var(--text); font-style: normal; line-height: 1.7; }
.contact-info-card a { color: var(--brass-deep); font-weight: 400; }

/* ---- FAQ ---- */
.faq-list { max-width: var(--measure); margin: 0 auto; }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item__question {
  font-family: var(--font-display); font-size: 1.25rem; font-weight: 400; color: var(--espresso);
  padding: 28px 0; cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px;
}
.faq-item__question::-webkit-details-marker { display: none; }
.faq-item__question::after { content: '+'; font-size: 1.5rem; font-weight: 300; color: var(--brass); flex-shrink: 0; transition: transform 0.3s ease; }
.faq-item[open] .faq-item__question::after { content: '–'; }
.faq-item__answer { padding: 0 0 28px; font-size: 1rem; font-weight: 300; color: var(--text-soft); line-height: 1.8; max-width: 92%; }

/* ---- Map placeholder ---- */
.map-placeholder { background: var(--oat); border-radius: var(--radius-sm); height: 320px; display: flex; align-items: center; justify-content: center; color: var(--text-soft); font-size: 0.8rem; letter-spacing: 0.16em; text-transform: uppercase; border: 1px solid var(--line-soft); margin-top: 60px; }

/* ---- Instructor ---- */
.instructor-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 40px; max-width: 560px; margin: 0 auto; }
.instructor-card { text-align: center; }
.instructor-card__photo { width: 100%; max-width: 320px; aspect-ratio: 4/5; overflow: hidden; margin: 0 auto 28px; border-radius: var(--radius-sm); }
.instructor-card__photo img { width: 100%; height: 100%; object-fit: cover; }
.instructor-card h3 { margin-bottom: 6px; }
.instructor-card__title { font-size: 0.72rem; color: var(--brass-deep); font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; margin-bottom: 18px; }
.instructor-card p { font-size: 1rem; font-weight: 300; color: var(--text-soft); }

/* ---- Pull quote ---- */
.pull-quote {
  font-family: var(--font-hand); font-size: clamp(1.9rem, 3.4vw, 2.6rem); font-style: italic; font-weight: 400;
  color: var(--espresso); border-left: 1px solid var(--brass); padding-left: 32px; margin: 44px 0; line-height: 1.45; letter-spacing: 0;
}

/* ---- Annual Showcase band ---- */
.showcase-band {
  position: relative; overflow: hidden; background: linear-gradient(140deg, var(--forest) 0%, var(--forest) 45%, var(--wine-deep) 100%); color: var(--cream);
  padding: 96px 80px; display: grid; grid-template-columns: 1.4fr 1fr; gap: 64px; align-items: center;
  border: 1px solid rgba(156,124,79,0.4);
}
.showcase-band h2 { color: var(--cream); margin-bottom: 22px; }
.showcase-band p { color: rgba(244,239,229,0.74); margin-bottom: 34px; font-weight: 300; }
.showcase-band .section__label { color: #c4a572; }
.showcase-band__art { text-align: center; border-left: 1px solid rgba(156,124,79,0.4); padding-left: 56px; }
.showcase-band__art .verse { font-family: var(--font-hand); font-style: italic; font-weight: 500; font-size: clamp(1.8rem, 2.8vw, 2.4rem); color: #e7cda3; line-height: 1.45; }

/* ---- Opt-in ---- */
.optin { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 72px 72px; }
.optin__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center; }
.optin h2 { margin-bottom: 16px; }
.optin .optin__lead { color: var(--text-soft); margin-bottom: 0; font-weight: 300; }
.optin__form { display: flex; flex-direction: column; gap: 16px; }
.optin__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.optin__check { display: flex; align-items: flex-start; gap: 12px; font-size: 0.9rem; font-weight: 300; color: var(--text); cursor: pointer; }
.optin__check input { margin-top: 4px; width: 15px; height: 15px; accent-color: var(--brass-deep); flex-shrink: 0; }
.optin__consent { font-size: 0.7rem; line-height: 1.6; color: var(--text-soft); margin-top: 4px; }
.optin__consent a { color: var(--brass-deep); font-weight: 600; }
.optin__success { display: none; background: rgba(111,122,78,0.12); color: #5b6640; border-radius: var(--radius-sm); padding: 16px 18px; font-size: 0.92rem; }

/* ---- Registration wizard ---- */
.wizard { max-width: 780px; margin: 0 auto; }
.wizard__progress { display: flex; gap: 4px; margin-bottom: 48px; }
.wizard__progress-step { flex: 1; text-align: center; font-size: 0.66rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-soft); padding-bottom: 14px; border-bottom: 1px solid var(--line); transition: color 0.4s ease, border-color 0.4s ease; }
.wizard__progress-step.active { color: var(--ink); border-bottom-color: var(--brass); }
.wizard__progress-step.done { color: var(--brass-deep); border-bottom-color: var(--brass-deep); }
.wizard-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 56px 56px; }
.form-step { display: none; }
.form-step.active { display: block; animation: fadeStep 0.5s ease; }
@keyframes fadeStep { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.form-step h3 { font-size: 1.7rem; margin-bottom: 8px; }
.form-step__hint { font-size: 0.96rem; font-weight: 300; color: var(--text-soft); margin-bottom: 30px; }
.radio-card-group { display: grid; gap: 4px; }
.radio-card { display: flex; gap: 16px; align-items: center; padding: 20px 22px; border: 1px solid var(--line); cursor: pointer; transition: border-color 0.3s ease; background: var(--paper); }
.radio-card:hover { border-color: var(--brass); }
.radio-card:has(input:checked) { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.radio-card input { margin: 0; accent-color: var(--brass-deep); flex-shrink: 0; }
.radio-card__body { display: flex; flex-direction: column; gap: 3px; }
.radio-card__title { font-weight: 600; color: var(--ink); font-size: 0.95rem; }
.radio-card__desc { font-size: 0.86rem; font-weight: 300; color: var(--text-soft); }
.radio-card__price { margin-left: auto; font-family: var(--font-display); font-size: 1.5rem; font-weight: 300; color: var(--espresso); white-space: nowrap; }
.wizard__nav { display: flex; justify-content: space-between; gap: 14px; margin-top: 36px; }
.consent-box { background: var(--oat); border: 1px solid var(--line-soft); border-radius: var(--radius-sm); padding: 18px 20px; margin-bottom: 14px; }
.consent-box label { display: flex; align-items: flex-start; gap: 12px; font-size: 0.9rem; font-weight: 300; color: var(--text); cursor: pointer; }
.consent-box input { margin-top: 4px; width: 15px; height: 15px; accent-color: var(--brass-deep); flex-shrink: 0; }
.consent-box .fine { font-size: 0.7rem; line-height: 1.6; color: var(--text-soft); margin: 10px 0 0 27px; }
.consent-box .fine a { color: var(--brass-deep); font-weight: 600; }
.safety-note { display: flex; gap: 12px; align-items: flex-start; background: rgba(111,122,78,0.1); border-radius: var(--radius-sm); padding: 16px 18px; font-size: 0.84rem; font-weight: 300; color: #5b6640; margin-bottom: 28px; line-height: 1.6; }
.review-list { list-style: none; margin-bottom: 28px; }
.review-list li { display: flex; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line-soft); font-size: 0.95rem; font-weight: 300; }
.review-list li span:first-child { color: var(--text-soft); letter-spacing: 0.04em; }
.review-list li span:last-child { font-weight: 500; color: var(--ink); text-align: right; }
.pay-note { font-size: 0.8rem; color: var(--text-soft); text-align: center; margin-top: 16px; font-weight: 300; }
.wizard__success { display: none; text-align: center; padding: 24px 0; }
.wizard__success.show { display: block; animation: fadeStep 0.6s ease; }
.wizard__success .tick { width: 64px; height: 64px; border-radius: 50%; border: 1px solid var(--brass); margin: 0 auto 24px; display: flex; align-items: center; justify-content: center; color: var(--brass-deep); font-size: 1.6rem; }

/* ---- Prose ---- */
.prose { max-width: var(--measure); margin: 0 auto; }
.prose .updated { font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-soft); margin-bottom: 40px; }
.prose h2 { font-size: 1.7rem; margin: 48px 0 16px; }
.prose h3 { font-size: 1.2rem; margin: 28px 0 10px; }
.prose p, .prose li { color: var(--text); line-height: 1.9; font-size: 1rem; font-weight: 300; }
.prose p { margin-bottom: 16px; }
.prose ul { padding-left: 22px; margin-bottom: 18px; }
.prose li { margin-bottom: 10px; }
.prose a { color: var(--brass-deep); font-weight: 600; }
.prose strong { color: var(--ink); font-weight: 600; }

/* ---- 404 ---- */
.error-page { min-height: 72vh; display: flex; align-items: center; justify-content: center; text-align: center; padding: 100px 24px; }
.error-page--photo { position: relative; overflow: hidden; background: var(--ink); }
.error-page--photo > div:not(.page-header__bg):not(.page-header__overlay) { position: relative; z-index: 2; }
.error-page--photo h1, .error-page--photo p { color: #fdfaf3; }
.error-page--photo .error-page__code { color: #e7cda3; }
.error-page__code { font-family: var(--font-display); font-weight: 300; font-size: clamp(6rem, 20vw, 13rem); line-height: 1; color: var(--brass); margin-bottom: 8px; letter-spacing: -0.04em; }

/* ---- Footer ---- */
.footer { background: var(--ink); color: rgba(244,239,229,0.6); padding: 100px 0 156px; position: relative; overflow: hidden; }
.footer > .container { position: relative; z-index: 1; }
.footer::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 114px; z-index: 0; pointer-events: none;
  background: url("../images/decor/footer-meadow.png") bottom center / auto 114px repeat-x;
  opacity: 0.5;
}
.footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 56px; margin-bottom: 72px; }
/* spacing mirrors .nav__logo so the header and footer wordmark agree */
.footer__brand { font-family: var(--font-script); font-size: 2.2rem; font-weight: 400; color: var(--cream); letter-spacing: 0.01em; margin-bottom: 14px; line-height: 1; display: flex; align-items: center; gap: 12px; }
.footer__brand img { width: 34px; height: 34px; object-fit: contain; }
.footer__brand span { font-style: normal; color: var(--gold); }
.footer__tagline { font-family: var(--font-script); font-style: normal; font-weight: 400; font-size: 1.6rem; color: var(--gold-soft); margin-bottom: 26px; }
.footer__social { display: flex; gap: 12px; }
.footer__social a { width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(244,239,229,0.2); display: flex; align-items: center; justify-content: center; color: rgba(244,239,229,0.6); transition: all 0.4s ease; }
.footer__social a:hover { border-color: var(--brass); color: var(--cream); }
.footer h4 { font-family: var(--font-body); font-size: 0.7rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.2em; color: var(--cream); margin-bottom: 22px; }
.footer__links { list-style: none; }
.footer__links li { margin-bottom: 14px; }
.footer__links a, .footer__links li { font-size: 0.92rem; font-weight: 300; color: rgba(244,239,229,0.55); transition: color 0.4s ease; }
.footer__links a:hover { color: var(--cream); }
.footer__bottom { border-top: 1px solid rgba(244,239,229,0.12); padding-top: 32px; text-align: center; font-size: 0.78rem; letter-spacing: 0.06em; color: rgba(244,239,229,0.6); }
.footer__bottom a { color: inherit; }
.footer__bottom a:hover { color: var(--cream); }

/* ---- Scroll reveal ---- */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 1.1s cubic-bezier(0.22,1,0.36,1), transform 1.1s cubic-bezier(0.22,1,0.36,1); }
.reveal.revealed { opacity: 1; transform: translateY(0); }
.reveal-delay-1 { transition-delay: 0.12s; }
.reveal-delay-2 { transition-delay: 0.24s; }
.reveal-delay-3 { transition-delay: 0.36s; }
.reveal-delay-4 { transition-delay: 0.48s; }

/* ---- Moody photo treatment (warm, golden, atmospheric) ---- */
.img-moody { filter: saturate(0.95) contrast(1.07) brightness(0.78) sepia(0.07); }
.img-moody--soft { filter: saturate(0.95) brightness(0.9) contrast(1.02) sepia(0.05); }

/* ---- Grain overlay ---- */
.grain::after {
  content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
  background-size: 256px; background-repeat: repeat;
}

/* legacy dividers retained but neutral */
.wave-divider, .scallop, .scroll-dancer { display: none; }

/* ---- Organic sunflower divider (handcrafted motif) ---- */
.organic-divider { display: flex; align-items: center; justify-content: center; gap: 24px; padding: 4px 0; }
.organic-divider::before, .organic-divider::after { content: ''; height: 1px; width: 84px; background: var(--line); }
.organic-divider img { width: 32px; height: 32px; opacity: 0.92; }

/* subtle classic flourish under every section header */
.section__header { position: relative; }
/* sunflower flourish only inside the banner panels (not every section header) */
.soft-banner::after {
  content: ""; display: block; width: 38px; height: 38px; margin: 24px auto 0;
  background: url("../images/dwell-sunflower.png") no-repeat center / contain; opacity: 0.95;
}

/* register page logo lockup */

/* ---- Interactive class pricing tool ---- */
.price-tool { max-width: 760px; margin: 0 auto; }
.price-panel__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.price-opt { background: var(--paper); border: 1px solid var(--line-soft); padding: 36px 28px; text-align: center; }
.price-opt--feat { border-color: var(--ink); }
.price-opt__tag { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--brass-deep); margin-bottom: 14px; }
.price-opt__amt { font-family: var(--font-display); font-size: 2.9rem; font-weight: 300; color: var(--espresso); line-height: 1; letter-spacing: -0.02em; }
.price-opt__amt span { font-size: 0.9rem; color: var(--text-soft); letter-spacing: 0; }
.price-opt__desc { font-size: 0.88rem; font-weight: 300; color: var(--text-soft); margin-top: 12px; }
.price-note { text-align: center; margin-top: 20px; font-size: 0.92rem; font-weight: 300; color: var(--text-soft); }
.price-fam { background: var(--paper); border: 1px solid var(--line-soft); padding: 40px 32px; }
.price-fam__rules { list-style: none; max-width: 480px; margin: 0 auto 28px; }
.price-fam__rules li { display: flex; justify-content: space-between; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--line-soft); font-size: 0.96rem; }
.price-fam__rules li span:first-child { color: var(--text-soft); font-weight: 300; }
.price-fam__rules li span:last-child { color: var(--ink); font-weight: 600; white-space: nowrap; }
.price-fam__calc { text-align: center; padding-top: 6px; }
.price-fam__calc label { display: block; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--brass-deep); margin-bottom: 16px; }
.stepper { display: inline-flex; align-items: center; gap: 22px; margin-bottom: 18px; }
.stepper button { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: var(--bone); font-size: 1.2rem; cursor: pointer; color: var(--ink); transition: border-color 0.25s ease, color 0.25s ease; line-height: 1; }
.stepper button:hover { border-color: var(--brass); color: var(--brass-deep); }
.stepper span { font-family: var(--font-display); font-size: 1.9rem; min-width: 34px; color: var(--espresso); }
.price-fam__total { font-size: 1.05rem; font-weight: 300; color: var(--text); }
.price-fam__total strong { font-family: var(--font-display); font-size: 2rem; font-weight: 400; color: var(--espresso); margin: 0 4px; }
.price-fam__total span { color: var(--text-soft); font-size: 0.9rem; }
@media (max-width: 560px) { .price-panel__grid { grid-template-columns: 1fr; } }

/* ---- Featured social feed ---- */
.social-feed { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; max-width: 780px; margin: 0 auto 40px; }
.social-feed a { position: relative; aspect-ratio: 1; overflow: hidden; display: block; border-radius: var(--radius-sm); }
.social-feed img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(0.22,1,0.36,1); }
.social-feed a:hover img { transform: scale(1.06); }
.social-feed a::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(74,21,40,0.4), transparent 55%); opacity: 0; transition: opacity 0.4s ease; }
.social-feed a:hover::after { opacity: 1; }
@media (max-width: 560px) { .social-feed { grid-template-columns: 1fr 1fr; } }

/* single-option price panel (workshops have one price, not a monthly/season pair) */
.price-panel__grid--single { grid-template-columns: 1fr; max-width: 360px; margin-left: auto; margin-right: auto; }
.price-opt__tbd { font-family: var(--font-body); font-size: 1.05rem; font-weight: 500; letter-spacing: 0.01em; }

/* Register opens straight on the form: no hero, so the section clears the
   fixed header itself and the title sits on the card. */
.section--form-top { padding-top: 168px; }
.wizard__title { text-align: center; margin-bottom: 10px; }
.wizard__intro { text-align: center; color: var(--text-soft); font-weight: 300;
                 max-width: var(--measure); margin: 0 auto 42px; }
@media (max-width: 860px) { .section--form-top { padding-top: 132px; } }

.party-total { margin-top: 14px; font-family: var(--font-display); font-size: 1.5rem;
              color: var(--espresso); }
.party-total span { font-family: var(--font-body); font-size: 0.9rem; color: var(--text-soft); }

.optin__thanks { font-family: var(--font-display); font-size: 1.3rem; font-style: italic;
                 color: var(--cream); line-height: 1.5; margin: 0; }

.age-rows { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 4px; }
.age-row { display:flex; align-items:center; gap:8px; background:var(--paper);
           border:1px solid var(--line-soft); border-radius:4px; padding:6px 10px; }
.age-row span { font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft); }
.age-row input { width:66px; padding:5px 8px; }

/* ---- Gallery marquee: always drifting, every tile opens full size ---- */
.gallery-marquee {
  position: relative; overflow: hidden;
  /* full bleed: break out of the container and run hard to both edges.
     No mask here on purpose, a fade to transparent reads as empty space. */
  width: 100vw; margin-left: calc(50% - 50vw);
}
.gallery-marquee__track {
  display: flex; gap: 8px; width: max-content;
  animation: gallery-drift 190s linear infinite;
}
/* Pause only while someone is actually pointing at the strip, so a tile can be
   clicked. Closing the lightbox never stops it: the animation is never cancelled. */
.gallery-marquee:hover .gallery-marquee__track,
.gallery-marquee:focus-within .gallery-marquee__track { animation-play-state: paused; }

@keyframes gallery-drift {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(calc(-50% - 4px), 0, 0); }   /* -4px = half the 8px gap */
}

.gallery-marquee__item {
  flex: 0 0 230px; aspect-ratio: 1; padding: 0; border: none; background: none;
  overflow: hidden; border-radius: var(--radius-sm); position: relative; display: block;
}
.gallery-marquee__item img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  transition: transform 1s cubic-bezier(0.22,1,0.36,1);
}
.gallery-marquee__item:hover img { transform: scale(1.06); }
.gallery-marquee__item::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(74,21,40,0.42), transparent 55%);
  opacity: 0; transition: opacity 0.4s ease;
}
.gallery-marquee__item:hover::after { opacity: 1; }
.gallery-marquee__item:focus-visible { outline: 2px solid var(--brass); outline-offset: 3px; }

@media (max-width: 700px) { .gallery-marquee__item { flex-basis: 168px; } }
@media (prefers-reduced-motion: reduce) {
  .gallery-marquee { overflow-x: auto; }
  .gallery-marquee__track { animation: none; }
  .gallery-marquee__item img { transition: none; }
}

/* ---- Social marquee: one unbroken drift, no controls ---- */
.social-carousel {
  position: relative; overflow: hidden;
  width: 100vw; margin-left: calc(50% - 50vw); margin-bottom: 40px;
}
.social-carousel__track {
  display: flex; gap: 6px; width: max-content;
  /* the track holds the slides twice, so translating exactly -50% lands on an
     identical frame and the loop is invisible */
  animation: social-drift 48s linear infinite;
}
.social-carousel:hover .social-carousel__track,
.social-carousel:focus-within .social-carousel__track { animation-play-state: paused; }

@keyframes social-drift {
  from { transform: translate3d(0, 0, 0); }
  to   { transform: translate3d(calc(-50% - 3px), 0, 0); }  /* -3px = half the 6px gap */
}

.social-carousel__slide {
  position: relative; flex: 0 0 191px; aspect-ratio: 1;
  overflow: hidden; display: block; border-radius: var(--radius-sm);
}
.social-carousel__slide img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(0.22,1,0.36,1); }
.social-carousel__slide:hover img { transform: scale(1.06); }
.social-carousel__slide::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(74,21,40,0.4), transparent 55%);
  opacity: 0; transition: opacity 0.4s ease;
}
.social-carousel__slide:hover::after { opacity: 1; }

@media (max-width: 560px) {
  .social-carousel__slide { flex-basis: 168px; }
  .social-carousel__track { animation-duration: 38s; }
}
@media (prefers-reduced-motion: reduce) {
  .social-carousel { overflow-x: auto; }
  .social-carousel__track { animation: none; }
  .social-carousel__slide img { transition: none; }
}

/* ============================================
   Wholesome layer — photo framing, paper texture, sunflower motifs
   ============================================ */

/* Abstract, subtle green offset frame on the large editorial photos */
.split__image { position: relative; overflow: visible; background: none; padding: 0; border: none; box-shadow: none; }
.split__image img { position: relative; z-index: 1; border-radius: 2px; background: var(--paper); box-shadow: 0 10px 26px rgba(40,26,18,0.10); }
.split__image::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  border: 1.5px solid var(--forest-accent); border-radius: 2px; transform: translate(16px, 16px);
}
.split__image::after {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  border: 1px solid rgba(179,134,47,0.6); border-radius: 2px; transform: translate(-11px, -11px);
}
/* small gold diamond accent where the frame turns */
.split__text { position: relative; }

/* Framed scripture / photo-break image */
.photo-break__overlay::after {
  content: ""; position: absolute; inset: 20px; border: 1px solid rgba(245,236,212,0.45); pointer-events: none;
}

/* Faint paper texture on the warm cream sections + page headers */
.section--linen::before, .page-header::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='t'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23t)' opacity='0.04'/%3E%3C/svg%3E");
  background-size: 230px;
}
.section--linen > .container, .section--sand > .container, .page-header > .container { position: relative; z-index: 1; }

/* Faint sunflower watermark in page headers (subtle logo motif) */
.page-header { overflow: hidden; }
.page-header::after {
  content: ""; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
  width: 460px; height: 460px; z-index: 0;
  background: url("../images/dwell-sunflower.png") no-repeat center / contain; opacity: 0.07; pointer-events: none;
}

/* whimsical floral divider — long-stemmed flowers weaving horizontally between sections */
.floral-divider, .floral-divider--flip, .floral-divider--sm { display: none; }

/* photo-background variant for a page header */
.page-header--photo {
  background: var(--ink); padding-top: 150px; padding-bottom: 110px;
  /* every hero is the same height, set by the longest one (register) so the
     shorter pages no longer look clipped */
  min-height: 626px; display: flex; flex-direction: column; justify-content: center;
}
.page-header--photo::before, .page-header--photo::after { display: none; }
.page-header__bg { position: absolute; inset: 0; z-index: 0; }
.page-header__bg picture { display: block; position: absolute; inset: 0; }
.page-header__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; }
/* Heroes are landscape; a phone crops them to the centre, which cut the subject
   out of frame. Each page sets --mobile-x to keep its subject visible. Must sit
   AFTER the base rule above or it loses on source order. */
@media (max-width: 760px) {
  .page-header__bg img { object-position: var(--mobile-x, 50%) 28%; }
}

/* top-hero motion: breathing background sunflower + slow image pan */
@keyframes ddc-breathe {
  0%, 100% { transform: translate(-50%, -50%) scale(1); }
  50%      { transform: translate(-50%, -50%) scale(1.2); }
}
.page-header::after { animation: ddc-breathe 8s ease-in-out infinite; }
.hero__bg img, .page-header__bg img { animation: ddc-kenburns 38s ease-in-out infinite alternate; will-change: transform; }

/* The homepage hero is a still, so it gets a true Ken Burns: the drift is paired
   with a slow zoom, which reads as motion rather than a slide. Slower and wider
   so it never draws attention to itself behind the headline. */
@keyframes ddc-kenburns {
  from { transform: scale(1.06) translate3d(-1.8%,  1.0%, 0); }
  to   { transform: scale(1.19) translate3d( 1.8%, -1.0%, 0); }
}
.hero__bg img { animation: ddc-kenburns 38s ease-in-out infinite alternate; }
/* On a phone the same drift reads as nothing, so shorten the cycle and widen
   the travel enough to be felt without becoming distracting. */
@media (max-width: 760px) {
  @keyframes ddc-kenburns-m {
    from { transform: scale(1.04) translate3d(-3.2%,  1.6%, 0); }
    to   { transform: scale(1.22) translate3d( 3.2%, -1.6%, 0); }
  }
  /* Page headers drift less sideways so the per-page --mobile-x framing, which
     is tuned to keep the subject in shot, is not undone by the animation. */
  @keyframes ddc-kenburns-mh {
    from { transform: scale(1.05) translate3d(-1.2%,  1.4%, 0); }
    to   { transform: scale(1.20) translate3d( 1.2%, -1.4%, 0); }
  }
  .hero__bg img { animation: ddc-kenburns-m 20s ease-in-out infinite alternate; }
  .page-header__bg img { animation: ddc-kenburns-mh 22s ease-in-out infinite alternate; }
}
@media (prefers-reduced-motion: reduce) {
  .page-header::after, .hero__bg img, .page-header__bg img { animation: none; transform: scale(1.06); }
}
.page-header__overlay { position: absolute; inset: 0; z-index: 1; background: linear-gradient(to top, rgba(40,26,18,0.82) 0%, rgba(40,26,18,0.48) 55%, rgba(40,26,18,0.6) 100%); }
.page-header--photo > .container { position: relative; z-index: 2; }
.page-header--photo h1 { color: #fdfaf3; }
.page-header--photo p { color: rgba(253,250,243,0.85); }
.page-header--photo .section__label { color: #e7cda3; }

/* ============================================
   Responsive
   ============================================ */
@media (max-width: 1080px) {
  :root { --section-padding: 100px 0; }
  .split { grid-template-columns: 1fr; gap: 48px; }
  .split--reverse { direction: ltr; }
  .split__image { max-width: 560px; }
  .showcase-band { grid-template-columns: 1fr; padding: 64px 44px; }
  .showcase-band__art { border-left: none; padding-left: 0; border-top: 1px solid rgba(156,124,79,0.4); padding-top: 40px; }
  .optin__grid { grid-template-columns: 1fr; gap: 36px; }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .contact-grid { grid-template-columns: 1fr; gap: 48px; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  :root { --section-padding: 80px 0; }
  .container { padding: 0 24px; }
  .nav { padding: 18px 24px; }
  .nav__links {
    display: none; position: absolute; top: 100%; left: 0; right: 0;
    background: rgba(246,241,232,0.98); backdrop-filter: blur(18px);
    flex-direction: column; padding: 24px; gap: 0; border-bottom: 1px solid var(--line);
  }
  .nav__links.active { display: flex; }
  .nav__links a { padding: 16px 0; border-bottom: 1px solid var(--line-soft); width: 100%; }
  .nav__links a:last-child { border-bottom: none; }
  .nav__links a::after { display: none; }
  .nav__links a.btn { margin-top: 12px; }
  .nav__toggle { display: block; }
  .hero { min-height: 80vh; }
  .hero__content { padding: 0 0 70px; }
  .optin { padding: 40px 28px; }
  .optin__row { grid-template-columns: 1fr; }
  .wizard-card { padding: 32px 24px; }
  .testimonial-grid { grid-template-columns: 1fr; }
  .pricing-grid { grid-template-columns: 1fr; max-width: 420px; }
  .form-row { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr; gap: 40px; }
  .soft-banner { padding: 30px 20px 26px; }
  h2 { font-size: clamp(1.95rem, 7vw, 2.7rem); }
  h3 { font-size: clamp(1.55rem, 5.4vw, 2.1rem); }
  .page-header::after, .cta-section::before { width: 280px; height: 280px; }
  .split__image::before { transform: translate(10px, 10px); }
  .split__image::after { transform: translate(-8px, -8px); }
}

@media (max-width: 480px) {
  .hero__buttons { flex-direction: column; align-items: stretch; }
  .hero__buttons .btn { width: 100%; }
  .stats-bar { grid-template-columns: 1fr 1fr; gap: 32px; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  .gallery-grid__item--wide { grid-column: span 2; }
  .gallery-grid__item--tall { grid-row: span 1; aspect-ratio: 1; }
  .check-list--center { grid-template-columns: 1fr; max-width: 320px; }
}

/* ============================================
   Sunflower cursor — the header mark (images/dwell-sunflower.png) follows
   the pointer. Gold at rest; recoloured wine-on-gold over any button.
   Both states are 24px baked bitmaps: CSS cannot retint a cursor image.
   Fine pointers only: touch and stylus keep the native cursor.
   ============================================ */
@media (hover: hover) and (pointer: fine) {
  :root {
    --cursor-rest:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAG70lEQVR4nIVVa4xVVxVeaz/O677nzp25DDNTsLyE1CJ0TBUC0hbaqDVaMzSp0Wqqxh/V9I8xNbEDWo1Vo6Y2tuIrqbFNZjRgTDBmooMprbEFWmCgDGUAh4G5M3Mfc+8977Mf5k4ESUP0S85e5+xkf2vtdfb+PoBbQANgJ5796VDx2M+38hvzI0A68cTz2zeefH7bn956cXcK/g+WF7wbR0Z20k4UzHyCK/OHx459ic+OP7wO9k2QqZcefJRq9bTSKt782XHv9C937Tl5YGe/1oCd538muF754qYeDQCopPZA6ccy03OP8FzXp6Z++90BESdPatA7zFTWnz3yxIhdKB+UobcBEW5B/x/CmzH53M50o13nNGWsLRZzjweN4B6eSc93r191pD41/Y6U5CktRSOzcq1DTdvyKpddq7v/RZpr/qbWXGjcuWfcX0727h2cP/yAqfUwDaNodTaf/b0UmGUZlmUmibVQJS2iPg36I1oqaRX7OLNTSdhYaFLDQjPjP0SCxl8Gi/lih1yPjNzgJaOjw8v9NhnecW0iONqzqfg+JXXBpuwrSSQvGxmDaqUSpWSBMMxRw46tbBeKwEfCFE2VLSn8Sm/QFv84fmiy+Odv3bEe9u3/7w6GhzcuZ7R4ehYAiswizxRWZRPKcFNQC7dQgzaZSamIpUlNIpjVOTgIlIdgdXGI3HkWe6pav9R0nFzq8wzQublFN/0DApVXH35GRu5nCEM38YVuzLSQObTNuVlk6fSMCgNHk3KXkTYk5S7IaAmUkFC/3NReK3SEkK8Kodoa9OiefWfGx8aGCZsZHbbNvnV97uIlx10Qf7ezbI+SOsscLgu3ZWjjiksYFyJjRlQ7lgCwgKUS8L02aiV15XwNWjUfNYLPDbrayliHetaVTyCe0QBjEk+9sG3MLJS3WbnuQAMkBIWgVmABJEprYZAkrF04vfTa1Iwcarkkb3ObpvICtg9xeel0lcSxxGzRhmJ/FnIla45yZoXt6FTt/PyT7//q2jqTsfxJsDDbFzVrfWa2SI10gQEtKWoI4CxQzaBV+d5z04OEmmUnxaVpSVmvBkjaSNa/18Rsbxqy3Q4gNUAKNhi3ECKX38ud5I2TP5s9yga2leveQnwuccOylIsovDpqkaGCZwnN5JJDB6+WbIf0GhyDWs1fYZgYWI7d9omJ6z8wAF6UBsAUKG2CVEmstWchtmYJoz8WEb7DitOHzicrtv2I2V3TIMkHpYBuJaTNWEMszNWiqbOVMuc0dN24JKWWritDKX1y7IRUuz9xO6SzaRBSAUEFhqE1yZcqWmsLEVb3bv3mGJtbtX8Lav0IY3SN1nKAKuAAGpEAK+VjVuxuy+riIloWCwnVyvN0aHBKZ2ZjWLw6BQ63USVSEUYAtACh4ZgG8xe+n5/Wo8OUoYqrSI3DQWV6Z9Rq3kYNsM0sl4mIqJ2yRG+PLabOocE5eFKChYhUagnvGaTgXZ1WV9qGcLKWaaVNbqR4gBQfAPBWpMTZT8PwcbV8D958dsvXRAy7iM3WpEoOMAORGjng9krtmD7sHzmOk29HotTNWbMl4e6hAvnilwd19cqcasy1IpWoBcqJk0qZ1ZUbSl8QmoqV993ZQNyv2MTETha8GTjpkjWU7UlJbtIWkCJoKAJgAyXW4ZMPlbEwPh996O406erPMMoH2yL2re5VvczOmE5zodXXWvRPV+db1eq813//t08f1/rQcvHLw78mPn6XSfH7oJO/hWHP/YjZAcprMWIDlcqD8ppAWUKE0CrTk6dJ0tsIXRkJ72o51W0kSkWsXfVg8crS6/5S6NoW+8GOb5w6PzICZFn1BjPlk+Udf7wnFhumtbBu12I2JFAH5D3Uq9R1EoXg+1p5TQFxQkQcNouGkxJKmnH94hJTCQny5bS5evPKftMyDiZCrenw7tsHmnRcCO86kFyaeDQfLV17OmpM+8wMDGKUmV+pNYNqnZgZE2QolPBiAERCSOhJEWfMbO6CFkq35uJ+dz6eQdS5jfet8u59avJw5wR1RO+GbjcuTnN39tKvnW7SoGaPFBHZ375WaRPOHUKJG3nJBREnTMaaESrnAORbRrZ7RkTe51DLl5XM/VU7hV3BQnJquei9Y7LDy65L65bHji4CwHeuHXlwEaQ/XnnjXIFnskPMJC8bKT4VtmKXcb1VuElg5qnNufodcuOjmx//51EAOKq1RkS8IdPXwW7+6JhP34fHDnTeT72w/WOg9euNZvjswisXARNWSHGSDt1kzijY6ag5ecYp7e7qqPEAQIyI8rqn47K938L09+4dk5Ojw0bHgJTUVxllX19a9CD0YEnH5G0COMGo9RIifS3Wr9RLWzf84VdnNkbX29Ehvpm8Q/pv9P+X7StOk88AAAAASUVORK5CYII=") 12 12, auto;
    --cursor-press: url("data:image/png;base64,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") 12 12, pointer;
  }
  html, body { cursor: var(--cursor-rest); }
  a, button, .btn, .text-link, summary, label,
  [role="button"], input[type="submit"], input[type="button"],
  .social-carousel__nav, .nav__toggle, .gallery-grid__item, .lightbox__close {
    cursor: var(--cursor-rest);
  }
  /* The colour flip: buttons and button-like controls */
  button:hover, .btn:hover, [role="button"]:hover,
  input[type="submit"]:hover, input[type="button"]:hover,
  .social-carousel__nav:hover, .nav__toggle:hover, .lightbox__close:hover {
    cursor: var(--cursor-press);
  }
  /* Typing still needs a caret */
  input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
  textarea, select, [contenteditable="true"] { cursor: text; }
  select { cursor: var(--cursor-press); }
  [disabled], .social-carousel__nav[disabled] { cursor: var(--cursor-rest); }
}

/* ====== CONNECT WIDGET ======
   Floating way to reach the studio, in place of a header button. Brand tokens
   only: ink panel, cream type, gold rule, sunflower on the button. */
.connect { position: fixed; right: 22px; bottom: 22px; z-index: 90; }
.connect__btn {
  width: 62px; height: 62px; border-radius: 50%; border: 0; cursor: pointer;
  background: var(--ink); box-shadow: 0 8px 26px rgba(74,21,40,0.34);
  display: grid; place-items: center; padding: 0;
  transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s ease;
}
.connect__btn img { width: 40px; height: 40px; object-fit: contain; }
.connect__btn:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 12px 32px rgba(74,21,40,0.42); }
.connect.is-open .connect__btn { transform: rotate(8deg) scale(0.96); }

.connect__panel {
  position: absolute; right: 0; bottom: 76px; width: 316px; max-width: calc(100vw - 44px);
  background: var(--ink); color: var(--cream); border-radius: 14px; overflow: hidden;
  box-shadow: 0 18px 50px rgba(74,21,40,0.34); animation: connect-in .34s cubic-bezier(.22,1,.36,1);
}
@keyframes connect-in { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }
.connect__head { display: flex; align-items: center; gap: 12px; padding: 18px 18px 14px; position: relative; }
.connect__mark { width: 34px; height: 34px; object-fit: contain; flex: 0 0 auto; }
.connect__title { font-family: var(--font-script); font-size: 1.32rem; line-height: 1; color: var(--cream); }
.connect__sub { font-size: .78rem; color: rgba(245,236,212,.72); margin-top: 3px; }
.connect__x { position: absolute; top: 10px; right: 12px; background: none; border: 0; color: rgba(245,236,212,.62);
  font-size: 1.4rem; line-height: 1; cursor: pointer; padding: 4px 6px; }
.connect__x:hover { color: var(--cream); }
.connect__body { padding: 0 12px 8px; }
.connect__row { display: flex; align-items: center; gap: 12px; padding: 11px 10px; border-radius: 9px;
  text-decoration: none; color: var(--cream); transition: background .25s ease; }
.connect__row:hover, .connect__row:focus-visible { background: rgba(245,236,212,.09); }
.connect__ico { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
  background: rgba(212,172,86,.16); color: var(--gold); font-size: .96rem; flex: 0 0 auto; }
.connect__row strong { display: block; font-size: .85rem; font-weight: 600; }
.connect__row em { display: block; font-style: normal; font-size: .74rem; color: rgba(245,236,212,.66); margin-top: 1px; }
.connect__cta { display: block; text-align: center; margin: 6px 12px 14px; padding: 12px;
  background: var(--gold); color: var(--ink); border-radius: 9px; text-decoration: none;
  font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.connect__cta:hover { background: #c39a45; }
@media (max-width: 600px) { .connect { right: 16px; bottom: 16px; }
  .connect__btn { width: 56px; height: 56px; } .connect__btn img { width: 36px; height: 36px; } }
@media (prefers-reduced-motion: reduce) { .connect__panel { animation: none; } .connect__btn { transition: none; } }

/* Fireflies rising out of the footer flowers. Sits behind the footer content so
   it can never intercept a click; the canvas paints itself, CSS just places it. */
.footer { position: relative; }
.fireflies { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.footer > *:not(.fireflies) { position: relative; z-index: 1; }
