/* Tropicalia Records · official identity · 3.2.0
   Load after tropicalia-label.css or admin.css. Fonts are hosted on this site. */
@font-face {
  font-family: "Noeran";
  src: url("../fonts/noeran-regular.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Vaulto ExtraBold";
  src: url("../fonts/vaulto-extrabold.woff") format("woff");
  font-style: normal;
  font-weight: 800;
  font-display: swap;
}
@font-face {
  font-family: "Kawur Aesthetic";
  src: url("../fonts/kawur-aesthetic.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --forest: #0B1F1A;
  --sand: #C5A36A;
  --green: #2D5A47;
  --ivory: #F4F1EA;
  --black: #050505;
  --rust: #A0522D;
  --earth: #4B3621;
  --forest-2: var(--forest);
  --ink: var(--forest);
  --paper: var(--ivory);
  --cream: var(--ivory);
  --gold: var(--sand);
  --dark: var(--black);
  --muted: rgba(11, 31, 26, .72);
  --line: rgba(11, 31, 26, .17);
  --line-light: rgba(244, 241, 234, .18);
  --display: "Noeran", Georgia, serif;
  --serif: "Kawur Aesthetic", Georgia, serif;
  --label: "Vaulto ExtraBold", Arial, sans-serif;
  --sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

body { font-synthesis: none; }

/* The wordmark uses the supplied outlines, independently of font loading. */
.brand-copy { flex-direction: column; align-items: flex-start; gap: 7px; }
.brand-wordmark { display: block; width: 156px; height: auto; }
.brand-copy small { display: block; font-family: var(--label); font-weight: 800; letter-spacing: .26em; font-size: .43rem; }
.label-hero__wordmark { width: min(100%, 880px); height: auto; filter: none; }
.footer-brand { max-width: 100%; }
.footer-brand > img { flex: 0 0 auto; }
.footer-brand > div { min-width: 0; }
.footer-brand .footer-wordmark { width: clamp(190px, 26vw, 420px); height: auto; }
.footer-brand span { margin: 16px 0 0; font-family: var(--label); font-weight: 800; letter-spacing: .38em; }

/* Noeran: short, expressive headings. */
.label-statement__copy h2,
.editorial-heading h2,
.section-heading h2,
.page-hero h1,
.about-page-copy h1,
.demo-page-copy h1,
.contact-intro h1,
.legal-page h1,
.not-found h1 {
  font-family: var(--display);
  font-weight: 400;
  font-style: normal;
  line-height: 1.06;
  letter-spacing: -.018em;
  overflow-wrap: anywhere;
}
.label-statement__copy h2 { font-size: clamp(2.5rem, 5vw, 5.6rem); }
.editorial-heading h2 { font-size: clamp(2.8rem, 5vw, 5.7rem); }
.section-heading h2 { font-size: clamp(2.5rem, 4.7vw, 5.3rem); }
.page-hero h1 { font-size: clamp(3rem, 6.5vw, 7.2rem); }
.about-page-copy h1, .demo-page-copy h1, .contact-intro h1 { font-size: clamp(2.6rem, 5vw, 5.5rem); }
.legal-page h1, .not-found h1 { font-size: clamp(2.6rem, 5vw, 5.6rem); }
.label-statement__copy h2 em, .editorial-heading h2 em { font-style: normal; }
.label-statement__copy, .editorial-heading { min-width: 0; }
.label-statement__copy > *, .editorial-heading > * { min-width: 0; }

/* Kawur: catalogue names and editorial accents, without synthetic italics. */
.label-hero__tagline,
.featured-record__meta h2,
.catalog-card__info h3, .release-info h3,
.playlist-visual h3,
.label-about__copy h2, .label-about__copy blockquote,
.roster-row h3, .directory-card h2, .artist-profile-copy h1,
.label-radio__copy h2, .radio-card h2,
.demo-callout h2, .manifesto p,
.release-detail-copy h1, .mini-release-grid strong,
.values-grid h2, .legal-page h2,
.footer-statement p, .footer-contact a,
.contact-intro > a {
  font-weight: 400;
  font-style: normal;
  line-height: 1.08;
  letter-spacing: -.025em;
  overflow-wrap: anywhere;
}
.playlist-visual h3 em, .demo-callout h2 em { font-style: normal; }
.label-hero__tagline { line-height: 1.18; }
.label-about__copy h2 { font-size: clamp(3rem, 5.7vw, 6.4rem); }
.catalog-card__info h3, .release-info h3 { line-height: 1.14; letter-spacing: -.015em; }
.roster-row h3 { line-height: 1.12; }
.directory-card h2 { line-height: 1.13; }
.release-detail-copy h1, .artist-profile-copy h1 { font-size: clamp(3.5rem, 7.5vw, 8.3rem); }
.label-radio__copy h2, .radio-card h2 { font-size: clamp(3.5rem, 6.7vw, 7.5rem); }
.demo-callout h2 { font-size: clamp(3.7rem, 8vw, 9rem); }
.manifesto p { font-size: clamp(2.8rem, 5.8vw, 6.5rem); line-height: 1.18; }
.catalog-card__actions small, .release-index, .directory-number,
.playlist-row > span:first-child, .roster-row > span,
.label-radio__head strong, .values-grid article > span,
.tracklist li > span:first-child, .not-found > span { font-style: normal; }
.playlist-copy strong, .tracklist strong,
.player-now strong, .player-queue-head strong,
.spotify-launcher strong, .spotify-panel__head strong { font-weight: 400; line-height: 1.2; letter-spacing: 0; }

/* Vaulto is deliberately limited to short labels and controls. */
.section-index, .eyebrow,
.button, .btn,
.frequency-strip__track,
.catalog-card__top > span, .release-card-top > span,
.featured-record__header > span,
.release-stream-badge > b {
  font-family: var(--label);
  font-weight: 800;
  font-style: normal;
  letter-spacing: .055em;
}
.button, .btn { min-width: 0; max-width: 100%; padding-block: 13px; font-size: .65rem; line-height: 1.5; text-align: center; }
.button > span, .btn > span { flex-shrink: 0; }
.label-statement__stats strong { font-family: var(--display); font-weight: 400; font-size: clamp(2.5rem, 4.3vw, 4.7rem); letter-spacing: -.025em; }
.catalog-card__top small, .directory-number { color: var(--earth); }
.release-date { color: var(--release-text); opacity: .7; }
.catalog-card__info p, .release-info p { color: var(--earth); }
.spotify-status i { background: var(--sand); }

/* The administration shares the same identity; forms stay easy to scan. */
.admin-body { background: var(--ivory); }
.admin-sidebar { background: var(--forest); }
.admin-brand { gap: 10px; letter-spacing: 0; }
.admin-brand > img { width: 40px; height: 40px; filter: none; }
.admin-brand > span { min-width: 0; }
.admin-brand .admin-wordmark { display: block; width: 142px; height: auto; filter: none; }
.admin-brand small { margin-top: 8px; color: var(--sand); font: 800 .46rem/1.4 var(--label); letter-spacing: .12em; }
.admin-topbar { background: var(--ivory); }
.admin-topbar strong { font-family: var(--sans); }
.stat-card, .admin-panel, .resource-list, .resource-form, .message-card,
.player-health:not(.has-error), .admin-btn:not(.primary):not(.danger) { background: var(--ivory); }
.stat-card strong { font-family: var(--display); font-size: 2.7rem; line-height: 1.15; }
.login-page { background: var(--forest); }
.login-box { background: var(--ivory); border-radius: 12px; }
.login-box h1 { font: 400 clamp(1.75rem, 3vw, 2.5rem)/1.15 var(--display); letter-spacing: -.018em; }
.login-box p { color: var(--earth); }
.login-box button { font: 800 .75rem/1.5 var(--label); background: var(--forest); color: var(--ivory); }
.login-box button:hover { background: var(--green); }
.login-box input:focus-visible { outline: 2px solid var(--green); outline-offset: 2px; }

@media (max-width: 1020px) {
  .main-nav::before { font-family: var(--display); font-weight: 400; letter-spacing: -.02em; }
  .main-nav a { font-weight: 400; line-height: 1.15; letter-spacing: -.025em; }
  .main-nav a > span:not(.nav-signal) { font-style: normal; }
}

@media (max-width: 760px) {
  .brand { gap: 10px; }
  .brand-wordmark { width: 140px; }
  .brand-copy small { display: block; }
  .label-statement__copy h2 { font-size: clamp(2.05rem, 7vw, 3.3rem); }
  .editorial-heading h2 { font-size: clamp(2.2rem, 8vw, 3.8rem); }
  .section-heading h2 { font-size: clamp(1.75rem, 6.7vw, 3.3rem); }
  .page-hero h1 { font-size: clamp(1.85rem, 6.8vw, 3.6rem); }
  .about-page-copy h1, .demo-page-copy h1, .contact-intro h1,
  .legal-page h1, .not-found h1 { font-size: clamp(2.2rem, 7.6vw, 3.6rem); }
  .label-about__copy h2 { font-size: clamp(3rem, 10.5vw, 5rem); }
  .release-detail-copy h1, .artist-profile-copy h1,
  .label-radio__copy h2, .radio-card h2 { font-size: clamp(3.1rem, 11vw, 5rem); }
  .roster-row h3 { font-size: clamp(1.8rem, 7.6vw, 2.7rem); }
  .footer-brand { gap: 14px; }
  .footer-brand > img { width: 58px; }
  .footer-brand .footer-wordmark { width: clamp(190px, 47vw, 340px); }
  .footer-brand span { font-size: .48rem; margin-top: 12px; }
  .label-statement__stats div { padding-inline: 12px; }
  .label-statement__stats strong { font-size: 2.2rem; }
  .login-panel { padding: 20px; }
  .login-box { padding: 26px; }
}