/* ============================================
   ZUNQERIX — Typography
   zq-typography.css
   ============================================ */

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

/* ── Display Scale ── */
.zq-display-xl {
  font-family: var(--zq-font-display);
  font-size: clamp(3.5rem, 8vw, 7rem);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.02em;
}

.zq-display-lg {
  font-family: var(--zq-font-display);
  font-size: clamp(2.5rem, 5vw, 4.5rem);
  font-weight: 600;
  line-height: 1.05;
}

.zq-display-md {
  font-family: var(--zq-font-display);
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 600;
  line-height: 1.15;
}

.zq-display-sm {
  font-family: var(--zq-font-display);
  font-size: clamp(1.5rem, 2.5vw, 2rem);
  font-weight: 600;
  line-height: 1.25;
}

/* ── Body Text Scale ── */
.zq-text-xl {
  font-size: 1.2rem;
  line-height: 1.7;
}

.zq-text-lg {
  font-size: 1.05rem;
  line-height: 1.75;
}

.zq-text-base {
  font-size: 0.97rem;
  line-height: 1.7;
}

.zq-text-sm {
  font-size: 0.88rem;
  line-height: 1.65;
}

.zq-text-xs {
  font-size: 0.78rem;
  line-height: 1.6;
}

/* ── Mono ── */
.zq-mono {
  font-family: var(--zq-font-mono);
}

.zq-mono-label {
  font-family: var(--zq-font-mono);
  font-size: 0.72rem;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: var(--zq-gold);
}

/* ── Special text treatments ── */
.zq-italic-serif {
  font-family: var(--zq-font-display);
  font-style: italic;
  font-weight: 400;
}

.zq-text-balance {
  text-wrap: balance;
}

/* ── Drop cap for articles ── */
.zq-drop-cap::first-letter {
  font-family: var(--zq-font-display);
  font-size: 4.5rem;
  font-weight: 700;
  float: left;
  line-height: 0.8;
  margin-right: 12px;
  margin-top: 8px;
  color: var(--zq-gold);
}

/* ── Lead paragraph ── */
.zq-lead-para {
  font-size: 1.15rem;
  font-weight: 300;
  color: var(--zq-grey-light);
  line-height: 1.8;
  border-left: 2px solid var(--zq-gold);
  padding-left: 20px;
  margin-bottom: 2em;
}

/* ── Inline code ── */
.zq-code-inline {
  font-family: var(--zq-font-mono);
  font-size: 0.88em;
  background: rgba(201,168,76,0.08);
  color: var(--zq-gold-light);
  padding: 2px 7px;
  border-radius: 3px;
  border: 1px solid rgba(201,168,76,0.12);
}

/* ── Highlight text ── */
.zq-highlight {
  background: linear-gradient(transparent 60%, rgba(201,168,76,0.2) 60%);
  padding: 0 2px;
}

/* ── Article typography ── */
.zq-article-full-content {
  font-family: var(--zq-font-body);
}

.zq-article-full-content > p:first-of-type {
  font-size: 1.15rem;
  font-weight: 300;
  color: var(--zq-grey-light);
  line-height: 1.85;
  border-left: 2px solid var(--zq-gold);
  padding-left: 20px;
  margin-bottom: 2em;
}

/* ── Section numbers ── */
.zq-section-number {
  font-family: var(--zq-font-display);
  font-size: 6rem;
  font-weight: 700;
  color: rgba(201,168,76,0.08);
  line-height: 1;
  pointer-events: none;
  user-select: none;
  position: absolute;
}