/* AAG artist-site template. Shared by every artist; per-artist values come from theme.css (CSS variables).
   Foundation: ascendartist.com's dark editorial system (type scale, gutters, pill buttons, uppercase display). */
:root{
  --text-xs:clamp(.75rem,.72rem + .15vw,.8125rem);
  --text-sm:clamp(.875rem,.84rem + .18vw,.9375rem);
  --text-base:clamp(1rem,.96rem + .2vw,1.0625rem);
  --text-lg:clamp(1.125rem,1rem + .5vw,1.375rem);
  --text-xl:clamp(1.5rem,1.1rem + 1.4vw,2.4rem);
  --text-2xl:clamp(2.2rem,1.1rem + 4vw,5rem);
  --text-mega:clamp(3.4rem,.6rem + 12.5vw,13.5rem);
  --gutter:clamp(1.25rem,4vw,3.5rem);
  --section:clamp(3.5rem,9vw,7.5rem);
  --radius:14px;
  --ease:cubic-bezier(.22,.8,.2,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg);scroll-padding-top:5rem}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);font-stretch:var(--body-stretch);font-size:var(--text-base);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,iframe{display:block;max-width:100%}
img{height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
::selection{background:var(--accent);color:var(--accent-ink)}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:1rem;top:-4rem;z-index:300;background:var(--ink);color:var(--bg);padding:.6rem 1rem;font-weight:700;border-radius:8px}
.skip:focus{top:1rem}
.wrap{width:100%;max-width:1440px;margin-inline:auto;padding-inline:var(--gutter)}
.narrow{max-width:760px}

/* type */
.display{font-family:var(--font-display);font-weight:var(--display-weight);font-stretch:var(--display-stretch);text-transform:var(--display-case);font-style:var(--display-style,normal);letter-spacing:var(--display-tracking);line-height:.9}
.h-page{font-size:var(--text-2xl);margin-bottom:clamp(1.5rem,4vw,3rem);transform:skewX(var(--display-skew))}
.h-sec{font-size:var(--text-xl);transform:skewX(var(--display-skew))}
.eyebrow{font-size:var(--text-xs);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.eyebrow b{color:var(--accent);margin-right:.7em}
.muted{color:var(--muted)}
.lede{font-size:var(--text-lg);max-width:40ch;color:var(--ink)}
.fine{font-size:var(--text-xs);color:var(--muted);margin-top:.9rem;max-width:62ch}
.arrow{font-size:var(--text-sm);font-weight:700;letter-spacing:.06em;text-decoration:none;color:var(--muted)}
.arrow:hover{color:var(--ink)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:48px;padding:0 1.4rem;border-radius:999px;background:var(--accent);color:var(--accent-ink);font-size:var(--text-xs);font-weight:800;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:filter .2s,transform .2s var(--ease);white-space:nowrap}
.btn:hover{filter:brightness(1.08)}
.btn:active{transform:translateY(1px)}
.btn--ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--line)}
.btn--ghost:hover{box-shadow:inset 0 0 0 1.5px var(--ink);filter:none}
.btn--sm{min-height:40px;padding:0 1rem}
.btn[disabled]{opacity:.5;cursor:progress}
.ctas{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}
.ctas--tight{margin-top:.9rem}

