:root {
  --grad: var(--gradient-spirit);
  --max: 1100px;
  --pad: clamp(20px, 4vw, 64px);
}
body { color: var(--ink-900); }

/* ===== HERO ===== */
.hero { padding: clamp(56px, 7vw, 100px) var(--pad) clamp(20px, 2.5vw, 32px); position: relative; overflow: visible; }
.hero .inner { max-width: var(--max); margin: 0 auto; position: relative; text-align: center; }
.eyebrow { font-family: var(--font-serif); font-style: italic; font-size: 17px; letter-spacing: 0.04em; color: var(--ink-500); display: inline-flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.eyebrow::before { content: ""; width: 30px; height: 1px; background: currentColor; }
.hero h1 { font-family: var(--font-serif); font-weight: 600; font-size: clamp(56px, 7vw, 108px); line-height: 0.98; letter-spacing: -0.018em; margin: 0 0 16px; text-wrap: balance; }
.hero .sub { font-family: var(--font-serif); font-style: italic; font-size: clamp(22px, 2.2vw, 30px); line-height: 1.3; color: var(--ink-500); margin: 0; text-wrap: balance; }

.grad-word { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; font-style: italic; }

/* Hero dove (free-flying dove) */
.hero .dove-fly {
  position: absolute;
  right: 6%;
  top: 8%;
  width: clamp(140px, 18vw, 240px);
  z-index: 1;
  transform: rotate(-8deg);
  pointer-events: none;
}
.hero .dove-fly img { width: 100%; height: auto; background: transparent; background-color: transparent; display: block; }

/* ===== BODY ===== */
.body { padding: 0 var(--pad) 0; }
.body .inner { max-width: 680px; margin: 0 auto; position: relative; }
.body p { font-family: var(--font-serif); font-size: clamp(19px, 1.5vw, 22px); line-height: 1.6; color: var(--ink-700); margin: 0 0 24px; }
.body p:last-of-type { margin-bottom: 0; }
.body p em { font-style: italic; }

/* ===== JP2 QUOTE ===== */
.jp2-quote { margin: 36px auto 0; padding: 0; border-left: 0; max-width: 1000px; text-align: center; }
.jp2-quote blockquote { margin: 0; font-family: var(--font-serif); font-style: italic; font-weight: 600; font-size: clamp(16px, 1.55vw, 22px); line-height: 1.3; color: var(--ink-900); white-space: nowrap; }
.jp2-quote figcaption { text-align: center; }
.jp2-quote figcaption { margin-top: 14px; font-family: var(--font-serif); font-style: italic; font-size: clamp(14px, 1.05vw, 16px); color: var(--ink-500); letter-spacing: 0.02em; }
.jp2-quote figcaption cite { font-style: italic; }

/* Founder signature */
.body .signature { font-family: var(--font-script); font-weight: 500; font-style: normal; font-size: clamp(36px, 3.4vw, 52px); line-height: 1; color: var(--ink-900); margin-top: 28px; text-align: center; }
.body .signature-cta { margin: 56px 0 56px; text-align: center; }
.body .signature-cta .btn { padding: 16px 28px; font-size: 18px; }

/* ===== ARTWORK ===== */
.artwork { padding: 0 var(--pad) clamp(48px, 6vw, 96px); }
.artwork .inner { max-width: 960px; margin: 0 auto; }
.art-figure { margin: 0; padding: 0 clamp(16px, 3vw, 36px) clamp(16px, 2vw, 24px); }
.art-figure .photo-card { aspect-ratio: 16/11; max-width: 880px; margin: 0 auto; }
.art-figure figcaption { margin-top: 28px; text-align: center; font-family: var(--font-serif); font-style: italic; font-size: clamp(13px, 1vw, 15px); color: var(--ink-500); letter-spacing: 0.04em; }
.art-figure figcaption cite { font-style: italic; }

/* ===== PHOTOS ===== */
.photo-card { position: relative; }
.photo-card .photo { position: relative; z-index: 2; width: 100%; height: 100%; object-fit: cover; border-radius: 6px; display: block; }
.photo-card::before {
  content: "";
  position: absolute; inset: 0;
  background: var(--grad);
  border-radius: 6px;
  transform: rotate(4deg) translate(14px, 14px);
  z-index: 1;
}
.photo-card.tilt-l::before { transform: rotate(-4deg) translate(-14px, 14px); }
.photo-card.tilt-soft::before { transform: rotate(3deg) translate(10px, 10px); }

/* ===== CTA BAND ===== */
.cta-band { padding: clamp(64px, 8vw, 120px) var(--pad); background: var(--ink-900); color: var(--cream-100); position: relative; overflow: hidden; }
.cta-band::after { content: ""; position: absolute; inset: -20% -10% auto auto; width: 60%; height: 100%; background: radial-gradient(closest-side, rgba(255,122,46,0.20), transparent 70%); pointer-events: none; }
.cta-band .inner { max-width: var(--max); margin: 0 auto; position: relative; z-index: 2; text-align: center; }
.cta-band .eyebrow { color: rgba(244,239,224,0.6); }
.cta-band h2 { font-family: var(--font-serif); font-weight: 600; font-size: clamp(40px, 5.4vw, 84px); line-height: 1.02; letter-spacing: -0.014em; margin: 0 0 16px; color: var(--cream-100); text-wrap: balance; }
.cta-band p { font-family: var(--font-serif); font-size: clamp(18px, 1.4vw, 22px); line-height: 1.5; color: rgba(244,239,224,0.85); margin: 0 auto 36px; max-width: 56ch; }
.cta-band .btn { padding: 18px 32px; font-size: 19px; }

@media (max-width: 880px) {
  .stack { aspect-ratio: 1/1.1; }
  .stack .sq { width: 70%; }
  .stack .sq.back { right: 0; top: 0; }
  .stack .sq.front { left: 0; bottom: 0; }
  .hero .dove-fly { right: -8%; top: -10%; width: 40%; }
  .jp2-quote blockquote { white-space: normal; }
}
