/* Raccordable artwork stays behind the entire page, never in an empty hero column. */
main.artist-site { position:relative; isolation:isolate; }
.artist-pattern { position:absolute; z-index:-1; inset:0; pointer-events:none; background:var(--artist-accent); mask-image:var(--artist-pattern); mask-repeat:repeat; mask-size:768px 768px; opacity:.06; }
main.artist-site[data-template] .artist-hero { display:block; min-height:0; padding:clamp(48px,7vw,100px) clamp(22px,6vw,90px); background:transparent; }
main.artist-site .artist-hero .artist-intro { display:flex; flex-direction:column; align-items:flex-start; gap:0; width:100%; max-width:1100px; min-width:0; margin-inline:auto; padding:0; transform:none; background:transparent; }
main.artist-site .artist-intro > * { min-width:0; max-width:100%; grid-column:auto; grid-row:auto; }
main.artist-site .artist-intro:has(.artist-project-photo) { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(200px,.8fr); grid-template-areas:"kicker photo" "title photo" "tagline photo" "actions photo"; gap:0 clamp(28px,5vw,72px); align-content:center; align-items:start; }
main.artist-site .artist-intro > .artist-kicker { grid-area:kicker; margin:0 0 18px!important; }
main.artist-site .artist-intro > h1 { grid-area:title; width:100%; }
main.artist-site .artist-intro > .artist-tagline { grid-area:tagline; margin:20px 0 0!important; }
main.artist-site .artist-intro > .artist-project-photo { grid-area:photo; align-self:center; justify-self:center; width:min(100%,380px); margin:0; }
main.artist-site .artist-intro > .artist-hero-actions { grid-area:actions; margin:26px 0 0!important; max-width:100%; }
main.artist-site:is(.layout-poster,.layout-horizon,.layout-hearth,.layout-pop,.layout-marquee,.layout-folio,.layout-club,.layout-gorealtar,.layout-goremaw,.layout-gorecathedral,.layout-goreritual) .artist-intro { display:flex; flex-direction:column; align-items:center; text-align:center; gap:0; }
main.artist-site:is(.layout-poster,.layout-horizon,.layout-hearth,.layout-pop,.layout-marquee,.layout-folio,.layout-club,.layout-gorealtar,.layout-goremaw,.layout-gorecathedral,.layout-goreritual) .artist-intro > .artist-tagline { margin-inline:auto!important; }
main.artist-site:is(.layout-poster,.layout-horizon,.layout-hearth,.layout-pop,.layout-marquee,.layout-folio,.layout-club,.layout-gorealtar,.layout-goremaw,.layout-gorecathedral,.layout-goreritual) .artist-project-photo { margin:28px auto 0; width:min(100%,360px); }
main.artist-site:is(.layout-poster,.layout-horizon,.layout-hearth,.layout-pop,.layout-marquee,.layout-folio,.layout-club,.layout-gorealtar,.layout-goremaw,.layout-gorecathedral,.layout-goreritual) .artist-hero-actions { justify-content:center; }
main.artist-site .artist-hero > .artist-feature { position:relative; inset:auto; width:auto; max-width:1100px; margin:30px auto 0; }
main.artist-site .artist-hero-note { position:static; display:block; width:fit-content; max-width:100%; margin:42px 0 0; text-align:inherit; }
main.artist-site.gore-site .artist-intro::after,main.artist-site.gore-site h1::before,main.artist-site.gore-site h1::after,main.artist-site.gore-site .artist-section::after { display:none; }
main.artist-site .artist-section,main.artist-site .release-card,main.artist-site .member-grid article { min-width:0; }
main.artist-site .concert-row { text-align:left; }
main.artist-site .concert-row > div { min-width:0; }
main.artist-site .concert-row h3 { overflow-wrap:anywhere; }
.artist-cascade-pending { opacity:0; translate:0 32px; }
.artist-cascade-pending:focus-within { opacity:1; translate:none; }
.artist-cascade-enter { animation:artist-cascade-in .9s cubic-bezier(.22,.61,.36,1) both; animation-delay:var(--cascade-delay,0ms); }
@keyframes artist-cascade-in { from { opacity:0; translate:0 32px; } to { opacity:1; translate:0 0; } }
@media(max-width:700px) {
 main.artist-site .artist-hero .artist-intro:has(.artist-project-photo) { display:flex; flex-direction:column; gap:0; }
 main.artist-site .artist-intro > .artist-project-photo { margin-top:24px; align-self:auto; }
 main.artist-site .artist-hero > .artist-feature { max-width:100%; flex-wrap:wrap; }
 main.artist-site .concert-row > .artist-reactable-link { grid-column:2; }
 main.artist-site .artist-nav { flex-wrap:wrap; gap:16px; }
 main.artist-site .artist-nav > div { flex-wrap:wrap; gap:12px; }
}
@media(prefers-reduced-motion:reduce) { .artist-pattern,.artist-cascade-enter,.artist-cascade-pending { animation:none!important; transform:none!important; translate:none!important; opacity:1; } .artist-pattern { opacity:.06; } }

/* The artwork stays static; only content enters in cascade. Text has no added backing panels. */

.artist-audio-link { display:flex; flex-direction:column; align-items:flex-start; gap:10px; width:100%; max-width:420px; }
.artist-audio-link audio { display:block; width:100%; max-width:100%; height:44px; }

.artist-suno-player { display:block; width:100%; height:240px; border:0; border-radius:10px; }
.artist-audio-link .suno-preview-note { font:inherit; font-size:14px; }

/* Shared centered navigation stays visible when an in-page anchor is followed. */
main.artist-site[data-template] { overflow:clip; padding-inline:0; }
main.artist-site[data-template] > .artist-nav { position:sticky; top:0; right:auto; bottom:auto; left:auto; z-index:30; order:-1; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; align-self:stretch; gap:20px 48px; width:100%; max-width:none; height:auto; min-height:76px; margin:0; padding:16px 24px; border-inline:0; background:var(--artist-bg); text-align:center; }
main.artist-site[data-template] > .artist-nav .artist-brand { justify-content:center; writing-mode:horizontal-tb; text-align:center; gap:18px; font-size:20px; }
main.artist-site[data-template] > .artist-nav .artist-brand img { width:160px; height:96px; flex-shrink:0; object-fit:contain; }
main.artist-site[data-template] > .artist-nav > div { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:center; align-items:center; writing-mode:horizontal-tb; gap:16px 28px; margin:0; text-align:center; font-size:16px; }
main.artist-site[data-template] :is(.artist-hero,.artist-section) { scroll-margin-top:calc(var(--artist-nav-height,160px) + 18px); }
@media(max-width:700px) {
 main.artist-site[data-template] > .artist-nav { flex-direction:column; gap:12px; padding:12px 18px; }
 main.artist-site[data-template] > .artist-nav .artist-brand { font-size:18px; gap:12px; }
 main.artist-site[data-template] > .artist-nav .artist-brand img { width:128px; height:80px; }
 main.artist-site[data-template] > .artist-nav > div { font-size:14px; gap:14px 24px; }
}
