/* Illustrated stage: each era is one continuous, full-viewport composition. */
.hero{height:100svh;min-height:650px;background:#1d2a22}
.hero-photo{position:absolute;inset:0;max-width:none;object-position:center;filter:saturate(.88) contrast(1.05);transform:translate3d(0,var(--hero-pan,0px),0) scale(1.045);will-change:transform}
.hero-foreground{position:absolute;inset:-3% -3% auto;width:106%;height:109%;max-width:none;object-fit:cover;pointer-events:none;transform:translate3d(0,var(--hero-foreground,0px),0) scale(1.03);will-change:transform}
.hero-shade{background:linear-gradient(90deg,#111d19e6 0%,#111d19ae 32%,#111d1938 67%,transparent 100%),linear-gradient(0deg,#0d1715a6,transparent 37%)}
.hero-content{z-index:2;left:max(3.8vw,calc((100vw - 1400px)/2));transform:translateY(-30%)}
.hero h1{font-size:clamp(4rem,7.3vw,8.3rem);max-width:850px;text-shadow:0 5px 35px #0c1917a0}
.hero-caption{z-index:2;text-shadow:0 2px 8px #0b1815}
.era-indicator{top:auto;bottom:1.4rem;transform:none;width:170px}
.story-act{background:#17251e}
.story-act+.story-act{border:0}
.act-stage:after{z-index:4;background:linear-gradient(90deg,transparent 0%,#0a171326 46%,#0d1b17bf 68%,#0d1b17ec 100%),linear-gradient(0deg,#111f1966,transparent 19%,transparent 85%,#111f1955)}
.art-scene{position:absolute;inset:0;overflow:hidden;background:#273a31;isolation:isolate}
.art-scene>img,.art-atmosphere,.art-light{position:absolute;display:block;pointer-events:none}
.art-before,.art-backdrop,.art-next,.art-final{inset:-3%;width:106%;height:106%;max-width:none;object-fit:cover;object-position:center;transform:translate3d(var(--art-pan,0%),var(--art-rise,0%),0) scale(var(--art-zoom,1.06));will-change:transform}
.art-before{z-index:0}
.art-backdrop{z-index:0}
.act-povoado .art-backdrop{z-index:1;mask-image:linear-gradient(90deg,#000 calc(var(--village-reveal,110%) - 6%),transparent calc(var(--village-reveal,110%) + 6%))}
.art-next{z-index:2;mask-image:linear-gradient(90deg,#000 calc(var(--fair-reveal,0%) - 6%),transparent calc(var(--fair-reveal,0%) + 6%))}
.art-final{z-index:2;mask-image:linear-gradient(90deg,#000 calc(var(--chapel-reveal,0%) - 6%),transparent calc(var(--chapel-reveal,0%) + 6%))}
.art-atmosphere{z-index:2;inset:0;background:linear-gradient(118deg,transparent 11%,#f8d99b19 33%,transparent 55%);opacity:.65;transform:translateX(var(--light-shift,0%));mix-blend-mode:screen}
.art-gear{z-index:3;left:44%;top:12%;width:clamp(160px,17vw,300px);height:auto;max-width:none;filter:drop-shadow(5px 11px 9px #26170d9c);transform:translate(-50%,-50%) rotate(var(--wheel-angle,0deg));transform-origin:center;will-change:transform}
.art-actor{z-index:3;left:24%;bottom:-5%;width:auto;height:37%;max-width:none;object-fit:contain;filter:drop-shadow(12px 14px 8px #1417118c);transform:translate3d(var(--actor-walk,0px),var(--actor-bob,0px),0);will-change:transform}
.act-origens .art-actor{left:29%;height:31%;bottom:0;opacity:.84}
.act-povoado .art-actor{left:28%;height:44%;bottom:-7%;opacity:var(--vendor-opacity,0)}
.art-foreground{z-index:5;inset:-5%;width:110%;height:110%;max-width:none;object-fit:cover;transform:translate3d(var(--foreground-pan,0%),var(--foreground-rise,0%),0) scale(1.06);will-change:transform}
.art-light{z-index:6;inset:0;background:linear-gradient(115deg,#e3af5940,transparent 28%);mix-blend-mode:screen;transform:translateX(var(--light-shift,0%));opacity:.55}
.act-povoado .art-foreground{opacity:var(--vendor-opacity,0)}
.act-povoado .art-scene{background:#564632}
.act-track,.names-track,.civic-track{z-index:7}
.act-intro,.story-step{width:min(31vw,450px);margin-right:max(4.5vw,calc((100vw - 1410px)/2));padding-left:0;filter:opacity(.28);text-shadow:0 2px 16px #07110e}
.act-intro.is-current,.story-step.is-current{filter:opacity(1)}
.act-intro h2{font-size:clamp(2.8rem,4vw,5.2rem)}
.story-step h3{font-size:clamp(1.7rem,2.25vw,2.7rem)}
.story-step p{font-size:clamp(.96rem,1.05vw,1.12rem);max-width:43ch;color:#f4efe3}
.story-step,.act-track .story-step,.names-track .story-step,.civic-track .story-step{border:0;padding-left:0}
.story-step:before{display:none}
.story-date{color:#f8ce8b}
.names-stage{isolation:isolate;background:#312c24;align-items:flex-start}
.names-art,.civic-art{position:absolute;inset:-4%;width:108%;height:108%;max-width:none;object-fit:cover;transform:translate3d(var(--art-pan,0%),var(--art-rise,0%),0) scale(var(--art-zoom,1.06));will-change:transform}
.names-stage:before,.civic-stage:before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#0e1814df,#0e18149c 45%,#0e181461 72%,#0e1814d9)}
.names-stage>.chapter-no,.names-stage>p,.name-stack,.name-date,.civic-stage>.chapter-no,.big-year,.civic-document,.flag-panel{position:relative;z-index:2}
.names-stage>p{font-family:'Libre Baskerville',Georgia,serif;font-size:clamp(1.3rem,2.2vw,2.4rem);color:#fff}
.name-date{color:#f2d5a2}
.names-track,.civic-track{background:linear-gradient(90deg,transparent,#101b17a8 20%)}
.sync-motion .names-act .name-stack{height:220px;max-width:680px;border:0;background:linear-gradient(160deg,#5f3e26,#513621 65%,#372618);box-shadow:0 25px 28px #07100cc4,inset 0 0 0 7px #8c6743,inset 0 0 0 10px #432a19;transform:perspective(900px) rotateY(-7deg) rotate(-1deg)}
.sync-motion .names-act .name-stack:before,.sync-motion .names-act .name-stack:after{background:#c69a5b;box-shadow:0 179px 0 #c69a5b}
.sync-motion .names-act .name-stack>*{font-size:clamp(1.7rem,3.15vw,3.9rem);text-shadow:0 2px 1px #291a13}
.sync-motion .names-act .name-stack>*:last-child{font-size:clamp(2.5rem,4.5vw,5.2rem)}
.civic-stage{isolation:isolate;background:#1f3029}
.civic-stage:after{display:none}
.civic-art{object-position:center}
.civic-stage:before{background:linear-gradient(90deg,#0e181488,#0e181458 48%,#0e1814cb 75%)}
.civic-stage>.chapter-no{display:block}
.big-year{position:absolute;left:5%;top:18%;font-size:clamp(7rem,19vw,25rem);opacity:.27;text-shadow:0 5px 30px #09110f}
.civic-document{position:absolute;left:8%;top:43%;min-height:0;width:min(38vw,490px);background:#e7dfc8eb;box-shadow:18px 22px 34px #07120e99;transform-origin:center}
.flag-panel{position:absolute;left:8%;top:26%;width:min(41vw,530px);padding-left:22px}
.flag-label{text-shadow:0 2px 10px #111}
.flag-mast{position:absolute;left:2px;top:1.6rem;width:8px;height:calc(100% + 1rem);background:linear-gradient(90deg,#574333,#f3daa8,#866944);border-radius:4px;transform-origin:top;transform:scaleY(var(--flag-mast-scale,0));box-shadow:3px 5px 13px #1118}
.flag-reveal{position:relative;overflow:visible;clip-path:inset(0 var(--flag-fabric-hide,100%) 0 0)!important;aspect-ratio:3/2;box-shadow:0 24px 32px #1016128c}
.flag-reveal .flag-whole{display:block;width:100%;height:100%;object-fit:fill;animation:none;transform:none}
.civic-act.flag-complete .flag-whole{animation:flagBreath 4s ease-in-out infinite alternate}
.flag-center,.flag-emblem{position:absolute;inset:0;background-image:url('./assets/seasonal/joao-alfredo-flag.png');background-size:100% 100%;pointer-events:none}
.flag-center{clip-path:polygon(39% 0,74% 0,62% 100%,27% 100%);opacity:var(--flag-symbol-opacity,0)}
.flag-emblem{clip-path:circle(17% at 48% 50%);opacity:var(--flag-symbol-opacity,0)}
.civic-act[data-phase="3"] .flag-panel{opacity:1}
.act-jonas{background:#182720}
.jonas-scene{position:absolute;inset:0;overflow:hidden;background:#263c31}
.jonas-art,.jonas-archive{position:absolute;inset:-3%;width:106%;height:106%;max-width:none;object-fit:cover;transform:translate3d(var(--art-pan,0%),var(--art-rise,0%),0) scale(var(--art-zoom,1.06));will-change:transform}
.jonas-archive{opacity:var(--jonas-archive-opacity,0);filter:sepia(.1) contrast(1.1);object-position:center 42%}
.jonas-portrait{position:absolute;z-index:3;left:3%;bottom:17%;width:clamp(170px,19vw,280px);margin:0;padding:.4rem;background:#e8dfcd;box-shadow:13px 19px 35px #1016129c;transform:rotate(-2deg);opacity:var(--jonas-portrait-opacity,1)}
.jonas-portrait img{display:block;width:100%;height:auto;max-height:51svh;object-fit:cover;filter:grayscale(1) contrast(1.06)}
.jonas-portrait figcaption{padding:.55rem .3rem .2rem;color:#2c302a;font-size:.72rem;font-weight:700;text-align:center}
.jonas-scene-note{position:absolute;z-index:5;right:max(1.5rem,calc((100vw - 1400px)/2));bottom:1.5rem;color:#fff5df;font-size:.68rem;font-weight:700;text-align:right;text-shadow:0 2px 8px #08120f}
.act-moveleiro{background:#251f18}
.moveleiro-scene{position:absolute;inset:0;overflow:hidden;background:#412d1e}
.moveleiro-art,.moveleiro-factory{position:absolute;inset:-3%;width:106%;height:106%;max-width:none;object-fit:cover;transform:translate3d(var(--art-pan,0%),var(--art-rise,0%),0) scale(var(--art-zoom,1.06));will-change:transform}
.moveleiro-factory{opacity:var(--moveleiro-factory-opacity,0)}
.moveleiro-scene-note{position:absolute;z-index:5;right:max(1.5rem,calc((100vw - 1400px)/2));bottom:1.5rem;color:#fff1d9;font-size:.68rem;font-weight:700;text-shadow:0 2px 8px #24170e}
.act-moveleiro .act-stage:after{background:linear-gradient(90deg,transparent 0%,#24170e37 48%,#24170ed1 69%,#24170ef2 100%),linear-gradient(0deg,#24170e6e,transparent 25%)}
.act-moveleiro .story-step p{color:#fff1e1}
.law-link{display:inline-flex;align-items:center;gap:.6rem;margin-top:1.4rem;padding:.6rem 0;border-bottom:1px solid #f1c582;color:#ffe0a8;font-size:.83rem;font-weight:700;text-decoration:none;pointer-events:auto}
.law-link:hover,.law-link:focus-visible{color:#fff;border-color:#fff}
.memory-act{position:relative;padding:0;background:#191e1c;color:#f7f3ea;isolation:isolate}
.memory-act:before{content:"";position:absolute;z-index:-1;top:0;left:0;width:100%;height:100svh;background:linear-gradient(90deg,#0c1412df,#0c14128a 53%,#0c141233),url('./historia-assets/06.webp') center/cover}
.memory-heading{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:100svh;max-width:none;padding:5rem max(1.5rem,calc((100vw - 1400px)/2));box-sizing:border-box}
.memory-heading .chapter-no{color:#f8cb89}
.memory-heading h2{font-size:clamp(3rem,5.6vw,7rem)}
.memory-heading p{font-size:1.13rem;color:#f3e9db}
.album{max-width:1600px;margin:0 auto;padding:5vw;gap:1.5vw;grid-template-rows:repeat(2,minmax(320px,32vw));background:#191e1c}
.album figure{box-shadow:0 16px 36px #0008}
.album figure:first-child{transform:rotate(-1deg)}
.album figure:nth-child(2){transform:rotate(1deg)}
.album figure:nth-child(3){transform:rotate(-.6deg)}
.landmark-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;max-width:1600px;margin:0 auto;padding:0 5vw 6rem}
.landmark-row figure{min-width:0}
.landmark-row a{display:block;aspect-ratio:4/3;overflow:hidden;background:#30352e}
.landmark-row img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.landmark-row a:hover img,.landmark-row a:focus-visible img{transform:scale(1.045)}
.landmark-row figcaption{display:flex;justify-content:space-between;gap:.75rem;padding:.8rem .15rem 0;font-size:.83rem;font-weight:700}
.landmark-row figcaption span{color:#cabfae;font-size:.72rem;font-weight:400}
.closing-story{position:relative;display:flex;align-items:center;min-height:100svh;overflow:hidden;background:#17221d;color:#fff;isolation:isolate}
.closing-story>img{position:absolute;z-index:-2;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 43%;filter:contrast(1.08)}
.closing-story:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#0b1915f2,#0b1915bc 57%,#0b191542),linear-gradient(0deg,#0b1915a8,transparent 32%)}
.closing-copy{width:min(800px,78vw);padding:6rem max(1.5rem,calc((100vw - 1400px)/2));box-sizing:content-box}
.closing-copy h2{margin:1rem 0 2rem;font-size:clamp(2.7rem,4.7vw,5.8rem);line-height:1.12}
.closing-copy p{max-width:58ch;margin:1.3rem 0;font-size:clamp(1.05rem,1.2vw,1.24rem);line-height:1.65;color:#f4efe4}
.closing-copy p:last-child{color:#f9d99e;font-weight:700}
.closing-caption,.present-caption{position:absolute;right:max(1.5rem,calc((100vw - 1400px)/2));bottom:1.4rem;color:#f6e8d3;font-size:.67rem;text-shadow:0 2px 10px #09110f}
.present-act{min-height:100svh;display:block;isolation:isolate;background:#15241f}
.present-photo{position:absolute;inset:0;min-height:0;height:auto;z-index:-1}
.present-photo img{height:100%;width:100%;object-fit:cover;object-position:center 43%;filter:contrast(1.07)}
.present-act:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,#07130fdc,#07130f88 48%,#07130f20 80%),linear-gradient(0deg,#07130fb0,transparent 35%)}
.present-copy{min-height:100svh;max-width:780px;padding:5rem max(1.5rem,calc((100vw - 1400px)/2))}
.present-copy h2{font-size:clamp(3rem,5.5vw,6.5rem)}
.present-copy>.present-place{margin-top:1rem;color:#f1d5a1;font-family:'Libre Baskerville',Georgia,serif;font-size:clamp(1.2rem,2vw,2rem);letter-spacing:0;text-transform:none}
.present-copy p{font-size:clamp(1.2rem,1.8vw,1.7rem);line-height:1.45}
@media(max-width:900px){
  .era-indicator{left:0;right:0;bottom:0;width:auto;display:flex;align-items:center;gap:.6rem;padding:.55rem 1rem;border-left:0;border-top:2px solid #d4ad71}
  .era-indicator .era-line{flex:1}
  .hero{min-height:600px}
  .hero h1{font-size:clamp(3.6rem,9vw,6.5rem)}
  .act-stage,.names-stage,.civic-stage{height:64svh;min-height:460px}
  .act-stage,.names-stage,.civic-stage{z-index:10}
  .act-stage:after{background:linear-gradient(0deg,#0a17137c,transparent 50%)}
  .art-before,.art-backdrop,.art-next,.art-final{object-position:42% center}
  .art-actor{height:32%;left:31%}
  .jonas-portrait{left:2rem;bottom:2rem;width:180px}
  .moveleiro-art,.moveleiro-factory{object-position:35% center}
  .art-gear{left:47%;top:17%;width:clamp(145px,21vw,210px)}
  .act-povoado .art-actor{height:38%;left:30%}
  .act-track,.names-track,.civic-track{z-index:2;background:#17271f;padding:0 max(1.5rem,calc((100vw - 660px)/2)) 2rem}
  .act-intro,.story-step,.act-track .story-step,.names-track .story-step,.civic-track .story-step{width:100%;max-width:660px;margin:0 auto;padding:1.8rem 0;filter:none;text-shadow:none}
  .story-step{border-top:1px solid #e1c79a55!important}
  .names-stage{padding:3rem 1.5rem}
  .names-stage:before,.civic-stage:before{background:#0b17119b}
  .sync-motion .names-act .name-stack{width:min(82%,650px)}
  .civic-document{left:6%;width:55%;top:40%}
  .flag-panel{left:6%;width:58%;top:25%}
  .memory-heading{padding:5rem 1.5rem}
  .album{padding:1.5rem}
  .landmark-row{gap:1rem;padding:0 1.5rem 4rem}
  .landmark-row figcaption{display:block}
  .landmark-row figcaption span{display:block;margin-top:.2rem}
  .present-copy{padding:5rem 2rem}
}
@media(max-width:600px){
  .hero{height:92svh;min-height:580px}
  .hero-photo{object-position:39% center}
  .hero-foreground{width:170%;height:110%;left:-12%;object-position:30% center}
  .hero-shade{background:linear-gradient(0deg,#0b1715ee,#0b171566 63%,#0b171526)}
  .hero h1{font-size:clamp(3rem,12vw,4.8rem)}
  .hero-content{left:1.5rem;right:1.5rem;bottom:6rem;top:auto;transform:none}
  .act-stage,.names-stage,.civic-stage{height:54svh;min-height:370px}
  .art-before,.art-backdrop,.art-next,.art-final{width:155%;height:106%;left:-26%;object-position:center}
  .jonas-art{object-position:25% center}
  .jonas-portrait{left:auto;right:1rem;top:1rem;bottom:auto;width:clamp(95px,30vw,140px);padding:.25rem}
  .jonas-portrait img{max-height:30svh}
  .jonas-portrait figcaption{padding:.3rem .1rem .1rem;font-size:.52rem}
  .jonas-scene-note{right:1rem;bottom:1rem;max-width:21rem}
  .moveleiro-art,.moveleiro-factory{width:160%;left:-28%;object-position:42% center}
  .moveleiro-scene-note{right:1rem;bottom:1rem}
  .art-foreground{width:170%;height:110%;left:-35%}
  .act-origens .art-actor{left:26%;height:27%}
  .act-engenho .art-actor{left:25%;height:29%}
  .art-gear{left:46%;top:14%;width:150px}
  .act-povoado .art-actor{left:23%;height:36%}
  .names-art,.civic-art{width:150%;left:-25%;object-position:center}
  .names-stage{padding:1.5rem}
  .names-stage>p{font-size:1.18rem}
  .sync-motion .names-act .name-stack{width:100%;height:145px;margin-top:1.3rem;transform:rotate(-1deg)}
  .sync-motion .names-act .name-stack>*{font-size:1.4rem}
  .sync-motion .names-act .name-stack>*:last-child{font-size:2.1rem}
  .sync-motion .names-act .name-stack:before,.sync-motion .names-act .name-stack:after{box-shadow:0 105px 0 #c69a5b}
  .name-date{font-size:.68rem}
  .big-year{top:10%;font-size:27vw}
  .civic-document{left:7%;top:34%;width:78%;padding:1.1rem}
  .flag-panel{left:7%;top:21%;width:81%}
  .memory-heading{min-height:84svh;padding:4rem 1.5rem;box-sizing:border-box}
  .memory-heading h2{font-size:2.8rem}
  .memory-heading p{font-size:1rem}
  .memory-act:before{height:84svh;background-position:42% center}
  .album{display:block;padding:1.2rem}
  .album figure{margin-bottom:1.2rem}
  .landmark-row{grid-template-columns:1fr;gap:1.5rem;padding:0 1.2rem 3rem}
  .landmark-row a{aspect-ratio:16/10}
  .present-act,.present-copy{min-height:88svh}
  .closing-story{min-height:0}
  .closing-story>img{object-position:53% center}
  .closing-story:after{background:#0b1915c9}
  .closing-copy{width:auto;padding:5rem 1.5rem 5.5rem}
  .closing-copy h2{font-size:2.5rem}
  .closing-copy p{font-size:1.02rem;line-height:1.55}
  .closing-caption,.present-caption{right:1rem;bottom:.8rem;font-size:.6rem}
  .present-caption{bottom:3.5rem}
  .present-photo{height:100%}
  .present-photo img{object-position:70% center}
  .present-act:after{background:linear-gradient(0deg,#07130fdb,#07130f80 58%,#07130f58)}
  .present-copy{padding:4rem 1.5rem}
  .present-copy h2{font-size:2.7rem}
}
@media(prefers-reduced-motion:reduce){
  .hero-photo,.hero-foreground,.art-before,.art-backdrop,.art-next,.art-final,.art-foreground,.art-actor,.art-gear,.names-art,.civic-art,.jonas-art,.jonas-archive,.moveleiro-art,.moveleiro-factory{transform:none!important;will-change:auto!important}
  .jonas-archive{opacity:0!important}
  .moveleiro-factory{opacity:1!important}
  .art-next,.art-final{display:none!important}
  .act-povoado .art-backdrop{mask-image:none!important}
  .act-povoado .art-actor,.act-povoado .art-foreground{opacity:1!important}
  .flag-mast{transform:none!important}
  .flag-reveal{clip-path:none!important}
  .flag-center,.flag-emblem{opacity:1!important}
}
html:not(.js) .flag-mast{transform:none!important}
html:not(.js) .flag-reveal{clip-path:none!important}