/* ── Section shell ── */
.intro-section {
  text-align: center;
}

/* ── Small uppercase label ── */
.s-tag {
  display: block;
  font-family: var(--font-body);
  font-size: 7px;
  letter-spacing: .58em;
  text-transform: uppercase;
  color: #A89F94;
  margin-bottom: 12px;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity .7s ease, transform .7s cubic-bezier(.16,1,.3,1);
}
.s-tag.on { opacity: 1; transform: none; }

/* ── Script heading — word split ── */
.intro-script {
  font-family: var(--font-heading);
  font-size: clamp(28px, 7vw, 44px);
  color: #2E2820;
  line-height: 1.5;
  margin-bottom: 0;
}

/* Word-split wrappers added by JS */
.w-outer {
  display: inline-block;
  overflow: hidden;
  vertical-align: bottom;
}
.w-inner {
  display: inline-block;
  transform: translateY(110%);
  transition: transform .9s cubic-bezier(.16,1,.3,1);
}

/* ── Gold rule — draws left to right ── */
.rule-draw {
  display: block;
  margin: 14px auto;
  width: 32px;
  height: 1px;
  background: #C9A96E;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .8s cubic-bezier(.16,1,.3,1);
}
.rule-draw.on { transform: scaleX(1); }

/* ── Body text ── */
.intro-body {
  font-family: var(--font-body);
  font-size: 13px;
  line-height: 2.3;
  color: #7A7068;
  letter-spacing: .05em;
  max-width: 420px;
  margin: 0 auto;
  opacity: 0;
  transform: translateY(24px);
  transition: opacity .9s ease, transform .9s cubic-bezier(.16,1,.3,1);
}
.intro-body.on { opacity: 1; transform: none; }

/* ── Section image ── */
.intro-img {
  display: block;
  margin: 0 auto 20px;
  max-width: clamp(120px, 40vw, 220px);
  opacity: 0;
  transform: translateY(20px) scale(.96);
  transition: opacity .9s ease, transform .9s cubic-bezier(.16,1,.3,1);
}
.intro-img.on { opacity: 1; transform: none; }