/* ==========================================================================
HoverForge Typography
Optimized Google Fonts loading with font-display: swap
========================================================================== */
/* Space Grotesk - Headings */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');
/* Inter - Body Text */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');
/* JetBrains Mono - Code (loaded conditionally) */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap');
/* ==========================================================================
FONT LOADING OPTIMIZATIONS
========================================================================== */
/* Preload critical fonts */
/* Add to in functions.php:
*/
/* ==========================================================================
FONT STACK DECLARATIONS
========================================================================== */
.hf-font-heading {
font-family: var(--hf-font-heading);
}
.hf-font-body {
font-family: var(--hf-font-body);
}
.hf-font-mono {
font-family: var(--hf-font-mono);
}
/* ==========================================================================
TYPOGRAPHY UTILITIES
========================================================================== */
/* Font Sizes */
.hf-text-xs { font-size: var(--hf-text-xs); }
.hf-text-sm { font-size: var(--hf-text-sm); }
.hf-text-base { font-size: var(--hf-text-base); }
.hf-text-lg { font-size: var(--hf-text-lg); }
.hf-text-xl { font-size: var(--hf-text-xl); }
.hf-text-2xl { font-size: var(--hf-text-2xl); }
.hf-text-3xl { font-size: var(--hf-text-3xl); }
.hf-text-4xl { font-size: var(--hf-text-4xl); }
/* Font Weights */
.hf-font-light { font-weight: var(--hf-font-light); }
.hf-font-regular { font-weight: var(--hf-font-regular); }
.hf-font-medium { font-weight: var(--hf-font-medium); }
.hf-font-semibold { font-weight: var(--hf-font-semibold); }
.hf-font-bold { font-weight: var(--hf-font-bold); }
/* Line Heights */
.hf-leading-tight { line-height: var(--hf-leading-tight); }
.hf-leading-normal { line-height: var(--hf-leading-normal); }
.hf-leading-relaxed { line-height: var(--hf-leading-relaxed); }
.hf-leading-loose { line-height: var(--hf-leading-loose); }
/* Letter Spacing */
.hf-tracking-tight { letter-spacing: var(--hf-tracking-tight); }
.hf-tracking-normal { letter-spacing: var(--hf-tracking-normal); }
.hf-tracking-wide { letter-spacing: var(--hf-tracking-wide); }
/* ==========================================================================
READING OPTIMIZATION
========================================================================== */
/* Optimal line length for readability */
.hf-measure {
max-width: var(--hf-measure-normal);
}
.hf-measure-narrow {
max-width: var(--hf-measure-narrow);
}
.hf-measure-wide {
max-width: var(--hf-measure-wide);
}
/* Text balancing for headlines */
.hf-text-balance {
text-wrap: balance;
}
/* Hyphenation for justified text */
.hf-text-hyphenate {
hyphens: auto;
hyphenate-limit-chars: 6 3 3;
hyphenate-limit-lines: 2;
hyphenate-limit-last: always;
hyphenate-limit-zone: 8%;
}