/* MONUMENT NO. 001 — an isolated, motion-optional cinematic layer. */
.monument-preview, .monument-page {
  --monument-stone:#d9c6ab;
  --monument-muted:#c5b7a5;
  --monument-night:#080a0b;
  color:#f8f5ef;
  background:var(--monument-night);
}
.monument-preview { position:relative; height:190svh; min-height:1060px; border:0; isolation:isolate; }
.monument-preview .monument-preview-sticky { position:sticky; top:0; height:100svh; min-height:600px; overflow:hidden; }
.monument-image {
  position:absolute; inset:0; overflow:hidden;
  background:radial-gradient(ellipse at 50% 35%,#303031 0%,#101112 55%,#080a0b 90%);
}
.monument-image img {
  position:absolute; left:50%; top:0;
  width:auto; height:142svh; max-width:none;
  transform:translate3d(-50%,calc(-42svh + var(--monument-offset,0svh)),0);
  filter:brightness(.82) saturate(.79);
  will-change:transform;
}
.monument-image:after {
  content:""; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg,rgba(6,7,9,.94),rgba(6,7,9,.14) 35%,rgba(6,7,9,.08) 62%,rgba(6,7,9,.91)),
    linear-gradient(0deg,rgba(6,7,9,.89),transparent 28%,transparent 64%,rgba(6,7,9,.25));
}
.monument-preview-content {
  position:relative; height:100%; width:min(1460px,calc(100% - 72px)); margin:auto;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:clamp(3.5rem,8vh,6rem) 0 clamp(4rem,9vh,7rem);
  pointer-events:none;
}
.monument-label {
  margin:0; font:700 .7rem/1.6 var(--mono);
  letter-spacing:.18em; text-transform:uppercase; color:var(--monument-stone);
}
.monument-preview-lead { max-width:480px; }
.monument-preview-lead h2, .monument-page h1, .monument-closing h2 {
  font-family:var(--serif); font-weight:400; letter-spacing:-.055em; line-height:.97;
}
.monument-preview-lead h2 { font-size:clamp(3.2rem,6.6vw,7rem); margin:.75rem 0 1.1rem; text-wrap:balance; }
.monument-preview-lead h2 em { font-style:italic; color:var(--monument-stone); }
.monument-preview-lead p:not(.monument-label) { max-width:360px; margin:0; color:#e0d9cb; line-height:1.65; }
.monument-preview-bottom { align-self:flex-end; text-align:right; max-width:400px; }
.monument-preview-bottom p { margin:0 0 1.2rem; font-family:var(--serif); font-size:clamp(1.1rem,1.65vw,1.55rem); }
.monument-link {
  display:inline-flex; align-items:center; justify-content:space-between; gap:2.6rem;
  padding:1.05rem 1.35rem; border:1px solid rgba(244,239,230,.62);
  background:rgba(8,9,11,.72); color:#fff; text-decoration:none;
  font:800 .72rem/1.2 var(--mono); letter-spacing:.09em; text-transform:uppercase;
  pointer-events:auto; transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.monument-link:hover,.monument-link:focus-visible { background:#f4f1ea; color:#111; border-color:#f4f1ea; }
.monument-link:focus-visible,.monument-page a:focus-visible {
  outline:2px solid var(--monument-stone); outline-offset:4px;
}
.monument-progress-track {
  position:absolute; bottom:0; left:0; height:3px; width:100%;
  background:rgba(255,255,255,.13);
}
.monument-progress-track:after {
  content:""; display:block; height:100%; width:var(--monument-progress-pct,0%);
  background:var(--monument-stone);
}
.monument-page .monument-intro {
  min-height:80svh; display:flex; align-items:center; position:relative; overflow:hidden;
  border-bottom:1px solid rgba(255,255,255,.18);
}
.monument-page .monument-intro:after {
  content:"001"; position:absolute; right:1vw; bottom:-.32em;
  font:400 clamp(18rem,38vw,39rem)/1 var(--serif);
  letter-spacing:-.09em; color:rgba(255,255,255,.025); pointer-events:none;
}
.monument-page .monument-intro-inner { width:min(1150px,calc(100% - 48px)); margin:auto; position:relative; z-index:1; padding:5rem 0; }
.monument-page h1 { max-width:930px; font-size:clamp(4.2rem,10vw,10rem); margin:1rem 0 1.75rem; }
.monument-page .monument-intro-deck { color:#d0c3b2; font:400 clamp(1.25rem,2vw,1.75rem)/1.5 var(--serif); max-width:620px; }
.monument-page .monument-scroll-cue {
  margin-top:clamp(3rem,12vh,7rem); font:700 .7rem var(--mono);
  letter-spacing:.14em; color:#e2d0b7; text-transform:uppercase;
}
.monument-tour { height:440svh; position:relative; isolation:isolate; }
.monument-tour-stage { height:100svh; position:sticky; top:0; z-index:0; overflow:hidden; }
.monument-tour-stage .monument-image img { filter:brightness(.85) saturate(.82); }
.monument-tour-stage .monument-image:after {
  background:linear-gradient(90deg,rgba(5,6,8,.96),rgba(5,6,8,.21) 30%,rgba(5,6,8,.1) 65%,rgba(5,6,8,.93)),
    linear-gradient(0deg,rgba(5,6,8,.46),transparent 26%,transparent 70%,rgba(5,6,8,.2));
}
.monument-tour-stamp {
  position:absolute; top:7vh; left:max(32px,calc((100vw - 1380px)/2)); z-index:2;
  color:#f3dec6; font:700 .7rem/1.5 var(--mono); letter-spacing:.12em;
}
.monument-tour-stamp span { color:rgba(243,222,198,.56); }
.monument-tour-steps { position:absolute; inset:0; z-index:1; pointer-events:none; }
.monument-beat {
  height:110svh; min-height:620px;
  display:flex; align-items:center; padding:9rem max(32px,calc((100vw - 1380px)/2));
}
.monument-beat:nth-child(even) { justify-content:flex-end; }
.monument-beat:nth-child(odd) { justify-content:flex-start; }
.monument-beat-card {
  max-width:345px; padding:1.5rem 1.55rem 1.75rem;
  background:rgba(7,9,10,.82); border-left:1px solid rgba(233,207,175,.72);
  backdrop-filter:blur(8px); pointer-events:auto;
}
.monument-beat-number { font:700 .7rem var(--mono); letter-spacing:.14em; color:#ceb698; }
.monument-beat-card h2 { font:400 clamp(2.2rem,3.3vw,3.4rem)/1.04 var(--serif); letter-spacing:-.045em; margin:.75rem 0; }
.monument-beat-card p { margin:.9rem 0 0; color:#ded4c6; font-size:.98rem; line-height:1.6; }
.monument-beat-card a { display:inline-flex; margin-top:1.5rem; color:#e6c4a0; font:700 .76rem var(--mono); text-decoration-thickness:1px; }
.monument-full {
  padding:clamp(5rem,11vw,12rem) 24px clamp(4rem,8vw,8rem);
  border-top:1px solid #2a2926; text-align:center;
  background:#100f10;
}
.monument-full .monument-full-inner { width:min(1020px,100%); margin:auto; }
.monument-full h2 { margin:.8rem auto 2rem; font:400 clamp(2.5rem,5vw,5.6rem)/1 var(--serif); letter-spacing:-.05em; }
.monument-full picture img {
  display:block; width:min(700px,100%); height:auto;
  margin:0 auto; box-shadow:0 35px 100px rgba(0,0,0,.6);
}
.monument-full-caption {
  margin:1.5rem auto 0; color:#b8aa9b; max-width:700px; text-align:left;
  font:600 .68rem/1.6 var(--mono); letter-spacing:.08em;
}
.monument-closing { padding:clamp(6rem,13vw,13rem) 24px; background:#eee9e0; color:#171512; text-align:center; }
.monument-closing-inner { width:min(960px,100%); margin:auto; }
.monument-closing .monument-label { color:#6f332d; }
.monument-closing h2 { font-size:clamp(3.2rem,7.8vw,8rem); margin:.9rem auto 2.4rem; }
.monument-closing blockquote { margin:0 auto; width:min(780px,100%); font:400 clamp(1.4rem,2.6vw,2.4rem)/1.52 var(--serif); }
.monument-closing blockquote p { margin:0 0 1.8rem; }
.monument-closing .monument-last-word { font-style:italic; }
.monument-exits { display:flex; justify-content:center; flex-wrap:wrap; gap:1rem; margin-top:3.5rem; }
.monument-exits a {
  display:inline-flex; padding:.9rem 1.1rem; border:1px solid #2c2925;
  font:700 .72rem var(--mono); text-decoration:none; text-transform:uppercase;
}
.monument-exits a:hover { background:#171512; color:#fff; }
.monument-page footer { background:var(--bg); color:var(--ink); }
@media (max-width:750px) {
  .monument-preview { height:145svh; min-height:790px; }
  .monument-preview .monument-preview-sticky { min-height:520px; }
  .monument-image img { height:112svh; transform:translate3d(-50%,calc(-12svh + var(--monument-offset-mobile,0svh)),0); }
  .monument-image:after { background:linear-gradient(0deg,rgba(6,7,9,.94) 0%,rgba(6,7,9,.18) 39%,rgba(6,7,9,.17) 60%,rgba(6,7,9,.76)); }
  .monument-preview-content { width:calc(100% - 36px); padding:2rem 0 2.7rem; }
  .monument-preview-lead { max-width:350px; }
  .monument-preview-lead h2 { font-size:clamp(2.8rem,10vw,4.8rem); max-width:320px; }
  .monument-preview-lead p:not(.monument-label) { font-size:.84rem; max-width:260px; }
  .monument-preview-bottom { align-self:flex-start; text-align:left; }
  .monument-preview-bottom p { font-size:1.02rem; }
  .monument-page .monument-intro { min-height:75svh; }
  .monument-page h1 { font-size:clamp(3.3rem,12vw,6rem); }
  .monument-tour { height:400svh; }
  .monument-tour-stage .monument-image img { height:112svh; }
  .monument-tour-stamp { top:3.5rem; left:18px; font-size:.63rem; }
  .monument-beat { height:100svh; padding:4.5rem 18px 2rem; align-items:flex-end; min-height:500px; }
  .monument-beat:nth-child(even) { justify-content:flex-start; }
  .monument-beat-card { max-width:min(330px,100%); padding:1rem 1.1rem 1.2rem; }
  .monument-beat-card h2 { font-size:2.3rem; }
  .monument-beat-card p { font-size:.86rem; }
  .monument-beat-card a { margin-top:.8rem; }
  .monument-closing blockquote { font-size:1.4rem; }
}
@media (prefers-reduced-motion:reduce) {
  .monument-image img { transform:translate3d(-50%, -12svh, 0)!important; will-change:auto; }
  .monument-link { transition:none; }
  .monument-preview { height:auto; min-height:85svh; }
  .monument-preview .monument-preview-sticky { position:relative; min-height:85svh; }
  .monument-tour { height:auto; }
  .monument-tour-stage { position:relative; }
  .monument-tour-steps { position:relative; background:#0a0b0c; }
  .monument-beat { height:auto; min-height:0; padding:2rem 18px; }
  .monument-tour-stamp { display:none; }
}