/* ============================================
   UNIFIED TYPOGRAPHY SYSTEM - SINGLE SOURCE OF TRUTH
   ============================================
   ALL fonts and font sizes are defined here for consistency across the entire application
   DO NOT define fonts or font sizes in other CSS files - use the variables and classes from this file
   ============================================ */

/* ============================================
   FONT FAMILY DEFINITIONS - Single source
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700;900&display=swap');

:root {
    /* PRIMARY FONT FAMILY - Used throughout the entire application */
    --font-family-primary: 'Rubik', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --font-family-arabic: 'Rubik', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --font-family-monospace: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    
    /* ============================================
       FONT SIZES - Single source for all sizes
       ============================================ */
    --font-size-xs: 0.75rem;      /* 12px - Small labels, captions, badges */
    --font-size-sm: 0.875rem;     /* 14px - Small text, secondary info, form labels */
    --font-size-base: 1rem;        /* 16px - Body text, default text, paragraphs */
    --font-size-lg: 1.125rem;      /* 18px - Large body text, emphasized paragraphs */
    --font-size-xl: 1.25rem;       /* 20px - Subheadings, card titles (mobile) */
    --font-size-2xl: 1.5rem;       /* 24px - Section titles, card titles (desktop) */
    --font-size-3xl: 1.875rem;     /* 30px - Page headings, large section titles */
    --font-size-4xl: 2.25rem;      /* 36px - Large headings, hero subheadings */
    --font-size-5xl: 3rem;         /* 48px - Hero headings (mobile) */
    --font-size-6xl: 3.75rem;      /* 60px - Hero headings (desktop) */
    --font-size-7xl: 4.5rem;       /* 72px - Extra large hero headings */
    --font-size-8xl: 6rem;         /* 96px - Maximum hero headings */
    
    /* ============================================
       FONT WEIGHTS - Single source for all weights
       ============================================ */
    --font-weight-light: 300;
    --font-weight-normal: 400;     /* Regular text, body content */
    --font-weight-medium: 500;     /* Navigation links, medium emphasis */
    --font-weight-semibold: 600;   /* Subheadings, labels */
    --font-weight-bold: 700;       /* Headings, buttons, strong emphasis */
    --font-weight-extrabold: 800;
    --font-weight-black: 900;      /* Hero headings, maximum emphasis */
    
    /* ============================================
       LINE HEIGHTS - Single source for all line heights
       ============================================ */
    --line-height-none: 1;
    --line-height-tight: 1.25;    /* Headings */
    --line-height-snug: 1.375;
    --line-height-normal: 1.5;    /* Body text, paragraphs */
    --line-height-relaxed: 1.625; /* Descriptions, long text */
    --line-height-loose: 2;        /* Very loose spacing */
}

/* ============================================
   GLOBAL FONT APPLICATION - Apply to all elements
   ============================================ */
*,
*::before,
*::after {
    font-family: var(--font-family-primary) !important;
}

[dir="rtl"] *,
[dir="rtl"] *::before,
[dir="rtl"] *::after {
    font-family: var(--font-family-arabic) !important;
}

/* Monospace for code elements */
code,
kbd,
pre,
samp {
    font-family: var(--font-family-monospace) !important;
}

/* ============================================
   HEADINGS - Consistent across all pages
   ============================================ */

/* H1 - Main Page Title / Hero Heading */
h1,
.h1,
.text-h1 {
    font-size: var(--font-size-6xl) !important; /* 60px - desktop hero headline */
    font-weight: var(--font-weight-black) !important; /* 900 */
    line-height: var(--line-height-tight) !important;
    letter-spacing: -0.02em !important;
}

@media (max-width: 768px) {
    h1,
    .h1,
    .text-h1 {
        font-size: var(--font-size-5xl) !important; /* 48px on mobile - impactful hero headline */
        font-weight: var(--font-weight-bold) !important; /* Reduced from 900 to 700 for clarity */
    }
}

