/* =========================================
   Mvision Cinemas – mv-fonts.css
   Typography & Font Configuration
   ========================================= */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600&family=Lato:ital,wght@0,300;0,400;0,700;1,400&display=swap');

/* Font Variables */
:root {
  --mv-font-display: 'Cinzel', 'Times New Roman', serif;
  --mv-font-heading: 'Playfair Display', Georgia, serif;
  --mv-font-body: 'Lato', 'Helvetica Neue', sans-serif;
}

/* Font Scale */
.mv-type-display {
  font-family: var(--mv-font-display);
  font-size: clamp(3rem, 6vw, 6rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.0;
}

.mv-type-hero {
  font-family: var(--mv-font-heading);
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 700;
  line-height: 1.1;
}

.mv-type-title {
  font-family: var(--mv-font-heading);
  font-size: clamp(1.8rem, 3vw, 2.8rem);
  font-weight: 600;
  line-height: 1.2;
}

.mv-type-subtitle {
  font-family: var(--mv-font-heading);
  font-size: clamp(1.3rem, 2vw, 1.8rem);
  font-weight: 500;
  line-height: 1.35;
}

.mv-type-body-lg {
  font-family: var(--mv-font-body);
  font-size: 1.1rem;
  font-weight: 400;
  line-height: 1.75;
}

.mv-type-body {
  font-family: var(--mv-font-body);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
}

.mv-type-small {
  font-family: var(--mv-font-body);
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.6;
}

.mv-type-caption {
  font-family: var(--mv-font-display);
  font-size: 0.7rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.4;
}

.mv-type-label {
  font-family: var(--mv-font-display);
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-weight: 600;
}

/* Editorial Typography */
.mv-drop-cap::first-letter {
  float: left;
  font-family: var(--mv-font-display);
  font-size: 4.5rem;
  line-height: 0.8;
  padding-right: 12px;
  padding-top: 8px;
  color: var(--mv-gold);
  font-weight: 700;
}

.mv-lead-text {
  font-family: var(--mv-font-heading);
  font-size: 1.2rem;
  font-style: italic;
  color: var(--mv-text-primary);
  line-height: 1.75;
  margin-bottom: 28px;
}

/* Callout Quote */
.mv-pull-quote {
  font-family: var(--mv-font-heading);
  font-size: 1.5rem;
  font-style: italic;
  color: var(--mv-gold-light);
  line-height: 1.5;
  padding: 28px 0;
  text-align: center;
  border-top: 1px solid var(--mv-border);
  border-bottom: 1px solid var(--mv-border);
  margin: 36px 0;
}

/* Navigation Typography */
.mv-nav-label {
  font-family: var(--mv-font-display);
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-weight: 600;
}

/* Footer Typography */
.mv-footer-brand {
  font-family: var(--mv-font-display);
  font-size: 1.2rem;
  letter-spacing: 0.1em;
  font-weight: 600;
}

/* Utility: Font Families */
.mv-font-display { font-family: var(--mv-font-display); }
.mv-font-heading { font-family: var(--mv-font-heading); }
.mv-font-body { font-family: var(--mv-font-body); }

/* Utility: Weights */
.mv-fw-300 { font-weight: 300; }
.mv-fw-400 { font-weight: 400; }
.mv-fw-500 { font-weight: 500; }
.mv-fw-600 { font-weight: 600; }
.mv-fw-700 { font-weight: 700; }

/* Utility: Sizes */
.mv-fs-xs  { font-size: 0.7rem; }
.mv-fs-sm  { font-size: 0.85rem; }
.mv-fs-md  { font-size: 1rem; }
.mv-fs-lg  { font-size: 1.15rem; }
.mv-fs-xl  { font-size: 1.35rem; }
.mv-fs-2xl { font-size: 1.6rem; }
.mv-fs-3xl { font-size: 2rem; }

/* Utility: Line Heights */
.mv-lh-tight  { line-height: 1.2; }
.mv-lh-normal { line-height: 1.6; }
.mv-lh-relaxed{ line-height: 1.8; }
.mv-lh-loose  { line-height: 2.0; }

/* Letter Spacing */
.mv-ls-wide   { letter-spacing: 0.08em; }
.mv-ls-wider  { letter-spacing: 0.15em; }
.mv-ls-widest { letter-spacing: 0.25em; }

/* Article Typography */
.mv-article-body {
  font-family: var(--mv-font-body);
  font-size: 1.05rem;
  line-height: 1.85;
  color: var(--mv-text-muted);
}

.mv-article-body > p:first-of-type {
  font-size: 1.15rem;
  color: var(--mv-text-primary);
}

/* Responsive Font Overrides */
@media (max-width: 640px) {
  .mv-type-display { font-size: 2.5rem; }
  .mv-type-hero { font-size: 2.2rem; }
  .mv-type-title { font-size: 1.6rem; }
  .mv-pull-quote { font-size: 1.2rem; }
}