/* Musicrew Home — component layer (mirrors the Musicrew design system components) */

#musicrew-home{background:var(--bg-page);min-width:1120px}
#musicrew-home *,#musicrew-home *::before,#musicrew-home *::after{box-sizing:border-box}
#musicrew-home h1,#musicrew-home h2,#musicrew-home h3,#musicrew-home h4,#musicrew-home p{margin:0}
#musicrew-home a{text-decoration:none;color:var(--text-link)}
#musicrew-home a:hover{color:var(--text-link-hover)}
#musicrew-home img{display:block;max-width:100%}
#musicrew-home button{font:inherit}

.mc-container{max-width:var(--page-max);margin:0 auto;padding:0 var(--page-pad)}

/* ---- Button ---- */
.mc-btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:var(--weight-bold);letter-spacing:.01em;border-radius:var(--radius-control);cursor:pointer;transition:var(--transition-control);white-space:nowrap;text-decoration:none!important;box-sizing:border-box}
.mc-btn svg{display:block;flex:0 0 auto}
.mc-btn--sm{height:var(--control-h-sm);padding:0 16px;font-size:var(--text-sm);gap:var(--space-2)}
.mc-btn--md{height:var(--control-h-md);padding:0 22px;font-size:var(--text-md);gap:var(--space-2)}
.mc-btn--lg{height:var(--control-h-lg);padding:0 30px;font-size:var(--text-lg);gap:var(--space-3)}
.mc-btn--primary{background:var(--accent);color:var(--text-on-brand);border:1.5px solid var(--accent)}
.mc-btn--primary:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.mc-btn--primary:active{background:var(--accent-press);border-color:var(--accent-press)}
.mc-btn--secondary{background:var(--surface-card);color:var(--text-heading);border:1.5px solid var(--border-strong)}
.mc-btn--secondary:hover{background:var(--stone-100)}
.mc-btn--secondary:active{background:var(--stone-200)}
.mc-btn--ghost{background:transparent;color:var(--text-heading);border:1.5px solid transparent}
.mc-btn--ghost:hover{background:var(--surface-hover)}
.mc-btn--ghost:active{background:var(--stone-200)}
.mc-btn--inverse{background:var(--surface-inverse);color:var(--text-inverse);border:1.5px solid var(--surface-inverse)}
.mc-btn--inverse:hover{background:var(--ink-600)}
.mc-btn--inverse:active{background:var(--ink-900)}

/* ---- Badge ---- */
.mc-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:4px 11px;border-radius:var(--radius-pill);font:var(--type-eyebrow);letter-spacing:var(--tracking-wide);text-transform:uppercase;white-space:nowrap}
.mc-badge--sm{padding:2px 8px}
.mc-badge--brand{background:var(--surface-brand);color:var(--text-on-brand)}
.mc-badge--soft{background:var(--surface-brand-soft);color:var(--yellow-800)}
.mc-badge--neutral{background:var(--stone-100);color:var(--text-body)}
.mc-badge--inverse{background:var(--surface-inverse);color:var(--text-inverse)}
.mc-badge--success{background:var(--status-success-bg);color:var(--status-success-fg)}
.mc-badge--danger{background:var(--status-danger-bg);color:var(--status-danger-fg)}
.mc-badge--info{background:var(--status-info-bg);color:var(--status-info-fg)}
.mc-badge--warning{background:var(--status-warning-bg);color:var(--status-warning-fg)}
.mc-badge--urgent{background:var(--status-urgent-bg);color:var(--status-urgent-fg)}

/* ---- Card ---- */
.mc-card{background:var(--surface-card);border:1.5px solid var(--border-subtle);border-radius:var(--radius-card);overflow:hidden;box-shadow:var(--shadow-xs);transition:var(--transition-card),border-color var(--duration-fast) var(--ease-standard)}
.mc-card--pad{padding:var(--card-pad)}