/* H2 - Section Headings */
h2,
.h2,
.text-h2 {
    font-size: var(--font-size-4xl) !important; /* 36px */
    font-weight: var(--font-weight-black) !important; /* 900 */
    line-height: var(--line-height-tight) !important;
    letter-spacing: -0.01em !important;
}

@media (max-width: 768px) {
    h2,
    .h2,
    .text-h2 {
        font-size: 30px !important; /* 30px on mobile - consistent across all section headings */
        font-weight: var(--font-weight-bold) !important; /* 700 - bold for section headings */
    }
}

/* H3 - Subsection Headings / Card Titles */
h3,
.h3,
.text-h3 {
    font-size: var(--font-size-2xl) !important; /* 24px */
    font-weight: var(--font-weight-bold) !important; /* 700 */
    line-height: var(--line-height-normal) !important;
}

@media (max-width: 768px) {
    h3,
    .h3,
    .text-h3 {
        font-size: var(--font-size-xl) !important; /* 20px on mobile */
        font-weight: var(--font-weight-semibold) !important; /* Reduced from 700 to 600 for clarity */
    }
}

/* H4 - Small Section Headings */
h4,
.h4,
.text-h4 {
    font-size: var(--font-size-xl) !important; /* 20px */
    font-weight: var(--font-weight-bold) !important; /* 700 */
    line-height: var(--line-height-normal) !important;
}

@media (max-width: 768px) {
    h4,
    .h4,
    .text-h4 {
        font-size: var(--font-size-lg) !important; /* 18px on mobile */
        font-weight: var(--font-weight-semibold) !important; /* Reduced from 700 to 600 for clarity */
    }
}

/* H5 - Small Headings */
h5,
.h5,
.text-h5 {
    font-size: var(--font-size-lg) !important; /* 18px */
    font-weight: var(--font-weight-semibold) !important; /* 600 */
    line-height: var(--line-height-normal) !important;
}

@media (max-width: 768px) {
    h5,
    .h5,
    .text-h5 {
        font-weight: var(--font-weight-medium) !important; /* Reduced from 600 to 500 for clarity */
    }
}

/* H6 - Smallest Headings */
h6,
.h6,
.text-h6 {
    font-size: var(--font-size-base) !important; /* 16px */
    font-weight: var(--font-weight-semibold) !important; /* 600 */
    line-height: var(--line-height-normal) !important;
}

@media (max-width: 768px) {
    h6,
    .h6,
    .text-h6 {
        font-weight: var(--font-weight-medium) !important; /* Reduced from 600 to 500 for clarity */
    }
}

/* ============================================
   BODY TEXT - Consistent across all pages
   ============================================ */

/* Body Text - Default */
body,
p,
.text-body {
    font-size: var(--font-size-base) !important; /* 16px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-relaxed) !important; /* 1.625 */
}

