:root{--paper:#f3eee4;--ink:#2b241f;--red:#741d2a;--line:#bdb19e;--muted:#675c50;--display:Georgia,'Times New Roman',serif;--gold:#a38248;--intro-ease:cubic-bezier(.22,1,.36,1);--intro-logo-width:min(620px,76vw,max(0px,calc((100svh - 160px)*2)))}
.masthead{position:relative;height:140px;margin:0 var(--space);border-color:#bdb19e70;gap:30px;background:var(--paper);z-index:2}
.brand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:225px;height:113px;display:block;padding:0;gap:0}
.brand img{width:100%;height:100%;object-fit:contain}
.header-navigation{display:flex;gap:28px;font-size:13px;letter-spacing:.01em}
.header-navigation a,.booking-link{transition:color 250ms ease}
.header-navigation a:hover,.booking-link:hover{color:var(--red)}
.header-actions{margin-left:auto;gap:25px}
.booking-link{font-size:13px}
.index-button{padding-left:22px;border-left:1px solid var(--line)}
.opening{padding:0}
.landing-scene{position:relative;width:100%;height:calc(100svh - 140px);min-height:560px;max-height:900px;isolation:isolate;overflow:hidden;background:#171511}
.landing-photo{width:100%;height:100%;object-fit:cover;object-position:50% 48%;transform:scale(1);transition:transform 2200ms var(--intro-ease)}
.scene-shade{position:absolute;inset:0;background:linear-gradient(180deg,#16120c00 30%,#16120c25 54%,#16120cac 100%)}
.scene-caption{position:absolute;left:var(--space);right:var(--space);bottom:35px;display:flex;align-items:end;justify-content:space-between;color:#f9f4e9;gap:30px}
.scene-location{font-family:var(--mono);font-size:10px;line-height:1.5;letter-spacing:.14em;margin-bottom:16px;text-shadow:0 1px 4px #0008}
.scene-caption h1{font-family:Georgia,serif;font-size:clamp(42px,4.8vw,86px);line-height:1.03;letter-spacing:-.048em;font-weight:400;text-shadow:0 2px 15px #0002}
.scene-caption h1 em{font-weight:400}
.scene-link{display:inline-flex;align-items:center;gap:30px;font-size:13px;margin-top:23px;border-bottom:1px solid #f3eee488;padding-bottom:8px}
.scene-link span{font-size:22px}
.scene-scroll{display:flex;align-items:center;gap:22px;font-size:12px;line-height:1.3}
.scene-scroll>span:last-child{width:40px;height:56px;display:grid;place-items:center;border-left:1px solid #f3eee466;font-size:27px}
.opening-note{display:grid;grid-template-columns:1fr auto;gap:35px;align-items:center;padding:32px var(--space);border-bottom:1px solid var(--line);margin-bottom:0}

.photo-source{font-family:var(--mono);font-size:10px;line-height:1.6;color:var(--muted)}
.replay-intro{font-size:12px;padding:13px 0;border-bottom:1px solid var(--line);white-space:nowrap;visibility:hidden}
.intro-initialized .replay-intro{visibility:visible}
.replay-intro span{margin-left:15px;font-size:21px}
.section-heading h2{font-weight:400;font-size:clamp(45px,5.2vw,85px);line-height:1.1;letter-spacing:-.04em}
.section-heading h2 em{font-weight:400;color:var(--red)}
.section-intro p{font-size:19px;line-height:1.45;letter-spacing:-.015em}
.archive{padding-top:60px}
.section-kicker{font-size:10px;letter-spacing:.08em}
.artifact-year{font-family:Georgia,serif;font-size:35px;line-height:1.2;letter-spacing:-.035em}
.artifact-media img{filter:none;transition:transform 900ms var(--intro-ease)}
.artifact:hover img{filter:none;transform:scale(1.018)}
.artifact:hover{transform:translateY(-3px)}
.release-title{padding:27px;display:flex;flex-direction:column;justify-content:center;background:#e4dbcc;color:var(--ink);border:1px solid #bdb19e7a}
.release-title>span{font-family:Georgia,serif;font-size:22px;margin-bottom:7px}
.release-title>strong{font-family:Georgia,serif;font-weight:400;font-size:42px;line-height:1.1;letter-spacing:-.04em;color:var(--red)}
.release-title>small{margin-top:28px;font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--muted)}
.music{background:#231d18;color:var(--paper)}
.music-heading h2{font-weight:400;font-size:clamp(45px,5.3vw,86px);line-height:1.12;letter-spacing:-.035em}
.music-heading h2 em{color:#d9be84;font-style:italic;font-weight:400}
.disc-item:hover .disc-name{color:#d9be84}
.place{background:#741d2a}
.footer{padding-bottom:24px}
.artifact-dialog #dialog-visual .document-type{background:var(--red);font-family:Georgia,serif;font-size:55px}
.logo-intro{display:none}
.intro-capable .logo-intro{position:fixed;display:block;inset:0;z-index:100;background:var(--paper);pointer-events:auto;overflow:hidden}
.intro-brand{position:absolute;left:50%;top:47%;width:var(--intro-logo-width);aspect-ratio:2/1;transform:translate(-50%,-50%);transform-origin:top left;will-change:transform}
.logo-construction{display:block;width:100%;height:100%;overflow:visible}
.intro-origin{position:absolute;left:0;right:0;top:calc(47% + var(--intro-logo-width)/4 + 18px);font:10px/1.5 var(--mono);letter-spacing:.22em;text-align:center;color:var(--muted);opacity:0;transition:opacity 800ms ease}
.intro-skip{position:absolute;bottom:30px;right:var(--space);font-size:12px;line-height:1.5;border-bottom:1px solid var(--line);padding:8px 0;color:var(--muted);z-index:2}
.intro-skip span{margin-left:20px}
.logo-composed{visibility:hidden}
.letter-trace{fill:none;stroke:var(--red);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:.85}
.word-original .letter-trace{stroke:#b58a12;stroke-width:5}
.word-signature .letter-trace{stroke-width:2.3;opacity:.65}
.letter-ink,.rule-ink{opacity:0}
.intro-building .letter-trace{animation:draw-letter var(--draw-duration) cubic-bezier(.38,.05,.2,1) var(--draw-delay) forwards,absorb-line 400ms ease calc(var(--ink-delay) + 120ms) forwards}
.intro-building .letter-ink{animation:ink-settle var(--ink-duration,420ms) cubic-bezier(.2,.5,.3,1) var(--ink-delay) forwards}
.binding-line{fill:none;stroke:#d8a204;stroke-width:15;stroke-linecap:butt;stroke-dasharray:1;stroke-dashoffset:1}
.intro-building .binding-line{animation:draw-letter var(--draw-duration) cubic-bezier(.4,0,.2,1) var(--draw-delay) forwards,absorb-line 220ms ease var(--ink-delay) forwards}
.intro-building .rule-ink{animation:ink-settle 240ms ease var(--ink-delay) forwards}
.intro-building .build-signature{animation:construct-word 240ms ease 3860ms forwards}
.intro-building .intro-origin{opacity:1;transition-delay:3670ms}
.intro-built .logo-parts{visibility:hidden}
.intro-built .logo-composed{visibility:visible}
@keyframes draw-letter{to{stroke-dashoffset:0}}
@keyframes ink-settle{to{opacity:1}}
@keyframes absorb-line{to{opacity:0}}
@keyframes construct-word{to{opacity:1}}
.intro-active{overflow:hidden}
.intro-active .masthead .brand{visibility:hidden}
.intro-active .landing-photo{transform:scale(1.045)}
.intro-active .header-navigation,.intro-active .header-actions,.intro-active .scene-caption,.intro-active .opening-note{opacity:0;transform:translateY(12px)}
.intro-arriving .header-navigation,.intro-arriving .header-actions,.intro-arriving .scene-caption,.intro-arriving .opening-note{opacity:1;transform:translateY(0);transition:opacity calc(var(--intro-transition-duration,1650ms)*.8) ease calc(var(--intro-transition-duration,1650ms)*.08),transform calc(var(--intro-transition-duration,1650ms)*.86) var(--intro-ease) calc(var(--intro-transition-duration,1650ms)*.08)}
.intro-arriving .scene-caption{transition:opacity calc(var(--intro-transition-duration,1450ms)*.5) ease calc(var(--intro-transition-duration,1450ms)*.35),transform calc(var(--intro-transition-duration,1450ms)*.6) var(--intro-ease) calc(var(--intro-transition-duration,1450ms)*.35)}
.intro-arriving .landing-photo{transform:scale(1)}
.intro-arriving .intro-origin,.intro-arriving .intro-skip{opacity:0;transition:opacity 400ms ease;pointer-events:none}
.intro-arriving .logo-intro{background:transparent;pointer-events:none}
.intro-wash{position:absolute;inset:0;background:var(--paper);opacity:1;transition:opacity calc(var(--intro-transition-duration,1650ms)*.9) var(--intro-ease)}
.intro-arriving .intro-wash{opacity:0}
.intro-complete .logo-intro{display:none}
.intro-complete .masthead .brand{visibility:visible}
html:not(.intro-capable) .logo-intro,.no-js .replay-intro{display:none}
@media(max-width:900px){.masthead{height:120px}.brand{width:195px;height:98px}.header-navigation{font-size:12px;gap:18px}.booking-link{font-size:12px}.header-actions{gap:18px}.landing-scene{height:calc(100svh - 120px);min-height:530px}.scene-caption h1{font-size:55px}.opening-note{grid-template-columns:1fr 1fr}.section-intro p{font-size:17px}}
@media(max-width:600px){.masthead{height:120px;margin:0 20px}.brand{width:192px;height:96px}.header-navigation{display:none}.header-actions{margin-left:auto}.booking-link{display:none}.index-button{border-left:0;padding:15px 0 15px 12px}.index-button span{font-size:21px}.landing-scene{height:calc(100svh - 120px);min-height:550px;max-height:800px}.landing-photo{object-position:49% 46%}.scene-shade{background:linear-gradient(180deg,#16120c00 35%,#16120c22 48%,#16120cc5 100%)}.scene-caption{left:20px;right:20px;bottom:27px;display:block}.scene-location{font-size:9px;max-width:245px;line-height:1.65;margin-bottom:15px}.scene-caption h1{font-size:48px;line-height:1.08;letter-spacing:-.04em}.scene-link{font-size:12px;margin-top:20px;padding-bottom:7px}.scene-scroll{position:absolute;right:0;bottom:0}.scene-scroll>span:first-child{display:none}.scene-scroll>span:last-child{height:40px;width:30px;font-size:24px}.opening-note{grid-template-columns:1fr;gap:20px;padding:26px 20px}.photo-source{font-size:9px}.replay-intro{grid-column:auto;font-size:12px}.section-heading h2{font-size:46px;line-height:1.1}.section-intro p{font-size:17px}.artifact-year{font-size:33px}.music-heading h2{font-size:46px;line-height:1.12}.release-title>strong{font-size:38px}.intro-brand{top:46%}.intro-origin{top:calc(46% + var(--intro-logo-width)/4 + 18px);font-size:9px;letter-spacing:.17em}.intro-skip{bottom:24px;right:20px}.artifact-dialog #dialog-visual .document-type{font-size:36px}}
@media(prefers-reduced-motion:reduce){.logo-intro{display:none!important}.intro-active{overflow:auto}.intro-active .masthead .brand{visibility:visible}.intro-active .header-navigation,.intro-active .header-actions,.intro-active .scene-caption,.intro-active .opening-note{opacity:1;transform:none}.landing-photo{transform:none!important}}
.reduced-motion .logo-intro{display:none!important}.reduced-motion.intro-active{overflow:auto}.reduced-motion.intro-active .masthead .brand{visibility:visible}.reduced-motion.intro-active .header-navigation,.reduced-motion.intro-active .header-actions,.reduced-motion.intro-active .scene-caption,.reduced-motion.intro-active .opening-note{opacity:1;transform:none}

@media(max-width:600px){:root{--intro-logo-width:min(620px,88vw,max(0px,calc((100svh - 160px)*2)))}}

/* Duas fotografias; os discos aparecem apenas em Gravações. */
.archive .artifact{flex-basis:calc((100% - 25px)/2)}
.archive-controls[hidden]{display:none}
.music-grid{padding-top:0}
@media(max-width:600px){.archive .artifact{flex-basis:80%}}
@media(max-width:600px){.scene-caption h1{font-size:clamp(36px,12vw,48px)}}

.videos{border-top:1px solid var(--line)}
.video-heading{display:flex;justify-content:space-between;align-items:baseline;gap:25px;margin-bottom:36px}
.video-heading h2{font-family:Georgia,serif;font-size:clamp(45px,5.2vw,85px);font-weight:400;line-height:1.1;letter-spacing:-.04em}
.video-heading a{border-bottom:1px solid var(--line);padding-bottom:6px;white-space:nowrap}
.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:25px}
.video-card{min-width:0}
.video-frame{position:relative;aspect-ratio:16/9;min-height:200px;background:#231d18;overflow:hidden}
.video-cover{display:block;position:absolute;inset:0;color:var(--paper)}
.video-cover img{width:100%;height:100%;object-fit:cover}
.video-cover img[hidden]{display:none}
.video-cover:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 40%,#0008)}
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;width:64px;height:64px;display:grid;place-items:center;padding-left:4px;border:1px solid #f3eee4b0;border-radius:50%;background:#231d1870;font-size:22px}
.video-action{position:absolute;left:20px;bottom:18px;z-index:1}
.video-cover:focus-visible{outline-offset:-5px}
.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video-caption{display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding-top:17px}
.video-caption h3{margin:0;font:400 22px/1.3 Georgia,serif}
.video-caption small{display:block;font:12px/1.5 var(--sans);color:var(--muted);margin-top:5px}
.video-caption>a{white-space:nowrap;border-bottom:1px solid var(--line)}
@media(max-width:700px){.video-grid{grid-template-columns:1fr;gap:30px}.video-heading h2{font-size:46px}.video-heading{margin-bottom:25px}.video-caption h3{font-size:20px}}

/* Abertura com a logo oficial (22/10, v3). O reflexo revela o trompete; tudo se abre a partir dele.
   0–200ms   o canhão de luz acende sobre a névoa (intro-fx.js)
   200–650   o trompete de latão, deitado, é revelado do centro para as pontas pelo próprio reflexo
   650–1000  aproximação lenta; estrela de brilho na campana
   1000–1150 antecipação: o trompete recua alguns graus
   1150–1600 chicote para a vertical com desfoque de movimento, passa do ponto e assenta; o latão vira o vermelho da marca
   1380–2000 "Banda" se abre do d, com desfoque horizontal
   1450–2350 dourado e fita do centro para fora; 2200–2900 reflexo final; 2750ms logo completa */
@property --lg-red{syntax:'<color>';inherits:true;initial-value:#6d0c07}
.intro-capable .logo-intro{background:#050403}
.intro-wash{background:#050403}
.intro-light{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;transition:opacity 700ms ease}
.intro-arriving .intro-light{opacity:0}
.intro-arriving .logo-intro{background:transparent;pointer-events:none}
.logo-construction{--lg-red:#b8303a;transition:--lg-red 900ms ease;overflow:visible}
.logo-construction .lg-banda path,.logo-construction .lg-sig path,.logo-construction .lg-d-red{fill:var(--lg-red)!important}
.intro-arriving .logo-construction{--lg-red:#6d0c07}
.logo-construction .lg-l,.logo-construction .lg-d{transform-box:fill-box;transform-origin:50% 50%}
.logo-construction .lg-d-reveal{transform-box:fill-box;transform-origin:50% 50%;transform:scaleY(0)}
.logo-construction .lg-banda .lg-l,.logo-construction .lg-sig .lg-l,.logo-construction .lg-d{opacity:0}
.logo-construction .lg-d-brass{opacity:0}
.logo-construction .lg-open-rect{transform-box:fill-box;transform-origin:50% 50%;transform:scaleX(0)}
.logo-construction .lg-shine{opacity:0}
.intro-building .lg-d{animation:lg-d-move 1400ms linear 200ms backwards;opacity:1}
.intro-building .lg-d-reveal{animation:lg-d-reveal 470ms cubic-bezier(.2,.8,.2,1) 200ms both}
.intro-building .lg-d-brass{animation:lg-brass 1600ms linear 200ms both}
.intro-building .lg-banda .lg-l{animation:lg-open-x 620ms cubic-bezier(.16,1,.3,1) calc(1380ms + var(--i)*60ms) backwards;opacity:1}
.intro-building .lg-open-rect{animation:lg-open 900ms cubic-bezier(.5,0,.15,1) 1450ms both}
.intro-building .lg-sig .lg-l{animation:lg-pop 440ms cubic-bezier(.16,1,.3,1) calc(1700ms + var(--i)*20ms) backwards;opacity:1}
.intro-building .lg-shine{animation:lg-shine 900ms cubic-bezier(.45,0,.2,1) 2100ms both}
.intro-building .build-signature{animation:construct-word 100ms linear 2700ms forwards}
.intro-building .intro-origin{opacity:1;transition-delay:2200ms}
.intro-built .logo-construction .lg-l,.intro-built .logo-construction .lg-d{animation:none;opacity:1;transform:none}
.intro-built .lg-d-reveal{animation:none;transform:none}
.intro-built .lg-d-brass{animation:none;opacity:0}
.intro-built .lg-open-rect{animation:none;transform:scaleX(1)}
.intro-built .lg-shine{animation:none;opacity:0}
@keyframes lg-d-move{
  0%{opacity:1;transform:translate(var(--dx),var(--dy)) rotate(90deg) scale(1.9);animation-timing-function:cubic-bezier(.25,.1,.25,1)}
  57.1%{transform:translate(var(--dx),var(--dy)) rotate(90deg) scale(2.06);animation-timing-function:cubic-bezier(.45,0,.55,1)}
  67.9%{transform:translate(var(--dx),var(--dy)) rotate(97deg) scale(2.09);animation-timing-function:cubic-bezier(.62,0,.12,1)}
  92.1%{transform:translate(0px,0px) rotate(-3.5deg) scale(.985);animation-timing-function:cubic-bezier(.3,0,.3,1)}
  100%{opacity:1;transform:translate(0px,0px) rotate(0deg) scale(1)}}
@keyframes lg-d-reveal{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes lg-brass{0%,60%{opacity:1}92%,100%{opacity:0}}
@keyframes lg-open-x{from{opacity:0;transform:translateX(var(--sx)) scale(.94)}25%{opacity:1}72%{transform:translateX(calc(var(--sx) * -0.035))}to{opacity:1;transform:none}}
@keyframes lg-open{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes lg-pop{from{opacity:0;transform:translateY(30%) scale(.8)}to{opacity:1;transform:none}}
@keyframes lg-shine{0%{opacity:0;transform:translateX(0)}12%{opacity:1}88%{opacity:1}100%{opacity:0;transform:translateX(430px)}}
.intro-origin,.intro-skip{font-family:'Instrument Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif}
.intro-origin{font-size:11px;font-weight:600;letter-spacing:.18em;color:#e2b24cb3}
.intro-skip{font-size:13px;font-weight:500;color:#f3eee4b3;border-color:#f3eee440}
.intro-skip:hover{color:#f3eee4}
/* Revelação da foto na chegada: canvas de zoom (app.js) sobre a foto até ela entrar em foco. */
.hero-reveal{position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;pointer-events:none;transition:opacity 260ms ease}
.hero-reveal.is-done{opacity:0}
.reveal-css .landing-photo{animation:reveal-css 1300ms cubic-bezier(.2,.7,.2,1) both}
@keyframes reveal-css{from{filter:blur(14px) brightness(1.4);transform:scale(1.14)}to{filter:none;transform:scale(1)}}
/* "Seit 1985" under the logo during the opening only; it rises in as the logo resolves and leaves with the opening. */
.intro-seit{font:700 clamp(20px,2vw,28px)/1 'UnifrakturCook','Rozha One',Georgia,serif;letter-spacing:.01em;text-transform:none;color:#e2b24c;opacity:0;transform:translateY(8px);transition:opacity 700ms ease,transform 900ms cubic-bezier(.16,1,.3,1)}
.intro-building .intro-seit{opacity:.92;transform:none;transition-delay:2250ms}
.intro-arriving .intro-seit{opacity:0;transition:opacity 300ms ease;transition-delay:0ms}
/* The header now carries the dark-background logo, so the flying logo keeps the lighter red. */
.intro-arriving .logo-construction{--lg-red:#a8232f}