/* ---- Media placeholder ---- */
.mc-media{position:relative;overflow:hidden;background:var(--stone-200);border-radius:var(--radius-media)}
.mc-media img{width:100%;height:100%;object-fit:cover}
.mc-media--empty{width:100%;height:100%;display:grid;place-items:center;gap:var(--space-2);background:repeating-linear-gradient(135deg,var(--stone-200) 0 10px,var(--stone-100) 10px 20px);color:var(--stone-500)}
.mc-media--empty span{font:var(--type-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase}

/* ---- Price ---- */
.mc-price{display:inline-flex;align-items:baseline;gap:var(--space-2)}
.mc-price__prefix{font:var(--type-body-sm);color:var(--text-muted)}
.mc-price__amount{font-family:var(--font-display);font-weight:var(--weight-bold);color:var(--price-fg);letter-spacing:var(--tracking-tight)}
.mc-price__amount--sm{font-size:var(--text-md)}
.mc-price__unit{font:var(--type-body-sm);color:var(--text-muted)}

/* ---- Avatar ---- */
.mc-avatar{width:32px;height:32px;border-radius:var(--radius-pill);overflow:hidden;display:grid;place-items:center;background:var(--yellow-200);color:var(--ink-800);font-family:var(--font-display);font-weight:var(--weight-bold);font-size:12px;border:1.5px solid var(--border-subtle);flex:0 0 auto}

/* ---- Icon ---- */
.mc-icon{display:block;flex:0 0 auto}

/* ---- Header / nav ---- */
.mc-header{position:sticky;top:0;z-index:20;height:var(--nav-h);background:rgba(255,253,247,.92);backdrop-filter:blur(6px);box-shadow:var(--shadow-inset-hairline)}
.mc-header__inner{height:var(--nav-h);display:flex;align-items:center;gap:var(--space-10)}
.mc-nav{display:flex;align-items:center;gap:var(--space-8);font:var(--type-label);margin-right:auto}
.mc-nav a{color:var(--text-body)}

/* ---- Hero ---- */
.mc-hero{padding:var(--space-20) 0 var(--space-16)}
.mc-hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--space-16);align-items:center}
.mc-hero__copy{display:grid;gap:var(--space-6);justify-items:start}
.mc-hero__eyebrow{font:var(--type-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-muted)}
.mc-hero__title{font:var(--type-hero);letter-spacing:var(--tracking-hero);color:var(--text-heading);text-wrap:pretty}
.mc-hero__sub{font:var(--weight-regular) var(--text-xl)/1.55 var(--font-sans);color:var(--text-body);max-width:30ch}
.mc-hero__pill{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-3) var(--space-5);border:1.5px solid var(--border-subtle);border-radius:var(--radius-pill);background:var(--surface-card)}
.mc-hero__pill-count{font:var(--type-price);color:var(--text-heading)}
.mc-hero__pill-note{font:var(--type-body-sm);color:var(--text-muted)}
.mc-hero__ctas{display:flex;gap:var(--space-4);margin-top:var(--space-2)}
.mc-hero__fine{font:var(--type-body-sm);color:var(--text-muted)}
.mc-hero__media{position:relative}
.mc-hero__media .mc-media{aspect-ratio:4/5}
.mc-hero__media img{object-position:28% 45%}
.mc-hero__poster{position:absolute;left:-28px;bottom:36px;background:var(--surface-card);border:1.5px solid var(--border-strong);border-radius:var(--radius-card);box-shadow:var(--shadow-poster);padding:var(--card-pad);display:grid;gap:6px;width:250px}
.mc-hero__poster-title{font:var(--type-h4);color:var(--text-heading)}
.mc-hero__poster-meta{font:var(--type-body-sm);color:var(--text-muted)}
.mc-hero__poster-price{font:var(--type-price);color:var(--price-fg)}

/* ---- Logo strip ---- */
.mc-logos{border-top:1.5px solid var(--border-subtle);border-bottom:1.5px solid var(--border-subtle);background:var(--bg-page-alt)}
.mc-logos__inner{padding:var(--space-8) 0;display:flex;align-items:center;gap:var(--space-10);flex-wrap:wrap}
.mc-logos__marks{display:flex;align-items:center;gap:var(--space-10);flex-wrap:wrap;font:var(--weight-bold) var(--text-lg)/1 var(--font-display);letter-spacing:var(--tracking-wide);color:var(--stone-500)}

/* ---- Section heading rows ---- */
.mc-section{padding:var(--space-24) 0}
.mc-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-8);margin-bottom:var(--space-10)}
.mc-section-head__copy{display:grid;gap:var(--space-4);max-width:60ch}
.mc-eyebrow{font:var(--type-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--text-muted)}
.mc-section-head h2{font:var(--type-h1);letter-spacing:var(--tracking-tight);color:var(--text-heading)}
.mc-section-head p{font:var(--type-body);color:var(--text-body)}

