/* ==========================================================================
   SANCTA PRECATIO MUSIC — laranja, carbono, cinza mineral
   MUSIC em primeiro plano. Linhas firmes, áreas amplas, poucos elementos.
   ========================================================================== */
body.page-music {
  background: var(--c-bg); color: var(--c-carbon); font-family: var(--f-t); font-size: 17px; line-height: 1.6;
  --hdr-bg: rgba(23, 25, 28, .96); --hdr-fg: #f4f5f1; --hdr-muted: rgba(244,245,241,.66); --hdr-accent: #f06432; --hdr-line: rgba(244,245,241,.13);
  --menu-bg: #17191c; --ftr-bg: #17191c; --ftr-fg: #f4f5f1; --ftr-muted: rgba(244,245,241,.6); --ftr-accent: #f06432; --ftr-line: rgba(244,245,241,.12);
  --focus: #f06432;
}
.page-music ::selection { background: #f06432; color: #17191c; }
.page-music .brand-project__name { font: 700 21px/1 var(--f-d); letter-spacing: .04em; text-transform: uppercase; }
.page-music .menu-overlay__list .t { font-family: var(--f-d); font-weight: 700; text-transform: uppercase; }
.page-music h1, .page-music h2, .page-music h3 { font-family: var(--f-d); font-weight: 700; text-transform: uppercase; letter-spacing: -.005em; line-height: .92; }
.mu-no { display: flex; align-items: center; gap: 10px; font: 700 12px/1.3 var(--f-t); letter-spacing: .14em; text-transform: uppercase; color: var(--c-carbon); }
.mu-no--light { color: #f4f5f1; }
.mu-dash { width: 26px; height: 2px; background: var(--c-accent); }
.mu-top { display: flex; align-items: center; gap: 18px; margin-bottom: clamp(40px, 5vw, 64px); }
.mu-top .mu-rule { flex: 1; height: 2px; background: var(--c-carbon); }
.mu-aside { font: 700 12px/1.3 var(--f-t); letter-spacing: .14em; text-transform: uppercase; color: var(--c-muted); }
.mu-btn { display: inline-flex; align-items: center; gap: 22px; min-height: 52px; padding: 14px 22px; background: var(--c-accent); color: var(--c-carbon); font: 700 13px/1.2 var(--f-t); letter-spacing: .1em; text-transform: uppercase; transition: background .2s, color .2s, transform .2s var(--ease); }
.mu-btn:hover { background: var(--c-carbon); color: #f4f5f1; transform: translateY(-2px); }
.mu-btn--light:hover { background: #f4f5f1; color: var(--c-carbon); }
.mu-link { color: var(--c-carbon); font-family: var(--f-t); font-weight: 700; }
.mu-link--light { color: #f4f5f1; }
.mu-h2 { font-size: clamp(56px, 8vw, 132px); margin-bottom: 56px; }
.mu-h2 span { color: var(--c-accent); }

/* Abertura */
.mu-hero { position: relative; background: var(--c-bg); padding: calc(var(--header-h) + 46px + clamp(40px, 5vw, 72px)) 0 0; overflow: hidden; }
.mu-hero__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 40px 5%; align-items: center; }
.mu-hero__logo { width: min(460px, 86%); margin-bottom: clamp(36px, 5vw, 64px); }
.mu-hero h1 { font-size: clamp(64px, 9.8vw, 168px); line-height: .86; }
.mu-hero h1 span { color: var(--c-accent); }
.mu-hero__sig { margin-top: 26px; font: 700 clamp(20px, 1.9vw, 28px)/1.1 var(--f-d); text-transform: uppercase; }
.mu-hero__lede { max-width: 46ch; margin-top: 14px; color: var(--c-muted); font-size: 17px; }
.mu-hero .actions { margin-top: 32px; }
.mu-hero__art { position: relative; aspect-ratio: 1; }
.mu-disc { position: absolute; inset: 6%; display: grid; place-items: center; border-radius: 50%; background: var(--c-carbon); box-shadow: 0 40px 80px -40px rgba(23,25,28,.6); }
.mu-disc { background: repeating-radial-gradient(circle at 50% 50%, #17191c 0 3px, #1e2125 3px 4px); }
.mu-disc__seal { width: 78%; animation: mu-spin 60s linear infinite; }
@keyframes mu-spin { to { transform: rotate(360deg); } }
.mu-arc { position: absolute; border: 2px solid var(--c-accent); border-radius: 50%; pointer-events: none; }
.mu-arc--1 { inset: -4%; clip-path: polygon(50% 50%, 100% 0, 100% 100%); }
.mu-arc--2 { inset: -12%; opacity: .45; clip-path: polygon(50% 50%, 0 100%, 100% 100%); }
.mu-hero__index { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: clamp(56px, 7vw, 96px); border-top: 2px solid var(--c-carbon); }
.mu-hero__index a { display: flex; align-items: baseline; gap: 14px; padding: 20px 20px 26px 0; font: 700 clamp(16px, 1.5vw, 22px)/1.15 var(--f-d); text-transform: uppercase; transition: color .2s; }
.mu-hero__index li + li a { padding-left: 20px; border-left: 1px solid var(--c-line); }
.mu-hero__index span { color: var(--c-accent); font: 700 12px/1 var(--f-t); letter-spacing: .1em; }
.mu-hero__index em { font-style: normal; }
.mu-hero__index a:hover { color: var(--c-accent); }
@media (max-width: 900px) {
  .mu-hero__grid { grid-template-columns: 1fr; }
  .mu-hero__art { width: min(420px, 80%); margin: 10px auto 0; order: -1; }
  .mu-hero__logo { width: min(340px, 86%); }
  .mu-hero__index { grid-template-columns: 1fr; }
  .mu-hero__index li + li a { padding-left: 0; border-left: 0; border-top: 1px solid var(--c-line); }
  .mu-hero__index a { padding: 16px 0; }
}

/* O selo */
.mu-label { background: #fff; padding: clamp(88px, 10vw, 140px) 0; }
.mu-label__intro { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 32px 7%; align-items: end; }
.mu-label h2 { font-size: clamp(44px, 5.6vw, 92px); }
.mu-label h2 span { color: var(--c-accent); }
.mu-label__text p { color: var(--c-muted); }
.mu-label__text p + p { margin-top: 1em; }
.mu-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: clamp(56px, 7vw, 90px); border-top: 2px solid var(--c-carbon); }
.mu-steps li { padding: 26px 28px 10px 0; }
.mu-steps li + li { padding-left: 28px; border-left: 1px solid var(--c-line); }
.mu-steps span { color: var(--c-accent); font: 700 13px/1 var(--f-t); letter-spacing: .1em; }
.mu-steps h3 { margin: 14px 0 10px; font-size: clamp(26px, 2.4vw, 36px); }
.mu-steps p { color: var(--c-muted); font-size: 16px; }
.mu-does { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px 40px; margin-top: 56px; padding-top: 24px; border-top: 1px solid var(--c-line); }
.mu-does ul { display: flex; flex-wrap: wrap; gap: 10px; }
.mu-does li { padding: 10px 14px; background: var(--c-bg); font: 700 14px/1 var(--f-t); }
.mu-bis { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 7%; align-items: center; margin-top: clamp(64px, 8vw, 110px); padding: clamp(32px, 4vw, 56px); background: var(--c-carbon); color: #f4f5f1; }
.mu-bis__quote { font: 700 clamp(40px, 4.6vw, 74px)/.92 var(--f-d); text-transform: uppercase; }
.mu-bis__quote span { color: var(--c-accent); }
.mu-bis p:last-child { color: rgba(244,245,241,.78); }
.mu-bis em { color: var(--c-accent); font-style: italic; }
@media (max-width: 900px) { .mu-label__intro, .mu-bis, .mu-does { grid-template-columns: 1fr; } .mu-steps { grid-template-columns: 1fr; } .mu-steps li, .mu-steps li + li { padding: 22px 0 14px; border-left: 0; border-top: 1px solid var(--c-line); } .mu-steps li:first-child { border-top: 0; } }

/* Obras */
.mu-works { background: var(--c-bg); padding: clamp(88px, 10vw, 140px) 0; }
.mu-work { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 40px 6%; align-items: start; padding: clamp(32px, 4vw, 56px); background: #fff; border-top: 6px solid var(--c-accent); }
.mu-work__cover { position: relative; aspect-ratio: 1; box-shadow: 18px 18px 0 var(--c-carbon); }
.mu-work__cover img { width: 100%; height: 100%; object-fit: cover; }
.mu-work h3 { margin: 12px 0 6px; font-size: clamp(56px, 6vw, 96px); }
.mu-work h3 small { font-size: .45em; color: var(--c-accent); }
.mu-work__artists { margin-bottom: 18px; font: 700 18px/1.2 var(--f-d); text-transform: uppercase; letter-spacing: .02em; }
.mu-work__copy > p:not(.mu-no):not(.mu-work__artists) { color: var(--c-muted); }
.mu-credits { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; margin: 26px 0; border-top: 2px solid var(--c-carbon); }
.mu-credits div { padding: 12px 0; border-bottom: 1px solid var(--c-line); }
.mu-credits dt { font: 700 11px/1.3 var(--f-t); letter-spacing: .12em; text-transform: uppercase; color: var(--c-accent); }
.mu-credits dd { margin-top: 3px; font-size: 15px; }
.mu-award { margin-bottom: 28px; padding: 18px 20px; background: var(--c-bg); border-left: 4px solid var(--c-accent); }
.mu-award p:last-child { margin-top: 8px; font-size: 15px; color: var(--c-muted); }
.mu-award strong { color: var(--c-carbon); }
.mu-award a { color: var(--c-carbon); font-weight: 700; border-bottom: 1px solid currentColor; }
.mu-films { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; margin-top: 28px; }
.mu-film { padding: 0 0 28px; background: #fff; }
.mu-film .yt__icon { background: var(--c-accent); color: var(--c-carbon); }
.mu-film .yt__kind { font: 700 14px/1 var(--f-t); letter-spacing: .14em; text-transform: uppercase; }
.mu-film > .mu-no, .mu-film h3, .mu-film > p { padding: 0 28px; }
.mu-film > .mu-no { margin-top: 24px; color: var(--c-accent); }
.mu-film h3 { margin: 10px 0 10px; font-size: clamp(28px, 2.6vw, 40px); }
.mu-film > p { color: var(--c-muted); font-size: 16px; }
.mu-film .mu-film__credit { margin-top: 12px; font-size: 12px; color: #8a8f90; }
@media (max-width: 900px) { .mu-work, .mu-films { grid-template-columns: 1fr; } .mu-work__art { max-width: 420px; } }
@media (max-width: 520px) { .mu-credits { grid-template-columns: 1fr; } .mu-work { padding: 24px 20px; } .mu-work__cover { box-shadow: 10px 10px 0 var(--c-carbon); } .mu-film > .mu-no, .mu-film h3, .mu-film > p { padding: 0 20px; } }

/* Estrutura */
.mu-structure { position: relative; isolation: isolate; min-height: clamp(560px, 70vw, 820px); display: flex; align-items: flex-end; background: var(--c-carbon); }
.mu-structure__media { position: absolute; inset: 0; z-index: -1; }
.mu-structure__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(23,25,28,.85) 0%, rgba(23,25,28,.1) 60%); }
.mu-structure__inner { padding: 80px 0 clamp(48px, 6vw, 80px); }
.mu-structure__card { max-width: 560px; padding: clamp(28px, 3.4vw, 44px); background: var(--c-carbon); color: #f4f5f1; border-top: 6px solid var(--c-accent); }
.mu-structure__card h2 { margin: 16px 0 16px; font-size: clamp(40px, 4.4vw, 68px); }
.mu-structure__card p:not(.mu-no) { margin-bottom: 26px; color: rgba(244,245,241,.8); font-size: 16px; }

/* Próximo capítulo */
.mu-next { background: #fff; padding: clamp(88px, 10vw, 140px) 0; }
.mu-next__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
/* God’s People: amarelo e roxo das artes oficiais, com a marca em destaque */
.mu-gp { --gp-roxo: #5a287f; --gp-amarelo: #feed01; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 32px 6%; align-items: center; padding: clamp(32px, 5vw, 72px); background: var(--gp-amarelo); color: var(--gp-roxo); }
.mu-gp__brand img { width: 100%; max-width: 520px; height: auto; }
.mu-soon { display: inline-block; margin-bottom: 16px; padding: 7px 10px; border: 2px solid currentColor; font: 700 11px/1.4 var(--f-t); letter-spacing: .14em; text-transform: uppercase; }
.mu-gp h2 { margin-bottom: 18px; font-size: clamp(34px, 3.8vw, 60px); color: var(--gp-roxo); }
.mu-gp h2 span { color: #17191c; }
.mu-gp p:not(.mu-soon) { color: #2f1845; font-size: 16.5px; }
.mu-gp p + p { margin-top: .8em; }
.mu-artists { padding: clamp(28px, 3.4vw, 44px); background: var(--c-carbon); color: #f4f5f1; }
.mu-artists h3 { margin: 14px 0 22px; font-size: clamp(30px, 2.8vw, 44px); }
.mu-artists ol { counter-reset: st; }
.mu-artists li { counter-increment: st; display: grid; grid-template-columns: 34px minmax(0, 1fr); column-gap: 10px; padding: 12px 0; border-top: 1px solid rgba(244,245,241,.14); color: rgba(244,245,241,.76); font-size: 15px; }
.mu-artists li::before { content: "0" counter(st); grid-row: span 2; color: var(--c-accent); font: 700 12px/1.6 var(--f-t); }
.mu-artists b { display: block; color: #f4f5f1; font: 700 17px/1.3 var(--f-d); text-transform: uppercase; }
@media (max-width: 1000px) { .mu-next__grid { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .mu-gp { grid-template-columns: 1fr; } }
.mu-artists { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: 0 6%; }
.mu-artists > .mu-no, .mu-artists > h3 { grid-column: 1; }
.mu-artists > ol { grid-column: 2; grid-row: 1 / span 2; }
@media (max-width: 900px) { .mu-artists { grid-template-columns: 1fr; } .mu-artists > ol { grid-column: 1; grid-row: auto; } }

/* Contato */
.mu-contact { background: var(--c-carbon); color: #f4f5f1; padding: clamp(88px, 10vw, 140px) 0; }
.mu-contact__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: 40px 7%; align-items: end; }
.mu-contact h2 { margin-top: 18px; font-size: clamp(46px, 5.6vw, 92px); }
.mu-contact h2 span { color: var(--c-accent); }
.mu-contact__body p { margin-bottom: 28px; color: rgba(244,245,241,.8); }
.mu-contact__mail { display: inline-block; margin-top: 22px; color: rgba(244,245,241,.8); border-bottom: 1px solid currentColor; }
@media (max-width: 900px) { .mu-contact__grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .mu-disc__seal { animation: none; } }