/* staging-only: drafts, integration slots, review panel (never emitted on production) */
.stagebar{background:#f3d34a;color:#1a1600;font-size:var(--text-xs);font-weight:700;text-align:center;padding:.35rem var(--gutter);letter-spacing:.03em;line-height:1.35}
.draft{display:inline-block;vertical-align:middle;margin-left:.5em;padding:.1em .5em;border-radius:5px;background:#f3d34a;color:#1a1600;font:700 .62rem/1.5 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;transform:none}
.hide-drafts [data-draft],.hide-drafts .draft{display:none!important}
.slot,.slot-section,.slot--bar{display:none!important}
.show-slots .slot{display:block!important}
.show-slots .slot-section{display:block!important}
.show-slots .slot--bar{display:flex!important;outline:2px dashed #f3d34a;outline-offset:-4px}
.slot{padding:1.1rem 1.2rem;border:1.5px dashed #f3d34a;border-radius:var(--radius);background:rgba(243,211,74,.06);font-size:var(--text-sm);color:var(--ink)}
.slot--embed{min-height:320px;display:grid;align-content:center}
.slot__t{font-weight:800;margin-bottom:.3rem}
.slot__t::before{content:"Integration slot";display:inline-block;margin-right:.6em;padding:.05em .5em;border-radius:5px;background:#f3d34a;color:#1a1600;font-size:.7em;letter-spacing:.08em;text-transform:uppercase;vertical-align:.1em}
.diag{position:fixed;left:.75rem;bottom:calc(.75rem + env(safe-area-inset-bottom));z-index:400;font:500 13px/1.45 system-ui,-apple-system,sans-serif;color:#1a1600;max-width:calc(100vw - 1.5rem)}
.show-slots .diag{bottom:calc(5rem + env(safe-area-inset-bottom))}
.diag summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:.5rem;background:#f3d34a;padding:.5rem .85rem;border-radius:999px;font-weight:800;box-shadow:0 6px 24px rgba(0,0,0,.35)}
.diag summary::-webkit-details-marker{display:none}
.diag__dot{width:8px;height:8px;border-radius:50%;background:#1a1600}
.diag__body{margin-top:.5rem;width:min(440px,calc(100vw - 1.5rem));max-height:min(70vh,640px);overflow:auto;background:#fffbe6;border-radius:12px;padding:1rem;box-shadow:0 12px 40px rgba(0,0,0,.45)}
.diag__opts{display:grid;gap:.4rem;padding-bottom:.8rem;margin-bottom:.6rem;border-bottom:1px solid rgba(0,0,0,.12)}
.diag__opts label{display:flex;gap:.5rem;align-items:center;font-weight:700}
.diag__note{margin-bottom:.6rem}
.diag a{color:#5a4300;font-weight:700}
.diag__i{padding:.6rem 0;border-bottom:1px solid rgba(0,0,0,.08)}
.diag__i.is-here{background:rgba(243,211,74,.35);margin-inline:-.5rem;padding-inline:.5rem;border-radius:8px}
.diag__a{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#7a6a2a;margin-left:.3rem}

/* header */
.hdr{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(1.3) blur(14px);-webkit-backdrop-filter:saturate(1.3) blur(14px);border-bottom:1px solid color-mix(in srgb,var(--line) 70%,transparent)}
.hdr__in{display:flex;align-items:center;gap:1rem;min-height:60px}
.mark{font-family:var(--font-display);font-weight:var(--display-weight);font-stretch:var(--display-stretch);text-transform:var(--display-case);font-style:var(--display-style,normal);letter-spacing:var(--display-tracking);font-size:1.05rem;text-decoration:none;white-space:nowrap;margin-right:auto}
.nav{display:flex;align-items:center;gap:1.5rem}
.nav ul{display:flex;gap:clamp(1rem,2.2vw,2rem);align-items:center}
.nav a{font-size:var(--text-sm);font-weight:600;text-decoration:none;color:var(--muted);padding:.5rem 0}
.nav a:hover,.nav a[aria-current=page]{color:var(--ink)}
.nav a[aria-current=page]{box-shadow:0 2px 0 var(--accent)}
.nav .nav__svc,.nav .nav__join{display:none}
.hdr__end{display:flex;align-items:center;gap:.5rem;flex-shrink:0}
.mark:has(.mark__img){min-width:0;flex:0 1 auto}
.hdr__join{min-height:38px;padding:0 1.05rem}
.hdr__menu{display:none;width:44px;height:44px;align-items:center;justify-content:center;margin-right:-10px}
.bars,.bars::before,.bars::after{display:block;width:22px;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s var(--ease),background .2s;content:""}
.bars{position:relative}.bars::before{position:absolute;top:-7px}.bars::after{position:absolute;top:7px}
.hdr__menu[aria-expanded=true] .bars{background:transparent}
.hdr__menu[aria-expanded=true] .bars::before{transform:translateY(7px) rotate(45deg)}
.hdr__menu[aria-expanded=true] .bars::after{transform:translateY(-7px) rotate(-45deg)}
@media (max-width:820px){
  .js .hdr__menu{display:inline-flex}
  .js .nav{position:fixed;inset:60px 0 0 0;z-index:99;flex-direction:column;align-items:stretch;gap:0;background:var(--bg);padding:1.25rem var(--gutter) calc(2rem + env(safe-area-inset-bottom));overflow:auto;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity .2s,transform .25s var(--ease),visibility 0s .25s}
  .js .nav.open{visibility:visible;opacity:1;transform:none;transition:opacity .2s,transform .25s var(--ease)}
  .js .nav ul{flex-direction:column;align-items:stretch;gap:0}
  .js .nav ul:first-child a{display:block;font-family:var(--font-display);font-weight:var(--display-weight);font-stretch:var(--display-stretch);text-transform:var(--display-case);font-style:var(--display-style,normal);font-size:clamp(2rem,9vw,2.8rem);line-height:1.05;color:var(--ink);padding:.55rem 0;transform:skewX(var(--display-skew))}
  .js .nav ul:first-child a[aria-current=page]{color:var(--accent);box-shadow:none}
  .js .nav .nav__join{display:flex;margin-top:1.75rem;min-height:52px;font-size:var(--text-sm)}
  .js .nav .nav__svc{display:flex;flex-direction:row;flex-wrap:wrap;gap:.25rem 1.25rem;margin-top:auto;padding-top:2rem}
  .js .nav .nav__svc a{font-size:var(--text-sm)}
  .menu-open{overflow:hidden}
  .menu-open .hdr{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--bg)}
  html:not(.js) .hdr__in{flex-wrap:wrap;padding-block:.5rem}
  html:not(.js) .nav ul{flex-wrap:wrap;gap:.25rem 1rem}
}

/* section heads */
.sh{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.5rem 1rem;margin-bottom:clamp(1.25rem,3vw,2rem)}
.sh__l{display:flex;align-items:center;gap:.7rem;font-size:var(--text-xs);font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.sh__l::before{content:"";width:1.6rem;height:2px;background:var(--accent);flex:none}
.sh__a{font-size:var(--text-sm);font-weight:700;text-decoration:none;color:var(--ink);white-space:nowrap}
.sh__a span{color:var(--accent);display:inline-block;transition:transform .2s var(--ease)}
.sh__a:hover span{transform:translateX(3px)}
.sh__t{grid-column:1/-1;font-size:var(--text-xl);transform:skewX(var(--display-skew));transform-origin:left}

/* hero */
.hero{position:relative;overflow:hidden;isolation:isolate}
.hero__wash{position:absolute;inset:-12%;z-index:-3;overflow:hidden}
.hero__wash img{width:100%;height:100%;object-fit:cover;filter:blur(56px) saturate(1.3);opacity:.6;transform:scale(1.15)}
.hero__grain{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;filter:grayscale(1) contrast(1.1);opacity:.16;mix-blend-mode:screen}
.hero__grain--full{opacity:.45;mix-blend-mode:normal}
.hero__veil{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 55%,transparent) 0%,color-mix(in srgb,var(--bg) 25%,transparent) 40%,color-mix(in srgb,var(--bg) 70%,transparent) 75%,var(--bg) 100%)}
.hero__in{position:relative;display:grid;gap:clamp(1.25rem,3.5vw,2.5rem)}
.hero__id{container-type:inline-size;min-width:0}
.hero__tag{font-size:var(--text-xs);font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);opacity:.8;margin-bottom:.7rem}
.hero__name{line-height:.82;transform:skewX(var(--display-skew));transform-origin:left bottom;font-size:min(var(--name-max,12.5rem),calc((100vw - 2 * var(--gutter)) / (var(--name-chars) * var(--glyph))))}
@supports (font-size:1cqi){.hero__name{font-size:min(var(--name-max,12.5rem),calc(100cqi / (var(--name-chars) * var(--glyph))))}}
.hero__name span{display:block}
.hero__more{margin-top:1.1rem}
.hero__join{font-size:var(--text-sm);font-weight:800;letter-spacing:.06em;text-decoration:none;color:var(--ink)}
.hero__join span{color:var(--accent)}
.hero__credit{position:absolute;right:var(--gutter);bottom:.75rem;font-size:.7rem;color:var(--muted)}

/* release-led hero (no approved photo yet) */
.hero--release{padding-block:clamp(1.75rem,5vw,4.5rem) clamp(2.5rem,6vw,5rem)}
.hero--release .hero__in{grid-template-areas:"id" "art" "launch"}
.hero--release .hero__id{grid-area:id}
.hero--release .hero__art{grid-area:art;width:min(100%,460px)}
.hero--release .hero__launch{grid-area:launch}
@media (min-width:960px){
  .hero--release{min-height:min(86svh,880px);display:flex;align-items:center}
  .hero--release .hero__in{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);grid-template-areas:"id art" "launch art";column-gap:clamp(2.5rem,6vw,6rem);align-items:end}
  .hero--release .hero__art{justify-self:end;align-self:center;width:min(100%,520px)}
  .hero--release .hero__launch{align-self:start}
}
/* photo hero (approved photography) */
.hero--photo,.hero--type{min-height:calc(100svh - 60px);display:flex;align-items:flex-end;padding-block:6rem clamp(2rem,5vw,4rem)}
.hero__media{position:absolute;inset:0;z-index:-2}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 30%)}
@media (max-width:699px){.hero__media img{object-position:var(--pos-m,var(--pos,50% 30%))}}
.hero--photo .hero__veil{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 35%,transparent) 0%,transparent 30%,color-mix(in srgb,var(--bg) 55%,transparent) 62%,var(--bg) 100%)}
.hero--photo .hero__in,.hero--type .hero__in{width:100%;grid-template-columns:minmax(0,1fr)}   /* track never grows to a wide logo's intrinsic width */
.hero--photo .hero__tag{text-shadow:0 1px 2px var(--bg),0 0 18px var(--bg)}
@media (min-width:960px){
  .hero--panel .hero__media{left:auto;width:min(54vw,820px);-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 38%);mask-image:linear-gradient(90deg,transparent 0,#000 38%)}
  .hero--panel .hero__media img{object-position:var(--pos,50% 25%)}
  .hero--panel .hero__veil{background:linear-gradient(180deg,transparent 55%,color-mix(in srgb,var(--bg) 70%,transparent) 85%,var(--bg) 100%)}
}
/* wide layout: landscape banner, full-bleed on desktop. On phones either the separate phone photo full-bleed (cover) or a banner on top with text below (mbanner). */
@media (max-width:699px){
  .hero--mbanner{min-height:0;display:block;padding:0 0 clamp(1.75rem,6vw,2.5rem)}
  .hero--mbanner .hero__media{position:relative;inset:auto;display:block;aspect-ratio:var(--hero-ratio,4 / 3);z-index:0}
  .hero--mbanner .hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,var(--bg) 100%)}
  .hero--mbanner .hero__veil{display:none}
  .hero--mbanner .hero__in{margin-top:-1.5rem;z-index:1}
  .hero--mbanner .hero__credit{position:static;padding:0 var(--gutter);margin-top:.75rem}
}
@media (min-width:700px){
  .hero--wide .hero__veil{background:linear-gradient(90deg,color-mix(in srgb,var(--bg) 55%,transparent) 0%,transparent 45%),linear-gradient(180deg,color-mix(in srgb,var(--bg) 35%,transparent) 0%,transparent 30%,color-mix(in srgb,var(--bg) 45%,transparent) 65%,var(--bg) 100%)}
}
.hero__launch--strip{display:flex;gap:1rem;align-items:center;max-width:560px}
.hero__thumb{width:88px;flex:none}
.hero__launch--strip .launch__t{font-size:var(--text-lg)}
.hero__launch--strip .embed{display:none}
@media (min-width:960px){.hero--photo .hero__in,.hero--type .hero__in{grid-template-columns:minmax(0,1fr) auto;align-items:end}.hero__launch--strip{justify-self:end}}

/* release launch */
.kicker{display:flex;align-items:center;flex-wrap:wrap;gap:.55rem;font-size:var(--text-xs);font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--ink)}
.kicker__dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 25%,transparent)}
.launch__t{font-size:clamp(2rem,1.2rem + 3.6vw,4rem);margin-top:.55rem;transform:skewX(var(--display-skew));transform-origin:left;line-height:.92;overflow-wrap:anywhere}
.listen{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.25rem;margin-top:1.25rem}
@media (max-width:40rem){.listen__alt{flex-basis:100%}}
.listen__alt{font-size:var(--text-sm);color:var(--muted)}
.listen__alt a{color:var(--ink);font-weight:700;text-underline-offset:3px}
.cover{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--surface);aspect-ratio:1;box-shadow:0 30px 70px -28px rgba(0,0,0,.75),0 0 0 1px rgba(255,255,255,.05)}
.cover img{width:100%;height:100%;object-fit:cover}
.cover__blank{display:grid;place-items:center;height:100%;padding:1rem;text-align:center;font-size:var(--text-xl);color:var(--muted)}
.cover__play{position:absolute;right:.9rem;bottom:.9rem;width:58px;height:58px;border-radius:50%;background:var(--accent);box-shadow:0 8px 24px rgba(0,0,0,.4);transition:transform .2s var(--ease)}
.cover__play:hover{transform:scale(1.06)}
.cover__play span{position:absolute;left:23px;top:18px;border-style:solid;border-width:11px 0 11px 17px;border-color:transparent transparent transparent var(--accent-ink)}
.cover__play.is-done{display:none}

