.product-chapter { font-family: "Moments Sans", var(--sans); }
.product-chapter h2 { font-family: "Moments Serif", var(--serif); font-size: clamp(40px, 4.1vw, 70px); line-height: 1.45; font-weight: 400; letter-spacing: .035em; margin: 0; }
.product-eyebrow { margin: 0 0 2vh; color: #cfc3a8; font-size: 12px; line-height: 1.8; letter-spacing: .17em; }
/* The first product screen gives the still life space to hold attention. */
.heat-copy { top: 32vh; left: 63vw; }
.heat-copy .chapter-link { margin-top: 5vh; }
.heat-copy h2 { font-size: clamp(40px, 3.6vw, 64px); }
.heat-glow { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse 26% 45% at 30% 52%, #fbe0a9 0, transparent 72%); mix-blend-mode: soft-light; opacity: .08; animation: product-warm-light 8s ease-in-out infinite; animation-play-state: var(--heat-light-motion, paused); }
@keyframes product-warm-light { 0%,100% { opacity: .045; transform: translateX(-2%); } 50% { opacity: .2; transform: translateX(4%); } }
.master-chapter { background: #eeeade; color: #273e30; }
.master-heading-block { position: absolute; top: 28vh; left: 8.4vw; width: 40vw; }
.master-heading-block .product-eyebrow { color: #68775e; }
.master-intro { font-size: clamp(14px, 1.15vw, 19px); line-height: 2.05; letter-spacing: .045em; margin: 3vh 0 0; color: #5d6c5e; }
.master-watermark { position: absolute; left: 4vw; bottom: 12vh; font-family: "Moments Serif", var(--serif); font-size: 21vw; line-height: 1; letter-spacing: .12em; color: #7181620b; pointer-events: none; }
.master-provenance { position: absolute; top: 24vh; left: 55vw; right: 9vw; padding-left: 4vw; border-left: 1px solid #64735940; }
.master-seal { display: block; width: clamp(78px, 7vw, 120px); height: auto; margin: 0 0 2.8vh; overflow: hidden; }
.master-team { margin: 0; font-size: clamp(14px, 1.1vw, 18px); line-height: 2; letter-spacing: .05em; }
.master-team strong { font-family: "Moments Serif", var(--serif); font-size: clamp(24px, 2.1vw, 37px); font-weight: 400; line-height: 1.8; white-space: nowrap; }
.master-license { margin: 1.5vh 0 2.5vh; font-size: clamp(16px, 1.4vw, 24px); letter-spacing: .12em; color: #9b5138; }
.master-description { margin: 0; padding-top: 2vh; border-top: 1px solid #64735930; font-size: clamp(12px, .95vw, 16px); line-height: 1.95; color: #6d7566; }
.master-chapter a:focus-visible { outline-color: #273e30; }
.craft-chapter { background: #0b2115; }
.craft-copy { position: absolute; left: 8.4vw; top: 23vh; width: 30vw; z-index: 2; }
.craft-copy .heat-timing { margin: 4vh 0 3vh; }
.craft-summary { font-size: clamp(13px, 1vw, 17px); line-height: 1.95; letter-spacing: .03em; color: #f3f0e6c0; }
.layer-figure { position: absolute; width: 84vw; aspect-ratio: 1672 / 941; left: 12vw; top: 51%; transform: translateY(-50%); margin: 0; }
.layer-figure > img { display: block; width: 100%; height: 100%; mask-image: linear-gradient(90deg, transparent 13%, #000 34% 85%, transparent 97%), linear-gradient(180deg, transparent, #000 9% 88%, transparent); mask-composite: intersect; }
.layer-labels { list-style: none; padding: 0; margin: 0; }
.layer-labels li { position: absolute; left: 88%; top: var(--layer-y); transform: translateY(-50%); width: 12%; font-size: clamp(12px, .89vw, 15px); line-height: 1.7; letter-spacing: .02em; color: #eeeade; }
.layer-labels li span { display: block; font-family: Georgia, serif; font-size: 10px; letter-spacing: .12em; color: #bea980; margin-bottom: .35vh; }
.layer-labels li::before { content: ""; position: absolute; width: 2vw; height: 1px; background: #e3d5b763; top: 50%; right: calc(100% + .7vw); }
.layer-figure figcaption { position: absolute; right: 11%; bottom: 2vh; font-size: 10px; letter-spacing: .07em; color: #f3f0e673; }
.ritual-chapter { background: #102017; }
.ritual-images, .ritual-images img, .ritual-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.ritual-images img { object-fit: cover; object-position: center; opacity: 0; transform: scale(1.02); transition: opacity 800ms ease, transform 2400ms ease; }
.ritual-images img.is-shown { opacity: 1; transform: scale(1); }
.ritual-shade { background: linear-gradient(90deg, #08170fc7, #08170f73 35%, transparent 66%), linear-gradient(180deg, #08170f48, transparent 25% 80%, #08170f7d); pointer-events: none; }
.ritual-copy { position: absolute; left: 8.4vw; top: 27vh; width: 39vw; }
.ritual-intro { font-size: clamp(14px, 1.15vw, 19px); line-height: 1.95; margin: 2.4vh 0 4.8vh; letter-spacing: .05em; color: #f3f0e6dc; }
.ritual-tabs { display: flex; gap: 2vw; }
.ritual-tabs button { padding: 0 0 1.2vh; border: 0; border-bottom: 1px solid #f3f0e633; background: transparent; color: #f3f0e69c; font-family: "Moments Sans", var(--sans); font-size: clamp(13px, 1vw, 17px); letter-spacing: .04em; cursor: pointer; transition: color 300ms, border-color 300ms; }
.ritual-tabs button[aria-selected=true] { color: #ecd6af; border-bottom-color: #ecd6af; }
.ritual-tabs button:hover { color: #f3f0e6; }
.ritual-tabs button:focus-visible { outline: 1px solid #ecd6af; outline-offset: 6px; }
.ritual-caption { margin-top: 2.3vh; font-size: clamp(12px, .95vw, 16px); line-height: 1.9; color: #f3f0e6b5; }
.product-progress { position: absolute; z-index: 21; right: 6.6vw; top: 13.5vh; display: flex; gap: 2.2vw; font-family: "Moments Sans", var(--sans); font-size: 11px; letter-spacing: .1em; color: #f3f0e69c; opacity: 0; pointer-events: none; }
.product-progress a { padding-bottom: .7vh; border-bottom: 1px solid transparent; }
.product-progress a[aria-current=step] { color: #ecd6af; border-color: currentColor; }
.stage.is-product .product-progress { opacity: 1; pointer-events: auto; }
.stage.is-light .product-progress { color: #657361; }
.stage.is-light .product-progress a[aria-current=step] { color: #925237; }
.motion-enabled .story:has(.ritual-chapter) { height: 925vh; }
.motion-enabled .master-chapter { z-index: 6; background: #eeeade; opacity: var(--master-opacity, 0); }
.motion-enabled .craft-chapter { z-index: 7; background: #0b2115; opacity: var(--craft-opacity, 0); }
.motion-enabled .ritual-chapter { z-index: 8; background: #102017; opacity: var(--ritual-opacity, 0); }
.motion-enabled .master-heading-block, .motion-enabled .master-provenance { opacity: var(--master-copy-opacity, 0); }
.motion-enabled .craft-copy, .motion-enabled .layer-labels, .motion-enabled .layer-figure figcaption { opacity: var(--craft-copy-opacity, 0); }
.motion-enabled .ritual-copy { opacity: var(--ritual-copy-opacity, 0); }
.motion-enabled .heat-copy, .motion-enabled .heat-foot { opacity: calc(var(--heat-copy-opacity, 0) * var(--heat-exit-opacity, 1)); }
@media (max-height: 760px) {
  .heat-copy { top: 31vh; }
  .craft-copy { top: 21vh; }
  .craft-copy .heat-timing { margin: 2.8vh 0 2.4vh; }
}
@media (max-aspect-ratio: 4/3) {
  .heat-copy { top: 25vh; }
  .master-heading-block { top: 30vh; }
  .master-provenance { top: 26vh; }
  .craft-copy { top: 27vh; }
  .ritual-copy { top: 27vh; }
  .ritual-images img { object-position: 60% center; }
}
