/* Boothby SoundLab 8.2: real interface, fluid desktop and phone layout */
:root{--sl-bg:#050817;--sl-panel:#0c1428;--sl-panel2:#101b32;--sl-ink:#f5f8ff;--sl-muted:#b3c7e1;--sl-cyan:#20e7f7;--sl-violet:#a263ff;--sl-line:rgba(114,175,234,.28)}
html{scroll-behavior:smooth}body{background:#050817;color:var(--sl-ink)}
#tools-wrapper{min-height:100dvh;background:radial-gradient(ellipse at 11% 7%,#12316380,transparent 36%),radial-gradient(ellipse at 85% 45%,#37135465,transparent 35%);isolation:isolate}
#promoter-header{display:flex!important;position:sticky!important;top:0;z-index:250!important;align-items:center;gap:20px;justify-content:space-between;padding:12px clamp(15px,2vw,32px)!important;min-height:73px;background:rgba(5,10,22,.93)!important;border-bottom:1px solid #48a8d94a!important;backdrop-filter:blur(24px)}
#promoter-header .header-title-box{display:flex;align-items:center;min-width:0;gap:10px}
#promoter-header .header-text h1{color:#fff!important;font-size:clamp(15px,1.55vw,22px)!important;letter-spacing:-.035em!important;white-space:nowrap}
#promoter-header .header-text p{color:#99c8eb!important;font-size:11px!important;letter-spacing:.12em!important}
#promoter-header .header-badge{display:none!important}
.sl-top-nav{display:flex;align-items:center;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.sl-top-nav a,.sl-top-nav button{font:600 12px/1.2 system-ui,sans-serif;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;text-decoration:none;color:#e2efff;background:transparent;border:1px solid transparent;padding:10px 13px;border-radius:12px;white-space:nowrap}
.sl-top-nav a:hover,.sl-top-nav button:hover,.sl-top-nav :focus-visible{background:#142646;color:#fff;border-color:#40c8f281;outline:none}
.sl-top-nav .sl-active{background:linear-gradient(125deg,#10506e88,#4d206d88);border-color:#7c53dd88;box-shadow:0 0 20px #7b3aff45;color:white}
#desktop-area{max-width:1600px;margin:auto!important;padding:0 clamp(12px,3.6vw,58px) 115px!important;min-height:0!important}
.sl-home{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(225px,.83fr) minmax(0,1.17fr);min-height:370px;max-height:610px;border:1px solid #3f7bb268;background:linear-gradient(130deg,#0a1b35,#0d102b 62%,#2b1242);border-radius:22px;margin:23px 0 23px;box-shadow:0 16px 70px #0008}
.sl-home:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 28% 42%,#00d8ff29,transparent 34%),radial-gradient(ellipse at 83% 42%,#b53bff26,transparent 48%);z-index:-1}
.sl-portrait{position:relative;overflow:hidden;align-self:stretch;min-height:340px}
.sl-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 24%;filter:contrast(1.08) saturate(.86)}
.sl-portrait:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 65%,#0c102ee3),linear-gradient(0deg,#090e24bb,transparent 42%),linear-gradient(145deg,#00bfff22,#9b42ea14)}
.sl-hero-copy{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:clamp(22px,4.5vw,70px);gap:13px;min-width:0}
.sl-kicker{color:#7deeff;font:800 10px/1.4 system-ui,sans-serif;letter-spacing:.35em;text-transform:uppercase}
.sl-home h2{font-family:Impact,'Arial Narrow',system-ui,sans-serif;font-weight:900;font-size:clamp(44px,6.1vw,90px);letter-spacing:-.035em;line-height:.97;margin:0;text-transform:uppercase;color:#f5faff;text-shadow:0 7px 30px #0009}
.sl-home h2 span{display:block;background:linear-gradient(100deg,#68f2ff 2%,#dd66ff 85%);background-clip:text;-webkit-background-clip:text;color:transparent}
.sl-home p{color:#dae5f5;max-width:52ch;font:400 clamp(13px,1.35vw,17px)/1.65 system-ui,sans-serif;margin:0}
.sl-cta{display:flex;flex-wrap:wrap;align-items:center;gap:11px;margin-top:12px}
.sl-cta a,.sl-cta button{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:white;font:800 13px system-ui,sans-serif;border:1px solid #79b5ec86;background:#172340aa;padding:13px 22px;border-radius:999px;cursor:pointer}
.sl-cta .sl-primary{color:#021420;background:linear-gradient(125deg,#3cf6ff,#5ab5fa);border:0;box-shadow:0 0 24px #21e6ff55}
.sl-cta a:hover,.sl-cta button:hover{transform:translateY(-2px);filter:brightness(1.15)}
.sl-feature-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 24px}
.sl-feature{display:flex;flex-direction:column;justify-content:center;gap:5px;min-height:94px;padding:16px 17px;border:1px solid #5789b651;background:linear-gradient(140deg,#0c1c34ee,#0c1128df);border-radius:15px;color:#cde1f3;text-decoration:none;transition:transform .2s,border-color .2s}
.sl-feature:hover{transform:translateY(-3px);border-color:#4eddf6}
.sl-feature b{font:750 14px system-ui;color:#fff}.sl-feature small{font:400 11px/1.5 system-ui;color:#a2bed8}
.sl-section-heading{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:10px 0 15px}
.sl-section-heading h2{font:850 clamp(19px,2vw,28px)/1.25 system-ui,sans-serif;margin:0;color:#fff}
.sl-section-heading p{font:400 12px system-ui;color:#aac8dd;margin:6px 0 0}
#desktop-area .app-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(125px,1fr))!important;gap:14px!important;padding:0!important;align-items:stretch!important}
#desktop-area .app-icon{min-width:0!important;min-height:122px!important;padding:16px 10px!important;display:flex!important;align-items:center;justify-content:center;flex-direction:column!important;gap:8px!important;background:linear-gradient(145deg,#101c35ee,#10152ae0)!important;border:1px solid #53749b64!important;border-radius:16px!important;box-shadow:0 7px 18px #0004!important;transition:transform .18s ease,border-color .18s ease!important}
#desktop-area .app-icon:hover{transform:translateY(-4px)!important;background:linear-gradient(145deg,#17365ae8,#221544e8)!important;border-color:#57e9ff!important}
#desktop-area .app-icon-label{color:#f2f7ff!important;line-height:1.3;text-align:center!important;font-weight:700!important;font-size:12px!important;white-space:normal}
#desktop-area .app-icon-img,#desktop-area .app-icon-graphic{font-size:29px!important;filter:drop-shadow(0 0 9px #48cfff44)}
.tools-window{border:1px solid #6199bd88!important;background:#091327fa!important;box-shadow:0 24px 75px #000c,0 0 35px #23c8eb12!important;backdrop-filter:blur(17px)}
.tools-window .window-header{background:linear-gradient(105deg,#122949,#1d1643)!important;border-bottom:1px solid #60a8ce65!important}
#start-menu{background:#081326fa!important;backdrop-filter:blur(22px);border:1px solid #5296c67a!important;box-shadow:0 20px 80px #000a!important;border-radius:17px!important}
@media(max-width:900px){.sl-top-nav{gap:0}.sl-top-nav a,.sl-top-nav button{font-size:11px;padding:9px}.sl-home{grid-template-columns:40% 60%;min-height:350px}.sl-home h2{font-size:clamp(35px,5.5vw,68px)}.sl-feature-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){#promoter-header{position:sticky!important;flex-wrap:wrap!important;gap:7px;padding:9px 12px!important}.sl-top-nav{display:grid;grid-template-columns:repeat(5,1fr);width:100%;gap:2px}.sl-top-nav a,.sl-top-nav button{font-size:10px;padding:10px 2px;white-space:normal}.sl-top-nav .sl-text-extra{display:none}.sl-home{grid-template-columns:1fr;max-height:none;margin:12px 0 13px;border-radius:15px}.sl-portrait{height:240px;min-height:0}.sl-portrait img{object-position:center 25%}.sl-portrait:after{background:linear-gradient(0deg,#101430 0%,transparent 70%)}.sl-hero-copy{padding:18px 20px 24px;gap:10px}.sl-home h2{font-size:clamp(44px,11.1vw,70px)}.sl-home p{font-size:13px}.sl-cta{width:100%}.sl-cta>*{flex:1}.sl-feature-row{gap:7px}.sl-feature{min-height:78px;padding:12px}.sl-feature b{font-size:12px}#desktop-area .app-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:9px!important}#desktop-area .app-icon{min-height:103px!important;padding:11px 4px!important}#desktop-area .app-icon-label{font-size:11px!important}.sl-section-heading{margin-top:20px}}
@media(max-width:370px){#desktop-area .app-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(prefers-reduced-motion:reduce){.sl-feature,#desktop-area .app-icon,.sl-cta a{transition:none!important;transform:none!important}}

/* SoundLab 8.5 image-led site hero: single readable composition across breakpoints */
.sl-home.sl-home-art{display:block!important;min-height:0!important;max-height:none!important;overflow:hidden;border:1px solid #4bc8ec66;background:#060b1d;margin:18px 0 20px;box-shadow:0 20px 70px #000a,0 0 50px #4721911a;isolation:isolate}
.sl-home-art:before{display:none!important}
.sl-hero-picture{display:block;line-height:0;background:#050b1c}
.sl-hero-picture img{display:block;width:100%;height:auto;max-height:550px;object-fit:contain;object-position:center}
.sl-hero-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:18px clamp(16px,3vw,36px);background:linear-gradient(110deg,#08142bf5,#10132df5 75%,#1b0e2af5)}
.sl-hero-footer p{font-size:clamp(12px,1.15vw,16px);line-height:1.55;color:#e0effe;max-width:64ch;margin:0}
.sl-hero-footer .sl-cta{margin:0;flex-shrink:0}
.sl-visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:690px){.sl-hero-footer{flex-direction:column;align-items:stretch;gap:12px;padding:14px 15px 17px}.sl-hero-picture img{max-height:none}.sl-hero-footer .sl-cta{display:grid;grid-template-columns:1fr 1fr;gap:8px}.sl-hero-footer .sl-cta>*{padding:11px 6px;font-size:12px}}

/* Approved artist portrait loaded on the homepage in place of earlier photography. */
.sl-hero-picture img{display:block;width:100%;height:auto;object-fit:contain}

/* v13.0 corrected approved image fitting: no squashing, zoom or truncated photo */
.sl-home.sl-home-art{display:flex!important;flex-direction:column;max-width:100%;height:auto;max-height:none!important;min-height:0!important}
.sl-home-art .sl-hero-picture{display:block;width:100%;aspect-ratio:1672/941;background:#030819;overflow:hidden;flex:none}
.sl-home-art .sl-hero-picture img{display:block!important;width:100%!important;height:100%!important;max-height:none!important;aspect-ratio:1672/941!important;object-fit:contain!important;object-position:50% 50%!important}
.sl-home-art .sl-hero-footer{flex:0 0 auto}
@media(max-width:690px){.sl-home-art .sl-hero-picture{aspect-ratio:1672/941}.sl-home-art .sl-hero-picture img{max-height:none!important}}


/* v13.0 homepage hero fitting: responsive image with natural intrinsic ratio. */
#desktop-area .sl-home.sl-home-art {
  display:flex!important;
  flex-direction:column!important;
  width:100%!important;
  max-width:100%!important;
  min-height:0!important;
  max-height:none!important;
  height:auto!important;
  overflow:hidden!important;
  box-sizing:border-box;
}
#desktop-area .sl-home-art .sl-hero-picture {
  display:block!important;
  flex:0 0 auto!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
  line-height:0;
  background:#030819;
}
#desktop-area .sl-home-art .sl-hero-picture img {
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  max-height:none!important;
  min-height:0!important;
  aspect-ratio:auto!important;
  object-fit:contain!important;
  object-position:center center!important;
  position:static!important;
  transform:none!important;
  margin:0!important;
}
#desktop-area .sl-home-art .sl-hero-footer {
  box-sizing:border-box;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:clamp(10px,2vw,22px);
  min-width:0;
  padding:clamp(14px,2.2vw,26px);
}
#desktop-area .sl-home-art .sl-hero-footer p {
  flex:1 1 300px;
  min-width:0;
  max-width:65ch;
  overflow-wrap:break-word;
}
#desktop-area .sl-home-art .sl-hero-footer .sl-cta {
  margin:0;
  display:flex;
  flex:0 1 auto;
  gap:10px;
}
@media (max-width:720px){
  #desktop-area .sl-home-art .sl-hero-footer {align-items:stretch;flex-direction:column;}
  #desktop-area .sl-home-art .sl-hero-footer .sl-cta {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;}
  #desktop-area .sl-home-art .sl-hero-footer .sl-cta a {min-width:0;text-align:center;padding:12px 8px;}
}
@media (max-width:380px){
  #desktop-area .sl-home-art .sl-hero-footer .sl-cta {grid-template-columns:1fr;}
}

/* v9.3: Prevent oversized mobile hero caption from inheriting a 300px flex-basis. */
@media screen and (max-width: 720px) {
  #desktop-area .sl-home.sl-home-art,
  #desktop-area .sl-home-art .sl-hero-footer {
    min-height: 0 !important;
    height: auto !important;
  }
  #desktop-area .sl-home-art .sl-hero-footer {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    padding: 12px 14px 14px !important;
  }
  #desktop-area .sl-home-art .sl-hero-footer p {
    flex: 0 0 auto !important;
    flex-grow: 0 !important;
    flex-shrink: 0 !important;
    flex-basis: auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
  }
  #desktop-area .sl-home-art .sl-hero-footer .sl-cta {
    flex: 0 0 auto !important;
    margin: 0 !important;
    align-self: stretch !important;
  }
}
