/* Shared TMD proportions. Form controls keep their dedicated forms.css system. */
:root {
  --tmd-page-width: 1240px;
  --tmd-gutter: 32px;
  --tmd-section-space: 40px;
  --tmd-panel-space: 24px;
  --tmd-border: #49404b;
}
.tmd-page { min-width: 0; }
.tmd-page :is(.button, .text-link, summary, .service-example-button):focus-visible {
  outline: 3px solid #ff9bad;
  outline-offset: 4px;
}
.tmd-page .button { min-height: 48px; padding: 12px 20px; line-height: 1.4; white-space: normal; text-align: center; }
.tmd-page :is(.page-head, .dj-hero, .release-hero) {
  max-width: var(--tmd-page-width);
  margin: auto;
  padding: 28px var(--tmd-gutter) 32px;
}
.tmd-page :is(.page-head, .dj-hero, .release-copy) h1 {
  font-size: clamp(2.25rem, 4.3vw, 3.5rem);
  line-height: 1.12;
  letter-spacing: -.045em;
  margin: 12px 0 20px;
  overflow-wrap: break-word;
}
.tmd-page :is(.page-head, .dj-hero, .release-copy) .eyebrow { margin: 0 0 12px; }
.tmd-page :is(.page-head, .dj-hero, .release-copy) .lead {
  font-size: 1.125rem;
  line-height: 1.65;
  max-width: 70ch;
  margin: 0 0 22px;
}
.tmd-page :is(.page-head, .dj-hero, .release-copy) .actions { margin-top: 22px; }
.editorial-page > .section {
  max-width: var(--tmd-page-width);
  padding: var(--tmd-section-space) var(--tmd-gutter);
}
.editorial-page > .content-section { padding-top: 8px; }
.editorial-page :is(.section-heading h2, .section > h2, .manifesto h2, .dj-manifest h2) {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  line-height: 1.18;
  letter-spacing: -.03em;
  margin: 0 0 16px;
}
.editorial-page .eyebrow { margin-bottom: 12px; }
.editorial-page .section-heading { align-items: start; gap: 32px; margin-bottom: 24px; }
.editorial-page .section-heading > p { max-width: 48ch; margin: 0; font-size: 1rem; line-height: 1.65; }
.editorial-page .three-grid { gap: 20px; }
.editorial-page .card { padding: var(--tmd-panel-space); min-width: 0; }
.editorial-page .card .number { font-size: .75rem; line-height: 1.6; letter-spacing: .06em; }
.editorial-page .card h3 { font-size: 1.5rem; line-height: 1.22; margin: 12px 0; letter-spacing: -.02em; }
.editorial-page .card p { font-size: 1rem; line-height: 1.65; margin: 0 0 14px; }
.editorial-page .card p:last-child { margin-bottom: 0; }
.editorial-page .service-example-card .service-example-button { margin-top: auto; }
.editorial-page .text-link { margin-top: 20px; }
.editorial-page :is(.service-process-heading, .personal-process) { padding-top: 36px; margin-top: 0; }
.editorial-page .process { gap: 24px; margin-top: 24px; }
.editorial-page .process > div { min-width: 0; padding: 20px 0 0; }
.editorial-page .process strong { font-size: 1.5rem; }
.editorial-page .process h3 { font-size: 1.25rem; line-height: 1.3; margin: 10px 0; }
.editorial-page .process p { font-size: 1rem; line-height: 1.65; margin: 0; }
.editorial-page .personal-process > .lead { font-size: 1.125rem; line-height: 1.65; margin: 0; }
.tmd-page:not(.home-page) .cta-band {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  padding: 28px;
  margin-top: 36px;
}
.tmd-page:not(.home-page) .cta-band h2 { font-size: 1.75rem; line-height: 1.22; margin: 0; letter-spacing: -.02em; }
.tmd-page .cta-band .eyebrow { margin-bottom: 10px; }
.tmd-page .cta-band p:not(.eyebrow) { margin: 12px 0 0; font-size: 1rem; line-height: 1.6; }
.tmd-page .cta-band .actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }
.tmd-page .section > .cta-band:first-child { margin-top: 0; }
.editorial-page > .section:has(> .cta-band:first-child) { padding-top: 8px; }
.editorial-page .faq { padding-top: 28px; }
.editorial-page .faq h2 { margin-bottom: 20px; }
.editorial-page .faq details { padding: 16px 0; }
.editorial-page .faq summary { font-size: 1.0625rem; line-height: 1.5; padding: 4px 0; }
.editorial-page .faq details p { font-size: 1rem; line-height: 1.7; margin: 12px 0 0; }
/* DJ and people pages: keep the portraits present without dominating the page. */
.page-dj .dj-hero { min-height: 0; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr); gap: 48px; }
.page-dj .dj-hero-art { max-width: 350px; justify-self: end; }
.page-dj .dj-hero-art span { font-size: .75rem; letter-spacing: .06em; line-height: 1.5; margin-top: 10px; }
.page-dj .ticker { padding-top: 16px; padding-bottom: 16px; }
.page-dj .dj-manifest { margin-top: 36px; padding: 28px; gap: 36px; }
.page-dj .dj-manifest > p { font-size: 1rem; line-height: 1.65; margin: 0; }
.page-about .profile { grid-template-columns: 220px minmax(0, 1fr); gap: 32px; padding: 28px 0; }
.page-about .profile:first-child { padding-top: 0; }
.page-about .profile img { width: 100%; max-width: 220px; aspect-ratio: 1; object-fit: cover; }
.page-about .profile h2 { font-size: 2rem; line-height: 1.2; margin: 0 0 14px; }
.page-about .profile p { font-size: 1rem; line-height: 1.7; margin: 0 0 12px; max-width: 82ch; }
.page-about .profile p:last-child { margin-bottom: 0; }
.page-about .manifesto { min-height: 0; }
.page-about .manifesto p:not(.eyebrow) { font-size: 1.125rem; line-height: 1.65; max-width: 72ch; }
/* Release Room keeps its two matching cards and readable countdown. */
.page-releases .release-copy { max-width: none; }
.page-releases .release-hero { min-height: 0; padding-bottom: 28px; }
.page-releases .release-hero h1 { margin-top: 16px; }
.page-releases .release-status { font-size: .75rem; line-height: 1.6; padding: 6px 10px; }
.page-releases .countdown { max-width: 420px; gap: 10px; margin: 24px 0; }
.page-releases .countdown-unit { padding: 12px 8px; }
.page-releases .countdown-unit strong { font-size: 2rem; line-height: 1.1; }
.page-releases .countdown-unit span { font-size: .75rem; letter-spacing: .04em; margin-top: 6px; }
.page-releases .release-marquee { padding: 14px 24px; }
.page-releases .release-cards { max-width: 1176px; margin: 28px auto; gap: 20px; }
.page-releases .release-cards > .single-release.catalog-single { grid-template-columns: 180px minmax(0, 1fr); gap: 28px; padding: 24px; }
.page-releases .release-cards .single-cover { max-width: 180px; }
.page-releases .release-cards h2 { font-size: 2rem; line-height: 1.2; margin: 6px 0 10px; }
.page-releases .release-cards .single-subtitle { margin: 0 0 12px; font-size: .875rem; }
.page-releases .release-cards .eyebrow { margin-bottom: 8px; }
.page-releases .release-listen { max-width: var(--tmd-page-width); padding: 36px var(--tmd-gutter); gap: 32px; }
.page-releases .release-listen h2 { font-size: 2rem; line-height: 1.2; }
.page-releases .release-platforms { gap: 12px; }
.page-releases .release-platforms a { padding: 16px; gap: 12px; min-width: 0; }
/* Compact catalogue, with consistent album widths and touch targets. */
.music-catalog > .section { max-width: var(--tmd-page-width); padding-left: var(--tmd-gutter); padding-right: var(--tmd-gutter); }
.music-catalog > .content-section { padding-top: 8px; }
.music-catalog .release-door { margin: 0 0 24px; padding: 18px 22px; }
.music-catalog .single-tile-subtitle { font-size: .875rem; }
.music-catalog .single-tile .text-link { font-size: .875rem; }
.music-catalog .section.album-release { max-width: 1176px; padding: 24px; gap: 28px; margin-top: 24px; margin-bottom: 24px; }
.music-catalog .spotify-more { padding-top: 32px; padding-bottom: 8px; }
.music-catalog .spotify-more > h2 { margin-bottom: 20px; font-size: 2rem; }
/* Production, press and contact share the same panel and heading rhythm. */
.production-page .production-intro { gap: 32px; }
.production-page .production-intro h2 { font-size: 2rem; margin-top: 0; }
.production-page .production-intro p { font-size: 1rem; line-height: 1.7; margin: 0 0 14px; }
.production-page .production-paths { gap: 20px; padding-top: 8px; padding-bottom: 24px; }
.production-page .production-paths h2 { font-size: 1.75rem; }
.production-page .production-process ol { gap: 24px; margin-top: 24px; }
.production-page .production-process li { padding-top: 16px; }
.production-page .production-process li::before { margin-bottom: 12px; }
.production-page .rights-panel { padding: 28px; }
.production-page .rights-panel h2 { font-size: 2rem; margin: 0 0 16px; }
.production-page .rights-panel dl { gap: 20px 28px; margin: 24px 0; }
.production-page .rights-panel .rights-lead { font-size: 1.125rem; }
.page-press .press-bio { grid-template-columns: 200px minmax(0, 1fr); gap: 32px; }
.page-press .press-bio h2 { font-size: 2rem; margin: 0 0 16px; }
.page-press .press-bio p { font-size: 1rem; line-height: 1.7; margin: 0 0 12px; }
.page-press .press-facts dl { margin-top: 20px; column-gap: 28px; }
.page-press .press-facts dl > div { padding: 16px 0; grid-template-columns: 128px minmax(0, 1fr); gap: 16px; }
.page-press .press-news-grid { gap: 20px; }
.page-contact .contact-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.page-contact .contact-grid h2 { font-size: 2rem; line-height: 1.2; margin: 0 0 16px; }
.page-contact .contact-grid > div > p:not(.eyebrow) { margin: 0 0 16px; }
.page-contact .contact-note { margin-top: 24px; padding: 24px; background: #1c1920; border: 1px solid var(--tmd-border); }
.page-contact .contact-note h3 { font-size: 1.375rem; }
.page-contact .contact-note p { font-size: 1rem; line-height: 1.65; margin: 0 0 14px; }
.page-contact .social-logo-grid { gap: 12px; }
.page-contact .social-logo { min-width: 0; padding: 16px; gap: 12px; }
.page-contact .social-logo span { min-width: 0; }
.page-contact .social-logo small { overflow-wrap: anywhere; }
/* Account spacing is outside the shared form-field layout. */
.backstage-demo.tmd-page { padding: 24px var(--tmd-gutter) 40px; }
.backstage-demo .bd-layout { gap: 36px; padding-top: 28px; }
.backstage-demo .bd-intro h1 { font-size: clamp(2.25rem, 4vw, 3.25rem); line-height: 1.12; margin: 12px 0 18px; }
.backstage-demo .bd-intro > .eyebrow { margin-bottom: 12px; }
.backstage-demo .bd-benefits { gap: 18px; margin: 22px 0; }
.backstage-demo .bd-panel { padding: 24px; }
.backstage-demo .bd-entry-tabs { margin-bottom: 24px; }
.backstage-demo.bd-compact-view .bd-layout { max-width: 850px; }
.backstage-demo.bd-member-view .bd-layout { max-width: 1100px; padding-top: 8px; }
.backstage-demo.bd-member-view .bd-panel { padding: 0; }
.backstage-demo.bd-member-view .ml-member-section { padding: 24px 0; }
.backstage-demo.bd-member-view .bd-wallpapers { gap: 20px; }
.privacy-page.tmd-page { padding: 28px var(--tmd-gutter) 40px; }
.privacy-page h1 { font-size: clamp(2.25rem, 4vw, 3.25rem); }
.privacy-page section { margin: 28px 0; }
.privacy-page .privacy-data th, .privacy-page .privacy-data td { padding: 14px; }
.page-library { max-width: var(--tmd-page-width); padding: 32px var(--tmd-gutter); }
.page-library h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.15; }
@media (max-width: 1239px) {
  .page-releases .release-cards, .music-catalog .section.album-release { margin-left: var(--tmd-gutter); margin-right: var(--tmd-gutter); }
}
@media (max-width: 1000px) {
  .tmd-page:not(.home-page) .cta-band { grid-template-columns: 1fr; gap: 20px; }
  .page-dj .dj-hero { gap: 32px; }
  .page-contact .social-logo-grid { grid-template-columns: 1fr; }
}
@media (max-width: 800px) {
  :root { --tmd-gutter: 24px; --tmd-section-space: 32px; --tmd-panel-space: 22px; }
  .tmd-page :is(.page-head, .dj-hero, .release-hero) { padding-top: 22px; padding-bottom: 28px; }
  .tmd-page :is(.page-head, .dj-hero, .release-copy) h1 { font-size: clamp(2.125rem, 6vw, 2.875rem); }
  .tmd-page :is(.page-head, .dj-hero, .release-copy) .lead { font-size: 1.0625rem; }
  .editorial-page .three-grid { grid-template-columns: 1fr; gap: 16px; }
  .editorial-page .section-heading { display: block; }
  .editorial-page .section-heading > p { margin-top: 14px; max-width: 65ch; }
  .editorial-page .process { grid-template-columns: 1fr; gap: 24px; }
  .editorial-page .process > div { padding-top: 16px; }
  .editorial-page .faq summary { font-size: 1rem; }
  .page-dj .dj-hero { grid-template-columns: 1fr; gap: 24px; }
  .page-dj .dj-hero-art { max-width: 260px; justify-self: center; }
  .page-dj .dj-manifest { grid-template-columns: 1fr; gap: 18px; padding: 24px; }
  .page-about .profile { grid-template-columns: 160px minmax(0, 1fr); gap: 24px; }
  .page-about .profile img { max-width: 160px; }
  .page-press .press-bio { grid-template-columns: 1fr; gap: 24px; }
  .page-press .press-bio figure { max-width: 180px; }
  .page-contact .contact-grid { grid-template-columns: 1fr; gap: 32px; }
  .page-contact .contact-note, .production-page .rights-panel { padding: 22px; }
  .page-releases .release-cards > .single-release.catalog-single { grid-template-columns: 140px minmax(0, 1fr); gap: 20px; padding: 22px; }
  .page-releases .release-cards .single-cover { max-width: 140px; }
  .page-releases .release-listen { grid-template-columns: 1fr; gap: 24px; }
  .music-catalog .section.album-release { padding: 22px; }
  .backstage-demo .bd-layout { gap: 28px; }
}
@media (max-width: 600px) {
  .tmd-page:not(.home-page) .cta-band { padding: 22px; }
  .tmd-page .cta-band .actions { display: grid; grid-template-columns: 1fr; }
  .tmd-page .cta-band .button { width: 100%; }
  .page-about .profile { grid-template-columns: 1fr; gap: 20px; }
  .page-about .profile img { max-width: 160px; }
  .page-releases .release-cards > .single-release.catalog-single { grid-template-columns: 1fr; gap: 20px; }
  .page-releases .release-cards h2 { font-size: 1.75rem; }
  .page-releases .release-platforms { grid-template-columns: 1fr; }
  .page-press .press-facts dl > div { grid-template-columns: 1fr; gap: 6px; }
  .backstage-demo .bd-panel { padding: 22px 18px; }
  .backstage-demo .bd-notice { padding: 14px 16px; }
  .privacy-page .privacy-data th { padding-bottom: 6px; }
  .privacy-page .privacy-data td { padding-top: 4px; }
}
@media (max-width: 380px) {
  :root { --tmd-gutter: 20px; }
  .editorial-page :is(.page-head, .dj-hero) h1 { font-size: 2rem; }
}