/* Large Body Text */
.text-body-lg {
    font-size: var(--font-size-lg) !important; /* 18px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-relaxed) !important;
}

/* Small Body Text */
.text-body-sm {
    font-size: var(--font-size-sm) !important; /* 14px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-normal) !important;
}

/* ============================================
   DESCRIPTIONS - Consistent across all pages
   ============================================ */

/* Description Text - Used for card descriptions, feature descriptions */
.text-description {
    font-size: var(--font-size-base) !important; /* 16px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-relaxed) !important;
    color: rgb(75 85 99) !important; /* gray-600 */
}

/* Large Description */
.text-description-lg {
    font-size: var(--font-size-lg) !important; /* 18px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-relaxed) !important;
    color: rgb(75 85 99) !important; /* gray-600 */
}

/* Small Description */
.text-description-sm {
    font-size: var(--font-size-sm) !important; /* 14px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-normal) !important;
    color: rgb(107 114 128) !important; /* gray-500 */
}

/* ============================================
   BUTTONS - Consistent across all pages
   ============================================ */

/* Button Text - Primary */
button,
.btn,
.text-button,
input[type="button"],
input[type="submit"],
input[type="reset"],
a[role="button"] {
    font-size: var(--font-size-base) !important; /* 16px */
    font-weight: var(--font-weight-bold) !important; /* 700 */
    line-height: var(--line-height-normal) !important;
    letter-spacing: 0.01em !important;
    font-family: var(--font-family-primary) !important;
}

@media (max-width: 768px) {
    button,
    .btn,
    .text-button,
    input[type="button"],
    input[type="submit"],
    input[type="reset"],
    a[role="button"] {
        font-weight: var(--font-weight-semibold) !important; /* Reduced from 700 to 600 for clarity */
    }
}

/* Large Button Text */
.btn-lg,
.text-button-lg {
    font-size: var(--font-size-lg) !important; /* 18px */
    font-weight: var(--font-weight-bold) !important; /* 700 */
    font-family: var(--font-family-primary) !important;
}

@media (max-width: 768px) {
    .btn-lg,
    .text-button-lg {
        font-weight: var(--font-weight-semibold) !important; /* Reduced from 700 to 600 for clarity */
    }
}

/* Small Button Text */
.btn-sm,
.text-button-sm {
    font-size: var(--font-size-sm) !important; /* 14px */
    font-weight: var(--font-weight-semibold) !important; /* 600 */
    font-family: var(--font-family-primary) !important;
}

@media (max-width: 768px) {
    .btn-sm,
    .text-button-sm {
        font-weight: var(--font-weight-medium) !important; /* Reduced from 600 to 500 for clarity */
    }
}

/* ============================================
   LABELS & CAPTIONS - Consistent across all pages
   ============================================ */

/* Label Text */
label,
.text-label {
    font-size: var(--font-size-sm) !important; /* 14px */
    font-weight: var(--font-weight-semibold) !important; /* 600 */
    line-height: var(--line-height-normal) !important;
}

/* Caption Text */
.text-caption {
    font-size: var(--font-size-xs) !important; /* 12px */
    font-weight: var(--font-weight-normal) !important; /* 400 */
    line-height: var(--line-height-normal) !important;
}

/* ============================================
   NAVIGATION - Consistent across all pages
   ============================================ */

/* Navigation Links */
nav a,
.nav-link,
.text-nav {
    font-size: var(--font-size-base) !important; /* 16px */
    font-weight: var(--font-weight-medium) !important; /* 500 */
    line-height: var(--line-height-normal) !important;
}

/* ============================================
   OVERRIDE INCONSISTENT TAILWIND CLASSES
   ============================================ */

/* Ensure consistent font sizes for commonly used Tailwind classes */
.text-xs {
    font-size: var(--font-size-xs) !important;
}

.text-sm {
    font-size: var(--font-size-sm) !important;
}

.text-base {
    font-size: var(--font-size-base) !important;
}

.text-lg {
    font-size: var(--font-size-lg) !important;
}

.text-xl {
    font-size: var(--font-size-xl) !important;
}

.text-2xl {
    font-size: var(--font-size-2xl) !important;
}

.text-3xl {
    font-size: var(--font-size-3xl) !important;
}

.text-4xl {
    font-size: var(--font-size-4xl) !important;
}

.text-5xl {
    font-size: var(--font-size-5xl) !important;
}

.text-6xl {
    font-size: var(--font-size-6xl) !important;
}

/* Ensure consistent font weights */
.font-normal {
    font-weight: var(--font-weight-normal) !important;
}

.font-medium {
    font-weight: var(--font-weight-medium) !important;
}

.font-semibold {
    font-weight: var(--font-weight-semibold) !important;
}

.font-bold {
    font-weight: var(--font-weight-bold) !important;
}

.font-black {
    font-weight: var(--font-weight-black) !important;
}

/* ============================================
   MOBILE FONT WEIGHT REDUCTIONS - Fix Blurry Text
   ============================================ */

@media (max-width: 768px) {
    /* Reduce font weights on mobile for better clarity and readability */
    
    /* Reduce black (900) to bold (700) */
    .font-black,
    [class*="font-black"],
    h1.font-black,
    h2.font-black {
        font-weight: var(--font-weight-bold) !important; /* 700 instead of 900 */
    }
    
    /* Reduce bold (700) to semibold (600) */
    .font-bold,
    [class*="font-bold"],
    h3.font-bold,
    h4.font-bold,
    button.font-bold,
    .btn.font-bold {
        font-weight: var(--font-weight-semibold) !important; /* 600 instead of 700 */
    }
    
    /* Reduce semibold (600) to medium (500) */
    .font-semibold,
    [class*="font-semibold"],
    h5.font-semibold,
    h6.font-semibold {
        font-weight: var(--font-weight-medium) !important; /* 500 instead of 600 */
    }
    
    /* Ensure all text elements use consistent, lighter weights on mobile */
    * {
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale !important;
        text-rendering: optimizeLegibility !important;
    }
}

/* ============================================
   COMPREHENSIVE ELEMENT OVERRIDES - Ensure Consistency
   ============================================ */

/* All paragraphs must use the same font size and weight */
p,
p *,
.paragraph,
.text-paragraph {
    font-size: var(--font-size-base) !important; /* 16px - consistent */
    font-weight: var(--font-weight-normal) !important; /* 400 - consistent */
    line-height: var(--line-height-relaxed) !important; /* 1.625 - consistent */
    font-family: var(--font-family-primary) !important;
}

/* Override any paragraph with different styling */
p[class*="font-bold"],
p[class*="font-semibold"],
p[class*="font-black"],
p[class*="text-"],
p.text-lg,
p.text-xl,
p.text-2xl,
p.text-3xl {
    font-size: var(--font-size-base) !important; /* Force consistent size */
    font-weight: var(--font-weight-normal) !important; /* Force consistent weight */
}

/* Titles - consistent styling */
.title,
.text-title,
[class*="title"] {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all headings use consistent font family */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all buttons use consistent font family */
button, .btn, input[type="button"], input[type="submit"], input[type="reset"] {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all links use consistent font family */
a {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all spans use consistent font family */
span {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all divs use consistent font family */
div {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all labels use consistent font family */
label {
    font-family: var(--font-family-primary) !important;
}

/* Ensure all inputs use consistent font family */
input, textarea, select {
    font-family: var(--font-family-primary) !important;
}

/* Override any inline styles or conflicting classes */
[style*="font-family"],
[style*="font-weight"],
[style*="font-size"] {
    font-family: var(--font-family-primary) !important;
}

/* ============================================
   TILE TITLES - UNIFIED SIZES (H3 elements in tiles)
   ============================================ */

/* All H3 elements in tiles/cards must use the same size */
h3,
.h3,
.text-h3,
[class*="tile"] h3,
[class*="card"] h3,
[class*="service"] h3,
[class*="feature"] h3,
div[data-uid*="Wsd2StElkyqZVDeQ"] h3,
div[data-uid*="Wsd2StElkyqZVDeQ"] > h3,
a[href*="Service"] h3,
div[class*="flex"][class*="h-\\[240px\\]"] h3,
.grid h3,
.grid > * h3,
.grid > a h3,
.grid > div h3 {
    font-size: var(--font-size-2xl) !important; /* 24px - consistent for all tile titles */
    font-weight: var(--font-weight-bold) !important; /* 700 - consistent weight */
    line-height: var(--line-height-normal) !important; /* 1.5 - consistent line height */
    font-family: var(--font-family-primary) !important;
    min-font-size: 1.5rem !important; /* Minimum 24px */
}

@media (max-width: 768px) {
    h3,
    .h3,
    .text-h3,
    [class*="tile"] h3,
    [class*="card"] h3,
    [class*="service"] h3,
    [class*="feature"] h3,
    div[data-uid*="Wsd2StElkyqZVDeQ"] h3,
    div[data-uid*="Wsd2StElkyqZVDeQ"] > h3,
    a[href*="Service"] h3,
    div[class*="flex"][class*="h-\\[240px\\]"] h3,
    .grid h3,
    .grid > * h3,
    .grid > a h3,
    .grid > div h3 {
        font-size: var(--font-size-xl) !important; /* 20px on mobile - consistent */
        font-weight: var(--font-weight-semibold) !important; /* 600 on mobile for clarity */
        min-font-size: 1.25rem !important; /* Minimum 20px on mobile */
    }
}

/* ============================================
   TILE DESCRIPTIONS - UNIFIED SIZES (Paragraphs in tiles)
   ============================================ */

/* All paragraph/description text in tiles must use the same size */
p,
[class*="tile"] p,
[class*="card"] p,
[class*="service"] p,
[class*="feature"] p,
[class*="description"] p,
div[data-uid*="Wsd2StElkyqZVDeQ"] p,
div[data-uid*="Wsd2StElkyqZVDeQ"] > p,
a[href*="Service"] p,
div[class*="flex"][class*="h-\\[240px\\]"] p,
.grid p,
.grid > * p,
.grid > a p,
.grid > div p,
[data-uid*="6CqieJwemX85PNSZ"],
[data-uid*="cDgnoLUba7g6Sfio"] {
    font-size: var(--font-size-base) !important; /* 16px - consistent for all descriptions */
    font-weight: var(--font-weight-normal) !important; /* 400 - consistent weight */
    line-height: var(--line-height-relaxed) !important; /* 1.625 - consistent line height */
    font-family: var(--font-family-primary) !important;
    min-font-size: 1rem !important; /* Minimum 16px */
}

@media (max-width: 768px) {
    p,
    [class*="tile"] p,
    [class*="card"] p,
    [class*="service"] p,
    [class*="feature"] p,
    [class*="description"] p,
    div[data-uid*="Wsd2StElkyqZVDeQ"] p,
    div[data-uid*="Wsd2StElkyqZVDeQ"] > p,
    a[href*="Service"] p,
    div[class*="flex"][class*="h-\\[240px\\]"] p,
    .grid p,
    .grid > * p,
    .grid > a p,
    .grid > div p,
    [data-uid*="6CqieJwemX85PNSZ"],
    [data-uid*="cDgnoLUba7g6Sfio"] {
        font-size: var(--font-size-sm) !important; /* 14px on mobile - consistent */
        font-weight: var(--font-weight-normal) !important; /* 400 - normal weight */
        min-font-size: 0.875rem !important; /* Minimum 14px on mobile */
    }
}

/* ============================================
   OVERRIDE ALL TAILWIND TEXT SIZE CLASSES IN TILES
   ============================================ */

/* Force consistent sizes in tiles regardless of Tailwind classes */
.grid .text-xs,
.grid .text-sm,
.grid .text-base,
.grid .text-lg,
.grid .text-xl,
.grid .text-2xl,
.grid .text-3xl,
.grid > * .text-xs,
.grid > * .text-sm,
.grid > * .text-base,
.grid > * .text-lg,
.grid > * .text-xl,
.grid > * .text-2xl,
.grid > * .text-3xl {
    font-family: var(--font-family-primary) !important;
}

/* Titles in tiles - force to h3 size */
.grid h3.text-xs,
.grid h3.text-sm,
.grid h3.text-base,
.grid h3.text-lg,
.grid h3.text-xl,
.grid h3.text-2xl,
.grid h3.text-3xl,
.grid > * h3.text-xs,
.grid > * h3.text-sm,
.grid > * h3.text-base,
.grid > * h3.text-lg,
.grid > * h3.text-xl,
.grid > * h3.text-2xl,
.grid > * h3.text-3xl {
    font-size: var(--font-size-2xl) !important; /* Force 24px */
    font-weight: var(--font-weight-bold) !important; /* Force 700 */
}

@media (max-width: 768px) {
    .grid h3.text-xs,
    .grid h3.text-sm,
    .grid h3.text-base,
    .grid h3.text-lg,
    .grid h3.text-xl,
    .grid h3.text-2xl,
    .grid h3.text-3xl,
    .grid > * h3.text-xs,
    .grid > * h3.text-sm,
    .grid > * h3.text-base,
    .grid > * h3.text-lg,
    .grid > * h3.text-xl,
    .grid > * h3.text-2xl,
    .grid > * h3.text-3xl {
        font-size: var(--font-size-xl) !important; /* Force 20px on mobile */
        font-weight: var(--font-weight-semibold) !important; /* Force 600 on mobile */
    }
}

/* Descriptions in tiles - force to paragraph size */
.grid p.text-xs,
.grid p.text-sm,
.grid p.text-base,
.grid p.text-lg,
.grid p.text-xl,
.grid p.text-2xl,
.grid > * p.text-xs,
.grid > * p.text-sm,
.grid > * p.text-base,
.grid > * p.text-lg,
.grid > * p.text-xl,
.grid > * p.text-2xl {
    font-size: var(--font-size-base) !important; /* Force 16px */
    font-weight: var(--font-weight-normal) !important; /* Force 400 */
}

@media (max-width: 768px) {
    .grid p.text-xs,
    .grid p.text-sm,
    .grid p.text-base,
    .grid p.text-lg,
    .grid p.text-xl,
    .grid p.text-2xl,
    .grid > * p.text-xs,
    .grid > * p.text-sm,
    .grid > * p.text-base,
    .grid > * p.text-lg,
    .grid > * p.text-xl,
    .grid > * p.text-2xl {
        font-size: var(--font-size-sm) !important; /* Force 14px on mobile */
        font-weight: var(--font-weight-normal) !important; /* Force 400 */
    }
}

/* ============================================
   MINIMUM FONT SIZE ENFORCEMENT
   ============================================ */

/* Ensure minimum readable font sizes */
* {
    min-font-size: 0.75rem !important; /* Minimum 12px globally */
}

h1, h2, h3, h4, h5, h6 {
    min-font-size: 1rem !important; /* Minimum 16px for headings */
}

p, span, div, a, button, label {
    min-font-size: 0.875rem !important; /* Minimum 14px for body text */
}

@media (max-width: 768px) {
    h1, h2 {
        min-font-size: 1.5rem !important; /* Minimum 24px for main headings on mobile */
    }
    
    h3, h4 {
        min-font-size: 1.25rem !important; /* Minimum 20px for subheadings on mobile */
    }
    
    p, span, div, a, button, label {
        min-font-size: 0.75rem !important; /* Minimum 12px for body text on mobile */
    }
}

/* ============================================
   DESKTOP TILE TYPOGRAPHY - Unified Sizes
   ============================================ */

@media (min-width: 1024px) {
    /* All H3 titles in tiles on desktop - unified size */
    .grid h3,
    .grid > * h3,
    .grid > a h3,
    .grid > div h3,
    div[data-uid*="Wsd2StElkyqZVDeQ"] h3,
    a[href*="Service"] h3 {
        font-size: var(--font-size-2xl) !important; /* 24px - consistent for all tile titles on desktop */
        font-weight: var(--font-weight-bold) !important; /* 700 - consistent weight */
        line-height: var(--line-height-normal) !important;
        font-family: var(--font-family-primary) !important;
    }
    
    /* All paragraph descriptions in tiles on desktop - unified size */
    .grid p,
    .grid > * p,
    .grid > a p,
    .grid > div p,
    div[data-uid*="Wsd2StElkyqZVDeQ"] p,
    a[href*="Service"] p,
    [data-uid*="6CqieJwemX85PNSZ"],
    [data-uid*="cDgnoLUba7g6Sfio"] {
        font-size: var(--font-size-base) !important; /* 16px - consistent for all descriptions on desktop */
        font-weight: var(--font-weight-normal) !important; /* 400 - consistent weight */
        line-height: var(--line-height-relaxed) !important;
        font-family: var(--font-family-primary) !important;
    }
}

/* ============================================
   GLOBAL FONT QUALITY IMPROVEMENTS
   ============================================ */

/* Improve font rendering quality globally */
* {
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-rendering: optimizeLegibility !important;
}

/* Ensure consistent font rendering across all browsers */
body,
html {
    font-synthesis: none !important;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}