.spc-story{position:relative;isolation:isolate;background:#fff;color:#1b1d1b;font-family:var(--body-fontFamily,Inter,sans-serif);height:auto;z-index:35}
.spc-sticky{position:relative;background:#fff;overflow:hidden}
.spc-story.spc-ready{height:calc(var(--spc-stage-height) + var(--spc-runway))}
.spc-ready .spc-sticky{position:sticky;top:var(--spc-pin-top,0)}
.spc-inner{position:relative;max-width:1440px;margin:0 auto;padding:40px 60px 28px}
.spc-header{position:relative;z-index:3;max-width:740px}
.spc-eyebrow{font:500 12px/1.5 var(--body-fontFamily,Inter,sans-serif);letter-spacing:3px;text-transform:uppercase;color:#817350;margin:0 0 14px}
.spc-header h2{font:600 clamp(36px,3.6vw,54px)/1.1 var(--head-fontFamily,Lora,serif);letter-spacing:-1.2px;color:#181c1a;margin:0 0 13px}
.spc-intro{font-size:16px;line-height:1.6;color:#646b66;margin:0;max-width:570px}
.spc-composition{position:relative;display:grid;grid-template-columns:minmax(290px,36%) minmax(0,1fr);height:clamp(460px,calc(100svh - 292px),600px);min-height:460px;margin-top:24px}
.spc-labels{list-style:none;padding:0!important;margin:0!important;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:3;gap:22px}
.spc-layer-copy{display:grid;grid-template-columns:26px 1fr;gap:13px;margin:0!important;position:relative;padding-right:32px;max-width:420px;transform:translate3d(0,0,0)}
.spc-number{font-size:12px;line-height:24px;letter-spacing:1px;color:#897b5e;padding-top:1px}
.spc-layer-copy h3{font-family:var(--head-fontFamily,Lora,serif);font-size:20px;font-weight:500;line-height:1.35;color:#222823;margin:0 0 6px}
.spc-layer-copy p{font-size:14px;line-height:1.6;color:#646b66;margin:0;max-width:360px;white-space:pre-line}
.spc-visual{position:relative;min-width:0;margin:0 -30px 0 0;overflow:hidden}
.spc-canvas{position:absolute;inset:0;display:block;width:100%;height:100%;opacity:0}
.spc-ready .spc-canvas{opacity:1}
.spc-material-note{position:absolute;bottom:0;right:28px;display:flex;flex-direction:column;gap:4px;text-align:right;pointer-events:none}
.spc-material-note span:first-child{font-size:12px;letter-spacing:4px;color:#5b604f}
.spc-material-note span:last-child{font-size:10px;letter-spacing:1.5px;color:#858c81}
.spc-connectors{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2}
.spc-connectors path{fill:none;stroke:var(--action-accent);stroke-width:1.25;vector-effect:non-scaling-stroke}
.spc-connectors circle{fill:var(--action-accent);stroke:#fff;stroke-width:1.5}
.spc-connectors g{opacity:0}
.spc-footer{position:relative;display:flex;align-items:center;gap:24px;border-top:1px solid #e5e7e2;padding-top:20px;margin-top:32px}
.spc-scroll-cue{display:flex;align-items:center;gap:13px;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#737b6e}
.spc-scroll-line{width:1px;height:23px;background:var(--action-accent);position:relative}
.spc-scroll-line:after{content:"";width:5px;height:5px;position:absolute;bottom:0;left:-2px;border-right:1px solid var(--action-accent);border-bottom:1px solid var(--action-accent);transform:rotate(45deg)}
.spc-progress-label{font-size:12px;letter-spacing:2px;color:#757d6d;margin-left:auto}
.spc-progress{width:160px;height:1px;background:#e1e4dc}
.spc-progress>span{display:block;width:100%;height:1px;background:var(--action-accent);transform:scaleX(0);transform-origin:left}
.spc-fallback{position:absolute;inset:20% 10%;display:flex;flex-direction:column;justify-content:center;gap:24px}
.spc-fallback img{width:100%;height:160px;object-fit:cover;object-position:center;border:1px solid #c7c0b1}
.spc-fallback span{font-size:12px;letter-spacing:4px;color:#7d7158;text-align:center}
.spc-ready .spc-fallback,.spc-story:not(.spc-ready) .spc-connectors{display:none}
.spc-page#main-body{overflow:visible!important;height:auto}
@media(max-height:800px) and (min-width:801px){.spc-inner{padding-top:40px;padding-bottom:30px}.spc-header h2{font-size:40px}.spc-composition{margin-top:26px;min-height:460px}.spc-labels{gap:16px}.spc-layer-copy h3{font-size:18px;margin-bottom:4px}.spc-footer{margin-top:26px}}
@media(max-width:1100px) and (min-width:801px){.spc-inner{padding-left:32px;padding-right:32px}.spc-composition{grid-template-columns:40% minmax(0,1fr)}.spc-layer-copy{padding-right:20px}.spc-visual{margin-right:-16px}}
@media(max-width:800px){.spc-story.spc-ready{height:auto}.spc-ready .spc-sticky{position:relative;top:auto}.spc-inner{padding:40px 24px 30px}.spc-eyebrow{font-size:12px;letter-spacing:2px;margin-bottom:10px}.spc-header h2{font-size:clamp(30px,7vw,40px);letter-spacing:-.6px}.spc-intro{font-size:15px;line-height:1.5}.spc-composition{display:flex;flex-direction:column-reverse;height:auto;min-height:0;margin-top:12px}.spc-visual{height:clamp(270px,70vw,430px);margin:0 -12px 30px;flex:none}.spc-labels{display:grid;gap:22px}.spc-layer-copy{max-width:none;padding:0;grid-template-columns:26px 1fr;gap:12px}.spc-layer-copy h3{font-size:21px}.spc-layer-copy p{font-size:15px;max-width:none}.spc-number{line-height:28px}.spc-connectors{display:block}.spc-material-note{right:12px;bottom:0}.spc-footer{gap:12px;margin-top:28px}.spc-scroll-cue{font-size:10px;letter-spacing:1px;gap:8px}.spc-progress{width:54px}.spc-progress-label{font-size:11px}}
@media(prefers-reduced-motion:reduce){.spc-story.spc-ready{height:auto}.spc-ready .spc-sticky{position:relative;top:auto}.spc-layer-copy{opacity:1!important;transform:none!important}.spc-scroll-cue{display:none}.spc-progress>span{transform:scaleX(1)!important}}

.spc-intro-logo{display:none;position:absolute;inset:0 auto 0 0;width:36%;align-items:center;justify-content:center;z-index:4;pointer-events:none;transform-origin:center}
.spc-ready .spc-intro-logo{display:flex}
.spc-intro-logo img{display:block;width:220px;max-width:62%;height:auto;object-fit:contain}
@media(max-width:1100px) and (min-width:801px){.spc-intro-logo{width:40%}.spc-intro-logo img{width:190px}}
@media(max-width:800px){.spc-intro-logo{inset:8px auto auto 0;width:85px;height:85px}.spc-intro-logo img{width:70px;max-width:100%}}
@media(prefers-reduced-motion:reduce){.spc-ready .spc-intro-logo{display:none}}

/* Projected numbered markers retain the layer-to-description link on small screens. */
.spc-layer-marker{position:absolute;z-index:3;width:28px;height:28px;padding:0;display:grid;place-items:center;border:1px solid var(--action-bg);border-radius:50%;background:#fff;color:var(--action-bg);font:500 11px/1 Inter,Arial,sans-serif;transform:translate(-50%,-50%);box-shadow:0 1px 7px #2222;cursor:pointer;opacity:0}
.spc-layer-marker:disabled{pointer-events:none}
.spc-number{width:28px;height:28px;display:grid;place-items:center;padding:0;border:1px solid var(--action-accent);border-radius:50%;background:white;letter-spacing:0;font:500 11px/1 Inter,Arial,sans-serif;cursor:pointer}
.spc-layer-copy.is-highlighted .spc-number,.spc-layer-marker.is-highlighted{background:var(--action-bg);color:var(--action-text);border-color:var(--action-bg)}
.spc-layer-copy.is-highlighted h3{color:var(--action-hover)}
.spc-number:focus-visible,.spc-layer-marker:focus-visible{outline:2px solid var(--action-bg);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.collection-photo img{transition:none}}

/* Numbered layer markers are a mobile navigation aid. */
@media(min-width:801px){.spc-layer-marker{display:none}}