/* ---- Gig grid / card ---- */
.mc-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gutter)}
.mc-gig{display:grid;gap:var(--space-3)}
.mc-gig__top{display:flex;align-items:flex-start;gap:var(--space-3)}
.mc-gig__body{flex:1;min-width:0}
.mc-gig__badge{margin-bottom:6px}
.mc-gig__title{font:var(--type-h4);letter-spacing:var(--tracking-tight)}
.mc-gig__meta{display:flex;flex-wrap:wrap;gap:var(--space-4);margin-top:8px;font:var(--type-body-sm);color:var(--text-muted)}
.mc-gig__meta span{display:inline-flex;align-items:center;gap:6px}
.mc-gig__instruments{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.mc-gig__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-top:var(--space-3);border-top:1.5px solid var(--border-subtle)}
.mc-gig__posted{font:var(--type-body-sm);color:var(--text-muted)}

/* ---- How it works ---- */
.mc-how{background:var(--surface-card);border-top:1.5px solid var(--border-subtle);border-bottom:1.5px solid var(--border-subtle)}
.mc-how .mc-container{padding-top:var(--space-24);padding-bottom:var(--space-24)}
.mc-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-10)}
.mc-step{display:grid;gap:var(--space-5);align-content:start}
.mc-step .mc-media{aspect-ratio:4/3}
.mc-step__icon-circle{display:grid;place-items:center;width:72px;height:72px;border-radius:var(--radius-pill);background:var(--surface-brand-soft);color:var(--yellow-800);border:1.5px solid var(--border-subtle)}
.mc-step__head{display:flex;align-items:center;gap:var(--space-3)}
.mc-step__n{display:grid;place-items:center;width:30px;height:30px;border-radius:var(--radius-pill);background-color:var(--yellow-50);color:var(--text-on-brand);font:var(--weight-bold) var(--text-sm)/1 var(--font-display)}
.mc-step__title{font:var(--type-h4);color:var(--text-heading)}
.mc-step__body{font:var(--type-body);color:var(--text-body)}

/* ---- Small pill badges ("Coming soon" chips) ---- */
.mc-pill-soft{font:var(--weight-bold) 10px/1 var(--font-display);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--yellow-800);background:var(--surface-brand-soft);border-radius:var(--radius-pill);padding:4px 8px}
.mc-pill-solid{font:var(--weight-bold) 11px/1 var(--font-display);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--ink-900);background:var(--yellow-500);border-radius:var(--radius-pill);padding:5px 10px}

/* ---- Gear / listing ---- */
.mc-gear{background:var(--surface-inverse);color:var(--text-inverse)}
.mc-gear .mc-eyebrow{color:var(--yellow-500)}
.mc-gear .mc-section-head h2{color:var(--white)}
.mc-gear .mc-section-head p{color:var(--stone-300)}
.mc-listing__media{aspect-ratio:4/3;border-radius:0}
.mc-listing__body{display:grid;gap:var(--space-2);padding:var(--card-pad);align-content:start}
.mc-listing__badges{display:flex;gap:var(--space-2);flex-wrap:wrap}
.mc-listing__title{font:var(--weight-semibold) var(--text-lg)/var(--leading-snug) var(--font-display)}
.mc-listing__price{display:inline-flex;align-items:baseline;gap:6px}
.mc-listing__price-amount{font:var(--type-price);color:var(--price-fg)}
.mc-listing__price-unit{font:var(--type-body-sm);color:var(--text-muted)}
.mc-listing__meta{display:flex;flex-wrap:wrap;gap:var(--space-4);font:var(--type-body-sm);color:var(--text-muted)}
.mc-listing__meta span{display:inline-flex;align-items:center;gap:6px}
.mc-listing__seller{display:inline-flex;align-items:center;gap:6px;font:var(--type-body-sm);color:var(--text-muted);padding-top:var(--space-2);border-top:1.5px solid var(--border-subtle)}

/* ---- Filler sections (activity / story slots — reserved, no content in this design pass) ---- */
.mc-filler{background:var(--bg-page-alt);border-top:1.5px solid var(--border-subtle);border-bottom:1.5px solid var(--border-subtle)}

