:root {
  color-scheme:dark;
  --bg:#0f1115;
  --panel:#1a1d24;
  --text:#f8fafc;
  --muted:#94a3b8;
  --accent:#a78bfa;
  --accent-primary:#6366f1;
  --accent-secondary:#8b5cf6;
  --accent-tertiary:#ec4899;
  --border:#303542;
  --display:'Space Grotesk',sans-serif;
  --body:'DM Sans',sans-serif
}
* {
  box-sizing:border-box
}
html {
  overflow-x:clip;
  scroll-behavior:smooth;
  scroll-padding-top:95px
}
body {
  margin:0;
  overflow-x:clip;
  background:var(--bg);
  color:var(--text);
  font-family:var(--body);
  font-size:16px;
  line-height:1.65
}
a {
  color:inherit;
  text-decoration:none
}
button,input,select {
  font:inherit
}
button,a,input,select,summary {
  -webkit-tap-highlight-color:transparent
}
button,a,summary {
  touch-action:manipulation
}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:5px
}
img {
  display:block;
  max-width:100%;
  object-fit:cover
}
h1,h2,h3,p {
  margin:0
}
h1,h2,h3 {
  font-family:var(--display);
  font-weight:500
}
h2 {
  font-size:clamp(34px,4.1vw,58px);
  line-height:1.08;
  letter-spacing:-2.5px
}
h3 {
  font-size:23px;
  line-height:1.3;
  letter-spacing:-.6px
}
em {
  font-style:normal;
  color:var(--accent)
}
.wrap {
  width:min(1240px,calc(100% - 96px));
  margin-inline:auto
}
.header {
  width:min(1392px,calc(100% - 64px));
  margin:auto;
  display:flex;
  justify-content:space-between;
  align-items:center;
  min-height:104px;
  gap:24px
}
.brand {
  display:flex;
  align-items:center;
  gap:10px;
  font-family:var(--display);
  font-weight:700;
  font-size:23px;
  letter-spacing:-1.2px;
  line-height:1.1
}
.brand-light {
  font-weight:400;
  color:#b8bfd0
}
.brand small {
  display:block;
  font:9px var(--body);
  letter-spacing:2.4px;
  margin-top:7px;
  color:var(--muted)
}
nav {
  display:flex;
  gap:34px;
  font-size:13px;
  color:#cbd5e1
}
nav a:hover,.text-link:hover,.footer a:hover {
  color:var(--accent)
}
.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:30px;
  background:linear-gradient(135deg,var(--accent-primary),var(--accent-tertiary));
  color:#ffffff;
  padding:15px 24px;
  border:1px solid var(--accent);
  border-radius:5px;
  font-size:14px;
  font-weight:700;
  line-height:1.4;
  cursor:pointer;
  transition:background .2s,transform .2s
}
.button:hover {
  background:linear-gradient(135deg,#818cf8,#f472b6);
  transform:translateY(-2px)
}
.button.small {
  font-size:12px;
  padding:12px 18px;
  gap:20px
}
.button.secondary {
  background:transparent;
  color:var(--text);
  border-color:#514a62
}
.button.secondary:hover {
  background:#28213e
}
.button:disabled {
  opacity:.6;
  cursor:wait;
  transform:none
}
.hero {
  display:grid;
  grid-template-columns:1.06fr 1fr;
  gap:32px;
  align-items:center;
  padding-top:42px;
  padding-bottom:86px
}
.eyebrow {
  font-size:10px;
  font-weight:600;
  letter-spacing:2px;
  color:var(--accent);
  margin-bottom:24px;
  display:flex;
  align-items:center;
  gap:9px
}
.live-dot {
  display:inline-block;
  background:var(--accent);
  width:6px;
  height:6px;
  border-radius:50%;
  box-shadow:0 0 12px #8b5cf675;
  flex-shrink:0
}
h1 {
  font-size:clamp(46px,5.6vw,78px);
  line-height:1.025;
  letter-spacing:-4.6px;
  margin-bottom:28px
}
h1 span {
  color:var(--accent)
}
.lead {
  color:var(--muted);
  max-width:460px;
  font-size:16px;
  line-height:1.8
}
.actions {
  display:flex;
  align-items:center;
  gap:26px;
  margin-top:31px
}
.text-link {
  font-size:13px;
  font-weight:600;
  display:inline-flex;
  gap:16px;
  align-items:center
}
.fine {
  font-size:11px;
  color:var(--muted);
  margin-top:19px
}
.hero-art {
  height:565px;
  position:relative;
  border:1px solid #49405f;
  border-radius:7px;
  background:#181724
}
.hero-art>img {
  height:100%;
  width:100%;
  object-position:53% center;
  border-radius:7px
}
.hero-art:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#0006,transparent 25%,transparent 55%,#080912ef);
  pointer-events:none;
  border-radius:7px
}
.art-top,.art-bottom {
  position:absolute;
  z-index:1;
  left:25px;
  right:25px;
  display:flex;
  justify-content:space-between
}
.art-top {
  top:24px;
  font-size:8px;
  letter-spacing:1.4px
}
.art-bottom {
  bottom:33px;
  align-items:end
}
.art-bottom p {
  font-family:var(--display);
  font-size:25px;
  line-height:1.2;
  letter-spacing:-.8px
}
.art-bottom strong {
  color:var(--accent);
  font-weight:500
}
.art-stamp {
  border:1px solid #8b5cf670;
  border-radius:50%;
  width:73px;
  height:73px;
  display:grid;
  place-content:center;
  text-align:center;
  font-size:8px;
  letter-spacing:1.6px;
  color:var(--accent);
  transform:rotate(-12deg)
}
.floating-tag {
  position:absolute;
  z-index:2;
  left:26px;
  bottom:-18px;
  background:#211c30;
  padding:10px 17px;
  border:1px solid #56426f;
  border-radius:4px;
  display:flex;
  align-items:center;
  gap:9px;
  font-size:11px
}
.tool-strip {
  border-block:1px solid var(--border);
  display:flex;
  justify-content:center;
  align-items:center;
  gap:30px;
  padding:22px 16px;
  flex-wrap:wrap;
  font:11px var(--display);
  letter-spacing:2px;
  color:#cbd5e1
}
.tool-strip i {
  font-style:normal;
  color:var(--accent);
  font-size:22px;
  line-height:1
}
.intro {
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:110px;
  padding-top:103px;
  padding-bottom:105px
}
.intro .eyebrow {
  grid-column:1/-1
}
.intro>p:last-child {
  color:var(--muted);
  padding-top:4px;
  max-width:470px
}
.section-title {
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:40px;
  margin-bottom:36px
}
.section-title>p {
  color:var(--muted);
  font-size:13px;
  line-height:1.8;
  padding-bottom:3px
}
.section-title .eyebrow {
  margin-bottom:19px
}
.identity-grid {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:18px
}
.feature {
  padding:30px;
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:6px;
  overflow:hidden
}
.feature p {
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  margin-top:14px
}
.feature-top {
  display:flex;
  justify-content:space-between;
  color:#acb5cc;
  font-size:10px;
  letter-spacing:1.6px;
  margin-bottom:23px
}
.feature-footer {
  display:block;
  font-size:10px;
  color:#c4b5fd;
  border-top:1px solid #383344;
  margin-top:24px;
  padding-top:18px;
  letter-spacing:1px
}
.identity-visual {
  position:relative;
  height:390px;
  margin-bottom:29px;
  border-radius:3px;
  overflow:hidden
}
.identity-visual img {
  width:100%;
  height:100%;
  object-position:center 30%
}
.identity-visual:after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(transparent 40%,#080912ed)
}
.identity-note {
  position:absolute;
  bottom:22px;
  left:22px;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:14px
}
.identity-note small,.identity-note span {
  font-size:8px;
  letter-spacing:1.6px;
  color:var(--accent)
}
.identity-note strong {
  font:500 34px/1.1 var(--display);
  letter-spacing:-1px
}
.identity-side {
  display:grid;
  grid-template-rows:1fr 1fr;
  gap:18px
}
.tool-symbol {
  font-size:30px;
  line-height:1;
  color:var(--accent);
  display:block;
  margin-bottom:18px
}
.label {
  display:block;
  font-size:10px;
  letter-spacing:1.7px;
  color:#cbd5e1;
  margin-bottom:13px
}
.prompt-example {
  margin-top:23px;
  border-left:2px solid var(--accent);
  padding:5px 0 5px 17px;
  font-size:13px;
  color:#e9e4f8
}
.prompt-example small {
  display:block;
  margin-top:12px;
  font-size:8px;
  letter-spacing:1.5px;
  color:var(--muted)
}
.reference-row {
  display:flex;
  gap:10px;
  margin-top:22px
}
.reference-row img {
  height:88px;
  width:calc((100% - 20px)/3);
  border-radius:3px
}
.second {
  margin-top:95px
}
.production-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.video-visual {
  height:280px;
  position:relative;
  margin-bottom:28px;
  overflow:hidden;
  border-radius:3px
}
.video-visual>img {
  width:100%;
  height:100%;
  object-position:50% 35%
}
.frame-label {
  position:absolute;
  top:17px;
  left:18px;
  font-size:8px;
  letter-spacing:1.8px;
  background:#11131cdd;
  padding:5px 9px
}
.timeline {
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  background:#080912bf
}
.timeline i {
  height:18px;
  width:5px;
  background:var(--accent);
  opacity:.8
}
.timeline i:nth-child(3n) {
  height:29px
}
.timeline i:nth-child(2n) {
  height:10px
}
.timeline i:nth-child(5n) {
  height:36px
}
.shoot-grid {
  display:flex;
  gap:8px;
  height:280px;
  margin-bottom:28px
}
.shoot-grid img {
  width:calc((100% - 16px)/3);
  height:100%;
  border-radius:3px;
  object-position:50% 25%
}
.detail-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:18px
}
.detail-grid .feature {
  padding:27px
}
.management {
  background:#171522;
  border-block:1px solid #3a304f;
  margin-top:103px;
  padding:84px 0
}
.management-inner {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:85px
}
.management .lead {
  margin-top:27px;
  font-size:15px
}
.management .text-link {
  margin-top:25px;
  color:var(--accent)
}
.management-list article {
  display:flex;
  gap:24px;
  padding:23px 0;
  border-bottom:1px solid #3a3449
}
.management-list article:first-child {
  padding-top:8px
}
.management-list article>span {
  color:var(--accent);
  font-size:11px;
  padding-top:5px
}
.management-list h3 {
  font-size:19px
}
.management-list p {
  color:var(--muted);
  font-size:13px;
  margin-top:10px
}
.workflow {
  padding-top:100px;
  padding-bottom:95px
}
.steps {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  padding:0;
  list-style:none;
  margin:45px 0 0
}
.steps li {
  border-top:1px solid #615178;
  padding:24px 25px 0 0;
  position:relative
}
.steps li:before {
  content:'';
  position:absolute;
  top:-4px;
  left:0;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--accent)
}
.steps li>span {
  font:11px var(--display);
  color:var(--accent)
}
.steps h3 {
  font-size:27px;
  margin-top:17px
}
.steps p {
  color:var(--muted);
  font-size:13px;
  margin-top:12px
}
.steps small {
  font-size:8px;
  letter-spacing:1.1px;
  display:block;
  color:#b5afc9;
  margin-top:22px
}
.pricing {
  border-top:1px solid var(--border);
  padding-top:85px
}
.pricing-heading {
  text-align:center
}
.pricing-heading .eyebrow {
  justify-content:center
}
.pricing-heading>p:not(.eyebrow) {
  color:var(--muted);
  font-size:14px;
  margin-top:24px
}
.billing {
  display:inline-flex;
  padding:5px;
  border:1px solid #444052;
  border-radius:5px;
  gap:5px;
  margin-top:30px
}
.billing button {
  border:0;
  background:transparent;
  color:#b3aec5;
  font-size:12px;
  padding:10px 18px;
  border-radius:3px;
  cursor:pointer
}
.billing button[aria-pressed=true] {
  background:#302343;
  color:var(--accent)
}
.billing span {
  font-size:9px;
  margin-left:7px
}
.price-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
  margin-top:56px;
  align-items:stretch
}
.plan {
  position:relative;
  border:1px solid #3b354c;
  border-radius:5px;
  padding:27px 22px;
  background:#171922;
  display:flex;
  flex-direction:column
}
.plan h3 {
  font-size:19px
}
.price {
  display:flex;
  gap:9px;
  align-items:baseline;
  margin-top:26px;
  white-space:nowrap
}
.price strong {
  font:500 41px var(--display);
  letter-spacing:-2px
}
.price>span {
  font-size:10px;
  color:var(--muted)
}
.billing-note {
  font-size:10px;
  color:var(--muted);
  min-height:35px;
  margin-top:5px
}
.plan .button {
  padding:12px 8px;
  font-size:12px;
  margin-top:16px
}
.plan ul {
  padding:0;
  list-style:none;
  font-size:11px;
  line-height:1.7;
  margin:25px 0
}
.plan li {
  position:relative;
  padding-left:17px;
  margin-bottom:11px
}
.plan li:before {
  content:'✓';
  position:absolute;
  left:0;
  color:var(--accent)
}
.plan-note {
  font-size:10px;
  color:var(--muted);
  margin-top:auto;
  border-top:1px solid #3a3449;
  padding-top:18px
}
.recommended {
  border-color:var(--accent);
  background:#241c34
}
.recommend-tag {
  position:absolute;
  left:-1px;
  right:-1px;
  top:-24px;
  background:var(--accent);
  color:#ffffff;
  text-align:center;
  font-size:8px;
  letter-spacing:.7px;
  padding:6px 2px;
  border-radius:4px 4px 0 0
}
.pricing-details {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  color:var(--muted);
  font-size:11px;
  line-height:1.9;
  margin-top:30px
}
.pricing-details strong {
  color:#ede9fe
}
.faq {
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:90px;
  padding-top:100px;
  padding-bottom:95px
}
.questions details {
  border-bottom:1px solid #3a3449
}
.questions summary {
  padding:19px 26px 19px 0;
  cursor:pointer;
  font-size:14px;
  list-style:none;
  position:relative
}
.questions summary::-webkit-details-marker {
  display:none
}
.questions summary:after {
  content:'+';
  position:absolute;
  right:0;
  color:var(--accent);
  font-size:20px;
  top:13px
}
.questions details[open] summary:after {
  content:'−'
}
.questions p {
  padding-bottom:22px;
  color:var(--muted);
  font-size:13px
}
.signup {
  background:radial-gradient(ellipse at 15% 40%,#422254,transparent 65%),#171322;
  border-block:1px solid #4a365a;
  padding:85px 0
}
.signup-inner {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:115px;
  align-items:center
}
.signup h2 {
  font-size:clamp(50px,6vw,85px);
  letter-spacing:-4px
}
.signup .lead {
  margin-top:27px;
  font-size:15px
}
.signup .fine {
  margin-top:30px
}
.signup a:not(.button) {
  color:var(--accent)
}
.signup-form {
  padding:32px;
  background:#11131cd9;
  border:1px solid #514163;
  border-radius:6px
}
.signup-form>p:first-of-type {
  font-size:12px;
  color:var(--muted);
  margin-top:7px;
  margin-bottom:20px
}
.signup-form label {
  display:block;
  font-size:11px;
  margin-top:14px;
  margin-bottom:6px;
  color:#cbd5e1
}
.signup-form input,.signup-form select {
  width:100%;
  padding:12px 13px;
  background:#20202d;
  border:1px solid #494155;
  border-radius:4px;
  color:var(--text);
  font-size:13px;
  min-height:44px
}
.signup-form input::placeholder {
  color:#94a3b8
}
.terms {
  font-size:10px;
  color:var(--muted);
  margin-top:18px
}
.signup-form .button {
  width:100%;
  margin-top:20px
}
.signup-status {
  font-size:12px;
  color:var(--accent);
  margin-top:12px
}
.signup-status.error {
  color:#ffb2a0
}
.alternative {
  font-size:10px;
  color:var(--muted);
  text-align:center;
  margin-top:15px
}
.alternative a {
  display:inline-block
}
.footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  flex-wrap:wrap;
  padding-top:36px;
  padding-bottom:26px
}
.footer .brand {
  font-size:19px
}
.footer p {
  font-size:11px;
  color:var(--muted)
}
.footer>div {
  display:flex;
  gap:22px;
  font-size:11px;
  color:#cbd5e1
}
.footer>small {
  flex-basis:100%;
  font-size:9px;
  color:#8993aa
}
.skip-link {
  position:fixed;
  top:-100px;
  left:20px;
  background:var(--accent);
  color:#ffffff;
  padding:12px;
  z-index:10
}
.skip-link:focus {
  top:10px
}
[hidden] {
  display:none!important
}
.sale-notice {
  padding:10px;
  background:#2c1f3f;
  border-radius:4px;
  color:var(--accent)!important;
  max-width:680px;
  margin-inline:auto!important
}
@media(min-width:1500px) {
  .hero {
    gap:60px
  }
}
@media(max-width:1100px) {
  .wrap {
    width:calc(100% - 64px)
  }
  h1 {
    font-size:58px;
    letter-spacing:-3px
  }
  .hero-art {
    height:510px
  }
  .actions {
    gap:17px;
    flex-wrap:wrap
  }
  .hero-copy .eyebrow {
    font-size:8px
  }
  .tool-strip {
    gap:17px
  }
  .intro {
    gap:50px
  }
  .price-grid {
    grid-template-columns:repeat(2,1fr);
    gap:38px 18px
  }
  .price strong {
    font-size:45px
  }
  .management-inner,.signup-inner {
    gap:45px
  }
  .plan {
    padding:28px
  }
  .faq {
    gap:40px
  }
}
@media(max-width:760px) {
  .wrap {
    width:calc(100% - 40px)
  }
  .header {
    width:calc(100% - 40px);
    min-height:85px;
    gap:12px
  }
  .header nav {
    display:none
  }
  .brand {
    font-size:20px
  }
  .header .button {
    font-size:10px;
    padding:11px 12px;
    gap:8px
  }
  .hero {
    grid-template-columns:1fr;
    padding-top:34px;
    padding-bottom:58px;
    gap:40px
  }
  h1 {
    font-size:clamp(45px,9.8vw,70px);
    letter-spacing:-2.8px
  }
  .hero-copy .eyebrow {
    font-size:8px;
    letter-spacing:1.3px
  }
  .hero-art {
    height:470px
  }
  .lead {
    font-size:15px
  }
  .tool-strip {
    gap:13px;
    font-size:9px;
    letter-spacing:1px
  }
  .tool-strip i {
    font-size:17px
  }
  .intro {
    display:block;
    padding:66px 0
  }
  .intro>p:last-child {
    margin-top:25px;
    max-width:100%
  }
  h2 {
    letter-spacing:-1.8px;
    font-size:39px
  }
  .section-title {
    display:block
  }
  .section-title>p {
    margin-top:21px;
    font-size:12px
  }
  .identity-grid,.production-grid,.management-inner,.signup-inner,.faq {
    grid-template-columns:1fr;
    gap:20px
  }
  .identity-visual {
    height:340px
  }
  .feature {
    padding:24px
  }
  .identity-side {
    grid-template-rows:auto auto
  }
  .identity-side .feature {
    min-height:260px
  }
  .second {
    margin-top:65px
  }
  .detail-grid {
    grid-template-columns:1fr
  }
  .management {
    margin-top:65px;
    padding:60px 0
  }
  .management-inner {
    gap:35px
  }
  .workflow {
    padding-top:65px;
    padding-bottom:65px
  }
  .steps {
    grid-template-columns:1fr 1fr;
    gap:30px 20px
  }
  .steps li {
    padding-right:0
  }
  .pricing {
    padding-top:65px
  }
  .price-grid {
    gap:38px 13px
  }
  .plan {
    padding:24px 17px
  }
  .plan h3 {
    font-size:17px
  }
  .price strong {
    font-size:35px
  }
  .price {
    gap:6px
  }
  .price>span {
    font-size:9px
  }
  .recommend-tag {
    font-size:6px;
    letter-spacing:0
  }
  .plan li {
    font-size:10px
  }
  .pricing-details {
    grid-template-columns:1fr;
    gap:13px
  }
  .faq {
    padding-top:65px;
    padding-bottom:65px;
    gap:25px
  }
  .signup {
    padding:60px 0
  }
  .signup-inner {
    gap:35px
  }
  .signup-form {
    padding:25px
  }
  .footer {
    gap:18px
  }
  .footer p {
    display:none
  }
  .footer>div {
    gap:15px
  }
  .video-visual,.shoot-grid {
    height:270px
  }
}
@media(max-width:420px) {
  .brand small {
    font-size:7px;
    letter-spacing:1.4px
  }
  .brand {
    font-size:17px;
    gap:7px
  }
  .brand img {
    width:27px;
    height:27px
  }
  .hero-art {
    height:380px
  }
  .price-grid {
    grid-template-columns:1fr;
    gap:36px
  }
  .recommend-tag {
    font-size:8px
  }
  .plan h3 {
    font-size:22px
  }
  .plan li {
    font-size:12px
  }
  .price strong {
    font-size:45px
  }
  .billing button {
    padding:10px 13px
  }
  .identity-visual {
    height:300px
  }
  .hero .fine {
    font-size:10px
  }
  .footer .brand {
    font-size:17px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  .button {
    transition:none
  }
  .button:hover {
    transform:none
  }
}
.shoot-grid img.artist-contact-sheet {
  width:100%;
  object-position:center 30%
}

/* Creator Studio brand treatment */
h1>span, h2>em { background:linear-gradient(110deg,#a78bfa,#f472b6); background-clip:text; -webkit-background-clip:text; color:transparent; }
.recommend-tag { background:linear-gradient(110deg,#6366f1,#ec4899); color:#fff; }
.live-dot { background:#ec4899; }
body { background-image:radial-gradient(ellipse at 12% 0%,rgba(99,102,241,.09),transparent 32%),radial-gradient(ellipse at 90% 8%,rgba(236,72,153,.06),transparent 28%); }
.music-spotlight { margin-bottom:110px; border-top:1px solid var(--border); padding-top:60px; }
.music-heading { max-width:900px; }
.music-heading h2 { font-size:clamp(38px,4.8vw,65px); }
.music-heading>p:last-child { max-width:650px; color:var(--muted); font-size:15px; margin-top:25px; }
.music-showcase { display:grid; grid-template-columns:1.15fr 1fr; margin-top:38px; border:1px solid #514163; border-radius:8px; overflow:hidden; background:linear-gradient(135deg,#1c1929,#14151e); }
.music-concept { position:relative; min-height:450px; overflow:hidden; }
.music-concept>img { width:100%; height:100%; object-position:center; }
.music-concept:after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,#0c0b1660,transparent 28%,transparent 50%,#0c0b16e8); }
.concept-heading { position:absolute; z-index:1; top:22px; left:22px; right:22px; display:flex; justify-content:space-between; font-size:8px; letter-spacing:1.4px; }
.concept-caption { position:absolute; z-index:1; bottom:30px; left:25px; right:25px; display:flex; justify-content:space-between; align-items:end; font:500 25px/1.2 var(--display); letter-spacing:-.7px; }
.concept-caption strong { color:#e9b5ed; font-weight:500; }
.scene-count { font:10px var(--body); letter-spacing:2px; }
.music-direction { padding:38px; display:flex; flex-direction:column; justify-content:center; }
.music-direction>.eyebrow { font-size:8px; letter-spacing:1.3px; }
.music-tabs { display:flex; gap:7px; margin-bottom:25px; }
.music-tabs button { background:#242032; border:1px solid #42384f; border-radius:4px; color:#bdb2cb; padding:10px 12px; font-size:11px; cursor:pointer; }
.music-tabs button[aria-selected=true] { background:#3d2554; border-color:#a78bfa; color:#f4e6ff; }
.music-stage-number { display:block; color:#f472b6; font-size:9px; letter-spacing:1.5px; margin-bottom:15px; }
.music-direction h3 { font-size:29px; letter-spacing:-1px; max-width:390px; }
#music-stage { min-height:216px; }
#music-stage-copy { margin-top:16px; color:var(--muted); font-size:13px; line-height:1.85; }
.music-stage-deliverable { margin-top:23px; font-size:8px; letter-spacing:1.3px; color:#c4b5fd; }
.music-direction>.button { margin-top:21px; font-size:12px; gap:15px; }
.music-access-note { color:var(--muted); font-size:10px; margin-top:14px; line-height:1.8; }
.music-process { display:grid; grid-template-columns:repeat(4,1fr); gap:28px; margin:0; padding:32px 0 0; list-style:none; }
.music-process li { border-top:1px solid #493456; padding-top:22px; }
.music-process span { color:#f472b6; font-size:8px; letter-spacing:1.4px; }
.music-process h3 { font-size:20px; margin-top:12px; }
.music-process p { margin-top:12px; color:var(--muted); font-size:12px; }
@media(max-width:1100px) { .music-direction { padding:27px; } .music-tabs { gap:5px; } .music-tabs button { padding:9px 10px; } }
@media(max-width:760px) { .music-spotlight { margin-bottom:65px; padding-top:45px; } .music-heading h2 { font-size:39px; } .music-showcase { grid-template-columns:1fr; } .music-concept { min-height:0; height:330px; } .music-direction { padding:27px 23px; } .music-process { grid-template-columns:1fr 1fr; gap:25px 20px; } .music-process h3 { font-size:18px; } #music-stage { min-height:200px; } .music-heading>p:last-child { font-size:14px; } }
@media(max-width:420px) { .music-tabs button { padding:10px 9px; font-size:10px; } .music-concept { height:280px; } .concept-caption { font-size:21px; } .concept-heading { font-size:6px; letter-spacing:1px; } }

/* Cinematic lighting and motion */
body { isolation:isolate; }
.ambient-scene { position:fixed; inset:0; overflow:hidden; contain:paint; z-index:-1; pointer-events:none; background:#0b0d15; }
.aurora { position:absolute; width:65vw; height:65vw; min-width:500px; min-height:500px; border-radius:50%; filter:blur(65px); opacity:.24; will-change:transform; }
.aurora-indigo { top:-35%; left:-24%; background:radial-gradient(circle,#6366f1,transparent 63%); animation:aurora-drift 23s ease-in-out infinite alternate; }
.aurora-pink { top:10%; right:-35%; background:radial-gradient(circle,#ec4899,transparent 65%); opacity:.16; animation:aurora-drift 28s ease-in-out -9s infinite alternate-reverse; }
.aurora-violet { bottom:-65%; left:20%; background:radial-gradient(circle,#8b5cf6,transparent 65%); animation:aurora-drift 31s ease-in-out -15s infinite alternate; }
.starfield { position:absolute; inset:0; opacity:.25; background-image:radial-gradient(1px 1px at 18% 21%,#e9d5ff 98%,transparent),radial-gradient(1px 1px at 77% 13%,#fff 98%,transparent),radial-gradient(1px 1px at 65% 67%,#c4b5fd 98%,transparent),radial-gradient(1px 1px at 38% 89%,#fff 98%,transparent); background-size:430px 370px,630px 590px,530px 470px,710px 610px; }
.scroll-progress { position:fixed; top:0; left:0; width:100%; height:2px; z-index:25; background:linear-gradient(90deg,#6366f1,#d946ef,#ec4899); transform:scaleX(var(--page-progress,0)); transform-origin:left; box-shadow:0 0 12px #c084fc; pointer-events:none; }
.header { position:relative; z-index:2; }
.hero { position:relative; }
.hero:before { content:''; position:absolute; width:85%; height:470px; left:8%; bottom:-90px; z-index:-1; background:linear-gradient(#8b5cf616 1px,transparent 1px),linear-gradient(90deg,#8b5cf616 1px,transparent 1px); background-size:52px 52px; transform:perspective(450px) rotateX(62deg); mask-image:radial-gradient(ellipse at center,#000,transparent 68%); pointer-events:none; }
.hero-copy .eyebrow { animation:hero-arrive .8s ease-out both; }
.hero-copy h1 { animation:hero-arrive 1s .12s ease-out both; }
.hero-copy .lead { animation:hero-arrive 1s .25s ease-out both; }
.hero-copy .actions,.hero-copy .fine { animation:hero-arrive 1s .38s ease-out both; }
h1>span,h2>em { background-size:200% 100%; animation:spectrum-shift 9s ease-in-out infinite alternate; }
.hero-art { box-shadow:0 0 0 1px #a78bfa14,0 0 65px #8b5cf61c,0 30px 100px #0008; transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .5s ease-out,box-shadow .5s; }
.hero-art>img { animation:image-arrive 1.4s ease-out both; }
.hero-art:hover { box-shadow:0 0 0 1px #c084fc45,0 0 95px #8b5cf635,0 30px 100px #0008; }
.floating-tag { animation:badge-float 5s ease-in-out infinite; box-shadow:0 8px 35px #0005; }
.art-stamp { box-shadow:0 0 24px #a78bfa12; }
.live-dot { animation:beacon 3s ease-in-out infinite; }
.tool-strip { display:block; overflow:hidden; padding:22px 0; background:#10111bdd; }
.strip-track { display:flex; width:max-content; animation:studio-marquee 38s linear infinite; }
.strip-copy { display:flex; flex-shrink:0; align-items:center; gap:32px; padding-right:32px; }
.tool-strip:hover .strip-track { animation-play-state:paused; }
.feature,.plan,.music-showcase,.signup-form { position:relative; transition:border-color .35s,box-shadow .35s; }
.feature:after,.plan:after { content:''; position:absolute; inset:0; border-radius:inherit; pointer-events:none; opacity:0; transition:opacity .4s; background:radial-gradient(400px circle at var(--glow-x,50%) var(--glow-y,0%),#c084fc16,transparent 70%); }
.feature:hover:after,.plan:hover:after { opacity:1; }
.feature:hover,.plan:hover { border-color:#a78bfa80; box-shadow:0 12px 50px #8b5cf614; }
.button { position:relative; overflow:hidden; box-shadow:0 0 25px #8b5cf624; transition:transform .25s,box-shadow .25s,background .25s; }
.button:before { content:''; position:absolute; inset:-40% auto -40% -70%; width:40%; background:linear-gradient(90deg,transparent,#ffffff35,transparent); transform:skewX(-20deg); transition:left .7s; pointer-events:none; }
.button:hover:before { left:140%; }
.button:hover { box-shadow:0 0 35px #ec48994a,0 8px 24px #0005; }
.button.secondary { box-shadow:none; }
.music-spotlight { position:relative; }
.music-spotlight:before { content:''; position:absolute; top:100px; left:-60px; right:-60px; height:600px; background:radial-gradient(ellipse at 40% 50%,#8b5cf621,transparent 65%); pointer-events:none; z-index:-1; }
.music-showcase { box-shadow:0 0 0 1px #a78bfa12,0 0 90px #8b5cf618; }
.music-concept { isolation:isolate; }
.music-concept>img { object-position:center; animation:cinema-breathe 18s ease-in-out infinite alternate; }
.concept-heading,.concept-caption { text-shadow:0 2px 14px #000; }
.cinema-reticle { position:absolute; z-index:1; inset:16px; pointer-events:none; opacity:.5; background:linear-gradient(#d8b4fe,#d8b4fe) top left/22px 1px no-repeat,linear-gradient(#d8b4fe,#d8b4fe) top left/1px 22px no-repeat,linear-gradient(#d8b4fe,#d8b4fe) bottom right/22px 1px no-repeat,linear-gradient(#d8b4fe,#d8b4fe) bottom right/1px 22px no-repeat; }
.cinema-equalizer { display:flex; align-items:center; gap:4px; position:absolute; z-index:2; right:27px; bottom:58px; height:35px; }
.cinema-equalizer i { width:3px; height:25px; border-radius:2px; background:linear-gradient(#f9a8d4,#a78bfa); transform-origin:center; animation:equalizer 1.3s ease-in-out infinite alternate; }
.cinema-equalizer i:nth-child(2n) { animation-delay:-.5s; height:16px; }
.cinema-equalizer i:nth-child(3n) { animation-delay:-.9s; height:32px; }
.cinema-equalizer i:nth-child(5n) { animation-delay:-.2s; height:10px; }
.timeline i { transform-origin:center; animation:equalizer 1.5s ease-in-out infinite alternate; }
.timeline i:nth-child(2n) { animation-delay:-.6s; }
.timeline i:nth-child(3n) { animation-delay:-1.1s; }
.music-stage-enter { animation:stage-enter .45s ease-out both; }
.motion-ready .reveal { opacity:0; transform:translateY(28px); transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.2,1); transition-delay:var(--reveal-delay,0ms); }
.motion-ready .reveal.is-visible { opacity:1; transform:translateY(0); }
@keyframes aurora-drift { from { transform:translate3d(0,0,0) scale(1); } to { transform:translate3d(8vw,10vh,0) scale(1.18); } }
@keyframes spectrum-shift { from { background-position:0 50%; } to { background-position:100% 50%; } }
@keyframes hero-arrive { from { opacity:0; transform:translateY(20px); } to { opacity:1; transform:translateY(0); } }
@keyframes image-arrive { from { opacity:0; transform:scale(1.05); } to { opacity:1; transform:scale(1); } }
@keyframes badge-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@keyframes beacon { 0%,100% { box-shadow:0 0 0 0 #ec489944; } 50% { box-shadow:0 0 0 5px #ec489900,0 0 15px #ec489966; } }
@keyframes studio-marquee { to { transform:translateX(-50%); } }
@keyframes cinema-breathe { from { transform:scale(1.01); } to { transform:scale(1.065); } }
@keyframes equalizer { from { transform:scaleY(.35); opacity:.65; } to { transform:scaleY(1); opacity:1; } }
@keyframes stage-enter { from { opacity:.4; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
@media(max-width:760px) { .aurora { filter:blur(40px); opacity:.16; } .strip-copy { gap:22px; padding-right:22px; } .music-spotlight:before { left:0; right:0; } .hero:before { width:100%; left:0; } .hero-art { transform:none; } }
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
  .motion-ready .reveal { opacity:1; transform:none; }
  .strip-track { width:auto; }
  .strip-copy { flex-wrap:wrap; justify-content:center; padding:0 16px; gap:20px; }
  .strip-copy[aria-hidden=true] { display:none; }
  .hero-art { transform:none; }
  .scroll-progress { display:none; }
  .aurora { will-change:auto; }
}
@media(max-width:760px) { .hero:before { transform:none; height:200px; bottom:0; opacity:.45; } }
@media(prefers-reduced-motion:reduce) { .strip-copy { width:100%; min-width:0; flex-shrink:1; } }
.provider-strip { display:flex; align-items:center; justify-content:space-between; gap:35px; padding:0 0 40px; }
.provider-copy { max-width:540px; }
.provider-copy .eyebrow { margin-bottom:10px; font-size:8px; letter-spacing:1.5px; }
.provider-copy h2 { font-size:24px; letter-spacing:-.7px; line-height:1.35; }
.provider-copy>p:last-child { margin-top:10px; color:var(--muted); font-size:11px; max-width:450px; }
.provider-logos { display:flex; gap:14px; align-items:center; }
.provider-logo { display:flex; align-items:center; justify-content:center; gap:10px; min-height:78px; padding:20px 22px; border:1px solid #49405f; border-radius:8px; background:linear-gradient(130deg,#211b30c9,#151720e0); transition:border-color .3s,box-shadow .3s; }
.provider-logo:hover { border-color:#a78bfa; box-shadow:0 0 30px #8b5cf626; }
.higgsfield-lockup>span:not(.provider-arrow) { font-family:var(--display); font-size:21px; font-weight:600; letter-spacing:-.5px; }
.higgsfield-lockup img { width:30px; height:30px; object-fit:contain; }
.wavespeed-lockup img { width:156px; height:auto; object-fit:contain; }
.provider-arrow { font-size:12px; margin-left:9px; color:#b9acc9; }
@media(max-width:1100px) { .provider-strip { gap:25px; } .provider-logos { gap:10px; } .provider-logo { padding:17px 16px; } .provider-copy h2 { font-size:21px; } .wavespeed-lockup img { width:135px; } .higgsfield-lockup>span:not(.provider-arrow) { font-size:19px; } }
@media(max-width:760px) { .provider-strip { flex-direction:column; align-items:start; gap:23px; padding-bottom:35px; } .provider-logos { width:100%; gap:10px; } .provider-logo { flex:1; min-width:0; min-height:67px; padding:14px 12px; gap:7px; } .higgsfield-lockup img { width:25px; height:25px; } .higgsfield-lockup>span:not(.provider-arrow) { font-size:17px; } .wavespeed-lockup img { width:130px; max-width:100%; } .provider-arrow { display:none; } }
@media(max-width:360px) { .higgsfield-lockup>span:not(.provider-arrow) { font-size:15px; } .wavespeed-lockup img { width:115px; } }
.era-section { margin-top:95px; }
.era-gallery { display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:repeat(2,290px); gap:16px; }
.era-frame { position:relative; margin:0; overflow:hidden; border:1px solid #514163; border-radius:7px; background:#191622; isolation:isolate; }
.era-lead { grid-row:span 2; }
.era-frame>img { width:100%; height:100%; object-fit:cover; object-position:center 35%; transition:transform 1s cubic-bezier(.2,.7,.2,1); }
.era-frame:hover>img { transform:scale(1.045); }
.era-frame:after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,transparent 32%,#0c0b1540 55%,#0c0b15ec); pointer-events:none; }
.era-frame figcaption { position:absolute; z-index:1; left:20px; right:20px; bottom:23px; text-shadow:0 2px 14px #0007; }
.era-frame figcaption>span { display:block; font-size:8px; letter-spacing:1.4px; color:#e9b5ed; margin-bottom:9px; }
.era-frame figcaption>strong { font:500 19px/1.25 var(--display); letter-spacing:-.4px; display:block; }
.era-lead figcaption { left:28px; bottom:31px; }
.era-lead figcaption>strong { font-size:36px; letter-spacing:-1.1px; max-width:300px; }
.era-frame figcaption>small { display:block; font-size:9px; letter-spacing:1.5px; color:#c4b5fd; margin-top:17px; }
@media(max-width:1100px) { .era-gallery { grid-template-rows:repeat(2,260px); gap:13px; } .era-frame figcaption { left:16px; right:16px; } .era-frame figcaption>strong { font-size:17px; } .era-lead figcaption>strong { font-size:31px; } }
@media(max-width:760px) { .era-section { margin-top:65px; } .era-gallery { grid-template-columns:1fr 1fr; grid-template-rows:380px 240px 240px; gap:13px; } .era-lead { grid-row:auto; grid-column:1/-1; } .era-frame figcaption { bottom:17px; left:15px; right:15px; } .era-frame figcaption>span { font-size:7px; letter-spacing:1px; } .era-frame figcaption>strong { font-size:16px; } .era-lead figcaption>strong { font-size:29px; } .era-frame figcaption>small { font-size:8px; } }
@media(max-width:380px) { .era-gallery { grid-template-rows:340px 230px 230px; } .era-frame figcaption>strong { font-size:14px; } .era-lead figcaption>strong { font-size:27px; } }
.reference-row img { object-position:center 15%; }
.era-frame:not(.era-lead)>img { object-position:center 18%; }
/* Full-bleed artist world behind the header and hero */
.hero-backdrop { position:absolute; z-index:-1; left:0; right:0; top:0; height:925px; overflow:hidden; pointer-events:none; }
.hero-backdrop>img { width:100%; height:100%; object-fit:cover; object-position:70% center; opacity:.65; }
.hero-backdrop:after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#090b15f5 0%,#090b15dd 31%,#090b1590 61%,#090b1566 100%),linear-gradient(0deg,#0b0d15 0%,#0b0d1590 12%,transparent 40%,#0b0d1533 100%); }
.hero-copy .lead { color:#c2c8d7; }
.header { background:linear-gradient(180deg,#090b1560,transparent); }
.artist-carousel { overflow:hidden; border-color:#a78bfa50; background:#14121c; }
.artist-carousel:after { display:none; }
.import-artists { margin-bottom:100px; }
.import-panel { position:relative; display:grid; grid-template-columns:1.05fr 1fr; gap:64px; padding:54px; border:1px solid #a78bfa40; border-radius:8px; background:radial-gradient(ellipse at 90% 20%,#7c3aed20,transparent 65%),linear-gradient(135deg,#191824,#0f111b); overflow:hidden; }
.import-copy h2 { margin-bottom:24px; }
.import-copy h2 em { font-style:normal; color:#c4a2f5; }
.import-copy>p:not(.eyebrow) { color:var(--muted); max-width:470px; }
.import-steps { list-style:none; padding:0; margin:28px 0 30px; display:grid; gap:20px; }
.import-steps li { display:flex; gap:16px; }
.import-steps li>span { color:#c4a2f5; font-family:'Space Grotesk',sans-serif; font-size:12px; padding-top:3px; }
.import-steps h3 { font-size:16px; margin:0 0 6px; }
.import-steps p { font-size:13px; line-height:1.7; color:var(--muted); }
.import-visual { align-self:center; min-width:0; }
.import-visual-heading { display:flex; justify-content:space-between; gap:12px; font-size:9px; letter-spacing:1.3px; color:#c4a2f5; margin-bottom:30px; }
.import-reference-cards { display:flex; justify-content:center; align-items:center; padding:14px 0; }
.import-reference-cards img { width:35%; height:245px; object-fit:cover; object-position:center 25%; border:1px solid #c4a2f550; border-radius:6px; box-shadow:0 12px 30px #0006; }
.import-reference-cards img:first-child { transform:rotate(-8deg); margin-right:-20px; }
.import-reference-cards img:nth-child(2) { position:relative; z-index:1; height:270px; }
.import-reference-cards img:last-child { transform:rotate(8deg); margin-left:-20px; }
.import-connection { display:block; text-align:center; font-size:30px; line-height:1; color:#ba91f0; padding:26px 0 20px; }
.import-destination { display:grid; justify-items:center; gap:12px; padding:24px 12px; border:1px solid #a78bfa40; border-radius:6px; background:#ffffff04; }
.import-destination strong { font-family:'Space Grotesk',sans-serif; font-size:24px; }
.import-destination>span { font-size:9px; letter-spacing:1px; color:#c4a2f5; text-align:center; }
.import-example-note { text-align:center; font-size:10px; color:var(--muted); margin:16px 0 0; }
@media(max-width:1100px) { .import-panel { padding:36px; gap:34px; } .import-reference-cards img { height:210px; } .import-reference-cards img:nth-child(2) { height:235px; } }
@media(max-width:760px) { .import-artists { margin-bottom:64px; } .import-panel { grid-template-columns:1fr; padding:28px 22px; gap:45px; } .import-reference-cards img { height:200px; } .import-reference-cards img:nth-child(2) { height:225px; } .import-visual-heading { font-size:8px; } .import-destination strong { font-size:22px; } }
.carousel-viewport { position:absolute; inset:0; overflow:hidden; }
.artist-slide { position:absolute; inset:0; margin:0; opacity:0; visibility:hidden; transition:opacity .7s ease,visibility .7s; }
.artist-slide.is-active { opacity:1; visibility:visible; }
.artist-slide>img { width:100%; height:100%; object-fit:cover; object-position:center 25%; }
.artist-slide.is-active>img { animation:portrait-drift 7s linear both; }
.carousel-viewport:after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,#0b0a154d,transparent 20%,transparent 48%,#0b0a15b3 76%,#0b0a15ed); }
.carousel-top { position:absolute; z-index:2; top:22px; left:24px; right:24px; display:flex; justify-content:flex-start; gap:20px; font-size:8px; letter-spacing:1.5px; text-shadow:0 2px 10px #000; }
.creator-ribbon { position:absolute; z-index:3; top:55px; right:-72px; width:280px; padding:11px 0; transform:rotate(45deg); background:linear-gradient(100deg,#6955dc,#b943a7); border-block:1px solid #ffffff40; color:#fff; font-family:'Space Grotesk',sans-serif; font-size:11px; font-weight:600; line-height:1.3; letter-spacing:.25px; text-align:center; box-shadow:0 5px 18px #08091250; pointer-events:none; }
@media(max-width:760px) { .creator-ribbon { top:45px; right:-66px; width:250px; padding:10px 0; font-size:10px; } }
.carousel-caption { position:absolute; z-index:2; bottom:93px; left:28px; right:28px; text-shadow:0 2px 14px #0008; }
.carousel-caption .label { font-size:8px; letter-spacing:1.8px; color:#d8b4fe; margin-bottom:10px; }
.carousel-caption h2 { font-size:56px; line-height:1; letter-spacing:-2px; }
.carousel-caption>p { font-size:10px; color:#e9d5ff; letter-spacing:2.2px; margin-top:12px; }
.carousel-controls { position:absolute; z-index:3; bottom:20px; left:24px; right:24px; display:flex; align-items:center; gap:13px; }
.carousel-arrow,.carousel-play { display:grid; place-items:center; background:#151324a8; backdrop-filter:blur(8px); border:1px solid #c4b5fd60; color:#f8fafc; border-radius:50%; width:38px; height:38px; cursor:pointer; font-size:17px; transition:background .2s,border-color .2s; }
.carousel-arrow:hover,.carousel-play:hover { background:#6d28d960; border-color:#e9d5ff; }
.carousel-dots { display:flex; align-items:center; justify-content:center; gap:6px; flex:1; }
.carousel-dot { display:block; width:30px; height:30px; background:transparent; border:0; position:relative; padding:0; cursor:pointer; }
.carousel-dot:after { content:''; display:block; width:6px; height:6px; background:#e9d5ff80; border-radius:5px; margin:auto; transition:width .25s,background .25s; }
.carousel-dot.is-current:after { width:23px; background:#f0abfc; box-shadow:0 0 15px #c084fc70; }
.carousel-play { width:31px; height:31px; font-size:11px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes portrait-drift { from { transform:scale(1); } to { transform:scale(1.035); } }
@media(max-width:1100px) { .carousel-dots { gap:2px; } .carousel-dot { width:24px; } .carousel-controls { gap:9px; } }
@media(max-width:760px) { .hero-backdrop { height:1180px; } .hero-backdrop>img { object-position:73% center; opacity:.45; } .hero-backdrop:after { background:linear-gradient(180deg,#090b15d9 0%,#090b15a6 45%,#0b0d15 100%); } .artist-carousel { height:520px; } .carousel-caption h2 { font-size:49px; } .carousel-top { font-size:7px; } .carousel-dot { width:30px; } }
@media(max-width:420px) { .artist-carousel { height:480px; } .carousel-controls { left:18px; right:18px; gap:8px; } .carousel-dot { width:26px; } .carousel-caption { left:24px; } }
@media(prefers-reduced-motion:reduce) { .artist-slide>img { animation:none; } .artist-slide { transition:none; } }
.hero-backdrop>img { object-fit:cover; object-position:center 35%; }
.carousel-viewport { touch-action:pan-y; }
.carousel-dots { gap:2px; }
.signup-form .tutorial-choice { display:flex; gap:12px; align-items:flex-start; margin:22px 0; font-size:14px; line-height:1.6; font-weight:400; }
.signup-form .tutorial-choice input { width:20px; height:20px; min-width:20px; margin:3px 0 0; accent-color:#a78bfa; }
.tutorial-choice small { display:block; color:#bcb3cc; margin-top:6px; }
.signup-form .confirmation-note { font-size:13px; line-height:1.7; color:#c9c3d6; margin-top:20px; }
.signup-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.signup-status:not(:empty) { padding:14px; border:1px solid #a78bfa55; border-radius:8px; line-height:1.7; }
.signup-form .signup-status.confirmation-required { padding:22px; border:2px solid #fbbf24; background:#fbbf2414; color:#fff8df; box-shadow:0 0 24px #fbbf2414; }
.confirmation-required .confirmation-heading { display:block; font-size:22px; line-height:1.35; color:#fde68a; margin-bottom:14px; }
.confirmation-required span { display:block; margin-top:12px; font-size:15px; }
.confirmation-required .confirmation-instructions { font-weight:700; }
.confirmation-required small { display:block; margin-top:16px; font-size:12px; color:#d4cbbb; }
.carousel-dot { width:26px; flex-shrink:0; }
@media(max-width:1100px) {
  .carousel-controls { display:grid; grid-template-columns:38px 1fr 38px 31px; gap:6px 12px; }
  .carousel-dots { grid-column:1 / -1; grid-row:1; display:grid; grid-template-columns:repeat(11,minmax(0,1fr)); gap:0; }
  .carousel-dot { width:100%; }
  #artist-prev { grid-column:1; grid-row:2; }
  #artist-next { grid-column:3; grid-row:2; }
  #artist-play { grid-column:4; grid-row:2; }
  .carousel-caption { bottom:112px; }
}