/* Standalone Typography System v1
   Source of truth: homepage typography
   Scope: font family, font size, font weight, line height, letter spacing only
*/

:root {
  --oc-font-sans: 'Outfit', Arial, sans-serif;
  --oc-font-serif: 'Lora', Georgia, serif;
}

/* Base text */
body {
  font-family: var(--oc-font-sans) !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Display headings */
h1,
.about-hero-h1,
.hero-title,
.hero h1 {
  font-family: var(--oc-font-serif) !important;
  font-size: clamp(34px, 4.5vw, 56px) !important;
  font-weight: 600 !important;
  line-height: 1.06 !important;
  letter-spacing: 0 !important;
}

/* Section headings */
h2,
.section-h2,
.section-title,
.hero-card h2 {
  font-family: var(--oc-font-serif) !important;
  font-size: clamp(28px, 3vw, 40px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

/* Subtitles / body copy */
p,
li,
.section-lead,
.editorial-body,
.card p,
.value-item p,
.promise-item p {
  font-family: var(--oc-font-sans) !important;
  font-weight: 400;
  line-height: 1.75;
}

/* Eyebrow, nav, buttons, CTA */
nav a,
.nav-links a,
.nav-login,
.nav-cta,
.btn-primary,
.btn-ghost,
.btn-dark,
button,
.button,
.section-label,
.about-hero-eyebrow,
.hero-proof-line {
  font-family: var(--oc-font-sans) !important;
  font-weight: 700;
  letter-spacing: 2px;
}

/* Smaller UI text */
.footer-col a,
.footer-copy,
.footer-legal a,
.story-video-note {
  font-family: var(--oc-font-sans) !important;
}


/* --- Intentional override: Private Label hero card should stay UI-style (Outfit) --- */
.hero-card h2 {
  font-family: var(--oc-font-sans) !important;
}


/* --- Customs Clearance page refinement --- */
body.customs-clearance-page h1,
.customs-clearance h1,
.customs-clearance-page .hero h1 {
  font-family: var(--oc-font-serif) !important;
  font-size: clamp(34px, 4.5vw, 56px) !important;
  font-weight: 600 !important;
  line-height: 1.06 !important;
  letter-spacing: 0 !important;
}

body.customs-clearance-page h2,
.customs-clearance h2,
.customs-clearance-page .title,
.customs-clearance .title,
.customs-clearance-page .trust-card h2,
.customs-clearance .trust-card h2 {
  font-family: var(--oc-font-serif) !important;
  font-size: clamp(28px, 3vw, 40px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
}

body.customs-clearance-page p,
.customs-clearance p,
.customs-clearance-page li,
.customs-clearance li {
  font-family: var(--oc-font-sans) !important;
  line-height: 1.75 !important;
}