/* Premier Media Design — base styles + section themes (verbatim from source system) */
*, *::before, *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--font-regular);
  font-size: var(--text-body);
  line-height: 1.5;
  color: var(--ink);
  background: var(--white);
  -webkit-font-smoothing: antialiased;
  letter-spacing: var(--track-body);
}

h1, h2, h3, h4 {
  font-family: var(--font-regular);
  font-weight: 500;
  line-height: 1.2;
  text-transform: capitalize;   /* all headings capitalised */
  margin: 0 0 .5em;
}
h1 { font-size: var(--text-h1); letter-spacing: var(--track-display); }
h2 { font-size: var(--text-h2); letter-spacing: var(--track-h2); }
h3 { font-size: var(--text-h3); letter-spacing: var(--track-h4); }
h4 { font-size: var(--text-h4); letter-spacing: var(--track-h4); }

p  { margin: 0 0 1em; }
a  { color: inherit; text-decoration: none; transition: var(--transition); }
a:hover { color: var(--slate-hover); }

/* Gradient headline — the signature heading treatment */
.grad-text,
.theme-dark .grad-text-auto  { background: var(--grad-headline-dark); }
.grad-text-light,
.theme-light .grad-text-auto { background: var(--grad-headline-light); }
.grad-text-mist              { background: var(--grad-headline-mist); }
.grad-text, .grad-text-light, .grad-text-mist, .grad-text-auto {
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
  display: inline-block;
}

/* Section themes: black / white / light / bright */
.section        { padding: clamp(60px, 8vw, 120px) clamp(20px, 5vw, 80px); }
.section.black  { background: var(--ink);  color: var(--white); }
.section.white  { background: var(--white); color: var(--ink); }
.section.light  { background: var(--mist);  color: var(--ink); }
.section.bright { background: var(--slate); color: var(--white); }

/* Hero: dark rounded card w/ smoky slate texture (inset radius 12px) */
.hero-card {
  background: var(--ink-2);
  border-radius: var(--radius-card);
  color: var(--white);
  position: relative;
  overflow: hidden;
}
.hero-card .hero-smoke {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60% 80% at 78% 15%, rgba(97,135,100,.38), transparent 60%),
    radial-gradient(45% 60% at 12% 75%, rgba(97,135,100,.22), transparent 60%),
    radial-gradient(70% 90% at 45% 110%, rgba(43,87,72,.6), transparent 65%);
}
.hero-card .hero-grain {
  position: absolute; inset: 0; pointer-events: none; opacity: .35;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.06 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
