/* v0.36 Per-site visual overrides — palette: Cyber Mint, fonts: DM Serif Display + DM Sans, hero: #0, radius: medium, divider: dot */
@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=DM+Sans:wght@400;500;700&display=swap');

:root {
  --primary:       #0F2027;
  --primary-hover: #0A1719;
  --accent:        #00C896;
  --accent-hover:  #00A07A;
  --surface:       #F3F7F7;
  --surface-alt:   #E0EAEA;
  --text:          #0F2027;
  --text-soft:     #3A4A4F;
  --muted:         #6B7980;
  --border:        #D5DDDF;
  --radius-sm:     .55rem;
  --radius-md:     calc(.55rem * 1.4);
  --font-body:     'DM Sans', system-ui, -apple-system, sans-serif;
  --font-display:  'DM Serif Display', Georgia, serif;
}

body, p, li, td, input, button, textarea, select { font-family: var(--font-body); }
h1, h2, h3, h4, .hero-headline, .section-title, .card-title { font-family: var(--font-display); }

.hero, .hero-full-bleed { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-hover) 100%); }
/* v0.38.4 — .card-tag это маленький text-eyebrow (genre label), background:transparent.
   Только .card-score (overall score badge) получает filled accent bg. */
.card-tag { background: transparent !important; color: var(--accent); padding: 0; }
.card-score { background: var(--accent); color: #fff !important; }
.hero-cta, .btn-primary { background: var(--accent); border-color: var(--accent); }
.hero-cta:hover, .btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); }
a { color: var(--accent); }
a:hover { color: var(--accent-hover); }

section.section + section.section::before { content: '•'; display:block; text-align:center; color:var(--muted); margin: 1rem auto 0; font-size: 1.4rem; }