:root {
  --ink: #0b0f14;
  --surface: #121922;
  --surface-raised: #18212c;
  --line: #2a3744;
  --muted: #9ca6b2;
  --paper: #f4f7f7;
  --teal: #2dd4bf;
  --teal-deep: #0fae9b;
  --max: 1160px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: var(--ink); color: var(--paper); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height: 1.55; }
a { color: inherit; text-underline-offset: .18em; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--teal); outline-offset: 4px; border-radius: 2px; }
.skip-link { position: fixed; z-index: 20; top: 12px; left: 12px; transform: translateY(-150%); background: var(--teal); color: var(--ink); padding: 10px 14px; font-weight: 800; text-decoration: none; }
.skip-link:focus { transform: translateY(0); }
.container { width: min(calc(100% - 48px), var(--max)); margin-inline: auto; }
.site-header { position: relative; z-index: 10; border-bottom: 1px solid rgba(156,166,178,.14); }
.header-row { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.wordmark-link { display: inline-block; color: var(--paper); text-decoration: none; }
.wordmark { color: var(--paper); font-size: 28px; font-weight: 800; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; }
.wordmark .accent { color: var(--teal); }
.desktop-nav { display: flex; align-items: center; gap: 26px; font-size: .91rem; }.desktop-nav a { color: #c6ced5; text-decoration: none; }.desktop-nav a:hover { color: var(--teal); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; padding: 11px 18px; border: 1px solid var(--teal); background: var(--teal); color: var(--ink) !important; font-size: .88rem; font-weight: 800; text-decoration: none; transition: transform .2s, background .2s; }.button:hover { background: #74e6d7; transform: translateY(-2px); }
.mobile-menu { display: none; }.mobile-menu summary { cursor: pointer; list-style: none; color: var(--paper); font-weight: 750; }.mobile-menu summary::-webkit-details-marker { display: none; }.mobile-menu nav { position: absolute; top: 82px; left: 0; width: 100%; padding: 18px 24px 24px; border-bottom: 1px solid var(--line); background: #101720; }.mobile-menu nav a { display: block; padding: 12px 0; text-decoration: none; font-weight: 700; }.mobile-menu nav .button { margin-top: 8px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 17px; color: var(--teal); font-size: .7rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }.eyebrow::before { content: ""; width: 18px; height: 1px; background: var(--teal); }
h1,h2,h3,p { margin-top: 0; }h1,h2,h3 { font-family: Georgia,"Times New Roman",serif; letter-spacing: -.055em; line-height: .98; }h1 { max-width: 760px; margin-bottom: 25px; font-size: clamp(3.5rem,8vw,7rem); }h2 { font-size: clamp(2.2rem,5vw,4.15rem); }h3 { font-size: 1.65rem; }
.hero { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: clamp(42px,7vw,100px); min-height: 610px; padding: 82px 0 96px; overflow: hidden; }.hero h1 span { color: var(--teal); }.lede { max-width: 490px; color: #d8e1e2; font-size: 1.22rem; }.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 23px; margin-top: 30px; }.inline-link { color: var(--teal); font-size: .9rem; font-weight: 800; text-decoration: none; }.inline-link:hover { text-decoration: underline; }.pilot-note { display: flex; align-items: center; gap: 9px; margin-top: 36px; color: var(--muted); font-size: .78rem; }.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 5px rgba(45,212,191,.12); }
.hero-art { position: relative; min-height: 420px; }.hero-art::before { content: ""; position: absolute; inset: 28px 8px 0 52px; border: 1px solid rgba(45,212,191,.28); border-radius: 50%; transform: rotate(-24deg); }.gig-card { position: absolute; z-index: 2; top: 50px; right: 0; width: min(100%,395px); padding: 26px; background: var(--surface-raised); border: 1px solid rgba(156,166,178,.22); box-shadow: -20px 26px 0 rgba(45,212,191,.1); }.gig-card::after { content: ""; position: absolute; inset: 11px; border: 1px solid rgba(45,212,191,.18); pointer-events: none; }.gig-card > * { position: relative; z-index: 1; }.card-label { color: var(--teal); font-size: .68rem; font-weight: 850; letter-spacing: .15em; }.gig-card h2 { margin: 29px 0 40px; font-size: clamp(2.4rem,5vw,3.65rem); }.event-row { display: flex; align-items: center; gap: 12px; padding-top: 14px; border-top: 1px solid var(--line); color: #dce3e5; font-size: .92rem; }.event-row strong { display:block; }.event-row small { display:block; color:var(--muted); }.event-date { padding: 5px 8px; background:var(--teal); color:var(--ink); font-weight:900; text-align:center; line-height:1; }.event-date span { display:block; margin-top:3px; font-size:.6rem; letter-spacing:.08em; }.rehearsal-chip { position:absolute; z-index:3; bottom:5px; left:0; display:flex; gap:12px; align-items:center; padding:14px 17px; background:#e4f1ec; color:var(--ink); box-shadow:14px 14px 0 rgba(0,0,0,.22); font-size:.78rem; }.rehearsal-chip strong { display:block; }.rehearsal-chip small { color:#52615e; }
.band-strip { border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:#bfd3d2; overflow:hidden; }.band-strip div { display:flex; justify-content:space-between; gap:20px; padding:17px 0; font-size:.78rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.band-strip b { color:var(--teal); }
.section { padding:118px 0; }.section--paper { background:var(--paper); color:var(--ink); }.section-intro { display:flex; justify-content:space-between; align-items:end; gap:36px; margin-bottom:52px; }.section-intro h2 { max-width:690px; margin-bottom:0; }.section-intro > p { max-width:290px; margin-bottom:0; color:#52615e; }.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid #cad4d2; border-left:1px solid #cad4d2; }.feature { min-height:242px; padding:25px; border-right:1px solid #cad4d2; border-bottom:1px solid #cad4d2; }.feature-number { display:block; color:var(--teal-deep); font-size:.71rem; font-weight:850; letter-spacing:.12em; }.feature h3 { margin:53px 0 12px; font-size:1.8rem; }.feature p { margin-bottom:0; color:#50605e; font-size:.92rem; }.section-link { display:inline-block; margin-top:30px; }
.process { padding:118px 0; }.process-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(38px,10vw,130px); }.process-sticky h2 { margin-bottom:20px; }.process-sticky p:not(.eyebrow) { max-width:330px; color:var(--muted); }.steps { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }.steps li { display:grid; grid-template-columns:60px 1fr; gap:18px; padding:27px 0; border-bottom:1px solid var(--line); }.step-num { color:var(--teal); font-size:.72rem; font-weight:850; }.steps h3 { margin:0 0 10px; }.steps p { max-width:430px; margin:0; color:var(--muted); font-size:.93rem; }
.callout { padding-bottom:118px; }.callout-box { display:flex; align-items:end; justify-content:space-between; gap:45px; padding:54px; background:var(--teal); color:var(--ink); }.callout h2 { max-width:600px; margin-bottom:0; }.callout p { max-width:420px; margin:0 0 15px; font-size:.86rem; }.callout .button { border-color:var(--ink); background:var(--ink); color:var(--paper) !important; }.callout .button:hover { background:#26333a; }
.page-hero { padding:92px 0 76px; border-bottom:1px solid var(--line); }.page-hero h1 { max-width:790px; margin-bottom:18px; font-size:clamp(3.4rem,7vw,6.3rem); }.page-hero > p:not(.eyebrow) { max-width:590px; color:#c5d0d1; font-size:1.08rem; }.feature-page { padding-top:76px; }.feature-page .feature { background:var(--surface); border-color:var(--line); }.feature-page .feature h3 { margin-top:38px; color:var(--paper); }.feature-page .feature p { color:var(--muted); }.feature-page .feature:nth-child(2n) { background:#151f29; }.statement { padding:104px 0 118px; }.statement h2 { max-width:820px; }.statement p { max-width:570px; color:var(--muted); }
.how-list { padding:44px 0 112px; }.how-item { display:grid; grid-template-columns:100px 1.2fr .8fr; gap:28px; padding:39px 0; border-bottom:1px solid var(--line); }.how-item:first-child { border-top:1px solid var(--line); }.how-number { color:var(--teal); font-size:1rem; font-weight:900; }.how-item h2 { margin:0 0 14px; font-size:clamp(2rem,4vw,3.2rem); }.how-item p { max-width:520px; margin:0; color:var(--muted); }.tags { display:flex; align-self:start; flex-wrap:wrap; gap:8px; }.tags span { padding:6px 9px; border:1px solid var(--line); color:#b9c7c7; font-size:.72rem; }
.plans { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; padding:68px 0 20px; }.plan { min-height:340px; padding:35px; border:1px solid var(--line); background:var(--surface); }.plan--pro { border-color:var(--teal); background:linear-gradient(145deg,#132a2b,#17252d 70%); }.plan-label { color:var(--teal); font-size:.68rem; font-weight:900; letter-spacing:.14em; }.plan h2 { margin:30px 0 14px; font-size:3.5rem; }.plan p { max-width:330px; color:#c2d0ce; }.plan-status { display:inline-block; margin-top:47px; padding:7px 9px; border:1px solid currentColor; color:var(--teal); font-size:.7rem; font-weight:800; letter-spacing:.09em; }.pricing-note { padding:18px 0 100px; color:var(--muted); font-size:.86rem; }
.faq-list { padding:50px 0 96px; }.faq { border-top:1px solid var(--line); }.faq:last-child { border-bottom:1px solid var(--line); }.faq summary { display:grid; grid-template-columns:50px 1fr 24px; gap:18px; padding:24px 0; cursor:pointer; font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.3rem,2.5vw,1.75rem); letter-spacing:-.035em; list-style:none; }.faq summary::-webkit-details-marker { display:none; }.faq summary::after { content:"+"; color:var(--teal); font-family:Inter,sans-serif; font-size:1.4rem; text-align:right; }.faq[open] summary::after { content:"−"; }.faq-index { color:var(--teal); font-family:Inter,sans-serif; font-size:.7rem; font-weight:850; letter-spacing:.1em; }.faq p { max-width:660px; margin:-5px 42px 26px 68px; color:var(--muted); }
.support-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; padding:65px 0 106px; }.support-card { min-height:295px; padding:32px; background:var(--surface); border:1px solid var(--line); }.support-card h2 { margin:34px 0 14px; font-size:2rem; }.support-card p { max-width:450px; color:var(--muted); }.support-card .inline-link { display:inline-block; margin-top:18px; }.support-note { display:grid; grid-template-columns:1fr 1fr; gap:70px; padding-bottom:114px; }.support-note h2 { margin-bottom:0; }.support-note p { color:var(--muted); }.support-note strong { color:var(--paper); }
.legal { padding:70px 0 110px; }.legal-layout { max-width:790px; }.legal h1 { font-size:clamp(3.1rem,6vw,5rem); }.updated { color:var(--teal); font-size:.76rem; font-weight:750; }.legal .lead { margin:40px 0 44px; padding:26px; border-left:2px solid var(--teal); background:var(--surface); color:#d1dcda; }.legal h2 { margin:48px 0 15px; font-size:2rem; }.legal p,.legal li { color:#c0cccb; }.legal li { margin:8px 0; }.legal a { color:var(--teal); }
.coming-soon { scroll-margin-top:25px; }.coming-soon .callout-box { align-items:center; }.coming-soon h2 { font-size:clamp(2.4rem,5vw,4rem); }.coming-soon .status { color:#254340; font-size:.72rem; font-weight:850; letter-spacing:.12em; }
.site-footer { border-top:1px solid var(--line); padding:48px 0 30px; }.footer-top { display:flex; justify-content:space-between; gap:40px; }.footer-top > div p { color:var(--muted); font-size:.85rem; }.footer-nav { display:grid; grid-template-columns:repeat(3,auto); gap:10px 28px; }.footer-nav a { color:#c5d0d1; font-size:.82rem; text-decoration:none; }.footer-nav a:hover { color:var(--teal); }.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:48px; padding-top:20px; border-top:1px solid var(--line); color:#6d7b84; font-size:.72rem; }.footer-bottom span:last-child { display:flex; gap:16px; }.footer-bottom a { color:inherit; }
@media (max-width:780px) { .container { width:min(calc(100% - 36px),var(--max)); }.desktop-nav { display:none; }.mobile-menu { display:block; }.hero { grid-template-columns:1fr; padding:65px 0 70px; }.hero-art { min-height:350px; }.band-strip div { justify-content:center; flex-wrap:wrap; }.section,.process { padding:78px 0; }.section-intro,.process-grid,.support-note { display:block; }.section-intro > p { margin-top:20px; }.feature-grid { grid-template-columns:1fr; }.feature { min-height:0; }.feature h3 { margin-top:30px; }.callout { padding-bottom:78px; }.callout-box { display:block; padding:34px 27px; }.callout-box .button { margin-top:24px; }.how-item { grid-template-columns:50px 1fr; }.how-item .tags { grid-column:2; }.plans,.support-grid { grid-template-columns:1fr; }.page-hero { padding:67px 0 58px; }.footer-top,.footer-bottom { display:block; }.footer-nav { margin-top:35px; }.footer-bottom span:last-child { margin-top:14px; }.legal { padding-top:55px; } }
@media (max-width:460px) { h1 { font-size:3.45rem; }.hero-art { min-height:322px; }.gig-card { top:35px; padding:20px; }.gig-card h2 { margin:23px 0 29px; }.rehearsal-chip { font-size:.68rem; }.faq summary { grid-template-columns:32px 1fr 20px; }.faq p { margin-left:32px; }.footer-nav { grid-template-columns:repeat(2,auto); }.callout-box { padding:29px 22px; } }
.legal .card { margin:40px 0 44px; padding:26px; border-left:2px solid var(--teal); background:var(--surface); }
.legal .card p { margin-bottom:0; color:#d1dcda; }
.legal ul { padding-left:22px; }
@media (min-width:1000px) {
  .hero { grid-template-columns:minmax(0,1.22fr) minmax(420px,.78fr); gap:clamp(42px,5vw,72px); min-height:560px; padding:62px 0 70px; }
  .hero h1 { max-width:720px; font-size:clamp(5.4rem,6.6vw,7.2rem); }
  .hero-art { min-height:500px; }
  .hero-art::before { inset:13px -5px 0 18px; }
  .gig-card { top:24px; width:min(100%,445px); padding:32px; box-shadow:-24px 30px 0 rgba(45,212,191,.13); }
  .gig-card h2 { margin:36px 0 48px; }
  .rehearsal-chip { bottom:24px; left:-25px; padding:16px 19px; }
}

/* Product-screen presentation: responsive crops keep the supplied demo imagery legible. */
.hero-screen { position:relative; width:min(100%,390px); margin:0 0 0 auto; }
.hero-screen::before,.screen-stage::before { content:""; position:absolute; z-index:-1; width:74%; height:74%; border-radius:50%; background:rgba(45,212,191,.16); filter:blur(42px); }
.hero-screen::before { right:-5%; bottom:3%; }
.device-frame { position:relative; aspect-ratio:9 / 19.5; overflow:hidden; border:1px solid rgba(167,191,198,.28); border-radius:24px; background:#0b1016; box-shadow:0 18px 44px rgba(0,0,0,.35), 0 0 0 1px rgba(45,212,191,.08); }
.device-frame::after { content:""; position:absolute; inset:6px; border:1px solid rgba(255,255,255,.07); border-radius:18px; pointer-events:none; }
.device-frame picture,.device-frame img { display:block; width:100%; height:auto; }
.hero-screen figcaption { margin:13px 0 0 10px; color:#aebcbc; font-size:.74rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.feature-showcases { padding:18px 0 118px; overflow:hidden; }
.showcases-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.55fr); align-items:end; gap:30px; padding:0 0 46px; }
.showcases-intro h2 { margin-bottom:0; }
.showcases-intro > p:last-child { max-width:310px; margin:0; color:var(--muted); }
.feature-showcase { display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,390px); align-items:center; gap:clamp(42px,9vw,140px); min-height:570px; padding:62px 8%; border-top:1px solid var(--line); }
.feature-showcase--reverse { grid-template-columns:minmax(250px,390px) minmax(0,1fr); background:linear-gradient(90deg,rgba(24,33,44,.54),rgba(24,33,44,0)); }
.feature-showcase--reverse .showcase-copy { grid-column:2; grid-row:1; }
.feature-showcase--reverse .screen-stage { grid-column:1; grid-row:1; }
.showcase-copy { max-width:445px; }
.showcase-copy h3 { margin:0 0 17px; color:var(--paper); font-size:clamp(2.35rem,4.5vw,4rem); }
.showcase-copy > p:last-child { margin-bottom:0; color:var(--muted); font-size:1.02rem; }
.screen-stage { position:relative; justify-self:center; width:min(100%,306px); margin:0; }
.screen-stage::before { right:-18%; bottom:4%; }
@media (min-width:1000px) { .hero { grid-template-columns:minmax(0,1.14fr) minmax(420px,.86fr); gap:clamp(38px,4.5vw,64px); }.hero-screen { width:min(100%,430px); margin-right:8px; }.feature-showcase { padding-inline:10%; }.screen-stage { width:min(100%,320px); } }
@media (max-width:780px) { .hero-screen { width:min(100%,300px); margin:14px auto 0; }.feature-showcases { padding:0 0 78px; }.showcases-intro { display:block; padding-bottom:30px; }.showcases-intro > p:last-child { margin-top:17px; }.feature-showcase,.feature-showcase--reverse { display:flex; flex-direction:column; align-items:flex-start; gap:35px; min-height:0; padding:55px 0; background:none; }.feature-showcase--reverse .showcase-copy,.feature-showcase--reverse .screen-stage { display:block; }.screen-stage { align-self:center; width:min(100%,270px); } }
@media (max-width:780px) { .header-row,.hero,.hero > div,.hero-screen { min-width:0; }.hero .lede { max-width:100%; }.hero h1 { max-width:100%; } }
