/* ============================================================
   Tulum Fashions — Typography 2026
   Phase 3a · branch: redesign-2026-q2
   Display: Cormorant Garamond (300/400/500/600/700)
   Body:    Inter Variable (100..900)
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500;600;700&family=Inter:wght@100..900&display=swap');

/* ============ Fluid type (clamp-based) ============
   Sizes scale fluidly between mobile and desktop endpoints.
   Endpoints from style guide §2 (responsive scaling rules).
   ============================================================ */

h1, .h1 {
  font-family: var(--font-display);
  font-weight: var(--fw-regular);
  font-size: clamp(3.5rem, 6vw + 1rem, 6rem);   /* 56px → 96px */
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
}

h2, .h2 {
  font-family: var(--font-display);
  font-weight: var(--fw-regular);
  font-size: clamp(2rem, 3.5vw + 0.5rem, 3rem); /* 32px → 48px */
  line-height: var(--lh-snug);
  letter-spacing: -0.015em;
}

h3, .h3 {
  font-family: var(--font-display);
  font-weight: var(--fw-medium);
  font-size: clamp(1.5rem, 2vw + 0.5rem, 2rem); /* 24px → 32px */
  line-height: 1.25;
  letter-spacing: -0.01em;
}

h4, .h4 {
  font-family: var(--font-display);
  font-weight: var(--fw-medium);
  font-size: clamp(1.25rem, 1.2vw + 0.5rem, 1.5rem); /* 20px → 24px */
  line-height: 1.3;
  letter-spacing: 0;
}

p {
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  font-size: var(--text-base);
  line-height: var(--lh-base);
  letter-spacing: 0;
}

small {
  font-size: var(--text-base-sm);
  line-height: 1.55;
}

a {
  color: inherit;
  text-decoration: none;
  transition: color var(--transition-base);
}

a:hover {
  color: var(--color-primary);
}

button {
  font-family: var(--font-body);
}

/* Tabular numbers for spec tables (MOQs, lead times, prices) */
.tnum,
table td,
table th {
  font-variant-numeric: tabular-nums;
}

/* iOS zoom prevention on inputs (16px floor) */
input,
select,
textarea {
  font-family: var(--font-body);
  font-size: 16px;
}