/* music page drop */
.drop{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(2rem,6vw,5.5rem) clamp(2.5rem,6vw,5rem)}
.drop__in{display:grid;gap:clamp(1.5rem,4vw,4.5rem);align-items:center}
.drop__art{width:min(100%,520px)}
@media (min-width:860px){.drop__in{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}}

/* sections */
.section{padding-block:calc(var(--section) / 2)}
main{padding-bottom:calc(var(--section) / 2)}
.page-top{padding-top:clamp(2.25rem,7vw,5rem)}
.sec-music{padding-top:clamp(.5rem,2vw,1.5rem)}

/* release tiles */
.rail,.grid{display:grid;gap:clamp(.9rem,2.2vw,1.75rem)}
.rail{position:relative;grid-auto-flow:column;grid-auto-columns:minmax(140px,40%);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;margin-inline:calc(-1 * var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter);padding-bottom:.5rem;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail .tile{scroll-snap-align:start}
@media (min-width:700px){.rail{grid-auto-columns:minmax(160px,26%)}}
@media (min-width:1100px){.rail{grid-auto-flow:row;grid-template-columns:repeat(6,minmax(0,1fr));overflow:visible;margin:0;padding:0}.rail .tile:nth-child(n+7){display:none}}
.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (min-width:700px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1100px){.grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.tile a{display:grid;gap:.15rem;text-decoration:none}
.tile__art{display:block;aspect-ratio:1;border-radius:10px;overflow:hidden;background:var(--surface);margin-bottom:.55rem}
.tile__art img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.tile a:hover .tile__art img{transform:scale(1.04)}
.tile__t{font-weight:700;line-height:1.25}
.tile__m{font-size:var(--text-xs);color:var(--muted)}

/* embeds (click to load) */
.embed{margin-top:1.25rem;border-radius:var(--radius);overflow:hidden;max-width:560px}
.embed__load{display:flex;align-items:center;width:100%;text-align:left;padding:.95rem 1.1rem;font-size:var(--text-sm);font-weight:700;border:1px solid var(--line);border-radius:var(--radius);background:color-mix(in srgb,var(--bg) 40%,transparent)}
.embed__load:hover{border-color:var(--ink)}
.embed__load::before{content:"";display:inline-block;width:0;height:0;margin-right:.75rem;border-style:solid;border-width:.42rem 0 .42rem .7rem;border-color:transparent transparent transparent var(--accent)}
.embed__load .muted{margin-left:.35rem;font-weight:500}
.embed iframe{width:100%;border:0;border-radius:var(--radius)}

/* shows */
.shows{border-top:1px solid var(--line)}
.show{display:grid;grid-template-columns:4.25rem 1fr;gap:.25rem 1.1rem;align-items:center;padding-block:1.15rem;border-bottom:1px solid var(--line)}
.show__date{display:flex;flex-direction:column;line-height:1.1;font-size:var(--text-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.show__date b{font-family:var(--font-display);font-stretch:var(--display-stretch);font-weight:var(--display-weight);font-size:1.4rem;color:var(--ink);letter-spacing:0;margin-block:.15rem}
.show__venue{font-weight:700;font-size:var(--text-lg);line-height:1.25}
.show__act{grid-column:2;display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.55rem}
@media (min-width:760px){.show{grid-template-columns:6rem 1fr auto}.show__act{grid-column:auto;margin:0}}

/* video */
.vids{display:grid;gap:clamp(1rem,3vw,2rem);margin-top:clamp(1rem,3vw,2rem)}
.vids:first-child{margin-top:0}
@media (min-width:860px){.vids{grid-template-columns:repeat(2,minmax(0,1fr))}}
.yt{position:relative;display:block;width:100%;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:#000}
.yt img{width:100%;height:100%;object-fit:cover;opacity:.82;transition:opacity .3s,transform .6s var(--ease)}
.yt:hover img{opacity:1;transform:scale(1.02)}
.yt__play{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;background:var(--accent);box-shadow:0 10px 30px rgba(0,0,0,.45)}
.yt__play::after{content:"";position:absolute;left:29px;top:24px;border-style:solid;border-width:12px 0 12px 19px;border-color:transparent transparent transparent var(--accent-ink)}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vid figcaption{margin-top:.75rem;font-size:var(--text-sm)}
.vid--big figcaption{display:none}
.sec-watch .sh__t{font-size:var(--text-xl)}

/* story teaser */
.story{max-width:980px}
.story__p{font-size:var(--text-xl);line-height:1.3;font-weight:500;max-width:34ch;margin-bottom:1.25rem}

/* merch */
.prods{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:clamp(1rem,2.5vw,2rem)}
.prod{background:var(--surface);border-radius:var(--radius);overflow:hidden}
.prod img{width:100%;aspect-ratio:1;object-fit:cover}
.prod__body{padding:1rem 1.1rem 1.25rem;display:grid;gap:.4rem;justify-items:start}
.prod h3{font-size:var(--text-base)}

/* join (Laylo) */
.join{position:relative;isolation:isolate;padding-block:clamp(3.5rem,9vw,7rem);background:linear-gradient(180deg,var(--bg) 0%,var(--surface) 22%,var(--surface) 78%,var(--bg) 100%)}
.join::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 55% at 15% 40%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%)}
.join--page{padding-top:clamp(2.25rem,6vw,5rem);background:none}
.join__grid{display:grid;gap:clamp(1.75rem,4vw,4.5rem);align-items:center}
@media (min-width:900px){.join__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.join__t{font-size:var(--text-2xl);margin-top:.8rem;transform:skewX(var(--display-skew));transform-origin:left}
.join__copy .lede{margin-top:1rem}
.laylo{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--raised)}
.laylo iframe{display:block}
.laylo__fb{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;padding:1.25rem;text-align:center;background:var(--raised);color:var(--muted);font-size:var(--text-sm)}
.laylo__fb[hidden]{display:none}
.laylo[data-state=fallback] iframe{visibility:hidden}
.laylo[data-state=ready]{background:transparent}
.ticks{margin-top:1.4rem;display:grid;gap:.55rem}
.ticks li{padding-left:1.6rem;position:relative}
.ticks li::before{content:"";position:absolute;left:0;top:.68em;width:.85rem;height:2px;background:var(--accent)}
.camps{display:grid;gap:.5rem;font-size:var(--text-lg);font-weight:700}
.about__rel{padding:clamp(1.25rem,3vw,2rem);border-radius:var(--radius);background:var(--surface)}
.about__rel .launch__t{font-size:var(--text-xl)}

/* mobile fan bar (Laylo connected only) */
.fanbar{position:fixed;left:0;right:0;bottom:0;z-index:90;display:flex;align-items:center;gap:.75rem;padding:.65rem .6rem calc(.65rem + env(safe-area-inset-bottom)) var(--gutter);background:color-mix(in srgb,var(--raised) 94%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:1px solid var(--line);transform:translateY(110%);transition:transform .3s var(--ease)}
.fanbar.is-on{transform:none}
.slot--bar{transform:none}
.fanbar__t{flex:1;min-width:0;font-size:var(--text-sm);line-height:1.25}
.fanbar__t b{display:block}
.fanbar__t span{color:var(--muted);font-size:var(--text-xs)}
.fanbar__x{width:40px;height:40px;font-size:1.4rem;color:var(--muted)}
@media (min-width:821px){.fanbar{display:none!important}}

/* about / epk */
.about{display:grid;gap:clamp(1.5rem,5vw,5rem)}
@media (min-width:900px){.about{grid-template-columns:1fr 1.4fr}}
.bio p{font-size:var(--text-lg);max-width:60ch}
.bio p+p{margin-top:1.1rem}
.facts{display:grid;gap:1rem;margin-top:1rem}
.facts dt{font-size:var(--text-xs);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:700}
.facts dd{font-size:var(--text-lg);font-weight:700}
.epk{background:var(--surface);border-top:1px solid var(--line)}
.epk__grid{display:grid;gap:2.25rem}
@media (min-width:860px){.epk__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.epk__h{font-size:var(--text-sm);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:.9rem}
.list{display:grid;gap:.7rem}
.list li{padding-bottom:.7rem;border-bottom:1px solid var(--line)}
.press{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}

/* forms */
.booking{display:grid;gap:clamp(2rem,5vw,5rem)}
@media (min-width:1000px){.booking{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.booking__intro{position:sticky;top:6rem;align-self:start}}
.form fieldset{border:0;padding:0;margin:0 0 2rem}
.form legend{font-family:var(--font-display);font-weight:var(--display-weight);font-stretch:var(--display-stretch);text-transform:var(--display-case);font-style:var(--display-style,normal);font-size:var(--text-lg);margin-bottom:1rem;padding:0}
.fgrid{display:grid;gap:1rem 1.25rem}
@media (min-width:640px){.fgrid{grid-template-columns:1fr 1fr}.f--wide{grid-column:1/-1}}
.f label{display:block;font-size:var(--text-sm);font-weight:600;margin-bottom:.4rem}
.f input,.f select,.f textarea{width:100%;min-height:48px;padding:.7rem .9rem;border-radius:10px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink);font-size:16px}
.f textarea{min-height:140px;resize:vertical}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--accent)}
.f [aria-invalid=true]{border-color:#e5645a}
.f__hint{font-size:var(--text-xs);color:var(--muted);margin-top:.35rem}
.f__err{font-size:var(--text-xs);color:#f08a80;margin-top:.35rem;font-weight:600}
.check{display:flex;gap:.7rem;align-items:flex-start;font-size:var(--text-sm);cursor:pointer}
.check input{width:20px;height:20px;margin-top:.15rem;accent-color:var(--accent);flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__foot{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1.5rem}
.form__status{font-size:var(--text-sm);font-weight:600}
.form__status.ok{color:#8fd19e}.form__status.err{color:#f08a80}

/* prose */
.prose h2{font-size:var(--text-lg);margin:2rem 0 .5rem}
.prose p{max-width:68ch}
.prose a{text-decoration:underline}

/* footer */
.ftr{border-top:1px solid var(--line);padding-block:clamp(3rem,7vw,5rem) 2rem;font-size:var(--text-sm)}
.ftr__grid{display:grid;gap:2rem}
@media (min-width:760px){.ftr__grid{grid-template-columns:1.6fr 1fr 1.2fr 1fr}}
.ftr__mark{font-size:clamp(1.8rem,1.2rem + 2vw,2.8rem);margin-bottom:.6rem;transform:skewX(var(--display-skew))}
.ftr__h{font-size:var(--text-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.8rem}
.ftr__list{display:grid;gap:.55rem}
.ftr__list a{text-decoration:none}
.ftr__list a:hover{text-decoration:underline}
.ftr__base{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.5rem;margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--line);color:var(--muted);font-size:var(--text-xs)}
.ftr__base a{text-decoration:underline}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* sparse catalogue: a single "more music" item reads as a feature row, not a lone tile */
.rail:has(>.tile:only-child){display:block;overflow:visible;margin-inline:0;padding-inline:0}
.rail>.tile:only-child{max-width:560px}
.rail>.tile:only-child a{grid-template-columns:clamp(112px,32vw,168px) 1fr;grid-template-rows:auto auto;align-content:center;column-gap:clamp(1rem,3vw,1.5rem)}
.rail>.tile:only-child .tile__art{grid-row:1/3;margin:0}
.rail>.tile:only-child .tile__t{align-self:end;font-size:var(--text-lg)}
.rail>.tile:only-child .tile__m{align-self:start}
.vid--big{max-width:1120px}

/* logo artwork in place of the typed wordmark */
.mark__img{display:block;height:28px;width:auto;max-width:min(100%,62vw,260px);object-fit:contain;object-position:left center}
.mark__img--compact{height:44px}
.mark__img--wide{height:34px}
.hero--logo .hero__tag{margin-bottom:0;max-width:30ch}
@media (min-width:900px){.hero--logo .hero__tag{font-size:clamp(.95rem,.4rem + 1vw,1.35rem);letter-spacing:.16em;line-height:1.45;opacity:.92}}
.ftr__mark--logo img{display:block;width:auto;height:auto;max-width:min(220px,60%);max-height:110px}

/* signature headline face: wordmark, hero name, page and release titles (defaults to the display face) */
.hero__name,.h-page,.launch__t,.mark,.ftr__mark,.cover__blank{font-family:var(--font-headline);font-weight:var(--headline-weight);font-stretch:var(--headline-stretch);text-transform:var(--headline-case);letter-spacing:var(--headline-tracking)}

.laylo--profile{min-height:280px}.laylo--profile iframe{height:280px}
@media (min-width:600px){.laylo--profile{min-height:230px}.laylo--profile iframe{height:230px}}

.shows__follow{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1rem;margin-top:1.75rem;font-size:var(--text-sm)}
.booking__agent{margin-top:1.25rem;padding:1rem 1.1rem;border-left:2px solid var(--accent);background:var(--raised);border-radius:0 var(--radius) var(--radius) 0}