/* ---- Testimonials ---- */
.mc-quotes-wrap{background:var(--bg-page-alt);border-top:1.5px solid var(--border-subtle);border-bottom:1.5px solid var(--border-subtle)}
.mc-quotes-wrap h2{font:var(--type-h1);letter-spacing:var(--tracking-tight);color:var(--text-heading);margin-bottom:var(--space-10)}
.mc-quote{display:grid;gap:var(--space-5);align-content:start;background:var(--surface-card);border:1.5px solid var(--border-subtle);border-radius:var(--radius-card);box-shadow:var(--shadow-xs);padding:var(--space-8)}
.mc-quote__body{font:var(--weight-regular) var(--text-lg)/1.6 var(--font-sans);color:var(--text-heading)}
.mc-quote__who{display:flex;align-items:center;gap:var(--space-3);padding-top:var(--space-4);border-top:1.5px solid var(--border-subtle)}
.mc-quote__name{font:var(--type-label);color:var(--text-heading);display:block}
.mc-quote__role{font:var(--type-body-sm);color:var(--text-muted);display:block}

/* ---- FAQ ---- */
.mc-faq-wrap{max-width:880px;margin:0 auto;padding:var(--space-24) var(--page-pad)}
.mc-faq-wrap h2{font:var(--type-h1);letter-spacing:var(--tracking-tight);color:var(--text-heading);margin-bottom:var(--space-10)}
.mc-faq-list{display:grid;gap:var(--space-3)}
.mc-faq{background:var(--surface-card);border:1.5px solid var(--border-subtle);border-radius:var(--radius-card)}
.mc-faq__q{width:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);background:none;border:0;padding:var(--space-6);cursor:pointer;text-align:left;font:var(--type-h4);color:var(--text-heading)}
.mc-faq__q:hover{background:var(--surface-hover)}
.mc-faq__sign{font:var(--weight-regular) 24px/1 var(--font-display);color:var(--text-muted)}
.mc-faq__a{font:var(--type-body);color:var(--text-body);padding:0 var(--space-6) var(--space-6);margin:0;display:none}
.mc-faq.is-open .mc-faq__a{display:block}

/* ---- Final CTA ---- */
.mc-cta{background:var(--surface-inverse)}
.mc-cta__inner{padding:var(--space-24) 0;display:grid;gap:var(--space-8);justify-items:center;text-align:center}
.mc-cta__eyebrow{font:var(--type-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--yellow-500)}
.mc-cta__title{font:var(--type-hero);letter-spacing:var(--tracking-hero);color:var(--white);max-width:24ch}
.mc-cta__sub{font:var(--weight-regular) var(--text-xl)/1.55 var(--font-sans);color:var(--stone-300);max-width:46ch}
.mc-cta__ctas{display:flex;gap:var(--space-4);margin-top:var(--space-2)}

/* ---- Footer ---- */
.mc-footer{background:var(--ink-900);color:var(--stone-400)}
.mc-footer__top{padding:var(--space-16) 0 var(--space-10);display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--space-12)}
.mc-footer__brand{display:grid;gap:var(--space-4);align-content:start}
.mc-footer__logo-row{display:flex;align-items:center;gap:var(--space-3)}
.mc-footer__wordmark{font:var(--weight-bold) 19px/1 var(--font-display);letter-spacing:var(--tracking-wordmark);text-transform:uppercase;color:var(--yellow-500)}
.mc-footer__tagline{font:var(--type-body-sm);color:var(--stone-500);max-width:34ch}
.mc-footer__col{display:grid;gap:var(--space-3);align-content:start;font:var(--type-body-sm)}
.mc-footer__col-head{font:var(--type-eyebrow);letter-spacing:var(--tracking-eyebrow);text-transform:uppercase;color:var(--stone-500)}
.mc-footer__col a{color:var(--stone-300)}
.mc-footer__bottom{padding:var(--space-6) 0 var(--space-16);border-top:1.5px solid var(--ink-600);display:flex;justify-content:space-between;gap:var(--space-8);font:var(--type-body-sm);color:var(--stone-500)}
.mc-footer__bottom-links{display:flex;gap:var(--space-8)}
.mc-footer__bottom-links a{color:var(--stone-500)}