/**
 * SAM ANGELO PHOTOGRAPHY & FILMS
 * Typography System
 */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,600&family=Plus+Jakarta+Sans:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

body {
  font-family: var(--font-sans);
  font-size: 1rem;
  line-height: 1.65;
  color: var(--ink-soft);
  background-color: var(--canvas);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* ==========================================================================
   Editorial Display Headings
   ========================================================================== */
h1, h2, h3, h4, h5, h6,
.font-display,
.editorial-title {
  font-family: var(--font-display);
  font-weight: 400;
  color: var(--ink);
  line-height: 1.08;
  letter-spacing: -0.015em;
  margin: 0;
}

.hero-headline {
  font-size: clamp(2.75rem, 7.5vw, 6.5rem);
  font-weight: 400;
  line-height: 0.98;
  letter-spacing: -0.025em;
  color: var(--ink);
}

.hero-headline em,
.editorial-title em,
h2 em {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 400;
  color: var(--accent-warm);
}

h2, .section-title {
  font-size: clamp(2rem, 4.5vw, 4rem);
  font-weight: 400;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

h3, .card-title {
  font-size: clamp(1.4rem, 2.5vw, 2.25rem);
  font-weight: 400;
  line-height: 1.2;
}

h4 {
  font-size: clamp(1.15rem, 1.8vw, 1.5rem);
  font-weight: 500;
  line-height: 1.3;
}

/* ==========================================================================
   Small Technical & Editorial Metadata
   ========================================================================== */
.metadata,
.eyebrow,
.section-label,
.film-meta,
.badge-meta {
  font-family: var(--font-sans);
  font-size: 0.72rem; /* 11.5px */
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--ink-muted);
}

.film-code {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--olive-grey);
}

/* ==========================================================================
   Body Text, Subtitles, Quotes
   ========================================================================== */
.lead-text {
  font-size: clamp(1.05rem, 1.3vw, 1.35rem);
  line-height: 1.6;
  color: var(--ink-soft);
  max-width: var(--max-width-text);
}

.body-muted {
  color: var(--ink-muted);
}

.body-faint {
  color: var(--ink-faint);
}

.editorial-quote {
  font-family: var(--font-display);
  font-size: clamp(1.75rem, 3.5vw, 3rem);
  font-style: italic;
  line-height: 1.25;
  color: var(--ink);
}

.quote-author {
  font-family: var(--font-sans);
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--ink-soft);
}

.quote-context {
  font-size: 0.8rem;
  color: var(--ink-muted);
}